@docusaurus/theme-classic 3.6.3-canary-6175 → 3.6.3-canary-6178

package/lib/options.js

@@ -271,6 +271,7 @@ const FooterLinkItemSchema = utils_validation_1.Joi.object({
     href: utils_validation_1.URISchema,
     html: utils_validation_1.Joi.string(),
     label: utils_validation_1.Joi.string(),
+    className: utils_validation_1.Joi.string(),
 })
     .xor('to', 'href', 'html')
     .with('to', 'label')
@@ -279,6 +280,11 @@ const FooterLinkItemSchema = utils_validation_1.Joi.object({
     // We allow any unknown attributes on the links (users may need additional
     // attributes like target, aria-role, data-customAttribute...)
     .unknown();
+const FooterColumnItemSchema = utils_validation_1.Joi.object({
+    title: utils_validation_1.Joi.string().allow(null).default(null),
+    className: utils_validation_1.Joi.string(),
+    items: utils_validation_1.Joi.array().items(FooterLinkItemSchema).default([]),
+});
 const LogoSchema = utils_validation_1.Joi.object({
     alt: utils_validation_1.Joi.string().allow(''),
     src: utils_validation_1.Joi.string().required(),
@@ -340,10 +346,7 @@ exports.ThemeConfigSchema = utils_validation_1.Joi.object({
         style: utils_validation_1.Joi.string().equal('dark', 'light').default('light'),
         logo: LogoSchema,
         copyright: utils_validation_1.Joi.string(),
-        links: utils_validation_1.Joi.alternatives(utils_validation_1.Joi.array().items(utils_validation_1.Joi.object({
-            title: utils_validation_1.Joi.string().allow(null).default(null),
-            items: utils_validation_1.Joi.array().items(FooterLinkItemSchema).default([]),
-        })), utils_validation_1.Joi.array().items(FooterLinkItemSchema))
+        links: utils_validation_1.Joi.alternatives(utils_validation_1.Joi.array().items(FooterColumnItemSchema), utils_validation_1.Joi.array().items(FooterLinkItemSchema))
             .messages({
             'alternatives.match': `The footer must be either simple or multi-column, and not a mix of the two. See: https://docusaurus.io/docs/api/themes/configuration#footer-links`,
         })

package/lib/theme/Footer/LinkItem/index.js

@@ -5,17 +5,18 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
+import clsx from 'clsx';
 import Link from '@docusaurus/Link';
 import useBaseUrl from '@docusaurus/useBaseUrl';
 import isInternalUrl from '@docusaurus/isInternalUrl';
 import IconExternalLink from '@theme/Icon/ExternalLink';
 export default function FooterLinkItem({item}) {
-  const {to, href, label, prependBaseUrlToHref, ...props} = item;
+  const {to, href, label, prependBaseUrlToHref, className, ...props} = item;
   const toUrl = useBaseUrl(to);
   const normalizedHref = useBaseUrl(href, {forcePrependBaseUrl: true});
   return (
     <Link
-      className="footer__link-item"
+      className={clsx('footer__link-item', className)}
       {...(href
         ? {
             href: prependBaseUrlToHref ? normalizedHref : href,

package/lib/theme/Footer/Links/MultiColumn/index.js

@@ -5,11 +5,12 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
+import clsx from 'clsx';
 import LinkItem from '@theme/Footer/LinkItem';
 function ColumnLinkItem({item}) {
   return item.html ? (
     <li
-      className="footer__item"
+      className={clsx('footer__item', item.className)}
       // Developer provided the HTML, so assume it's safe.
       // eslint-disable-next-line react/no-danger
       dangerouslySetInnerHTML={{__html: item.html}}
@@ -22,7 +23,7 @@ function ColumnLinkItem({item}) {
 }
 function Column({column}) {
   return (
-    <div className="col footer__col">
+    <div className={clsx('col footer__col', column.className)}>
       <div className="footer__title">{column.title}</div>
       <ul className="footer__items clean-list">
         {column.items.map((item, i) => (

package/lib/theme/Footer/Links/Simple/index.js

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
+import clsx from 'clsx';
 import LinkItem from '@theme/Footer/LinkItem';
 function Separator() {
   return <span className="footer__link-separator">·</span>;
@@ -12,7 +13,7 @@ function Separator() {
 function SimpleLinkItem({item}) {
   return item.html ? (
     <span
-      className="footer__link-item"
+      className={clsx('footer__link-item', item.className)}
       // Developer provided the HTML, so assume it's safe.
       // eslint-disable-next-line react/no-danger
       dangerouslySetInnerHTML={{__html: item.html}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docusaurus/theme-classic",
-  "version": "3.6.3-canary-6175",
+  "version": "3.6.3-canary-6178",
   "description": "Classic theme for Docusaurus",
   "main": "lib/index.js",
   "types": "src/theme-classic.d.ts",
@@ -20,19 +20,19 @@
     "copy:watch": "node ../../admin/scripts/copyUntypedFiles.js --watch"
   },
   "dependencies": {
-    "@docusaurus/core": "3.6.3-canary-6175",
-    "@docusaurus/logger": "3.6.3-canary-6175",
-    "@docusaurus/mdx-loader": "3.6.3-canary-6175",
-    "@docusaurus/module-type-aliases": "3.6.3-canary-6175",
-    "@docusaurus/plugin-content-blog": "3.6.3-canary-6175",
-    "@docusaurus/plugin-content-docs": "3.6.3-canary-6175",
-    "@docusaurus/plugin-content-pages": "3.6.3-canary-6175",
-    "@docusaurus/theme-common": "3.6.3-canary-6175",
-    "@docusaurus/theme-translations": "3.6.3-canary-6175",
-    "@docusaurus/types": "3.6.3-canary-6175",
-    "@docusaurus/utils": "3.6.3-canary-6175",
-    "@docusaurus/utils-common": "3.6.3-canary-6175",
-    "@docusaurus/utils-validation": "3.6.3-canary-6175",
+    "@docusaurus/core": "3.6.3-canary-6178",
+    "@docusaurus/logger": "3.6.3-canary-6178",
+    "@docusaurus/mdx-loader": "3.6.3-canary-6178",
+    "@docusaurus/module-type-aliases": "3.6.3-canary-6178",
+    "@docusaurus/plugin-content-blog": "3.6.3-canary-6178",
+    "@docusaurus/plugin-content-docs": "3.6.3-canary-6178",
+    "@docusaurus/plugin-content-pages": "3.6.3-canary-6178",
+    "@docusaurus/theme-common": "3.6.3-canary-6178",
+    "@docusaurus/theme-translations": "3.6.3-canary-6178",
+    "@docusaurus/types": "3.6.3-canary-6178",
+    "@docusaurus/utils": "3.6.3-canary-6178",
+    "@docusaurus/utils-common": "3.6.3-canary-6178",
+    "@docusaurus/utils-validation": "3.6.3-canary-6178",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
     "copy-text-to-clipboard": "^3.2.0",
@@ -56,11 +56,11 @@
     "utility-types": "^3.10.0"
   },
   "peerDependencies": {
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0"
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
   },
   "engines": {
     "node": ">=18.0"
   },
-  "gitHead": "6379e15ec19a06688a04753a96e7d0710745fa77"
+  "gitHead": "96c269d1cb6dcc96cd643ec8f06a8ed9db66d05e"
 }

package/src/options.ts

@@ -308,6 +308,7 @@ const FooterLinkItemSchema = Joi.object({
   href: URISchema,
   html: Joi.string(),
   label: Joi.string(),
+  className: Joi.string(),
 })
   .xor('to', 'href', 'html')
   .with('to', 'label')
@@ -317,6 +318,12 @@ const FooterLinkItemSchema = Joi.object({
   // attributes like target, aria-role, data-customAttribute...)
   .unknown();
 
+const FooterColumnItemSchema = Joi.object({
+  title: Joi.string().allow(null).default(null),
+  className: Joi.string(),
+  items: Joi.array().items(FooterLinkItemSchema).default([]),
+});
+
 const LogoSchema = Joi.object({
   alt: Joi.string().allow(''),
   src: Joi.string().required(),
@@ -384,12 +391,7 @@ export const ThemeConfigSchema = Joi.object<ThemeConfig>({
     logo: LogoSchema,
     copyright: Joi.string(),
     links: Joi.alternatives(
-      Joi.array().items(
-        Joi.object({
-          title: Joi.string().allow(null).default(null),
-          items: Joi.array().items(FooterLinkItemSchema).default([]),
-        }),
-      ),
+      Joi.array().items(FooterColumnItemSchema),
       Joi.array().items(FooterLinkItemSchema),
     )
       .messages({

package/src/theme/Footer/LinkItem/index.tsx

@@ -6,7 +6,7 @@
  */
 
 import React, {type ReactNode} from 'react';
-
+import clsx from 'clsx';
 import Link from '@docusaurus/Link';
 import useBaseUrl from '@docusaurus/useBaseUrl';
 import isInternalUrl from '@docusaurus/isInternalUrl';
@@ -14,13 +14,13 @@ import IconExternalLink from '@theme/Icon/ExternalLink';
 import type {Props} from '@theme/Footer/LinkItem';
 
 export default function FooterLinkItem({item}: Props): ReactNode {
-  const {to, href, label, prependBaseUrlToHref, ...props} = item;
+  const {to, href, label, prependBaseUrlToHref, className, ...props} = item;
   const toUrl = useBaseUrl(to);
   const normalizedHref = useBaseUrl(href, {forcePrependBaseUrl: true});
 
   return (
     <Link
-      className="footer__link-item"
+      className={clsx('footer__link-item', className)}
       {...(href
         ? {
             href: prependBaseUrlToHref ? normalizedHref : href,

package/src/theme/Footer/Links/MultiColumn/index.tsx

@@ -6,6 +6,7 @@
  */
 
 import React, {type ReactNode} from 'react';
+import clsx from 'clsx';
 import LinkItem from '@theme/Footer/LinkItem';
 import type {Props} from '@theme/Footer/Links/MultiColumn';
 
@@ -15,7 +16,7 @@ type ColumnItemType = ColumnType['items'][number];
 function ColumnLinkItem({item}: {item: ColumnItemType}) {
   return item.html ? (
     <li
-      className="footer__item"
+      className={clsx('footer__item', item.className)}
       // Developer provided the HTML, so assume it's safe.
       // eslint-disable-next-line react/no-danger
       dangerouslySetInnerHTML={{__html: item.html}}
@@ -29,7 +30,7 @@ function ColumnLinkItem({item}: {item: ColumnItemType}) {
 
 function Column({column}: {column: ColumnType}) {
   return (
-    <div className="col footer__col">
+    <div className={clsx('col footer__col', column.className)}>
       <div className="footer__title">{column.title}</div>
       <ul className="footer__items clean-list">
         {column.items.map((item, i) => (

package/src/theme/Footer/Links/Simple/index.tsx

@@ -6,6 +6,7 @@
  */
 
 import React, {type ReactNode} from 'react';
+import clsx from 'clsx';
 import LinkItem from '@theme/Footer/LinkItem';
 import type {Props} from '@theme/Footer/Links/Simple';
 
@@ -16,7 +17,7 @@ function Separator() {
 function SimpleLinkItem({item}: {item: Props['links'][number]}) {
   return item.html ? (
     <span
-      className="footer__link-item"
+      className={clsx('footer__link-item', item.className)}
       // Developer provided the HTML, so assume it's safe.
       // eslint-disable-next-line react/no-danger
       dangerouslySetInnerHTML={{__html: item.html}}