@docusaurus/theme-classic 0.0.0-5273 → 0.0.0-5281

package/lib/getSwizzleConfig.js

@@ -24,6 +24,13 @@ function getSwizzleConfig() {
                 },
                 description: 'The color mode toggle to switch between light and dark mode.',
             },
+            DocCardList: {
+                actions: {
+                    eject: 'safe',
+                    wrap: 'safe',
+                },
+                description: 'The component responsible for rendering a list of sidebar items cards.\nNotable used on the category generated-index pages.',
+            },
             DocSidebar: {
                 actions: {
                     eject: 'unsafe',

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

@@ -6,4 +6,4 @@
  */
 /// <reference types="react" />
 import type { Props } from '@theme/DocCardList';
-export default function DocCardList({ items, className }: Props): JSX.Element;
+export default function DocCardList(props: Props): JSX.Element;

package/lib/theme/DocCardList/index.js

@@ -6,21 +6,24 @@
  */
 import React from 'react';
 import clsx from 'clsx';
-import {findFirstCategoryLink} from '@docusaurus/theme-common/internal';
+import {
+  useCurrentSidebarCategory,
+  filterDocCardListItems,
+} from '@docusaurus/theme-common';
 import DocCard from '@theme/DocCard';
-// Filter categories that don't have a link.
-function filterItems(items) {
-  return items.filter((item) => {
-    if (item.type === 'category') {
-      return !!findFirstCategoryLink(item);
-    }
-    return true;
-  });
+function DocCardListForCurrentSidebarCategory({className}) {
+  const category = useCurrentSidebarCategory();
+  return <DocCardList items={category.items} className={className} />;
 }
-export default function DocCardList({items, className}) {
+export default function DocCardList(props) {
+  const {items, className} = props;
+  if (!items) {
+    return <DocCardListForCurrentSidebarCategory {...props} />;
+  }
+  const filteredItems = filterDocCardListItems(items);
   return (
     <section className={clsx('row', className)}>
-      {filterItems(items).map((item, index) => (
+      {filteredItems.map((item, index) => (
         <article key={index} className="col col--6 margin-bottom--lg">
           <DocCard item={item} />
         </article>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docusaurus/theme-classic",
-  "version": "0.0.0-5273",
+  "version": "0.0.0-5281",
   "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": "0.0.0-5273",
-    "@docusaurus/mdx-loader": "0.0.0-5273",
-    "@docusaurus/module-type-aliases": "0.0.0-5273",
-    "@docusaurus/plugin-content-blog": "0.0.0-5273",
-    "@docusaurus/plugin-content-docs": "0.0.0-5273",
-    "@docusaurus/plugin-content-pages": "0.0.0-5273",
-    "@docusaurus/theme-common": "0.0.0-5273",
-    "@docusaurus/theme-translations": "0.0.0-5273",
-    "@docusaurus/types": "0.0.0-5273",
-    "@docusaurus/utils": "0.0.0-5273",
-    "@docusaurus/utils-common": "0.0.0-5273",
-    "@docusaurus/utils-validation": "0.0.0-5273",
+    "@docusaurus/core": "0.0.0-5281",
+    "@docusaurus/mdx-loader": "0.0.0-5281",
+    "@docusaurus/module-type-aliases": "0.0.0-5281",
+    "@docusaurus/plugin-content-blog": "0.0.0-5281",
+    "@docusaurus/plugin-content-docs": "0.0.0-5281",
+    "@docusaurus/plugin-content-pages": "0.0.0-5281",
+    "@docusaurus/theme-common": "0.0.0-5281",
+    "@docusaurus/theme-translations": "0.0.0-5281",
+    "@docusaurus/types": "0.0.0-5281",
+    "@docusaurus/utils": "0.0.0-5281",
+    "@docusaurus/utils-common": "0.0.0-5281",
+    "@docusaurus/utils-validation": "0.0.0-5281",
     "@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": "4687ad21af8c136d492fc1416432d6f1550c2225"
+  "gitHead": "30e8125600e78fb976c2d0861ac89314116d6936"
 }

package/src/getSwizzleConfig.ts

@@ -28,6 +28,14 @@ export default function getSwizzleConfig(): SwizzleConfig {
         description:
           'The color mode toggle to switch between light and dark mode.',
       },
+      DocCardList: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe',
+        },
+        description:
+          'The component responsible for rendering a list of sidebar items cards.\nNotable used on the category generated-index pages.',
+      },
       DocSidebar: {
         actions: {
           eject: 'unsafe', // Too much technical code in sidebar, not very safe atm

package/src/theme/DocCardList/index.tsx

@@ -7,25 +7,27 @@
 
 import React from 'react';
 import clsx from 'clsx';
-import {findFirstCategoryLink} from '@docusaurus/theme-common/internal';
+import {
+  useCurrentSidebarCategory,
+  filterDocCardListItems,
+} from '@docusaurus/theme-common';
 import DocCard from '@theme/DocCard';
 import type {Props} from '@theme/DocCardList';
-import type {PropSidebarItem} from '@docusaurus/plugin-content-docs';
 
-// Filter categories that don't have a link.
-function filterItems(items: PropSidebarItem[]): PropSidebarItem[] {
-  return items.filter((item) => {
-    if (item.type === 'category') {
-      return !!findFirstCategoryLink(item);
-    }
-    return true;
-  });
+function DocCardListForCurrentSidebarCategory({className}: Props) {
+  const category = useCurrentSidebarCategory();
+  return <DocCardList items={category.items} className={className} />;
 }
 
-export default function DocCardList({items, className}: Props): JSX.Element {
+export default function DocCardList(props: Props): JSX.Element {
+  const {items, className} = props;
+  if (!items) {
+    return <DocCardListForCurrentSidebarCategory {...props} />;
+  }
+  const filteredItems = filterDocCardListItems(items);
   return (
     <section className={clsx('row', className)}>
-      {filterItems(items).map((item, index) => (
+      {filteredItems.map((item, index) => (
         <article key={index} className="col col--6 margin-bottom--lg">
           <DocCard item={item} />
         </article>

package/src/theme-classic.d.ts

@@ -336,7 +336,7 @@ declare module '@theme/DocCardList' {
   import type {PropSidebarItem} from '@docusaurus/plugin-content-docs';
 
   export interface Props {
-    readonly items: PropSidebarItem[];
+    readonly items?: PropSidebarItem[];
     readonly className?: string;
   }