@alfadocs/ui-kit 0.72.2 → 0.75.0

package/dist/_chunks/{sidebar-B0OBmJrC.js → sidebar-C0PbwJBc.js}

@@ -1,54 +1,55 @@
-import { jsx as s, jsxs as u, Fragment as q } from "react/jsx-runtime";
-import { forwardRef as b, useState as R, useEffect as U, useCallback as ss, useRef as $, useMemo as O, useId as ds, useContext as Z, createContext as W } from "react";
-import * as B from "@radix-ui/react-dialog";
-import * as V from "@radix-ui/react-collapsible";
+import { jsx as s, jsxs as u, Fragment as X } from "react/jsx-runtime";
+import { forwardRef as b, useState as B, useEffect as L, useCallback as ss, useRef as G, useMemo as $, useId as ns, useContext as q, createContext as Z } from "react";
+import * as R from "@radix-ui/react-dialog";
+import * as K from "@radix-ui/react-collapsible";
 import * as E from "@radix-ui/react-accordion";
 import * as h from "@radix-ui/react-tooltip";
-import { a as ts } from "./accordion-C11v9ouP.js";
-import { S as os } from "./scroll-area-BZOvUhwQ.js";
+import { a as os } from "./accordion-C11v9ouP.js";
+import { S as ts } from "./scroll-area-BZOvUhwQ.js";
 import { Slot as ls } from "@radix-ui/react-slot";
-import { c as I } from "./index-D2ZczOXr.js";
-import { useTranslation as D } from "react-i18next";
+import { c as T } from "./index-D2ZczOXr.js";
+import { useTranslation as A } from "react-i18next";
 import { u as cs } from "./registry-DvAUVLHh.js";
 import { u as us } from "./use-edge-resize-ZnGG7gyO.js";
 import { c as ms } from "./compose-refs-C0k0tdqF.js";
-import { X as vs } from "./x-B5YnXwCz.js";
-import { c as X } from "./createLucideIcon-DhHxpK9K.js";
-import { G as ps } from "./grip-vertical-onSb1JXO.js";
+import { a as vs, b as ps, d as fs } from "./input-surface-xyERuLU_.js";
+import { X as gs } from "./x-B5YnXwCz.js";
+import { c as W } from "./createLucideIcon-DhHxpK9K.js";
+import { G as bs } from "./grip-vertical-onSb1JXO.js";
 import { C as H } from "./chevron-right-I9AeSxH2.js";
