@umami/shiso 1.1.11 → 1.1.12

package/dist/chunks/App.js

@@ -26793,8 +26793,8 @@ function PageLinks({ items = [], title, navigationLabel }) {
 
 //#endregion
 //#region src/components/SideNav.tsx
-const sectionLabelClass = "flex min-w-0 flex-1 items-center gap-[0.4rem] pb-2 pr-1 font-bold text-inherit";
-const groupLabelClass = "flex min-w-0 flex-1 items-center gap-[0.4rem] px-3 py-2 font-medium text-inherit";
+const sectionLabelClass = "flex min-w-0 items-center gap-[0.4rem] pb-2 pr-1 font-bold text-inherit";
+const groupLabelClass = "flex min-w-0 items-center gap-[0.4rem] py-2 pl-3 pr-1 font-medium text-inherit";
 const selectedClass = "border-l-sidebar-primary font-bold text-sidebar-primary hover:text-sidebar-primary";
 /** True when the group's root or any descendant page is the current page. */
 function containsPage(node, pathname) {
@@ -26828,7 +26828,7 @@ function CollapsibleGroup({ node, pathname, depth, drilldown, expandLabel, colla
 	const chevron = /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 shrink-0 origin-center text-muted-foreground transition-[color,transform] duration-150 group-hover/section:text-sidebar-accent-foreground group-aria-expanded/collapsible-trigger:rotate-90" });
 	const isTopLevel = depth === 0;
 	const rootSelected = node.root?.page.url === pathname;
-	const headerClass = isTopLevel ? "flex min-w-0 items-center text-sidebar-foreground" : clsx("flex items-center border-sidebar-border border-l text-muted-foreground hover:text-sidebar-accent-foreground", { "pl-6": depth > 1 });
+	const headerClass = isTopLevel ? "flex min-w-0 items-center text-sidebar-foreground" : clsx("flex items-center border-l border-l-sidebar-border text-muted-foreground hover:text-sidebar-accent-foreground", { "pl-6": depth > 1 });
 	const fixedHeader = /* @__PURE__ */ jsx("div", {
 		className: clsx(headerClass, {
 			[selectedClass]: rootSelected && !isTopLevel,
@@ -26836,10 +26836,10 @@ function CollapsibleGroup({ node, pathname, depth, drilldown, expandLabel, colla
 		}),
 		children: node.root ? /* @__PURE__ */ jsxs(Link, {
 			to: node.root.page.url,
-			className: isTopLevel ? sectionLabelClass : groupLabelClass,
+			className: clsx(isTopLevel ? sectionLabelClass : groupLabelClass, "flex-1"),
 			children: [resolveIcon(node.icon), node.label]
 		}) : /* @__PURE__ */ jsxs("span", {
-			className: isTopLevel ? sectionLabelClass : groupLabelClass,
+			className: clsx(isTopLevel ? sectionLabelClass : groupLabelClass, "flex-1"),
 			children: [resolveIcon(node.icon), node.label]
 		})
 	});
@@ -26857,7 +26857,7 @@ function CollapsibleGroup({ node, pathname, depth, drilldown, expandLabel, colla
 				type: "button",
 				variant: "ghost",
 				size: "icon-xs",
-				className: clsx("group/collapsible-trigger inline-flex size-6 items-center justify-center rounded-sm text-muted-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground", { "mr-[0.35rem]": !isTopLevel }),
+				className: "group/collapsible-trigger inline-flex size-6 items-center justify-center rounded-sm text-muted-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
 				"aria-label": `${isExpanded ? collapseLabel : expandLabel} ${node.label}`
 			}),
 			children: chevron
@@ -26866,9 +26866,9 @@ function CollapsibleGroup({ node, pathname, depth, drilldown, expandLabel, colla
 		render: /* @__PURE__ */ jsx(Button, {
 			type: "button",
 			variant: "ghost",
-			className: clsx(headerClass, "group/section group/collapsible-trigger flex h-auto w-full items-center justify-start gap-[0.4rem] whitespace-normal rounded-none px-0 py-0 text-left hover:bg-transparent aria-expanded:bg-transparent dark:hover:bg-transparent [&>svg:last-child]:ml-auto", {
+			className: clsx(headerClass, "group/section group/collapsible-trigger flex h-auto w-full items-center justify-start gap-[0.4rem] whitespace-normal rounded-none px-0 py-0 text-left hover:bg-transparent aria-expanded:bg-transparent dark:hover:bg-transparent", {
 				"pb-2 font-bold text-sidebar-foreground": isTopLevel,
-				"border-sidebar-border border-l px-3 py-2 font-medium text-muted-foreground hover:text-sidebar-accent-foreground": !isTopLevel
+				"border-l border-l-sidebar-border px-3 py-2 font-medium text-muted-foreground hover:text-sidebar-accent-foreground": !isTopLevel
 			})
 		}),
 		children: [
@@ -26917,7 +26917,7 @@ function NavNodes({ nodes, pathname, depth, drilldown, expandLabel, collapseLabe
 				href: node.href,
 				target: node.target,
 				rel: node.target === "_blank" ? "noreferrer" : void 0,
-				className: clsx("flex min-w-0 items-center gap-[0.4rem] border-sidebar-border border-l px-3 py-[0.55rem] text-muted-foreground hover:text-sidebar-accent-foreground [overflow-wrap:anywhere]", { "pl-6": depth > 1 }),
+				className: clsx("flex min-w-0 items-center gap-[0.4rem] border-l border-l-sidebar-border px-3 py-[0.55rem] text-muted-foreground hover:text-sidebar-accent-foreground [overflow-wrap:anywhere]", { "pl-6": depth > 1 }),
 				children: [
 					resolveIcon(node.icon),
 					node.label,
@@ -26934,7 +26934,7 @@ function NavNodes({ nodes, pathname, depth, drilldown, expandLabel, collapseLabe
 			const isSelected = url === pathname;
 			rendered.push(/* @__PURE__ */ jsxs(Link, {
 				to: url,
-				className: clsx("flex min-w-0 items-center gap-[0.4rem] border-sidebar-border border-l px-3 py-[0.55rem] [overflow-wrap:anywhere]", {
+				className: clsx("flex min-w-0 items-center gap-[0.4rem] border-l border-l-sidebar-border px-3 py-[0.55rem] [overflow-wrap:anywhere]", {
 					"pl-6": depth > 1,
 					[selectedClass]: isSelected,
 					"text-muted-foreground hover:text-sidebar-accent-foreground": !isSelected

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umami/shiso",
-  "version": "1.1.11",
+  "version": "1.1.12",
   "description": "Open-source documentation framework for Markdown and MDX sites.",
   "type": "module",
   "bin": {

package/src/components/SideNav.tsx

@@ -11,9 +11,9 @@ import { flattenNav, isNodeHidden } from '@/lib/docs-config';
 import type { DocsTab, NavGroupNode, NavNode } from '@/lib/types';
 
 const sectionLabelClass =
-  'flex min-w-0 flex-1 items-center gap-[0.4rem] pb-2 pr-1 font-bold text-inherit';
+  'flex min-w-0 items-center gap-[0.4rem] pb-2 pr-1 font-bold text-inherit';
 const groupLabelClass =
-  'flex min-w-0 flex-1 items-center gap-[0.4rem] px-3 py-2 font-medium text-inherit';
+  'flex min-w-0 items-center gap-[0.4rem] py-2 pl-3 pr-1 font-medium text-inherit';
 const selectedClass =
   'border-l-sidebar-primary font-bold text-sidebar-primary hover:text-sidebar-primary';
 
@@ -97,7 +97,7 @@ function CollapsibleGroup({
   const headerClass = isTopLevel
     ? 'flex min-w-0 items-center text-sidebar-foreground'
     : classNames(
-        'flex items-center border-sidebar-border border-l text-muted-foreground hover:text-sidebar-accent-foreground',
+        'flex items-center border-l border-l-sidebar-border text-muted-foreground hover:text-sidebar-accent-foreground',
         { 'pl-6': depth > 1 },
       );
 
@@ -109,12 +109,15 @@ function CollapsibleGroup({
       })}
     >
       {node.root ? (
-        <Link to={node.root.page.url} className={isTopLevel ? sectionLabelClass : groupLabelClass}>
+        <Link
+          to={node.root.page.url}
+          className={classNames(isTopLevel ? sectionLabelClass : groupLabelClass, 'flex-1')}
+        >
           {resolveIcon(node.icon)}
           {node.label}
         </Link>
       ) : (
-        <span className={isTopLevel ? sectionLabelClass : groupLabelClass}>
+        <span className={classNames(isTopLevel ? sectionLabelClass : groupLabelClass, 'flex-1')}>
           {resolveIcon(node.icon)}
           {node.label}
         </span>
@@ -142,10 +145,7 @@ function CollapsibleGroup({
             type="button"
             variant="ghost"
             size="icon-xs"
-            className={classNames(
-              'group/collapsible-trigger inline-flex size-6 items-center justify-center rounded-sm text-muted-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
-              { 'mr-[0.35rem]': !isTopLevel },
-            )}
+            className="group/collapsible-trigger inline-flex size-6 items-center justify-center rounded-sm text-muted-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"
             aria-label={`${isExpanded ? collapseLabel : expandLabel} ${node.label}`}
           />
         }
@@ -161,10 +161,10 @@ function CollapsibleGroup({
           variant="ghost"
           className={classNames(
             headerClass,
-            'group/section group/collapsible-trigger flex h-auto w-full items-center justify-start gap-[0.4rem] whitespace-normal rounded-none px-0 py-0 text-left hover:bg-transparent aria-expanded:bg-transparent dark:hover:bg-transparent [&>svg:last-child]:ml-auto',
+            'group/section group/collapsible-trigger flex h-auto w-full items-center justify-start gap-[0.4rem] whitespace-normal rounded-none px-0 py-0 text-left hover:bg-transparent aria-expanded:bg-transparent dark:hover:bg-transparent',
             {
               'pb-2 font-bold text-sidebar-foreground': isTopLevel,
-              'border-sidebar-border border-l px-3 py-2 font-medium text-muted-foreground hover:text-sidebar-accent-foreground':
+              'border-l border-l-sidebar-border px-3 py-2 font-medium text-muted-foreground hover:text-sidebar-accent-foreground':
                 !isTopLevel,
             },
           )}
@@ -244,7 +244,7 @@ function NavNodes({
           target={node.target}
           rel={node.target === '_blank' ? 'noreferrer' : undefined}
           className={classNames(
-            'flex min-w-0 items-center gap-[0.4rem] border-sidebar-border border-l px-3 py-[0.55rem] text-muted-foreground hover:text-sidebar-accent-foreground [overflow-wrap:anywhere]',
+            'flex min-w-0 items-center gap-[0.4rem] border-l border-l-sidebar-border px-3 py-[0.55rem] text-muted-foreground hover:text-sidebar-accent-foreground [overflow-wrap:anywhere]',
             { 'pl-6': depth > 1 },
           )}
         >
@@ -265,7 +265,7 @@ function NavNodes({
           key={url}
           to={url}
           className={classNames(
-            'flex min-w-0 items-center gap-[0.4rem] border-sidebar-border border-l px-3 py-[0.55rem] [overflow-wrap:anywhere]',
+            'flex min-w-0 items-center gap-[0.4rem] border-l border-l-sidebar-border px-3 py-[0.55rem] [overflow-wrap:anywhere]',
             {
               'pl-6': depth > 1,
               [selectedClass]: isSelected,