diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Category/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Category/index.tsx
index 22270f21a3..9a49be27d1 100644
--- a/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Category/index.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Category/index.tsx
@@ -31,6 +31,8 @@ import useIsBrowser from '@docusaurus/useIsBrowser';
import DocSidebarItems from '@theme/DocSidebarItems';
import type {Props} from '@theme/DocSidebarItem/Category';
+import styles from './styles.module.css';
+
// If we navigate to a category and it becomes active, it should automatically
// expand itself
function useAutoExpandActiveCategory({
@@ -126,6 +128,14 @@ function CollapseButton({
);
}
+function CategoryLinkLabel({label}: {label: string}) {
+ return (
+
+ {label}
+
+ );
+}
+
export default function DocSidebarItemCategory({
item,
onItemClick,
@@ -179,6 +189,29 @@ export default function DocSidebarItemCategory({
}
}, [collapsible, expandedItem, index, setCollapsed, autoCollapseCategories]);
+ const handleItemClick: ComponentProps<'a'>['onClick'] = (e) => {
+ onItemClick?.(item);
+ if (collapsible) {
+ if (href) {
+ // When already on the category's page, we collapse it
+ // We don't use "isActive" because it would collapse the
+ // category even when we browse a children element
+ // See https://github.com/facebook/docusaurus/issues/11213
+ if (isCurrentPage) {
+ e.preventDefault();
+ updateCollapsed();
+ } else {
+ // When navigating to a new category, we always expand
+ // see https://github.com/facebook/docusaurus/issues/10854#issuecomment-2609616182
+ updateCollapsed(false);
+ }
+ } else {
+ e.preventDefault();
+ updateCollapsed();
+ }
+ }
+ };
+
return (
{
- onItemClick?.(item);
- if (href) {
- // When already on the category's page, we collapse it
- // We don't use "isActive" because it would collapse the
- // category even when we browse a children element
- // See https://github.com/facebook/docusaurus/issues/11213
- if (isCurrentPage) {
- e.preventDefault();
- updateCollapsed();
- } else {
- // When navigating to a new category, we always expand
- // see https://github.com/facebook/docusaurus/issues/10854#issuecomment-2609616182
- updateCollapsed(false);
- }
- } else {
- e.preventDefault();
- updateCollapsed();
- }
- }
- : () => {
- onItemClick?.(item);
- }
- }
+ onClick={handleItemClick}
aria-current={isCurrentPage ? 'page' : undefined}
role={collapsible && !href ? 'button' : undefined}
aria-expanded={collapsible && !href ? !collapsed : undefined}
href={collapsible ? hrefWithSSRFallback ?? '#' : hrefWithSSRFallback}
{...props}>
- {label}
+
{href && collapsible && (
+ {label}
+
+ );
+}
+
export default function DocSidebarItemLink({
item,
onItemClick,
@@ -51,7 +59,7 @@ export default function DocSidebarItemLink({
onClick: onItemClick ? () => onItemClick(item) : undefined,
})}
{...props}>
- {label}
+
{!isInternalLink && }
diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Link/styles.module.css b/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Link/styles.module.css
index 4abcb56762..a48f210974 100644
--- a/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Link/styles.module.css
+++ b/packages/docusaurus-theme-classic/src/theme/DocSidebarItem/Link/styles.module.css
@@ -8,3 +8,11 @@
.menuExternalLink {
align-items: center;
}
+
+.linkLabel {
+ overflow: hidden;
+ display: -webkit-box;
+ line-clamp: 2;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
+}
diff --git a/project-words.txt b/project-words.txt
index 36c96b80c8..03eeb8db4d 100644
--- a/project-words.txt
+++ b/project-words.txt
@@ -136,6 +136,7 @@ lifecycles
lightningcss
Linkify
linkify
+longlonglonglonglonglonglonglonglonglonglonglong
Lorber
lorber
Lorber's
diff --git a/website/_dogfooding/_docs tests/tests/sidebar-display/Category 2 Long Long Long Long Long Long Long Long Long Long Long/doc1.mdx b/website/_dogfooding/_docs tests/tests/sidebar-display/Category 2 Long Long Long Long Long Long Long Long Long Long Long/doc1.mdx
new file mode 100644
index 0000000000..02823ef8d5
--- /dev/null
+++ b/website/_dogfooding/_docs tests/tests/sidebar-display/Category 2 Long Long Long Long Long Long Long Long Long Long Long/doc1.mdx
@@ -0,0 +1 @@
+# Doc 1
diff --git a/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc1.mdx b/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc1.mdx
new file mode 100644
index 0000000000..02823ef8d5
--- /dev/null
+++ b/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc1.mdx
@@ -0,0 +1 @@
+# Doc 1
diff --git a/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc2 long long long long long long long long long long long long.mdx b/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc2 long long long long long long long long long long long long.mdx
new file mode 100644
index 0000000000..816e33bf62
--- /dev/null
+++ b/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc2 long long long long long long long long long long long long.mdx
@@ -0,0 +1 @@
+# Doc 2 long long long long long long long long long long long long
diff --git a/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc3longlonglonglonglonglonglonglonglonglonglonglong.mdx b/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc3longlonglonglonglonglonglonglonglonglonglonglong.mdx
new file mode 100644
index 0000000000..0d0eb1de3d
--- /dev/null
+++ b/website/_dogfooding/_docs tests/tests/sidebar-display/Category1LongLongLongLongLongLongLongLongLongLong/doc3longlonglonglonglonglonglonglonglonglonglonglong.mdx
@@ -0,0 +1 @@
+# Doc 3 longlonglonglonglonglonglonglonglonglonglonglong
diff --git a/website/_dogfooding/_docs tests/tests/sidebar-display/_category_.json b/website/_dogfooding/_docs tests/tests/sidebar-display/_category_.json
new file mode 100644
index 0000000000..8dcbb76c67
--- /dev/null
+++ b/website/_dogfooding/_docs tests/tests/sidebar-display/_category_.json
@@ -0,0 +1,9 @@
+{
+ "label": "Sidebar Display",
+ "link": {
+ "type": "generated-index",
+ "title": "Sidebar Display",
+ "description": "Testing edge cases of how the docs sidebar is displayed"
+ },
+ "position": 1
+}