@docusaurus/theme-classic 0.0.0-4698 → 0.0.0-4701

package/lib/getSwizzleConfig.js

@@ -89,6 +89,13 @@ function getSwizzleConfig() {
         },
         description: 'The MDX components to use for rendering MDX files. Meant to be ejected.'
       },
+      MDXContent: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'A component wrapping all MDX content and providing the MDXComponents to the MDX context'
+      },
       // TODO should probably not even appear here
       'NavbarItem/utils': {
         actions: {

package/lib/theme-classic.d.ts

@@ -343,6 +343,16 @@ declare module '@theme/MDXComponents' {
   export default MDXComponents;
 }
 
+declare module '@theme/MDXContent' {
+  import type {ReactNode} from 'react';
+
+  export interface Props {
+    readonly children: ReactNode;
+  }
+
+  export default function MDXContent(props: Props): JSX.Element;
+}
+
 declare module '@theme/Navbar' {
   export default function Navbar(): JSX.Element;
 }

package/lib-next/theme/BlogPostItem/index.js

@@ -6,13 +6,12 @@
  */
 import React from 'react';
 import clsx from 'clsx';
-import {MDXProvider} from '@mdx-js/react';
 import Translate, {translate} from '@docusaurus/Translate';
 import Link from '@docusaurus/Link';
 import {useBaseUrlUtils} from '@docusaurus/useBaseUrl';
 import {usePluralForm} from '@docusaurus/theme-common';
 import {blogPostContainerID} from '@docusaurus/utils-common';
-import MDXComponents from '@theme/MDXComponents';
+import MDXContent from '@theme/MDXContent';
 import EditThisPage from '@theme/EditThisPage';
 import styles from './styles.module.css';
 import TagsListInline from '@theme/TagsListInline';
@@ -108,7 +107,7 @@ export default function BlogPostItem(props) {
         id={isBlogPostPage ? blogPostContainerID : undefined}
         className="markdown"
         itemProp="articleBody">
-        <MDXProvider components={MDXComponents}>{children}</MDXProvider>
+        <MDXContent>{children}</MDXContent>
       </div>
 
       {(tagsExists || truncated) && (

package/lib-next/theme/DocItem/index.js

@@ -17,6 +17,7 @@ import Heading from '@theme/Heading';
 import styles from './styles.module.css';
 import {ThemeClassNames, useWindowSize} from '@docusaurus/theme-common';
 import DocBreadcrumbs from '@theme/DocBreadcrumbs';
+import MDXContent from '@theme/MDXContent';
 export default function DocItem(props) {
   const {content: DocContent} = props;
   const {metadata, frontMatter, assets} = DocContent;
@@ -86,8 +87,9 @@ export default function DocItem(props) {
                     <Heading as="h1">{title}</Heading>
                   </header>
                 )}
-
-                <DocContent />
+                <MDXContent>
+                  <DocContent />
+                </MDXContent>
               </div>
 
               <DocItemFooter {...props} />

package/lib-next/theme/DocPage/index.js

@@ -5,11 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, {useState, useCallback} from 'react';
-import {MDXProvider} from '@mdx-js/react';
 import renderRoutes from '@docusaurus/renderRoutes';
 import Layout from '@theme/Layout';
 import DocSidebar from '@theme/DocSidebar';
-import MDXComponents from '@theme/MDXComponents';
 import NotFound from '@theme/NotFound';
 import IconArrow from '@theme/IconArrow';
 import BackToTopButton from '@theme/BackToTopButton';
@@ -123,7 +121,7 @@ function DocPageContent({
                 [styles.docItemWrapperEnhanced]: hiddenSidebarContainer,
               },
             )}>
-            <MDXProvider components={MDXComponents}>{children}</MDXProvider>
+            {children}
           </div>
         </main>
       </div>

package/lib-next/theme/DocSidebarItem/index.js

@@ -250,14 +250,10 @@ function DocSidebarItemLink({
           onClick: onItemClick ? () => onItemClick(item) : undefined,
         })}
         {...props}>
-        {isInternalUrl(href) ? (
-          label
-        ) : (
-          <span>
-            {label}
-            <IconExternalLink />
-          </span>
-        )}
+        <span>
+          {label}
+          {!isInternalUrl(href) && <IconExternalLink />}
+        </span>
       </Link>
     </li>
   );

package/lib-next/theme/Footer/index.js

@@ -30,14 +30,10 @@ function FooterLink({to, href, label, prependBaseUrlToHref, ...props}) {
             to: toUrl,
           })}
       {...props}>
