@acronis-platform/ui-react 0.51.0 → 0.54.0

package/dist/components/ui/sidebar-secondary/sidebar-secondary.js

@@ -1,11 +1,12 @@
-import { jsx as a, jsxs as m, Fragment as T } from "react/jsx-runtime";
+import { jsx as e, jsxs as m, Fragment as k } from "react/jsx-runtime";
 import * as o from "react";
-import { mergeProps as h } from "@base-ui/react/merge-props";
+import { mergeProps as S } from "@base-ui/react/merge-props";
 import { useRender as N } from "@base-ui/react/use-render";
 import { Collapsible as x } from "@base-ui/react/collapsible";
-import { ChevronRightIcon as k, SquareArrowUpRightIcon as I, ChevronDownIcon as R } from "@acronis-platform/icons-react/stroke-mono";
+import { ChevronRightIcon as T, SquareArrowUpRightIcon as I, ChevronDownIcon as R } from "@acronis-platform/icons-react/stroke-mono";
 import { cva as E } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
 import { cn as t } from "../../../lib/utils.js";
+import { ScrollArea as z } from "../scroll-area/scroll-area.js";
 const M = o.createContext(null);
 function g() {
   return o.useContext(M) ?? {
@@ -14,8 +15,8 @@ function g() {
     }
   };
 }
