@docusaurus/theme-classic 2.0.0-beta.1ec2c95e3 → 2.0.0-beta.21

package/lib/theme/IconLightMode/index.js

@@ -0,0 +1,17 @@
+/**
+ * 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';
+export default function IconLightMode(props) {
+  return (
+    <svg viewBox="0 0 24 24" width={24} height={24} {...props}>
+      <path
+        fill="currentColor"
+        d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"
+      />
+    </svg>
+  );
+}

package/lib/theme/IconMenu/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/IconMenu';
+export default function IconMenu({ width, height, className, ...restProps }: Props): JSX.Element;

package/lib/theme/IconMenu/index.js

@@ -1,30 +1,31 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /**
  * 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.
  */
-const IconMenu = ({
+import React from 'react';
+export default function IconMenu({
   width = 30,
   height = 30,
   className,
   ...restProps
-}) => {
-  return <svg className={className} width={width} height={height} viewBox="0 0 30 30" aria-hidden="true" {...restProps}>
-      <path stroke="currentColor" strokeLinecap="round" strokeMiterlimit="10" strokeWidth="2" d="M4 7h22M4 15h22M4 23h22" />
-    </svg>;
-};
-
-var _default = IconMenu;
-exports.default = _default;
+}) {
+  return (
+    <svg
+      className={className}
+      width={width}
+      height={height}
+      viewBox="0 0 30 30"
+      aria-hidden="true"
+      {...restProps}>
+      <path
+        stroke="currentColor"
+        strokeLinecap="round"
+        strokeMiterlimit="10"
+        strokeWidth="2"
+        d="M4 7h22M4 15h22M4 23h22"
+      />
+    </svg>
+  );
+}

package/lib/theme/LastUpdated/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/LastUpdated';
+export default function LastUpdated({ lastUpdatedAt, formattedLastUpdatedAt, lastUpdatedBy, }: Props): JSX.Element;

package/lib/theme/LastUpdated/index.js

