@alfadocs/ui-kit 1.57.0 → 1.59.0

package/dist/_chunks/sidebar-D_S2-SXH.js

@@ -0,0 +1,2165 @@
+import { jsxs as x, Fragment as ye, jsx as s } from "react/jsx-runtime";
+import { useId as fe, useState as se, useRef as V, useCallback as B, useEffect as ee, useMemo as xe, createContext as le, useContext as ce, forwardRef as $, isValidElement as Ze } from "react";
+import * as ge from "@radix-ui/react-dialog";
+import * as Ne from "@radix-ui/react-collapsible";
+import * as he from "@radix-ui/react-accordion";
+import * as C from "@radix-ui/react-tooltip";
+import { a as Je } from "./accordion-Ch3xp0mX.js";
+import { S as Qe } from "./scroll-area-CY5SLYNw.js";
+import { Slot as Le, Slottable as es } from "@radix-ui/react-slot";
+import { c as te } from "./index-D2ZczOXr.js";
+import { useTranslation as ue } from "react-i18next";
+import { u as ss } from "./registry-DvAUVLHh.js";
+import { u as ts } from "./use-edge-resize-DHbyQwu8.js";
+import { c as rs } from "./compose-refs-C0k0tdqF.js";
+import { a as ns, b as as, d as is } from "./input-surface-iBmxVBfr.js";
+import { u as os } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
+import { i as ds } from "./is-development-CLUAnsU7.js";
+import { X as cs } from "./x-B5YnXwCz.js";
+import { c as Me } from "./createLucideIcon-DhHxpK9K.js";
+import { G as ls } from "./grip-vertical-onSb1JXO.js";
+import { C as we } from "./chevron-right-I9AeSxH2.js";
+import { S as us } from "./star-Bf9L2Uot.js";
+import { T as ms } from "./trending-up-C_luYBzS.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 fs = [
+  ["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" }]
+], ps = Me("panel-left-close", fs);
+/**
+ * @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 vs = [
+  ["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" }]
+], gs = Me("panel-left-open", vs), bs = {
+  id: "sidebar",
+  capabilities: ["expand"],
+  state: {
+    isCollapsed: {
+      type: "boolean",
+      descriptionKey: "ui.agent.sidebar.state.isCollapsed",
+      description: "True when the sidebar is in its collapsed (rail) state.",
+      read: (e) => e.getIsCollapsed()
+    }
+  },
+  actions: {
+    toggle_collapsed: {
+      // Pure ephemeral chrome state — toggling the rail loses no data.
+      safety: "read",
+      descriptionKey: "ui.agent.sidebar.actions.toggleCollapsed",
+      description: "Toggle the sidebar between collapsed and expanded.",
+      invoke: (e) => {
+        e.toggleCollapsed();
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "sidebar" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-nav-id",
+      sourceProp: "navId",
+      description: "Each Sidebar.Item emits its `navId` prop as data-nav-id. Agents activate a nav item via native click on the matching anchor."
+    }
+  }
+}, ze = le({
+  enabled: !1,
+  move: null
+}), Se = () => ce(ze), Be = le(null), de = (e, r) => e.sectionId === r.sectionId && e.index === r.index, Fe = "[data-sidebar-item-id]", He = "[data-sidebar-section-id]";
+function me(e, r) {
+  var a;
+  const t = (a = e.parentElement) == null ? void 0 : a.closest(He);
+  return t && r.contains(t) ? t.dataset.sidebarSectionId ?? null : null;
+}
+function hs(e, r) {
+  var m;
+  const t = e.querySelector("[data-sidebar-body]") ?? e, a = Array.from(
+    t.querySelectorAll(`${He},${Fe}`)
+  ), i = /* @__PURE__ */ new Map([[null, []]]), c = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map();
+  let p = null;
+  for (const l of a) {
+    const g = l.dataset.sidebarSectionId;
+    if (g !== void 0) {
+      i.set(g, []), c.set(g, l.dataset.sidebarSectionOpen !== "false"), o.set(g, l.dataset.sidebarSectionLabel ?? "");
+      continue;
+    }
+    if (l.dataset.sidebarItemId === r) {
+      p = l;
+      continue;
+    }
+    const h = me(l, t);
+    (m = i.get(h)) == null || m.push(l);
+  }
+  if (!p) return null;
+  const u = (l) => {
+    var g;
+    return (((g = i.get(l)) == null ? void 0 : g.length) ?? 0) + 1;
+  }, v = [], I = i.get(null) ?? [], z = I.length === 0 && me(p, t) === null;
+  for (const l of a) {
+    const g = l.dataset.sidebarSectionId;
+    if (g !== void 0) {
+      const w = i.get(g) ?? [];
+      (!c.get(g) || w.length === 0) && v.push({
+        sectionId: g,
+        index: w.length,
+        total: u(g),
+        indicator: { kind: "section", sectionId: g }
+      });
+      continue;
+    }
+    if (l === p) {
+      z && v.push({
+        sectionId: null,
+        index: 0,
+        total: 1,
+        indicator: { kind: "item", itemId: r, edge: "before" }
+      });
+      continue;
+    }
+    const h = me(l, t);
+    if (h !== null && !c.get(h)) continue;
+    const D = i.get(h) ?? [], R = D.indexOf(l), j = l.dataset.sidebarItemId ?? "";
+    v.push({
+      sectionId: h,
+      index: R,
+      total: u(h),
+      indicator: { kind: "item", itemId: j, edge: "before" }
+    }), R === D.length - 1 && v.push({
+      sectionId: h,
+      index: R + 1,
+      total: u(h),
+      indicator: { kind: "item", itemId: j, edge: "after" }
+    });
+  }
+  I.length === 0 && !z && v.push({
+    sectionId: null,
+    index: 0,
+    total: 1,
+    indicator: { kind: "list" }
+  });
+  const N = me(p, t), A = (i.get(N) ?? []).filter(
+    (l) => l.compareDocumentPosition(p) & Node.DOCUMENT_POSITION_FOLLOWING
+  ).length;
+  return {
+    places: v,
+    originIndex: v.findIndex(
+      (l) => de(l, { sectionId: N, index: A })
+    ),
+    emptySectionIds: [...i.entries()].filter(([l, g]) => l !== null && c.get(l) && !g.length).map(([l]) => l),
+    listEmpty: I.length === 0 && !z,
+    sectionLabels: o
+  };
+}
+function xs(e, r) {
+  const t = e.querySelector("[data-sidebar-body]") ?? e, a = me(r, t), i = Array.from(t.querySelectorAll(Fe)).filter(
+    (c) => c !== r && me(c, t) === a && c.compareDocumentPosition(r) & Node.DOCUMENT_POSITION_FOLLOWING
+  ).length;
+  return { sectionId: a, index: i };
+}
+function Ue(e, r) {
+  var a;
+  const { indicator: t } = r;
+  return t.kind === "item" ? e.querySelector(
+    `[data-sidebar-item-id="${CSS.escape(t.itemId)}"]`
+  ) : t.kind === "list" ? e.querySelector("[data-sidebar-drop-zone-list]") : e.querySelector(
+    `[data-sidebar-drop-zone="${CSS.escape(t.sectionId)}"]`
+  ) ?? ((a = e.querySelector(
+    `[data-sidebar-section-id="${CSS.escape(t.sectionId)}"]`
+  )) == null ? void 0 : a.querySelector("[data-sidebar-section-heading]")) ?? null;
+}
+function ys(e, r) {
+  var a;
+  const t = (a = Ue(e, r)) == null ? void 0 : a.getBoundingClientRect();
+  return t ? r.indicator.kind === "item" ? r.indicator.edge === "before" ? t.top : t.bottom : t.top + t.height / 2 : r.indicator.kind === "item" ? Number.POSITIVE_INFINITY : e.getBoundingClientRect().bottom;
+}
+const ws = 450, Ss = 6, Ns = 5e3, Ie = 48, Is = 14;
+function zs({
+  onMoveItem: e,
+  enabled: r,
+  rootRef: t,
+  quietFocusRef: a
+}) {
+  const { t: i } = ue("ui"), c = fe(), [o, p] = se(null), u = V(null), v = V([]), I = V(/* @__PURE__ */ new Map()), z = V(/* @__PURE__ */ new Map()), N = V(null), A = V(e);
+  A.current = e;
+  const m = V(null), l = V(null), g = B((n) => {
+    u.current = n, p(n);
+  }, []), [h, D] = se(""), R = V(!1), j = B((n) => {
+    R.current = !R.current, D(R.current ? n : `${n}​`);
+  }, []), w = B(
+    (n) => n.sectionId === null ? i("navigation.sidebar.move.inList", {
+      position: n.index + 1,
+      total: n.total
+    }) : i("navigation.sidebar.move.inSection", {
+      section: I.current.get(n.sectionId) ?? "",
+      position: n.index + 1,
+      total: n.total
+    }),
+    [i]
+  ), F = B(
+    (n, y, T) => {
+      var X;
+      const d = t.current;
+      if (!d) return !1;
+      const b = hs(d, n);
+      if (!b || b.originIndex < 0) return !1;
+      v.current = b.places, I.current = b.sectionLabels;
+      const S = b.places[b.originIndex], M = T.getAttribute("aria-label") ?? ((X = T.textContent) == null ? void 0 : X.trim()) ?? "";
+      return g({
+        itemId: n,
+        label: M,
+        via: y,
+        origin: S,
+        target: S,
+        emptySectionIds: b.emptySectionIds,
+        listEmpty: b.listEmpty
+      }), j(
+        i("navigation.sidebar.move.pickedUp", {
+          item: M,
+          place: w(S)
+        })
+      ), !0;
+    },
+    [t, g, j, i, w]
+  ), E = B(
+    (n, y) => {
+      const T = u.current;
+      !T || de(T.target, n) || (g({ ...T, target: n }), y && (j(w(n)), requestAnimationFrame(() => {
+        var b, S;
+        const d = t.current;
+        d && ((S = (b = Ue(d, n)) == null ? void 0 : b.scrollIntoView) == null || S.call(b, { block: "nearest" }));
+      })));
+    },
+    [g, j, w, t]
+  ), H = B(() => {
+    var S, M;
+    const n = u.current;
+    if (!n) return;
+    g(null), v.current = [];
+    const { itemId: y, origin: T, target: d, label: b } = n;
+    de(T, d) || (N.current = {
+      itemId: y,
+      sectionId: d.sectionId,
+      index: d.index,
+      until: Date.now() + Ns
+    }, d.sectionId !== null && ((S = z.current.get(d.sectionId)) == null || S()), (M = A.current) == null || M.call(A, {
+      itemId: y,
+      toSectionId: d.sectionId,
+      index: d.index
+    })), j(
+      i("navigation.sidebar.move.dropped", {
+        item: b,
+        place: w(d)
+      })
+    );
+  }, [g, j, i, w]), O = B(() => {
+    const n = u.current;
+    n && (g(null), v.current = [], j(
+      i("navigation.sidebar.move.cancelled", {
+        item: n.label,
+        place: w(n.origin)
+      })
+    ));
+  }, [g, j, i, w]), _ = B(
+    (n, y) => {
+      const T = u.current, d = !n.altKey && !n.ctrlKey && !n.metaKey && !n.shiftKey;
+      if (!T) {
+        n.key === " " && d && !n.repeat && (n.preventDefault(), F(y, "keyboard", n.currentTarget));
+        return;
+      }
+      if (T.itemId !== y || T.via !== "keyboard") return;
+      const b = v.current, S = b.findIndex((X) => de(X, T.target)), M = (X) => {
+        const ae = b[Math.max(0, Math.min(b.length - 1, X))];
+        ae && E(ae, !0);
+      };
+      switch (n.key) {
+        case "ArrowDown":
+          n.preventDefault(), M(S + 1);
+          break;
+        case "ArrowUp":
+          n.preventDefault(), M(S - 1);
+          break;
+        case "Home":
+          n.preventDefault(), M(0);
+          break;
+        case "End":
+          n.preventDefault(), M(b.length - 1);
+          break;
+        case " ":
+        case "Enter":
+          n.preventDefault(), n.repeat || H();
+          break;
+        case "Escape":
+          n.preventDefault(), n.stopPropagation(), O();
+          break;
+        case "Tab":
+          O();
+          break;
+      }
+    },
+    [F, E, H, O]
+  ), P = B(
+    (n) => {
+      const y = u.current;
+      (y == null ? void 0 : y.via) === "keyboard" && y.itemId === n && O();
+    },
+    [O]
+  ), f = B(() => {
+    var y;
+    const n = m.current;
+    n != null && n.timer && clearTimeout(n.timer), n != null && n.frame && cancelAnimationFrame(n.frame), m.current = null, (y = l.current) == null || y.call(l), l.current = null;
+  }, []), Y = B(
+    (n, y) => {
+      if (u.current || m.current || !n.isPrimary || n.button !== 0) return;
+      const T = n.pointerType === "touch", d = {
+        pointerId: n.pointerId,
+        itemId: y,
+        node: n.currentTarget,
+        touch: T,
+        startX: n.clientX,
+        startY: n.clientY,
+        dragging: !1,
+        timer: null,
+        lastY: n.clientY,
+        frame: 0
+      };
+      m.current = d;
+      const b = () => {
+        var k, Z;
+        if (!F(d.itemId, "pointer", d.node)) {
+          f();
+          return;
+        }
+        d.dragging = !0, (Z = (k = window.getSelection) == null ? void 0 : k.call(window)) == null || Z.removeAllRanges();
+      }, S = (k) => {
+        const Z = t.current;
+        if (!Z) return;
+        let J = null, ve = Number.POSITIVE_INFINITY;
+        for (const ie of v.current) {
+          const oe = Math.abs(ys(Z, ie) - k);
+          oe < ve && (J = ie, ve = oe);
+        }
+        J && E(J, !1);
+      }, M = () => {
+        var De, Pe;
+        if (d.frame = 0, !d.dragging) return;
+        const k = (Pe = (De = t.current) == null ? void 0 : De.querySelector("[data-sidebar-body]")) == null ? void 0 : Pe.closest("[data-radix-scroll-area-viewport]");
+        if (!k) return;
+        const Z = k.getBoundingClientRect(), J = Z.top + Ie - d.lastY, ve = d.lastY - (Z.bottom - Ie), ie = Math.max(J, ve);
+        if (ie <= 0) return;
+        const oe = Math.ceil(Is * Math.min(1, ie / Ie)), be = k.scrollTop;
+        k.scrollTop += J > 0 ? -oe : oe, k.scrollTop !== be && (S(d.lastY), d.frame = requestAnimationFrame(M));
+      }, X = (k) => {
+        if (k.pointerId === d.pointerId) {
+          if (!d.dragging) {
+            if (Math.hypot(
+              k.clientX - d.startX,
+              k.clientY - d.startY
+            ) < Ss) return;
+            if (d.touch) {
+              f();
+              return;
+            }
+            if (b(), !d.dragging) return;
+          }
+          d.lastY = k.clientY, S(k.clientY), d.frame || (d.frame = requestAnimationFrame(M));
+        }
+      }, ae = (k) => {
+        var oe;
+        if (k.pointerId !== d.pointerId) return;
+        const Z = d.dragging;
+        if (f(), !Z) return;
+        const J = (oe = t.current) == null ? void 0 : oe.getBoundingClientRect();
+        if (!J || k.clientX < J.left || k.clientX > J.right || k.clientY < J.top || k.clientY > J.bottom) {
+          O();
+          return;
+        }
+        H();
+        const ie = (be) => {
+          be.preventDefault(), be.stopPropagation();
+        };
+        window.addEventListener("click", ie, {
+          capture: !0,
+          once: !0
+        }), setTimeout(() => window.removeEventListener("click", ie, !0), 0);
+      }, Te = (k) => {
+        if (k.pointerId !== d.pointerId) return;
+        const Z = d.dragging;
+        f(), Z && O();
+      }, ke = (k) => k.preventDefault(), Ee = (k) => {
+        k.key !== "Escape" || !d.dragging || (k.preventDefault(), f(), O());
+      };
+      window.addEventListener("pointermove", X), window.addEventListener("pointerup", ae), window.addEventListener("pointercancel", Te), window.addEventListener("keydown", Ee, !0), T && (window.addEventListener("contextmenu", ke, !0), d.timer = setTimeout(() => {
+        d.timer = null, b();
+      }, ws)), l.current = () => {
+        window.removeEventListener("pointermove", X), window.removeEventListener("pointerup", ae), window.removeEventListener("pointercancel", Te), window.removeEventListener("keydown", Ee, !0), window.removeEventListener("contextmenu", ke, !0);
+      };
+    },
+    [F, E, H, O, f, t]
+  );
+  ee(() => f, [f]);
+  const W = V(null), q = B((n) => {
+    var y;
+    (y = m.current) != null && y.dragging && n.preventDefault();
+  }, []), K = B(
+    (n) => {
+      var y;
+      W.current !== n && ((y = W.current) == null || y.removeEventListener("touchmove", q), W.current = n, n == null || n.addEventListener("touchmove", q, { passive: !1 }));
+    },
+    [q]
+  ), re = V(r);
+  re.current = r;
+  const ne = B(
+    (n) => K(n && re.current ? n : null),
+    [K]
+  );
+  ee(() => {
+    K(r ? t.current : null);
+  }, [r, K, t]), ee(() => () => K(null), [K]), ee(() => {
+    !r && u.current && O();
+  }, [r, O]);
+  const L = B((n, y) => (z.current.set(n, y), () => {
+    z.current.get(n) === y && z.current.delete(n);
+  }), []), U = B(() => {
+    const n = N.current, y = t.current;
+    if (!n || !y) return;
+    if (Date.now() > n.until) {
+      N.current = null;
+      return;
+    }
+    const T = y.querySelector(
+      `[data-sidebar-item-id="${CSS.escape(n.itemId)}"]`
+    );
+    if (!T) return;
+    const d = document.activeElement, b = d !== null && d !== document.body && d !== T;
+    if (!de(xs(y, T), n)) {
+      b && (N.current = null);
+      return;
+    }
+    N.current = null, !(d === T || b) && (a.current = !0, T.focus(), a.current = !1);
+  }, [t, a]);
+  return {
+    context: xe(
+      () => r ? {
+        enabled: r,
+        instructionsId: c,
+        move: o,
+        onItemKeyDown: _,
+        onItemPointerDown: Y,
+        onItemBlur: P,
+        registerSection: L
+      } : { enabled: !1, move: null, registerSection: L },
+      [
+        r,
+        c,
+        o,
+        _,
+        Y,
+        P,
+        L
+      ]
+    ),
+    message: h,
+    instructionsId: c,
+    restoreFocus: U,
+    touchGuardRef: ne,
+    /** True while any move runs: Escape cancels it, not the drawer. */
+    cancelIfMoving: () => u.current ? (O(), !0) : !1
+  };
+}
+const Ce = le({
+  mode: "expanded",
+  density: "default"
+}), G = () => ce(Ce), Ve = "ui.sidebar.state";
+function Cs(e) {
+  if (typeof window > "u") return e;
+  try {
+    const r = window.localStorage.getItem(Ve);
+    if (r === "expanded" || r === "icon" || r === "overlay") return r;
+  } catch {
+  }
+  return e;
+}
+function js(e) {
+  if (!(typeof window > "u"))
+    try {
+      window.localStorage.setItem(Ve, e);
+    } catch {
+    }
+}
+const Oe = te(
+  [
+    "ds:flex ds:flex-col",
+    // `--sidebar-surface`: the page background in light mode (white-on-white
+    // chrome separated by --shadow-md). In dark mode the Header already
+    // blends with --background, so the token steps the sidebar one layer
+    // down (blue-600) to keep it visually distinct from the header band —
+    // matches the PDF dark mockups' "flat Dark Blue surface with subtle
+    // depth via layering" recipe. A token, so a light sidebar nested in a
+    // dark page stays light.
+    "ds:bg-[var(--sidebar-surface,var(--background))] ds:text-[var(--foreground)]",
+    // The inline-end hairline is drawn in the accessible themes only
+    // (--accessible-edge-width is 0 elsewhere).
+    "ds:[:where(&)]:border-e-[length:var(--accessible-edge-width,0px)] ds:border-[var(--border)]",
+    // Elevation is set per mode below. Forced colours strip shadows, so
+    // there only the accessible themes' `border-e` separates the rail.
+    "ds:transition-[inline-size] ds:duration-[var(--animation-duration)]",
+    "ds:motion-reduce:transition-none",
+    // While the resize handle is dragging, the width must track the
+    // pointer 1:1 — the data attribute suppresses the width transition.
+    "ds:data-[resizing]:transition-none"
+  ].join(" "),
+  {
+    variants: {
+      // Tokenised widths (Linear / Jira proportions) and one elevation per
+      // mode: chrome `--shadow-md` docked, `--shadow-xl` for the drawer, none
+      // in the accessible themes. `[:where(&)]` lets a className shadow win.
+      mode: {
+        // Docked, `relative z-[1]` lifts the rail over a sibling that paints
+        // a background (AppFrame's <main>), which would cover its shadow. The
+        // drawer must never get them: they beat its `fixed` and `h-dvh`.
+        expanded: "ds:relative ds:z-[1] ds:h-full ds:w-[var(--sidebar-modern-expanded-size)] ds:[:where(&)]:[box-shadow:var(--accessible-off,var(--shadow-md))]",
+        icon: "ds:relative ds:z-[1] ds:h-full ds:w-[var(--sidebar-modern-icon-size)] ds:[:where(&)]:[box-shadow:var(--accessible-off,var(--shadow-md))]",
+        overlay: "ds:w-[var(--sidebar-modern-expanded-size)] ds:[:where(&)]:[box-shadow:var(--accessible-off,var(--shadow-xl))]"
+      },
+      density: {
+        default: "",
+        compact: ""
+      }
+    },
+    defaultVariants: { mode: "expanded", density: "default" }
+  }
+), Ts = 192, ks = 384, Es = 248, Ds = [
+  "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",
+  "ds:hover:bg-[var(--accent)] ds:focus-visible:bg-[var(--accent)]",
+  "ds:data-[resizing]:bg-[var(--accent)]",
+  "ds:transition-colors ds:duration-[var(--animation-duration)] 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:before:absolute ds:before:content-['']",
+  "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(" "), Ps = $(
+  ({
+    state: e,
+    defaultState: r = "expanded",
+    onStateChange: t,
+    density: a = "default",
+    open: i,
+    onOpenChange: c,
+    resizable: o = !1,
+    onMoveItem: p,
+    "aria-label": u,
+    className: v,
+    children: I,
+    id: z,
+    ...N
+  }, A) => {
+    const { t: m } = ue("ui"), l = e !== void 0, [g, h] = se(
+      () => Cs(r)
+    ), D = l ? e : g;
+    ee(() => {
+      l || js(g);
+    }, [g, l]);
+    const R = B(
+      (L) => {
+        l || h(L), t == null || t(L);
+      },
+      [l, t]
+    ), j = u ?? m("navigation.sidebar.label"), w = fe(), F = z ?? w, E = V(D);
+    ee(() => {
+      E.current = D;
+    }, [D]);
+    const H = xe(
+      () => ({
+        getIsCollapsed: () => E.current !== "expanded",
+        toggleCollapsed: () => {
+          const L = E.current === "expanded" ? "icon" : "expanded";
+          R(L);
+        }
+      }),
+      [R]
+    );
+    ss(bs, H, z);
+    const O = V(null), _ = V(null), P = V(!1), { separatorProps: f, isResizing: Y } = ts({
+      edge: "inline-end",
+      targetRef: O,
+      cssProperty: "--sidebar-modern-expanded-size",
+      minSize: Ts,
+      maxSize: ks,
+      defaultSize: Es,
+      disabled: !o || D !== "expanded"
+    }), W = o && D === "expanded", q = zs({
+      onMoveItem: p,
+      enabled: p !== void 0 && D !== "icon",
+      rootRef: O,
+      quietFocusRef: P
+    }), { touchGuardRef: K } = q, re = xe(
+      () => rs(A, O, K),
+      [A, K]
+    );
+    os(() => q.restoreFocus());
+    const ne = p !== void 0 ? /* @__PURE__ */ x(ye, { children: [
+      /* @__PURE__ */ s("span", { id: q.instructionsId, hidden: !0, children: m("navigation.sidebar.move.instructions") }),
+      /* @__PURE__ */ s(
+        "span",
+        {
+          role: "status",
+          "aria-live": "polite",
+          "data-sidebar-move-status": "",
+          className: "ds:sr-only",
+          children: q.message
+        }
+      )
+    ] }) : null;
+    return D === "overlay" ? /* @__PURE__ */ s(
+      Ce.Provider,
+      {
+        value: {
+          mode: "overlay",
+          density: a,
+          transitionTo: R,
+          navElementId: F,
+          quietFocusRef: P
+        },
+        children: /* @__PURE__ */ s(C.Provider, { delayDuration: 300, children: /* @__PURE__ */ s(ge.Root, { open: i, onOpenChange: c, children: /* @__PURE__ */ x(ge.Portal, { children: [
+          /* @__PURE__ */ s(
+            ge.Overlay,
+            {
+              className: [
+                "ds:fixed ds:inset-0 ds:z-[var(--z-modal-backdrop)]",
+                "ds:bg-[var(--foreground)]/20 ds:backdrop-blur-sm",
+                "ds:data-[state=open]:animate-in ds:data-[state=open]:fade-in",
+                "ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out",
+                "ds:motion-reduce:animate-none"
+              ].join(" ")
+            }
+          ),
+          /* @__PURE__ */ x(
+            ge.Content,
+            {
+              onOpenAutoFocus: (L) => {
+                var Q;
+                _.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+                const U = (Q = O.current) == null ? void 0 : Q.querySelector(
+                  '[aria-current="page"]'
+                );
+                P.current = !0, U == null || U.focus(), P.current = !1, U && document.activeElement === U && L.preventDefault();
+              },
+              onCloseAutoFocus: (L) => {
+                var Q;
+                const U = document.activeElement;
+                U && U !== document.body || (Q = _.current) != null && Q.isConnected && (L.preventDefault(), _.current.focus());
+              },
+              onEscapeKeyDown: (L) => {
+                q.cancelIfMoving() && L.preventDefault();
+              },
+              "aria-label": j,
+              className: [
+                "ds:fixed ds:z-[var(--z-modal)]",
+                // `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",
+                Oe({ mode: "overlay", density: a }),
+                "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",
+                v ?? ""
+              ].filter(Boolean).join(" "),
+              children: [
+                /* @__PURE__ */ x(
+                  "nav",
+                  {
+                    ref: re,
+                    id: F,
+                    "aria-label": j,
+                    "data-component": "sidebar",
+                    "data-component-id": z,
+                    className: "ds:flex ds:flex-col ds:h-full",
+                    ...N,
+                    children: [
+                      /* @__PURE__ */ s(ze.Provider, { value: q.context, children: I }),
+                      ne
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ s(ge.Close, { asChild: !0, children: /* @__PURE__ */ s(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": m("navigation.sidebar.close"),
+                    className: [
+                      "ds:absolute ds:top-[var(--spacing-sm)] ds:end-[var(--spacing-sm)]",
+                      "ds:inline-flex ds:items-center ds:justify-center",
+                      "ds:min-w-[var(--min-target-size)] ds:min-h-[var(--min-target-size)]",
+                      "ds:rounded-[var(--radius-sm)] ds:text-[var(--muted-foreground)]",
+                      "ds:hover:bg-[var(--muted)]/20 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)]"
+                    ].join(" "),
+                    children: /* @__PURE__ */ s(cs, { "aria-hidden": "true", className: "ds:size-4" })
+                  }
+                ) })
+              ]
+            }
+          )
+        ] }) }) })
+      }
+    ) : /* @__PURE__ */ s(
+      Ce.Provider,
+      {
+        value: {
+          mode: D,
+          density: a,
+          transitionTo: R,
+          navElementId: F,
+          quietFocusRef: P
+        },
+        children: /* @__PURE__ */ s(C.Provider, { delayDuration: 300, children: /* @__PURE__ */ x(
+          "nav",
+          {
+            ref: re,
+            id: F,
+            "aria-label": j,
+            "data-component": "sidebar",
+            "data-component-id": z,
+            "data-mode": D,
+            "data-density": a,
+            "data-resizing": Y ? "" : void 0,
+            className: [
+              Oe({ mode: D, density: a }),
+              a === "compact" ? "ds:density-compact" : "",
+              v ?? ""
+            ].filter(Boolean).join(" "),
+            ...N,
+            children: [
+              /* @__PURE__ */ s(ze.Provider, { value: q.context, children: I }),
+              ne,
+              W ? /* @__PURE__ */ s(
+                "div",
+                {
+                  ...f,
+                  "aria-label": m("navigation.sidebar.resize"),
+                  "data-resizing": Y ? "" : void 0,
+                  className: Ds
+                }
+              ) : null
+            ]
+          }
+        ) })
+      }
+    );
+  }
+);
+Ps.displayName = "Sidebar";
+const Os = $(({ className: e, ...r }, t) => {
+  const { mode: a } = G();
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      ref: t,
+      className: [
+        "ds:relative ds:flex ds:items-center ds:gap-[var(--spacing-xs)]",
+        "ds:min-h-[var(--min-target-size)]",
+        // Expanded uses the SAME inline padding as `SidebarBody`, so the
+        // header's first control starts on the nav items' left edge and its
+        // icon can land on the nav icon column (the trigger adds the item's
+        // own `ps` on top — see `SidebarCollapseTrigger`). In the rail,
+        // `justify-center` centres the control exactly as the nav icons
+        // centre. Header content therefore tracks the nav column in both
+        // modes instead of sitting on its own axis.
+        a === "icon" ? "ds:justify-center ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]" : "ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]",
+        "ds:py-[var(--spacing-sm)]",
+        // Hairline border + downward chrome shadow cast the header as a
+        // sticky top band above the scrolling body.
+        "ds:border-block-end ds:border-[var(--border)]",
+        "ds:shadow-[var(--shadow-chrome-down)]",
+        e ?? ""
+      ].filter(Boolean).join(" "),
+      ...r
+    }
+  );
+});
+Os.displayName = "SidebarHeader";
+const Ye = te(
+  [
+    "ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)]",
+    "ds:border ds:border-dashed ds:border-[color:var(--border)]"
+  ].join(" "),
+  {
+    variants: {
+      active: {
+        true: "ds:border-[color:var(--primary)] ds:bg-[var(--muted)]/20 ds:forced-colors:border-[Highlight]",
+        false: ""
+      }
+    },
+    defaultVariants: { active: !1 }
+  }
+), As = $(
+  ({ className: e, children: r, ...t }, a) => {
+    const { navElementId: i } = G(), { enabled: c, move: o } = Se(), p = c && (o != null && o.listEmpty) ? /* @__PURE__ */ s(
+      "div",
+      {
+        "aria-hidden": "true",
+        "data-sidebar-drop-zone-list": "",
+        className: Ye({
+          active: o.target.indicator.kind === "list" && !de(o.target, o.origin)
+        })
+      }
+    ) : null;
+    return (
+      // 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`
+      // fills the column and bounds the height; the layout `className` lands on the
+      // 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(
+        Qe,
+        {
+          orientation: "vertical",
+          ...i ? { role: "group", "aria-labelledby": i } : {},
+          className: ["ds:flex-1 ds:min-h-0", e ?? ""].filter(Boolean).join(" "),
+          children: /* @__PURE__ */ x(
+            "div",
+            {
+              ref: a,
+              "data-sidebar-body": "",
+              className: "ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:py-[var(--spacing-sm)]",
+              ...t,
+              children: [
+                r,
+                p
+              ]
+            }
+          )
+        }
+      )
+    );
+  }
+);
+As.displayName = "SidebarBody";
+const Rs = $(({ className: e, ...r }, t) => {
+  const { mode: a } = G();
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      ref: t,
+      className: [
+        "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.
+        a === "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
+        // sticky bottom band below the scrolling body.
+        "ds:border-block-start ds:border-[var(--border)]",
+        "ds:shadow-[var(--shadow-chrome-up)]",
+        e ?? ""
+      ].filter(Boolean).join(" "),
+      ...r
+    }
+  );
+});
+Rs.displayName = "SidebarFooter";
+const _s = [
+  "ds:group/section-label ds:flex ds:w-full ds:items-center",
+  // A full target, 44px (48px accessible): the row gains height, the text
+  // keeps its size, and no hit area overlaps the items around it.
+  "ds:min-h-[var(--min-target-size)]",
+  "type-eyebrow",
+  "ds:text-[var(--muted-foreground)]",
+  "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
+  "ds:py-[var(--spacing-xs)]",
+  "ds:hover:text-[var(--foreground)] ds:data-[holds-current]:text-[var(--foreground)]",
+  "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(" "), Ae = [
+  "ds:inline-flex ds:shrink-0 ds:items-center ds:justify-center",
+  "ds:size-4",
+  "ds:text-[var(--accent)]",
+  "ds:me-[var(--spacing-xs)]"
+].join(" "), Re = te(
+  "ds:flex ds:items-center ds:rounded-[var(--radius-sm)]",
+  {
+    variants: {
+      dropInto: {
+        true: "ds:outline-[length:var(--focus-ring-width)] ds:outline-dashed ds:outline-[color:var(--primary)] ds:forced-colors:outline-[CanvasText]",
+        false: ""
+      }
+    },
+    defaultVariants: { dropInto: !1 }
+  }
+), Ls = [
+  "ds:flex ds:shrink-0 ds:items-center",
+  "ds:[&>*]:min-w-[var(--min-target-size)] ds:[&>*]:min-h-[var(--min-target-size)]"
+].join(" "), Ms = [
+  "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] type-meta ds:text-[color:var(--muted-foreground)]",
+  "ds:[[data-sidebar-section-items]:not(:empty)~&]:hidden"
+].join(" "), Bs = [
+  "ds:[&:has(+[data-sidebar-item])]:[border-block-end:var(--border-width-hairline)_solid_var(--border)]",
+  "ds:[&:has(+[data-sidebar-item])]:pb-[var(--spacing-xs)]",
+  "ds:[&:has(+[data-sidebar-item])]:mb-[var(--spacing-xs)]"
+].join(" "), $e = le(null), Fs = [
+  "ds:size-2 ds:shrink-0 ds:me-[var(--spacing-xs)] ds:rounded-[var(--radius-full)]",
+  "ds:bg-[var(--primary)] ds:border-[length:var(--border-width-sm)] ds:border-[color:var(--primary)]"
+].join(" "), Hs = "ds:min-w-0 ds:line-clamp-2 ds:[overflow-wrap:anywhere]";
+function Us({
+  name: e,
+  nameRef: r,
+  children: t
+}) {
+  const { navElementId: a, quietFocusRef: i } = G(), { move: c } = Se();
+  if (a === void 0) return t;
+  const o = (p) => {
+    const u = r.current;
+    (!(u != null && u.scrollHeight > u.clientHeight) || i != null && i.current || c !== null) && p.preventDefault();
+  };
+  return /* @__PURE__ */ x(C.Root, { children: [
+    /* @__PURE__ */ s(
+      C.Trigger,
+      {
+        asChild: !0,
+        onPointerMove: o,
+        onFocus: o,
+        children: t
+      }
+    ),
+    /* @__PURE__ */ s(C.Portal, { children: /* @__PURE__ */ x(
+      C.Content,
+      {
+        side: "right",
+        sideOffset: 6,
+        className: pe,
+        children: [
+          e,
+          /* @__PURE__ */ s(C.Arrow, { className: "ds:fill-[var(--foreground)]" })
+        ]
+      }
+    ) })
+  ] });
+}
+const qe = le(!1), Ge = $(
+  ({
+    label: e,
+    icon: r,
+    collapsible: t = !0,
+    defaultOpen: a = !0,
+    open: i,
+    onOpenChange: c,
+    sectionId: o,
+    actions: p,
+    className: u,
+    children: v,
+    ...I
+  }, z) => {
+    const { t: N } = ue("ui"), { mode: A } = G(), m = A === "icon", l = fe(), g = fe(), h = V(null), [D, R] = se(
+      () => /* @__PURE__ */ new Set()
+    ), j = B((d, b) => {
+      R((S) => {
+        if (S.has(d) === b) return S;
+        const M = new Set(S);
+        return b ? M.add(d) : M.delete(d), M;
+      });
+    }, []), w = t && !m && !!e, [F, E] = se(a), H = i ?? F, O = V(H);
+    O.current = H;
+    const _ = B(
+      (d) => {
+        i === void 0 && E(d), c == null || c(d);
+      },
+      [i, c]
+    ), { enabled: P, move: f, registerSection: Y } = Se(), W = ce(qe);
+    ee(() => {
+      P && o === void 0 && !W && ds() && console.warn(
+        `SidebarSection "${e ?? ""}": moves are on but it has no sectionId, so its items cannot move.`
+      );
+    }, [P, o, W, e]), ee(() => {
+      if (!(o === void 0 || !Y))
+        return Y(o, () => {
+          O.current || _(!0);
+        });
+    }, [o, Y, _]);
+    const q = P && f !== null && o !== void 0, K = q && f.target.indicator.kind === "section" && f.target.indicator.sectionId === o && !de(f.target, f.origin), re = q && f.emptySectionIds.includes(o) ? /* @__PURE__ */ s(
+      "div",
+      {
+        "aria-hidden": "true",
+        "data-sidebar-drop-zone": o,
+        className: Ye({ active: K })
+      }
+    ) : null, ne = o !== void 0 ? {
+      "data-sidebar-section-id": o,
+      "data-sidebar-section-label": e ?? "",
+      "data-sidebar-section-open": String(!w || H)
+    } : {}, L = p && !m ? /* @__PURE__ */ s(
+      "span",
+      {
+        role: "group",
+        "aria-label": e ? N("navigation.sidebar.sectionActions", { section: e }) : void 0,
+        className: Ls,
+        children: p
+      }
+    ) : null, U = w && !H && D.size > 0, Q = e && !m ? /* @__PURE__ */ s("p", { "data-sidebar-section-empty": "", className: Ms, children: N(P && o !== void 0 ? "navigation.sidebar.section.emptyMove" : "navigation.sidebar.section.empty") }) : null, n = /* @__PURE__ */ s(Be.Provider, { value: { sectionId: o }, children: /* @__PURE__ */ x($e.Provider, { value: j, children: [
+      /* @__PURE__ */ s("div", { "data-sidebar-section-items": "", className: "ds:contents", children: v }),
+      Q,
+      re
+    ] }) }), y = [
+      "ds:flex ds:flex-col",
+      "ds:gap-[var(--spacing-xs)]",
+      "ds:mt-[var(--spacing-sm)]",
+      Bs,
+      u ?? ""
+    ].filter(Boolean).join(" ");
+    if (!w) {
+      const d = !!e || !!r, b = e ? { role: "group", "aria-labelledby": l } : {}, S = d ? /* @__PURE__ */ x(
+        "span",
+        {
+          className: [
+            "ds:flex ds:items-center",
+            "type-eyebrow",
+            "ds:text-[var(--muted-foreground)]",
+            "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
+            "ds:py-[var(--spacing-xs)]",
+            L ? "ds:min-w-0 ds:flex-1" : "",
+            m && !r ? "ds:sr-only" : ""
+          ].filter(Boolean).join(" "),
+          children: [
+            r ? /* @__PURE__ */ s("span", { "aria-hidden": "true", className: Ae, children: r }) : null,
+            e ? /* @__PURE__ */ s("span", { id: l, className: m ? "ds:sr-only" : "", children: e }) : null
+          ]
+        }
+      ) : null;
+      return /* @__PURE__ */ x(
+        "div",
+        {
+          ref: z,
+          className: y,
+          ...b,
+          ...ne,
+          ...I,
+          children: [
+            L ? /* @__PURE__ */ x(
+              "div",
+              {
+                "data-sidebar-section-heading": "",
+                className: Re(),
+                children: [
+                  S,
+                  L
+                ]
+              }
+            ) : S,
+            n
+          ]
+        }
+      );
+    }
+    const T = "section";
+    return /* @__PURE__ */ s(
+      he.Root,
+      {
+        type: "single",
+        collapsible: !0,
+        value: H ? T : "",
+        onValueChange: (d) => _(d === T),
+        asChild: !0,
+        children: /* @__PURE__ */ s("div", { ref: z, className: y, ...ne, ...I, children: /* @__PURE__ */ x(he.Item, { value: T, children: [
+          /* @__PURE__ */ x(
+            "div",
+            {
+              "data-sidebar-section-heading": "",
+              className: Re({
+                dropInto: K && !H
+              }),
+              children: [
+                /* @__PURE__ */ s(Us, { name: e ?? "", nameRef: h, children: /* @__PURE__ */ s("div", { className: "ds:flex ds:min-w-0 ds:flex-1", children: /* @__PURE__ */ s(he.Header, { className: "ds:flex ds:min-w-0 ds:flex-1", children: /* @__PURE__ */ x(
+                  he.Trigger,
+                  {
+                    className: _s,
+                    "data-holds-current": U ? "" : void 0,
+                    "aria-describedby": U ? g : void 0,
+                    children: [
+                      r ? /* @__PURE__ */ s("span", { "aria-hidden": "true", className: Ae, children: r }) : null,
+                      /* @__PURE__ */ s(
+                        "span",
+                        {
+                          ref: h,
+                          className: `ds:flex-1 ds:text-start ${Hs}`,
+                          children: e
+                        }
+                      ),
+                      U ? /* @__PURE__ */ s(
+                        "span",
+                        {
+                          "aria-hidden": "true",
+                          "data-sidebar-section-current": "",
+                          className: Fs
+                        }
+                      ) : null,
+                      /* @__PURE__ */ s(
+                        we,
+                        {
+                          "aria-hidden": "true",
+                          className: "ds:size-3 ds:shrink-0 ds:transition-transform ds:group-data-[state=open]/section-label:rotate-90 ds:rtl:-scale-x-100 ds:motion-reduce:transition-none"
+                        }
+                      )
+                    ]
+                  }
+                ) }) }) }),
+                L,
+                U ? (
+                  // Hidden, yet still the fold button's description.
+                  /* @__PURE__ */ s("span", { id: g, hidden: !0, children: N("navigation.sidebar.section.containsCurrent") })
+                ) : null
+              ]
+            }
+          ),
+          /* @__PURE__ */ s(
+            Je,
+            {
+              role: "group",
+              "aria-label": e,
+              forceMount: !0,
+              className: [
+                "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:[&>div]:contents",
+                // Force-mounted content is never hidden by Radix: do it here.
+                "ds:data-[state=closed]:hidden"
+              ].join(" "),
+              children: n
+            }
+          )
+        ] }) })
+      }
+    );
+  }
+);
+Ge.displayName = "SidebarSection";
+const Vs = [
+  "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)]",
+  "ds:rounded-[var(--radius-sm)]",
+  "ds:text-[var(--foreground)] ds:text-[var(--font-size-sm)]",
+  "ds:font-[var(--font-weight-medium)]",
+  "ds:hover:bg-[var(--muted)]/20",
+  "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(" "), Ys = $(
+  ({
+    label: e,
+    icon: r,
+    children: t,
+    className: a,
+    defaultOpen: i,
+    open: c,
+    onOpenChange: o,
+    ...p
+  }, u) => {
+    const { mode: v } = G();
+    return /* @__PURE__ */ x(
+      Ne.Root,
+      {
+        ref: u,
+        defaultOpen: i,
+        open: c,
+        onOpenChange: o,
+        className: a,
+        ...p,
+        children: [
+          /* @__PURE__ */ x(Ne.Trigger, { className: Vs, children: [
+            r ? /* @__PURE__ */ s(
+              "span",
+              {
+                "aria-hidden": "true",
+                className: "ds:inline-flex ds:items-center ds:text-[var(--accent)]",
+                children: r
+              }
+            ) : null,
+            /* @__PURE__ */ s(
+              "span",
+              {
+                className: [
+                  "ds:flex-1 ds:text-start",
+                  v === "icon" ? "ds:sr-only" : ""
+                ].join(" "),
+                children: e
+              }
+            ),
+            v !== "icon" ? /* @__PURE__ */ s(
+              we,
+              {
+                "aria-hidden": "true",
+                className: "ds:size-4 ds:transition-transform ds:group-data-[state=open]:rotate-90 ds:rtl:-scale-x-100 ds:motion-reduce:transition-none"
+              }
+            ) : null
+          ] }),
+          /* @__PURE__ */ s(
+            Ne.Content,
+            {
+              className: [
+                "ds:overflow-hidden",
+                "ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out",
+                "ds:motion-reduce:animate-none",
+                "ds:ps-[var(--spacing-md)]"
+              ].join(" "),
+              children: t
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Ys.displayName = "SidebarGroup";
+const pe = [
+  "ds:z-[var(--z-tooltip)] ds:max-w-[16rem]",
+  "ds:rounded-[var(--radius-sm)]",
+  "ds:bg-[var(--foreground)] ds:text-[var(--background)]",
+  "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] ds:text-[length:var(--font-size-xs)]",
+  "ds:animate-in ds:fade-in ds:zoom-in-95 ds:motion-reduce:animate-none"
+].join(" "), $s = te(
+  [
+    // 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.
+    // `!text-[var(--foreground)]` forces the label colour over the browser's
+    // default `<a>` link colour (blue-violet) and any inherited hue. The
+    // active variant also uses `!text-*` so it still wins when needed.
+    "ds:group/item ds:relative ds:flex ds:items-center",
+    "ds:gap-[var(--spacing-sm)]",
+    "ds:no-underline ds:!text-[var(--foreground)] ds:text-[length:var(--font-size-sm)]",
+    "ds:hover:bg-[var(--muted)]/12",
+    "ds:transition-colors ds:duration-[var(--animation-duration)]",
+    "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]"
+  ].join(" "),
+  {
+    variants: {
+      mode: {
+        expanded: [
+          "ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)]",
+          "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]"
+        ].join(" "),
+        // Icon-only: each item is a 44×44 pill tile centered in the rail.
+        // The active / hover background fills just the tile rather than the
+        // whole row — matching Linear / Asana chrome.
+        icon: [
+          "ds:justify-center ds:ms-auto ds:me-auto",
+          "ds:w-[var(--min-target-size)] ds:h-[var(--min-target-size)]",
+          "ds:ps-0 ds:pe-0 ds:rounded-[var(--radius-md)]"
+        ].join(" "),
+        overlay: [
+          "ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)]",
+          "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]"
+        ].join(" ")
+      },
+      density: {
+        default: "",
+        compact: "ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]"
+      },
+      isActive: {
+        // Filled pill — multi-carrier (bg + text + weight + aria-current at
+        // render time) so colour is never the sole identifier. `!text-*`
+        // forces the foreground over any inherited / base rule so the icon
+        // and label read clearly against the primary fill in every theme.
+        true: [
+          "ds:bg-[var(--primary)] ds:!text-[var(--primary-foreground)]",
+          "ds:font-[var(--font-weight-semibold)]",
+          // Keep hover from dimming the active fill.
+          "ds:hover:bg-[var(--primary)]"
+        ].join(" "),
+        false: ""
+      }
+    },
+    defaultVariants: {
+      mode: "expanded",
+      density: "default",
+      isActive: !1
+    }
+  }
+), _e = [
+  "ds:before:pointer-events-none ds:before:absolute ds:before:start-0 ds:before:end-0",
+  "ds:before:h-[length:var(--focus-ring-width)] ds:before:content-['']",
+  "ds:before:rounded-[var(--radius-full)] ds:before:bg-[var(--primary)]",
+  "ds:forced-colors:before:bg-[CanvasText]"
+].join(" "), qs = te("", {
+  variants: {
+    movable: {
+      true: "ds:select-none ds:[-webkit-touch-callout:none]",
+      false: ""
+    },
+    moving: { true: "ds:opacity-60", false: "" },
+    drop: {
+      before: `${_e} ds:before:top-[calc(var(--spacing-xs)/-2)] ds:before:-translate-y-1/2`,
+      after: `${_e} ds:before:bottom-[calc(var(--spacing-xs)/-2)] ds:before:translate-y-1/2`,
+      none: ""
+    }
+  },
+  defaultVariants: { movable: !1, moving: !1, drop: "none" }
+}), Ke = le(null), Xe = $(
+  ({
+    asChild: e = !1,
+    isActive: r = !1,
+    navId: t,
+    isPinned: a = !1,
+    onPinChange: i,
+    pinLabel: c,
+    className: o,
+    children: p,
+    "aria-label": u,
+    "aria-describedby": v,
+    onKeyDown: I,
+    onPointerDown: z,
+    onBlur: N,
+    ...A
+  }, m) => {
+    const { mode: l, density: g, quietFocusRef: h, navElementId: D } = G(), R = e ? Le : "a", j = i !== void 0 && l !== "icon", w = Se(), F = ce(Be), E = ce($e), H = fe(), O = r || A["aria-current"] === "page";
+    ee(() => {
+      if (E)
+        return E(H, O), () => E(H, !1);
+    }, [E, H, O]);
+    const _ = w.enabled && l !== "icon" && t !== void 0 && (F === null || F.sectionId !== void 0) ? t : void 0, P = w.move, f = P && !de(P.target, P.origin) ? P.target : null, Y = _ !== void 0 && (f == null ? void 0 : f.indicator.kind) === "item" && f.indicator.itemId === _ ? f.indicator.edge : "none", W = _ !== void 0 ? {
+      "data-sidebar-item-id": _,
+      "data-moving": (P == null ? void 0 : P.itemId) === _ ? "" : void 0,
+      // A link would otherwise start the browser's own link drag.
+      draggable: !1,
+      "aria-describedby": [v, w.instructionsId].filter(Boolean).join(" "),
+      // An image inside the item would start its own native drag.
+      onDragStart: (b) => b.preventDefault(),
+      onKeyDown: (b) => {
+        var M, X;
+        I == null || I(b);
+        const S = b.key === "Escape" && ((M = w.move) == null ? void 0 : M.itemId) === _;
+        (!b.defaultPrevented || S) && ((X = w.onItemKeyDown) == null || X.call(w, b, _));
+      },
+      onPointerDown: (b) => {
+        var S;
+        z == null || z(b), (S = w.onItemPointerDown) == null || S.call(w, b, _);
+      },
+      onBlur: (b) => {
+        var S;
+        N == null || N(b), (S = w.onItemBlur) == null || S.call(w, _);
+      }
+    } : {
+      // Keys left out when unset: an undefined one would override the
+      // tooltip's own description through Slot.
+      ...v !== void 0 ? { "aria-describedby": v } : {},
+      ...I ? { onKeyDown: I } : {},
+      ...z ? { onPointerDown: z } : {},
+      ...N ? { onBlur: N } : {}
+    }, q = qs({
+      movable: _ !== void 0,
+      moving: P !== null && P.itemId === _,
+      drop: Y
+    }), [K, re] = se(null), ne = l === "icon" && u != null && K ? `${u}, ${K}` : u, L = /* @__PURE__ */ s(
+      R,
+      {
+        ref: m,
+        "aria-current": r ? "page" : void 0,
+        "aria-label": ne,
+        "data-nav-id": t,
+        "data-sidebar-item": j ? void 0 : "",
+        className: $s({
+          mode: l,
+          density: g,
+          isActive: r,
+          className: [j ? "ds:flex-1 ds:min-w-0" : o, q].filter(Boolean).join(" ")
+        }),
+        ...W,
+        ...A,
+        children: p
+      }
+    ), U = j ? /* @__PURE__ */ x(
+      "div",
+      {
+        "data-sidebar-item": "",
+        className: [
+          "ds:group/item ds:flex ds:items-center ds:gap-[var(--spacing-2xs)]",
+          o ?? ""
+        ].filter(Boolean).join(" "),
+        children: [
+          L,
+          /* @__PURE__ */ s(
+            je,
+            {
+              isPinned: a,
+              label: c ?? u ?? "",
+              onPinChange: i
+            }
+          )
+        ]
+      }
+    ) : L, Q = V(null), [n, y] = se(), T = (b) => {
+      var X, ae;
+      const S = (X = Q.current) == null ? void 0 : X.querySelector(
+        "[data-sidebar-item-label]"
+      );
+      if (!(S != null && S.scrollWidth > S.clientWidth) || h != null && h.current || w.move !== null) {
+        b.preventDefault();
+        return;
+      }
+      y(((ae = S.textContent) == null ? void 0 : ae.trim()) || void 0);
+    }, d = l !== "icon" && D !== void 0 ? /* @__PURE__ */ x(C.Root, { children: [
+      /* @__PURE__ */ s(
+        C.Trigger,
+        {
+          asChild: !0,
+          ref: Q,
+          onPointerMove: T,
+          onFocus: T,
+          children: U
+        }
+      ),
+      /* @__PURE__ */ s(C.Portal, { children: /* @__PURE__ */ x(
+        C.Content,
+        {
+          side: "right",
+          sideOffset: 6,
+          className: pe,
+          children: [
+            u ?? n,
+            /* @__PURE__ */ s(C.Arrow, { className: "ds:fill-[var(--foreground)]" })
+          ]
+        }
+      ) })
+    ] }) : l === "icon" && u ? /* @__PURE__ */ x(C.Root, { children: [
+      /* @__PURE__ */ s(C.Trigger, { asChild: !0, children: U }),
+      /* @__PURE__ */ s(C.Portal, { children: /* @__PURE__ */ x(
+        C.Content,
+        {
+          side: "right",
+          sideOffset: 6,
+          className: pe,
+          children: [
+            u,
+            /* @__PURE__ */ s(C.Arrow, { className: "ds:fill-[var(--foreground)]" })
+          ]
+        }
+      ) })
+    ] }) : U;
+    return /* @__PURE__ */ s(Ke.Provider, { value: re, children: d });
+  }
+);
+Xe.displayName = "SidebarItem";
+const Gs = $(({ className: e, children: r, ...t }, a) => /* @__PURE__ */ s(
+  "span",
+  {
+    ref: a,
+    "aria-hidden": "true",
+    className: [
+      "ds:inline-flex ds:shrink-0 ds:items-center ds:justify-center",
+      "ds:size-5",
+      // Icons carry the accent tint by default so the rail reads less
+      // monotone against the violet active pill. The active row sets
+      // `aria-current="page"` on the anchor (which is `group/item`), so
+      // the icon flips to the primary-foreground (white) on the filled
+      // pill — keeping it readable on the primary background.
+      "ds:text-[var(--accent)]",
+      "ds:group-aria-[current=page]/item:text-[var(--primary-foreground)]",
+      e ?? ""
+    ].filter(Boolean).join(" "),
+    ...t,
+    children: r
+  }
+));
+Gs.displayName = "SidebarItemIcon";
+const Ks = $(({ className: e, children: r, ...t }, a) => {
+  const { mode: i } = G();
+  return /* @__PURE__ */ s(
+    "span",
+    {
+      ref: a,
+      "data-sidebar-item-label": "",
+      className: [
+        "ds:flex-1",
+        "ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap ds:break-normal",
+        "ds:text-start",
+        i === "icon" ? "ds:sr-only" : "",
+        e ?? ""
+      ].filter(Boolean).join(" "),
+      ...t,
+      children: r
+    }
+  );
+});
+Ks.displayName = "SidebarItemLabel";
+const Xs = $(({ className: e, children: r, ...t }, a) => {
+  const { mode: i } = G(), c = i === "icon", o = ce(Ke);
+  return ee(() => {
+    if (!o || !c) return;
+    const p = r == null || r === !1 ? null : String(r).trim() || null;
+    return o(p), () => o(null);
+  }, [o, r, c]), /* @__PURE__ */ s(
+    "span",
+    {
+      ref: a,
+      "aria-hidden": c ? "true" : void 0,
+      className: [
+        "ds:inline-flex ds:items-center ds:justify-center",
+        "ds:font-[var(--font-weight-semibold)]",
+        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)]",
+          "ds:bg-[var(--primary)] ds:text-transparent",
+          "ds:ring-2 ds:ring-[var(--background)]",
+          "ds:pointer-events-none"
+        ].join(" ") : [
+          "ds:min-w-[var(--spacing-lg)] ds:h-[var(--spacing-lg)]",
+          "ds:rounded-[var(--radius-full)]",
+          "ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)]",
+          "ds:text-[length:var(--font-size-xs)]",
+          "ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]"
+        ].join(" "),
+        e ?? ""
+      ].filter(Boolean).join(" "),
+      ...t,
+      children: r
+    }
+  );
+});
+Xs.displayName = "SidebarItemBadge";
+const Ws = te(
+  [
+    "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(" "),
+  {
+    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 3:1
+        // `--control-border` edge and the `--input`/`--shadow-input`/
+        // `--radius-sm` chrome mirror 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: [
+          ns.sm,
+          as.sm,
+          is.sm,
+          "ds:gap-3",
+          "ds:rounded-[var(--radius-sm)]",
+          "ds:border ds:border-[color:var(--control-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" }
+  }
+), Zs = $(
+  ({ logo: e, name: r, showChevron: t = !0, variant: a = "ghost", className: i, ...c }, o) => {
+    const { mode: p } = G(), u = p !== "icon";
+    return /* @__PURE__ */ x(
+      "button",
+      {
+        ref: o,
+        type: "button",
+        "aria-label": r,
+        className: [Ws({ variant: a }), i].filter(Boolean).join(" "),
+        ...c,
+        children: [
+          /* @__PURE__ */ s(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: "ds:inline-flex ds:items-center ds:shrink-0",
+              children: e
+            }
+          ),
+          u ? /* @__PURE__ */ x(ye, { children: [
+            /* @__PURE__ */ s("span", { className: "ds:truncate ds:flex-1 ds:text-start ds:max-w-[var(--header-workspace-max-inline-size)]", children: r }),
+            t ? /* @__PURE__ */ s(
+              we,
+              {
+                "aria-hidden": "true",
+                className: "ds:size-4 ds:shrink-0 ds:rotate-90"
+              }
+            ) : null
+          ] }) : null
+        ]
+      }
+    );
+  }
+);
+Zs.displayName = "SidebarWorkspaceSwitcher";
+const Js = te(
+  [
+    "ds:flex ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)]",
+    "ds:min-h-[var(--min-target-size)]",
+    "ds:rounded-[var(--radius-md)]",
+    "ds:bg-[var(--primary)] ds:!text-[var(--primary-foreground)] ds:no-underline",
+    "ds:font-[var(--font-weight-semibold)] ds:text-[length:var(--font-size-sm)]",
+    "ds:hover:bg-[var(--primary-hover)]",
+    "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]",
+    // Disabled: the fill and contents fade, not the element, so its focus
+    // ring keeps full contrast. No hover; still focusable.
+    "ds:aria-disabled:bg-[var(--primary)]/50 ds:aria-disabled:hover:bg-[var(--primary)]/50 ds:aria-disabled:cursor-not-allowed ds:aria-disabled:[&>*]:opacity-50",
+    "ds:forced-colors:aria-disabled:!text-[GrayText]",
+    // The current page: an inner ring (a border in forced colours, which drop
+    // shadows) and an underlined label when shown.
+    "ds:aria-[current=page]:shadow-[inset_0_0_0_var(--border-width-md)_var(--primary-foreground)]",
+    "ds:forced-colors:aria-[current=page]:border-[length:var(--border-width-md)] ds:forced-colors:aria-[current=page]:border-solid ds:forced-colors:aria-[current=page]:border-[color:CanvasText]",
+    "ds:aria-[current=page]:[&_[data-sidebar-primary-label]]:underline ds:aria-[current=page]:[&_[data-sidebar-primary-label]]:underline-offset-[var(--spacing-xs)]"
+  ].join(" "),
+  {
+    variants: {
+      mode: {
+        expanded: "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+        // A full target-size tile, like the rail's items: 44px, 48px in the
+        // accessible themes.
+        icon: "ds:ps-0 ds:pe-0 ds:w-[var(--min-target-size)] ds:h-[var(--min-target-size)] ds:ms-auto ds:me-auto",
+        overlay: "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]"
+      }
+    },
+    defaultVariants: { mode: "expanded" }
+  }
+), Qs = $(
+  ({
+    icon: e,
+    label: r,
+    shortcut: t,
+    asChild: a = !1,
+    isActive: i = !1,
+    disabled: c = !1,
+    className: o,
+    children: p,
+    onClickCapture: u,
+    onAuxClickCapture: v,
+    ...I
+  }, z) => {
+    const { mode: N } = G(), A = N !== "icon", m = (E) => {
+      c && (E.preventDefault(), E.stopPropagation());
+    }, l = a && c, g = l ? "a" : a ? Le : "button", h = l && Ze(p) ? p.props : {}, D = Object.fromEntries(
+      Object.entries(h).filter(([E]) => E.startsWith("data-"))
+    ), R = l ? { role: "link", tabIndex: 0 } : a ? {} : { type: "button" }, j = /* @__PURE__ */ s(
+      "span",
+      {
+        "aria-hidden": "true",
+        className: "ds:inline-flex ds:size-4 ds:items-center ds:justify-center",
+        children: e
+      }
+    ), w = A ? /* @__PURE__ */ x(ye, { children: [
+      /* @__PURE__ */ s("span", { "data-sidebar-primary-label": "", className: "ds:truncate", children: r }),
+      t && !c ? /* @__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: t }) : null
+    ] }) : null, F = /* @__PURE__ */ x(
+      g,
+      {
+        ref: z,
+        ...R,
+        ...D,
+        "aria-label": r,
+        "aria-keyshortcuts": c ? void 0 : t,
+        "aria-current": i ? "page" : void 0,
+        "aria-disabled": c ? !0 : void 0,
+        className: [
+          Js({ mode: N }),
+          typeof h.className == "string" ? h.className : "",
+          o
+        ].filter(Boolean).join(" "),
+        onClickCapture: (E) => {
+          if (c) return m(E);
+          u == null || u(E);
+        },
+        onAuxClickCapture: (E) => {
+          if (c) return m(E);
+          v == null || v(E);
+        },
+        ...I,
+        children: [
+          j,
+          a && !c ? /* @__PURE__ */ s(es, { children: p }) : null,
+          w
+        ]
+      }
+    );
+    return A ? F : /* @__PURE__ */ x(C.Root, { children: [
+      /* @__PURE__ */ s(C.Trigger, { asChild: !0, children: F }),
+      /* @__PURE__ */ s(C.Portal, { children: /* @__PURE__ */ x(
+        C.Content,
+        {
+          side: "right",
+          sideOffset: 6,
+          className: pe,
+          children: [
+            r,
+            /* @__PURE__ */ s(C.Arrow, { className: "ds:fill-[var(--foreground)]" })
+          ]
+        }
+      ) })
+    ] });
+  }
+);
+Qs.displayName = "SidebarPrimaryAction";
+const et = [
+  "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`,
+  // that handle's ::before hit-area reaches ~--min-target-size/2 inward from
+  // the inline-end edge — exactly where these end-aligned pin stars sit — so
+  // without a higher stacking order the separator swallows the click and
+  // pinning silently fails. Pointer-events stay off until the row is hovered
+  // or the star is focused, so the handle is still fully grabbable at rest
+  // (including touch, where the star never reveals). On a NON-resizable
+  // sidebar there's no handle to clear, but the same gating is inert — the
+  // star reveals and accepts clicks on hover/focus exactly as before.
+  "ds:relative ds:z-[3]",
+  "ds:pointer-events-none ds:group-hover/item:pointer-events-auto ds:focus-visible:pointer-events-auto",
+  // Pin stars carry the accent tint to match every other icon in the rail.
+  // Stays quiet via opacity — reveals only on row hover / focus.
+  "ds:text-[var(--accent)]",
+  "ds:opacity-0 ds:group-hover/item:opacity-100 ds:focus-visible:opacity-100",
+  "ds:hover:bg-[var(--muted)]/20",
+  "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:transition-[color,opacity,background-color] ds:duration-[var(--animation-duration)]",
+  "ds:motion-reduce:transition-none"
+].join(" "), je = $(
+  ({ isPinned: e, onPinChange: r, label: t, className: a, onClick: i, ...c }, o) => {
+    const { t: p } = ue("ui"), { mode: u } = G();
+    if (u === "icon") return null;
+    const v = e ? p("navigation.sidebar.unpinItem", "Unpin {{label}}", { label: t }) : p("navigation.sidebar.pinItem", "Pin {{label}}", { label: t });
+    return /* @__PURE__ */ s(
+      "button",
+      {
+        ref: o,
+        type: "button",
+        "aria-label": v,
+        "aria-pressed": e,
+        className: [et, a].filter(Boolean).join(" "),
+        onClick: (I) => {
+          I.preventDefault(), I.stopPropagation(), r == null || r(!e), i == null || i(I);
+        },
+        ...c,
+        children: /* @__PURE__ */ s(
+          us,
+          {
+            "aria-hidden": "true",
+            className: "ds:size-4",
+            fill: e ? "currentColor" : "none"
+          }
+        )
+      }
+    );
+  }
+);
+je.displayName = "SidebarPinButton";
+const We = le(null), st = () => ce(We), tt = $(
+  ({ heading: e, emptyMessage: r, onReorder: t, className: a, children: i, ...c }, o) => {
+    const { t: p } = ue("ui"), u = e ?? p("navigation.sidebar.favorites", "Favourites"), v = Array.isArray(i) ? i.filter(Boolean) : i ? [i] : [], I = v.length, z = I > 0, [N, A] = se(null), [m, l] = se(""), g = V(!1), h = B((R) => {
+      g.current = !g.current, l(g.current ? R : `${R}​`);
+    }, []), D = xe(
+      () => ({ onReorder: t, count: I, dragSource: N, setDragSource: A, announce: h }),
+      [t, I, N, h]
+    );
+    return !z && !r ? null : /* @__PURE__ */ s(We.Provider, { value: D, children: /* @__PURE__ */ s(qe.Provider, { value: !0, children: /* @__PURE__ */ x(
+      Ge,
+      {
+        ref: o,
+        label: u,
+        className: a,
+        ...c,
+        children: [
+          z ? v : /* @__PURE__ */ s("p", { className: "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] type-meta ds:text-[color:var(--muted-foreground)]", children: r }),
+          /* @__PURE__ */ s("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: m })
+        ]
+      }
+    ) }) });
+  }
+);
+tt.displayName = "SidebarFavorites";
+const rt = te(
+  [
+    "ds:group/item ds:relative ds:flex ds:items-center ds:gap-[var(--spacing-2xs)]",
+    "ds:rounded-[var(--radius-sm)]",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
+  ].join(" "),
+  {
+    variants: {
+      dragging: {
+        true: "ds:opacity-60",
+        false: ""
+      },
+      dropTarget: {
+        true: "ds:outline-[length:var(--focus-ring-width)] ds:outline-dashed ds:outline-[var(--primary)] ds:outline-offset-[-2px]",
+        false: ""
+      }
+    },
+    defaultVariants: { dragging: !1, dropTarget: !1 }
+  }
+), nt = [
+  "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",
+  "ds:text-[var(--muted-foreground)]",
+  // Quiet chrome — only reveal the grip when the row is hovered or the
+  // handle itself is focused (keyboard / AT). Matches the pin-star's
+  // reveal-on-hover behaviour so the two siblings appear together.
+  "ds:opacity-0 ds:group-hover/item:opacity-100 ds:focus-visible:opacity-100",
+  "ds:hover:bg-[var(--muted)]/20 ds:hover:text-[var(--foreground)]",
+  "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:transition-[color,opacity,background-color] ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
+].join(" "), at = $(
+  ({
+    index: e,
+    isActive: r = !1,
+    asChild: t = !1,
+    reorderLabel: a,
+    isPinned: i = !1,
+    onPinChange: c,
+    pinLabel: o,
+    "aria-label": p,
+    className: u,
+    children: v,
+    ...I
+  }, z) => {
+    const { t: N } = ue("ui"), { mode: A } = G(), m = st(), [l, g] = se(!1), h = !!(m != null && m.onReorder) && A !== "icon", D = a ?? p ?? "", R = fe(), j = (f, Y) => {
+      if (!(m != null && m.onReorder)) return;
+      const W = Math.max(0, Math.min(m.count - 1, Y));
+      W !== f && (m.onReorder(f, W), m.announce(
+        N(
+          "navigation.sidebar.reorderAnnounce",
+          "{{label}} moved to position {{to}} of {{total}}",
+          { label: D, to: W + 1, total: m.count }
+        )
+      ));
+    }, w = (f) => {
+      h && (f.altKey && f.key === "ArrowUp" ? (f.preventDefault(), j(e, e - 1)) : f.altKey && f.key === "ArrowDown" ? (f.preventDefault(), j(e, e + 1)) : f.key === "Home" && f.altKey ? (f.preventDefault(), j(e, 0)) : f.key === "End" && f.altKey && (f.preventDefault(), j(e, m.count - 1)));
+    }, F = (f) => {
+      h && (m == null || m.setDragSource(e), f.dataTransfer && (f.dataTransfer.effectAllowed = "move", f.dataTransfer.setData("ds:text/plain", String(e))));
+    }, E = () => {
+      m == null || m.setDragSource(null), g(!1);
+    }, H = (f) => {
+      !h || (m == null ? void 0 : m.dragSource) === null || (f.preventDefault(), f.dataTransfer && (f.dataTransfer.dropEffect = "move"), g(!0));
+    }, O = () => g(!1), _ = (f) => {
+      if (!h) return;
+      f.preventDefault();
+      const Y = m == null ? void 0 : m.dragSource;
+      g(!1), !(Y == null || Y === e) && j(Y, e);
+    }, P = (m == null ? void 0 : m.dragSource) === e;
+    return /* @__PURE__ */ x(
+      "div",
+      {
+        className: rt({
+          dragging: P,
+          dropTarget: l && !P
+        }),
+        draggable: h || void 0,
+        onDragStart: h ? F : void 0,
+        onDragEnd: h ? E : void 0,
+        onDragOver: H,
+        onDragLeave: O,
+        onDrop: _,
+        children: [
+          /* @__PURE__ */ s(
+            Xe,
+            {
+              ref: z,
+              isActive: r,
+              asChild: t,
+              "aria-label": p,
+              "aria-describedby": h ? R : void 0,
+              draggable: h ? !1 : void 0,
+              className: [h ? "ds:flex-1 ds:min-w-0" : "", u ?? ""].filter(Boolean).join(" "),
+              ...I,
+              children: v
+            }
+          ),
+          h ? /* @__PURE__ */ s(
+            "button",
+            {
+              type: "button",
+              id: R,
+              "aria-label": N(
+                "navigation.sidebar.reorderHandle",
+                "Reorder {{label}}. Press Alt + Up or Alt + Down to move.",
+                { label: D }
+              ),
+              className: nt,
+              onKeyDown: w,
+              children: /* @__PURE__ */ s(ls, { "aria-hidden": "true", className: "ds:size-4" })
+            }
+          ) : null,
+          c && A !== "icon" ? /* @__PURE__ */ s(
+            je,
+            {
+              isPinned: i,
+              label: o ?? p ?? "",
+              onPinChange: c
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+at.displayName = "SidebarFavoriteItem";
+const it = te(
+  [
+    "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: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(" ")
+), ot = $(({ avatar: e, name: r, subtitle: t, subtitleLabel: a, className: i, ...c }, o) => {
+  const { mode: p } = G(), u = p !== "icon", v = typeof t == "string" ? t : a;
+  return /* @__PURE__ */ x(
+    "button",
+    {
+      ref: o,
+      type: "button",
+      "aria-label": v ? `${r}, ${v}` : r,
+      className: [it(), i].filter(Boolean).join(" "),
+      ...c,
+      children: [
+        /* @__PURE__ */ s(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: "ds:inline-flex ds:items-center ds:shrink-0",
+            children: e
+          }
+        ),
+        u ? /* @__PURE__ */ x("span", { className: "ds:flex-1 ds:min-w-0 ds:text-start", children: [
+          /* @__PURE__ */ s("span", { className: "ds:block ds:truncate type-label", children: r }),
+          t ? typeof t == "string" ? /* @__PURE__ */ s("span", { className: "ds:block ds:truncate type-meta ds:text-[color:var(--muted-foreground)]", children: t }) : /* @__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: t }) : null
+        ] }) : null
+      ]
+    }
+  );
+});
+ot.displayName = "SidebarProfilePill";
+const dt = [
+  "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)]",
+  "ds:text-[var(--muted-foreground)]",
+  "ds:hover:bg-[var(--muted)]/20 ds:hover:text-[var(--foreground)]",
+  "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:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
+].join(" "), ct = $(({ className: e, "aria-label": r, onClick: t, ...a }, i) => {
+  const { t: c } = ue("ui"), { mode: o, density: p, transitionTo: u } = G();
+  if (o === "overlay") return null;
+  const v = o === "expanded", I = v ? [
+    "ds:justify-start",
+    p === "compact" ? "ds:ps-[var(--spacing-xs)]" : "ds:ps-[var(--spacing-sm)]"
+  ].join(" ") : "ds:justify-center", z = r ?? (v ? c("navigation.sidebar.collapse", "Collapse sidebar") : c("navigation.sidebar.expand", "Expand sidebar")), N = /* @__PURE__ */ s(
+    "button",
+    {
+      ref: i,
+      type: "button",
+      "aria-label": z,
+      "aria-expanded": v,
+      onClick: (A) => {
+        u == null || u(v ? "icon" : "expanded"), t == null || t(A);
+      },
+      className: [dt, I, e].filter(Boolean).join(" "),
+      ...a,
+      children: /* @__PURE__ */ s("span", { className: "ds:inline-flex ds:size-5 ds:shrink-0 ds:items-center ds:justify-center", children: v ? /* @__PURE__ */ s(
+        ps,
+        {
+          "aria-hidden": "true",
+          className: "ds:size-4 ds:rtl:-scale-x-100"
+        }
+      ) : /* @__PURE__ */ s(
+        gs,
+        {
+          "aria-hidden": "true",
+          className: "ds:size-4 ds:rtl:-scale-x-100"
+        }
+      ) })
+    }
+  );
+  return /* @__PURE__ */ x(C.Root, { children: [
+    /* @__PURE__ */ s(C.Trigger, { asChild: !0, children: N }),
+    /* @__PURE__ */ s(C.Portal, { children: /* @__PURE__ */ x(
+      C.Content,
+      {
+        side: o === "icon" ? "right" : "top",
+        sideOffset: 6,
+        className: pe,
+        children: [
+          z,
+          /* @__PURE__ */ s(C.Arrow, { className: "ds:fill-[var(--foreground)]" })
+        ]
+      }
+    ) })
+  ] });
+});
+ct.displayName = "SidebarCollapseTrigger";
+const lt = te(
+  [
+    "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]",
+    "ds:rounded-[var(--radius-md)]",
+    "ds:border ds:border-[var(--border)]",
+    "ds:bg-[image:var(--gradient-surface-subtle-accent)]",
+    "ds:no-underline ds:!text-[var(--foreground)]",
+    "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]"
+  ].join(" "),
+  {
+    variants: {
+      mode: {
+        expanded: [
+          "ds:min-h-[var(--min-target-size)]",
+          "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-sm)]"
+        ].join(" "),
+        icon: [
+          "ds:justify-center",
+          "ds:w-[var(--min-target-size)] ds:h-[var(--min-target-size)]",
+          "ds:ms-auto ds:me-auto ds:ps-0 ds:pe-0"
+        ].join(" "),
+        overlay: [
+          "ds:min-h-[var(--min-target-size)]",
+          "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-sm)]"
+        ].join(" ")
+      }
+    },
+    defaultVariants: { mode: "expanded" }
+  }
+), ut = $(({ title: e, description: r, icon: t, className: a, ...i }, c) => {
+  const { mode: o } = G(), p = o === "icon", u = (
+    // 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__ */ x(
+      "a",
+      {
+        ref: c,
+        "aria-label": p ? e : void 0,
+        className: lt({ mode: o, className: a }),
+        ...i,
+        children: [
+          /* @__PURE__ */ s(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: [
+                "ds:inline-flex ds:size-8 ds:shrink-0 ds:items-center ds:justify-center",
+                "ds:rounded-[var(--radius-sm)]",
+                "ds:bg-[var(--accent)] ds:text-[var(--accent-foreground)]"
+              ].join(" "),
+              children: t ?? /* @__PURE__ */ s(ms, { className: "ds:size-4" })
+            }
+          ),
+          p ? null : /* @__PURE__ */ x(ye, { children: [
+            /* @__PURE__ */ x("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 }),
+              r ? (
+                // Foreground (not muted) on the tinted surface — the gradient
+                // stops leave muted text short of AA in both colour schemes.
+                /* @__PURE__ */ s("span", { className: "ds:block ds:line-clamp-2 type-meta", children: r })
+              ) : null
+            ] }),
+            /* @__PURE__ */ s(
+              we,
+              {
+                "aria-hidden": "true",
+                className: "ds:size-4 ds:shrink-0 ds:rtl:-scale-x-100"
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  );
+  return p ? /* @__PURE__ */ x(C.Root, { children: [
+    /* @__PURE__ */ s(C.Trigger, { asChild: !0, children: u }),
+    /* @__PURE__ */ s(C.Portal, { children: /* @__PURE__ */ x(
+      C.Content,
+      {
+        side: "right",
+        sideOffset: 6,
+        className: pe,
+        children: [
+          e,
+          /* @__PURE__ */ s(C.Arrow, { className: "ds:fill-[var(--foreground)]" })
+        ]
+      }
+    ) })
+  ] }) : u;
+});
+ut.displayName = "SidebarUpgradeChip";
+export {
+  Ps as S,
+  As as a,
+  ct as b,
+  at as c,
+  tt as d,
+  Rs as e,
+  Ys as f,
+  Os as g,
+  Xe as h,
+  Xs as i,
+  Gs as j,
+  Ks as k,
+  je as l,
+  Qs as m,
+  ot as n,
+  Ge as o,
+  ut as p,
+  Zs as q,
+  bs as s,
+  G as u
+};
+//# sourceMappingURL=sidebar-D_S2-SXH.js.map