@docusaurus/theme-classic 2.0.0-beta.20 → 2.0.0-beta.21

package/{lib-next → lib}/theme/SiteMetadata/index.js

@@ -8,7 +8,6 @@ import React from 'react';
 import Head from '@docusaurus/Head';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 import useBaseUrl from '@docusaurus/useBaseUrl';
-import SearchMetadata from '@theme/SearchMetadata';
 import {
   PageMetadata,
   DEFAULT_SEARCH_TAG,
@@ -16,18 +15,19 @@ import {
   useThemeConfig,
   keyboardFocusedClassName,
 } from '@docusaurus/theme-common';
-import {useLocation} from '@docusaurus/router'; // TODO move to SiteMetadataDefaults or theme-common ?
+import {useLocation} from '@docusaurus/router';
+import SearchMetadata from '@theme/SearchMetadata';
+// TODO move to SiteMetadataDefaults or theme-common ?
 // Useful for i18n/SEO
 // See https://developers.google.com/search/docs/advanced/crawling/localized-versions
 // See https://github.com/facebook/docusaurus/issues/3317
-
 function AlternateLangHeaders() {
   const {
     i18n: {defaultLocale, localeConfigs},
   } = useDocusaurusContext();
-  const alternatePageUtils = useAlternatePageUtils(); // Note: it is fine to use both "x-default" and "en" to target the same url
+  const alternatePageUtils = useAlternatePageUtils();
+  // Note: it is fine to use both "x-default" and "en" to target the same url
   // See https://www.searchviu.com/en/multiple-hreflang-tags-one-url/
-
   return (
     <Head>
       {Object.entries(localeConfigs).map(([locale, {htmlLang}]) => (
@@ -51,16 +51,16 @@ function AlternateLangHeaders() {
       />
     </Head>
   );
-} // Default canonical url inferred from current page location pathname
-
+}
+// Default canonical url inferred from current page location pathname
 function useDefaultCanonicalUrl() {
   const {
     siteConfig: {url: siteUrl},
   } = useDocusaurusContext();
   const {pathname} = useLocation();
   return siteUrl + useBaseUrl(pathname);
-} // TODO move to SiteMetadataDefaults or theme-common ?
-
+}
+// TODO move to SiteMetadataDefaults or theme-common ?
 function CanonicalUrlHeaders({permalink}) {
   const {
     siteConfig: {url: siteUrl},
@@ -76,13 +76,12 @@ function CanonicalUrlHeaders({permalink}) {
     </Head>
   );
 }
-
 export default function SiteMetadata() {
   const {
     i18n: {currentLocale},
-  } = useDocusaurusContext(); // TODO maybe move these 2 themeConfig to siteConfig?
+  } = useDocusaurusContext();
+  // TODO maybe move these 2 themeConfig to siteConfig?
   // These seems useful for other themes as well
-
   const {metadata, image: defaultImage} = useThemeConfig();
   return (
     <>
@@ -102,11 +101,11 @@ export default function SiteMetadata() {
       <SearchMetadata tag={DEFAULT_SEARCH_TAG} locale={currentLocale} />
 
       {/*
-       It's important to have an additional <Head> element here, as it allows
-       react-helmet to override default metadata values set in previous <Head>
-       like "twitter:card". In same Head, the same meta would appear twice
-       instead of overriding.
-      */}
+          It's important to have an additional <Head> element here, as it allows
+          react-helmet to override default metadata values set in previous <Head>
+          like "twitter:card". In same Head, the same meta would appear twice
+          instead of overriding.
+        */}
       <Head>
         {/* Yes, "metadatum" is the grammatically correct term */}
         {metadata.map((metadatum, i) => (

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

@@ -0,0 +1,8 @@
+/**
+ * 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" />
+export default function SkipToContent(): JSX.Element;

package/lib/theme/TOC/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/TOC';
+export default function TOC({ className, ...props }: Props): JSX.Element;

package/{lib-next → lib}/theme/TOC/index.js

@@ -7,9 +7,9 @@
 import React from 'react';
 import clsx from 'clsx';
 import TOCItems from '@theme/TOCItems';
-import styles from './styles.module.css'; // Using a custom className
+import styles from './styles.module.css';
+// Using a custom className
 // This prevents TOCInline/TOCCollapsible getting highlighted by mistake
-
 const LINK_CLASS_NAME = 'table-of-contents__link toc-highlight';
 const LINK_ACTIVE_CLASS_NAME = 'table-of-contents__link--active';
 export default function TOC({className, ...props}) {

package/lib/theme/TOCCollapsible/CollapseButton/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/TOCCollapsible/CollapseButton';
+export default function TOCCollapsibleCollapseButton({ collapsed, ...props }: Props): JSX.Element;

package/{lib-next/theme/TOCCollapsible/CollapseButton.js → lib/theme/TOCCollapsible/CollapseButton/index.js}

@@ -7,7 +7,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import Translate from '@docusaurus/Translate';
-import styles from './CollapseButton.module.css';
+import styles from './styles.module.css';
 export default function TOCCollapsibleCollapseButton({collapsed, ...props}) {
   return (
     <button

package/lib/theme/TOCCollapsible/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/TOCCollapsible';
+export default function TOCCollapsible({ toc, className, minHeadingLevel, maxHeadingLevel, }: Props): JSX.Element;

package/{lib-next → lib}/theme/TOCCollapsible/index.js

@@ -7,9 +7,9 @@
 import React from 'react';
 import clsx from 'clsx';
 import {useCollapsible, Collapsible} from '@docusaurus/theme-common';
-import styles from './index.module.css';
 import TOCItems from '@theme/TOCItems';
 import CollapseButton from '@theme/TOCCollapsible/CollapseButton';
+import styles from './styles.module.css';
 export default function TOCCollapsible({
   toc,
   className,

package/lib/theme/TOCInline/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/TOCInline';
+export default function TOCInline({ toc, minHeadingLevel, maxHeadingLevel, }: Props): JSX.Element;

package/{lib-next → lib}/theme/TOCInline/index.js

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-import styles from './styles.module.css';
 import TOCItems from '@theme/TOCItems';
+import styles from './styles.module.css';
 export default function TOCInline({toc, minHeadingLevel, maxHeadingLevel}) {
   return (
     <div className={styles.tableOfContentsInline}>

package/lib/theme/TOCItems/Tree.d.ts

@@ -0,0 +1,11 @@
+/**
+ * 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 type { Props } from '@theme/TOCItems/Tree';
+declare function TOCItemTree({ toc, className, linkClassName, isChild, }: Props): JSX.Element | null;
+declare const _default: React.MemoExoticComponent<typeof TOCItemTree>;
+export default _default;

package/{lib-next → lib}/theme/TOCItems/Tree.js

@@ -5,13 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-
 // Recursive component rendering the toc tree
 function TOCItemTree({toc, className, linkClassName, isChild}) {
   if (!toc.length) {
     return null;
   }
-
   return (
     <ul className={isChild ? undefined : className}>
       {toc.map((heading) => (
@@ -19,11 +17,10 @@ function TOCItemTree({toc, className, linkClassName, isChild}) {
           {/* eslint-disable-next-line jsx-a11y/control-has-associated-label */}
           <a
             href={`#${heading.id}`}
-            className={linkClassName ?? undefined} // Developer provided the HTML, so assume it's safe.
+            className={linkClassName ?? undefined}
+            // Developer provided the HTML, so assume it's safe.
             // eslint-disable-next-line react/no-danger
-            dangerouslySetInnerHTML={{
-              __html: heading.value,
-            }}
+            dangerouslySetInnerHTML={{__html: heading.value}}
           />
           <TOCItemTree
             isChild
@@ -35,6 +32,6 @@ function TOCItemTree({toc, className, linkClassName, isChild}) {
       ))}
     </ul>
   );
-} // Memo only the tree root is enough
-
+}
+// Memo only the tree root is enough
 export default React.memo(TOCItemTree);

package/lib/theme/TOCItems/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/TOCItems';
+export default function TOCItems({ toc, className, linkClassName, linkActiveClassName, minHeadingLevel: minHeadingLevelOption, maxHeadingLevel: maxHeadingLevelOption, ...props }: Props): JSX.Element | null;

package/{lib-next → lib}/theme/TOCItems/index.js

@@ -5,12 +5,12 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, {useMemo} from 'react';
-import TOCItemTree from '@theme/TOCItems/Tree';
 import {
   useThemeConfig,
   useTOCHighlight,
   useFilteredAndTreeifiedTOC,
 } from '@docusaurus/theme-common';
+import TOCItemTree from '@theme/TOCItems/Tree';
 export default function TOCItems({
   toc,
   className = 'table-of-contents table-of-contents__left-border',
@@ -39,7 +39,6 @@ export default function TOCItems({
         maxHeadingLevel,
       };
     }
-
     return undefined;
   }, [linkClassName, linkActiveClassName, minHeadingLevel, maxHeadingLevel]);
   useTOCHighlight(tocHighlightConfig);

package/lib/theme/TabItem/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/TabItem';
+export default function TabItem({ children, hidden, className, }: Props): JSX.Element;

package/{lib-next → lib}/theme/TabItem/index.js

@@ -12,9 +12,7 @@ export default function TabItem({children, hidden, className}) {
     <div
       role="tabpanel"
       className={clsx(styles.tabItem, className)}
-      {...{
-        hidden,
-      }}>
+      {...{hidden}}>
       {children}
     </div>
   );

package/lib/theme/Tabs/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/Tabs';
+export default function Tabs(props: Props): JSX.Element;

package/{lib-next → lib}/theme/Tabs/index.js

@@ -5,20 +5,19 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, {useState, cloneElement, isValidElement} from 'react';
+import clsx from 'clsx';
 import useIsBrowser from '@docusaurus/useIsBrowser';
 import {
   useScrollPositionBlocker,
   duplicates,
   useTabGroupChoice,
 } from '@docusaurus/theme-common';
-import clsx from 'clsx';
-import styles from './styles.module.css'; // A very rough duck type, but good enough to guard against mistakes while
+import styles from './styles.module.css';
+// A very rough duck type, but good enough to guard against mistakes while
 // allowing customization
-
 function isTabItem(comp) {
-  return typeof comp.props.value !== 'undefined';
+  return 'value' in comp.props;
 }
-
 function TabsComponent(props) {
   const {
     lazy,
@@ -31,9 +30,9 @@ function TabsComponent(props) {
   const children = React.Children.map(props.children, (child) => {
     if (isValidElement(child) && isTabItem(child)) {
       return child;
-    } // child.type.name will give non-sensical values in prod because of
+    }
+    // child.type.name will give non-sensical values in prod because of
     // minification, but we assume it won't throw in prod.
-
     throw new Error(
       `Docusaurus error: Bad <Tabs> child <${
         // @ts-expect-error: guarding against unexpected cases
@@ -42,29 +41,28 @@ function TabsComponent(props) {
     );
   });
   const values =
-    valuesProp ?? // Only pick keys that we recognize. MDX would inject some keys by default
+    valuesProp ??
+    // Only pick keys that we recognize. MDX would inject some keys by default
     children.map(({props: {value, label, attributes}}) => ({
       value,
       label,
       attributes,
     }));
   const dup = duplicates(values, (a, b) => a.value === b.value);
-
   if (dup.length > 0) {
     throw new Error(
       `Docusaurus error: Duplicate values "${dup
         .map((a) => a.value)
         .join(', ')}" found in <Tabs>. Every value needs to be unique.`,
     );
-  } // When defaultValueProp is null, don't show a default tab
-
+  }
+  // When defaultValueProp is null, don't show a default tab
   const defaultValue =
     defaultValueProp === null
       ? defaultValueProp
       : defaultValueProp ??
         children.find((child) => child.props.default)?.props.value ??
-        children[0]?.props.value;
-
+        children[0].props.value;
   if (defaultValue !== null && !values.some((a) => a.value === defaultValue)) {
     throw new Error(
       `Docusaurus error: The <Tabs> has a defaultValue "${defaultValue}" but none of its children has the corresponding value. Available values are: ${values
@@ -74,16 +72,13 @@ function TabsComponent(props) {
         )}. If you intend to show no default tab, use defaultValue={null} instead.`,
     );
   }
-
   const {tabGroupChoices, setTabGroupChoices} = useTabGroupChoice();
   const [selectedValue, setSelectedValue] = useState(defaultValue);
   const tabRefs = [];
   const {blockElementScrollPositionUntilNextRender} =
     useScrollPositionBlocker();
-
   if (groupId != null) {
     const relevantTabGroupChoice = tabGroupChoices[groupId];
-
     if (
       relevantTabGroupChoice != null &&
       relevantTabGroupChoice !== selectedValue &&
@@ -92,45 +87,36 @@ function TabsComponent(props) {
       setSelectedValue(relevantTabGroupChoice);
     }
   }
-
   const handleTabChange = (event) => {
     const newTab = event.currentTarget;
     const newTabIndex = tabRefs.indexOf(newTab);
     const newTabValue = values[newTabIndex].value;
-
     if (newTabValue !== selectedValue) {
       blockElementScrollPositionUntilNextRender(newTab);
       setSelectedValue(newTabValue);
-
       if (groupId != null) {
-        setTabGroupChoices(groupId, newTabValue);
+        setTabGroupChoices(groupId, String(newTabValue));
       }
     }
   };
-
   const handleKeydown = (event) => {
     let focusElement = null;
-
     switch (event.key) {
       case 'ArrowRight': {
         const nextTab = tabRefs.indexOf(event.currentTarget) + 1;
-        focusElement = tabRefs[nextTab] || tabRefs[0];
+        focusElement = tabRefs[nextTab] ?? tabRefs[0];
         break;
       }
-
       case 'ArrowLeft': {
         const prevTab = tabRefs.indexOf(event.currentTarget) - 1;
-        focusElement = tabRefs[prevTab] || tabRefs[tabRefs.length - 1];
+        focusElement = tabRefs[prevTab] ?? tabRefs[tabRefs.length - 1];
         break;
       }
-
       default:
         break;
     }
-
     focusElement?.focus();
   };
-
   return (
     <div className={clsx('tabs-container', styles.tabList)}>
       <ul
@@ -172,9 +158,7 @@ function TabsComponent(props) {
           children.filter(
             (tabItem) => tabItem.props.value === selectedValue,
           )[0],
-          {
-            className: 'margin-top--md',
-          },
+          {className: 'margin-top--md'},
         )
       ) : (
         <div className="margin-top--md">
@@ -189,11 +173,11 @@ function TabsComponent(props) {
     </div>
   );
 }
-
 export default function Tabs(props) {
   const isBrowser = useIsBrowser();
   return (
-    <TabsComponent // Remount tabs after hydration
+    <TabsComponent
+      // Remount tabs after hydration
       // Temporary fix for https://github.com/facebook/docusaurus/issues/5653
       key={String(isBrowser)}
       {...props}

package/lib/theme/Tag/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/Tag';
+export default function Tag({ permalink, label, count }: Props): JSX.Element;

package/lib/theme/TagsListByLetter/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/TagsListByLetter';
+export default function TagsListByLetter({ tags }: Props): JSX.Element;

package/{lib-next → lib}/theme/TagsListByLetter/index.js

@@ -5,10 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-import Tag from '@theme/Tag';
 import {listTagsByLetters} from '@docusaurus/theme-common';
+import Tag from '@theme/Tag';
 import styles from './styles.module.css';
-
 function TagLetterEntryItem({letterEntry}) {
   return (
     <article>
@@ -24,7 +23,6 @@ function TagLetterEntryItem({letterEntry}) {
     </article>
   );
 }
-
 export default function TagsListByLetter({tags}) {
   const letterList = listTagsByLetters(tags);
   return (

package/lib/theme/TagsListInline/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/TagsListInline';
+export default function TagsListInline({ tags }: Props): JSX.Element;

package/lib/theme/ThemedImage/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/ThemedImage';
+export default function ThemedImage(props: Props): JSX.Element;

package/{lib-next → lib}/theme/ThemedImage/index.js

@@ -15,8 +15,9 @@ export default function ThemedImage(props) {
   const {sources, className, alt, ...propsRest} = props;
   const clientThemes = colorMode === 'dark' ? ['dark'] : ['light'];
   const renderedSourceNames = isBrowser
-    ? clientThemes // We need to render both images on the server to avoid flash
-    : // See https://github.com/facebook/docusaurus/pull/3730
+    ? clientThemes
+    : // We need to render both images on the server to avoid flash
+      // See https://github.com/facebook/docusaurus/pull/3730
       ['light', 'dark'];
   return (
     <>

package/lib/theme/prism-include-languages.d.ts

@@ -0,0 +1,8 @@
+/**
+ * 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 type * as PrismNamespace from 'prismjs';
+export default function prismIncludeLanguages(PrismObject: typeof PrismNamespace): void;

package/{lib-next → lib}/theme/prism-include-languages.js

@@ -9,13 +9,13 @@ export default function prismIncludeLanguages(PrismObject) {
   const {
     themeConfig: {prism},
   } = siteConfig;
-  const {additionalLanguages} = prism; // Prism components work on the Prism instance on the window, while prism-
+  const {additionalLanguages} = prism;
+  // Prism components work on the Prism instance on the window, while prism-
   // react-renderer uses its own Prism instance. We temporarily mount the
   // instance onto window, import components to enhance it, then remove it to
   // avoid polluting global namespace.
   // You can mutate PrismObject: registering plugins, deleting languages... As
   // long as you don't re-assign it
-
   globalThis.Prism = PrismObject;
   additionalLanguages.forEach((lang) => {
     // eslint-disable-next-line global-require, import/no-dynamic-require

package/lib/translations.d.ts

@@ -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 type { TranslationFile } from '@docusaurus/types';
+import type { ThemeConfig } from '@docusaurus/theme-common';
+export declare function getTranslationFiles({ themeConfig, }: {
+    themeConfig: ThemeConfig;
+}): TranslationFile[];
+export declare function translateThemeConfig({ themeConfig, translationFiles, }: {
+    themeConfig: ThemeConfig;
+    translationFiles: TranslationFile[];
+}): ThemeConfig;