-      {href && !isInternalUrl(href) ? (
-        <span>
-          {label}
-          <IconExternalLink />
-        </span>
-      ) : (
-        label
-      )}
+      <span>
+        {label}
+        {href && !isInternalUrl(href) && <IconExternalLink />}
+      </span>
     </Link>
   );
 }

package/lib-next/theme/MDXContent/index.js

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import {MDXProvider} from '@mdx-js/react';
+import MDXComponents from '@theme/MDXComponents';
+export default function MDXContent({children}) {
+  return <MDXProvider components={MDXComponents}>{children}</MDXProvider>;
+}

package/lib-next/theme/MDXPage/index.js

@@ -7,8 +7,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import Layout from '@theme/Layout';
-import {MDXProvider} from '@mdx-js/react';
-import MDXComponents from '@theme/MDXComponents';
+import MDXContent from '@theme/MDXContent';
 import TOC from '@theme/TOC';
 import {ThemeClassNames} from '@docusaurus/theme-common';
 import styles from './styles.module.css';
@@ -29,9 +28,9 @@ export default function MDXPage(props) {
       <main className="container container--fluid margin-vert--lg">
         <div className={clsx('row', styles.mdxPageWrapper)}>
           <div className={clsx('col', !hideTableOfContents && 'col--8')}>
-            <MDXProvider components={MDXComponents}>
+            <MDXContent>
               <MDXPageContent />
-            </MDXProvider>
+            </MDXContent>
           </div>
           {!hideTableOfContents && MDXPageContent.toc && (
             <div className="col col--2">

package/lib-next/theme/NavbarItem/NavbarNavLink.js

@@ -52,19 +52,17 @@ export default function NavbarNavLink({
               : null),
           })}
       {...props}>
-      {isExternalLink ? (
-        <span>
-          {label}
+      <span>
+        {label}
+        {isExternalLink && (
           <IconExternalLink
             {...(isDropdownLink && {
               width: 12,
               height: 12,
             })}
           />
-        </span>
-      ) : (
-        label
-      )}
+        )}
+      </span>
     </Link>
   );
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docusaurus/theme-classic",
-  "version": "0.0.0-4698",
+  "version": "0.0.0-4701",
   "description": "Classic theme for Docusaurus",
   "main": "lib/index.js",
   "types": "src/theme-classic.d.ts",
