@actioneer/ads 1.0.8 → 1.0.9

package/components/sidebar.js

@@ -1,56 +1,56 @@
 "use client";
 import { jsx as r, jsxs as c } from "react/jsx-runtime";
-import * as o from "react";
-import { MotionConfig as _, motion as z } from "motion/react";
-import { User as j, PanelLeft as E } from "../lib/icons.js";
-import { cn as n } from "../lib/cn.js";
-import { springSidebar as H } from "../lib/motion.js";
-import { Tooltip as I } from "./tooltip.js";
-import { Avatar as L } from "./avatar.js";
-const R = o.createContext({
+import * as n from "react";
+import { MotionConfig as j, motion as _ } from "motion/react";
+import { User as E, PanelLeft as H } from "../lib/icons.js";
+import { cn as o } from "../lib/cn.js";
+import { springSidebar as I } from "../lib/motion.js";
+import { Tooltip as L } from "./tooltip.js";
+import { Avatar as M } from "./avatar.js";
+const z = n.createContext({
   collapsed: !1,
   toggle: () => {
   },
   setCollapsed: () => {
   }
 });
-function M() {
-  return o.useContext(R);
+function W() {
+  return n.useContext(z);
 }
-const K = o.forwardRef(
+const K = n.forwardRef(
   ({
-    className: t,
+    className: a,
     collapsed: e,
-    defaultCollapsed: a = !1,
-    onCollapsedChange: i,
+    defaultCollapsed: i = !1,
+    onCollapsedChange: t,
     animateOnMount: s = !1,
     keyboardToggle: d = !0,
     ...l
-  }, m) => {
-    const [v, y] = o.useState(a), g = e !== void 0, u = g ? e : v, b = o.useCallback(
+  }, b) => {
+    const [g, y] = n.useState(i), f = e !== void 0, u = f ? e : g, m = n.useCallback(
       (p) => {
-        g || y(p), i == null || i(p);
+        f || y(p), t == null || t(p);
       },
-      [g, i]
-    ), h = o.useCallback(
-      () => b(!u),
-      [u, b]
+      [f, t]
+    ), x = n.useCallback(
+      () => m(!u),
+      [u, m]
     );
-    o.useEffect(() => {
+    n.useEffect(() => {
       if (!d) return;
-      const p = (f) => {
-        (f.metaKey || f.ctrlKey) && f.key.toLowerCase() === "b" && (f.preventDefault(), h());
+      const p = (h) => {
+        (h.metaKey || h.ctrlKey) && h.key.toLowerCase() === "b" && (h.preventDefault(), x());
       };
       return document.addEventListener("keydown", p), () => document.removeEventListener("keydown", p);
-    }, [d, h]);
-    const x = o.useMemo(
-      () => ({ collapsed: u, toggle: h, setCollapsed: b }),
-      [u, h, b]
+    }, [d, x]);
+    const v = n.useMemo(
+      () => ({ collapsed: u, toggle: x, setCollapsed: m }),
+      [u, x, m]
     );
-    return /* @__PURE__ */ r(R.Provider, { value: x, children: /* @__PURE__ */ r(_, { reducedMotion: "user", children: /* @__PURE__ */ r(
-      z.aside,
+    return /* @__PURE__ */ r(z.Provider, { value: v, children: /* @__PURE__ */ r(j, { reducedMotion: "user", children: /* @__PURE__ */ r(
+      _.aside,
       {
-        ref: m,
+        ref: b,
         "data-collapsed": u ? "true" : "false",
         initial: s ? {
           width: u ? 56 : 240,
@@ -62,10 +62,10 @@ const K = o.forwardRef(
           transform: "translate3d(0, 0, 0)",
           opacity: 1
         },
-        transition: H,
-        className: n(
+        transition: I,
+        className: o(
           "group/sidebar flex h-full shrink-0 flex-col bg-background",
-          t
+          a
         ),
         ...l
       }
@@ -73,20 +73,20 @@ const K = o.forwardRef(
   }
 );
 K.displayName = "Sidebar";
-function S({ children: t }) {
-  return /* @__PURE__ */ r("kbd", { className: "inline-flex h-4 min-w-4 items-center justify-center rounded bg-background/20 px-1 text-xs leading-none", children: t });
+function S({ children: a }) {
+  return /* @__PURE__ */ r("kbd", { className: "inline-flex h-4 min-w-4 items-center justify-center rounded bg-background/20 px-1 text-xs leading-none", children: a });
 }
 function k({
-  className: t,
+  className: a,
   onClick: e,
-  tooltipSide: a = "right",
-  ...i
+  tooltipSide: i = "right",
+  ...t
 }) {
-  const { collapsed: s, toggle: d } = M();
+  const { collapsed: s, toggle: d } = W();
   return /* @__PURE__ */ r(
-    I,
+    L,
     {
-      side: a,
+      side: i,
       content: /* @__PURE__ */ c("span", { className: "flex items-center gap-1.5", children: [
         s ? "Expand" : "Collapse",
         /* @__PURE__ */ c("span", { className: "flex items-center gap-0.5", children: [
@@ -103,100 +103,136 @@ function k({
           onClick: (l) => {
             e == null || e(l), d();
           },
-          className: n(
+          className: o(
             "inline-flex size-(--sidebar-item) shrink-0 items-center justify-center rounded-sm border border-transparent text-muted-foreground",
             "transition-colors hover:border-border hover:bg-elevated hover:text-foreground",
             "outline-none focus-visible:ring-3 focus-visible:ring-ring",
             "[&_svg]:size-4.5",
-            t
+            a
           ),
-          ...i,
-          children: /* @__PURE__ */ r(E, {})
+          ...t,
+          children: /* @__PURE__ */ r(H, {})
         }
       )
     }
   );
 }
-function Y({
-  logo: t,
+function Z({
+  logo: a,
   href: e,
-  label: a = "Home",
-  showTrigger: i = !0,
+  label: i = "Home",
+  showTrigger: t = !0,
   children: s,
   className: d,
   ...l
 }) {
-  const m = n(
-    // 20px mark centered in a 32px square — the same box as every other rail icon.
-    // group/brand lets a BrandMark logo play its blip loop on hover.
-    "group/brand flex size-(--sidebar-item) items-center justify-center",
-    "[&_img]:size-(--sidebar-logo) [&_svg]:size-(--sidebar-logo)",
+  const b = n.isValidElement(a) && a.type === R, g = o(
+    b ? "flex min-w-0 items-center rounded-m outline-none focus-visible:ring-3 focus-visible:ring-ring" : o(
+      // 20px mark centered in a 32px square — the same box as every other rail icon.
+      // group/brand lets a BrandMark logo play its blip loop on hover.
+      "group/brand flex size-(--sidebar-item) items-center justify-center",
+      "[&_img]:size-(--sidebar-logo) [&_svg]:size-(--sidebar-logo)"
+    ),
     // The logo owns the header at rest in BOTH states. On the collapsed rail
     // it swaps for the expand trigger only while the rail is hovered (or
     // holds keyboard focus, so the control stays reachable).
-    i && "group-data-[collapsed=true]/sidebar:group-hover/sidebar:hidden group-data-[collapsed=true]/sidebar:group-focus-within/sidebar:hidden"
+    t && "group-data-[collapsed=true]/sidebar:group-hover/sidebar:hidden group-data-[collapsed=true]/sidebar:group-focus-within/sidebar:hidden"
   );
   return /* @__PURE__ */ c(
     "div",
     {
-      className: n(
+      className: o(
         "flex h-(--sidebar-header) shrink-0 items-center justify-between gap-2 px-4",
         "group-data-[collapsed=true]/sidebar:justify-center group-data-[collapsed=true]/sidebar:px-2",
         d
       ),
       ...l,
       children: [
-        e ? /* @__PURE__ */ r("a", { href: e, "aria-label": a, className: m, children: t }) : /* @__PURE__ */ r("span", { className: m, children: t }),
-        i && /* @__PURE__ */ r("div", { className: "hidden group-data-[collapsed=true]/sidebar:group-hover/sidebar:flex group-data-[collapsed=true]/sidebar:group-focus-within/sidebar:flex", children: /* @__PURE__ */ r(k, { tooltipSide: "right" }) }),
+        e ? /* @__PURE__ */ r("a", { href: e, "aria-label": i, className: g, children: a }) : /* @__PURE__ */ r("span", { className: g, children: a }),
+        t && /* @__PURE__ */ r("div", { className: "hidden group-data-[collapsed=true]/sidebar:group-hover/sidebar:flex group-data-[collapsed=true]/sidebar:group-focus-within/sidebar:flex", children: /* @__PURE__ */ r(k, { tooltipSide: "right" }) }),
         /* @__PURE__ */ c("div", { className: "flex items-center gap-1 group-data-[collapsed=true]/sidebar:hidden", children: [
-          i && /* @__PURE__ */ r(k, { tooltipSide: "bottom" }),
+          t && /* @__PURE__ */ r(k, { tooltipSide: "bottom" }),
           s
         ] })
       ]
     }
   );
 }
-const q = o.forwardRef(
-  ({ className: t, ...e }, a) => /* @__PURE__ */ r(
+const R = n.forwardRef(
+  ({ className: a, name: e, logoSrc: i, showName: t = !0, ...s }, d) => {
+    const l = e.trim().charAt(0).toUpperCase();
+    return /* @__PURE__ */ c(
+      "span",
+      {
+        ref: d,
+        className: o("flex min-w-0 items-center gap-2.5", a),
+        ...s,
+        children: [
+          i ? /* @__PURE__ */ r(
+            "img",
+            {
+              src: i,
+              alt: t ? "" : e,
+              className: "size-(--sidebar-item) shrink-0 rounded-m object-contain"
+            }
+          ) : /* @__PURE__ */ r(
+            "span",
+            {
+              "aria-hidden": t || void 0,
+              role: t ? void 0 : "img",
+              "aria-label": t ? void 0 : e,
+              className: "flex size-(--sidebar-item) shrink-0 items-center justify-center rounded-m bg-wg12 text-m leading-[var(--text-m--line-height)] font-medium text-white",
+              children: l
+            }
+          ),
+          t && /* @__PURE__ */ r("span", { className: "min-w-0 truncate text-l leading-[var(--text-l--line-height)] font-medium text-foreground group-data-[collapsed=true]/sidebar:sr-only", children: e })
+        ]
+      }
+    );
+  }
+);
+R.displayName = "SidebarWorkspace";
+const q = n.forwardRef(
+  ({ className: a, ...e }, i) => /* @__PURE__ */ r(
     "div",
     {
-      ref: a,
-      className: n(
+      ref: i,
+      className: o(
         "flex h-(--sidebar-header) shrink-0 items-center justify-between gap-2 px-3",
         "group-data-[collapsed=true]/sidebar:justify-center group-data-[collapsed=true]/sidebar:px-2",
-        t
+        a
       ),
       ...e
     }
   )
 );
 q.displayName = "SidebarHeader";
-const B = o.forwardRef(
-  ({ className: t, ...e }, a) => /* @__PURE__ */ r("nav", { ref: a, className: n("min-h-0 flex-1 space-y-5 overflow-y-auto p-3", t), ...e })
+const A = n.forwardRef(
+  ({ className: a, ...e }, i) => /* @__PURE__ */ r("nav", { ref: i, className: o("min-h-0 flex-1 space-y-5 overflow-y-auto p-3", a), ...e })
 );
-B.displayName = "SidebarNav";
-const D = o.forwardRef(
-  ({ className: t, label: e, children: a, ...i }, s) => /* @__PURE__ */ c("div", { ref: s, className: t, ...i, children: [
+A.displayName = "SidebarNav";
+const B = n.forwardRef(
+  ({ className: a, label: e, children: i, ...t }, s) => /* @__PURE__ */ c("div", { ref: s, className: a, ...t, children: [
     e && /* @__PURE__ */ r("div", { className: "mb-1.5 px-3 text-s font-normal uppercase leading-4 tracking-wider text-tertiary group-data-[collapsed=true]/sidebar:hidden", children: e }),
-    /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5 group-data-[collapsed=true]/sidebar:gap-2", children: a })
+    /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5 group-data-[collapsed=true]/sidebar:gap-2", children: i })
   ] })
 );
-D.displayName = "SidebarSection";
-const F = o.forwardRef(
-  ({ className: t, icon: e, isActive: a, endContent: i, children: s, title: d, ...l }, m) => /* @__PURE__ */ c(
+B.displayName = "SidebarSection";
+const D = n.forwardRef(
+  ({ className: a, icon: e, isActive: i, endContent: t, children: s, title: d, ...l }, b) => /* @__PURE__ */ c(
     "a",
     {
-      ref: m,
-      "aria-current": a ? "page" : void 0,
+      ref: b,
+      "aria-current": i ? "page" : void 0,
       title: d ?? (typeof s == "string" ? s : void 0),
-      className: n(
+      className: o(
         "group/sidebar-item flex h-9 items-center gap-2.5 rounded-md border border-transparent px-3 text-m leading-[var(--text-m--line-height)] font-normal text-sidebar-foreground",
         "transition-[background-color,border-color,color] duration-150 ease-out motion-reduce:transition-none",
         "outline-none focus-visible:ring-3 focus-visible:ring-ring",
         // Collapsed: a centered square (--sidebar-item) so every rail item lines up.
         "group-data-[collapsed=true]/sidebar:mx-auto group-data-[collapsed=true]/sidebar:size-(--sidebar-item) group-data-[collapsed=true]/sidebar:justify-center group-data-[collapsed=true]/sidebar:p-0",
-        a ? "bg-sidebar-accent text-sidebar-accent-foreground" : "hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground",
-        t
+        i ? "bg-sidebar-accent text-sidebar-accent-foreground" : "hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground",
+        a
       ),
       ...l,
       children: [
@@ -205,34 +241,34 @@ const F = o.forwardRef(
           {
             "aria-hidden": !0,
             className: "flex shrink-0 items-center justify-center transition-transform duration-150 ease-out group-hover/sidebar-item:scale-110 motion-reduce:transition-none motion-reduce:group-hover/sidebar-item:scale-100 [&_svg]:size-4 [&_svg]:shrink-0",
-            children: a && o.isValidElement(e) ? o.cloneElement(e, { weight: "fill" }) : e
+            children: i && n.isValidElement(e) ? n.cloneElement(e, { weight: "fill" }) : e
           }
         ),
         /* @__PURE__ */ r("span", { className: "min-w-0 flex-1 truncate group-data-[collapsed=true]/sidebar:hidden", children: s }),
-        i && /* @__PURE__ */ r("span", { className: "shrink-0 group-data-[collapsed=true]/sidebar:hidden", children: i })
+        t && /* @__PURE__ */ r("span", { className: "shrink-0 group-data-[collapsed=true]/sidebar:hidden", children: t })
       ]
     }
   )
 );
-F.displayName = "SidebarItem";
-const W = o.forwardRef(
-  ({ className: t, ...e }, a) => /* @__PURE__ */ r(
+D.displayName = "SidebarItem";
+const F = n.forwardRef(
+  ({ className: a, ...e }, i) => /* @__PURE__ */ r(
     "div",
     {
-      ref: a,
-      className: n("shrink-0 p-3 group-data-[collapsed=true]/sidebar:px-2", t),
+      ref: i,
+      className: o("shrink-0 p-3 group-data-[collapsed=true]/sidebar:px-2", a),
       ...e
     }
   )
 );
-W.displayName = "SidebarFooter";
-const $ = o.forwardRef(
-  ({ className: t, icon: e, children: a, ...i }, s) => /* @__PURE__ */ r("div", { className: "px-3 pb-0.5 group-data-[collapsed=true]/sidebar:px-2", children: /* @__PURE__ */ c(
+F.displayName = "SidebarFooter";
+const U = n.forwardRef(
+  ({ className: a, icon: e, children: i, ...t }, s) => /* @__PURE__ */ r("div", { className: "px-3 pb-0.5 group-data-[collapsed=true]/sidebar:px-2", children: /* @__PURE__ */ c(
     "button",
     {
       ref: s,
       type: "button",
-      className: n(
+      className: o(
         "flex h-9 w-full items-center justify-start gap-2 rounded-md px-3",
         "text-m leading-[var(--text-m--line-height)] font-normal text-sidebar-foreground",
         // Reads as a normal nav item: transparent at rest, the shared White
@@ -242,50 +278,50 @@ const $ = o.forwardRef(
         "outline-none focus-visible:ring-3 focus-visible:ring-ring",
         "[&_svg]:size-4 [&_svg]:shrink-0",
         "group-data-[collapsed=true]/sidebar:mx-auto group-data-[collapsed=true]/sidebar:size-(--sidebar-item) group-data-[collapsed=true]/sidebar:justify-center group-data-[collapsed=true]/sidebar:px-0",
-        t
+        a
       ),
-      ...i,
+      ...t,
       children: [
         e,
-        /* @__PURE__ */ r("span", { className: "truncate group-data-[collapsed=true]/sidebar:hidden", children: a })
+        /* @__PURE__ */ r("span", { className: "truncate group-data-[collapsed=true]/sidebar:hidden", children: i })
       ]
     }
   ) })
 );
-$.displayName = "SidebarAction";
-const A = o.forwardRef(
-  ({ className: t, label: e, children: a, ...i }, s) => /* @__PURE__ */ c(
+U.displayName = "SidebarAction";
+const V = n.forwardRef(
+  ({ className: a, label: e, children: i, ...t }, s) => /* @__PURE__ */ c(
     "div",
     {
       ref: s,
-      className: n("group-data-[collapsed=true]/sidebar:hidden", t),
-      ...i,
+      className: o("group-data-[collapsed=true]/sidebar:hidden", a),
+      ...t,
       children: [
-        e && /* @__PURE__ */ r("div", { className: "mb-1.5 px-3 text-s leading-[var(--text-s--line-height)] font-medium text-on-warm-grey-secondary", children: e }),
-        /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: a })
+        e && /* @__PURE__ */ r("div", { className: "mb-1.5 px-3 text-s font-normal uppercase leading-4 tracking-wider text-tertiary", children: e }),
+        /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: i })
       ]
     }
   )
 );
-A.displayName = "SidebarHistory";
-const O = o.forwardRef(({ className: t, children: e, title: a, action: i, isActive: s, icon: d, ...l }, m) => {
-  const v = o.useRef(null), y = o.useRef(null), [g, u] = o.useState(0);
-  o.useLayoutEffect(() => {
-    const x = v.current, p = y.current;
-    if (!x || !p) return;
-    const f = () => {
-      const w = p.scrollWidth - x.clientWidth;
-      u(w > 0 ? w + (i ? 32 : 0) : 0);
+V.displayName = "SidebarHistory";
+const $ = n.forwardRef(({ className: a, children: e, title: i, action: t, isActive: s, icon: d, ...l }, b) => {
+  const g = n.useRef(null), y = n.useRef(null), [f, u] = n.useState(0);
+  n.useLayoutEffect(() => {
+    const v = g.current, p = y.current;
+    if (!v || !p) return;
+    const h = () => {
+      const w = p.scrollWidth - v.clientWidth;
+      u(w > 0 ? w + (t ? 32 : 0) : 0);
     };
-    f();
-    const N = new ResizeObserver(f);
-    return N.observe(x), N.observe(p), () => N.disconnect();
-  }, [e, i]);
-  const b = g > 0, h = Math.max(500, Math.round(g * 18));
+    h();
+    const N = new ResizeObserver(h);
+    return N.observe(v), N.observe(p), () => N.disconnect();
+  }, [e, t]);
+  const m = f > 0, x = Math.max(500, Math.round(f * 18));
   return /* @__PURE__ */ c(
     "div",
     {
-      className: n(
+      className: o(
         "group/hist relative flex items-center rounded-md transition-colors",
         "text-sidebar-foreground",
         s ? "bg-sidebar-accent text-sidebar-accent-foreground" : "hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground"
@@ -302,40 +338,40 @@ const O = o.forwardRef(({ className: t, children: e, title: a, action: i, isActi
         /* @__PURE__ */ r(
           "a",
           {
-            ref: m,
-            title: a ?? (typeof e == "string" ? e : void 0),
-            className: n(
+            ref: b,
+            title: i ?? (typeof e == "string" ? e : void 0),
+            className: o(
               // Left pad matches a SidebarItem's text column (px-3 + icon size-4 +
               // gap-2.5 = 2.375rem) so history titles line up under the nav labels.
               "block min-w-0 flex-1 rounded-md py-1.5 pr-3 ps-(--sidebar-text-indent) text-m leading-[var(--text-m--line-height)] font-normal",
               "outline-none focus-visible:ring-3 focus-visible:ring-ring",
-              t
+              a
             ),
             ...l,
             children: /* @__PURE__ */ r(
               "span",
               {
-                ref: v,
-                className: n(
+                ref: g,
+                className: o(
                   "block overflow-hidden",
                   // Rest: fade the right edge (no ellipsis). Hover: the title scrolls,
                   // so fade the LEFT edge where it exits; the action backdrop (or the
                   // string's own end) handles the right.
-                  b && "[mask-image:linear-gradient(to_right,var(--color-wg12)_calc(100%-1.5rem),transparent)]",
-                  b && "group-hover/hist:[mask-image:linear-gradient(to_right,transparent,var(--color-wg12)_1.25rem,var(--color-wg12)_100%)]"
+                  m && "[mask-image:linear-gradient(to_right,var(--color-wg12)_calc(100%-1.5rem),transparent)]",
+                  m && "group-hover/hist:[mask-image:linear-gradient(to_right,transparent,var(--color-wg12)_1.25rem,var(--color-wg12)_100%)]"
                 ),
                 children: /* @__PURE__ */ r(
                   "span",
                   {
                     ref: y,
-                    className: n(
+                    className: o(
                       "block w-max whitespace-nowrap transition-transform ease-linear",
-                      b && "group-hover/hist:[transform:translateX(var(--mq-x))]",
+                      m && "group-hover/hist:[transform:translateX(var(--mq-x))]",
                       "motion-reduce:transition-none motion-reduce:group-hover/hist:[transform:none]"
                     ),
                     style: {
-                      "--mq-x": `-${g}px`,
-                      transitionDuration: `${h}ms`
+                      "--mq-x": `-${f}px`,
+                      transitionDuration: `${x}ms`
                     },
                     children: e
                   }
@@ -344,10 +380,10 @@ const O = o.forwardRef(({ className: t, children: e, title: a, action: i, isActi
             )
           }
         ),
-        i && /* @__PURE__ */ r(
+        t && /* @__PURE__ */ r(
           "span",
           {
-            className: n(
+            className: o(
               // Rounded end matches the row's radius so the backdrop doesn't
               // square off the highlight's right corners.
               "absolute inset-y-0 right-0 flex items-center rounded-e-md pl-8 pr-1",
@@ -357,30 +393,30 @@ const O = o.forwardRef(({ className: t, children: e, title: a, action: i, isActi
               "pointer-events-none group-hover/hist:pointer-events-auto",
               "focus-within:pointer-events-auto focus-within:opacity-100"
             ),
-            children: i
+            children: t
           }
         )
       ]
     }
   );
 });
-O.displayName = "SidebarHistoryItem";
-const P = o.forwardRef(
-  ({ className: t, name: e, role: a, src: i, hideAvatar: s, ...d }, l) => /* @__PURE__ */ c(
+$.displayName = "SidebarHistoryItem";
+const O = n.forwardRef(
+  ({ className: a, name: e, role: i, src: t, hideAvatar: s, ...d }, l) => /* @__PURE__ */ c(
     "a",
     {
       ref: l,
-      className: n(
+      className: o(
         "flex items-center gap-2.5 rounded-md border border-transparent p-2 transition-colors hover:border-wg10",
         "outline-none focus-visible:ring-3 focus-visible:ring-ring",
         "group-data-[collapsed=true]/sidebar:mx-auto group-data-[collapsed=true]/sidebar:size-(--sidebar-item) group-data-[collapsed=true]/sidebar:justify-center group-data-[collapsed=true]/sidebar:p-0",
-        t
+        a
       ),
       ...d,
       children: [
-        !s && /* @__PURE__ */ r(L, { size: "sm", name: e, src: i }),
+        !s && /* @__PURE__ */ r(M, { size: "sm", name: e, src: t }),
         s && /* @__PURE__ */ r(
-          j,
+          E,
           {
             "aria-hidden": !0,
             className: "hidden size-4 shrink-0 text-muted-foreground group-data-[collapsed=true]/sidebar:block"
@@ -388,25 +424,26 @@ const P = o.forwardRef(
         ),
         /* @__PURE__ */ c("div", { className: "min-w-0 leading-tight group-data-[collapsed=true]/sidebar:hidden", children: [
           /* @__PURE__ */ r("div", { className: "truncate text-base leading-[var(--text-base--line-height)] font-normal text-foreground", children: e }),
-          a && /* @__PURE__ */ r("div", { className: "truncate text-s leading-[var(--text-s--line-height)] text-tertiary", children: a })
+          i && /* @__PURE__ */ r("div", { className: "truncate text-s leading-[var(--text-s--line-height)] text-tertiary", children: i })
         ] })
       ]
     }
   )
 );
-P.displayName = "SidebarAccount";
+O.displayName = "SidebarAccount";
 export {
   K as Sidebar,
-  P as SidebarAccount,
-  $ as SidebarAction,
-  Y as SidebarBrand,
-  W as SidebarFooter,
+  O as SidebarAccount,
+  U as SidebarAction,
+  Z as SidebarBrand,
+  F as SidebarFooter,
   q as SidebarHeader,
-  A as SidebarHistory,
-  O as SidebarHistoryItem,
-  F as SidebarItem,
-  B as SidebarNav,
-  D as SidebarSection,
+  V as SidebarHistory,
+  $ as SidebarHistoryItem,
+  D as SidebarItem,
+  A as SidebarNav,
+  B as SidebarSection,
   k as SidebarTrigger,
-  M as useSidebar
+  R as SidebarWorkspace,
+  W as useSidebar
 };

package/components/table.d.ts

@@ -95,6 +95,14 @@ export interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement>
     disclosureLabel?: string;
     /** @deprecated Existing visual-only marker. New rows should pass an action via onClick. */
     isInteractive?: boolean;
+    /**
+     * This row's detail panel is open (e.g. the shell-level inline `Drawer`
+     * that `onClick` opened). Paints the same soft-teal left-to-right fade as a
+     * selected row and sets `aria-current="true"`, without needing a selection
+     * column. Clear it when the panel closes. Independent of `selectionMode`:
+     * a row can be both active and checked.
+     */
+    isActive?: boolean;
 }
 export declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
 export interface TableColumnProps extends React.ThHTMLAttributes<HTMLTableCellElement> {