-function z(n, e, r) {
-  const [s, i] = o.useState(e), d = n !== void 0, c = d ? n : s, l = o.useCallback(
+function P(n, a, r) {
+  const [s, i] = o.useState(a), d = n !== void 0, c = d ? n : s, l = o.useCallback(
     (u) => {
       d || i(u), r == null || r(u);
     },
@@ -23,10 +24,10 @@ function z(n, e, r) {
   );
   return [c, l];
 }
-const P = o.forwardRef(
+const L = o.forwardRef(
   ({
     className: n,
-    expanded: e,
+    expanded: a,
     defaultExpanded: r = !0,
     onExpandedChange: s,
     "aria-label": i = "Section navigation",
@@ -34,18 +35,18 @@ const P = o.forwardRef(
     children: c,
     ...l
   }, u) => {
-    const [b, p] = z(
-      e,
+    const [b, p] = P(
+      a,
       r,
       s
-    ), S = o.useMemo(
+    ), h = o.useMemo(
       () => ({ expanded: b, toggleExpanded: () => p(!b) }),
       [b, p]
     ), y = N({
       render: d,
       ref: u,
       defaultTagName: "nav",
-      props: h(
+      props: S(
         {
           "aria-label": i,
           "data-state": b ? "expanded" : "collapsed",
@@ -58,14 +59,14 @@ const P = o.forwardRef(
         l
       )
     });
-    return /* @__PURE__ */ a(M.Provider, { value: S, children: y });
+    return /* @__PURE__ */ e(M.Provider, { value: h, children: y });
   }
 );
-P.displayName = "SidebarSecondary";
-const L = o.forwardRef(({ className: n, label: e, children: r, ...s }, i) => (
+L.displayName = "SidebarSecondary";
+const A = o.forwardRef(({ className: n, label: a, children: r, ...s }, i) => (
   // Hidden in collapsed mode — the CollapsedBreadcrumb's parent label carries the
   // section context in the rail, so a truncated single-letter heading is omitted.
-  /* @__PURE__ */ a(
+  /* @__PURE__ */ e(
     "div",
     {
       ref: i,
@@ -77,29 +78,32 @@ const L = o.forwardRef(({ className: n, label: e, children: r, ...s }, i) => (
         n
       ),
       ...s,
-      children: /* @__PURE__ */ a("h2", { className: "ui-sidebar-secondary-global-header-label-text-style truncate text-[var(--ui-sidebar-secondary-global-header-label-color)]", children: e ?? r })
+      children: /* @__PURE__ */ e("h2", { className: "ui-sidebar-secondary-global-header-label-text-style truncate text-[var(--ui-sidebar-secondary-global-header-label-color)]", children: a ?? r })
     }
   )
 ));
-L.displayName = "SidebarSecondaryHeader";
-const A = o.forwardRef(({ className: n, ...e }, r) => (
-  // Expanded: the section list. Hidden in collapsed mode, where the
-  // CollapsedBreadcrumb sibling takes over.
-  /* @__PURE__ */ a(
-    "div",
+A.displayName = "SidebarSecondaryHeader";
+const _ = o.forwardRef(({ className: n, children: a, ...r }, s) => (
+  // Expanded: the section list, scrolling inside a ScrollArea whose overlay
+  // scrollbar floats over the content and reserves no gutter (full-bleed rows
+  // are never cropped). Hidden in collapsed mode, where the CollapsedBreadcrumb
+  // sibling takes over.
+  /* @__PURE__ */ e(
+    z,
     {
-      ref: r,
+      ref: s,
       className: t(
-        "flex flex-1 flex-col overflow-y-auto gap-[var(--ui-sidebar-secondary-global-section-list-gap)]",
-        "hidden group-data-[state=expanded]/sidebar:flex",
+        "min-h-0 flex-1",
+        "hidden group-data-[state=expanded]/sidebar:block",
         n
       ),
-      ...e
+      ...r,
+      children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-[var(--ui-sidebar-secondary-global-section-list-gap)]", children: a })
     }
   )
 ));
-A.displayName = "SidebarSecondaryContent";
-const _ = o.forwardRef(({ className: n, parentLabel: e, currentLabel: r, separator: s, ...i }, d) => (
+_.displayName = "SidebarSecondaryContent";
+const B = o.forwardRef(({ className: n, parentLabel: a, currentLabel: r, separator: s, ...i }, d) => (
   // Shown only in collapsed mode — toggled by the same data-[state] selector so
   // it stays in the DOM (SSR-present) with no JS branch. Stacked top→bottom:
   // parent → separator → current page. In the ~48px rail the labels are rotated
@@ -121,22 +125,22 @@ const _ = o.forwardRef(({ className: n, parentLabel: e, currentLabel: r, separat
       ),
       ...i,
       children: [
-        /* @__PURE__ */ a("span", { className: "ui-sidebar-secondary-collapsed-breadcrumb-label-text-style whitespace-nowrap [writing-mode:vertical-rl] text-[var(--ui-sidebar-secondary-collapsed-breadcrumb-label-color)]", children: e }),
-        /* @__PURE__ */ a(
+        /* @__PURE__ */ e("span", { className: "ui-sidebar-secondary-collapsed-breadcrumb-label-text-style whitespace-nowrap [writing-mode:vertical-rl] text-[var(--ui-sidebar-secondary-collapsed-breadcrumb-label-color)]", children: a }),
+        /* @__PURE__ */ e(
           "span",
           {
             "aria-hidden": "true",
             className: "inline-flex items-center text-[var(--ui-sidebar-secondary-collapsed-icon-separator-color)] [&>svg]:size-[var(--ui-sidebar-secondary-collapsed-icon-separator-size)]",
-            children: s ?? /* @__PURE__ */ a(k, { size: 16, className: "rotate-90" })
+            children: s ?? /* @__PURE__ */ e(T, { size: 16, className: "rotate-90" })
           }
         ),
-        /* @__PURE__ */ a("span", { className: "ui-sidebar-secondary-collapsed-label-current-page-text-style whitespace-nowrap [writing-mode:vertical-rl] text-[var(--ui-sidebar-secondary-collapsed-label-current-page-color)]", children: r })
+        /* @__PURE__ */ e("span", { className: "ui-sidebar-secondary-collapsed-label-current-page-text-style whitespace-nowrap [writing-mode:vertical-rl] text-[var(--ui-sidebar-secondary-collapsed-label-current-page-color)]", children: r })
       ]
     }
   )
 ));
-_.displayName = "SidebarSecondaryCollapsedBreadcrumb";
-const B = o.forwardRef(({ className: n, ...e }, r) => /* @__PURE__ */ a(
+B.displayName = "SidebarSecondaryCollapsedBreadcrumb";
+const V = o.forwardRef(({ className: n, ...a }, r) => /* @__PURE__ */ e(
   "div",
   {
     ref: r,
@@ -146,36 +150,36 @@ const B = o.forwardRef(({ className: n, ...e }, r) => /* @__PURE__ */ a(
       "py-[var(--ui-sidebar-secondary-section-container-padding-y)]",
       n
     ),
-    ...e
+    ...a
   }
 ));
-B.displayName = "SidebarSecondaryFooter";
-const f = o.createContext({ expandable: !1 }), V = { expandable: !1 }, F = { expandable: !0 }, H = o.forwardRef(
-  ({ className: n, expandable: e = !1, open: r, defaultOpen: s = !0, onOpenChange: i, children: d, ...c }, l) => {
+V.displayName = "SidebarSecondaryFooter";
+const f = o.createContext({ expandable: !1 }), F = { expandable: !1 }, H = { expandable: !0 }, j = o.forwardRef(
+  ({ className: n, expandable: a = !1, open: r, defaultOpen: s = !0, onOpenChange: i, children: d, ...c }, l) => {
     const u = t(
       "flex flex-col py-[var(--ui-sidebar-secondary-section-container-padding-y)]",
       n
     );
-    return e ? /* @__PURE__ */ a(f.Provider, { value: F, children: /* @__PURE__ */ a(
+    return a ? /* @__PURE__ */ e(f.Provider, { value: H, children: /* @__PURE__ */ e(
       x.Root,
       {
         ref: l,
         open: r,
         defaultOpen: s,
         onOpenChange: i,
-        render: /* @__PURE__ */ a("div", { className: u }),
+        render: /* @__PURE__ */ e("div", { className: u }),
         ...c,
         children: d
       }
-    ) }) : /* @__PURE__ */ a(f.Provider, { value: V, children: /* @__PURE__ */ a("div", { ref: l, className: u, ...c, children: d }) });
+    ) }) : /* @__PURE__ */ e(f.Provider, { value: F, children: /* @__PURE__ */ e("div", { ref: l, className: u, ...c, children: d }) });
   }
 );
-H.displayName = "SidebarSecondarySection";
-const w = "ui-sidebar-secondary-section-label-section-text-style text-[var(--ui-sidebar-secondary-section-label-section-color)]", C = "pb-[var(--ui-sidebar-secondary-section-container-header-padding-y)] px-[var(--ui-sidebar-secondary-section-container-header-padding-x)]", j = o.forwardRef(({ className: n, actions: e, unreadRollup: r, children: s, ...i }, d) => {
+j.displayName = "SidebarSecondarySection";
+const w = "ui-sidebar-secondary-section-label-section-text-style text-[var(--ui-sidebar-secondary-section-label-section-color)]", C = "flex min-h-9 items-center px-[var(--ui-sidebar-secondary-section-container-header-padding-x)]", D = o.forwardRef(({ className: n, actions: a, unreadRollup: r, children: s, ...i }, d) => {
   const { expandable: c } = o.useContext(f);
   if (!c) {
     const l = t(w, C, n);
-    return e == null ? /* @__PURE__ */ a("div", { ref: d, className: l, ...i, children: s }) : /* @__PURE__ */ m(
+    return a == null ? /* @__PURE__ */ e("div", { ref: d, className: l, ...i, children: s }) : /* @__PURE__ */ m(
       "div",
       {
         ref: d,
@@ -185,8 +189,8 @@ const w = "ui-sidebar-secondary-section-label-section-text-style text-[var(--ui-
         ),
         ...i,
         children: [
-          /* @__PURE__ */ a("span", { className: "min-w-0 flex-1 truncate", children: s }),
-          /* @__PURE__ */ a("span", { className: "flex shrink-0 items-center", children: e })
+          /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate", children: s }),
+          /* @__PURE__ */ e("span", { className: "flex shrink-0 items-center", children: a })
         ]
       }
     );
@@ -211,7 +215,7 @@ const w = "ui-sidebar-secondary-section-label-section-text-style text-[var(--ui-
               "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-brand)] focus-visible:ring-inset"
             ),
             children: [
-              /* @__PURE__ */ a(
+              /* @__PURE__ */ e(
                 R,
                 {
                   size: 16,
@@ -219,19 +223,19 @@ const w = "ui-sidebar-secondary-section-label-section-text-style text-[var(--ui-
                   className: "shrink-0 -rotate-90 transition-transform group-data-[panel-open]/section:rotate-0 text-[var(--ui-sidebar-secondary-section-icon-arrow-color)]"
                 }
               ),
-              /* @__PURE__ */ a("span", { className: "min-w-0 flex-1 truncate", children: s }),
-              r != null && /* @__PURE__ */ a("span", { className: "flex shrink-0 items-center group-data-[panel-open]/section:hidden", children: r })
+              /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate", children: s }),
+              r != null && /* @__PURE__ */ e("span", { className: "flex shrink-0 items-center group-data-[panel-open]/section:hidden", children: r })
             ]
           }
         ),
-        e != null && /* @__PURE__ */ a("span", { className: "flex shrink-0 items-center", children: e })
+        a != null && /* @__PURE__ */ e("span", { className: "flex shrink-0 items-center", children: a })
       ]
     }
   );
 });
-j.displayName = "SidebarSecondarySectionLabel";
-const D = o.forwardRef(({ className: n, ...e }, r) => {
-  const { expandable: s } = o.useContext(f), i = /* @__PURE__ */ a(
+D.displayName = "SidebarSecondarySectionLabel";
+const O = o.forwardRef(({ className: n, ...a }, r) => {
+  const { expandable: s } = o.useContext(f), i = /* @__PURE__ */ e(
     "ul",
     {
       ref: r,
@@ -239,13 +243,13 @@ const D = o.forwardRef(({ className: n, ...e }, r) => {
         "flex flex-col gap-[var(--ui-sidebar-secondary-section-menu-item-list-gap)]",
         n
       ),
-      ...e
+      ...a
     }
   );
-  return s ? /* @__PURE__ */ a(x.Panel, { children: i }) : i;
+  return s ? /* @__PURE__ */ e(x.Panel, { children: i }) : i;
 });
-D.displayName = "SidebarSecondaryMenu";
-const O = "group/row flex w-full items-center gap-[var(--ui-sidebar-secondary-menu-item-global-container-gap)] min-h-[var(--ui-sidebar-secondary-menu-item-global-container-height-min)] px-[var(--ui-sidebar-secondary-menu-item-global-container-padding-x)] py-[var(--ui-sidebar-secondary-menu-item-global-container-padding-y)] no-underline ui-sidebar-secondary-menu-item-global-label-text-style transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-brand)] focus-visible:ring-inset text-[var(--ui-sidebar-secondary-menu-item-global-label-color-color)] [&_svg]:shrink-0 [&_svg]:size-[var(--ui-sidebar-secondary-menu-item-global-icon-size)] [&_svg]:text-[var(--ui-sidebar-secondary-menu-item-global-icon-color-color)]", v = E(O, {
+O.displayName = "SidebarSecondaryMenu";
+const U = "group/row flex w-full items-center gap-[var(--ui-sidebar-secondary-menu-item-global-container-gap)] min-h-[var(--ui-sidebar-secondary-menu-item-global-container-height-min)] px-[var(--ui-sidebar-secondary-menu-item-global-container-padding-x)] py-[var(--ui-sidebar-secondary-menu-item-global-container-padding-y)] no-underline ui-sidebar-secondary-menu-item-global-label-text-style transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-brand)] focus-visible:ring-inset text-[var(--ui-sidebar-secondary-menu-item-global-label-color-color)] [&_svg]:shrink-0 [&_svg]:size-[var(--ui-sidebar-secondary-menu-item-global-icon-size)] [&_svg]:text-[var(--ui-sidebar-secondary-menu-item-global-icon-color-color)]", v = E(U, {
   variants: {
     variant: {
       unselected: "bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-idle)] hover:bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-hover)] active:bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-active)]",
@@ -255,27 +259,27 @@ const O = "group/row flex w-full items-center gap-[var(--ui-sidebar-secondary-me
   defaultVariants: {
     variant: "unselected"
   }
-}), U = o.forwardRef(({ className: n, selected: e = !1, icon: r, render: s, children: i, ...d }, c) => {
+}), q = o.forwardRef(({ className: n, selected: a = !1, icon: r, render: s, children: i, ...d }, c) => {
   const { expanded: l } = g(), u = o.Children.toArray(i), b = u.filter(
     (y) => o.isValidElement(y) && y.type.displayName === "SidebarSecondaryMenuItemExtras"
   ), p = u.filter(
     (y) => !b.includes(y)
-  ), S = N({
+  ), h = N({
     render: s,
     ref: c,
     defaultTagName: "a",
-    props: h(
+    props: S(
       {
         className: t(
           v({
-            variant: e ? "selected" : "unselected"
+            variant: a ? "selected" : "unselected"
           }),
           n
         ),
-        "aria-current": e ? "page" : void 0,
-        children: /* @__PURE__ */ m(T, { children: [
-          r != null && /* @__PURE__ */ a("span", { className: "flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)]", children: r }),
-          /* @__PURE__ */ a(
+        "aria-current": a ? "page" : void 0,
+        children: /* @__PURE__ */ m(k, { children: [
+          r != null && /* @__PURE__ */ e("span", { className: "flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)]", children: r }),
+          /* @__PURE__ */ e(
             "span",
             {
               className: t(
@@ -285,48 +289,48 @@ const O = "group/row flex w-full items-center gap-[var(--ui-sidebar-secondary-me
               children: p
             }
           ),
-          b.length > 0 && /* @__PURE__ */ a("span", { className: "flex shrink-0 items-center", children: b })
+          b.length > 0 && /* @__PURE__ */ e("span", { className: "flex shrink-0 items-center", children: b })
         ] })
       },
       d
     )
   });
-  return /* @__PURE__ */ a("li", { className: "contents", children: S });
+  return /* @__PURE__ */ e("li", { className: "contents", children: h });
 });
-U.displayName = "SidebarSecondaryMenuItem";
-const q = o.forwardRef(({ className: n, render: e, ...r }, s) => (
+q.displayName = "SidebarSecondaryMenuItem";
+const X = o.forwardRef(({ className: n, render: a, ...r }, s) => (
   // Disclosure row: Base UI Collapsible gives per-row open state +
   // aria-expanded/aria-controls. Rendered as the list `<li>` wrapper.
-  /* @__PURE__ */ a(
+  /* @__PURE__ */ e(
     x.Root,
     {
       ref: s,
-      render: e ?? /* @__PURE__ */ a("li", {}),
+      render: a ?? /* @__PURE__ */ e("li", {}),
       className: t("contents", n),
       ...r
     }
   )
 ));
-q.displayName = "SidebarSecondaryMenuSub";
-const X = o.forwardRef(({ className: n, selected: e = !1, icon: r, children: s, ...i }, d) => {
+X.displayName = "SidebarSecondaryMenuSub";
+const G = o.forwardRef(({ className: n, selected: a = !1, icon: r, children: s, ...i }, d) => {
   const { expanded: c } = g();
   return /* @__PURE__ */ m(
     x.Trigger,
     {
       ref: d,
-      "aria-current": e ? "page" : void 0,
+      "aria-current": a ? "page" : void 0,
       className: t(
         v({
-          variant: e ? "selected" : "unselected"
+          variant: a ? "selected" : "unselected"
         }),
         "text-left",
         n
       ),
       ...i,
       children: [
-        r != null && /* @__PURE__ */ a("span", { className: "flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)]", children: r }),
-        /* @__PURE__ */ a("span", { className: t("flex-1 truncate", !c && "sr-only"), children: s }),
-        /* @__PURE__ */ a(
+        r != null && /* @__PURE__ */ e("span", { className: "flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)]", children: r }),
+        /* @__PURE__ */ e("span", { className: t("flex-1 truncate", !c && "sr-only"), children: s }),
+        /* @__PURE__ */ e(
           R,
           {
             size: 16,
@@ -341,19 +345,19 @@ const X = o.forwardRef(({ className: n, selected: e = !1, icon: r, children: s,
     }
   );
 });
-X.displayName = "SidebarSecondaryMenuSubTrigger";
-const G = o.forwardRef(({ className: n, children: e, ...r }, s) => /* @__PURE__ */ a(x.Panel, { ref: s, className: t(n), ...r, children: /* @__PURE__ */ a("ul", { className: "flex flex-col gap-[var(--ui-sidebar-secondary-section-menu-item-list-gap)]", children: e }) }));
-G.displayName = "SidebarSecondaryMenuSubContent";
-const J = o.forwardRef(({ className: n, selected: e = !1, render: r, children: s, ...i }, d) => {
+G.displayName = "SidebarSecondaryMenuSubTrigger";
+const J = o.forwardRef(({ className: n, children: a, ...r }, s) => /* @__PURE__ */ e(x.Panel, { ref: s, className: t(n), ...r, children: /* @__PURE__ */ e("ul", { className: "flex flex-col gap-[var(--ui-sidebar-secondary-section-menu-item-list-gap)]", children: a }) }));
+J.displayName = "SidebarSecondaryMenuSubContent";
+const K = o.forwardRef(({ className: n, selected: a = !1, render: r, children: s, ...i }, d) => {
   const { expanded: c } = g(), l = N({
     render: r,
     ref: d,
     defaultTagName: "a",
-    props: h(
+    props: S(
       {
         className: t(
           v({
-            variant: e ? "selected" : "unselected"
+            variant: a ? "selected" : "unselected"
           }),
           // Level-2 left indent (no icon column). The dedicated level-2 padding
           // token was removed in the next-gen sync; reconstruct the indent from
@@ -362,17 +366,17 @@ const J = o.forwardRef(({ className: n, selected: e = !1, render: r, children: s
           "pl-[calc(var(--ui-sidebar-secondary-menu-item-global-container-padding-x)+var(--ui-sidebar-secondary-menu-item-global-icon-size)+var(--ui-sidebar-secondary-menu-item-global-container-gap))]",
           n
         ),
-        "aria-current": e ? "page" : void 0,
-        children: /* @__PURE__ */ a("span", { className: t("flex-1 truncate text-left", !c && "sr-only"), children: s })
+        "aria-current": a ? "page" : void 0,
+        children: /* @__PURE__ */ e("span", { className: t("flex-1 truncate text-left", !c && "sr-only"), children: s })
       },
       i
     )
   });
-  return /* @__PURE__ */ a("li", { className: "contents", children: l });
+  return /* @__PURE__ */ e("li", { className: "contents", children: l });
 });
-J.displayName = "SidebarSecondaryMenuSubItem";
-const K = o.forwardRef(({ className: n, variant: e, shortcut: r, tag: s, children: i, ...d }, c) => {
-  const { expanded: l } = g(), u = e === "tag" || e === "tag-externalLink", b = e === "externalLink" || e === "tag-externalLink", p = e === "shortcut";
+K.displayName = "SidebarSecondaryMenuSubItem";
+const Q = o.forwardRef(({ className: n, variant: a, shortcut: r, tag: s, children: i, ...d }, c) => {
+  const { expanded: l } = g(), u = a === "tag" || a === "tag-externalLink", b = a === "externalLink" || a === "tag-externalLink", p = a === "shortcut";
   return /* @__PURE__ */ m(
     "span",
     {
@@ -385,8 +389,8 @@ const K = o.forwardRef(({ className: n, variant: e, shortcut: r, tag: s, childre
       ...d,
       children: [
         u && (s ?? i),
-        p && /* @__PURE__ */ a("span", { className: "ui-sidebar-secondary-menu-item-extras-global-shortcut-text-style text-[var(--ui-sidebar-secondary-menu-item-extras-global-shortcut-color)]", children: r ?? i }),
-        b && /* @__PURE__ */ a(
+        p && /* @__PURE__ */ e("span", { className: "ui-sidebar-secondary-menu-item-extras-global-shortcut-text-style text-[var(--ui-sidebar-secondary-menu-item-extras-global-shortcut-color)]", children: r ?? i }),
+        b && /* @__PURE__ */ e(
           I,
           {
             size: 16,
@@ -397,10 +401,10 @@ const K = o.forwardRef(({ className: n, variant: e, shortcut: r, tag: s, childre
     }
   );
 });
-K.displayName = "SidebarSecondaryMenuItemExtras";
-const Q = o.forwardRef(({ className: n, icon: e, shortcut: r, children: s, onClick: i, ...d }, c) => {
+Q.displayName = "SidebarSecondaryMenuItemExtras";
+const W = o.forwardRef(({ className: n, icon: a, shortcut: r, children: s, onClick: i, ...d }, c) => {
   const { expanded: l, toggleExpanded: u } = g();
-  return /* @__PURE__ */ a("li", { className: "contents", children: /* @__PURE__ */ m(
+  return /* @__PURE__ */ e("li", { className: "contents", children: /* @__PURE__ */ m(
     "button",
     {
       ref: c,
@@ -416,21 +420,21 @@ const Q = o.forwardRef(({ className: n, icon: e, shortcut: r, children: s, onCli
       },
       ...d,
       children: [
-        e != null && // Flip the chevron when collapsed so a chevron-left ("collapse")
+        a != null && // Flip the chevron when collapsed so a chevron-left ("collapse")
         // becomes a chevron-right ("expand") — the icon always points toward
         // the action it triggers.
-        /* @__PURE__ */ a(
+        /* @__PURE__ */ e(
           "span",
           {
             className: t(
               "flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)] transition-transform",
               !l && "rotate-180"
             ),
-            children: e
+            children: a
           }
         ),
-        /* @__PURE__ */ a("span", { className: t("flex-1 truncate", !l && "sr-only"), children: s }),
-        r != null && /* @__PURE__ */ a(
+        /* @__PURE__ */ e("span", { className: t("flex-1 truncate", !l && "sr-only"), children: s }),
+        r != null && /* @__PURE__ */ e(
           "span",
           {
             className: t(
@@ -444,23 +448,23 @@ const Q = o.forwardRef(({ className: n, icon: e, shortcut: r, children: s, onCli
     }
   ) });
 });
-Q.displayName = "SidebarSecondaryCollapseTrigger";
+W.displayName = "SidebarSecondaryCollapseTrigger";
 export {
-  P as SidebarSecondary,
-  Q as SidebarSecondaryCollapseTrigger,
-  _ as SidebarSecondaryCollapsedBreadcrumb,
-  A as SidebarSecondaryContent,
-  B as SidebarSecondaryFooter,
-  L as SidebarSecondaryHeader,
-  D as SidebarSecondaryMenu,
-  U as SidebarSecondaryMenuItem,
-  K as SidebarSecondaryMenuItemExtras,
-  q as SidebarSecondaryMenuSub,
-  G as SidebarSecondaryMenuSubContent,
-  J as SidebarSecondaryMenuSubItem,
-  X as SidebarSecondaryMenuSubTrigger,
-  H as SidebarSecondarySection,
-  j as SidebarSecondarySectionLabel,
+  L as SidebarSecondary,
+  W as SidebarSecondaryCollapseTrigger,
+  B as SidebarSecondaryCollapsedBreadcrumb,
+  _ as SidebarSecondaryContent,
+  V as SidebarSecondaryFooter,
+  A as SidebarSecondaryHeader,
+  O as SidebarSecondaryMenu,
+  q as SidebarSecondaryMenuItem,
+  Q as SidebarSecondaryMenuItemExtras,
+  X as SidebarSecondaryMenuSub,
+  J as SidebarSecondaryMenuSubContent,
+  K as SidebarSecondaryMenuSubItem,
+  G as SidebarSecondaryMenuSubTrigger,
+  j as SidebarSecondarySection,
+  D as SidebarSecondarySectionLabel,
   v as sidebarSecondaryMenuItemVariants
 };
 //# sourceMappingURL=sidebar-secondary.js.map