@@ -21,15 +21,15 @@
     "format:lib-next": "prettier --config ../../.prettierrc --write \"lib-next/**/*.{js,ts,jsx,tsc}\""
   },
   "dependencies": {
-    "@docusaurus/core": "0.0.0-4698",
-    "@docusaurus/plugin-content-blog": "0.0.0-4698",
-    "@docusaurus/plugin-content-docs": "0.0.0-4698",
-    "@docusaurus/plugin-content-pages": "0.0.0-4698",
-    "@docusaurus/theme-common": "0.0.0-4698",
-    "@docusaurus/theme-translations": "0.0.0-4698",
-    "@docusaurus/utils": "0.0.0-4698",
-    "@docusaurus/utils-common": "0.0.0-4698",
-    "@docusaurus/utils-validation": "0.0.0-4698",
+    "@docusaurus/core": "0.0.0-4701",
+    "@docusaurus/plugin-content-blog": "0.0.0-4701",
+    "@docusaurus/plugin-content-docs": "0.0.0-4701",
+    "@docusaurus/plugin-content-pages": "0.0.0-4701",
+    "@docusaurus/theme-common": "0.0.0-4701",
+    "@docusaurus/theme-translations": "0.0.0-4701",
+    "@docusaurus/utils": "0.0.0-4701",
+    "@docusaurus/utils-common": "0.0.0-4701",
+    "@docusaurus/utils-validation": "0.0.0-4701",
     "@mdx-js/react": "^1.6.22",
     "clsx": "^1.1.1",
     "copy-text-to-clipboard": "^3.0.1",
@@ -42,8 +42,8 @@
     "rtlcss": "^3.3.0"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "0.0.0-4698",
-    "@docusaurus/types": "0.0.0-4698",
+    "@docusaurus/module-type-aliases": "0.0.0-4701",
+    "@docusaurus/types": "0.0.0-4701",
     "@types/mdx-js__react": "^1.5.5",
     "@types/prismjs": "^1.26.0",
     "@types/rtlcss": "^3.1.2",
@@ -59,5 +59,5 @@
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "767623e1e1a5f3dfea660eb8a6733b65de59f1c0"
+  "gitHead": "d61c50e6864073ecd948822e64d2f99a825f59fc"
 }

package/src/getSwizzleConfig.ts

@@ -85,6 +85,14 @@ export default function getSwizzleConfig(): SwizzleConfig {
         description:
           'The MDX components to use for rendering MDX files. Meant to be ejected.',
       },
+      MDXContent: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe',
+        },
+        description:
+          'A component wrapping all MDX content and providing the MDXComponents to the MDX context',
+      },
       // TODO should probably not even appear here
       'NavbarItem/utils': {
         actions: {

package/src/theme/BlogPostItem/index.tsx

@@ -7,13 +7,12 @@
 
 import React from 'react';
 import clsx from 'clsx';
-import {MDXProvider} from '@mdx-js/react';
 import Translate, {translate} from '@docusaurus/Translate';
 import Link from '@docusaurus/Link';
 import {useBaseUrlUtils} from '@docusaurus/useBaseUrl';
 import {usePluralForm} from '@docusaurus/theme-common';
 import {blogPostContainerID} from '@docusaurus/utils-common';
-import MDXComponents from '@theme/MDXComponents';
+import MDXContent from '@theme/MDXContent';
 import EditThisPage from '@theme/EditThisPage';
 import type {Props} from '@theme/BlogPostItem';
 
@@ -108,7 +107,7 @@ export default function BlogPostItem(props: Props): JSX.Element {
         id={isBlogPostPage ? blogPostContainerID : undefined}
         className="markdown"
         itemProp="articleBody">
-        <MDXProvider components={MDXComponents}>{children}</MDXProvider>
+        <MDXContent>{children}</MDXContent>
       </div>
 
       {(tagsExists || truncated) && (

package/src/theme/DocItem/index.tsx

@@ -19,6 +19,7 @@ import Heading from '@theme/Heading';
 import styles from './styles.module.css';
 import {ThemeClassNames, useWindowSize} from '@docusaurus/theme-common';
 import DocBreadcrumbs from '@theme/DocBreadcrumbs';
+import MDXContent from '@theme/MDXContent';
 
 export default function DocItem(props: Props): JSX.Element {
   const {content: DocContent} = props;
@@ -87,8 +88,9 @@ export default function DocItem(props: Props): JSX.Element {
                     <Heading as="h1">{title}</Heading>
                   </header>
                 )}
-
-                <DocContent />
+                <MDXContent>
+                  <DocContent />
+                </MDXContent>
               </div>
 
               <DocItemFooter {...props} />

package/src/theme/DocPage/index.tsx

@@ -6,13 +6,10 @@
  */
 
 import React, {type ReactNode, useState, useCallback} from 'react';
-import {MDXProvider} from '@mdx-js/react';
-
 import renderRoutes from '@docusaurus/renderRoutes';
 import type {PropVersionMetadata} from '@docusaurus/plugin-content-docs';
 import Layout from '@theme/Layout';
 import DocSidebar from '@theme/DocSidebar';
-import MDXComponents from '@theme/MDXComponents';
 import NotFound from '@theme/NotFound';
 import type {DocumentRoute} from '@theme/DocItem';
 import type {Props} from '@theme/DocPage';
@@ -137,7 +134,7 @@ function DocPageContent({
                 [styles.docItemWrapperEnhanced!]: hiddenSidebarContainer,
               },
             )}>
-            <MDXProvider components={MDXComponents}>{children}</MDXProvider>
+            {children}
           </div>
         </main>
       </div>

package/src/theme/DocSidebarItem/index.tsx

@@ -269,14 +269,10 @@ function DocSidebarItemLink({
           onClick: onItemClick ? () => onItemClick(item) : undefined,
         })}
         {...props}>
-        {isInternalUrl(href) ? (
-          label
-        ) : (
-          <span>
-            {label}
-            <IconExternalLink />
-          </span>
-        )}
+        <span>
+          {label}
+          {!isInternalUrl(href) && <IconExternalLink />}
+        </span>
       </Link>
     </li>
   );

package/src/theme/Footer/index.tsx

@@ -42,14 +42,10 @@ function FooterLink({
             to: toUrl,
           })}
       {...props}>
-      {href && !isInternalUrl(href) ? (
-        <span>
-          {label}
-          <IconExternalLink />
-        </span>
-      ) : (
-        label
-      )}
+      <span>
+        {label}
+        {href && !isInternalUrl(href) && <IconExternalLink />}
+      </span>
     </Link>
   );
 }

