@docusaurus/theme-classic 0.0.0-5030 → 0.0.0-5033

package/{lib-next → lib}/theme/NavbarItem/DefaultNavbarItem.js

@@ -8,7 +8,6 @@ import React from 'react';
 import clsx from 'clsx';
 import NavbarNavLink from '@theme/NavbarItem/NavbarNavLink';
 import {getInfimaActiveClassName} from '@theme/NavbarItem/utils';
-
 function DefaultNavbarItemDesktop({
   className,
   isDropdownItem = false,
@@ -23,14 +22,11 @@ function DefaultNavbarItemDesktop({
       {...props}
     />
   );
-
   if (isDropdownItem) {
     return <li>{element}</li>;
   }
-
   return element;
 }
-
 function DefaultNavbarItemMobile({className, isDropdownItem, ...props}) {
   return (
     <li className="menu__list-item">
@@ -38,11 +34,9 @@ function DefaultNavbarItemMobile({className, isDropdownItem, ...props}) {
     </li>
   );
 }
-
 export default function DefaultNavbarItem({
   mobile = false,
-  position,
-  // Need to destructure position from props so that it doesn't get passed on.
+  position, // Need to destructure position from props so that it doesn't get passed on.
   ...props
 }) {
   const Comp = mobile ? DefaultNavbarItemMobile : DefaultNavbarItemDesktop;

package/lib/theme/NavbarItem/DocNavbarItem.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/NavbarItem/DocNavbarItem';
+export default function DocNavbarItem({ docId, label: staticLabel, docsPluginId, ...props }: Props): JSX.Element | null;

package/{lib-next → lib}/theme/NavbarItem/DocNavbarItem.js

@@ -17,20 +17,19 @@ export default function DocNavbarItem({
   ...props
 }) {
   const {activeDoc} = useActiveDocContext(docsPluginId);
-  const doc = useLayoutDoc(docId, docsPluginId); // Draft items are not displayed in the navbar.
-
+  const doc = useLayoutDoc(docId, docsPluginId);
+  // Draft items are not displayed in the navbar.
   if (doc === null) {
     return null;
   }
-
   const activeDocInfimaClassName = getInfimaActiveClassName(props.mobile);
   return (
     <DefaultNavbarItem
       exact
       {...props}
       className={clsx(props.className, {
-        // Do not make the item active if the active doc doesn't have sidebar.
         [activeDocInfimaClassName]:
+          // Do not make the item active if the active doc doesn't have sidebar.
           // If `activeDoc === doc` react-router will make it active anyways,
           // regardless of the existence of a sidebar
           activeDoc?.sidebar && activeDoc.sidebar === doc.sidebar,

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

package/{lib-next → lib}/theme/NavbarItem/DocSidebarNavbarItem.js

@@ -18,13 +18,11 @@ export default function DocSidebarNavbarItem({
 }) {
   const {activeDoc} = useActiveDocContext(docsPluginId);
   const sidebarLink = useLayoutDocsSidebar(sidebarId, docsPluginId).link;
-
   if (!sidebarLink) {
     throw new Error(
       `DocSidebarNavbarItem: Sidebar with ID "${sidebarId}" doesn't have anything to be linked to.`,
     );
   }
-
   const activeDocInfimaClassName = getInfimaActiveClassName(props.mobile);
   return (
     <DefaultNavbarItem

package/lib/theme/NavbarItem/DocsVersionDropdownNavbarItem.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/NavbarItem/DocsVersionDropdownNavbarItem';
+export default function DocsVersionDropdownNavbarItem({ mobile, docsPluginId, dropdownActiveClassDisabled, dropdownItemsBefore, dropdownItemsAfter, ...props }: Props): JSX.Element;

package/{lib-next → lib}/theme/NavbarItem/DocsVersionDropdownNavbarItem.js

@@ -16,10 +16,8 @@ import {
 import {translate} from '@docusaurus/Translate';
 import DefaultNavbarItem from '@theme/NavbarItem/DefaultNavbarItem';
 import DropdownNavbarItem from '@theme/NavbarItem/DropdownNavbarItem';
-
 const getVersionMainDoc = (version) =>
   version.docs.find((doc) => doc.id === version.mainDocId);
-
 export default function DocsVersionDropdownNavbarItem({
   mobile,
   docsPluginId,
@@ -50,8 +48,8 @@ export default function DocsVersionDropdownNavbarItem({
     ...versionLinks,
     ...dropdownItemsAfter,
   ];
-  const dropdownVersion = useDocsVersionCandidates(docsPluginId)[0]; // Mobile dropdown is handled a bit differently
-
+  const dropdownVersion = useDocsVersionCandidates(docsPluginId)[0];
+  // Mobile dropdown is handled a bit differently
   const dropdownLabel =
     mobile && items.length > 1
       ? translate({
@@ -64,10 +62,10 @@ export default function DocsVersionDropdownNavbarItem({
   const dropdownTo =
     mobile && items.length > 1
       ? undefined
-      : getVersionMainDoc(dropdownVersion).path; // We don't want to render a version dropdown with 0 or 1 item. If we build
+      : getVersionMainDoc(dropdownVersion).path;
+  // We don't want to render a version dropdown with 0 or 1 item. If we build
   // the site with a single docs version (onlyIncludeVersions: ['1.0.0']),
   // We'd rather render a button instead of a dropdown
-
   if (items.length <= 1) {
     return (
       <DefaultNavbarItem
@@ -79,7 +77,6 @@ export default function DocsVersionDropdownNavbarItem({
       />
     );
   }
-
   return (
     <DropdownNavbarItem
       {...props}

package/lib/theme/NavbarItem/DocsVersionNavbarItem.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/NavbarItem/DocsVersionNavbarItem';
+export default function DocsVersionNavbarItem({ label: staticLabel, to: staticTo, docsPluginId, ...props }: Props): JSX.Element;

package/{lib-next → lib}/theme/NavbarItem/DocsVersionNavbarItem.js

@@ -7,10 +7,8 @@
 import React from 'react';
 import {useDocsVersionCandidates} from '@docusaurus/theme-common';
 import DefaultNavbarItem from '@theme/NavbarItem/DefaultNavbarItem';
-
 const getVersionMainDoc = (version) =>
   version.docs.find((doc) => doc.id === version.mainDocId);
-
 export default function DocsVersionNavbarItem({
   label: staticLabel,
   to: staticTo,

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

package/{lib-next → lib}/theme/NavbarItem/DropdownNavbarItem.js

@@ -16,27 +16,21 @@ import {
 import NavbarNavLink from '@theme/NavbarItem/NavbarNavLink';
 import NavbarItem from '@theme/NavbarItem';
 const dropdownLinkActiveClass = 'dropdown__link--active';
-
 function isItemActive(item, localPathname) {
   if (isSamePath(item.to, localPathname)) {
     return true;
   }
-
   if (isRegexpStringMatch(item.activeBaseRegex, localPathname)) {
     return true;
   }
-
   if (item.activeBasePath && localPathname.startsWith(item.activeBasePath)) {
     return true;
   }
-
   return false;
 }
-
 function containsActiveItems(items, localPathname) {
   return items.some((item) => isItemActive(item, localPathname));
 }
-
 function DropdownNavbarItemDesktop({items, position, className, ...props}) {
   const dropdownRef = useRef(null);
   const [showDropdown, setShowDropdown] = useState(false);
@@ -45,10 +39,8 @@ function DropdownNavbarItemDesktop({items, position, className, ...props}) {
       if (!dropdownRef.current || dropdownRef.current.contains(event.target)) {
         return;
       }
-
       setShowDropdown(false);
     };
-
     document.addEventListener('mousedown', handleClickOutside);
     document.addEventListener('touchstart', handleClickOutside);
     return () => {
@@ -88,12 +80,12 @@ function DropdownNavbarItemDesktop({items, position, className, ...props}) {
                 e.preventDefault();
                 setShowDropdown(false);
                 const nextNavbarItem = dropdownRef.current.nextElementSibling;
-
                 if (nextNavbarItem) {
                   const targetItem =
                     nextNavbarItem instanceof HTMLAnchorElement
-                      ? nextNavbarItem // Next item is another dropdown; focus on the inner
-                      : // anchor element instead so there's outline
+                      ? nextNavbarItem
+                      : // Next item is another dropdown; focus on the inner
+                        // anchor element instead so there's outline
                         nextNavbarItem.querySelector('a');
                   targetItem.focus();
                 }
@@ -108,20 +100,18 @@ function DropdownNavbarItemDesktop({items, position, className, ...props}) {
     </div>
   );
 }
-
 function DropdownNavbarItemMobile({
   items,
   className,
-  position,
-  // Need to destructure position from props so that it doesn't get passed on.
+  position, // Need to destructure position from props so that it doesn't get passed on.
   ...props
 }) {
   const localPathname = useLocalPathname();
   const containsActive = containsActiveItems(items, localPathname);
   const {collapsed, toggleCollapsed, setCollapsed} = useCollapsible({
     initialState: () => !containsActive,
-  }); // Expand/collapse if any item active after a navigation
-
+  });
+  // Expand/collapse if any item active after a navigation
   useEffect(() => {
     if (containsActive) {
       setCollapsed(!containsActive);
@@ -160,7 +150,6 @@ function DropdownNavbarItemMobile({
     </li>
   );
 }
-
 export default function DropdownNavbarItem({mobile = false, ...props}) {
   const Comp = mobile ? DropdownNavbarItemMobile : DropdownNavbarItemDesktop;
   return <Comp {...props} />;

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

package/{lib-next → lib}/theme/NavbarItem/HtmlNavbarItem.js

@@ -22,9 +22,7 @@ export default function HtmlNavbarItem({
         },
         className,
       )}
-      dangerouslySetInnerHTML={{
-        __html: value,
-      }}
+      dangerouslySetInnerHTML={{__html: value}}
     />
   );
 }

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

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

@@ -35,8 +35,8 @@ export default function LocaleDropdownNavbarItem({
       className: locale === currentLocale ? 'dropdown__link--active' : '',
     };
   });
-  const items = [...dropdownItemsBefore, ...localeItems, ...dropdownItemsAfter]; // Mobile is handled a bit differently
-
+  const items = [...dropdownItemsBefore, ...localeItems, ...dropdownItemsAfter];
+  // Mobile is handled a bit differently
   const dropdownLabel = mobile
     ? translate({
         message: 'Languages',

package/lib/theme/NavbarItem/NavbarNavLink.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/NavbarItem/NavbarNavLink';
+export default function NavbarNavLink({ activeBasePath, activeBaseRegex, to, href, label, html, activeClassName, prependBaseUrlToHref, ...props }: Props): JSX.Element;

package/{lib-next → lib}/theme/NavbarItem/NavbarNavLink.js

@@ -26,34 +26,24 @@ export default function NavbarNavLink({
   // {to: 'version'} should probably be forbidden, in favor of {to: '/version'}
   const toUrl = useBaseUrl(to);
   const activeBaseUrl = useBaseUrl(activeBasePath);
-  const normalizedHref = useBaseUrl(href, {
-    forcePrependBaseUrl: true,
-  });
+  const normalizedHref = useBaseUrl(href, {forcePrependBaseUrl: true});
   const isExternalLink = label && href && !isInternalUrl(href);
-  const isDropdownLink = activeClassName === dropdownLinkActiveClass; // Link content is set through html XOR label
-
+  const isDropdownLink = activeClassName === dropdownLinkActiveClass;
+  // Link content is set through html XOR label
   const linkContentProps = html
-    ? {
-        dangerouslySetInnerHTML: {
-          __html: html,
-        },
-      }
+    ? {dangerouslySetInnerHTML: {__html: html}}
     : {
         children: (
           <>
             {label}
             {isExternalLink && (
               <IconExternalLink
-                {...(isDropdownLink && {
-                  width: 12,
-                  height: 12,
-                })}
+                {...(isDropdownLink && {width: 12, height: 12})}
               />
             )}
           </>
         ),
       };
-
   if (href) {
     return (
       <Link
@@ -63,7 +53,6 @@ export default function NavbarNavLink({
       />
     );
   }
-
   return (
     <Link
       to={toUrl}

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

package/{lib-next → lib}/theme/NavbarItem/SearchNavbarItem.js

@@ -11,7 +11,6 @@ export default function SearchNavbarItem({mobile}) {
   if (mobile) {
     return null;
   }
-
   return (
     <NavbarSearch>
       <SearchBar />

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

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

@@ -6,27 +6,21 @@
  */
 import React from 'react';
 import ComponentTypes from '@theme/NavbarItem/ComponentTypes';
-
 const getNavbarItemComponent = (type) => {
   const component = ComponentTypes[type];
-
   if (!component) {
     throw new Error(`No NavbarItem component found for type "${type}".`);
   }
-
   return component;
 };
-
 function getComponentType(type, isDropdown) {
   // Backward compatibility: navbar item with no type set
   // but containing dropdown items should use the type "dropdown"
   if (!type || type === 'default') {
     return isDropdown ? 'dropdown' : 'default';
   }
-
   return type;
 }
-
 export default function NavbarItem({type, ...props}) {
   const componentType = getComponentType(type, props.items !== undefined);
   const NavbarItemComponent = getNavbarItemComponent(componentType);

package/lib/theme/NavbarItem/utils.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 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.
+ */
+export declare const getInfimaActiveClassName: (mobile?: boolean | undefined) => `${'menu' | 'navbar'}__link--active`;

package/{lib-next → lib}/theme/NavbarItem/utils.js

@@ -4,7 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 /* eslint-disable import/no-named-export */
 export const getInfimaActiveClassName = (mobile) =>
   mobile ? 'menu__link--active' : 'navbar__link--active';

package/lib/theme/NotFound.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 NotFound(): JSX.Element;

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

package/lib/theme/SearchBar.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 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.
+ */
+export { default } from '@docusaurus/Noop';

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

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

@@ -18,9 +18,9 @@ export default function SearchMetadata({locale, version, tag}) {
   return (
     <Head>
       {/*
-      Docusaurus metadata, used by third-party search plugin
-      See https://github.com/cmfcmf/docusaurus-search-local/issues/99
-      */}
+        Docusaurus metadata, used by third-party search plugin
+        See https://github.com/cmfcmf/docusaurus-search-local/issues/99
+        */}
       {locale && <meta name="docusaurus_locale" content={locale} />}
       {version && <meta name="docusaurus_version" content={version} />}
       {tag && <meta name="docusaurus_tag" content={tag} />}

package/lib/theme/SiteMetadata/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 SiteMetadata(): JSX.Element;

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

@@ -16,18 +16,18 @@ import {
   keyboardFocusedClassName,
 } from '@docusaurus/theme-common';
 import {useLocation} from '@docusaurus/router';
-import SearchMetadata from '@theme/SearchMetadata'; // TODO move to SiteMetadataDefaults or theme-common ?
+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}) {