-import { S as fs } from "./star-Bf9L2Uot.js";
+import { S as hs } from "./star-Bf9L2Uot.js";
 /**
  * @license lucide-react v1.22.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const gs = [
+const xs = [
   ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
   ["path", { d: "M9 3v18", key: "fh3hqa" }],
   ["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
-], bs = X("panel-left-close", gs);
+], ys = W("panel-left-close", xs);
 /**
  * @license lucide-react v1.22.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const hs = [
+const Ns = [
   ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
   ["path", { d: "M9 3v18", key: "fh3hqa" }],
   ["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
-], xs = X("panel-left-open", hs);
+], ws = W("panel-left-open", Ns);
 /**
  * @license lucide-react v1.22.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const ys = [
+const zs = [
   ["path", { d: "M16 7h6v6", key: "box55l" }],
   ["path", { d: "m22 7-8.5 8.5-5-5L2 17", key: "1t1m79" }]
-], ws = X("trending-up", ys), Ns = {
+], Ss = W("trending-up", zs), js = {
   id: "sidebar",
   capabilities: ["expand"],
   state: {
@@ -83,11 +84,11 @@ const ys = [
       description: "Each Sidebar.Item emits its `navId` prop as data-nav-id. Agents activate a nav item via native click on the matching anchor."
     }
   }
-}, G = W({
+}, O = Z({
   mode: "expanded",
   density: "default"
-}), x = () => Z(G), es = "ui.sidebar.state";
-function zs(e) {
+}), x = () => q(O), es = "ui.sidebar.state";
+function Cs(e) {
   if (typeof window > "u") return e;
   try {
     const a = window.localStorage.getItem(es);
@@ -96,14 +97,14 @@ function zs(e) {
   }
   return e;
 }
-function Ss(e) {
+function ks(e) {
   if (!(typeof window > "u"))
     try {
       window.localStorage.setItem(es, e);
     } catch {
     }
 }
-const J = I(
+const J = T(
   [
     "ds:flex ds:flex-col",
     // Sidebar sits at the page background in light mode (white-on-white
@@ -149,7 +150,7 @@ const J = I(
     },
     defaultVariants: { mode: "expanded", density: "default" }
   }
-), js = 192, Cs = 384, ks = 248, Is = [
+), Ts = 192, Is = 384, Rs = 248, Bs = [
   "ds:absolute ds:[inset-block:0] ds:end-0 ds:z-[2]",
   "ds:w-[var(--resizable-handle-size)]",
   "ds:cursor-col-resize ds:select-none ds:touch-none",
@@ -163,37 +164,37 @@ const J = I(
   "ds:before:[inset-block:0]",
   "ds:before:[inline-size:var(--min-target-size)]",
   "ds:before:[inset-inline:calc(0px_-_(var(--min-target-size)_-_var(--resizable-handle-size))_/_2)]"
-].join(" "), Ts = b(
+].join(" "), As = b(
   ({
     state: e,
     defaultState: a = "expanded",
     onStateChange: r,
-    density: n = "default",
-    open: d,
-    onOpenChange: l,
-    resizable: t = !1,
-    "aria-label": o,
-    className: c,
+    density: i = "default",
+    open: n,
+    onOpenChange: c,
+    resizable: o = !1,
+    "aria-label": t,
+    className: l,
     children: p,
     id: f,
     ...g
-  }, N) => {
-    const { t: y } = D(), i = e !== void 0, [w, z] = R(
-      () => i ? e : zs(a)
-    ), m = i ? e : w;
-    U(() => {
-      i || Ss(w);
-    }, [w, i]);
+  }, w) => {
+    const { t: y } = A(), d = e !== void 0, [N, z] = B(
+      () => d ? e : Cs(a)
+    ), m = d ? e : N;
+    L(() => {
+      d || ks(N);
+    }, [N, d]);
     const S = ss(
       (k) => {
-        i || z(k), r == null || r(k);
+        d || z(k), r == null || r(k);
       },
-      [i, r]
-    ), j = o ?? y("navigation.sidebar.label"), C = $(m);
-    U(() => {
+      [d, r]
+    ), j = t ?? y("navigation.sidebar.label"), C = G(m);
+    L(() => {
       C.current = m;
     }, [m]);
-    const F = O(
+    const F = $(
       () => ({
         getIsCollapsed: () => C.current !== "expanded",
         toggleCollapsed: () => {
@@ -203,23 +204,23 @@ const J = I(
       }),
       [S]
     );
-    cs(Ns, F, f);
-    const A = $(null), P = O(() => ms(N, A), [N]), { separatorProps: M, isResizing: _ } = us({
+    cs(js, F, f);
+    const D = G(null), _ = $(() => ms(w, D), [w]), { separatorProps: U, isResizing: P } = us({
       edge: "inline-end",
-      targetRef: A,
+      targetRef: D,
       cssProperty: "--sidebar-modern-expanded-size",
-      minSize: js,
-      maxSize: Cs,
-      defaultSize: ks,
-      disabled: !t || m !== "expanded"
-    }), K = t && m === "expanded";
+      minSize: Ts,
+      maxSize: Is,
+      defaultSize: Rs,
+      disabled: !o || m !== "expanded"
+    }), M = o && m === "expanded";
     return m === "overlay" ? /* @__PURE__ */ s(
-      G.Provider,
+      O.Provider,
       {
-        value: { mode: "overlay", density: n, transitionTo: S },
-        children: /* @__PURE__ */ s(B.Root, { open: d, onOpenChange: l, children: /* @__PURE__ */ u(B.Portal, { children: [
+        value: { mode: "overlay", density: i, transitionTo: S },
+        children: /* @__PURE__ */ s(R.Root, { open: n, onOpenChange: c, children: /* @__PURE__ */ u(R.Portal, { children: [
           /* @__PURE__ */ s(
-            B.Overlay,
+            R.Overlay,
             {
               className: [
                 "ds:fixed ds:inset-0 ds:z-[var(--z-modal-backdrop)]",
@@ -231,27 +232,30 @@ const J = I(
             }
           ),
           /* @__PURE__ */ u(
-            B.Content,
+            R.Content,
             {
               "aria-label": j,
               className: [
                 "ds:fixed ds:z-[var(--z-modal)]",
-                "ds:inset-inline-start-0 ds:inset-block-start-0",
+                // `start-0`/`top-0` — the `inset-inline-start-0` /
+                // `inset-block-start-0` spellings are not Tailwind
+                // utilities and compiled to nothing.
+                "ds:start-0 ds:top-0",
                 "ds:h-dvh",
-                J({ mode: "overlay", density: n }),
+                J({ mode: "overlay", density: i }),
                 "ds:shadow-[var(--shadow-xl)]",
                 "ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out",
                 "ds:data-[state=open]:slide-in-from-left ds:data-[state=closed]:slide-out-to-left",
                 "ds:rtl:data-[state=open]:slide-in-from-right ds:rtl:data-[state=closed]:slide-out-to-right",
                 "ds:motion-reduce:animate-none",
                 "ds:focus:outline-none",
-                c ?? ""
+                l ?? ""
               ].filter(Boolean).join(" "),
               children: [
                 /* @__PURE__ */ s(
                   "nav",
                   {
-                    ref: P,
+                    ref: _,
                     id: f,
                     "aria-label": j,
                     "data-component": "sidebar",
@@ -261,7 +265,7 @@ const J = I(
                     children: p
                   }
                 ),
-                /* @__PURE__ */ s(B.Close, { asChild: !0, children: /* @__PURE__ */ s(
+                /* @__PURE__ */ s(R.Close, { asChild: !0, children: /* @__PURE__ */ s(
                   "button",
                   {
                     type: "button",
@@ -275,7 +279,7 @@ const J = I(
                       "ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)]",
                       "ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]"
                     ].join(" "),
-                    children: /* @__PURE__ */ s(vs, { "aria-hidden": "true", className: "ds:size-4" })
+                    children: /* @__PURE__ */ s(gs, { "aria-hidden": "true", className: "ds:size-4" })
                   }
                 ) })
               ]
@@ -284,35 +288,35 @@ const J = I(
         ] }) })
       }
     ) : /* @__PURE__ */ s(
-      G.Provider,
+      O.Provider,
       {
-        value: { mode: m, density: n, transitionTo: S },
+        value: { mode: m, density: i, transitionTo: S },
         children: /* @__PURE__ */ s(h.Provider, { delayDuration: 300, children: /* @__PURE__ */ u(
           "nav",
           {
-            ref: P,
+            ref: _,
             id: f,
             "aria-label": j,
             "data-component": "sidebar",
             "data-component-id": f,
             "data-mode": m,
-            "data-density": n,
-            "data-resizing": _ ? "" : void 0,
+            "data-density": i,
+            "data-resizing": P ? "" : void 0,
             className: [
-              J({ mode: m, density: n }),
-              n === "compact" ? "ds:density-compact" : "",
-              c ?? ""
+              J({ mode: m, density: i }),
+              i === "compact" ? "ds:density-compact" : "",
+              l ?? ""
             ].filter(Boolean).join(" "),
             ...g,
             children: [
               p,
-              K ? /* @__PURE__ */ s(
+              M ? /* @__PURE__ */ s(
                 "div",
                 {
-                  ...M,
+                  ...U,
                   "aria-label": y("navigation.sidebar.resize"),
-                  "data-resizing": _ ? "" : void 0,
-                  className: Is
+                  "data-resizing": P ? "" : void 0,
+                  className: Bs
                 }
               ) : null
             ]
@@ -322,9 +326,9 @@ const J = I(
     );
   }
 );
-Ts.displayName = "Sidebar";
-const Bs = b(({ className: e, ...a }, r) => {
-  const { mode: n } = x();
+As.displayName = "Sidebar";
+const Ds = b(({ className: e, ...a }, r) => {
+  const { mode: i } = x();
   return /* @__PURE__ */ s(
     "div",
     {
@@ -334,7 +338,7 @@ const Bs = b(({ className: e, ...a }, r) => {
         "ds:min-h-[var(--min-target-size)]",
         // Icon-rail is 64px — shrink horizontal padding so a 44×44
         // control fits centred inside the header.
-        n === "icon" ? "ds:justify-center ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]" : "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+        i === "icon" ? "ds:justify-center ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]" : "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
         "ds:py-[var(--spacing-sm)]",
         // Hairline border + downward chrome shadow cast the header as a
         // sticky top band above the scrolling body.
@@ -346,9 +350,9 @@ const Bs = b(({ className: e, ...a }, r) => {
     }
   );
 });
-Bs.displayName = "SidebarHeader";
-const Rs = b(
-  ({ className: e, children: a, ...r }, n) => (
+Ds.displayName = "SidebarHeader";
+const _s = b(
+  ({ className: e, children: a, ...r }, i) => (
     // Scroll the nav sections through the kit `ScrollArea` (8px tokenised
     // scrollbar) instead of native `overflow-auto` (the OS scrollbar), so the
     // sidebar matches the Control Room rail and the kit's trays. `flex-1 min-h-0`
@@ -356,14 +360,14 @@ const Rs = b(
     // body box (the ScrollArea root). Padding + `ref` + div props go on the inner
     // content div so the scrollbar sits flush at the inline-end edge.
     /* @__PURE__ */ s(
-      os,
+      ts,
       {
         orientation: "vertical",
         className: ["ds:flex-1 ds:min-h-0", e ?? ""].filter(Boolean).join(" "),
         children: /* @__PURE__ */ s(
           "div",
           {
-            ref: n,
+            ref: i,
             className: "ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:py-[var(--spacing-sm)]",
             ...r,
             children: a
@@ -373,9 +377,9 @@ const Rs = b(
     )
   )
 );
-Rs.displayName = "SidebarBody";
-const Ds = b(({ className: e, ...a }, r) => {
-  const { mode: n } = x();
+_s.displayName = "SidebarBody";
+const Ps = b(({ className: e, ...a }, r) => {
+  const { mode: i } = x();
   return /* @__PURE__ */ s(
     "div",
     {
@@ -384,7 +388,7 @@ const Ds = b(({ className: e, ...a }, r) => {
         "ds:relative ds:flex ds:items-center ds:gap-[var(--spacing-xs)]",
         // Icon-rail is 64px — two 44×44 controls can't sit side-by-side,
         // so switch to a vertical stack and let each row self-centre.
-        n === "icon" ? "ds:flex-col ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]" : "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+        i === "icon" ? "ds:flex-col ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]" : "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
         "ds:min-h-[var(--min-target-size)]",
         "ds:py-[var(--spacing-sm)]",
         // Hairline border + upward chrome shadow cast the footer as a
@@ -397,8 +401,8 @@ const Ds = b(({ className: e, ...a }, r) => {
     }
   );
 });
-Ds.displayName = "SidebarFooter";
-const As = [
+Ps.displayName = "SidebarFooter";
+const Es = [
   "ds:group/section-label ds:flex ds:w-full ds:items-center",
   "type-eyebrow",
   "ds:text-[var(--muted-foreground)]",
@@ -418,21 +422,21 @@ const As = [
     label: e,
     icon: a,
     collapsible: r = !0,
-    defaultOpen: n = !0,
-    open: d,
-    onOpenChange: l,
-    className: t,
-    children: o,
-    ...c
+    defaultOpen: i = !0,
+    open: n,
+    onOpenChange: c,
+    className: o,
+    children: t,
+    ...l
   }, p) => {
-    const { mode: f } = x(), g = f === "icon", N = r && !g && !!e, y = [
+    const { mode: f } = x(), g = f === "icon", w = r && !g && !!e, y = [
       "ds:flex ds:flex-col",
       "ds:gap-[var(--spacing-xs)]",
       "ds:mt-[var(--spacing-sm)]",
-      t ?? ""
+      o ?? ""
     ].filter(Boolean).join(" ");
-    if (!N)
-      return /* @__PURE__ */ u("div", { ref: p, className: y, ...c, children: [
+    if (!w)
+      return /* @__PURE__ */ u("div", { ref: p, className: y, ...l, children: [
         !!e || !!a ? /* @__PURE__ */ u(
           "span",
           {
@@ -450,20 +454,20 @@ const As = [
             ]
           }
         ) : null,
-        o
+        t
       ] });
-    const i = "section";
+    const d = "section";
     return /* @__PURE__ */ s(
       E.Root,
       {
         type: "single",
         collapsible: !0,
-        defaultValue: d === void 0 && n ? i : void 0,
-        value: d === void 0 ? void 0 : d ? i : "",
-        onValueChange: l ? (w) => l(w === i) : void 0,
+        defaultValue: n === void 0 && i ? d : void 0,
+        value: n === void 0 ? void 0 : n ? d : "",
+        onValueChange: c ? (N) => c(N === d) : void 0,
         asChild: !0,
-        children: /* @__PURE__ */ s("div", { ref: p, className: y, ...c, children: /* @__PURE__ */ u(E.Item, { value: i, children: [
-          /* @__PURE__ */ s(E.Header, { className: "ds:flex", children: /* @__PURE__ */ u(E.Trigger, { className: As, children: [
+        children: /* @__PURE__ */ s("div", { ref: p, className: y, ...l, children: /* @__PURE__ */ u(E.Item, { value: d, children: [
+          /* @__PURE__ */ s(E.Header, { className: "ds:flex", children: /* @__PURE__ */ u(E.Trigger, { className: Es, children: [
             a ? /* @__PURE__ */ s("span", { "aria-hidden": "true", className: Q, children: a }) : null,
             /* @__PURE__ */ s("span", { className: "ds:flex-1 ds:text-start", children: e }),
             /* @__PURE__ */ s(
@@ -475,11 +479,11 @@ const As = [
             )
           ] }) }),
           /* @__PURE__ */ s(
-            ts,
+            os,
             {
               "aria-label": e,
               className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:[&>div]:contents",
-              children: o
+              children: t
             }
           )
         ] }) })
@@ -488,7 +492,7 @@ const As = [
   }
 );
 as.displayName = "SidebarSection";
-const Ps = [
+const Hs = [
   "ds:group ds:flex ds:w-full ds:items-center ds:gap-[var(--spacing-sm)]",
   "ds:min-h-[var(--min-target-size)]",
   "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
@@ -499,29 +503,29 @@ const Ps = [
   "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
   "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
   "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
-].join(" "), _s = b(
+].join(" "), Fs = b(
   ({
     label: e,
     icon: a,
     children: r,
-    className: n,
-    defaultOpen: d,
-    open: l,
-    onOpenChange: t,
-    ...o
-  }, c) => {
+    className: i,
+    defaultOpen: n,
+    open: c,
+    onOpenChange: o,
+    ...t
+  }, l) => {
     const { mode: p } = x();
     return /* @__PURE__ */ u(
-      V.Root,
+      K.Root,
       {
-        ref: c,
-        defaultOpen: d,
-        open: l,
-        onOpenChange: t,
-        className: n,
-        ...o,
+        ref: l,
+        defaultOpen: n,
+        open: c,
+        onOpenChange: o,
+        className: i,
+        ...t,
         children: [
-          /* @__PURE__ */ u(V.Trigger, { className: Ps, children: [
+          /* @__PURE__ */ u(K.Trigger, { className: Hs, children: [
             a ? /* @__PURE__ */ s(
               "span",
               {
@@ -549,7 +553,7 @@ const Ps = [
             ) : null
           ] }),
           /* @__PURE__ */ s(
-            V.Content,
+            K.Content,
             {
               className: [
                 "ds:overflow-hidden",
@@ -565,8 +569,8 @@ const Ps = [
     );
   }
 );
-_s.displayName = "SidebarGroup";
-const Es = I(
+Fs.displayName = "SidebarGroup";
+const Us = T(
   [
     // Every row is a pin-hover parent so inline pin / reorder affordances can
     // fade in on hover of the whole row — keep `group/item` on this selector.
@@ -627,55 +631,55 @@ const Es = I(
       isActive: !1
     }
   }
-), rs = W(null), is = b(
+), rs = Z(null), ds = b(
   ({
     asChild: e = !1,
     isActive: a = !1,
     navId: r,
-    isPinned: n = !1,
-    onPinChange: d,
-    pinLabel: l,
-    className: t,
-    children: o,
-    "aria-label": c,
+    isPinned: i = !1,
+    onPinChange: n,
+    pinLabel: c,
+    className: o,
+    children: t,
+    "aria-label": l,
     ...p
   }, f) => {
-    const { mode: g, density: N } = x(), y = e ? ls : "a", i = d !== void 0 && g !== "icon", [w, z] = R(null), m = g === "icon" && c != null && w ? `${c}, ${w}` : c, S = /* @__PURE__ */ s(
+    const { mode: g, density: w } = x(), y = e ? ls : "a", d = n !== void 0 && g !== "icon", [N, z] = B(null), m = g === "icon" && l != null && N ? `${l}, ${N}` : l, S = /* @__PURE__ */ s(
       y,
       {
         ref: f,
         "aria-current": a ? "page" : void 0,
         "aria-label": m,
         "data-nav-id": r,
-        className: Es({
+        className: Us({
           mode: g,
-          density: N,
+          density: w,
           isActive: a,
-          className: i ? "ds:flex-1 ds:min-w-0" : t
+          className: d ? "ds:flex-1 ds:min-w-0" : o
         }),
         ...p,
-        children: o
+        children: t
       }
-    ), j = i ? /* @__PURE__ */ u(
+    ), j = d ? /* @__PURE__ */ u(
       "div",
       {
         className: [
           "ds:group/item ds:flex ds:items-center ds:gap-[var(--spacing-2xs)]",
-          t ?? ""
+          o ?? ""
         ].filter(Boolean).join(" "),
         children: [
           S,
           /* @__PURE__ */ s(
             Y,
             {
-              isPinned: n,
-              label: l ?? c ?? "",
-              onPinChange: d
+              isPinned: i,
+              label: c ?? l ?? "",
+              onPinChange: n
             }
           )
         ]
       }
-    ) : S, C = g === "icon" && c ? /* @__PURE__ */ u(h.Root, { children: [
+    ) : S, C = g === "icon" && l ? /* @__PURE__ */ u(h.Root, { children: [
       /* @__PURE__ */ s(h.Trigger, { asChild: !0, children: j }),
       /* @__PURE__ */ s(h.Portal, { children: /* @__PURE__ */ u(
         h.Content,
@@ -690,7 +694,7 @@ const Es = I(
             "ds:animate-in ds:fade-in ds:zoom-in-95 ds:motion-reduce:animate-none"
           ].join(" "),
           children: [
-            c,
+            l,
             /* @__PURE__ */ s(h.Arrow, { className: "ds:fill-[var(--foreground)]" })
           ]
         }
@@ -699,11 +703,11 @@ const Es = I(
     return /* @__PURE__ */ s(rs.Provider, { value: z, children: C });
   }
 );
-is.displayName = "SidebarItem";
-const Hs = b(({ className: e, children: a, ...r }, n) => /* @__PURE__ */ s(
+ds.displayName = "SidebarItem";
+const Ms = b(({ className: e, children: a, ...r }, i) => /* @__PURE__ */ s(
   "span",
   {
-    ref: n,
+    ref: i,
     "aria-hidden": "true",
     className: [
       "ds:inline-flex ds:shrink-0 ds:items-center ds:justify-center",
@@ -721,18 +725,18 @@ const Hs = b(({ className: e, children: a, ...r }, n) => /* @__PURE__ */ s(
     children: a
   }
 ));
-Hs.displayName = "SidebarItemIcon";
-const Fs = b(({ className: e, children: a, ...r }, n) => {
-  const { mode: d } = x();
+Ms.displayName = "SidebarItemIcon";
+const Vs = b(({ className: e, children: a, ...r }, i) => {
+  const { mode: n } = x();
   return /* @__PURE__ */ s(
     "span",
     {
-      ref: n,
+      ref: i,
       className: [
         "ds:flex-1",
         "ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap ds:break-normal",
         "ds:text-start",
-        d === "icon" ? "ds:sr-only" : "",
+        n === "icon" ? "ds:sr-only" : "",
         e ?? ""
       ].filter(Boolean).join(" "),
       ...r,
@@ -740,22 +744,22 @@ const Fs = b(({ className: e, children: a, ...r }, n) => {
     }
   );
 });
-Fs.displayName = "SidebarItemLabel";
-const Ms = b(({ className: e, children: a, ...r }, n) => {
-  const { mode: d } = x(), l = d === "icon", t = Z(rs);
-  return U(() => {
-    if (!t || !l) return;
-    const o = a == null || a === !1 ? null : String(a).trim() || null;
-    return t(o), () => t(null);
-  }, [t, a, l]), /* @__PURE__ */ s(
+Vs.displayName = "SidebarItemLabel";
+const Ks = b(({ className: e, children: a, ...r }, i) => {
+  const { mode: n } = x(), c = n === "icon", o = q(rs);
+  return L(() => {
+    if (!o || !c) return;
+    const t = a == null || a === !1 ? null : String(a).trim() || null;
+    return o(t), () => o(null);
+  }, [o, a, c]), /* @__PURE__ */ s(
     "span",
     {
-      ref: n,
-      "aria-hidden": l ? "true" : void 0,
+      ref: i,
+      "aria-hidden": c ? "true" : void 0,
       className: [
         "ds:inline-flex ds:items-center ds:justify-center",
         "ds:font-[var(--font-weight-semibold)]",
-        l ? [
+        c ? [
           "ds:absolute ds:top-[2px] ds:end-[2px]",
           "ds:min-w-0 ds:size-[10px] ds:ps-0 ds:pe-0",
           "ds:rounded-[var(--radius-full)]",
@@ -776,55 +780,91 @@ const Ms = b(({ className: e, children: a, ...r }, n) => {
     }
   );
 });
-Ms.displayName = "SidebarItemBadge";
-const Ks = I(
+Ks.displayName = "SidebarItemBadge";
+const Ls = T(
   [
-    "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]",
-    "ds:min-h-[var(--min-target-size)]",
-    "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
-    "ds:rounded-[var(--radius-md)]",
-    "ds:text-[var(--foreground)] ds:text-[length:var(--font-size-sm)]",
-    "ds:hover:bg-[var(--muted)]/20",
+    "ds:flex ds:items-center",
+    "ds:text-[var(--foreground)]",
+    "ds:transition-colors ds:motion-reduce:transition-none",
     "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
     "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
     "ds:forced-colors:focus-visible:outline-[CanvasText]",
     "ds:no-underline"
-  ].join(" ")
-), Ls = b(({ logo: e, name: a, showChevron: r = !0, className: n, ...d }, l) => {
-  const { mode: t } = x(), o = t !== "icon";
-  return /* @__PURE__ */ u(
-    "button",
-    {
-      ref: l,
-      type: "button",
-      "aria-label": a,
-      className: [Ks(), n].filter(Boolean).join(" "),
-      ...d,
-      children: [
-        /* @__PURE__ */ s(
-          "span",
-          {
-            "aria-hidden": "true",
-            className: "ds:inline-flex ds:items-center ds:shrink-0",
-            children: e
-          }
-        ),
-        o ? /* @__PURE__ */ u(q, { children: [
-          /* @__PURE__ */ s("span", { className: "ds:truncate ds:flex-1 ds:text-start ds:max-w-[var(--header-workspace-max-inline-size)]", children: a }),
-          r ? /* @__PURE__ */ s(
-            H,
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        // Borderless (Linear / Notion style): transparent at rest with a
+        // muted hover fill, a 44px tap target, roomier radius, and the dense
+        // `--font-size-sm` label. The historical default.
+        ghost: [
+          "ds:min-h-[var(--min-target-size)]",
+          "ds:gap-[var(--spacing-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
+          "ds:text-[length:var(--font-size-sm)]",
+          "ds:rounded-[var(--radius-md)]",
+          "ds:hover:bg-[var(--muted)]/20"
+        ].join(" "),
+        // Input-field look: consumes the SAME shared input-surface tokens as
+        // <TextInput size="sm"> — height, text size and horizontal inset — so
+        // a practice / workspace selector stacked directly above the sidebar
+        // <SearchBar size="sm"> renders as a genuinely matched pair (identical
+        // 32px box and label size) and stays in lockstep if that surface
+        // evolves. `gap-3` + the shared `ps-3` line the pin glyph and label up
+        // with the search input's icon and text below. The bordered
+        // `--input`/`--shadow-input`/`--radius-sm` chrome mirrors the input's
+        // resting surface; opaque hover keeps the fill solid over a
+        // brand-tinted parent. 32px clears WCAG 2.5.8 (24px AA).
+        field: [
+          vs.sm,
+          ps.sm,
+          fs.sm,
+          "ds:gap-3",
+          "ds:rounded-[var(--radius-sm)]",
+          "ds:border ds:border-[var(--border)] ds:bg-[var(--input)]",
+          "ds:shadow-[var(--shadow-input)]",
+          "ds:hover:bg-[color-mix(in_srgb,var(--muted)_20%,var(--input))]"
+        ].join(" ")
+      }
+    },
+    defaultVariants: { variant: "ghost" }
+  }
+), Gs = b(
+  ({ logo: e, name: a, showChevron: r = !0, variant: i = "ghost", className: n, ...c }, o) => {
+    const { mode: t } = x(), l = t !== "icon";
+    return /* @__PURE__ */ u(
+      "button",
+      {
+        ref: o,
+        type: "button",
+        "aria-label": a,
+        className: [Ls({ variant: i }), n].filter(Boolean).join(" "),
+        ...c,
+        children: [
+          /* @__PURE__ */ s(
+            "span",
             {
               "aria-hidden": "true",
-              className: "ds:size-4 ds:shrink-0 ds:rotate-90"
+              className: "ds:inline-flex ds:items-center ds:shrink-0",
+              children: e
             }
-          ) : null
-        ] }) : null
-      ]
-    }
-  );
-});
-Ls.displayName = "SidebarWorkspaceSwitcher";
-const Vs = I(
+          ),
+          l ? /* @__PURE__ */ u(X, { children: [
+            /* @__PURE__ */ s("span", { className: "ds:truncate ds:flex-1 ds:text-start ds:max-w-[var(--header-workspace-max-inline-size)]", children: a }),
+            r ? /* @__PURE__ */ s(
+              H,
+              {
+                "aria-hidden": "true",
+                className: "ds:size-4 ds:shrink-0 ds:rotate-90"
+              }
+            ) : null
+          ] }) : null
+        ]
+      }
+    );
+  }
+);
+Gs.displayName = "SidebarWorkspaceSwitcher";
+const $s = T(
   [
     "ds:flex ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)]",
     "ds:min-h-[var(--min-target-size)]",
@@ -847,17 +887,17 @@ const Vs = I(
     },
     defaultVariants: { mode: "expanded" }
   }
-), Us = b(({ icon: e, label: a, shortcut: r, className: n, ...d }, l) => {
-  const { mode: t } = x(), o = t !== "icon";
+), Os = b(({ icon: e, label: a, shortcut: r, className: i, ...n }, c) => {
+  const { mode: o } = x(), t = o !== "icon";
   return /* @__PURE__ */ u(
     "button",
     {
-      ref: l,
+      ref: c,
       type: "button",
       "aria-label": a,
       "aria-keyshortcuts": r,
-      className: [Vs({ mode: t }), n].filter(Boolean).join(" "),
-      ...d,
+      className: [$s({ mode: o }), i].filter(Boolean).join(" "),
+      ...n,
       children: [
         /* @__PURE__ */ s(
           "span",
@@ -867,7 +907,7 @@ const Vs = I(
             children: e
           }
         ),
-        o ? /* @__PURE__ */ u(q, { children: [
+        t ? /* @__PURE__ */ u(X, { children: [
           /* @__PURE__ */ s("span", { className: "ds:truncate", children: a }),
           r ? /* @__PURE__ */ s("kbd", { className: "ds:ms-auto ds:text-[length:var(--font-size-xs)] ds:font-[family-name:var(--font-mono)] ds:opacity-80", children: r }) : null
         ] }) : null
@@ -875,8 +915,8 @@ const Vs = I(
     }
   );
 });
-Us.displayName = "SidebarPrimaryAction";
-const $s = [
+Os.displayName = "SidebarPrimaryAction";
+const Xs = [
   "ds:inline-flex ds:items-center ds:justify-center ds:shrink-0",
   "ds:size-6 ds:rounded-[var(--radius-sm)]",
   // Lift above the Sidebar's opt-in resize handle (z-[2]). When `resizable`,
@@ -901,24 +941,24 @@ const $s = [
   "ds:transition-[color,opacity,background-color] ds:duration-[var(--animation-duration)]",
   "ds:motion-reduce:transition-none"
 ].join(" "), Y = b(
-  ({ isPinned: e, onPinChange: a, label: r, className: n, onClick: d, ...l }, t) => {
-    const { t: o } = D(), { mode: c } = x();
-    if (c === "icon") return null;
-    const p = e ? o("navigation.sidebar.unpinItem", "Unpin {{label}}", { label: r }) : o("navigation.sidebar.pinItem", "Pin {{label}}", { label: r });
+  ({ isPinned: e, onPinChange: a, label: r, className: i, onClick: n, ...c }, o) => {
+    const { t } = A(), { mode: l } = x();
+    if (l === "icon") return null;
+    const p = e ? t("navigation.sidebar.unpinItem", "Unpin {{label}}", { label: r }) : t("navigation.sidebar.pinItem", "Pin {{label}}", { label: r });
     return /* @__PURE__ */ s(
       "button",
       {
-        ref: t,
+        ref: o,
         type: "button",
         "aria-label": p,
         "aria-pressed": e,
-        className: [$s, n].filter(Boolean).join(" "),
+        className: [Xs, i].filter(Boolean).join(" "),
         onClick: (f) => {
-          f.preventDefault(), f.stopPropagation(), a == null || a(!e), d == null || d(f);
+          f.preventDefault(), f.stopPropagation(), a == null || a(!e), n == null || n(f);
         },
-        ...l,
+        ...c,
         children: /* @__PURE__ */ s(
-          fs,
+          hs,
           {
             "aria-hidden": "true",
             className: "ds:size-4",
@@ -930,31 +970,31 @@ const $s = [
   }
 );
 Y.displayName = "SidebarPinButton";
-const ns = W(null), Os = () => Z(ns), Gs = b(
-  ({ heading: e, emptyMessage: a, onReorder: r, className: n, children: d, ...l }, t) => {
-    const { t: o } = D(), c = e ?? o("navigation.sidebar.favorites", "Favourites"), p = Array.isArray(d) ? d.filter(Boolean) : d ? [d] : [], f = p.length, g = f > 0, [N, y] = R(null), [i, w] = R(""), z = $(!1), m = ss((j) => {
-      z.current = !z.current, w(z.current ? j : `${j}​`);
-    }, []), S = O(
-      () => ({ onReorder: r, count: f, dragSource: N, setDragSource: y, announce: m }),
-      [r, f, N, m]
+const is = Z(null), qs = () => q(is), Zs = b(
+  ({ heading: e, emptyMessage: a, onReorder: r, className: i, children: n, ...c }, o) => {
+    const { t } = A(), l = e ?? t("navigation.sidebar.favorites", "Favourites"), p = Array.isArray(n) ? n.filter(Boolean) : n ? [n] : [], f = p.length, g = f > 0, [w, y] = B(null), [d, N] = B(""), z = G(!1), m = ss((j) => {
+      z.current = !z.current, N(z.current ? j : `${j}​`);
+    }, []), S = $(
+      () => ({ onReorder: r, count: f, dragSource: w, setDragSource: y, announce: m }),
+      [r, f, w, m]
     );
-    return !g && !a ? null : /* @__PURE__ */ s(ns.Provider, { value: S, children: /* @__PURE__ */ u(
+    return !g && !a ? null : /* @__PURE__ */ s(is.Provider, { value: S, children: /* @__PURE__ */ u(
       as,
       {
-        ref: t,
-        label: c,
-        className: n,
-        ...l,
+        ref: o,
+        label: l,
+        className: i,
+        ...c,
         children: [
           g ? p : /* @__PURE__ */ s("p", { className: "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] type-meta ds:text-[color:var(--muted-foreground)]", children: a }),
-          /* @__PURE__ */ s("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: i })
+          /* @__PURE__ */ s("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: d })
         ]
       }
     ) });
   }
 );
-Gs.displayName = "SidebarFavorites";
-const qs = I(
+Zs.displayName = "SidebarFavorites";
+const Ws = T(
   [
     "ds:group/item ds:relative ds:flex ds:items-center ds:gap-[var(--spacing-2xs)]",
     "ds:rounded-[var(--radius-sm)]",
@@ -973,7 +1013,7 @@ const qs = I(
     },
     defaultVariants: { dragging: !1, dropTarget: !1 }
   }
-), Zs = [
+), Ys = [
   "ds:inline-flex ds:items-center ds:justify-center ds:shrink-0",
   "ds:size-6 ds:rounded-[var(--radius-sm)]",
   "ds:cursor-grab ds:active:cursor-grabbing",
@@ -987,68 +1027,68 @@ const qs = I(
   "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
   "ds:forced-colors:focus-visible:outline-[CanvasText]",
   "ds:transition-[color,opacity,background-color] ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
-].join(" "), Ws = b(
+].join(" "), Js = b(
   ({
     index: e,
     isActive: a = !1,
     asChild: r = !1,
-    reorderLabel: n,
-    isPinned: d = !1,
-    onPinChange: l,
-    pinLabel: t,
-    "aria-label": o,
-    className: c,
+    reorderLabel: i,
+    isPinned: n = !1,
+    onPinChange: c,
+    pinLabel: o,
+    "aria-label": t,
+    className: l,
     children: p,
     ...f
   }, g) => {
-    const { t: N } = D(), { mode: y } = x(), i = Os(), [w, z] = R(!1), m = !!(i != null && i.onReorder) && y !== "icon", S = n ?? o ?? "", j = ds(), C = (v, T) => {
-      if (!(i != null && i.onReorder)) return;
-      const L = Math.max(0, Math.min(i.count - 1, T));
-      L !== v && (i.onReorder(v, L), i.announce(
-        N(
+    const { t: w } = A(), { mode: y } = x(), d = qs(), [N, z] = B(!1), m = !!(d != null && d.onReorder) && y !== "icon", S = i ?? t ?? "", j = ns(), C = (v, I) => {
+      if (!(d != null && d.onReorder)) return;
+      const V = Math.max(0, Math.min(d.count - 1, I));
+      V !== v && (d.onReorder(v, V), d.announce(
+        w(
           "navigation.sidebar.reorderAnnounce",
           "{{label}} moved to position {{to}} of {{total}}",
-          { label: S, to: L + 1, total: i.count }
+          { label: S, to: V + 1, total: d.count }
         )
       ));
     }, F = (v) => {
-      m && (v.altKey && v.key === "ArrowUp" ? (v.preventDefault(), C(e, e - 1)) : v.altKey && v.key === "ArrowDown" ? (v.preventDefault(), C(e, e + 1)) : v.key === "Home" && v.altKey ? (v.preventDefault(), C(e, 0)) : v.key === "End" && v.altKey && (v.preventDefault(), C(e, i.count - 1)));
-    }, A = (v) => {
-      m && (i == null || i.setDragSource(e), v.dataTransfer && (v.dataTransfer.effectAllowed = "move", v.dataTransfer.setData("ds:text/plain", String(e))));
-    }, P = () => {
-      i == null || i.setDragSource(null), z(!1);
-    }, M = (v) => {
-      !m || (i == null ? void 0 : i.dragSource) === null || (v.preventDefault(), v.dataTransfer && (v.dataTransfer.dropEffect = "move"), z(!0));
-    }, _ = () => z(!1), K = (v) => {
+      m && (v.altKey && v.key === "ArrowUp" ? (v.preventDefault(), C(e, e - 1)) : v.altKey && v.key === "ArrowDown" ? (v.preventDefault(), C(e, e + 1)) : v.key === "Home" && v.altKey ? (v.preventDefault(), C(e, 0)) : v.key === "End" && v.altKey && (v.preventDefault(), C(e, d.count - 1)));
+    }, D = (v) => {
+      m && (d == null || d.setDragSource(e), v.dataTransfer && (v.dataTransfer.effectAllowed = "move", v.dataTransfer.setData("ds:text/plain", String(e))));
+    }, _ = () => {
+      d == null || d.setDragSource(null), z(!1);
+    }, U = (v) => {
+      !m || (d == null ? void 0 : d.dragSource) === null || (v.preventDefault(), v.dataTransfer && (v.dataTransfer.dropEffect = "move"), z(!0));
+    }, P = () => z(!1), M = (v) => {
       if (!m) return;
       v.preventDefault();
-      const T = i == null ? void 0 : i.dragSource;
-      z(!1), !(T == null || T === e) && C(T, e);
-    }, k = (i == null ? void 0 : i.dragSource) === e;
+      const I = d == null ? void 0 : d.dragSource;
+      z(!1), !(I == null || I === e) && C(I, e);
+    }, k = (d == null ? void 0 : d.dragSource) === e;
     return /* @__PURE__ */ u(
       "div",
       {
-        className: qs({
+        className: Ws({
           dragging: k,
-          dropTarget: w && !k
+          dropTarget: N && !k
         }),
         draggable: m || void 0,
-        onDragStart: m ? A : void 0,
-        onDragEnd: m ? P : void 0,
-        onDragOver: M,
-        onDragLeave: _,
-        onDrop: K,
+        onDragStart: m ? D : void 0,
+        onDragEnd: m ? _ : void 0,
+        onDragOver: U,
+        onDragLeave: P,
+        onDrop: M,
         children: [
           /* @__PURE__ */ s(
-            is,
+            ds,
             {
               ref: g,
               isActive: a,
               asChild: r,
-              "aria-label": o,
+              "aria-label": t,
               "aria-describedby": m ? j : void 0,
               draggable: m ? !1 : void 0,
-              className: [m ? "ds:flex-1 ds:min-w-0" : "", c ?? ""].filter(Boolean).join(" "),
+              className: [m ? "ds:flex-1 ds:min-w-0" : "", l ?? ""].filter(Boolean).join(" "),
               ...f,
               children: p
             }
@@ -1058,22 +1098,22 @@ const qs = I(
             {
               type: "button",
               id: j,
-              "aria-label": N(
+              "aria-label": w(
                 "navigation.sidebar.reorderHandle",
                 "Reorder {{label}}. Press Alt + Up or Alt + Down to move.",
                 { label: S }
               ),
-              className: Zs,
+              className: Ys,
               onKeyDown: F,
-              children: /* @__PURE__ */ s(ps, { "aria-hidden": "true", className: "ds:size-4" })
+              children: /* @__PURE__ */ s(bs, { "aria-hidden": "true", className: "ds:size-4" })
             }
           ) : null,
-          l && y !== "icon" ? /* @__PURE__ */ s(
+          c && y !== "icon" ? /* @__PURE__ */ s(
             Y,
             {
-              isPinned: d,
-              label: t ?? o ?? "",
-              onPinChange: l
+              isPinned: n,
+              label: o ?? t ?? "",
+              onPinChange: c
             }
           ) : null
         ]
@@ -1081,8 +1121,8 @@ const qs = I(
     );
   }
 );
-Ws.displayName = "SidebarFavoriteItem";
-const Xs = I(
+Js.displayName = "SidebarFavoriteItem";
+const Qs = T(
   [
     "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]",
     "ds:min-h-[var(--min-target-size)]",
@@ -1095,16 +1135,16 @@ const Xs = I(
     "ds:forced-colors:focus-visible:outline-[CanvasText]",
     "ds:no-underline"
   ].join(" ")
-), Ys = b(({ avatar: e, name: a, subtitle: r, subtitleLabel: n, className: d, ...l }, t) => {
-  const { mode: o } = x(), c = o !== "icon", p = typeof r == "string" ? r : n;
+), se = b(({ avatar: e, name: a, subtitle: r, subtitleLabel: i, className: n, ...c }, o) => {
+  const { mode: t } = x(), l = t !== "icon", p = typeof r == "string" ? r : i;
   return /* @__PURE__ */ u(
     "button",
     {
-      ref: t,
+      ref: o,
       type: "button",
       "aria-label": p ? `${a}, ${p}` : a,
-      className: [Xs(), d].filter(Boolean).join(" "),
-      ...l,
+      className: [Qs(), n].filter(Boolean).join(" "),
+      ...c,
       children: [
         /* @__PURE__ */ s(
           "span",
@@ -1114,7 +1154,7 @@ const Xs = I(
             children: e
           }
         ),
-        c ? /* @__PURE__ */ u("span", { className: "ds:flex-1 ds:min-w-0 ds:text-start", children: [
+        l ? /* @__PURE__ */ u("span", { className: "ds:flex-1 ds:min-w-0 ds:text-start", children: [
           /* @__PURE__ */ s("span", { className: "ds:block ds:truncate type-label", children: a }),
           r ? typeof r == "string" ? /* @__PURE__ */ s("span", { className: "ds:block ds:truncate type-meta ds:text-[color:var(--muted-foreground)]", children: r }) : /* @__PURE__ */ s("span", { className: "ds:flex ds:items-center ds:gap-[length:var(--spacing-xs)] ds:min-w-0 type-meta ds:text-[color:var(--muted-foreground)]", children: r }) : null
         ] }) : null
@@ -1122,8 +1162,8 @@ const Xs = I(
     }
   );
 });
-Ys.displayName = "SidebarProfilePill";
-const Js = [
+se.displayName = "SidebarProfilePill";
+const ee = [
   "ds:inline-flex ds:items-center ds:justify-center ds:shrink-0",
   "ds:min-w-[var(--min-target-size)] ds:min-h-[var(--min-target-size)]",
   "ds:rounded-[var(--radius-sm)]",
@@ -1133,29 +1173,29 @@ const Js = [
   "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
   "ds:forced-colors:focus-visible:outline-[CanvasText]",
   "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
-].join(" "), Qs = b(({ className: e, "aria-label": a, onClick: r, ...n }, d) => {
-  const { t: l } = D(), { mode: t, transitionTo: o } = x();
-  if (t === "overlay") return null;
-  const c = t === "expanded", p = a ?? (c ? l("navigation.sidebar.collapse", "Collapse sidebar") : l("navigation.sidebar.expand", "Expand sidebar")), f = /* @__PURE__ */ s(
+].join(" "), ae = b(({ className: e, "aria-label": a, onClick: r, ...i }, n) => {
+  const { t: c } = A(), { mode: o, transitionTo: t } = x();
+  if (o === "overlay") return null;
+  const l = o === "expanded", p = a ?? (l ? c("navigation.sidebar.collapse", "Collapse sidebar") : c("navigation.sidebar.expand", "Expand sidebar")), f = /* @__PURE__ */ s(
     "button",
     {
-      ref: d,
+      ref: n,
       type: "button",
       "aria-label": p,
-      "aria-expanded": c,
+      "aria-expanded": l,
       onClick: (g) => {
-        o == null || o(c ? "icon" : "expanded"), r == null || r(g);
+        t == null || t(l ? "icon" : "expanded"), r == null || r(g);
       },
-      className: [Js, e].filter(Boolean).join(" "),
-      ...n,
-      children: c ? /* @__PURE__ */ s(
-        bs,
+      className: [ee, e].filter(Boolean).join(" "),
+      ...i,
+      children: l ? /* @__PURE__ */ s(
+        ys,
         {
           "aria-hidden": "true",
           className: "ds:size-4 ds:rtl:-scale-x-100"
         }
       ) : /* @__PURE__ */ s(
-        xs,
+        ws,
         {
           "aria-hidden": "true",
           className: "ds:size-4 ds:rtl:-scale-x-100"
@@ -1168,7 +1208,7 @@ const Js = [
     /* @__PURE__ */ s(h.Portal, { children: /* @__PURE__ */ u(
       h.Content,
       {
-        side: t === "icon" ? "right" : "top",
+        side: o === "icon" ? "right" : "top",
         sideOffset: 6,
         className: [
           "ds:z-[var(--z-tooltip)] ds:max-w-[16rem]",
@@ -1185,8 +1225,8 @@ const Js = [
     ) })
   ] });
 });
-Qs.displayName = "SidebarCollapseTrigger";
-const se = I(
+ae.displayName = "SidebarCollapseTrigger";
+const re = T(
   [
     "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]",
     "ds:rounded-[var(--radius-md)]",
@@ -1217,18 +1257,18 @@ const se = I(
     },
     defaultVariants: { mode: "expanded" }
   }
-), ee = b(({ title: e, description: a, icon: r, className: n, ...d }, l) => {
-  const { mode: t } = x(), o = t === "icon", c = (
+), de = b(({ title: e, description: a, icon: r, className: i, ...n }, c) => {
+  const { mode: o } = x(), t = o === "icon", l = (
     // aria-label only in icon mode (where the copy is hidden) — in
     // expanded mode the accessible name comes from the visible contents
     // so the description isn't excluded from it.
     /* @__PURE__ */ u(
       "a",
       {
-        ref: l,
-        "aria-label": o ? e : void 0,
-        className: se({ mode: t, className: n }),
-        ...d,
+        ref: c,
+        "aria-label": t ? e : void 0,
+        className: re({ mode: o, className: i }),
+        ...n,
         children: [
           /* @__PURE__ */ s(
             "span",
@@ -1239,10 +1279,10 @@ const se = I(
                 "ds:rounded-[var(--radius-sm)]",
                 "ds:bg-[var(--accent)] ds:text-[var(--accent-foreground)]"
               ].join(" "),
-              children: r ?? /* @__PURE__ */ s(ws, { className: "ds:size-4" })
+              children: r ?? /* @__PURE__ */ s(Ss, { className: "ds:size-4" })
             }
           ),
-          o ? null : /* @__PURE__ */ u(q, { children: [
+          t ? null : /* @__PURE__ */ u(X, { children: [
             /* @__PURE__ */ u("span", { className: "ds:flex-1 ds:min-w-0 ds:text-start", children: [
               /* @__PURE__ */ s("span", { className: "ds:block ds:line-clamp-2 type-label", children: e }),
               a ? (
@@ -1263,8 +1303,8 @@ const se = I(
       }
     )
   );
-  return o ? /* @__PURE__ */ u(h.Root, { children: [
-    /* @__PURE__ */ s(h.Trigger, { asChild: !0, children: c }),
+  return t ? /* @__PURE__ */ u(h.Root, { children: [
+    /* @__PURE__ */ s(h.Trigger, { asChild: !0, children: l }),
     /* @__PURE__ */ s(h.Portal, { children: /* @__PURE__ */ u(
       h.Content,
       {
@@ -1283,29 +1323,29 @@ const se = I(
         ]
       }
     ) })
-  ] }) : c;
+  ] }) : l;
 });
-ee.displayName = "SidebarUpgradeChip";
+de.displayName = "SidebarUpgradeChip";
 export {
-  Ts as S,
-  Rs as a,
-  Qs as b,
-  Ws as c,
-  Gs as d,
-  Ds as e,
-  _s as f,
-  Bs as g,
-  is as h,
-  Ms as i,
-  Hs as j,
-  Fs as k,
+  As as S,
+  _s as a,
+  ae as b,
+  Js as c,
+  Zs as d,
+  Ps as e,
+  Fs as f,
+  Ds as g,
+  ds as h,
+  Ks as i,
+  Ms as j,
+  Vs as k,
   Y as l,
-  Us as m,
-  Ys as n,
+  Os as m,
+  se as n,
   as as o,
-  ee as p,
-  Ls as q,
-  Ns as s,
+  de as p,
+  Gs as q,
+  js as s,
   x as u
 };
-//# sourceMappingURL=sidebar-B0OBmJrC.js.map
+//# sourceMappingURL=sidebar-C0PbwJBc.js.map