Browse Source

fix: better mdx loader, frontmatter, clean up

fix/enable-imgix
Thomas Osmonson 4 years ago
committed by Thomas Osmonson
parent
commit
223d24230a
  1. 55
      lib/mdx-frontmatter-loader.js
  2. 3
      next.config.js
  3. 6
      src/common/data/mdx.ts
  4. 11
      src/common/navigation.yaml
  5. 2
      src/common/routes/get-routes.js
  6. 6
      src/components/clarity-ref.tsx
  7. 17
      src/components/cli-reference.tsx
  8. 8
      src/components/faq.tsx
  9. 8
      src/components/glossary.tsx
  10. 3
      src/components/header.tsx
  11. 242
      src/components/mdx/md-contents.tsx
  12. 7
      src/components/mdx/mdx-components.tsx
  13. 124
      src/components/mdx/overrides.tsx
  14. 117
      src/components/mdx/styles.tsx
  15. 24
      src/components/toc.tsx
  16. 3
      src/pages/_app.tsx
  17. 5
      yarn.lock

55
lib/mdx-frontmatter-loader.js

@ -0,0 +1,55 @@
const fm = require('gray-matter');
const remark = require('remark');
const strip = require('strip-markdown');
const readingTime = require('reading-time');
const getReadingTime = mdxContent => readingTime(mdxContent);
const getHeadings = mdxContent => {
const regex = /\n(#+)(.*)/gm;
const found = mdxContent.match(regex);
const getLevel = string => string.split('#');
const headings =
found && found.length
? found.map(f => {
const md = f.split('# ')[1];
let content = md;
remark()
.use(strip)
.process(md, (err, file) => {
if (err) throw err;
content = file.contents.toString().trim();
});
const level = getLevel(f).length;
return { content, level };
})
: [];
return headings;
};
// @see https://github.com/expo/expo/blob/master/docs/common/md-loader.js
async function mdxFrontmatterLoader(src) {
const callback = this.async();
const { content, data } = fm(src);
const headings = getHeadings(content);
const duration = getReadingTime(content).text;
const code =
`import { MDWrapper } from '@components/layouts/markdown-wrapper';
export default function Layout({ children, ...props }){
return (
<MDWrapper frontmatter={${JSON.stringify({
duration,
...data,
headings,
})}} {...props}>
{children}
</MDWrapper>
)
}
` + content;
return callback(null, code);
}
module.exports = mdxFrontmatterLoader;

3
next.config.js

@ -309,12 +309,13 @@ module.exports = withFonts(
use: [
options.defaultLoaders.babel,
{
loader: './lib/mdx-loader',
loader: '@mdx-js/loader',
options: {
remarkPlugins,
rehypePlugins,
},
},
path.join(__dirname, './lib/mdx-frontmatter-loader'),
],
});

6
src/common/data/mdx.ts

