@docusaurus/theme-classic 2.4.0 → 2.4.3

package/lib/theme/BlogPostItem/Container/index.js

@@ -8,17 +8,26 @@ import React from 'react';
 import {useBaseUrlUtils} from '@docusaurus/useBaseUrl';
 import {useBlogPost} from '@docusaurus/theme-common/internal';
 export default function BlogPostItemContainer({children, className}) {
-  const {frontMatter, assets} = useBlogPost();
+  const {
+    frontMatter,
+    assets,
+    metadata: {description},
+  } = useBlogPost();
   const {withBaseUrl} = useBaseUrlUtils();
   const image = assets.image ?? frontMatter.image;
+  const keywords = frontMatter.keywords ?? [];
   return (
     <article
       className={className}
       itemProp="blogPost"
       itemScope
       itemType="http://schema.org/BlogPosting">
+      {description && <meta itemProp="description" content={description} />}
       {image && (
-        <meta itemProp="image" content={withBaseUrl(image, {absolute: true})} />
+        <link itemProp="image" href={withBaseUrl(image, {absolute: true})} />
+      )}
+      {keywords.length > 0 && (
+        <meta itemProp="keywords" content={keywords.join(',')} />
       )}
       {children}
     </article>

package/lib/theme/BlogPostItem/Header/Author/index.js

@@ -20,7 +20,12 @@ export default function BlogPostItemHeaderAuthor({author, className}) {
     <div className={clsx('avatar margin-bottom--sm', className)}>
       {imageURL && (
         <MaybeLink href={link} className="avatar__photo-link">
-          <img className="avatar__photo" src={imageURL} alt={name} />
+          <img
+            className="avatar__photo"
+            src={imageURL}
+            alt={name}
+            itemProp="image"
+          />
         </MaybeLink>
       )}
 

package/lib/theme/CodeBlock/CopyButton/index.js

@@ -9,6 +9,8 @@ import clsx from 'clsx';
 // @ts-expect-error: TODO, we need to make theme-classic have type: module
 import copy from 'copy-text-to-clipboard';
 import {translate} from '@docusaurus/Translate';
+import IconCopy from '@theme/Icon/Copy';
+import IconSuccess from '@theme/Icon/Success';
 import styles from './styles.module.css';
 export default function CopyButton({code, className}) {
   const [isCopied, setIsCopied] = useState(false);
@@ -50,12 +52,8 @@ export default function CopyButton({code, className}) {
       )}
       onClick={handleCopyCode}>
       <span className={styles.copyButtonIcons} aria-hidden="true">
-        <svg className={styles.copyButtonIcon} viewBox="0 0 24 24">
-          <path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" />
-        </svg>
-        <svg className={styles.copyButtonSuccessIcon} viewBox="0 0 24 24">
-          <path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" />
-        </svg>
+        <IconCopy className={styles.copyButtonIcon} />
+        <IconSuccess className={styles.copyButtonSuccessIcon} />
       </span>
     </button>
   );

package/lib/theme/CodeBlock/WordWrapButton/index.js

@@ -7,6 +7,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import {translate} from '@docusaurus/Translate';
+import IconWordWrap from '@theme/Icon/WordWrap';
 import styles from './styles.module.css';
 export default function WordWrapButton({className, onClick, isEnabled}) {
   const title = translate({
@@ -26,15 +27,7 @@ export default function WordWrapButton({className, onClick, isEnabled}) {
       )}
       aria-label={title}
       title={title}>
-      <svg
-        className={styles.wordWrapButtonIcon}
-        viewBox="0 0 24 24"
-        aria-hidden="true">
-        <path
-          fill="currentColor"
-          d="M4 19h6v-2H4v2zM20 5H4v2h16V5zm-3 6H4v2h13.25c1.1 0 2 .9 2 2s-.9 2-2 2H15v-2l-3 3l3 3v-2h2c2.21 0 4-1.79 4-4s-1.79-4-4-4z"
-        />
-      </svg>
+      <IconWordWrap className={styles.wordWrapButtonIcon} aria-hidden="true" />
     </button>
   );
 }

package/lib/theme/DocPage/Layout/Sidebar/index.js

@@ -6,7 +6,7 @@
  */
 import React, {useState, useCallback} from 'react';
 import clsx from 'clsx';
-import {ThemeClassNames} from '@docusaurus/theme-common';
+import {prefersReducedMotion, ThemeClassNames} from '@docusaurus/theme-common';
 import {useDocsSidebar} from '@docusaurus/theme-common/internal';
 import {useLocation} from '@docusaurus/router';
 import DocSidebar from '@theme/DocSidebar';
@@ -34,6 +34,11 @@ export default function DocPageLayoutSidebar({
     if (hiddenSidebar) {
       setHiddenSidebar(false);
     }
+    // onTransitionEnd won't fire when sidebar animation is disabled
+    // fixes https://github.com/facebook/docusaurus/issues/8918
+    if (!hiddenSidebar && prefersReducedMotion()) {
+      setHiddenSidebar(true);
+    }
     setHiddenSidebarContainer((value) => !value);
   }, [setHiddenSidebarContainer, hiddenSidebar]);
   return (

package/lib/theme/DocPage/Layout/styles.module.css

@@ -15,3 +15,11 @@
   display: flex;
   flex: 1 0 auto;
 }
+
+/*
+JS disabled??? Show light version by default => better than showing nothing
+TODO bad, but we currently always show light mode when there's no data-theme
+ */
+html:not([data-theme]) .themedComponent--light {
+  display: initial;
+}

package/lib/theme/DocPaginator/index.js

@@ -14,7 +14,7 @@ export default function DocPaginator(props) {
       className="pagination-nav docusaurus-mt-lg"
       aria-label={translate({
         id: 'theme.docs.paginator.navAriaLabel',
-        message: 'Docs pages navigation',
+        message: 'Docs pages',
         description: 'The ARIA label for the docs pagination',
       })}>
       {previous && (

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

package/lib/theme/Icon/Copy/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 IconCopy(props) {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"
+      />
+    </svg>
+  );
+}

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

package/lib/theme/Icon/Success/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 IconSuccess(props) {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"
+      />
+    </svg>
+  );
+}

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

package/lib/theme/Icon/WordWrap/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 IconWordWrap(props) {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M4 19h6v-2H4v2zM20 5H4v2h16V5zm-3 6H4v2h13.25c1.1 0 2 .9 2 2s-.9 2-2 2H15v-2l-3 3l3 3v-2h2c2.21 0 4-1.79 4-4s-1.79-4-4-4z"
+      />
+    </svg>
+  );
+}

package/lib/theme/MDXComponents/Ul/index.js

@@ -8,6 +8,10 @@ import React from 'react';
 import clsx from 'clsx';
 import styles from './styles.module.css';
 function transformUlClassName(className) {
+  // Fix https://github.com/facebook/docusaurus/issues/9098
+  if (typeof className === 'undefined') {
+    return undefined;
+  }
   return clsx(
     className,
     // This class is set globally by GitHub/MDX. We keep the global class, and

package/lib/theme/SiteMetadata/index.js

@@ -15,6 +15,7 @@ import {
   keyboardFocusedClassName,
 } from '@docusaurus/theme-common/internal';
 import {useLocation} from '@docusaurus/router';
+import {applyTrailingSlash} from '@docusaurus/utils-common';
 import SearchMetadata from '@theme/SearchMetadata';
 // TODO move to SiteMetadataDefaults or theme-common ?
 // Useful for i18n/SEO
@@ -54,10 +55,16 @@ function AlternateLangHeaders() {
 // Default canonical url inferred from current page location pathname
 function useDefaultCanonicalUrl() {
   const {
-    siteConfig: {url: siteUrl},
+    siteConfig: {url: siteUrl, baseUrl, trailingSlash},
   } = useDocusaurusContext();
+  // TODO using useLocation().pathname is not a super idea
+  // See https://github.com/facebook/docusaurus/issues/9170
   const {pathname} = useLocation();
-  return siteUrl + useBaseUrl(pathname);
+  const canonicalPathname = applyTrailingSlash(useBaseUrl(pathname), {
+    trailingSlash,
+    baseUrl,
+  });
+  return siteUrl + canonicalPathname;
 }
 // TODO move to SiteMetadataDefaults or theme-common ?
 function CanonicalUrlHeaders({permalink}) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docusaurus/theme-classic",
-  "version": "2.4.0",
+  "version": "2.4.3",
   "description": "Classic theme for Docusaurus",
   "main": "lib/index.js",
   "types": "src/theme-classic.d.ts",
@@ -20,18 +20,18 @@
     "copy:watch": "node ../../admin/scripts/copyUntypedFiles.js --watch"
   },
   "dependencies": {
-    "@docusaurus/core": "2.4.0",
-    "@docusaurus/mdx-loader": "2.4.0",
-    "@docusaurus/module-type-aliases": "2.4.0",
-    "@docusaurus/plugin-content-blog": "2.4.0",
-    "@docusaurus/plugin-content-docs": "2.4.0",
-    "@docusaurus/plugin-content-pages": "2.4.0",
-    "@docusaurus/theme-common": "2.4.0",
-    "@docusaurus/theme-translations": "2.4.0",
-    "@docusaurus/types": "2.4.0",
-    "@docusaurus/utils": "2.4.0",
-    "@docusaurus/utils-common": "2.4.0",
-    "@docusaurus/utils-validation": "2.4.0",
+    "@docusaurus/core": "2.4.3",
+    "@docusaurus/mdx-loader": "2.4.3",
+    "@docusaurus/module-type-aliases": "2.4.3",
+    "@docusaurus/plugin-content-blog": "2.4.3",
+    "@docusaurus/plugin-content-docs": "2.4.3",
+    "@docusaurus/plugin-content-pages": "2.4.3",
+    "@docusaurus/theme-common": "2.4.3",
+    "@docusaurus/theme-translations": "2.4.3",
+    "@docusaurus/types": "2.4.3",
+    "@docusaurus/utils": "2.4.3",
+    "@docusaurus/utils-common": "2.4.3",
+    "@docusaurus/utils-validation": "2.4.3",
     "@mdx-js/react": "^1.6.22",
     "clsx": "^1.2.1",
     "copy-text-to-clipboard": "^3.0.1",
@@ -62,5 +62,5 @@
   "engines": {
     "node": ">=16.14"
   },
-  "gitHead": "898b85ef134cc43bf3b1209aad0ca8cdcfb214c5"
+  "gitHead": "56410aa94665699f75cb889f477ccdffb98f2b21"
 }

package/src/theme/BlogPostItem/Container/index.tsx

@@ -14,17 +14,26 @@ export default function BlogPostItemContainer({
   children,
   className,
 }: Props): JSX.Element {
-  const {frontMatter, assets} = useBlogPost();
+  const {
+    frontMatter,
+    assets,
+    metadata: {description},
+  } = useBlogPost();
   const {withBaseUrl} = useBaseUrlUtils();
   const image = assets.image ?? frontMatter.image;
+  const keywords = frontMatter.keywords ?? [];
   return (
     <article
       className={className}
       itemProp="blogPost"
       itemScope
       itemType="http://schema.org/BlogPosting">
+      {description && <meta itemProp="description" content={description} />}
       {image && (
-        <meta itemProp="image" content={withBaseUrl(image, {absolute: true})} />
+        <link itemProp="image" href={withBaseUrl(image, {absolute: true})} />
+      )}
+      {keywords.length > 0 && (
+        <meta itemProp="keywords" content={keywords.join(',')} />
       )}
       {children}
     </article>

package/src/theme/BlogPostItem/Header/Author/index.tsx

@@ -28,7 +28,12 @@ export default function BlogPostItemHeaderAuthor({
     <div className={clsx('avatar margin-bottom--sm', className)}>
       {imageURL && (
         <MaybeLink href={link} className="avatar__photo-link">
-          <img className="avatar__photo" src={imageURL} alt={name} />
+          <img
+            className="avatar__photo"
+            src={imageURL}
+            alt={name}
+            itemProp="image"
+          />
         </MaybeLink>
       )}
 

package/src/theme/CodeBlock/CopyButton/index.tsx

@@ -11,6 +11,8 @@ import clsx from 'clsx';
 import copy from 'copy-text-to-clipboard';
 import {translate} from '@docusaurus/Translate';
 import type {Props} from '@theme/CodeBlock/CopyButton';
+import IconCopy from '@theme/Icon/Copy';
+import IconSuccess from '@theme/Icon/Success';
 
 import styles from './styles.module.css';
 
@@ -56,12 +58,8 @@ export default function CopyButton({code, className}: Props): JSX.Element {
       )}
       onClick={handleCopyCode}>
       <span className={styles.copyButtonIcons} aria-hidden="true">
-        <svg className={styles.copyButtonIcon} viewBox="0 0 24 24">
-          <path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" />
-        </svg>
-        <svg className={styles.copyButtonSuccessIcon} viewBox="0 0 24 24">
-          <path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" />
-        </svg>
+        <IconCopy className={styles.copyButtonIcon} />
+        <IconSuccess className={styles.copyButtonSuccessIcon} />
       </span>
     </button>
   );

package/src/theme/CodeBlock/WordWrapButton/index.tsx

@@ -9,6 +9,7 @@ import React from 'react';
 import clsx from 'clsx';
 import {translate} from '@docusaurus/Translate';
 import type {Props} from '@theme/CodeBlock/WordWrapButton';
+import IconWordWrap from '@theme/Icon/WordWrap';
 
 import styles from './styles.module.css';
 
@@ -35,15 +36,7 @@ export default function WordWrapButton({
       )}
       aria-label={title}
       title={title}>
-      <svg
-        className={styles.wordWrapButtonIcon}
-        viewBox="0 0 24 24"
-        aria-hidden="true">
-        <path
-          fill="currentColor"
-          d="M4 19h6v-2H4v2zM20 5H4v2h16V5zm-3 6H4v2h13.25c1.1 0 2 .9 2 2s-.9 2-2 2H15v-2l-3 3l3 3v-2h2c2.21 0 4-1.79 4-4s-1.79-4-4-4z"
-        />
-      </svg>
+      <IconWordWrap className={styles.wordWrapButtonIcon} aria-hidden="true" />
     </button>
   );
 }

package/src/theme/DocPage/Layout/Sidebar/index.tsx

@@ -7,7 +7,7 @@
 
 import React, {type ReactNode, useState, useCallback} from 'react';
 import clsx from 'clsx';
-import {ThemeClassNames} from '@docusaurus/theme-common';
+import {prefersReducedMotion, ThemeClassNames} from '@docusaurus/theme-common';
 import {useDocsSidebar} from '@docusaurus/theme-common/internal';
 import {useLocation} from '@docusaurus/router';
 import DocSidebar from '@theme/DocSidebar';
@@ -40,6 +40,11 @@ export default function DocPageLayoutSidebar({
     if (hiddenSidebar) {
       setHiddenSidebar(false);
     }
+    // onTransitionEnd won't fire when sidebar animation is disabled
+    // fixes https://github.com/facebook/docusaurus/issues/8918
+    if (!hiddenSidebar && prefersReducedMotion()) {
+      setHiddenSidebar(true);
+    }
     setHiddenSidebarContainer((value) => !value);
   }, [setHiddenSidebarContainer, hiddenSidebar]);
 

package/src/theme/DocPage/Layout/styles.module.css

@@ -15,3 +15,11 @@
   display: flex;
   flex: 1 0 auto;
 }
+
+/*
+JS disabled??? Show light version by default => better than showing nothing
+TODO bad, but we currently always show light mode when there's no data-theme
+ */
+html:not([data-theme]) .themedComponent--light {
+  display: initial;
+}

package/src/theme/DocPaginator/index.tsx

@@ -17,7 +17,7 @@ export default function DocPaginator(props: Props): JSX.Element {
       className="pagination-nav docusaurus-mt-lg"
       aria-label={translate({
         id: 'theme.docs.paginator.navAriaLabel',
-        message: 'Docs pages navigation',
+        message: 'Docs pages',
         description: 'The ARIA label for the docs pagination',
       })}>
       {previous && (

package/src/theme/Icon/Copy/index.tsx

@@ -0,0 +1,20 @@
+/**
+ * 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/Icon/Copy';
+
+export default function IconCopy(props: Props): JSX.Element {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"
+      />
+    </svg>
+  );
+}

package/src/theme/Icon/Success/index.tsx

@@ -0,0 +1,20 @@
+/**
+ * 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/Icon/Success';
+
+export default function IconSuccess(props: Props): JSX.Element {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"
+      />
+    </svg>
+  );
+}

package/src/theme/Icon/WordWrap/index.tsx

@@ -0,0 +1,20 @@
+/**
+ * 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/Icon/WordWrap';
+
+export default function IconWordWrap(props: Props): JSX.Element {
+  return (
+    <svg viewBox="0 0 24 24" {...props}>
+      <path
+        fill="currentColor"
+        d="M4 19h6v-2H4v2zM20 5H4v2h16V5zm-3 6H4v2h13.25c1.1 0 2 .9 2 2s-.9 2-2 2H15v-2l-3 3l3 3v-2h2c2.21 0 4-1.79 4-4s-1.79-4-4-4z"
+      />
+    </svg>
+  );
+}

package/src/theme/MDXComponents/Ul/index.tsx

@@ -11,7 +11,11 @@ import type {Props} from '@theme/MDXComponents/Ul';
 
 import styles from './styles.module.css';
 
-function transformUlClassName(className?: string): string {
+function transformUlClassName(className?: string): string | undefined {
+  // Fix https://github.com/facebook/docusaurus/issues/9098
+  if (typeof className === 'undefined') {
+    return undefined;
+  }
   return clsx(
     className,
     // This class is set globally by GitHub/MDX. We keep the global class, and

package/src/theme/SiteMetadata/index.tsx

@@ -16,6 +16,7 @@ import {
   keyboardFocusedClassName,
 } from '@docusaurus/theme-common/internal';
 import {useLocation} from '@docusaurus/router';
+import {applyTrailingSlash} from '@docusaurus/utils-common';
 import SearchMetadata from '@theme/SearchMetadata';
 
 // TODO move to SiteMetadataDefaults or theme-common ?
@@ -58,10 +59,19 @@ function AlternateLangHeaders(): JSX.Element {
 // Default canonical url inferred from current page location pathname
 function useDefaultCanonicalUrl() {
   const {
-    siteConfig: {url: siteUrl},
+    siteConfig: {url: siteUrl, baseUrl, trailingSlash},
   } = useDocusaurusContext();
+
+  // TODO using useLocation().pathname is not a super idea
+  // See https://github.com/facebook/docusaurus/issues/9170
   const {pathname} = useLocation();
-  return siteUrl + useBaseUrl(pathname);
+
+  const canonicalPathname = applyTrailingSlash(useBaseUrl(pathname), {
+    trailingSlash,
+    baseUrl,
+  });
+
+  return siteUrl + canonicalPathname;
 }
 
 // TODO move to SiteMetadataDefaults or theme-common ?

package/src/theme-classic.d.ts

@@ -1322,6 +1322,14 @@ declare module '@theme/Icon/Close' {
   export default function IconClose(props: Props): JSX.Element;
 }
 
+declare module '@theme/Icon/Copy' {
+  import type {ComponentProps} from 'react';
+
+  export interface Props extends ComponentProps<'svg'> {}
+
+  export default function IconCopy(props: Props): JSX.Element;
+}
+
 declare module '@theme/Icon/Language' {
   import type {ComponentProps} from 'react';
 
@@ -1330,6 +1338,14 @@ declare module '@theme/Icon/Language' {
   export default function IconLanguage(props: Props): JSX.Element;
 }
 
+declare module '@theme/Icon/Success' {
+  import type {ComponentProps} from 'react';
+
+  export interface Props extends ComponentProps<'svg'> {}
+
+  export default function IconSuccess(props: Props): JSX.Element;
+}
+
 declare module '@theme/Icon/ExternalLink' {
   import type {ComponentProps} from 'react';
 
@@ -1338,6 +1354,14 @@ declare module '@theme/Icon/ExternalLink' {
   export default function IconExternalLink(props: Props): JSX.Element;
 }
 
+declare module '@theme/Icon/WordWrap' {
+  import type {ComponentProps} from 'react';
+
+  export interface Props extends ComponentProps<'svg'> {}
+
+  export default function IconWordWrap(props: Props): JSX.Element;
+}
+
 declare module '@theme/TagsListByLetter' {
   import type {TagsListItem} from '@docusaurus/utils';