@@ -1,61 +1,76 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = LastUpdated;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _Translate = _interopRequireDefault(require("@docusaurus/Translate"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /**
  * 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.
  */
-function LastUpdatedAtDate({
-  lastUpdatedAt,
-  formattedLastUpdatedAt
-}) {
-  return <_Translate.default id="theme.lastUpdated.atDate" description="The words used to describe on which date a page has been last updated" values={{
-    date: <b>
+import React from 'react';
+import Translate from '@docusaurus/Translate';
+import {ThemeClassNames} from '@docusaurus/theme-common';
+function LastUpdatedAtDate({lastUpdatedAt, formattedLastUpdatedAt}) {
+  return (
+    <Translate
+      id="theme.lastUpdated.atDate"
+      description="The words used to describe on which date a page has been last updated"
+      values={{
+        date: (
+          <b>
             <time dateTime={new Date(lastUpdatedAt * 1000).toISOString()}>
               {formattedLastUpdatedAt}
             </time>
           </b>
-  }}>
+        ),
+      }}>
       {' on {date}'}
-    </_Translate.default>;
+    </Translate>
+  );
 }
-
-function LastUpdatedByUser({
-  lastUpdatedBy
-}) {
-  return <_Translate.default id="theme.lastUpdated.byUser" description="The words used to describe by who the page has been last updated" values={{
-    user: <b>{lastUpdatedBy}</b>
-  }}>
+function LastUpdatedByUser({lastUpdatedBy}) {
+  return (
+    <Translate
+      id="theme.lastUpdated.byUser"
+      description="The words used to describe by who the page has been last updated"
+      values={{
+        user: <b>{lastUpdatedBy}</b>,
+      }}>
       {' by {user}'}
-    </_Translate.default>;
+    </Translate>
+  );
 }
-
-function LastUpdated({
+export default function LastUpdated({
   lastUpdatedAt,
   formattedLastUpdatedAt,
-  lastUpdatedBy
+  lastUpdatedBy,
 }) {
-  return <>
-      <_Translate.default id="theme.lastUpdated.lastUpdatedAtBy" description="The sentence used to display when a page has been last updated, and by who" values={{
-      atDate: lastUpdatedAt && formattedLastUpdatedAt ? <LastUpdatedAtDate lastUpdatedAt={lastUpdatedAt} formattedLastUpdatedAt={formattedLastUpdatedAt} /> : '',
-      byUser: lastUpdatedBy ? <LastUpdatedByUser lastUpdatedBy={lastUpdatedBy} /> : ''
-    }}>
+  return (
+    <span className={ThemeClassNames.common.lastUpdated}>
+      <Translate
+        id="theme.lastUpdated.lastUpdatedAtBy"
+        description="The sentence used to display when a page has been last updated, and by who"
+        values={{
+          atDate:
+            lastUpdatedAt && formattedLastUpdatedAt ? (
+              <LastUpdatedAtDate
+                lastUpdatedAt={lastUpdatedAt}
+                formattedLastUpdatedAt={formattedLastUpdatedAt}
+              />
+            ) : (
+              ''
+            ),
+          byUser: lastUpdatedBy ? (
+            <LastUpdatedByUser lastUpdatedBy={lastUpdatedBy} />
+          ) : (
+            ''
+          ),
+        }}>
         {'Last updated{atDate}{byUser}'}
-      </_Translate.default>
-      {process.env.NODE_ENV === 'development' && <div>
+      </Translate>
+      {process.env.NODE_ENV === 'development' && (
+        <div>
+          {/* eslint-disable-next-line @docusaurus/no-untranslated-text */}
           <small> (Simulated during dev for better perf)</small>
-        </div>}
-    </>;
-}
+        </div>
+      )}
+    </span>
+  );
+}

package/lib/theme/Layout/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import './styles.css';
+import type { Props } from '@theme/Layout';
+export default function Layout(props: Props): JSX.Element;

package/lib/theme/Layout/index.js

@@ -1,64 +1,51 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _clsx = _interopRequireDefault(require("clsx"));
-
-var _SkipToContent = _interopRequireDefault(require("@theme/SkipToContent"));
-
-var _AnnouncementBar = _interopRequireDefault(require("@theme/AnnouncementBar"));
-
-var _Navbar = _interopRequireDefault(require("@theme/Navbar"));
-
-var _Footer = _interopRequireDefault(require("@theme/Footer"));
-
-var _LayoutProviders = _interopRequireDefault(require("@theme/LayoutProviders"));
-
-var _LayoutHead = _interopRequireDefault(require("@theme/LayoutHead"));
-
-var _useKeyboardNavigation = _interopRequireDefault(require("@theme/hooks/useKeyboardNavigation"));
-
-var _themeCommon = require("@docusaurus/theme-common");
-
-require("./styles.css");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /**
  * 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.
  */
-function Layout(props) {
+import React from 'react';
+import clsx from 'clsx';
+import ErrorBoundary from '@docusaurus/ErrorBoundary';
+import {
+  PageMetadata,
+  ThemeClassNames,
+  useKeyboardNavigation,
+} from '@docusaurus/theme-common';
+import SkipToContent from '@theme/SkipToContent';
+import AnnouncementBar from '@theme/AnnouncementBar';
+import Navbar from '@theme/Navbar';
+import Footer from '@theme/Footer';
+import LayoutProviders from '@theme/LayoutProviders';
+import ErrorPageContent from '@theme/ErrorPageContent';
+import './styles.css';
+export default function Layout(props) {
   const {
     children,
     noFooter,
     wrapperClassName,
-    pageClassName
+    // Not really layout-related, but kept for convenience/retro-compatibility
+    title,
+    description,
   } = props;
-  (0, _useKeyboardNavigation.default)();
-  return <_LayoutProviders.default>
-      <_LayoutHead.default {...props} />
+  useKeyboardNavigation();
+  return (
+    <LayoutProviders>
+      <PageMetadata title={title} description={description} />
 
-      <_SkipToContent.default />
+      <SkipToContent />
 
-      <_AnnouncementBar.default />
+      <AnnouncementBar />
 
-      <_Navbar.default />
+      <Navbar />
 
-      <div className={(0, _clsx.default)(_themeCommon.ThemeClassNames.wrapper.main, wrapperClassName, pageClassName)}>
-        {children}
+      <div className={clsx(ThemeClassNames.wrapper.main, wrapperClassName)}>
+        <ErrorBoundary fallback={(params) => <ErrorPageContent {...params} />}>
+          {children}
+        </ErrorBoundary>
       </div>
 
-      {!noFooter && <_Footer.default />}
-    </_LayoutProviders.default>;
+      {!noFooter && <Footer />}
+    </LayoutProviders>
+  );
 }
-
-var _default = Layout;
-exports.default = _default;

package/lib/theme/LayoutProviders/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/LayoutProviders';
+export default function LayoutProviders({ children }: Props): JSX.Element;

package/lib/theme/LayoutProviders/index.js

@@ -1,36 +1,33 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = LayoutProviders;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _ThemeProvider = _interopRequireDefault(require("@theme/ThemeProvider"));
-
-var _UserPreferencesProvider = _interopRequireDefault(require("@theme/UserPreferencesProvider"));
-
-var _themeCommon = require("@docusaurus/theme-common");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /**
  * 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.
  */
-function LayoutProviders({
-  children
-}) {
-  return <_ThemeProvider.default>
-      <_themeCommon.AnnouncementBarProvider>
-        <_UserPreferencesProvider.default>
-          <_themeCommon.DocsPreferredVersionContextProvider>
-            {children}
-          </_themeCommon.DocsPreferredVersionContextProvider>
-        </_UserPreferencesProvider.default>
-      </_themeCommon.AnnouncementBarProvider>
-    </_ThemeProvider.default>;
-}
+import React from 'react';
+import {
+  ColorModeProvider,
+  TabGroupChoiceProvider,
+  AnnouncementBarProvider,
+  DocsPreferredVersionContextProvider,
+  ScrollControllerProvider,
+  NavbarProvider,
+  PluginHtmlClassNameProvider,
+} from '@docusaurus/theme-common';
+export default function LayoutProviders({children}) {
+  return (
+    <ColorModeProvider>
+      <AnnouncementBarProvider>
+        <TabGroupChoiceProvider>
+          <ScrollControllerProvider>
+            <DocsPreferredVersionContextProvider>
+              <PluginHtmlClassNameProvider>
+                <NavbarProvider>{children}</NavbarProvider>
+              </PluginHtmlClassNameProvider>
+            </DocsPreferredVersionContextProvider>
+          </ScrollControllerProvider>
+        </TabGroupChoiceProvider>
+      </AnnouncementBarProvider>
+    </ColorModeProvider>
+  );
+}

package/{lib-next/theme/BlogPostItem/styles.module.css → lib/theme/Logo/index.d.ts}

@@ -4,15 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
-.blogPostTitle {
-  font-size: 3rem;
-}
-
-.blogPostData {
-  font-size: 0.9rem;
-}
-
-.blogPostDetailsFull {
-  flex-direction: column;
-}
+/// <reference types="react" />
+import type { Props } from '@theme/Logo';
+export default function Logo(props: Props): JSX.Element;

package/lib/theme/Logo/index.js

@@ -1,60 +1,48 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _Link = _interopRequireDefault(require("@docusaurus/Link"));
-
-var _ThemedImage = _interopRequireDefault(require("@theme/ThemedImage"));
-
-var _useBaseUrl = _interopRequireDefault(require("@docusaurus/useBaseUrl"));
-
-var _useDocusaurusContext = _interopRequireDefault(require("@docusaurus/useDocusaurusContext"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /**
  * 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.
  */
-const Logo = props => {
+import React from 'react';
+import Link from '@docusaurus/Link';
+import useBaseUrl from '@docusaurus/useBaseUrl';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import {useThemeConfig} from '@docusaurus/theme-common';
+import ThemedImage from '@theme/ThemedImage';
+export default function Logo(props) {
   const {
-    siteConfig: {
-      title,
-      themeConfig: {
-        navbar: {
-          title: navbarTitle,
-          logo = {
-            src: ''
-          }
-        }
-      }
-    },
-    isClient
-  } = (0, _useDocusaurusContext.default)();
+    siteConfig: {title},
+  } = useDocusaurusContext();
   const {
-    imageClassName,
-    titleClassName,
-    ...propsRest
-  } = props;
-  const logoLink = (0, _useBaseUrl.default)(logo.href || '/');
+    navbar: {title: navbarTitle, logo = {src: ''}},
+  } = useThemeConfig();
+  const {imageClassName, titleClassName, ...propsRest} = props;
+  const logoLink = useBaseUrl(logo.href || '/');
   const sources = {
-    light: (0, _useBaseUrl.default)(logo.src),
-    dark: (0, _useBaseUrl.default)(logo.srcDark || logo.src)
+    light: useBaseUrl(logo.src),
+    dark: useBaseUrl(logo.srcDark || logo.src),
   };
-  return <_Link.default to={logoLink} {...propsRest} {...logo.target && {
-    target: logo.target
-  }}>
-      {logo.src && <_ThemedImage.default key={isClient} className={imageClassName} sources={sources} alt={logo.alt || navbarTitle || title} />}
+  const themedImage = (
+    <ThemedImage
+      sources={sources}
+      height={logo.height}
+      width={logo.width}
+      alt={logo.alt || navbarTitle || title}
+    />
+  );
+  return (
+    <Link
+      to={logoLink}
+      {...propsRest}
+      {...(logo.target && {target: logo.target})}>
+      {logo.src &&
+        (imageClassName ? (
+          <div className={imageClassName}>{themedImage}</div>
+        ) : (
+          themedImage
+        ))}
       {navbarTitle != null && <b className={titleClassName}>{navbarTitle}</b>}
-    </_Link.default>;
-};
-
-var _default = Logo;
-exports.default = _default;
+    </Link>
+  );
+}

package/lib/theme/MDXComponents/A.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/MDXComponents/A';
+export default function MDXA(props: Props): JSX.Element;

package/{lib-next/theme/ThemeContext.js → lib/theme/MDXComponents/A.js}

@@ -5,5 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-const ThemeContext = React.createContext(undefined);
-export default ThemeContext;
+import Link from '@docusaurus/Link';
+export default function MDXA(props) {
+  return <Link {...props} />;
+}

package/lib/theme/MDXComponents/Code.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/MDXComponents/Code';
+export default function MDXCode(props: Props): JSX.Element;

package/lib/theme/MDXComponents/Code.js

@@ -0,0 +1,28 @@
+/**
+ * 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, {isValidElement} from 'react';
+import CodeBlock from '@theme/CodeBlock';
+export default function MDXCode(props) {
+  const inlineElements = [
+    'a',
+    'b',
+    'big',
+    'i',
+    'span',
+    'em',
+    'strong',
+    'sup',
+    'sub',
+    'small',
+  ];
+  const shouldBeInline = React.Children.toArray(props.children).every(
+    (el) =>
+      (typeof el === 'string' && !el.includes('\n')) ||
+      (isValidElement(el) && inlineElements.includes(el.props.mdxType)),
+  );
+  return shouldBeInline ? <code {...props} /> : <CodeBlock {...props} />;
+}

package/lib/theme/MDXComponents/Details.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/MDXComponents/Details';
+export default function MDXDetails(props: Props): JSX.Element;

package/lib/theme/MDXComponents/Details.js

@@ -0,0 +1,22 @@
+/**
+ * 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 Details from '@theme/Details';
+export default function MDXDetails(props) {
+  const items = React.Children.toArray(props.children);
+  // Split summary item from the rest to pass it as a separate prop to the
+  // Details theme component
+  const summary = items.find(
+    (item) => React.isValidElement(item) && item.props?.mdxType === 'summary',
+  );
+  const children = <>{items.filter((item) => item !== summary)}</>;
+  return (
+    <Details {...props} summary={summary}>
+      {children}
+    </Details>
+  );
+}

package/lib/theme/MDXComponents/Head.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/MDXComponents/Head';
+export default function MDXHead(props: Props): JSX.Element;

package/lib/theme/MDXComponents/Head.js

@@ -0,0 +1,23 @@
+/**
+ * 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 Head from '@docusaurus/Head';
+// MDX elements are wrapped through the MDX pragma. In some cases (notably usage
+// with Head/Helmet) we need to unwrap those elements.
+function unwrapMDXElement(element) {
+  if (element.props?.mdxType && element.props.originalType) {
+    const {mdxType, originalType, ...newProps} = element.props;
+    return React.createElement(element.props.originalType, newProps);
+  }
+  return element;
+}
+export default function MDXHead(props) {
+  const unwrappedChildren = React.Children.map(props.children, (child) =>
+    React.isValidElement(child) ? unwrapMDXElement(child) : child,
+  );
+  return <Head {...props}>{unwrappedChildren}</Head>;
+}

package/lib/theme/MDXComponents/Heading.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/MDXComponents/Heading';
+export default function MDXHeading(props: Props): JSX.Element;