@ -1,4 +1,4 @@
import { MDXComponents } from '@components/mdx/mdx-components';
import { Components } from '@components/mdx/mdx-components';
import renderToString from 'next-mdx-remote/render-to-string';
const { remarkPlugins } = require('../../../lib/remark-plugins');
const { rehypePlugins } = require('../../../lib/rehype-plugins');
@ -7,8 +7,8 @@ export const wrapValueInTicks = value => '`' + value.replace('`', '').replace('`
export const convertRemoteDataToMDX = async (arr: any[], key: string) =>
Promise.all(
arr.map(entry => renderToString(entry[key], MDXComponents, { remarkPlugins, rehypePlugins }))
arr.map(entry => renderToString(entry[key], Components, { remarkPlugins, rehypePlugins }))
);
export const renderMdx = async (content: string) =>
renderToString(content, MDXComponents, { remarkPlugins, rehypePlugins });
renderToString(content, Components, { remarkPlugins, rehypePlugins });

11
src/common/navigation.yaml

@ -95,10 +95,19 @@ sections:
- path: /references
usePageTitles: true
pages:
- path: /clarity-language
- path: /blockstack-cli
- path: /clarity-language
- path: /stacks-blockchain
- path: /stacks-rpc-api
- external:
href: 'https://blockstack.github.io/blockstack.js/'
title: blockstack.js
- external:
href: 'https://blockstack.github.io/blockstack-android/'
title: Android SDK
- external:
href: 'https://blockstack.github.io/blockstack-ios/'
title: iOS SDK
- external:
href: 'https://blockstack.zendesk.com/hc/en-us'
title: FAQs

2
src/common/routes/get-routes.js

@ -58,7 +58,7 @@ const getHeadings = mdContent => {
const found = mdContent.match(regex);
return found && found.length
? found.map(f => f && f.split('# ')[1]).filter(f => typeof f !== 'undefined')
: undefined;
: null;
};
const routes = allRoutes.map(route => {

6
src/components/clarity-ref.tsx

@ -1,5 +1,5 @@
import React from 'react';
import { MDXComponents } from '@components/mdx/mdx-components';
import { Components } from '@components/mdx/mdx-components';
import { TableOfContents } from '@components/toc';
import hydrate from 'next-mdx-remote/hydrate';
import { space } from '@blockstack/ui';
@ -8,7 +8,7 @@ export const ClarityKeywordReference = ({ content, headings }) => {
return (
<>
<TableOfContents mb={space('extra-loose')} label="Contents" headings={headings} />
{hydrate(content, { ...MDXComponents, wrapper: undefined })}
{hydrate(content, Components)}
</>
);
};
@ -20,6 +20,6 @@ export const ClarityFunctionReference = ({ content, headings }) => (
label="Contents"
headings={headings}
/>
{hydrate(content, { ...MDXComponents, wrapper: undefined })}
{hydrate(content, Components)}
</>
);

17
src/components/cli-reference.tsx

@ -1,6 +1,6 @@
import React from 'react';
import { cliReferenceData } from '@common/../_data/cliRef';
import { MDXComponents } from '@components/mdx/mdx-components';
import { Components } from '@components/mdx/mdx-components';
import { Grid, Box, color } from '@blockstack/ui';
import { border } from '@common/utils';
import hydrate from 'next-mdx-remote/hydrate';
@ -11,27 +11,26 @@ const styles = {
overflowY: 'hidden',
whiteSpace: 'pre',
};
const InlineCode = props => <MDXComponents.inlineCode {...styles} {...props} />;
const InlineCode = props => <Components.inlineCode {...styles} {...props} />;
const ReferenceEntry = ({ entry, usage }) => (
<>
<MDXComponents.h4>{entry.command}</MDXComponents.h4>
<Components.h4>{entry.command}</Components.h4>
<MDXComponents.p>
<Components.p>
<strong>Group:</strong> {entry.group}
</MDXComponents.p>
</Components.p>
{hydrate(usage, {
...MDXComponents,
wrapper: undefined,
...Components,
p: (props: any) => (
<MDXComponents.p
<Components.p
{...props}
style={{ display: 'block', wordBreak: 'break-word', hyphens: 'auto' }}
/>
),
})}
<MDXComponents.h3>Arguments</MDXComponents.h3>
<Components.h3>Arguments</Components.h3>
<Grid
mb="tight"
pb="base-tight"

8
src/components/faq.tsx

@ -1,5 +1,5 @@
import React from 'react';
import { MDXComponents } from '@components/mdx';
import { Components } from '@components/mdx';
import { Box, Flex, ChevronIcon, space, color } from '@blockstack/ui';
import hydrate from 'next-mdx-remote/hydrate';
import { Accordion, AccordionItem, AccordionButton, AccordionPanel } from '@reach/accordion';
@ -43,15 +43,15 @@ const FAQItem = React.memo(({ faq, ...rest }: any) => {
},
})}
>
<MDXComponents.h4 id={id} my="0px !important" color="currentColor">
<Components.h4 id={id} my="0px !important" color="currentColor">
{faq.question}
</MDXComponents.h4>
</Components.h4>
<Box color={color('text-caption')} pl={space('base-loose')}>
<ChevronIcon direction="down" size="22px" />
</Box>
</Flex>
<Box px={space('extra-loose')} pb={space('extra-loose')} as={AccordionPanel}>
{hydrate(faq.answer, { ...MDXComponents, wrapper: undefined })}
{hydrate(faq.answer, Components)}
</Box>
</Box>
);

8
src/components/glossary.tsx

@ -1,7 +1,7 @@
import React from 'react';
import { Box, space } from '@blockstack/ui';
import hydrate from 'next-mdx-remote/hydrate';
import { MDXComponents } from '@components/mdx/mdx-components';
import { Components } from '@components/mdx/mdx-components';
import { slugify } from '@common/utils';
import { css } from '@styled-system/css';
import { TableOfContents } from '@components/toc';
@ -18,9 +18,9 @@ export const Glossary = ({ data }) => {
/>
{data.map(entry => (
<>
<MDXComponents.h3 pl={space('extra-loose')} id={slugify(entry.term)}>
<Components.h3 pl={space('extra-loose')} id={slugify(entry.term)}>
{entry.term}
</MDXComponents.h3>
</Components.h3>
<Box
css={css({
@ -37,7 +37,7 @@ export const Glossary = ({ data }) => {
},
})}
>
{hydrate(entry.definition, { ...MDXComponents, wrapper: undefined })}
{hydrate(entry.definition, Components)}
</Box>
</>
))}

3
src/components/header.tsx

@ -78,8 +78,9 @@ const HeaderTextItem: React.FC<BoxProps & LinkProps> = ({ children, href, as, ..
color={color('invert')}
css={css({
...getCapsizeStyles(16, 26),
...rest,
color: 'currentColor',
...rest,
fontWeight: '400',
':hover': {
cursor: 'pointer',
textDecoration: href ? 'underline' : 'none',

242
src/components/mdx/md-contents.tsx

@ -1,15 +1,238 @@
import React from 'react';
import { Box, space } from '@blockstack/ui';
import { Box, space, themeColor, color } from '@blockstack/ui';
import { ContentWrapper } from '../content-wrapper';
import { TableOfContents } from '@components/toc';
import { css } from '@styled-system/css';
import { TOC_WIDTH } from '@common/constants';
import { styleOverwrites } from '@components/mdx/styles';
import { border } from '@common/utils';
import { useRouter } from 'next/router';
import dynamic from 'next/dynamic';
import { getHeadingStyles } from '@components/mdx/typography';
import { border } from '@common/utils';
import { getCapsizeStyles } from '@components/mdx/typography';
export const styleOverwrites = {
section: {
'&:first-child > h2:first-child': {
mt: 0,
},
'& > *:not(pre):not(ul):not(ol):not(img):not([data-reach-accordion]):not(section):not(hr)': {
px: space(['extra-loose', 'extra-loose', 'none', 'none']),
},
'ul, ol': {
// pr: space('extra-loose'),
px: space(['64px', '64px', 'extra-loose', 'extra-loose']),
// pl: '64px',
'ul, ol': {
pl: space('extra-loose'),
},
},
'*:not(pre) a > code': {
color: color('accent'),
textDecoration: 'inherit',
},
pre: {
// px: space(['none', 'none', 'extra-loose', 'extra-loose']),
},
img: {
mx: 'auto',
},
},
pre: {
display: 'block',
my: space('extra-loose'),
'& > div': {
borderRight: [0, 0, border()],
borderLeft: [0, 0, border()],
borderBottom: border(),
borderTop: border(),
borderRadius: [0, 0, '12px'],
bg: themeColor('ink'),
},
'& > div > code': {
whiteSpace: 'pre',
overflowX: 'auto',
maxWidth: '100%',
'& + h2, & + h3': {
mt: space('extra-loose'),
},
'& + h4, & + h5, & + h6, & + blockquote, & + ul, & + ol': {
mt: 0,
},
boxShadow: 'none',
},
},
p: {
width: '100%',
},
'p, li, a': {
display: 'inline-block',
...getCapsizeStyles(16, 28),
},
li: {
display: 'list-item',
pb: space('base-tight'),
':last-child': {
mb: 0,
pb: 0,
},
'*:last-child:not(pre):not(blockquote)': {
mb: 0,
},
p: {
display: 'inline',
},
'ol, ul': {
mt: space('base-loose'),
},
':before': {
verticalAlign: 'top',
},
':marker': {
verticalAlign: 'top',
},
mb: space('base'),
'p + p': {
mt: space('extra-loose'),
},
'p + p, ul + p, ol + p': {
display: 'inline-block',
mt: space('extra-loose'),
},
},
'p + p, ul + p, ol + p': {
display: 'inline-block',
mt: space('extra-loose'),
},
'li pre': {
'& > div': {
border: border(),
borderRadius: '12px',
},
},
'*:not(pre) code': {
fontFamily: '"Soehne Mono", "Fira Code", monospace',
// ...getCapsizeStyles(14, 24),
// padding: '3px 2px',
},
'pre code': {
fontFamily: '"Soehne Mono", "Fira Code", monospace',
fontSize: '14px',
lineHeight: '24px',
},
h2: {
mt: '64px',
'&, & > *': {
...getHeadingStyles('h2'),
},
'& > code': {
px: space('tight'),
py: space('extra-tight'),
mr: '2px',
fontSize: '22px',
},
'& + section > h3': {
mt: 0,
},
},
h3: {
mt: '64px',
'&, & > *': {
...getHeadingStyles('h3'),
},
'& + section > h4': {
mt: 0,
},
},
h4: {
mt: '64px',
'&, & > *': {
...getHeadingStyles('h4'),
},
'& + section > h5': {
mt: 0,
},
},
h5: {
mt: space('extra-loose'),
'&, & > *': {
...getHeadingStyles('h5'),
},
},
h6: {
mt: space('extra-loose'),
'&, & > *': {
...getHeadingStyles('h6'),
},
},
h1: {
mt: space('extra-loose'),
'&, & > *': {
...getHeadingStyles('h1'),
},
'& + *': {
mt: space('extra-loose'),
},
},
'h1, h2, h3, h4, h5, h6': {
mb: space('extra-loose'),
'& + pre': {
mt: '0',
},
'& + ul, & + ol': {
mt: '0',
},
'& + blockquote': {
mt: '0',
},
},
'ol, ul': {
mb: 0,
mt: space('extra-loose'),
},
blockquote: {
'& + blockquote': {
mt: space('extra-tight'),
},
'& > div > div > *:first-child': {
mt: 0,
},
'& + pre': {
mt: '0',
},
'& + h3, & + h4': {
mt: space('extra-loose'),
},
},
img: {
my: space('extra-loose'),
},
table: {
'*': {
fontSize: '14px',
lineHeight: '24px',
'::before': {
display: 'none',
},
'::after': {
display: 'none',
},
'& code': {
fontSize: '10px',
lineHeight: '12px',
transform: 'translateY(4px)',
},
},
'& code': {
maxWidth: '100%',
overflowX: 'auto',
overflowY: 'hidden',
whiteSpace: 'pre',
},
'td:last-child, th:last-child': {
borderRight: 0,
},
},
};
const Search = dynamic(() => import('@components/search'));
@ -38,14 +261,7 @@ export const MDContents: React.FC<any> = ({ pageTop: PageTop = null, headings, c
>
<Box position="sticky" top={0} pt="64px">
<Search mb={space('extra-loose')} />
{TOCShowing ? (
<TableOfContents
pl={space('base')}
borderLeft={border()}
headings={headings}
limit={2}
/>
) : null}
<TableOfContents headings={headings} />
</Box>
</Box>
) : null}

7
src/components/mdx/mdx-components.tsx

@ -26,7 +26,7 @@ import { Code } from '@components/mdx/components';
import { PageReference } from '@components/custom-blocks/page-reference';
import { MDWrapper } from '@components/layouts/markdown-wrapper';
export const MDXComponents = {
export const Components = {
h1: () => null,
h2: H2,
h3: H3,
@ -50,6 +50,9 @@ export const MDXComponents = {
blockquote: Blockquote,
sup: Sup,
section: Section,
};
export const MDXComponents = {
...Components,
pagereference: PageReference,
wrapper: MDWrapper,
};

124
src/components/mdx/overrides.tsx

@ -0,0 +1,124 @@
import React from 'react';
import { color } from '@blockstack/ui';
import { createGlobalStyle } from 'styled-components';
const GlobalStyles = createGlobalStyle`
* {
font-feature-settings: 'ss01' on;
}
section{
content-visibility: auto;
contain-intrinsic-size: 1000px;
}
html, body {
font-family: 'Soehne', Inter, sans-serif;
}
@counter-style list {
pad: "0";
}
img{
image-rendering: crisp-edges;
will-change: transform;
}
.headroom {
top: 0;
left: 0;
right: 0;
zIndex: 1;
}
.headroom--unfixed {
position: relative;
transform: translateY(0);
}
.headroom--scrolled {
transition: transform 200ms ease-in-out;
}
.headroom--unpinned {
position: fixed;
transform: translateY(-100%);
}
.headroom--pinned {
position: fixed;
transform: translateY(0%);
}
:root{
--docsearch-modal-background: ${color('bg')};
--docsearch-text-color: ${color('text-title')};
--docsearch-icon-color: ${color('text-caption')};
--docsearch-primary-color: ${color('accent')};
--docsearch-input-color: ${color('text-title')};
--docsearch-highlight-color: ${color('bg-alt')};
--docsearch-placeholder-color: ${color('text-caption')};
--docsearch-container-background: rgba(22,22,22,0.75);
--docsearch-modal-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-searchbox-background: var(--ifm-color-emphasis-300);
--docsearch-searchbox-focus-background: ${color('bg')};;
--docsearch-searchbox-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-hit-color: var(--ifm-color-emphasis-800);
--docsearch-hit-active-color: ${color('text-title')};
--docsearch-hit-background: ${color('bg')};
--docsearch-hit-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-key-gradient: transparent;
--docsearch-key-shadow: inset 0px -2px 0px 0px transparent,inset 0px 0px 1px 1px transparent,0px 1px 2px 1px transparent;
--docsearch-footer-background: ${color('bg')};
--docsearch-footer-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-logo-color: #5468ff;
--docsearch-muted-color: #969faf;
--docsearch-modal-width: 560px;
--docsearch-modal-height: 600px;
--docsearch-searchbox-height: 56px;
--docsearch-hit-height: 56px;
--docsearch-footer-height: 44px;
--docsearch-spacing: 12px;
--docsearch-icon-stroke-width: 1.4;
}
.DocSearch-Container{
z-index: 99999;
}
.DocSearch-SearchBar{
padding: var(--docsearch-spacing);
}
.DocSearch-Reset:hover{
color: ${color('accent')};
}
.DocSearch-Form{
input{
color: ${color('text-title')};
}
&:focus-within{
box-shadow: 0 0 0 3px rgba(170, 179, 255, 0.75);
}
}
.DocSearch-Help{
text-align: center;
}
.DocSearch-Prefill{
color: ${color('accent')} !important;
}
.DocSearch-Hit{
mark{
color: ${color('accent')} !important;
}
}
.DocSearch-Hit-source{
color: ${color('text-caption')};
}
.DocSearch-MagnifierLabel{
color: ${color('accent')};
}
pre{
display: inline-block;
}
p, ul, ol, table {
color: ${color('text-body')};
a > pre {
color: ${color('accent')} !important;
}
}
`;
export const MdxOverrides: React.FC<any> = props => (
<>
<GlobalStyles />
</>
);

117
src/components/mdx/styles.tsx

@ -1,126 +1,9 @@
import React from 'react';
import { color, space, themeColor } from '@blockstack/ui';
import { createGlobalStyle } from 'styled-components';
import { getHeadingStyles } from '@components/mdx/typography';
import { border } from '@common/utils';
import { getCapsizeStyles } from '@components/mdx/typography';
export const MdxOverrides = createGlobalStyle`
* {
font-feature-settings: 'ss01' on;
}
section{
content-visibility: auto;
contain-intrinsic-size: 1000px;
}
html, body {
font-family: 'Soehne', Inter, sans-serif;
}
@counter-style list {
pad: "0";
}
img{
image-rendering: crisp-edges;
will-change: transform;
}
.headroom {
top: 0;
left: 0;
right: 0;
zIndex: 1;
}
.headroom--unfixed {
position: relative;
transform: translateY(0);
}
.headroom--scrolled {
transition: transform 200ms ease-in-out;
}
.headroom--unpinned {
position: fixed;
transform: translateY(-100%);
}
.headroom--pinned {
position: fixed;
transform: translateY(0%);
}
:root{
--docsearch-modal-background: ${color('bg')};
--docsearch-text-color: ${color('text-title')};
--docsearch-icon-color: ${color('text-caption')};
--docsearch-primary-color: ${color('accent')};
--docsearch-input-color: ${color('text-title')};
--docsearch-highlight-color: ${color('bg-alt')};
--docsearch-placeholder-color: ${color('text-caption')};
--docsearch-container-background: rgba(22,22,22,0.75);
--docsearch-modal-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-searchbox-background: var(--ifm-color-emphasis-300);
--docsearch-searchbox-focus-background: ${color('bg')};;
--docsearch-searchbox-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-hit-color: var(--ifm-color-emphasis-800);
--docsearch-hit-active-color: ${color('text-title')};
--docsearch-hit-background: ${color('bg')};
--docsearch-hit-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-key-gradient: transparent;
--docsearch-key-shadow: inset 0px -2px 0px 0px transparent,inset 0px 0px 1px 1px transparent,0px 1px 2px 1px transparent;
--docsearch-footer-background: ${color('bg')};
--docsearch-footer-shadow: inset 0px 0px 1px 1px ${color('border')};
--docsearch-logo-color: #5468ff;
--docsearch-muted-color: #969faf;
--docsearch-modal-width: 560px;
--docsearch-modal-height: 600px;
--docsearch-searchbox-height: 56px;
--docsearch-hit-height: 56px;
--docsearch-footer-height: 44px;
--docsearch-spacing: 12px;
--docsearch-icon-stroke-width: 1.4;
}
.DocSearch-Container{
z-index: 99999;
}
.DocSearch-SearchBar{
padding: var(--docsearch-spacing);
}
.DocSearch-Reset:hover{
color: ${color('accent')};
}
.DocSearch-Form{
input{
color: ${color('text-title')};
}
&:focus-within{
box-shadow: 0 0 0 3px rgba(170, 179, 255, 0.75);
}
}
.DocSearch-Help{
text-align: center;
}
.DocSearch-Prefill{
color: ${color('accent')} !important;
}
.DocSearch-Hit{
mark{
color: ${color('accent')} !important;
}
}
.DocSearch-Hit-source{
color: ${color('text-caption')};
}
.DocSearch-MagnifierLabel{
color: ${color('accent')};
}
pre{
display: inline-block;
}
p, ul, ol, table {
color: ${color('text-body')};
a > pre {
color: ${color('accent')} !important;
}
}
`;
export const styleOverwrites = {
section: {
'&:first-child > h2:first-child': {

24
src/components/toc.tsx

@ -7,6 +7,7 @@ import { useActiveHeading } from '@common/hooks/use-active-heading';
import NextLink from 'next/link';
import { getHeadingStyles } from '@components/mdx/typography';
import { css } from '@styled-system/css';
const getLevelPadding = (level: number) => {
switch (level) {
case 2:
@ -18,12 +19,24 @@ const getLevelPadding = (level: number) => {
}
};
const Item = ({ slug, label, level, limit }) => {
const Item = ({
slug,
label,
level,
limit,
}: {
slug: string;
label: string;
level: number;
limit?: number;
}) => {
const { isActive: _isActive, slugInView } = useActiveHeading(slug);
const isOnScreen = slugInView === slug;
const isActive = isOnScreen || _isActive;
return !limit || level <= limit + 1 ? (
const render = !limit || level <= limit + 1;
return render ? (
<Box pl={getLevelPadding(level - 2)} py={space('extra-tight')}>
<NextLink href={`#${slug}`} passHref>
<Link
@ -36,11 +49,6 @@ const Item = ({ slug, label, level, limit }) => {
color: color('accent'),
}}
pointerEvents={isActive ? 'none' : 'unset'}
css={css({
display: 'block',
...getHeadingStyles('h6'),
mb: space('base-tight'),
})}
>
<Box as="span" dangerouslySetInnerHTML={{ __html: label }} />
</Link>
@ -90,7 +98,7 @@ export const TableOfContents = ({
: `repeat(${columns}, 1fr)`
}
>
{headings.map((heading, index) => {
{headings?.map((heading, index) => {
return index > 0 ? (
<Item
limit={limit}

3
src/pages/_app.tsx

@ -4,9 +4,8 @@ import { useMediaQuery } from '@common/hooks/use-media-query';
import { MDXProvider } from '@mdx-js/react';
import { MDXComponents } from '@components/mdx';
import { AppStateProvider } from '@components/app-state';
import { MdxOverrides } from '@components/mdx/styles';
import { MdxOverrides } from '@components/mdx/overrides';
import { ProgressBar } from '@components/progress-bar';
import GoogleFonts from 'next-google-fonts';
import '@docsearch/css';
import { BaseLayout } from '@components/layouts/base-layout';
import { THEME_STORAGE_KEY } from '@common/constants';

5
yarn.lock

@ -9618,6 +9618,11 @@ vm-browserify@^1.0.1:
resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
"vscode-textmate@git+https://github.com/octref/vscode-textmate.git":
version "4.0.1"
uid e65aabe2227febda7beaad31dd0fca1228c5ddf3
resolved "git+https://github.com/octref/vscode-textmate.git#e65aabe2227febda7beaad31dd0fca1228c5ddf3"
"vscode-textmate@https://github.com/octref/vscode-textmate":
version "4.0.1"
resolved "https://github.com/octref/vscode-textmate#e65aabe2227febda7beaad31dd0fca1228c5ddf3"

Loading…
Cancel
Save