package/src/theme/MDXContent/index.tsx

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import {MDXProvider} from '@mdx-js/react';
+import MDXComponents from '@theme/MDXComponents';
+import type {Props} from '@theme/MDXContent';
+
+export default function MDXContent({children}: Props): JSX.Element {
+  return <MDXProvider components={MDXComponents}>{children}</MDXProvider>;
+}

package/src/theme/MDXPage/index.tsx

@@ -8,8 +8,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import Layout from '@theme/Layout';
-import {MDXProvider} from '@mdx-js/react';
-import MDXComponents from '@theme/MDXComponents';
+import MDXContent from '@theme/MDXContent';
 import type {Props} from '@theme/MDXPage';
 import TOC from '@theme/TOC';
 import {ThemeClassNames} from '@docusaurus/theme-common';
@@ -34,9 +33,9 @@ export default function MDXPage(props: Props): JSX.Element {
       <main className="container container--fluid margin-vert--lg">
         <div className={clsx('row', styles.mdxPageWrapper)}>
           <div className={clsx('col', !hideTableOfContents && 'col--8')}>
-            <MDXProvider components={MDXComponents}>
+            <MDXContent>
               <MDXPageContent />
-            </MDXProvider>
+            </MDXContent>
           </div>
           {!hideTableOfContents && MDXPageContent.toc && (
             <div className="col col--2">

package/src/theme/NavbarItem/NavbarNavLink.tsx

@@ -55,14 +55,12 @@ export default function NavbarNavLink({
               : null),
           })}
       {...props}>
-      {isExternalLink ? (
-        <span>
-          {label}
+      <span>
+        {label}
+        {isExternalLink && (
           <IconExternalLink {...(isDropdownLink && {width: 12, height: 12})} />
-        </span>
-      ) : (
-        label
-      )}
+        )}
+      </span>
     </Link>
   );
 }

package/src/theme-classic.d.ts

@@ -343,6 +343,16 @@ declare module '@theme/MDXComponents' {
   export default MDXComponents;
 }
 
+declare module '@theme/MDXContent' {
+  import type {ReactNode} from 'react';
+
+  export interface Props {
+    readonly children: ReactNode;
+  }
+
+  export default function MDXContent(props: Props): JSX.Element;
+}
+
 declare module '@theme/Navbar' {
   export default function Navbar(): JSX.Element;
 }