@opencxh/ui-kit 3.175.2 → 3.176.0

package/dist/index.js

@@ -1,21 +1,21 @@
 import { jsxs as c, jsx as e, Fragment as Ee } from "react/jsx-runtime";
-import ae, { forwardRef as ve, useState as R, useLayoutEffect as gt, useRef as ne, useEffect as X, createContext as et, useId as pt, useMemo as pe, useContext as vt, useCallback as xe, Component as yt } from "react";
-import { clsx as Nt } from "clsx";
-import * as wt from "lucide-react";
-import { X as Se, ChevronDown as Ae, ExternalLink as kt, Search as Le, ChevronRight as Ie, Sparkles as Ct, ImageOff as St, ChevronLeft as ze, Pencil as Et, ArrowUpRight as zt, Calendar as Mt, Check as Ue, ChevronUp as Tt, Ellipsis as $t, ChevronDownIcon as _t, FileText as je, HardDrive as We, ArrowLeft as Dt, FolderPlus as At, Upload as Lt, Folder as Ke, Trash2 as It, Plus as Pt, Loader2 as Ot, VideoOff as jt, User as Ft, MicOff as Rt, Mic as Bt } from "lucide-react";
-import Ht from "dompurify";
-import qt from "react-markdown";
-import Vt from "remark-gfm";
+import ae, { forwardRef as ve, useState as R, useLayoutEffect as vt, useRef as ne, useEffect as Z, createContext as et, useId as yt, useMemo as pe, useContext as Nt, useCallback as xe, Component as wt } from "react";
+import { clsx as kt } from "clsx";
+import * as Ct from "lucide-react";
+import { X as Se, ChevronDown as De, ExternalLink as St, Search as Le, ChevronRight as Ie, Sparkles as Et, ArrowUpRight as tt, ImageOff as zt, ChevronLeft as ze, Pencil as Mt, Calendar as Tt, Check as Ue, ChevronUp as At, Ellipsis as _t, ChevronDownIcon as $t, FileText as je, HardDrive as We, ArrowLeft as Dt, FolderPlus as Lt, Upload as It, Folder as Ke, Trash2 as Pt, Plus as Ot, Loader2 as jt, VideoOff as Ft, User as Rt, MicOff as Bt, Mic as Ht } from "lucide-react";
+import qt from "dompurify";
+import Vt from "react-markdown";
+import Ut from "remark-gfm";
 function i(...t) {
-  return Nt(t);
+  return kt(t);
 }
-function es(t) {
+function ns(t) {
   return (r, n) => t[r]?.[n] || "";
 }
-function ts(t) {
+function ss(t) {
   return (r) => t[r] || "";
 }
-const Ut = {
+const Wt = {
   primary: "bg-accent text-accent-fg hover:bg-accent-hover disabled:bg-surface-hover",
   secondary: "bg-surface-sunk text-text-strong hover:bg-surface-hover disabled:bg-surface-hover",
   // No resting fill, so no disabled fill either — a greyed-out plate where
@@ -28,7 +28,7 @@ const Ut = {
   success: "bg-success text-text-inverse hover:opacity-90 disabled:bg-surface-hover",
   warning: "bg-warning text-text-inverse hover:opacity-90 disabled:bg-surface-hover",
   "danger-solid": "bg-danger text-text-inverse hover:opacity-90 disabled:bg-surface-hover"
-}, Wt = {
+}, Kt = {
   xs: "h-control-xs px-2 text-xs",
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-4 text-sm",
@@ -36,7 +36,7 @@ const Ut = {
   xl: "h-control-xl px-6 text-base",
   "2xl": "h-control-2xl px-6 text-base",
   full: "h-control-md px-4 text-sm"
-}, Kt = {
+}, Gt = {
   xs: "h-control-xs w-6",
   sm: "h-control-sm w-7",
   md: "h-control-md w-8",
@@ -75,8 +75,8 @@ const Ut = {
           "focus-visible:outline-none focus-visible:focus-ring",
           "disabled:cursor-not-allowed disabled:border-border-subtle",
           "disabled:text-text-disabled",
-          Ut[t],
-          o ? Kt[r] : Wt[r],
+          Wt[t],
+          o ? Gt[r] : Kt[r],
           (n || r === "full") && "w-full",
           s && "cursor-wait",
           d
@@ -102,7 +102,7 @@ const Ut = {
   }
 );
 se.displayName = "Button";
-const rs = ({
+const as = ({
   children: t,
   size: r = "md",
   orientation: n = "horizontal",
@@ -133,12 +133,12 @@ const rs = ({
   );
   return /* @__PURE__ */ e("div", { className: l, role: "group", children: t });
 };
-function ns(t) {
+function Jt(t) {
   if (!t) return;
-  const r = t.split(/[-_ ]/).filter(Boolean).map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join(""), n = wt[r];
+  const r = t.split(/[-_ ]/).filter(Boolean).map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join(""), n = Ct[r];
   return typeof n == "function" || typeof n == "object" && n !== null ? n : void 0;
 }
-const Gt = {
+const Yt = {
   primary: "text-text",
   secondary: "text-text-muted",
   accent: "text-accent",
@@ -148,7 +148,7 @@ const Gt = {
   info: "text-info-fg",
   neutral: "text-text-subtle",
   current: "text-current"
-}, ee = ({
+}, J = ({
   icon: t,
   size: r = "md",
   color: n = "current",
@@ -158,9 +158,9 @@ const Gt = {
   "aria-label": o,
   ...u
 }) => {
-  const d = typeof r == "number" ? r : Jt(r), v = i(
+  const d = typeof r == "number" ? r : Xt(r), v = i(
     "inline-block shrink-0",
-    Gt[n],
+    Yt[n],
     s && [
       "cursor-pointer rounded-sm transition-opacity duration-fast ease-out hover:opacity-80",
       "focus-visible:outline-none focus-visible:focus-ring"
@@ -182,7 +182,7 @@ const Gt = {
   };
   return /* @__PURE__ */ e(t, { ...m });
 };
-function Jt(t) {
+function Xt(t) {
   return {
     xs: 12,
     sm: 14,
@@ -193,7 +193,7 @@ function Jt(t) {
 }
 function Pe(t, r, { gap: n = 6, matchWidth: s = !1, placement: a = "bottom-start" } = {}) {
   const [l, o] = R({});
-  return gt(() => {
+  return vt(() => {
     if (!t) return;
     const u = () => {
       const d = r.current;
@@ -206,7 +206,7 @@ function Pe(t, r, { gap: n = 6, matchWidth: s = !1, placement: a = "bottom-start
     };
   }, [t, r, n, s, a]), l;
 }
-const tt = ({
+const rt = ({
   trigger: t,
   children: r,
   placement: n = "bottom-start",
@@ -217,7 +217,7 @@ const tt = ({
   triggerLabel: u
 }) => {
   const [d, v] = R(!1), m = ne(null), f = ne(null), b = Pe(d, f, { placement: n });
-  X(() => {
+  Z(() => {
     if (!d) return;
     const p = (C) => {
       m.current && !m.current.contains(C.target) && v(!1);
@@ -263,29 +263,29 @@ const tt = ({
       }
     )
   ] });
-}, Yt = {
+}, Zt = {
   none: "hover:bg-surface-sunk hover:text-text",
   default: "bg-surface-sunk text-text-muted hover:text-text",
   muted: "bg-surface-sunk text-text-subtle hover:text-text",
   outline: "text-text-muted ring-1 ring-inset ring-border-strong hover:bg-surface-hover hover:text-text",
   warning: "bg-warning-soft text-warning-fg",
   danger: "bg-danger-soft text-danger-fg"
-}, Xt = (t) => i(
+}, Qt = (t) => i(
   // A button's default cursor is an arrow, so it has to be asked for.
   "inline-flex cursor-pointer select-none items-center text-sm font-medium",
   t.size === "sm" ? "h-control-sm" : "h-control-md",
   "transition-colors duration-fast ease-out",
   t.shape === "pill" ? "rounded-full" : "rounded-md",
   // Picking a value outranks whatever the value happens to mean.
-  t.active ? "bg-info-soft text-info-fg" : Yt[t.tone ?? "default"],
+  t.active ? "bg-info-soft text-info-fg" : Zt[t.tone ?? "default"],
   t.className
-), Zt = (t) => i(
+), er = (t) => i(
   "inline-flex items-center gap-1.5 pl-3",
   t.shape === "pill" ? "rounded-full" : "rounded-md",
   t.withClear ? "pr-1.5" : "pr-3",
   "focus-visible:outline-none focus-visible:focus-ring"
 );
-function Qt({
+function tr({
   label: t,
   icon: r,
   tone: n = "default",
@@ -301,11 +301,11 @@ function Qt({
   title: b,
   className: g
 }) {
-  const w = l && !!v, p = s === "pill" ? "rounded-full" : "rounded-md", h = Xt({ active: l, tone: n, shape: s, size: a, className: g }), C = /* @__PURE__ */ c(Ee, { children: [
+  const w = l && !!v, p = s === "pill" ? "rounded-full" : "rounded-md", h = Qt({ active: l, tone: n, shape: s, size: a, className: g }), C = /* @__PURE__ */ c(Ee, { children: [
     r,
     t,
-    o && /* @__PURE__ */ e(ee, { icon: Ae, size: "xs" })
-  ] }), z = Zt({ shape: s, withClear: w }), P = w && /* @__PURE__ */ e(
+    o && /* @__PURE__ */ e(J, { icon: De, size: "xs" })
+  ] }), z = er({ shape: s, withClear: w }), P = w && /* @__PURE__ */ e(
     "button",
     {
       type: "button",
@@ -315,12 +315,12 @@ function Qt({
         "inline-flex h-full items-center pr-3 focus-visible:outline-none focus-visible:focus-ring",
         p
       ),
-      children: /* @__PURE__ */ e(ee, { icon: Se, size: "xs" })
+      children: /* @__PURE__ */ e(J, { icon: Se, size: "xs" })
     }
   );
   return u ? /* @__PURE__ */ c("span", { className: h, title: b, children: [
     /* @__PURE__ */ e(
-      tt,
+      rt,
       {
         trigger: C,
         rootClassName: "h-full",
@@ -335,13 +335,13 @@ function Qt({
     P
   ] }) : /* @__PURE__ */ e("button", { type: "button", title: b, onClick: f, className: i(h, z), children: C });
 }
-const er = {
+const rr = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-base",
   lg: "text-md",
   xl: "text-lg"
-}, tr = {
+}, nr = {
   primary: "text-text hover:text-info-fg hover:underline",
   info: "text-info-fg hover:underline",
   secondary: "text-text-muted hover:text-text",
@@ -350,7 +350,7 @@ const er = {
   success: "text-success-fg hover:underline",
   warning: "text-warning-fg hover:underline",
   error: "text-danger-fg hover:underline"
-}, rr = {
+}, sr = {
   primary: "bg-accent-soft",
   accent: "bg-accent-soft",
   secondary: "bg-surface-hover",
@@ -359,7 +359,7 @@ const er = {
   warning: "bg-warning-soft",
   error: "bg-danger-soft",
   info: "bg-info-soft"
-}, ss = ({
+}, ls = ({
   variant: t = "default",
   size: r = "md",
   color: n = "primary",
@@ -376,13 +376,13 @@ const er = {
     "inline-flex items-center gap-1 underline-offset-2",
     "transition-colors duration-fast ease-out",
     "focus-visible:outline-none focus-visible:focus-ring",
-    er[r],
-    !s && tr[n],
+    rr[r],
+    !s && nr[n],
     t === "subtle" && "no-underline opacity-70 hover:opacity-100",
     t === "underline" && "underline decoration-1 hover:decoration-2",
     t === "button" && [
       "h-control-md rounded-md px-3 font-semibold no-underline hover:no-underline",
-      rr[n]
+      sr[n]
     ],
     s && "pointer-events-none cursor-not-allowed text-text-disabled opacity-50",
     l
@@ -395,13 +395,13 @@ const er = {
   };
   return /* @__PURE__ */ c("a", { className: b, ...g, children: [
     o,
-    f && /* @__PURE__ */ e(kt, { className: "size-icon-sm shrink-0", "aria-hidden": !0 })
+    f && /* @__PURE__ */ e(St, { className: "size-icon-sm shrink-0", "aria-hidden": !0 })
   ] });
-}, nr = {
+}, ar = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-sm"
 };
-function sr({
+function lr({
   options: t,
   value: r,
   onChange: n,
@@ -438,7 +438,7 @@ function sr({
               "transition-colors duration-fast ease-out",
               "focus-visible:outline-none focus-visible:focus-ring",
               l && "min-w-0 flex-1",
-              nr[s],
+              ar[s],
               v ? "bg-surface text-text font-medium shadow-sm" : "text-text-muted hover:text-text"
             ),
             children: d.label
@@ -449,15 +449,15 @@ function sr({
     }
   );
 }
-const ar = {
+const or = {
   primary: "bg-accent text-accent-fg hover:bg-accent-hover",
   secondary: "border border-border bg-surface text-text hover:bg-surface-hover",
   outline: "border border-accent-border text-accent hover:bg-accent-soft"
-}, lr = {
+}, cr = {
   sm: "h-control-sm w-7",
   md: "h-control-md w-8"
 };
-function rt({
+function nt({
   label: t,
   onClick: r,
   variant: n = "primary",
@@ -489,7 +489,7 @@ function rt({
         }
       ),
       f && /* @__PURE__ */ e(
-        tt,
+        rt,
         {
           placement: d,
           disabled: m,
@@ -502,11 +502,11 @@ function rt({
               className: i(
                 "inline-flex items-center justify-center rounded-md rounded-l-none",
                 "transition-colors duration-fast ease-out",
-                ar[n],
-                lr[s],
+                or[n],
+                cr[s],
                 m && "cursor-not-allowed opacity-50"
               ),
-              children: /* @__PURE__ */ e(Ae, { className: "size-icon-md" })
+              children: /* @__PURE__ */ e(De, { className: "size-icon-md" })
             }
           ),
           children: (b) => /* @__PURE__ */ e(Ee, { children: l.map((g) => /* @__PURE__ */ c(
@@ -534,7 +534,7 @@ function rt({
     ] })
   );
 }
-const as = ({
+const os = ({
   commands: t,
   isOpen: r,
   onClose: n,
@@ -545,9 +545,9 @@ const as = ({
   const [o, u] = R(""), [d, v] = R(a || []), [m, f] = R(l || 0), b = ne(null), g = ne(null), p = (d.length ? t.find((h) => h.id === d[0])?.subCommands || [] : t).filter(
     (h) => h.label.toLowerCase().includes(o.toLowerCase())
   );
-  return X(() => {
+  return Z(() => {
     r || (u(""), v(a || []), f(l || 0));
-  }, [r]), X(() => {
+  }, [r]), Z(() => {
     const h = (C) => {
       if (r) {
         if (C.key === "Escape")
@@ -567,12 +567,12 @@ const as = ({
       }
     };
     return document.addEventListener("keydown", h), () => document.removeEventListener("keydown", h);
-  }, [r, n, p, m, d]), X(() => {
+  }, [r, n, p, m, d]), Z(() => {
     const h = (C) => {
       b.current && !b.current.contains(C.target) && n();
     };
     return r && document.addEventListener("mousedown", h), () => document.removeEventListener("mousedown", h);
-  }, [r, n]), X(() => {
+  }, [r, n]), Z(() => {
     if (!r) return;
     g.current?.querySelector(`[data-index="${m}"]`)?.scrollIntoView({ block: "nearest" });
   }, [m, r]), r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 z-modal flex items-center justify-center bg-scrim", children: /* @__PURE__ */ c(
@@ -639,7 +639,7 @@ const as = ({
       ]
     }
   ) }) : null;
-}, or = /<[a-z][\s\S]*>/i, cr = [
+}, ir = /<[a-z][\s\S]*>/i, dr = [
   "[&_p]:my-1.5 [&_p:first-child]:mt-0 [&_p:last-child]:mb-0 [&_p]:leading-relaxed",
   "[&_a]:text-accent [&_a]:underline [&_a]:underline-offset-2",
   "[&_strong]:font-semibold [&_em]:italic",
@@ -654,7 +654,7 @@ const as = ({
   "[&_table]:my-1.5 [&_table]:w-full [&_table]:border-collapse [&_table]:text-xs",
   "[&_th]:border [&_th]:border-border [&_th]:px-2 [&_th]:py-1 [&_th]:text-left [&_th]:font-semibold",
   "[&_td]:border [&_td]:border-border [&_td]:px-2 [&_td]:py-1"
-].join(" "), ir = {
+].join(" "), ur = {
   p: (t) => /* @__PURE__ */ e("p", { className: "my-1.5 leading-relaxed first:mt-0 last:mb-0", ...t }),
   a: (t) => /* @__PURE__ */ e(
     "a",
@@ -687,33 +687,33 @@ const as = ({
 };
 function Me({ text: t, className: r, as: n }) {
   const s = t ?? "";
-  return (n ? n === "html" : or.test(s)) ? /* @__PURE__ */ e(
+  return (n ? n === "html" : ir.test(s)) ? /* @__PURE__ */ e(
     "div",
     {
-      className: i("break-words", cr, r),
+      className: i("break-words", dr, r),
       dangerouslySetInnerHTML: {
-        __html: Ht.sanitize(s, { ADD_ATTR: ["target", "rel"] })
+        __html: qt.sanitize(s, { ADD_ATTR: ["target", "rel"] })
       }
     }
-  ) : /* @__PURE__ */ e("div", { className: i("break-words", r), children: /* @__PURE__ */ e(qt, { remarkPlugins: [Vt], components: ir, children: s }) });
+  ) : /* @__PURE__ */ e("div", { className: i("break-words", r), children: /* @__PURE__ */ e(Vt, { remarkPlugins: [Ut], components: ur, children: s }) });
 }
-const dr = {
+const mr = {
   info: "text-info-fg",
   success: "text-success-fg",
   warning: "text-warning-fg",
   destructive: "text-danger-fg"
-}, ur = {
+}, fr = {
   info: "bg-info-soft border-info-border",
   success: "bg-success-soft border-success-border",
   warning: "bg-warning-soft border-warning-border",
   destructive: "bg-danger-soft border-danger-border"
-}, mr = {
+}, hr = {
   1: "grid-cols-1",
   2: "grid-cols-2",
   3: "grid-cols-3",
   4: "grid-cols-4"
 };
-function fr({ block: t }) {
+function xr({ block: t }) {
   switch (t.type) {
     case "heading":
       return t.level === 1 ? /* @__PURE__ */ e("h1", { className: "text-2xl font-semibold tracking-tight text-text", children: t.text }) : t.level === 2 ? /* @__PURE__ */ e("h2", { className: "pt-2 text-base font-semibold tracking-tight text-text", children: t.text }) : /* @__PURE__ */ e("h3", { className: "pt-1 text-sm font-semibold text-text", children: t.text });
@@ -773,13 +773,13 @@ function fr({ block: t }) {
         t.caption && /* @__PURE__ */ e("figcaption", { className: "pt-2 text-xs italic text-text-subtle", children: t.caption })
       ] });
     case "kpi":
-      return /* @__PURE__ */ e("div", { className: i("grid gap-3", mr[t.items.length] ?? "grid-cols-4"), children: t.items.map((r, n) => /* @__PURE__ */ c("div", { className: "rounded-lg bg-surface-sunk px-4 py-3.5", children: [
+      return /* @__PURE__ */ e("div", { className: i("grid gap-3", hr[t.items.length] ?? "grid-cols-4"), children: t.items.map((r, n) => /* @__PURE__ */ c("div", { className: "rounded-lg bg-surface-sunk px-4 py-3.5", children: [
         /* @__PURE__ */ e(
           "div",
           {
             className: i(
               "text-2xl font-semibold tracking-tight",
-              r.tone ? dr[r.tone] : "text-text"
+              r.tone ? mr[r.tone] : "text-text"
             ),
             children: r.value
           }
@@ -787,7 +787,7 @@ function fr({ block: t }) {
         /* @__PURE__ */ e("div", { className: "pt-0.5 text-xs text-text-muted", children: r.label })
       ] }, n)) });
     case "callout":
-      return /* @__PURE__ */ c("div", { className: i("rounded-lg border px-4 py-3", ur[t.tone]), children: [
+      return /* @__PURE__ */ c("div", { className: i("rounded-lg border px-4 py-3", fr[t.tone]), children: [
         t.title && /* @__PURE__ */ e("div", { className: "pb-0.5 text-sm font-semibold text-text", children: t.title }),
         /* @__PURE__ */ e(Me, { as: "markdown", text: t.text, className: "text-sm text-text" })
       ] });
@@ -795,7 +795,7 @@ function fr({ block: t }) {
       return null;
   }
 }
-function ls({ blocks: t, runtime: r = "inert", className: n }) {
+function cs({ blocks: t, runtime: r = "inert", className: n }) {
   return r !== "inert" ? /* @__PURE__ */ c(
     "div",
     {
@@ -812,11 +812,11 @@ function ls({ blocks: t, runtime: r = "inert", className: n }) {
         ] })
       ]
     }
-  ) : /* @__PURE__ */ e("article", { className: i("flex flex-col gap-4", n), children: t.map((s, a) => /* @__PURE__ */ e(fr, { block: s }, s.block_id ?? a)) });
+  ) : /* @__PURE__ */ e("article", { className: i("flex flex-col gap-4", n), children: t.map((s, a) => /* @__PURE__ */ e(xr, { block: s }, s.block_id ?? a)) });
 }
-function os({
+function is({
   title: t,
-  icon: r = /* @__PURE__ */ e(Ct, { className: "size-icon-md", "aria-hidden": !0 }),
+  icon: r = /* @__PURE__ */ e(Et, { className: "size-icon-md", "aria-hidden": !0 }),
   action: n,
   children: s,
   className: a,
@@ -842,53 +842,53 @@ function os({
     }
   );
 }
-const hr = 5;
-function xr(t) {
+const br = 5;
+function gr(t) {
   let r = 2166136261;
   for (let n = 0; n < t.length; n++)
     r ^= t.charCodeAt(n), r = Math.imul(r, 16777619);
   return r >>> 0;
 }
-function nt(t) {
+function st(t) {
   const r = (t ?? "").trim().toLowerCase();
-  return r ? xr(r) % hr + 1 : 1;
+  return r ? gr(r) % br + 1 : 1;
 }
-const br = {
+const pr = {
   1: "bg-cat-1-soft text-cat-1-fg",
   2: "bg-cat-2-soft text-cat-2-fg",
   3: "bg-cat-3-soft text-cat-3-fg",
   4: "bg-cat-4-soft text-cat-4-fg",
   5: "bg-cat-5-soft text-cat-5-fg"
-}, gr = {
+}, vr = {
   1: "bg-cat-1",
   2: "bg-cat-2",
   3: "bg-cat-3",
   4: "bg-cat-4",
   5: "bg-cat-5"
 };
-function st(t) {
-  return br[nt(t)];
+function at(t) {
+  return pr[st(t)];
 }
-function cs(t) {
-  return gr[nt(t)];
+function ds(t) {
+  return vr[st(t)];
 }
-const pr = {
+const yr = {
   default: "bg-avatar text-avatar-fg",
   in: "bg-avatar-in text-avatar-in-fg",
   out: "bg-accent text-accent-fg",
   note: "bg-avatar-note text-avatar-note-fg"
-}, vr = {
+}, Nr = {
   xs: "w-5 h-5 text-xs",
   sm: "w-6 h-6 text-xs",
   md: "w-7 h-7 text-base",
   lg: "w-9 h-9 text-sm"
 };
-function yr(t) {
+function wr(t) {
   if (!t) return "?";
   const r = t.trim().split(/[^\p{L}\p{N}]+/u).filter(Boolean);
   return r.length >= 2 ? (r[0][0] + r[1][0]).toUpperCase() : r.length === 1 ? r[0].slice(0, 2).toUpperCase() : "?";
 }
-const Nr = ({
+const lt = ({
   name: t,
   src: r,
   tone: n = "default",
@@ -903,8 +903,8 @@ const Nr = ({
     "inline-flex items-center justify-center rounded-full overflow-hidden shrink-0 font-semibold select-none",
     // `identity` is seeded on the name, so the same person keeps their colour
     // wherever they appear; the fixed tones stay as they were.
-    n === "identity" ? st(t) : pr[n],
-    vr[s],
+    n === "identity" ? at(t) : yr[n],
+    Nr[s],
     a
   );
   return r && !o ? /* @__PURE__ */ e(
@@ -916,8 +916,8 @@ const Nr = ({
       className: i(d, "object-cover"),
       onError: () => u(!0)
     }
-  ) : /* @__PURE__ */ e("span", { className: d, title: l ?? t, "aria-label": t, children: yr(t) });
-}, Ge = "ring-surface", wr = "ring-surface-accent", is = ({
+  ) : /* @__PURE__ */ e("span", { className: d, title: l ?? t, "aria-label": t, children: wr(t) });
+}, Ge = "ring-surface", kr = "ring-surface-accent", us = ({
   people: t,
   max: r = 4,
   size: n = "sm",
@@ -927,7 +927,7 @@ const Nr = ({
   const a = t.slice(0, r), l = t.length - a.length;
   return /* @__PURE__ */ c("span", { className: i("inline-flex items-center", s), children: [
     a.map((o, u) => /* @__PURE__ */ e(
-      Nr,
+      lt,
       {
         name: o.name,
         src: o.src,
@@ -935,7 +935,7 @@ const Nr = ({
         title: o.name ? o.seen === !1 ? `${o.name} — nog niet gelezen` : o.name : void 0,
         className: i(
           u > 0 && "-ml-2",
-          o.owner ? wr : Ge,
+          o.owner ? kr : Ge,
           o.seen === !1 && "opacity-40"
         )
       },
@@ -958,18 +958,126 @@ const Nr = ({
       }
     )
   ] });
-}, Te = {
+}, Cr = {
+  neutral: "bg-surface-sunk",
+  out: "bg-bubble-out-soft",
+  note: "bg-note-soft",
+  assistant: "bg-assistant-soft"
+}, Sr = {
+  neutral: "text-text",
+  out: "text-text",
+  note: "text-note",
+  assistant: "text-text"
+};
+function ms({
+  avatar: t,
+  title: r,
+  context: n,
+  meta: s,
+  time: a,
+  tone: l = "neutral",
+  actions: o,
+  below: u,
+  children: d
+}) {
+  return /* @__PURE__ */ c("div", { className: "flex min-w-0 flex-col gap-2", children: [
+    /* @__PURE__ */ c("div", { className: "flex min-w-0 items-start gap-3.5", children: [
+      /* @__PURE__ */ e("span", { className: "mt-0.5 shrink-0", children: t }),
+      /* @__PURE__ */ c(
+        "div",
+        {
+          className: i("min-w-0 flex-1 overflow-hidden rounded-lg px-4 py-3.5", Cr[l]),
+          children: [
+            /* @__PURE__ */ c("div", { className: "flex items-baseline gap-2", children: [
+              /* @__PURE__ */ e(
+                "span",
+                {
+                  className: i(
+                    "min-w-0 truncate text-md font-semibold",
+                    !n && "flex-1",
+                    Sr[l]
+                  ),
+                  children: r
+                }
+              ),
+              n && /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate text-xs text-text-muted", children: n }),
+              (s || a) && /* @__PURE__ */ c("span", { className: "ml-auto flex shrink-0 items-center gap-1.5", children: [
+                s,
+                a && /* @__PURE__ */ e("span", { className: "text-xs tabular-nums text-text-subtle", children: a })
+              ] })
+            ] }),
+            d && /* @__PURE__ */ e("div", { className: "pt-2", children: d }),
+            o && /* @__PURE__ */ e("div", { className: "-ml-2.5 flex flex-wrap items-center gap-0.5 pt-2.5", children: o })
+          ]
+        }
+      )
+    ] }),
+    u
+  ] });
+}
+const fs = "hover:bg-surface-track";
+function hs({
+  name: t,
+  src: r,
+  tone: n = "in"
+}) {
+  return /* @__PURE__ */ e(lt, { name: t, src: r, tone: n, size: "sm" });
+}
+function xs({
+  icon: t,
+  tone: r = "neutral",
+  title: n
+}) {
+  return /* @__PURE__ */ e(
+    "span",
+    {
+      title: n,
+      className: i(
+        "grid size-avatar-md shrink-0 place-items-center rounded-full",
+        r === "assistant" ? "bg-assistant-soft text-assistant" : "bg-surface-track text-text-muted"
+      ),
+      children: /* @__PURE__ */ e(J, { icon: t, size: "sm", color: "current" })
+    }
+  );
+}
+function bs({ children: t, className: r }) {
+  return /* @__PURE__ */ e("div", { className: i("flex items-center gap-2.5 rounded-md bg-surface px-3 py-2.5", r), children: t });
+}
+function gs({ icon: t, text: r, time: n, joinUrl: s, joinLabel: a }) {
+  const l = Jt(t);
+  return /* @__PURE__ */ c("div", { className: "flex items-center gap-2 py-1.5 pl-10.5 text-xs text-text-subtle", children: [
+    l && /* @__PURE__ */ e(J, { icon: l, size: "sm", color: "current" }),
+    /* @__PURE__ */ e("span", { className: "min-w-0 truncate", children: r }),
+    /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "shrink-0 text-text-disabled", children: "·" }),
+    /* @__PURE__ */ e("span", { className: "shrink-0 tabular-nums", children: n }),
+    s && /* @__PURE__ */ c(
+      "a",
+      {
+        href: s,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "shrink-0 text-xs font-medium text-info-fg hover:underline",
+        children: [
+          a ?? "Join",
+          " ",
+          /* @__PURE__ */ e(J, { icon: tt, size: "xs" })
+        ]
+      }
+    )
+  ] });
+}
+const Te = {
   mail: { fg: "text-channel-mail-fg", bg: "bg-channel-mail-soft" },
   wa: { fg: "text-channel-whatsapp-fg", bg: "bg-channel-whatsapp-soft" },
   chat: { fg: "text-channel-chat-fg", bg: "bg-channel-chat-soft" },
   tel: { fg: "text-channel-phone-fg", bg: "bg-channel-phone-soft" },
   note: { fg: "text-channel-note-fg", bg: "bg-channel-note-soft" }
-}, kr = {
+}, Er = {
   sm: "size-avatar-xs rounded-sm text-xs",
   md: "size-avatar-sm rounded-md text-xs",
   lg: "size-avatar-lg rounded-md text-base"
 };
-function ds({
+function ps({
   channel: t,
   children: r,
   size: n = "md",
@@ -983,18 +1091,18 @@ function ds({
       title: a,
       className: i(
         "inline-flex shrink-0 items-center justify-center font-bold",
-        kr[n],
+        Er[n],
         // An undeclared channel used to collapse onto the neutral "note" tone,
         // which is also what a real internal note looks like. Deriving from the
         // key keeps it distinguishable and keeps `note` meaning `note`.
-        l ? i(l.fg, l.bg) : t ? st(t) : i(Te.note.fg, Te.note.bg),
+        l ? i(l.fg, l.bg) : t ? at(t) : i(Te.note.fg, Te.note.bg),
         s
       ),
       children: r
     }
   );
 }
-const us = ({
+const vs = ({
   src: t,
   alt: r,
   size: n = "md",
@@ -1010,14 +1118,14 @@ const us = ({
   onError: b,
   ...g
 }) => {
-  const [w, p] = R(!0), [h, C] = R(!1), [z, P] = R(t), _ = (J) => {
-    p(!1), C(!1), f?.(J);
-  }, K = (J) => {
+  const [w, p] = R(!0), [h, C] = R(!1), [z, P] = R(t), _ = (Y) => {
+    p(!1), C(!1), f?.(Y);
+  }, K = (Y) => {
     if (p(!1), C(!0), u && z !== u) {
       P(u), C(!1), p(!0);
       return;
     }
-    b?.(J);
+    b?.(Y);
   }, U = i(
     "relative overflow-hidden bg-surface-hover",
     // Size variants
@@ -1052,8 +1160,8 @@ const us = ({
   }), B = i(
     "absolute inset-0 flex items-center justify-center",
     "text-text-muted"
-  ), W = /* @__PURE__ */ e("div", { className: "animate-pulse", children: /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-surface-hover rounded" }) }), Z = /* @__PURE__ */ c("div", { className: "text-center", children: [
-    /* @__PURE__ */ e(ee, { icon: St, size: "lg", className: "mx-auto mb-1" }),
+  ), W = /* @__PURE__ */ e("div", { className: "animate-pulse", children: /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-surface-hover rounded" }) }), Q = /* @__PURE__ */ c("div", { className: "text-center", children: [
+    /* @__PURE__ */ e(J, { icon: zt, size: "lg", className: "mx-auto mb-1" }),
     /* @__PURE__ */ e("span", { className: "text-xs", children: "Failed to load" })
   ] });
   return /* @__PURE__ */ c("div", { className: U, children: [
@@ -1069,30 +1177,30 @@ const us = ({
       }
     ),
     w && l && /* @__PURE__ */ e("div", { className: B, children: d || W }),
-    h && o && /* @__PURE__ */ e("div", { className: B, children: v || Z })
+    h && o && /* @__PURE__ */ e("div", { className: B, children: v || Q })
   ] });
-}, Cr = {
+}, zr = {
   default: "text-text",
   urgent: "text-danger-fg",
   success: "text-success-fg"
 };
-function ms({ value: t, label: r, tone: n = "default", className: s, ...a }) {
+function ys({ value: t, label: r, tone: n = "default", className: s, ...a }) {
   return /* @__PURE__ */ c("div", { className: i("rounded-xl bg-editor px-4 py-3.5", s), ...a, children: [
-    /* @__PURE__ */ e("div", { className: i("text-2xl font-semibold", Cr[n]), children: t }),
+    /* @__PURE__ */ e("div", { className: i("text-2xl font-semibold", zr[n]), children: t }),
     /* @__PURE__ */ e("div", { className: "pt-0.5 text-xs text-text-muted", children: r })
   ] });
 }
-const Sr = {
+const Mr = {
   sm: "size-checkbox-sm",
   md: "size-checkbox",
   lg: "size-checkbox-lg",
   full: "size-checkbox"
-}, Er = {
+}, Tr = {
   sm: "min-h-control-sm",
   md: "min-h-control-md",
   lg: "min-h-control-lg",
   full: "min-h-control-md"
-}, zr = {
+}, Ar = {
   sm: "text-sm",
   md: "text-base",
   lg: "text-md",
@@ -1119,7 +1227,7 @@ const Sr = {
     return ae.useEffect(() => {
       w.current && (w.current.indeterminate = a);
     }, [a]), /* @__PURE__ */ c("div", { className: i("flex flex-col", l), children: [
-      /* @__PURE__ */ c("div", { className: i("flex items-center gap-3", Er[s]), children: [
+      /* @__PURE__ */ c("div", { className: i("flex items-center gap-3", Tr[s]), children: [
         /* @__PURE__ */ e(
           "input",
           {
@@ -1136,7 +1244,7 @@ const Sr = {
               "transition-colors duration-fast ease-out",
               "focus-visible:outline-none focus-visible:focus-ring",
               "disabled:cursor-not-allowed disabled:bg-surface-hover",
-              Sr[s],
+              Mr[s],
               g ? "border-danger-border" : "border-border-strong",
               u
             ),
@@ -1151,7 +1259,7 @@ const Sr = {
               className: i(
                 "cursor-pointer",
                 g ? "text-danger-fg" : "text-text",
-                zr[s],
+                Ar[s],
                 o
               ),
               children: t
@@ -1165,7 +1273,7 @@ const Sr = {
   }
 );
 we.displayName = "Checkbox";
-function fs({
+function Ns({
   icon: t,
   onClick: r,
   children: n
@@ -1188,7 +1296,7 @@ function fs({
     }
   );
 }
-function hs({
+function ws({
   items: t,
   getRowKey: r,
   variant: n = "divided",
@@ -1215,11 +1323,11 @@ function hs({
   bordered: j = !1,
   emptyContent: B,
   loading: W = !1,
-  loadingRows: Z = 4,
-  className: J,
+  loadingRows: Q = 4,
+  className: Y,
   "aria-label": de
 }) {
-  const [Y, y] = ae.useState(
+  const [X, y] = ae.useState(
     () => Object.fromEntries((b ?? []).filter((k) => k.defaultCollapsed).map((k) => [k.id, !0]))
   ), x = ae.useRef(null), S = (k) => {
     if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(k.key)) return;
@@ -1230,9 +1338,9 @@ function hs({
     k.preventDefault();
     const O = G.indexOf(document.activeElement), N = k.key === "Home" ? 0 : k.key === "End" ? G.length - 1 : k.key === "ArrowDown" ? (O + 1) % G.length : (O - 1 + G.length) % G.length;
     G[N]?.focus();
-  }, D = (k, M) => r ? r(k, M) : M, E = (k) => z.includes(k), A = (k, M) => {
+  }, $ = (k, M) => r ? r(k, M) : M, E = (k) => z.includes(k), D = (k, M) => {
     P && P(M ? [...z, k] : z.filter((G) => G !== k));
-  }, $ = (k) => P?.(k ? [...t] : []), oe = i(
+  }, A = (k) => P?.(k ? [...t] : []), oe = i(
     "flex flex-col",
     // With a selection open the list has a dock at its foot. Sticky can only
     // park at the bottom of its own box, so on a list shorter than the window
@@ -1242,10 +1350,10 @@ function hs({
     // keeps its natural height.
     C && z.length > 0 && "min-h-full",
     j && "overflow-hidden rounded-lg border border-border-subtle",
-    J
+    Y
   );
   if (W)
-    return /* @__PURE__ */ e("div", { className: oe, children: Array.from({ length: Z }).map((k, M) => /* @__PURE__ */ c(
+    return /* @__PURE__ */ e("div", { className: oe, children: Array.from({ length: Q }).map((k, M) => /* @__PURE__ */ c(
       "div",
       {
         className: i(
@@ -1299,7 +1407,7 @@ function hs({
             we,
             {
               checked: E(k),
-              onChange: (le) => A(k, le.target.checked),
+              onChange: (le) => D(k, le.target.checked),
               "aria-label": "Rij selecteren"
             }
           ) }),
@@ -1315,7 +1423,7 @@ function hs({
           l && /* @__PURE__ */ e("span", { className: "shrink-0 text-xs text-text-subtle", children: l(k, M) })
         ]
       },
-      D(k, M)
+      $(k, M)
     );
   }, L = (() => {
     if (!f)
@@ -1330,7 +1438,7 @@ function hs({
       ...M.filter((O) => k.has(O.id)),
       ...[...k.keys()].filter((O) => !M.some((N) => N.id === O)).map((O) => ({ id: O }))
     ].flatMap((O, N) => {
-      const I = k.get(O.id) ?? [], te = p && Y[O.id], le = O.title ?? O.id, be = O.count ?? I.length, ye = /* @__PURE__ */ e(
+      const I = k.get(O.id) ?? [], te = p && X[O.id], le = O.title ?? O.id, be = O.count ?? I.length, ye = /* @__PURE__ */ e(
         "li",
         {
           onClick: p ? () => y((fe) => ({ ...fe, [O.id]: !fe[O.id] })) : void 0,
@@ -1398,7 +1506,7 @@ function hs({
             {
               checked: ce,
               indeterminate: q,
-              onChange: (k) => $(k.target.checked),
+              onChange: (k) => A(k.target.checked),
               "aria-label": "Alles selecteren"
             }
           ) }),
@@ -1428,7 +1536,7 @@ function hs({
     ] }) })
   ] });
 }
-function xs({
+function ks({
   side: t,
   continued: r = !1,
   tone: n = "default",
@@ -1461,7 +1569,7 @@ function xs({
     }
   );
 }
-function bs({ icon: t, label: r, unset: n, className: s }) {
+function Cs({ icon: t, label: r, unset: n, className: s }) {
   return /* @__PURE__ */ c(
     "span",
     {
@@ -1477,11 +1585,11 @@ function bs({ icon: t, label: r, unset: n, className: s }) {
     }
   );
 }
-function gs() {
+function Ss() {
   return /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "shrink-0 text-text-disabled", children: "·" });
 }
 const me = ({ className: t }) => /* @__PURE__ */ e("span", { className: i("block rounded-xs bg-surface-hover", t) });
-function Mr({
+function _r({
   shape: t,
   rows: r,
   columns: n
@@ -1549,7 +1657,7 @@ function Mr({
       ] });
   }
 }
-const Tr = {
+const $r = {
   text: 2,
   table: 8,
   list: 6,
@@ -1568,10 +1676,10 @@ function qe({
   tableColumns: u,
   tableRows: d
 }) {
-  const v = r ?? (o ? "table" : "text"), m = n ?? d ?? Tr[v], f = s ?? u ?? (v === "cards" ? 3 : 6), b = /* @__PURE__ */ e("div", { className: i("w-full animate-pulse", l), "aria-hidden": !0, children: a ?? /* @__PURE__ */ e(Mr, { shape: v, rows: m, columns: f }) });
+  const v = r ?? (o ? "table" : "text"), m = n ?? d ?? $r[v], f = s ?? u ?? (v === "cards" ? 3 : 6), b = /* @__PURE__ */ e("div", { className: i("w-full animate-pulse", l), "aria-hidden": !0, children: a ?? /* @__PURE__ */ e(_r, { shape: v, rows: m, columns: f }) });
   return t === "inline" ? b : /* @__PURE__ */ e("main", { className: "flex-1 bg-surface p-6", children: b });
 }
-const $r = ({
+const Dr = ({
   surface: t = !1,
   title: r,
   subtitle: n,
@@ -1586,9 +1694,9 @@ const $r = ({
   onTitleChange: f
 }) => {
   const [b, g] = R(!1), [w, p] = R(r), h = ne(null);
-  X(() => {
+  Z(() => {
     p(r);
-  }, [r]), X(() => {
+  }, [r]), Z(() => {
     b && h.current && (h.current.focus(), h.current.select());
   }, [b]);
   const C = () => {
@@ -1620,7 +1728,7 @@ const $r = ({
               {
                 variant: "ghost",
                 onClick: v,
-                leftIcon: /* @__PURE__ */ e(ee, { icon: ze, size: "md" }),
+                leftIcon: /* @__PURE__ */ e(J, { icon: ze, size: "md" }),
                 iconOnly: !0
               }
             ),
@@ -1651,7 +1759,7 @@ const $r = ({
                 ),
                 n && /* @__PURE__ */ e("span", { className: "shrink-0 text-base text-text-muted truncate", children: n }),
                 m && /* @__PURE__ */ e(
-                  Et,
+                  Mt,
                   {
                     size: 15,
                     onClick: C,
@@ -1677,7 +1785,7 @@ const $r = ({
           ] }) }),
           a.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-wrap sm:flex-nowrap gap-2 sm:gap-3", children: a.map(
             (_) => _.render ? /* @__PURE__ */ e(ae.Fragment, { children: _.render() }, _.id) : _.splitOptions && _.splitOptions.length > 0 ? /* @__PURE__ */ e(
-              rt,
+              nt,
               {
                 label: _.label,
                 onClick: _.onClick,
@@ -1706,11 +1814,11 @@ const $r = ({
       ]
     }
   );
-}, _r = {
+}, Lr = {
   none: "",
   sm: "px-3 pb-3 pt-1",
   md: "px-5 pb-5 pt-1.5"
-}, ps = ({
+}, Es = ({
   title: t,
   subtitle: r,
   meta: n,
@@ -1743,7 +1851,7 @@ const $r = ({
       ),
       children: [
         /* @__PURE__ */ e(
-          $r,
+          Dr,
           {
             surface: u,
             title: t,
@@ -1762,7 +1870,7 @@ const $r = ({
           {
             className: i(
               g && "min-h-0 flex-1 overflow-y-auto",
-              _r[b],
+              Lr[b],
               p
             ),
             children: C
@@ -1777,7 +1885,7 @@ const $r = ({
   className: n
 }) => t.length === 0 ? null : /* @__PURE__ */ e("div", { className: i("flex flex-wrap items-center gap-2", n), children: t.map(
   (s) => s.render ? /* @__PURE__ */ e(ae.Fragment, { children: s.render() }, s.id) : s.splitOptions && s.splitOptions.length > 0 ? /* @__PURE__ */ e(
-    rt,
+    nt,
     {
       label: s.label,
       onClick: s.onClick,
@@ -1800,32 +1908,32 @@ const $r = ({
     },
     s.id
   )
-) }), Dr = {
+) }), Ir = {
   none: "p-0",
   sm: "p-2",
   md: "px-5 py-4",
   lg: "p-6"
-}, vs = ({
+}, zs = ({
   actions: t = [],
   onBack: r,
   backLabel: n = "Back",
   className: s,
   padding: a = "md",
   children: l
-}) => /* @__PURE__ */ c("div", { className: i("flex items-center gap-2", Dr[a], s), children: [
+}) => /* @__PURE__ */ c("div", { className: i("flex items-center gap-2", Ir[a], s), children: [
   r && /* @__PURE__ */ e(
     se,
     {
       variant: "secondary",
       onClick: r,
       "aria-label": n,
-      leftIcon: /* @__PURE__ */ e(ee, { icon: ze, size: "sm" }),
+      leftIcon: /* @__PURE__ */ e(J, { icon: ze, size: "sm" }),
       iconOnly: !0
     }
   ),
   l && /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: l }),
   /* @__PURE__ */ e(ke, { actions: t, className: i(!l && "ml-auto") })
-] }), ys = ({
+] }), Ms = ({
   label: t,
   meta: r,
   action: n,
@@ -1835,7 +1943,7 @@ const $r = ({
   r && /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate text-right text-xs tabular-nums text-text-subtle", children: r }),
   n && /* @__PURE__ */ e("span", { className: "ml-auto shrink-0", children: n })
 ] });
-function Ns({
+function Ts({
   label: t,
   trailing: r,
   align: n = "center",
@@ -1849,11 +1957,11 @@ function Ns({
     r && /* @__PURE__ */ e("span", { className: "shrink-0", children: r })
   ] });
 }
-const at = et(null), ws = at.Provider;
-function Ar() {
-  return vt(at);
+const ot = et(null), As = ot.Provider;
+function Pr() {
+  return Nt(ot);
 }
-function ks() {
+function _s() {
   const [t, r] = R(null), n = pe(
     () => ({
       setTrail: (s, a) => r((l) => a ? { ownerId: s, entry: a } : l && l.ownerId !== s ? l : null)
@@ -1862,13 +1970,13 @@ function ks() {
   );
   return { trail: t?.entry ?? null, api: n };
 }
-const Lr = {
+const Or = {
   none: "",
   sm: "px-3 py-3",
   // Matches the frame header's own horizontal padding, so content lines up
   // with the title above it.
   md: "px-5 py-4"
-}, Cs = ({
+}, $s = ({
   children: t,
   actions: r = [],
   secondaryActions: n = [],
@@ -1882,7 +1990,7 @@ const Lr = {
   className: m,
   contentClassName: f
 }) => {
-  const b = Ar(), g = pt(), w = ne(a);
+  const b = Pr(), g = yt(), w = ne(a);
   w.current = a;
   const p = !!a, h = ne(r);
   h.current = r;
@@ -1892,10 +2000,10 @@ const Lr = {
     [...n, ...r].map((j) => [j.id, j.label, j.variant, j.disabled])
   ) : "", K = pe(() => {
     if (!P) return;
-    const j = (B) => (W, Z) => ({
+    const j = (B) => (W, Q) => ({
       ...W,
       onClick: () => {
-        (B === "primary" ? h.current : C.current)[Z]?.onClick();
+        (B === "primary" ? h.current : C.current)[Q]?.onClick();
       }
     });
     return {
@@ -1903,7 +2011,7 @@ const Lr = {
       secondaryActions: C.current.map(j("secondary"))
     };
   }, [P, _]);
-  X(() => {
+  Z(() => {
     if (b && !(!p && !o && !K))
       return b.setTrail(g, {
         title: o,
@@ -1928,7 +2036,7 @@ const Lr = {
             variant: "ghost",
             onClick: () => w.current?.(),
             "aria-label": l,
-            leftIcon: /* @__PURE__ */ e(ee, { icon: ze, size: "sm" }),
+            leftIcon: /* @__PURE__ */ e(J, { icon: ze, size: "sm" }),
             iconOnly: !0
           }
         ),
@@ -1938,7 +2046,7 @@ const Lr = {
           r.length > 0 && /* @__PURE__ */ e(ke, { actions: r })
         ] })
       ] }),
-      /* @__PURE__ */ e("div", { className: i("flex-1", Lr[v], f), children: u ? /* @__PURE__ */ e(qe, { variant: "inline", shape: d }) : t }),
+      /* @__PURE__ */ e("div", { className: i("flex-1", Or[v], f), children: u ? /* @__PURE__ */ e(qe, { variant: "inline", shape: d }) : t }),
       U && /* @__PURE__ */ c("div", { className: "sticky bottom-0 z-10 flex shrink-0 items-center gap-2 border-t border-border bg-surface px-5 py-3", children: [
         n.length > 0 && /* @__PURE__ */ e(ke, { actions: n, defaultVariant: "ghost" }),
         r.length > 0 && /* @__PURE__ */ e(ke, { actions: r, className: "ml-auto" })
@@ -1946,7 +2054,7 @@ const Lr = {
     ] })
   );
 };
-function Ss({
+function Ds({
   label: t,
   description: r,
   control: n,
@@ -1973,7 +2081,7 @@ function Ss({
     }
   );
 }
-function Es({
+function Ls({
   icon: t,
   title: r,
   description: n,
@@ -1983,7 +2091,7 @@ function Es({
 }) {
   return /* @__PURE__ */ c("section", { className: i("flex flex-col gap-2", l), children: [
     /* @__PURE__ */ c("div", { className: "flex items-start gap-2", children: [
-      t && /* @__PURE__ */ e(ee, { icon: t, size: "md", color: "secondary", className: "mt-0.5" }),
+      t && /* @__PURE__ */ e(J, { icon: t, size: "md", color: "secondary", className: "mt-0.5" }),
       /* @__PURE__ */ c("div", { className: "min-w-0 flex-1", children: [
         /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-text", children: r }),
         n && /* @__PURE__ */ e("p", { className: "text-xs text-text-muted", children: n })
@@ -1993,7 +2101,7 @@ function Es({
     /* @__PURE__ */ e("div", { className: i("flex flex-col", t && "pl-6"), children: a })
   ] });
 }
-function zs({ label: t, dotColor: r, onClick: n, className: s }) {
+function Is({ label: t, dotColor: r, onClick: n, className: s }) {
   return /* @__PURE__ */ c(
     "button",
     {
@@ -2013,12 +2121,12 @@ function zs({ label: t, dotColor: r, onClick: n, className: s }) {
           }
         ),
         /* @__PURE__ */ e("span", { className: "min-w-0 truncate", children: t }),
-        /* @__PURE__ */ e(ee, { icon: zt, size: "xs", className: "opacity-70" })
+        /* @__PURE__ */ e(J, { icon: tt, size: "xs", className: "opacity-70" })
       ]
     }
   );
 }
-const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current" }), Pr = () => /* @__PURE__ */ e(ee, { icon: ze, size: "md", color: "current" }), Or = () => /* @__PURE__ */ e(ee, { icon: Ie, size: "md", color: "current" }), Be = ve(
+const jr = () => /* @__PURE__ */ e(J, { icon: Tt, size: "md", color: "current" }), Fr = () => /* @__PURE__ */ e(J, { icon: ze, size: "md", color: "current" }), Rr = () => /* @__PURE__ */ e(J, { icon: Ie, size: "md", color: "current" }), Be = ve(
   ({
     value: t,
     onChange: r,
@@ -2033,7 +2141,7 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
     withTime: m = !1
   }, f) => {
     const [b, g] = R(!1), [w, p] = R(() => t || /* @__PURE__ */ new Date()), h = ne(null), C = ne(null), z = Pe(b, C);
-    X(() => {
+    Z(() => {
       const y = (x) => {
         h.current && !h.current.contains(x.target) && g(!1);
       };
@@ -2043,19 +2151,19 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
     }, [b]);
     const P = (y) => {
       if (!y) return "";
-      const x = y.getDate().toString().padStart(2, "0"), S = (y.getMonth() + 1).toString().padStart(2, "0"), D = y.getFullYear(), E = v === "dd/MM/yyyy" ? `${x}/${S}/${D}` : v === "yyyy-MM-dd" ? `${D}-${S}-${x}` : `${S}/${x}/${D}`;
+      const x = y.getDate().toString().padStart(2, "0"), S = (y.getMonth() + 1).toString().padStart(2, "0"), $ = y.getFullYear(), E = v === "dd/MM/yyyy" ? `${x}/${S}/${$}` : v === "yyyy-MM-dd" ? `${$}-${S}-${x}` : `${S}/${x}/${$}`;
       return m ? `${E} ${_(y)}` : E;
     }, _ = (y) => `${y.getHours().toString().padStart(2, "0")}:${y.getMinutes().toString().padStart(2, "0")}`, K = (y) => {
       const [x, S] = y.split(":").map(Number);
       if (Number.isNaN(x) || Number.isNaN(S)) return;
-      const D = t ? new Date(t) : /* @__PURE__ */ new Date();
-      D.setHours(x, S, 0, 0), r?.(D);
+      const $ = t ? new Date(t) : /* @__PURE__ */ new Date();
+      $.setHours(x, S, 0, 0), r?.($);
     }, U = () => {
-      const y = w.getFullYear(), x = w.getMonth(), S = new Date(y, x, 1), D = new Date(S);
-      D.setDate(D.getDate() - S.getDay());
-      const E = [], A = new Date(D);
-      for (let $ = 0; $ < 42; $++)
-        E.push(new Date(A)), A.setDate(A.getDate() + 1);
+      const y = w.getFullYear(), x = w.getMonth(), S = new Date(y, x, 1), $ = new Date(S);
+      $.setDate($.getDate() - S.getDay());
+      const E = [], D = new Date($);
+      for (let A = 0; A < 42; A++)
+        E.push(new Date(D)), D.setDate(D.getDate() + 1);
       return E;
     }, j = (y) => {
       if (y.getMonth() === w.getMonth() && !(u && y < u) && !(d && y > d)) {
@@ -2070,9 +2178,9 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
       p(new Date(w.getFullYear(), w.getMonth() - 1, 1));
     }, W = () => {
       p(new Date(w.getFullYear(), w.getMonth() + 1, 1));
-    }, Z = () => {
+    }, Q = () => {
       r?.(null), g(!1);
-    }, J = i(
+    }, Y = i(
       "w-full border border-border-strong rounded-tile transition-colors duration-fast",
       "bg-surface text-text",
       "placeholder:text-text-muted",
@@ -2085,7 +2193,7 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
         "h-control-md w-full px-3 text-base": l === "full"
       },
       o
-    ), de = U(), Y = [
+    ), de = U(), X = [
       "January",
       "February",
       "March",
@@ -2112,7 +2220,7 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
             required: a,
             readOnly: !0,
             onClick: () => !s && g(!b),
-            className: i(J, "pr-10 cursor-pointer")
+            className: i(Y, "pr-10 cursor-pointer")
           }
         ),
         /* @__PURE__ */ e(
@@ -2122,7 +2230,7 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
             onClick: () => !s && g(!b),
             disabled: s,
             className: "absolute inset-y-0 right-0 flex items-center pr-3 text-text-muted hover:text-text-muted",
-            children: /* @__PURE__ */ e(Ir, {})
+            children: /* @__PURE__ */ e(jr, {})
           }
         )
       ] }),
@@ -2133,27 +2241,27 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
           className: "fixed z-overlay overflow-auto rounded-lg border border-border bg-surface p-4 shadow-overlay min-w-panel",
           children: [
             /* @__PURE__ */ c("div", { className: "flex items-center justify-between mb-4", children: [
-              /* @__PURE__ */ e("button", { onClick: B, className: "p-1 hover:bg-surface-hover rounded", children: /* @__PURE__ */ e(Pr, {}) }),
+              /* @__PURE__ */ e("button", { onClick: B, className: "p-1 hover:bg-surface-hover rounded", children: /* @__PURE__ */ e(Fr, {}) }),
               /* @__PURE__ */ c("h3", { className: "text-sm font-medium text-text", children: [
-                Y[w.getMonth()],
+                X[w.getMonth()],
                 " ",
                 w.getFullYear()
               ] }),
-              /* @__PURE__ */ e("button", { onClick: W, className: "p-1 hover:bg-surface-hover rounded", children: /* @__PURE__ */ e(Or, {}) })
+              /* @__PURE__ */ e("button", { onClick: W, className: "p-1 hover:bg-surface-hover rounded", children: /* @__PURE__ */ e(Rr, {}) })
             ] }),
             /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1 mb-2", children: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((y) => /* @__PURE__ */ e("div", { className: "text-xs font-medium text-text-muted text-center py-1", children: y }, y)) }),
             /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1", children: de.map((y, x) => {
-              const S = y.getMonth() === w.getMonth(), D = t && y.toDateString() === t.toDateString(), E = y.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), A = !S || u && y < u || d && y > d;
+              const S = y.getMonth() === w.getMonth(), $ = t && y.toDateString() === t.toDateString(), E = y.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), D = !S || u && y < u || d && y > d;
               return /* @__PURE__ */ e(
                 "button",
                 {
-                  onClick: () => !A && j(y),
-                  disabled: A,
+                  onClick: () => !D && j(y),
+                  disabled: D,
                   className: i("w-8 h-8 text-sm rounded transition-colors duration-fast", {
-                    "text-text hover:bg-surface-hover": S && !D && !A,
-                    "bg-accent text-accent-fg": D,
-                    "bg-surface-hover text-text": E && !D,
-                    "text-text-muted cursor-not-allowed": A
+                    "text-text hover:bg-surface-hover": S && !$ && !D,
+                    "bg-accent text-accent-fg": $,
+                    "bg-surface-hover text-text": E && !$,
+                    "text-text-muted cursor-not-allowed": D
                   }),
                   children: y.getDate()
                 },
@@ -2174,7 +2282,7 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
               )
             ] }),
             /* @__PURE__ */ c("div", { className: "flex justify-between items-center mt-4 pt-3 border-t border-border", children: [
-              /* @__PURE__ */ e("button", { onClick: Z, className: "text-sm text-text-muted hover:text-text", children: "Clear" }),
+              /* @__PURE__ */ e("button", { onClick: Q, className: "text-sm text-text-muted hover:text-text", children: "Clear" }),
               /* @__PURE__ */ e(
                 "button",
                 {
@@ -2189,7 +2297,7 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
       )
     ] });
   }
-), lt = ve(
+), ct = ve(
   ({
     value: t,
     onValueChange: r,
@@ -2214,7 +2322,7 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
         l
       ),
       children: [
-        /* @__PURE__ */ e(ee, { icon: Le, size: "md", color: "current", className: "shrink-0" }),
+        /* @__PURE__ */ e(J, { icon: Le, size: "md", color: "current", className: "shrink-0" }),
         /* @__PURE__ */ e(
           "input",
           {
@@ -2246,15 +2354,15 @@ const Ir = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current"
             "aria-label": a,
             onClick: () => r(""),
             className: "grid size-4 shrink-0 cursor-pointer place-items-center rounded-xs text-text-subtle transition-colors duration-fast ease-out hover:text-text focus-visible:outline-none focus-visible:focus-ring",
-            children: /* @__PURE__ */ e(ee, { icon: Se, size: "sm", color: "current" })
+            children: /* @__PURE__ */ e(J, { icon: Se, size: "sm", color: "current" })
           }
         ) : n && /* @__PURE__ */ e("span", { className: "shrink-0 text-xs text-text-subtle", children: n })
       ]
     }
   )
 );
-lt.displayName = "SearchField";
-const jr = ({
+ct.displayName = "SearchField";
+const Br = ({
   trigger: t,
   options: r,
   value: n,
@@ -2270,7 +2378,7 @@ const jr = ({
       "button[data-option-value]:not(:disabled)"
     ) ?? []
   );
-  X(() => {
+  Z(() => {
     v && K()[0]?.focus();
   }, [v]);
   const U = (y) => {
@@ -2278,24 +2386,24 @@ const jr = ({
     const S = K();
     if (S.length === 0) return;
     y.preventDefault();
-    const D = S.indexOf(document.activeElement), E = y.key === "Home" ? 0 : y.key === "End" ? S.length - 1 : y.key === "ArrowDown" ? (D + 1) % S.length : (D - 1 + S.length) % S.length;
+    const $ = S.indexOf(document.activeElement), E = y.key === "Home" ? 0 : y.key === "End" ? S.length - 1 : y.key === "ArrowDown" ? ($ + 1) % S.length : ($ - 1 + S.length) % S.length;
     S[E]?.focus();
   };
-  X(() => {
+  Z(() => {
     const y = (x) => {
       p.current && (!p.current.contains(x.target) || C.current && !C.current.contains(x.target)) && (m(!1), b(null), _.current && (clearTimeout(_.current), _.current = null));
     };
     return v && document.addEventListener("mousedown", y), () => {
       document.removeEventListener("mousedown", y);
     };
-  }, [v]), X(() => {
+  }, [v]), Z(() => {
     const y = (x) => {
       x.key === "Escape" && (m(!1), b(null), h.current?.focus(), _.current && (clearTimeout(_.current), _.current = null));
     };
     return v && document.addEventListener("keydown", y), () => {
       document.removeEventListener("keydown", y);
     };
-  }, [v]), X(() => {
+  }, [v]), Z(() => {
     if (f && p.current) {
       const y = p.current.querySelector(
         `[data-option-value="${f}"]`
@@ -2308,7 +2416,7 @@ const jr = ({
         });
       }
     }
-  }, [f]), X(() => () => {
+  }, [f]), Z(() => () => {
     _.current && clearTimeout(_.current);
   }, []);
   const j = (y) => {
@@ -2317,16 +2425,16 @@ const jr = ({
     y.stopPropagation(), !x.disabled && !x.divider && (!x.children || x.children.length === 0) && (s?.(x.value, S), m(!1), b(null));
   }, W = (y) => {
     _.current && (clearTimeout(_.current), _.current = null), y.children && y.children.length > 0 ? b(y.value) : b(null);
-  }, Z = (y) => {
+  }, Q = (y) => {
     y.children && y.children.length > 0 ? _.current = setTimeout(() => {
       b(null);
     }, 150) : b(null);
-  }, J = (y, x, S) => {
+  }, Y = (y, x, S) => {
     y.stopPropagation(), !x.disabled && !x.divider && (s?.(x.value, S), m(!1), b(null));
   }, de = i(
     "fixed z-overlay min-w-menu bg-surface rounded-lg shadow-overlay border border-border",
     "max-h-60 overflow-auto"
-  ), Y = i(
+  ), X = i(
     "fixed z-overlay min-w-menu bg-surface rounded-lg shadow-overlay border border-border",
     "max-h-60 overflow-auto"
   );
@@ -2365,7 +2473,7 @@ const jr = ({
               r.map((y, x) => {
                 if (y.divider)
                   return /* @__PURE__ */ e("div", { className: "border-t border-border my-2" }, `divider-${x}`);
-                const S = y.children && y.children.length > 0, D = f === y.value;
+                const S = y.children && y.children.length > 0, $ = f === y.value;
                 return /* @__PURE__ */ c("div", { className: "relative group", children: [
                   /* @__PURE__ */ c(
                     "button",
@@ -2375,13 +2483,13 @@ const jr = ({
                       "aria-haspopup": S ? "menu" : void 0,
                       onClick: (E) => B(E, y),
                       onMouseEnter: () => W(y),
-                      onMouseLeave: () => Z(y),
+                      onMouseLeave: () => Q(y),
                       disabled: y.disabled,
                       className: i(
                         "flex w-full items-center justify-between rounded-md px-3 py-1.5 text-sm text-text transition-colors duration-fast ease-out hover:bg-surface-hover focus-visible:outline-none focus-visible:focus-ring",
                         {
                           "opacity-50 cursor-not-allowed": y.disabled,
-                          "bg-surface-hover": D && S
+                          "bg-surface-hover": $ && S
                         }
                       ),
                       children: [
@@ -2399,11 +2507,11 @@ const jr = ({
                       ]
                     }
                   ),
-                  S && D && /* @__PURE__ */ e(
+                  S && $ && /* @__PURE__ */ e(
                     "div",
                     {
                       ref: C,
-                      className: Y,
+                      className: X,
                       style: {
                         top: `${g.top}px`,
                         left: `${g.left}px`
@@ -2416,20 +2524,20 @@ const jr = ({
                           b(null);
                         }, 150);
                       },
-                      children: /* @__PURE__ */ e("div", { className: "p-2", children: y.children.map((E, A) => {
+                      children: /* @__PURE__ */ e("div", { className: "p-2", children: y.children.map((E, D) => {
                         if (E.divider)
                           return /* @__PURE__ */ e(
                             "div",
                             {
                               className: "border-t border-border my-2"
                             },
-                            `divider-${A}`
+                            `divider-${D}`
                           );
-                        const $ = typeof n == "object" && n[y.value] && n[y.value].includes(E.value) || n === E.value;
+                        const A = typeof n == "object" && n[y.value] && n[y.value].includes(E.value) || n === E.value;
                         return /* @__PURE__ */ c(
                           "button",
                           {
-                            onClick: (oe) => J(oe, E, y.value),
+                            onClick: (oe) => Y(oe, E, y.value),
                             disabled: E.disabled,
                             className: i(
                               "flex w-full items-center justify-between rounded-md px-3 py-1.5 text-sm text-text transition-colors duration-fast ease-out hover:bg-surface-hover",
@@ -2445,7 +2553,7 @@ const jr = ({
                                   E.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: E.description })
                                 ] })
                               ] }),
-                              u && $ && /* @__PURE__ */ e(
+                              u && A && /* @__PURE__ */ e(
                                 Ue,
                                 {
                                   className: "size-icon-md shrink-0 text-success-fg",
@@ -2464,8 +2572,8 @@ const jr = ({
               (() => {
                 const y = r.reduce((x, S) => {
                   if (S.divider) return x;
-                  const D = S.children ? S.children.filter((E) => !E.divider).length : 0;
-                  return x + 1 + D;
+                  const $ = S.children ? S.children.filter((E) => !E.divider).length : 0;
+                  return x + 1 + $;
                 }, 0);
                 return y > 1 && /* @__PURE__ */ e("div", { className: "border-t border-border mt-2 pt-2", children: /* @__PURE__ */ c("div", { className: "text-xs text-text-muted px-3 py-1", children: [
                   y,
@@ -2478,24 +2586,24 @@ const jr = ({
       ]
     }
   );
-}, Ms = (t) => (r) => t(r instanceof Date ? r : null), Ts = (t) => (r) => t(typeof r == "string" ? r : ""), $s = (t) => (r) => t(Array.isArray(r) ? r : typeof r == "string" && r ? [r] : []), Fr = {
+}, Ps = (t) => (r) => t(r instanceof Date ? r : null), Os = (t) => (r) => t(typeof r == "string" ? r : ""), js = (t) => (r) => t(Array.isArray(r) ? r : typeof r == "string" && r ? [r] : []), Hr = {
   none: "px-0",
   sm: "px-2",
   md: "px-3.5",
   lg: "px-5"
-}, Rr = {
+}, qr = {
   sm: "h-row-lg",
   md: "h-row-xl",
   lg: "h-14"
-}, Br = 8, Je = ["62%", "44%", "74%", "52%", "68%", "48%", "80%", "56%"];
-function Hr(t, r) {
+}, Vr = 8, Je = ["62%", "44%", "74%", "52%", "68%", "48%", "80%", "56%"];
+function Ur(t, r) {
   if (r <= 7) return Array.from({ length: r }, (l, o) => o);
   const s = [.../* @__PURE__ */ new Set([0, r - 1, t - 1, t, t + 1])].filter((l) => l >= 0 && l < r).sort((l, o) => l - o), a = [];
   return s.forEach((l, o) => {
     o > 0 && l - s[o - 1] > 1 && a.push("gap"), a.push(l);
   }), a;
 }
-const qr = (t) => {
+const Wr = (t) => {
   const r = Array.isArray(t.value) ? t.value : t.value != null && t.value !== "" && t.value !== "all" ? [t.value] : [];
   if (t.type === "date") {
     const o = t.value instanceof Date;
@@ -2517,7 +2625,7 @@ const qr = (t) => {
     );
   }, l = r.length > 0;
   return /* @__PURE__ */ e(
-    Qt,
+    tr,
     {
       tone: "outline",
       caret: !0,
@@ -2567,56 +2675,56 @@ const qr = (t) => {
   selectable: h = !1,
   selectedRows: C = [],
   onSelectionChange: z,
-  getRowKey: P = (de, Y) => Y,
+  getRowKey: P = (de, X) => X,
   emptyContent: _,
   footerSummary: K,
   size: U = "md",
   hoverable: j = !0,
   padding: B = "md",
   className: W,
-  rowClassName: Z,
-  headerBackground: J = !0
+  rowClassName: Q,
+  headerBackground: Y = !0
 }) => {
-  const [de, Y] = R(""), y = l !== void 0, x = y ? l : de, S = o ?? Y, [D, E] = R({
+  const [de, X] = R(""), y = l !== void 0, x = y ? l : de, S = o ?? X, [$, E] = R({
     column: null,
     direction: null
-  }), [A, $] = R({
+  }), [D, A] = R({
     page: 0,
     pageSize: g
   }), oe = ne(null), ce = pe(() => {
     let T = t;
     if (s && !y && x.trim()) {
       const V = r.filter((ie) => ie.searchable !== !1), re = x.toLowerCase();
-      T = T.filter((ie) => V.some((Q) => {
-        const F = typeof Q.accessor == "function" ? Q.accessor(ie) : ie[Q.accessor];
+      T = T.filter((ie) => V.some((ee) => {
+        const F = typeof ee.accessor == "function" ? ee.accessor(ie) : ie[ee.accessor];
         return String(F || "").toLowerCase().includes(re);
       }));
     }
     return T;
   }, [t, x, y, r, s]), q = pe(() => {
-    if (!D.column || !D.direction) return ce;
-    const T = r.find((V) => V.id === D.column);
+    if (!$.column || !$.direction) return ce;
+    const T = r.find((V) => V.id === $.column);
     return T ? [...ce].sort((V, re) => {
-      const ie = typeof T.accessor == "function" ? T.accessor(V) : V[T.accessor], Q = typeof T.accessor == "function" ? T.accessor(re) : re[T.accessor];
+      const ie = typeof T.accessor == "function" ? T.accessor(V) : V[T.accessor], ee = typeof T.accessor == "function" ? T.accessor(re) : re[T.accessor];
       let F = 0;
-      return ie < Q ? F = -1 : ie > Q && (F = 1), D.direction === "desc" ? -F : F;
+      return ie < ee ? F = -1 : ie > ee && (F = 1), $.direction === "desc" ? -F : F;
     }) : ce;
-  }, [ce, D, r]), H = pe(() => {
+  }, [ce, $, r]), H = pe(() => {
     if (!b || m) return q;
-    const T = A.page * A.pageSize, V = T + A.pageSize;
+    const T = D.page * D.pageSize, V = T + D.pageSize;
     return q.slice(T, V);
-  }, [q, A, b, m]), L = xe(
+  }, [q, D, b, m]), L = xe(
     (T) => {
       r.find((re) => re.id === T)?.sortable && E((re) => re.column !== T ? { column: T, direction: "asc" } : re.direction === "asc" ? { column: T, direction: "desc" } : { column: null, direction: null });
     },
     [r]
   ), k = xe((T) => {
-    $((V) => ({ ...V, page: T }));
+    A((V) => ({ ...V, page: T }));
   }, []), M = xe(
     (T, V) => {
       if (!z) return;
       const re = P(T, 0);
-      z(V ? [...C, T] : C.filter((ie, Q) => P(C[Q], Q) !== re));
+      z(V ? [...C, T] : C.filter((ie, ee) => P(C[ee], ee) !== re));
     },
     [C, z, P]
   ), G = xe(
@@ -2625,35 +2733,35 @@ const qr = (t) => {
     },
     [H, z]
   );
-  X(() => {
-    $((T) => ({ ...T, page: 0 }));
-  }, [x, D]), X(() => {
-    $((T) => ({ ...T, page: 0 }));
+  Z(() => {
+    A((T) => ({ ...T, page: 0 }));
+  }, [x, $]), Z(() => {
+    A((T) => ({ ...T, page: 0 }));
   }, [u.map((T) => T.value).join(",")]);
-  const O = q.length, N = Math.ceil(O / A.pageSize), I = A.page * A.pageSize + 1, te = Math.min(I + A.pageSize - 1, O), le = H.length > 0 && H.every((T) => {
+  const O = q.length, N = Math.ceil(O / D.pageSize), I = D.page * D.pageSize + 1, te = Math.min(I + D.pageSize - 1, O), le = H.length > 0 && H.every((T) => {
     const V = P(T, 0);
     return C.some((re, ie) => P(re, ie) === V);
   }), be = H.some((T) => {
     const V = P(T, 0);
     return C.some((re, ie) => P(re, ie) === V);
-  }), ye = Fr[B], fe = J ? "bg-surface-sunk" : "bg-surface", he = i("text-text", ye), Oe = s || u.length > 0 || d.length > 0 || !!v, ft = pe(() => {
-    const T = H.map((Q, F) => ({ row: Q, index: F }));
+  }), ye = Hr[B], fe = Y ? "bg-surface-sunk" : "bg-surface", he = i("text-text", ye), Oe = s || u.length > 0 || d.length > 0 || !!v, xt = pe(() => {
+    const T = H.map((ee, F) => ({ row: ee, index: F }));
     if (!m) return [{ group: null, rows: T }];
     const V = /* @__PURE__ */ new Map();
-    for (const Q of T) {
-      const F = m(Q.row, Q.index), ge = V.get(F);
-      ge ? ge.push(Q) : V.set(F, [Q]);
+    for (const ee of T) {
+      const F = m(ee.row, ee.index), ge = V.get(F);
+      ge ? ge.push(ee) : V.set(F, [ee]);
     }
     const re = f ?? [];
     return [
-      ...re.filter((Q) => V.has(Q.id)),
-      ...[...V.keys()].filter((Q) => !re.some((F) => F.id === Q)).map((Q) => ({ id: Q }))
-    ].map((Q) => ({ group: Q, rows: V.get(Q.id) ?? [] }));
-  }, [H, m, f]), ht = r.length + (h ? 1 : 0) + (w.length > 0 ? 1 : 0), Ve = b && O > 0, xt = Ve || K !== void 0;
+      ...re.filter((ee) => V.has(ee.id)),
+      ...[...V.keys()].filter((ee) => !re.some((F) => F.id === ee)).map((ee) => ({ id: ee }))
+    ].map((ee) => ({ group: ee, rows: V.get(ee.id) ?? [] }));
+  }, [H, m, f]), bt = r.length + (h ? 1 : 0) + (w.length > 0 ? 1 : 0), Ve = b && O > 0, gt = Ve || K !== void 0;
   return /* @__PURE__ */ c("div", { className: i("flex min-w-0 flex-col", W), children: [
     Oe && /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-2 pb-3", children: [
       s && /* @__PURE__ */ e(
-        lt,
+        ct,
         {
           value: x,
           onValueChange: S,
@@ -2661,7 +2769,7 @@ const qr = (t) => {
           containerClassName: "w-full sm:w-66"
         }
       ),
-      u.map((T) => /* @__PURE__ */ e(qr, { ...T }, T.id)),
+      u.map((T) => /* @__PURE__ */ e(Wr, { ...T }, T.id)),
       v,
       d.length > 0 && /* @__PURE__ */ e(ke, { actions: d, className: "ml-auto" })
     ] }),
@@ -2698,13 +2806,13 @@ const qr = (t) => {
             children: /* @__PURE__ */ c("div", { className: "flex items-center gap-1.5", children: [
               T.headerCell ? T.headerCell() : T.header,
               T.sortable && /* @__PURE__ */ e(
-                ee,
+                J,
                 {
-                  icon: D.column === T.id && D.direction === "desc" ? Ae : Tt,
+                  icon: $.column === T.id && $.direction === "desc" ? De : At,
                   size: "xs",
                   className: i(
                     "transition-opacity duration-fast ease-out",
-                    D.column === T.id ? "text-text opacity-100" : "text-text-subtle opacity-0 group-hover:opacity-100"
+                    $.column === T.id ? "text-text opacity-100" : "text-text-subtle opacity-0 group-hover:opacity-100"
                   )
                 }
               )
@@ -2714,7 +2822,7 @@ const qr = (t) => {
         )),
         w.length > 0 && /* @__PURE__ */ e("th", { className: i(he, "w-10"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
       ] }) }),
-      /* @__PURE__ */ e("tbody", { children: n ? Array.from({ length: Br }).map((T, V) => /* @__PURE__ */ c(
+      /* @__PURE__ */ e("tbody", { children: n ? Array.from({ length: Vr }).map((T, V) => /* @__PURE__ */ c(
         "tr",
         {
           className: "animate-pulse border-t border-border-subtle",
@@ -2752,12 +2860,12 @@ const qr = (t) => {
           ),
           children: _ || "No data available"
         }
-      ) }) : ft.flatMap((T) => [
+      ) }) : xt.flatMap((T) => [
         ...T.group ? [
           /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
             "td",
             {
-              colSpan: ht,
+              colSpan: bt,
               className: i(
                 // A caption over its rows, not a second column strip:
                 // same surface as the rows, no rules, count on the right.
@@ -2772,21 +2880,21 @@ const qr = (t) => {
           ) }, `group-${T.group.id}`)
         ] : [],
         ...T.rows.map(({ row: V, index: re }) => {
-          const ie = P(V, re), Q = C.some(
+          const ie = P(V, re), ee = C.some(
             (F, ge) => P(F, ge) === ie
           );
           return /* @__PURE__ */ c(
             "tr",
             {
               className: i(
-                Rr[U],
+                qr[U],
                 // Hairline above every row, including the first: it is
                 // what separates the body from the column strip.
                 "border-t border-border-subtle",
                 j && "transition-colors duration-fast ease-out hover:bg-surface-hover",
                 p && "cursor-pointer",
-                Q && "bg-accent-soft",
-                Z?.(V, re)
+                ee && "bg-accent-soft",
+                Q?.(V, re)
               ),
               onClick: (F) => {
                 F.stopPropagation(), p?.(V, re);
@@ -2796,7 +2904,7 @@ const qr = (t) => {
                   we,
                   {
                     size: "sm",
-                    checked: Q,
+                    checked: ee,
                     onClick: (F) => F.stopPropagation(),
                     onChange: (F) => {
                       F.stopPropagation(), M(V, F.target.checked);
@@ -2822,10 +2930,10 @@ const qr = (t) => {
                   );
                 }),
                 w.length > 0 && /* @__PURE__ */ e("td", { className: he, children: /* @__PURE__ */ e(
-                  jr,
+                  Br,
                   {
                     className: "rounded-md",
-                    trigger: /* @__PURE__ */ e("span", { className: "grid size-7 place-items-center text-text-subtle", children: /* @__PURE__ */ e(ee, { icon: $t, size: "md", color: "current" }) }),
+                    trigger: /* @__PURE__ */ e("span", { className: "grid size-7 place-items-center text-text-subtle", children: /* @__PURE__ */ e(J, { icon: _t, size: "md", color: "current" }) }),
                     options: w.map((F) => ({
                       value: F.id,
                       label: F.label,
@@ -2833,7 +2941,7 @@ const qr = (t) => {
                       disabled: F.disabled?.(V)
                     })),
                     onSelect: (F) => {
-                      const ge = w.find((bt) => bt.id === F);
+                      const ge = w.find((pt) => pt.id === F);
                       ge && ge.onClick(V, re);
                     },
                     placement: "bottom-end"
@@ -2846,7 +2954,7 @@ const qr = (t) => {
         })
       ]) })
     ] }) }),
-    xt && /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-3 px-1 pt-3 text-xs text-text-muted", children: [
+    gt && /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-3 px-1 pt-3 text-xs text-text-muted", children: [
       /* @__PURE__ */ e("span", { className: "min-w-0 flex-1", children: K ?? `Showing ${I}–${te} of ${O}` }),
       Ve && /* @__PURE__ */ c("div", { className: "flex items-center gap-0.5", children: [
         /* @__PURE__ */ e(
@@ -2856,23 +2964,23 @@ const qr = (t) => {
             variant: "ghost",
             iconOnly: !0,
             "aria-label": "Previous page",
-            onClick: () => k(A.page - 1),
-            disabled: A.page === 0,
-            children: /* @__PURE__ */ e(ee, { icon: ze, size: "md", color: "current" })
+            onClick: () => k(D.page - 1),
+            disabled: D.page === 0,
+            children: /* @__PURE__ */ e(J, { icon: ze, size: "md", color: "current" })
           }
         ),
-        Hr(A.page, N).map(
+        Ur(D.page, N).map(
           (T, V) => T === "gap" ? /* @__PURE__ */ e("span", { className: "px-1 text-text-subtle", children: "…" }, `gap-${V}`) : /* @__PURE__ */ e(
             "button",
             {
               type: "button",
-              "aria-current": T === A.page ? "page" : void 0,
+              "aria-current": T === D.page ? "page" : void 0,
               onClick: () => k(T),
               className: i(
                 "h-control-xs min-w-6 cursor-pointer rounded-sm px-1.5 tabular-nums",
                 "transition-colors duration-fast ease-out",
                 "focus-visible:outline-none focus-visible:focus-ring",
-                T === A.page ? "bg-surface-sunk font-semibold text-text" : "text-text-muted hover:bg-surface-hover hover:text-text"
+                T === D.page ? "bg-surface-sunk font-semibold text-text" : "text-text-muted hover:bg-surface-hover hover:text-text"
               ),
               children: T + 1
             },
@@ -2886,15 +2994,15 @@ const qr = (t) => {
             variant: "ghost",
             iconOnly: !0,
             "aria-label": "Next page",
-            onClick: () => k(A.page + 1),
-            disabled: A.page >= N - 1,
-            children: /* @__PURE__ */ e(ee, { icon: Ie, size: "md", color: "current" })
+            onClick: () => k(D.page + 1),
+            disabled: D.page >= N - 1,
+            children: /* @__PURE__ */ e(J, { icon: Ie, size: "md", color: "current" })
           }
         )
       ] })
     ] })
   ] });
-}, Vr = {
+}, Kr = {
   default: "bg-surface-hover text-text",
   primary: "bg-accent-soft text-accent",
   secondary: "bg-surface-hover text-text-muted",
@@ -2904,11 +3012,11 @@ const qr = (t) => {
   info: "bg-info-soft text-info-fg",
   // Internal-note amber. Never for customer-visible content.
   note: "bg-note-soft text-note"
-}, Ur = {
+}, Gr = {
   sm: "px-2 py-0.5 text-xs",
   md: "px-2.5 py-1 text-sm",
   lg: "px-3 py-1.5 text-base"
-}, Wr = {
+}, Jr = {
   default: "bg-surface-hover",
   primary: "bg-accent",
   secondary: "bg-surface-hover",
@@ -2918,7 +3026,7 @@ const qr = (t) => {
   info: "bg-info",
   note: "bg-note"
 };
-function Kr({
+function Yr({
   variant: t = "default",
   size: r = "md",
   dot: n = !1,
@@ -2934,13 +3042,13 @@ function Kr({
     {
       className: i(
         "inline-flex items-center font-medium rounded-full",
-        Vr[t],
-        Ur[r],
+        Kr[t],
+        Gr[r],
         o
       ),
       ...d,
       children: [
-        n && /* @__PURE__ */ e("span", { className: i("w-2 h-2 rounded-full mr-1.5", Wr[t]) }),
+        n && /* @__PURE__ */ e("span", { className: i("w-2 h-2 rounded-full mr-1.5", Jr[t]) }),
         s && /* @__PURE__ */ e("span", { className: i("flex-shrink-0", u && "mr-1"), children: s }),
         u,
         a && l && /* @__PURE__ */ e(
@@ -2949,14 +3057,14 @@ function Kr({
             onClick: l,
             className: "ml-1.5 flex-shrink-0 hover:opacity-70 transition-opacity",
             "aria-label": "Remove badge",
-            children: /* @__PURE__ */ e(ee, { icon: Se, size: "xs", color: "current" })
+            children: /* @__PURE__ */ e(J, { icon: Se, size: "xs", color: "current" })
           }
         )
       ]
     }
   );
 }
-function Gr(t) {
+function Xr(t) {
   const { id: r, header: n, accessor: s, label: a, tone: l, visible: o, width: u, sortable: d, align: v } = t;
   return {
     id: r,
@@ -2964,14 +3072,14 @@ function Gr(t) {
     accessor: (m) => a(s(m), m),
     cell: (m, f) => {
       const b = s(f);
-      return o && !o(b, f) ? null : /* @__PURE__ */ e(Kr, { variant: l ? l(b, f) : "default", size: "sm", children: a(b, f) });
+      return o && !o(b, f) ? null : /* @__PURE__ */ e(Yr, { variant: l ? l(b, f) : "default", size: "sm", children: a(b, f) });
     },
     width: u,
     sortable: d,
     align: v
   };
 }
-function _s(t) {
+function Fs(t) {
   const {
     id: r,
     header: n,
@@ -2983,7 +3091,7 @@ function _s(t) {
     width: d,
     sortable: v
   } = t;
-  return Gr({
+  return Xr({
     id: r,
     header: n,
     accessor: (m) => !!s(m),
@@ -2993,7 +3101,7 @@ function _s(t) {
     sortable: v
   });
 }
-function Ds(t) {
+function Rs(t) {
   const {
     id: r,
     header: n,
@@ -3017,19 +3125,19 @@ function Ds(t) {
     sortable: v
   };
 }
-const Jr = {
+const Zr = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-base",
   lg: "text-md",
   xl: "text-lg"
-}, Yr = {
+}, Qr = {
   light: "font-normal",
   normal: "font-normal",
   medium: "font-medium",
   semibold: "font-semibold",
   bold: "font-bold"
-}, Xr = {
+}, en = {
   primary: "text-text",
   secondary: "text-text-muted",
   accent: "text-accent",
@@ -3040,12 +3148,12 @@ const Jr = {
   neutral: "text-text",
   current: "text-current",
   muted: "text-text-subtle"
-}, Zr = {
+}, tn = {
   left: "text-left",
   center: "text-center",
   right: "text-right",
   justify: "text-justify"
-}, Qr = {
+}, rn = {
   tight: "leading-tight",
   normal: "leading-normal",
   relaxed: "leading-relaxed"
@@ -3064,20 +3172,20 @@ const Jr = {
   children: f,
   ...b
 }) => {
-  const g = v || en(t), w = t === "caption", p = t === "label", h = t === "code", C = i(
+  const g = v || nn(t), w = t === "caption", p = t === "label", h = t === "code", C = i(
     "font-sans",
     // Variant — caption and label pin their own size/weight
     w && "text-xs text-text-subtle",
     p && "text-xs font-semibold uppercase tracking-label text-text-subtle",
     h && "font-mono text-sm rounded-sm bg-surface-hover px-1 py-0.5",
     // Size — only where the variant does not pin it
-    !w && !p && !h && Jr[r],
+    !w && !p && !h && Zr[r],
     // Weight — label owns its weight
-    !p && Yr[n],
-    Xr[s],
-    Zr[a],
+    !p && Qr[n],
+    en[s],
+    tn[a],
     // Line height only overrides the body variant
-    t === "body" && Qr[d],
+    t === "body" && rn[d],
     o && "italic",
     u && "underline",
     l && "truncate",
@@ -3085,7 +3193,7 @@ const Jr = {
   );
   return /* @__PURE__ */ e(g, { className: C, ...b, children: f });
 };
-function en(t) {
+function nn(t) {
   return {
     body: "p",
     caption: "span",
@@ -3093,13 +3201,13 @@ function en(t) {
     code: "code"
   }[t] || "p";
 }
-function tn(t, r) {
+function sn(t, r) {
   return r.split(".").reduce(
     (n, s) => n && typeof n == "object" && s in n ? n[s] : void 0,
     t
   );
 }
-const As = ({
+const Bs = ({
   groups: t,
   data: r,
   size: n = "md",
@@ -3122,7 +3230,7 @@ const As = ({
     return b ? b.label : String(m || "-");
   }, u = xe(
     (m) => {
-      const f = tn(r, m.name);
+      const f = sn(r, m.name);
       if (m.type === "array") {
         const g = f;
         return !g || g.length === 0 ? /* @__PURE__ */ e(ue, { variant: "body", size: "sm", className: "text-text-muted", children: "Geen items" }) : /* @__PURE__ */ e("div", { className: "space-y-3", children: g.map((w, p) => /* @__PURE__ */ c("div", { className: "p-4 border border-border rounded-xl space-y-3", children: [
@@ -3265,7 +3373,7 @@ const As = ({
   );
   return /* @__PURE__ */ e("div", { className: v, children: /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(d) }) });
 };
-class Ls extends yt {
+class Hs extends wt {
   constructor() {
     super(...arguments), this.state = {
       hasError: !1,
@@ -3294,7 +3402,7 @@ class Ls extends yt {
   }
 }
 const Fe = /* @__PURE__ */ new Map();
-function Is({
+function qs({
   identifier: t,
   resourceLoader: r,
   framework: n = "react",
@@ -3304,7 +3412,7 @@ function Is({
   className: o
 }) {
   const u = ne(null), [d, v] = R(null), [, m] = R(0), f = ne(null), b = ne(r);
-  b.current = r, X(() => {
+  b.current = r, Z(() => {
     if (Fe.has(t)) return;
     let C = !0;
     return (async () => {
@@ -3320,7 +3428,7 @@ function Is({
     };
   }, [t]);
   const g = Fe.get(t) ?? null, w = !g && d === t, p = !g && !w, h = g ? n === "react" && (g.component || g.default) || g : null;
-  return X(() => {
+  return Z(() => {
     if (!h || n === "react") return;
     const C = u.current;
     if (C) {
@@ -3335,7 +3443,7 @@ function Is({
         };
       }
     }
-  }, [h, n]), X(() => {
+  }, [h, n]), Z(() => {
     n === "svelte" && f.current && f.current.$set?.(l);
   }, [l, n]), /* @__PURE__ */ c("div", { ref: u, className: o, style: { display: "contents" }, children: [
     p && s,
@@ -3343,11 +3451,11 @@ function Is({
     n === "react" && h && /* @__PURE__ */ e(h, { ...l })
   ] });
 }
-const rn = {
+const an = {
   neutral: "bg-surface-hover text-text-muted",
   success: "bg-success-soft text-success-fg"
 };
-function Ps({
+function Vs({
   icon: t,
   tone: r = "neutral",
   title: n,
@@ -3372,7 +3480,7 @@ function Ps({
           {
             className: i(
               "flex size-disc items-center justify-center rounded-full text-2xl",
-              rn[r]
+              an[r]
             ),
             children: t
           }
@@ -3384,7 +3492,7 @@ function Ps({
     }
   );
 }
-function Os({ children: t, className: r, ...n }) {
+function Us({ children: t, className: r, ...n }) {
   return /* @__PURE__ */ e(
     "kbd",
     {
@@ -3397,14 +3505,14 @@ function Os({ children: t, className: r, ...n }) {
     }
   );
 }
-const nn = {
+const ln = {
   sm: "h-1",
   md: "h-1.5"
-}, sn = {
+}, on = {
   accent: "bg-accent",
   success: "bg-success"
 };
-function js({
+function Ws({
   value: t,
   variant: r = "accent",
   size: n = "md",
@@ -3421,7 +3529,7 @@ function js({
       "aria-valuemax": 100,
       className: i(
         "w-full overflow-hidden rounded-full bg-surface-hover",
-        nn[n],
+        ln[n],
         s
       ),
       ...a,
@@ -3430,7 +3538,7 @@ function js({
         {
           className: i(
             "h-full rounded-full transition-[width] duration-300 ease-out",
-            sn[r]
+            on[r]
           ),
           style: { width: `${l}%` }
         }
@@ -3438,25 +3546,25 @@ function js({
     }
   );
 }
-const an = {
+const cn = {
   xs: "h-3 w-3",
   sm: "h-4 w-4",
   md: "h-6 w-6",
   lg: "h-8 w-8",
   xl: "h-12 w-12"
-}, ln = {
+}, dn = {
   primary: "text-accent",
   secondary: "text-text-muted",
   white: "text-white",
   current: "text-current"
-}, on = {
+}, un = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-sm",
   lg: "text-base",
   xl: "text-lg"
 };
-function Fs({
+function Ks({
   size: t = "md",
   variant: r = "primary",
   label: n = "Loading...",
@@ -3473,7 +3581,7 @@ function Fs({
         /* @__PURE__ */ c(
           "svg",
           {
-            className: i("animate-spin", an[t], ln[r]),
+            className: i("animate-spin", cn[t], dn[r]),
             fill: "none",
             viewBox: "0 0 24 24",
             "aria-hidden": !s,
@@ -3501,13 +3609,13 @@ function Fs({
             ]
           }
         ),
-        s && /* @__PURE__ */ e("span", { className: i("text-text-muted", on[t]), children: n }),
+        s && /* @__PURE__ */ e("span", { className: i("text-text-muted", un[t]), children: n }),
         !s && /* @__PURE__ */ e("span", { className: "sr-only", children: n })
       ]
     }
   );
 }
-const cn = {
+const mn = {
   neutral: "bg-text-disabled",
   accent: "bg-accent",
   success: "bg-success",
@@ -3521,7 +3629,7 @@ const cn = {
   "cat-4": "bg-cat-4",
   "cat-5": "bg-cat-5"
 };
-function Rs({
+function Gs({
   tone: t = "neutral",
   shape: r = "round",
   pulse: n = !1,
@@ -3537,14 +3645,14 @@ function Rs({
       className: i(
         "inline-block size-dot shrink-0",
         r === "round" ? "rounded-full" : "rounded-sm",
-        cn[t],
+        mn[t],
         n && "animate-pulse",
         a
       )
     }
   );
 }
-function Bs({
+function Js({
   steps: t,
   current: r,
   variant: n = "numbered",
@@ -3584,7 +3692,7 @@ function Bs({
     d < t.length - 1 && /* @__PURE__ */ e("span", { className: "h-px w-8 bg-border-strong" })
   ] }, u)) });
 }
-const dn = /* @__PURE__ */ new Set([
+const fn = /* @__PURE__ */ new Set([
   "name",
   "given-name",
   "family-name",
@@ -3619,7 +3727,7 @@ const dn = /* @__PURE__ */ new Set([
   "one-time-code"
 ]);
 function Xe(t) {
-  return t && dn.has(t) ? { autoComplete: t } : {
+  return t && fn.has(t) ? { autoComplete: t } : {
     autoComplete: "off",
     // 1Password
     "data-1p-ignore": "true",
@@ -3631,12 +3739,12 @@ function Xe(t) {
     "data-form-type": "other"
   };
 }
-const _e = (t) => t == null ? "" : String(t), un = (t) => _e(t).trim().toLowerCase(), mn = {
+const _e = (t) => t == null ? "" : String(t), hn = (t) => _e(t).trim().toLowerCase(), xn = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-sm",
   lg: "h-control-lg px-3 text-base",
   full: "h-control-md w-full px-3 text-sm"
-}, $e = un, De = ve(
+}, Ae = hn, $e = ve(
   ({
     label: t,
     helperText: r,
@@ -3658,15 +3766,15 @@ const _e = (t) => t == null ? "" : String(t), un = (t) => _e(t).trim().toLowerCa
     onCreateOption: C,
     ...z
   }, P) => {
-    const _ = f || `select-${Math.random().toString(36).substr(2, 9)}`, K = !!n, [U, j] = ae.useState(!1), [B, W] = ae.useState(""), Z = ae.useRef(null), J = ae.useRef(null), de = Pe(U, J, { matchWidth: !0 }), [Y, y] = ae.useState(o);
-    ae.useImperativeHandle(P, () => Z.current), ae.useEffect(() => {
+    const _ = f || `select-${Math.random().toString(36).substr(2, 9)}`, K = !!n, [U, j] = ae.useState(!1), [B, W] = ae.useState(""), Q = ae.useRef(null), Y = ae.useRef(null), de = Pe(U, Y, { matchWidth: !0 }), [X, y] = ae.useState(o);
+    ae.useImperativeHandle(P, () => Q.current), ae.useEffect(() => {
       const L = (k) => {
-        Z.current && !Z.current.contains(k.target) && j(!1);
+        Q.current && !Q.current.contains(k.target) && j(!1);
       };
       return document.addEventListener("mousedown", L), () => document.removeEventListener("mousedown", L);
     }, []);
     const x = ae.useCallback(
-      (L, k) => L.some((M) => $e(M.value) === $e(k) || $e(M.label) === $e(k)),
+      (L, k) => L.some((M) => Ae(M.value) === Ae(k) || Ae(M.label) === Ae(k)),
       []
     ), S = ae.useCallback(
       (L, k) => {
@@ -3686,34 +3794,34 @@ const _e = (t) => t == null ? "" : String(t), un = (t) => _e(t).trim().toLowerCa
         }), S(k, w);
       });
     }, [o, w, S, x]);
-    const D = ae.useMemo(
+    const $ = ae.useMemo(
       () => Array.isArray(w) ? w.map(_e) : w == null ? void 0 : _e(w),
       [w]
     ), E = (L) => {
       if (g) {
-        const k = Array.isArray(D) ? D : [], M = k.includes(L) ? k.filter((G) => G !== L) : [...k, L];
+        const k = Array.isArray($) ? $ : [], M = k.includes(L) ? k.filter((G) => G !== L) : [...k, L];
         p?.(M);
       } else
         p?.(L), j(!1), W("");
-    }, A = g ? null : Y.find((L) => L.value === D), $ = g ? Y.filter((L) => Array.isArray(D) && D.includes(L.value)) : [], oe = b && B ? Y.filter(
+    }, D = g ? null : X.find((L) => L.value === $), A = g ? X.filter((L) => Array.isArray($) && $.includes(L.value)) : [], oe = b && B ? X.filter(
       (L) => L.label.toLowerCase().includes(B.toLowerCase())
-    ) : Y, ce = !!h && !!b && !!B.trim() && !x(Y, B), q = (L) => {
+    ) : X, ce = !!h && !!b && !!B.trim() && !x(X, B), q = (L) => {
       const k = L.trim();
       if (!k) return;
       const M = C?.(k) ?? {
         value: k,
         label: k
       };
-      if (x(Y, M.value) || x(Y, M.label)) {
+      if (x(X, M.value) || x(X, M.label)) {
         E(M.value), W(""), g || j(!1);
         return;
       }
       y((G) => [...G, M]), E(M.value), W(""), g || j(!1);
-    }, H = () => g ? $.length > 0 ? $.map((L) => L.label).join(", ") : u || "Select options" : A?.label || u || "Select an option";
+    }, H = () => g ? A.length > 0 ? A.map((L) => L.label).join(", ") : u || "Select options" : D?.label || u || "Select an option";
     return /* @__PURE__ */ c(
       "div",
       {
-        ref: Z,
+        ref: Q,
         className: i("relative flex flex-col", a && "w-full", d),
         ...z,
         children: [
@@ -3734,7 +3842,7 @@ const _e = (t) => t == null ? "" : String(t), un = (t) => _e(t).trim().toLowerCa
             /* @__PURE__ */ c(
               "button",
               {
-                ref: J,
+                ref: Y,
                 type: "button",
                 id: _,
                 disabled: l,
@@ -3744,14 +3852,14 @@ const _e = (t) => t == null ? "" : String(t), un = (t) => _e(t).trim().toLowerCa
                   "focus-visible:outline-none focus-visible:focus-ring",
                   "disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled",
                   "bg-surface",
-                  mn[s],
+                  xn[s],
                   K ? "border-danger-border text-danger-fg focus-visible:focus-ring" : "border-border-strong text-text",
                   m
                 ),
                 children: [
                   /* @__PURE__ */ e("span", { className: "truncate flex-1 min-w-0", children: H() }),
                   /* @__PURE__ */ e(
-                    _t,
+                    $t,
                     {
                       size: 16,
                       className: i(
@@ -3812,7 +3920,7 @@ const _e = (t) => t == null ? "" : String(t), un = (t) => _e(t).trim().toLowerCa
                       }
                     ),
                     oe.map((L) => {
-                      const k = g ? Array.isArray(D) && D.includes(L.value) : D === L.value;
+                      const k = g ? Array.isArray($) && $.includes(L.value) : $ === L.value;
                       return /* @__PURE__ */ e(
                         "li",
                         {
@@ -3850,13 +3958,13 @@ const _e = (t) => t == null ? "" : String(t), un = (t) => _e(t).trim().toLowerCa
     );
   }
 );
-De.displayName = "Select";
-const fn = {
+$e.displayName = "Select";
+const bn = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-base",
   lg: "h-control-lg px-3 text-base",
   full: "h-control-md px-3 text-base"
-}, ot = "mb-1.5 block text-sm font-medium", ct = "block w-full rounded-tile border bg-surface-input text-text transition-colors duration-fast ease-out placeholder:text-text-subtle focus-visible:outline-none focus-visible:focus-ring disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled", it = (t) => t ? "border-danger-border bg-danger-soft" : "border-border-strong", Ce = ve(
+}, it = "mb-1.5 block text-sm font-medium", dt = "block w-full rounded-tile border bg-surface-input text-text transition-colors duration-fast ease-out placeholder:text-text-subtle focus-visible:outline-none focus-visible:focus-ring disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled", ut = (t) => t ? "border-danger-border bg-danger-soft" : "border-border-strong", Ce = ve(
   ({
     label: t,
     helperText: r,
@@ -3879,7 +3987,7 @@ const fn = {
         {
           htmlFor: p,
           className: i(
-            ot,
+            it,
             h ? "text-danger-fg" : "text-text-muted",
             v
           ),
@@ -3896,11 +4004,11 @@ const fn = {
             "aria-invalid": h || void 0,
             "aria-describedby": C,
             className: i(
-              ct,
-              fn[s],
+              dt,
+              bn[s],
               l && "pl-9",
               (o || u) && "pr-9",
-              it(h),
+              ut(h),
               m
             ),
             ...b
@@ -3926,7 +4034,7 @@ const fn = {
   }
 );
 Ce.displayName = "TextField";
-function hn({
+function gn({
   value: t,
   onChange: r,
   onListFolders: n,
@@ -3937,7 +4045,7 @@ function hn({
   showTemplate: u = !0
 }) {
   const [d, v] = R([]);
-  X(() => {
+  Z(() => {
     let f = !0;
     return Promise.resolve(n?.()).then((b) => {
       f && b && v(b.data ?? []);
@@ -3949,7 +4057,7 @@ function hn({
   const m = t ?? {};
   return /* @__PURE__ */ c("div", { className: "flex flex-col gap-2", children: [
     /* @__PURE__ */ e(
-      De,
+      $e,
       {
         size: a,
         fullWidth: !0,
@@ -3971,7 +4079,7 @@ function hn({
     )
   ] });
 }
-const xn = et(null), Hs = ({ items: t, activeTab: r, onTabChange: n, className: s }) => {
+const pn = et(null), Ys = ({ items: t, activeTab: r, onTabChange: n, className: s }) => {
   const [a, l] = R(t[0]?.id || ""), o = r || a, u = (d) => {
     n ? n(d) : l(d);
   };
@@ -4004,7 +4112,7 @@ const xn = et(null), Hs = ({ items: t, activeTab: r, onTabChange: n, className:
     },
     d.id
   )) }) });
-}, bn = ({
+}, vn = ({
   items: t,
   defaultTab: r,
   activeTab: n,
@@ -4061,7 +4169,7 @@ const xn = et(null), Hs = ({ items: t, activeTab: r, onTabChange: n, className:
       U
     );
   };
-  return /* @__PURE__ */ e(xn.Provider, { value: f, children: /* @__PURE__ */ c("div", { children: [
+  return /* @__PURE__ */ e(pn.Provider, { value: f, children: /* @__PURE__ */ c("div", { children: [
     /* @__PURE__ */ e("div", { className: g, role: "tablist", children: t.map((p) => /* @__PURE__ */ e(
       "button",
       {
@@ -4090,14 +4198,14 @@ const xn = et(null), Hs = ({ items: t, activeTab: r, onTabChange: n, className:
       }
     )
   ] }) });
-}, gn = {
+}, yn = {
   sm: "max-w-md",
   md: "max-w-lg",
   lg: "max-w-2xl",
   xl: "max-w-4xl",
   full: "max-w-full mx-4"
 };
-function dt({
+function mt({
   open: t,
   onClose: r,
   title: n,
@@ -4111,13 +4219,13 @@ function dt({
   showCloseButton: m = !0
 }) {
   const f = ne(null), b = ne(null);
-  X(() => {
+  Z(() => {
     if (!t || !l) return;
     const w = (p) => {
       p.key === "Escape" && r();
     };
     return document.addEventListener("keydown", w), () => document.removeEventListener("keydown", w);
-  }, [t, l, r]), X(() => (t ? (b.current = document.activeElement, f.current && f.current.focus(), document.body.style.overflow = "hidden") : (b.current && b.current.focus(), document.body.style.overflow = ""), () => {
+  }, [t, l, r]), Z(() => (t ? (b.current = document.activeElement, f.current && f.current.focus(), document.body.style.overflow = "hidden") : (b.current && b.current.focus(), document.body.style.overflow = ""), () => {
     document.body.style.overflow = "";
   }), [t]);
   const g = (w) => {
@@ -4139,7 +4247,7 @@ function dt({
           className: i(
             "relative w-full bg-surface rounded-lg shadow-modal",
             "focus:outline-none",
-            gn[s],
+            yn[s],
             o
           ),
           role: "dialog",
@@ -4155,7 +4263,7 @@ function dt({
                   onClick: r,
                   className: "p-1 text-text-muted hover:text-text transition-colors",
                   "aria-label": "Close modal",
-                  children: /* @__PURE__ */ e(ee, { icon: Se, size: "lg", color: "current" })
+                  children: /* @__PURE__ */ e(J, { icon: Se, size: "lg", color: "current" })
                 }
               )
             ] }),
@@ -4167,7 +4275,7 @@ function dt({
     }
   ) : null;
 }
-const pn = ({
+const Nn = ({
   value: t,
   onChange: r,
   label: n,
@@ -4181,15 +4289,15 @@ const pn = ({
   onDownloadFile: m,
   onRegisterFile: f
 }) => {
-  const [b, g] = R(!1), [w, p] = R([]), [h, C] = R(null), [z, P] = R("/"), [_, K] = R([]), [U, j] = R(!1), [B, W] = R(""), [Z, J] = R(
+  const [b, g] = R(!1), [w, p] = R([]), [h, C] = R(null), [z, P] = R("/"), [_, K] = R([]), [U, j] = R(!1), [B, W] = R(""), [Q, Y] = R(
     typeof t == "object" ? t : null
-  ), [de, Y] = R(!1), [y, x] = R(""), S = ne(null);
-  X(() => {
-    b && D();
-  }, [b]), X(() => {
+  ), [de, X] = R(!1), [y, x] = R(""), S = ne(null);
+  Z(() => {
+    b && $();
+  }, [b]), Z(() => {
     b && h && E();
   }, [b, h, z, B]);
-  const D = async () => {
+  const $ = async () => {
     j(!0);
     try {
       const N = await d?.();
@@ -4215,7 +4323,7 @@ const pn = ({
         j(!1);
       }
     }
-  }, A = async (N) => {
+  }, D = async (N) => {
     const I = N.target.files?.[0];
     if (I) {
       j(!0);
@@ -4231,14 +4339,14 @@ const pn = ({
           providerKey: I.name,
           ownerId: "me"
         };
-        J(be), r(be, le), g(!1);
+        Y(be), r(be, le), g(!1);
       } catch (te) {
         console.error("Local file selection failed", te);
       } finally {
         j(!1);
       }
     }
-  }, $ = async (N) => {
+  }, A = async (N) => {
     const I = N.target.files?.[0];
     if (!(!I || !h)) {
       j(!0);
@@ -4252,7 +4360,7 @@ const pn = ({
         });
         if (le?.data) {
           const be = le.data;
-          J(be), r(be, new Uint8Array(te)), g(!1);
+          Y(be), r(be, new Uint8Array(te)), g(!1);
         }
       } catch (te) {
         console.error("Upload failed", te);
@@ -4274,7 +4382,7 @@ const pn = ({
           mountId: h.id,
           providerKey: N,
           ownerId: "me"
-        }), await E()), Y(!1), x("");
+        }), await E()), X(!1), x("");
       } catch (N) {
         console.error("Failed to create folder", N);
       } finally {
@@ -4285,14 +4393,14 @@ const pn = ({
     j(!0);
     try {
       const I = await m?.(N.id);
-      J(N), r(N, I), g(!1);
+      Y(N), r(N, I), g(!1);
     } catch (I) {
       console.error("Failed to download file", I);
     } finally {
       j(!1);
     }
   }, q = (N) => {
-    N.stopPropagation(), J(null), r(null);
+    N.stopPropagation(), Y(null), r(null);
   }, H = pe(() => {
     const N = /* @__PURE__ */ new Set(), I = [];
     return _.forEach((te) => {
@@ -4330,7 +4438,7 @@ const pn = ({
       accessor: "name",
       cell: (N, I) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e(
-          ee,
+          J,
           {
             icon: I.type === "folder" ? Ke : je,
             size: "sm",
@@ -4362,7 +4470,7 @@ const pn = ({
           onClick: (te) => {
             te.stopPropagation(), I.type === "folder" ? L(I.name) : ce(I);
           },
-          loading: U && I.type === "file" && Z?.id === I.id,
+          loading: U && I.type === "file" && Q?.id === I.id,
           children: I.type === "folder" ? "Open" : "Select"
         }
       )
@@ -4373,7 +4481,7 @@ const pn = ({
       header: "Mount Name",
       accessor: "name",
       cell: (N) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2 font-medium", children: [
-        /* @__PURE__ */ e(ee, { icon: We, size: "sm", color: "primary" }),
+        /* @__PURE__ */ e(J, { icon: We, size: "sm", color: "primary" }),
         /* @__PURE__ */ e("span", { children: N })
       ] })
     },
@@ -4399,29 +4507,29 @@ const pn = ({
         ),
         children: [
           /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(
-            ee,
+            J,
             {
-              icon: Z ? je : We,
-              color: Z ? "primary" : "secondary"
+              icon: Q ? je : We,
+              color: Q ? "primary" : "secondary"
             }
           ) }),
-          /* @__PURE__ */ e("div", { className: "flex-grow truncate", children: Z ? /* @__PURE__ */ e("span", { className: "text-sm text-text font-medium", children: Z.name }) : /* @__PURE__ */ e("span", { className: "text-sm text-text-muted", children: s }) }),
-          Z && !l && /* @__PURE__ */ e("button", { onClick: q, className: "p-1 hover:bg-surface-hover rounded", children: /* @__PURE__ */ e(ee, { icon: Se, size: "xs" }) })
+          /* @__PURE__ */ e("div", { className: "flex-grow truncate", children: Q ? /* @__PURE__ */ e("span", { className: "text-sm text-text font-medium", children: Q.name }) : /* @__PURE__ */ e("span", { className: "text-sm text-text-muted", children: s }) }),
+          Q && !l && /* @__PURE__ */ e("button", { onClick: q, className: "p-1 hover:bg-surface-hover rounded", children: /* @__PURE__ */ e(J, { icon: Se, size: "xs" }) })
         ]
       }
     ),
     a && /* @__PURE__ */ e(ue, { variant: "body", size: "xs", className: "text-danger-fg", children: a }),
     /* @__PURE__ */ e(
-      dt,
+      mt,
       {
         open: b,
         onClose: () => {
-          g(!1), C(null), P("/"), Y(!1);
+          g(!1), C(null), P("/"), X(!1);
         },
         title: h ? `Explorer: ${h.name}` : "Select Storage Mount",
         size: "lg",
         children: /* @__PURE__ */ e(
-          bn,
+          vn,
           {
             variant: "pills",
             items: [
@@ -4437,7 +4545,7 @@ const pn = ({
                         onClick: () => {
                           z && z !== "/" ? k() : C(null);
                         },
-                        leftIcon: /* @__PURE__ */ e(ee, { icon: Dt, size: "xs" }),
+                        leftIcon: /* @__PURE__ */ e(J, { icon: Dt, size: "xs" }),
                         children: z ? "Back" : "Back to Mounts"
                       }
                     ),
@@ -4457,8 +4565,8 @@ const pn = ({
                         se,
                         {
                           variant: "outline",
-                          onClick: () => Y(!0),
-                          leftIcon: /* @__PURE__ */ e(ee, { icon: At, size: "xs" }),
+                          onClick: () => X(!0),
+                          leftIcon: /* @__PURE__ */ e(J, { icon: Lt, size: "xs" }),
                           children: "New Folder"
                         }
                       ),
@@ -4467,7 +4575,7 @@ const pn = ({
                         {
                           variant: "primary",
                           onClick: () => S.current?.click(),
-                          leftIcon: /* @__PURE__ */ e(ee, { icon: Lt, size: "xs" }),
+                          leftIcon: /* @__PURE__ */ e(J, { icon: It, size: "xs" }),
                           loading: U,
                           children: "Upload"
                         }
@@ -4478,14 +4586,14 @@ const pn = ({
                           type: "file",
                           className: "hidden",
                           ref: S,
-                          onChange: $,
+                          onChange: A,
                           accept: o
                         }
                       )
                     ] })
                   ] }),
                   de && /* @__PURE__ */ c("div", { className: "flex items-center gap-2 p-3 bg-surface-sunk rounded-lg border border-border", children: [
-                    /* @__PURE__ */ e(ee, { icon: Ke, size: "sm", color: "warning" }),
+                    /* @__PURE__ */ e(J, { icon: Ke, size: "sm", color: "warning" }),
                     /* @__PURE__ */ e(
                       Ce,
                       {
@@ -4496,7 +4604,7 @@ const pn = ({
                       }
                     ),
                     /* @__PURE__ */ e(se, { onClick: oe, loading: U, children: "Create" }),
-                    /* @__PURE__ */ e(se, { variant: "ghost", onClick: () => Y(!1), children: "Cancel" })
+                    /* @__PURE__ */ e(se, { variant: "ghost", onClick: () => X(!1), children: "Cancel" })
                   ] }),
                   /* @__PURE__ */ e("div", { className: "max-h-100 overflow-auto rounded-lg border border-border", children: /* @__PURE__ */ e(
                     Ye,
@@ -4523,7 +4631,7 @@ const pn = ({
                 id: "local",
                 label: "Local File",
                 content: /* @__PURE__ */ e("div", { className: "space-y-6", children: /* @__PURE__ */ c("div", { className: "flex flex-col items-center justify-center py-12 border-2 border-dashed border-border rounded-xl bg-surface-sunk/50", children: [
-                  /* @__PURE__ */ e("div", { className: "p-4 bg-accent-soft rounded-full mb-4", children: /* @__PURE__ */ e(ee, { icon: je, size: "xl", color: "primary" }) }),
+                  /* @__PURE__ */ e("div", { className: "p-4 bg-accent-soft rounded-full mb-4", children: /* @__PURE__ */ e(J, { icon: je, size: "xl", color: "primary" }) }),
                   /* @__PURE__ */ e(ue, { variant: "label", size: "lg", weight: "semibold", children: "Select a file from your computer" }),
                   /* @__PURE__ */ c(
                     ue,
@@ -4554,7 +4662,7 @@ const pn = ({
                       {
                         type: "file",
                         className: "hidden",
-                        onChange: A,
+                        onChange: D,
                         accept: o,
                         disabled: U
                       }
@@ -4568,7 +4676,7 @@ const pn = ({
       }
     )
   ] });
-}, vn = {
+}, wn = {
   sm: "px-3 py-1.5 text-sm",
   md: "px-3 py-2 text-base",
   lg: "px-3 py-2 text-md",
@@ -4595,7 +4703,7 @@ const pn = ({
         {
           htmlFor: w,
           className: i(
-            ot,
+            it,
             p ? "text-danger-fg" : "text-text-muted",
             u
           ),
@@ -4612,10 +4720,10 @@ const pn = ({
             "aria-invalid": p || void 0,
             "aria-describedby": h,
             className: i(
-              ct,
+              dt,
               "resize-y leading-relaxed",
-              vn[s],
-              it(p),
+              wn[s],
+              ut(p),
               d
             ),
             ...f
@@ -4647,7 +4755,7 @@ function Ze(t, r) {
     t
   );
 }
-function yn(t, r, n) {
+function kn(t, r, n) {
   const s = r.split("."), a = Array.isArray(t) ? [...t] : { ...t };
   let l = a;
   for (let o = 0; o < s.length - 1; o++) {
@@ -4656,7 +4764,7 @@ function yn(t, r, n) {
   }
   return l[s[s.length - 1]] = n, a;
 }
-function Nn(t, r) {
+function Cn(t, r) {
   const n = r.split("."), s = Array.isArray(t) ? [...t] : { ...t };
   let a = s;
   for (let l = 0; l < n.length - 1; l++) {
@@ -4666,7 +4774,7 @@ function Nn(t, r) {
   }
   return delete a[n[n.length - 1]], s;
 }
-function wn({
+function Sn({
   title: t,
   description: r,
   className: n,
@@ -4680,7 +4788,7 @@ function wn({
     /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: s })
   ] });
 }
-const qs = ({
+const Xs = ({
   groups: t,
   data: r,
   onSubmit: n,
@@ -4702,12 +4810,12 @@ const qs = ({
     (x) => `${z}-${String(x).replace(/\./g, "-")}`,
     [z]
   ), [_, K] = R({}), [U, j] = R({});
-  X(() => {
+  Z(() => {
     r && C({ ...r });
   }, [r]);
   const B = xe(
-    (x, S, D) => {
-      const E = t.flatMap((A) => A.items).find((A) => A.name === x);
+    (x, S, $) => {
+      const E = t.flatMap((D) => D.items).find((D) => D.name === x);
       if (!E) return null;
       if (E.required && (S == null || S === ""))
         return `${E.label} is required`;
@@ -4717,65 +4825,65 @@ const qs = ({
         if (S && !Array.isArray(S))
           return `${E.label} must be an array.`;
         if (Array.isArray(S) && E.arrayFields) {
-          const A = [];
-          let $ = !1;
+          const D = [];
+          let A = !1;
           if (S.forEach((oe, ce) => {
             const q = {};
             for (const H of E.arrayFields) {
               const L = oe?.[H.name];
               if (H.required && (L == null || L === ""))
-                q[H.name] = `${H.label} is required`, $ = !0;
+                q[H.name] = `${H.label} is required`, A = !0;
               else if (H.validator) {
                 const k = H.validator(L, oe);
-                k && (q[H.name] = k, $ = !0);
+                k && (q[H.name] = k, A = !0);
               }
             }
-            A[ce] = q;
-          }), $)
-            return JSON.stringify(A);
+            D[ce] = q;
+          }), A)
+            return JSON.stringify(D);
         }
       }
-      return E.validator ? E.validator(S, D) : null;
+      return E.validator ? E.validator(S, $) : null;
     },
     [t]
   ), W = xe(
     (x, S) => {
-      let D = yn(h, x, S);
-      t.flatMap(($) => $.items).find(($) => $.name === x)?.removeIfEmpty && (S == null || S === "") && (D = Nn(D, x)), C(D), j(($) => ({ ...$, [x]: !0 }));
-      const A = B(x, S, D);
-      K(($) => ({
-        ...$,
-        [x]: A || ""
-      })), a?.(D, x);
+      let $ = kn(h, x, S);
+      t.flatMap((A) => A.items).find((A) => A.name === x)?.removeIfEmpty && (S == null || S === "") && ($ = Cn($, x)), C($), j((A) => ({ ...A, [x]: !0 }));
+      const D = B(x, S, $);
+      K((A) => ({
+        ...A,
+        [x]: D || ""
+      })), a?.($, x);
     },
     [h, t, B, a]
-  ), Z = xe(
+  ), Q = xe(
     async (x) => {
       if (x.preventDefault(), b) return;
-      const S = {}, D = t.flatMap((A) => A.items);
-      for (const A of D) {
-        if (A.hidden || A.conditional && !A.conditional(h))
+      const S = {}, $ = t.flatMap((D) => D.items);
+      for (const D of $) {
+        if (D.hidden || D.conditional && !D.conditional(h))
           continue;
-        const $ = B(
-          A.name,
-          Ze(h, A.name),
+        const A = B(
+          D.name,
+          Ze(h, D.name),
           h
         );
-        $ && (S[A.name] = $);
+        A && (S[D.name] = A);
       }
       if (o) {
-        const A = o(h);
-        A && Object.assign(S, A);
+        const D = o(h);
+        D && Object.assign(S, D);
       }
-      if (K(S), Object.keys(S).some((A) => S[A]))
+      if (K(S), Object.keys(S).some((D) => S[D]))
         return;
       const E = l ? l(h) : h;
       await n?.(h, E);
     },
     [h, t, B, o, l, n, b]
-  ), J = xe(
+  ), Y = xe(
     (x) => {
-      const S = Ze(h, x.name), D = U[x.name] ? _[x.name] : void 0, E = x.disabled || b, A = {
+      const S = Ze(h, x.name), $ = U[x.name] ? _[x.name] : void 0, E = x.disabled || b, D = {
         // Ties the field to the `<label>` the group wrapper renders; without it
         // labels are unassociated — screen readers announce nothing, clicking a
         // label focuses nothing, and tests cannot find a field by its label.
@@ -4797,11 +4905,11 @@ const qs = ({
           return /* @__PURE__ */ e(
             Ce,
             {
-              ...A,
-              onChange: ($) => W(x.name, $.target.value),
+              ...D,
+              onChange: (A) => W(x.name, A.target.value),
               type: x.textType || x.type,
               ...Xe(x.autocomplete),
-              error: D,
+              error: $,
               size: f
             }
           );
@@ -4809,27 +4917,27 @@ const qs = ({
           return /* @__PURE__ */ e(
             He,
             {
-              ...A,
-              onChange: ($) => W(x.name, $.target.value),
+              ...D,
+              onChange: (A) => W(x.name, A.target.value),
               rows: x.rows ?? 4,
-              error: D,
+              error: $,
               size: f
             }
           );
         case "select":
           return /* @__PURE__ */ e(
-            De,
+            $e,
             {
-              ...A,
-              onChange: ($) => W(x.name, $),
-              options: (x.options || []).map(($) => ({
-                ...$,
-                value: String($.value)
+              ...D,
+              onChange: (A) => W(x.name, A),
+              options: (x.options || []).map((A) => ({
+                ...A,
+                value: String(A.value)
               })),
               searchable: x.searchable,
               multiple: x.multiple,
               allowCreate: x.allowCreate,
-              error: D,
+              error: $,
               size: f
             }
           );
@@ -4838,14 +4946,14 @@ const qs = ({
         // open to learn what the choices even are.
         case "segmented":
           return /* @__PURE__ */ e(
-            sr,
+            lr,
             {
               "aria-label": x.label,
               value: S == null ? "" : String(S),
-              onChange: ($) => W(x.name, $),
-              options: (x.options || []).map(($) => ({
-                value: String($.value),
-                label: $.label
+              onChange: (A) => W(x.name, A),
+              options: (x.options || []).map((A) => ({
+                value: String(A.value),
+                label: A.label
               })),
               size: f === "sm" ? "sm" : "md",
               className: x.disabled ? "pointer-events-none opacity-50" : void 0
@@ -4855,15 +4963,15 @@ const qs = ({
           return /* @__PURE__ */ e(
             we,
             {
-              ...A,
+              ...D,
               label: x.label,
               checked: !!S,
-              onChange: ($) => W(x.name, $.target.checked),
+              onChange: (A) => W(x.name, A.target.checked),
               size: f
             }
           );
         case "radio":
-          return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: x.options?.map(($) => /* @__PURE__ */ c(
+          return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: x.options?.map((A) => /* @__PURE__ */ c(
             "label",
             {
               className: "flex cursor-pointer items-center gap-3 text-base text-text",
@@ -4873,67 +4981,67 @@ const qs = ({
                   {
                     type: "radio",
                     name: x.name,
-                    value: $.value,
-                    checked: S === $.value,
-                    onChange: () => W(x.name, $.value),
-                    disabled: E || $.disabled,
+                    value: A.value,
+                    checked: S === A.value,
+                    onChange: () => W(x.name, A.value),
+                    disabled: E || A.disabled,
                     className: "size-checkbox shrink-0 rounded-xs border border-border-strong bg-surface-input accent-accent focus-visible:outline-none focus-visible:focus-ring"
                   }
                 ),
-                $.label
+                A.label
               ]
             },
-            $.value
+            A.value
           )) });
         case "date":
           return /* @__PURE__ */ e(
             Be,
             {
-              ...A,
+              ...D,
               value: S ? new Date(S) : null,
-              onChange: ($) => W(x.name, $),
+              onChange: (A) => W(x.name, A),
               size: f
             }
           );
         case "file":
           return /* @__PURE__ */ e(
-            pn,
+            Nn,
             {
-              ...A,
+              ...D,
               value: S,
-              onChange: ($) => W(x.name, $),
-              error: D,
-              onListFiles: ($) => p?.http.invoke({
+              onChange: (A) => W(x.name, A),
+              error: $,
+              onListFiles: (A) => p?.http.invoke({
                 method: "POST",
                 action: "storage.file.list",
-                body: $
+                body: A
               }),
               onListMounts: () => p?.http.invoke({
                 method: "GET",
                 action: "storage.mount"
               }),
-              onUploadFile: ($) => p?.http.invoke({
+              onUploadFile: (A) => p?.http.invoke({
                 method: "POST",
                 action: "storage.file.upload",
-                body: $
+                body: A
               }),
-              onDownloadFile: ($) => p?.http.invoke({
+              onDownloadFile: (A) => p?.http.invoke({
                 method: "GET",
-                action: `storage.file.${$}.download`
+                action: `storage.file.${A}.download`
               }),
-              onRegisterFile: ($) => p?.http.invoke({
+              onRegisterFile: (A) => p?.http.invoke({
                 method: "POST",
                 action: "storage.file.folder",
-                body: $
+                body: A
               })
             }
           );
         case "folder":
           return /* @__PURE__ */ e(
-            hn,
+            gn,
             {
               value: S || {},
-              onChange: ($) => W(x.name, $),
+              onChange: (A) => W(x.name, A),
               onListFolders: () => p?.http.invoke({
                 method: "GET",
                 action: "storage.mount"
@@ -4946,34 +5054,34 @@ const qs = ({
         case "custom":
           return x.customComponent?.({
             value: S,
-            onChange: ($) => W(x.name, $),
-            error: D,
+            onChange: (A) => W(x.name, A),
+            error: $,
             disabled: E
           });
         case "array": {
-          const $ = S || [];
+          const A = S || [];
           let oe = [];
-          if (typeof D == "string" && D.startsWith("["))
+          if (typeof $ == "string" && $.startsWith("["))
             try {
-              oe = JSON.parse(D);
+              oe = JSON.parse($);
             } catch {
             }
           const ce = () => {
-            W(x.name, [...$, {}]);
+            W(x.name, [...A, {}]);
           }, q = (L) => {
             W(
               x.name,
-              $.filter((k, M) => M !== L)
+              A.filter((k, M) => M !== L)
             );
           }, H = (L, k, M) => {
-            const G = [...$];
+            const G = [...A];
             G[L] = {
               ...G[L],
               [k]: M
             }, W(x.name, G);
           };
           return /* @__PURE__ */ c("div", { className: "flex flex-col gap-2", children: [
-            $.map((L, k) => /* @__PURE__ */ c("div", { className: "flex items-start gap-2", children: [
+            A.map((L, k) => /* @__PURE__ */ c("div", { className: "flex items-start gap-2", children: [
               /* @__PURE__ */ e("div", { className: "grid flex-1 gap-2 sm:grid-cols-2", children: x.arrayFields?.map((M) => {
                 const G = oe?.[k]?.[M.name];
                 return /* @__PURE__ */ c("div", { className: "flex flex-col gap-1", children: [
@@ -5028,7 +5136,7 @@ const qs = ({
                         );
                       case "select":
                         return /* @__PURE__ */ e(
-                          De,
+                          $e,
                           {
                             ...O,
                             onChange: (N) => H(k, M.name, N),
@@ -5124,7 +5232,7 @@ const qs = ({
                   onClick: () => q(k),
                   disabled: E,
                   className: i("shrink-0", k === 0 && "mt-5"),
-                  children: /* @__PURE__ */ e(It, { className: "size-icon-md" })
+                  children: /* @__PURE__ */ e(Pt, { className: "size-icon-md" })
                 }
               )
             ] }, k)),
@@ -5133,7 +5241,7 @@ const qs = ({
               {
                 type: "button",
                 variant: "secondary",
-                leftIcon: /* @__PURE__ */ e(Pt, { className: "size-icon-sm" }),
+                leftIcon: /* @__PURE__ */ e(Ot, { className: "size-icon-sm" }),
                 onClick: ce,
                 disabled: E,
                 children: [
@@ -5155,7 +5263,7 @@ const qs = ({
         return null;
       const S = x.items.filter((E) => !(E.hidden || E.conditional && !E.conditional(h)));
       if (S.length === 0) return null;
-      const D = i(
+      const $ = i(
         x.layout === "flex" ? "flex flex-wrap gap-3.5" : "grid gap-3.5",
         x.layout !== "flex" && {
           "grid-cols-1": !x.columns || x.columns === 1,
@@ -5170,13 +5278,13 @@ const qs = ({
         // form *is* the page now, so a panel around each section would be a
         // second surface on top of the one it already sits on.
         /* @__PURE__ */ e(
-          wn,
+          Sn,
           {
             title: x.title,
             description: x.description,
             className: "not-last:border-b not-last:border-border-subtle",
-            children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: D, children: S.map((E) => {
-              const A = U[E.name] ? _[E.name] : void 0;
+            children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: $, children: S.map((E) => {
+              const D = U[E.name] ? _[E.name] : void 0;
               return /* @__PURE__ */ c(
                 "div",
                 {
@@ -5200,8 +5308,8 @@ const qs = ({
                         ]
                       }
                     ),
-                    J(E),
-                    E.help && !A && /* @__PURE__ */ e("p", { className: "text-xs leading-4 text-text-subtle", children: E.help })
+                    Y(E),
+                    E.help && !D && /* @__PURE__ */ e("p", { className: "text-xs leading-4 text-text-subtle", children: E.help })
                   ]
                 },
                 E.name
@@ -5212,8 +5320,8 @@ const qs = ({
         )
       );
     },
-    [h, U, _, J]
-  ), Y = i(
+    [h, U, _, Y]
+  ), X = i(
     {
       "max-w-settings": f === "sm",
       "max-w-form": f === "md",
@@ -5222,7 +5330,7 @@ const qs = ({
     },
     g
   ), y = f === "full" ? "md" : f;
-  return /* @__PURE__ */ c("form", { ref: w, onSubmit: Z, className: Y, children: [
+  return /* @__PURE__ */ c("form", { ref: w, onSubmit: Q, className: X, children: [
     !v && /* @__PURE__ */ e("button", { type: "submit", className: "hidden", tabIndex: -1, "aria-hidden": !0 }),
     /* @__PURE__ */ e("div", { className: "flex flex-col", children: t.map(de) }),
     v && /* @__PURE__ */ e("div", { className: "flex items-center gap-2 border-t border-border-subtle py-4", children: /* @__PURE__ */ c(Ee, { children: [
@@ -5254,7 +5362,7 @@ const qs = ({
     ] }) })
   ] });
 };
-function Vs({
+function Zs({
   label: t,
   value: r,
   onChange: n,
@@ -5271,8 +5379,8 @@ function Vs({
   const b = ne(null), [g, w] = R(null), p = async (h) => {
     if (!h) return;
     w(null);
-    const C = await Cn(h, s);
-    if (a && kn(C) > a) {
+    const C = await zn(h, s);
+    if (a && En(C) > a) {
       w(f);
       return;
     }
@@ -5331,11 +5439,11 @@ function Vs({
     )
   ] });
 }
-function kn(t) {
+function En(t) {
   const r = t.slice(t.indexOf(",") + 1), n = r.endsWith("==") ? 2 : r.endsWith("=") ? 1 : 0;
   return Math.floor(r.length * 3 / 4) - n;
 }
-function Cn(t, r) {
+function zn(t, r) {
   return new Promise((n, s) => {
     const a = new FileReader();
     a.onload = () => {
@@ -5353,7 +5461,7 @@ function Cn(t, r) {
     }, a.onerror = s, a.readAsDataURL(t);
   });
 }
-const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(Le, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), En = (t) => /* @__PURE__ */ e(Ae, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), zn = {
+const Ne = (...t) => t.filter(Boolean).join(" "), Mn = (t) => /* @__PURE__ */ e(Le, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), Tn = (t) => /* @__PURE__ */ e(De, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), An = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-base",
   lg: "h-control-lg px-3 text-base",
@@ -5363,14 +5471,14 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(
   md: "h-5 w-5",
   lg: "h-6 w-6",
   full: "h-6 w-6"
-}, Mn = ve(
+}, _n = ve(
   ({
     label: t,
     helperText: r,
     error: n,
     size: s = "md",
     fullWidth: a = !1,
-    startIcon: l = /* @__PURE__ */ e(Sn, {}),
+    startIcon: l = /* @__PURE__ */ e(Mn, {}),
     loading: o = !1,
     containerClassName: u,
     labelClassName: d,
@@ -5385,8 +5493,8 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(
     onChange: C,
     ...z
   }, P) => {
-    const _ = m || `searchfield-${Math.random().toString(36).substr(2, 9)}`, K = !!n, U = ne(null), j = ne(null), [B, W] = R(h || ""), [Z, J] = R(!1), [de, Y] = R(!1), [y, x] = R(!1);
-    X(() => {
+    const _ = m || `searchfield-${Math.random().toString(36).substr(2, 9)}`, K = !!n, U = ne(null), j = ne(null), [B, W] = R(h || ""), [Q, Y] = R(!1), [de, X] = R(!1), [y, x] = R(!1);
+    Z(() => {
       h !== void 0 && W(h);
     }, [h]);
     const S = pe(() => {
@@ -5396,38 +5504,38 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(
         (H) => String(H.label).toLowerCase().includes(q)
       );
     }, [B, f, p, y]);
-    X(() => {
+    Z(() => {
       if (!b || !B) {
-        Y(!1);
+        X(!1);
         return;
       }
       const q = setTimeout(async () => {
-        Y(!0);
+        X(!0);
         try {
           await b(String(B));
         } catch (H) {
           console.error("Remote search failed:", H);
         } finally {
-          Y(!1);
+          X(!1);
         }
       }, w);
       return () => {
-        clearTimeout(q), Y(!1);
+        clearTimeout(q), X(!1);
       };
-    }, [B, w, b]), X(() => {
+    }, [B, w, b]), Z(() => {
       const q = (H) => {
-        U.current && !U.current.contains(H.target) && J(!1);
+        U.current && !U.current.contains(H.target) && Y(!1);
       };
       return document.addEventListener("mousedown", q), () => document.removeEventListener("mousedown", q);
     }, []);
-    const D = (q) => {
+    const $ = (q) => {
       const H = q.target.value;
-      W(H), J(!0), x(!0), C && C(q);
+      W(H), Y(!0), x(!0), C && C(q);
     }, E = (q) => {
-      W(q.label), J(!1), x(!1), g && g(q.value);
-    }, A = () => {
-      (f.length > 0 || b) && (J(!0), x(!1));
-    }, $ = o || de, oe = Z && (S.length > 0 || $), ce = pe(() => P || j, [P]);
+      W(q.label), Y(!1), x(!1), g && g(q.value);
+    }, D = () => {
+      (f.length > 0 || b) && (Y(!0), x(!1));
+    }, A = o || de, oe = Q && (S.length > 0 || A), ce = pe(() => P || j, [P]);
     return /* @__PURE__ */ c(
       "div",
       {
@@ -5459,15 +5567,15 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(
                 ref: ce,
                 id: _,
                 value: B,
-                onChange: D,
-                onFocus: A,
+                onChange: $,
+                onFocus: D,
                 className: Ne(
                   // Base styles
                   "block w-full rounded-tile border bg-surface-input transition-colors duration-fast ease-out",
                   "placeholder:text-text-subtle focus-visible:outline-none focus-visible:focus-ring",
                   "disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled",
                   // Size styles
-                  zn[s],
+                  An[s],
                   // Icon padding
                   l ? "pl-10" : "",
                   "pr-10",
@@ -5479,21 +5587,21 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(
                 ...z
               }
             ),
-            /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: $ || o ? (
+            /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: A || o ? (
               // Loading Spinner
-              /* @__PURE__ */ e(Ot, { className: Ne("animate-spin text-info-fg", Re[s]), "aria-hidden": !0 })
+              /* @__PURE__ */ e(jt, { className: Ne("animate-spin text-info-fg", Re[s]), "aria-hidden": !0 })
             ) : (
               // Dropdown Chevron
               /* @__PURE__ */ e(
-                En,
+                Tn,
                 {
                   className: Ne(
                     "text-text-muted cursor-pointer transition-transform",
                     Re[s],
-                    Z ? "rotate-180" : "rotate-0"
+                    Q ? "rotate-180" : "rotate-0"
                   ),
                   onClick: () => {
-                    J((q) => (q || x(!1), !q));
+                    Y((q) => (q || x(!1), !q));
                   }
                 }
               )
@@ -5514,7 +5622,7 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(
                   children: q.label
                 },
                 q.value
-              )) : /* @__PURE__ */ e("li", { className: "px-4 py-2 text-text-muted", children: $ || o ? "Zoeken op afstand..." : "Geen resultaten gevonden." })
+              )) : /* @__PURE__ */ e("li", { className: "px-4 py-2 text-text-muted", children: A || o ? "Zoeken op afstand..." : "Geen resultaten gevonden." })
             }
           ),
           (n || r) && /* @__PURE__ */ e("p", { className: Ne("mt-1 text-xs", K ? "text-danger-fg" : "text-text-muted"), children: n || r }),
@@ -5527,8 +5635,8 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Sn = (t) => /* @__PURE__ */ e(
     );
   }
 );
-Mn.displayName = "SearchableTextField";
-const Tn = ve(
+_n.displayName = "SearchableTextField";
+const $n = ve(
   ({ checked: t, onChange: r, label: n, disabled: s = !1, className: a, ...l }, o) => {
     const u = /* @__PURE__ */ e(
       "span",
@@ -5581,25 +5689,25 @@ const Tn = ve(
     );
   }
 );
-Tn.displayName = "Switch";
-const $n = [
+$n.displayName = "Switch";
+const Dn = [
   { upTo: 1, cols: "grid-cols-1" },
   { upTo: 2, cols: "grid-cols-1 @[22rem]:grid-cols-2" },
   { upTo: 4, cols: "grid-cols-1 @[18rem]:grid-cols-2" },
   { upTo: 9, cols: "grid-cols-2 @[26rem]:grid-cols-3" }
-], _n = "grid-cols-2 @[26rem]:grid-cols-3 @[40rem]:grid-cols-4";
-function Dn(t) {
-  return $n.find((r) => t <= r.upTo)?.cols ?? _n;
+], Ln = "grid-cols-2 @[26rem]:grid-cols-3 @[40rem]:grid-cols-4";
+function In(t) {
+  return Dn.find((r) => t <= r.upTo)?.cols ?? Ln;
 }
-function An(t, r) {
+function Pn(t, r) {
   const n = r ?? t;
   if (t <= n) return { shown: t, hidden: 0 };
   const s = Math.max(0, n - 1);
   return { shown: s, hidden: t - s };
 }
-function Us({ tiles: t, pinned: r, maxStrip: n, className: s }) {
+function Qs({ tiles: t, pinned: r, maxStrip: n, className: s }) {
   if (r) {
-    const { shown: a, hidden: l } = An(t.length, n), o = t.slice(0, a);
+    const { shown: a, hidden: l } = Pn(t.length, n), o = t.slice(0, a);
     return /* @__PURE__ */ c("div", { className: i("@container flex h-full min-h-0 flex-col gap-2", s), children: [
       /* @__PURE__ */ e("div", { className: "min-h-0 flex-1", children: r }),
       t.length > 0 && // Fixed height as a share of the pane, with a floor so the strip
@@ -5618,14 +5726,14 @@ function Us({ tiles: t, pinned: r, maxStrip: n, className: s }) {
     {
       className: i(
         "@container grid h-full min-h-0 auto-rows-fr gap-2",
-        Dn(t.length),
+        In(t.length),
         s
       ),
       children: t.map((a, l) => /* @__PURE__ */ e("div", { className: "min-h-0 min-w-0", children: a }, l))
     }
   );
 }
-function Ws({
+function ea({
   name: t,
   avatarUrl: r,
   muted: n,
@@ -5652,23 +5760,23 @@ function Ws({
             alt: t,
             className: "aspect-square w-[38%] max-w-16 min-w-6 rounded-full object-cover"
           }
-        ) : /* @__PURE__ */ e("div", { className: "flex aspect-square w-[38%] max-w-16 min-w-6 items-center justify-center rounded-full bg-video-surface-strong", children: a ? /* @__PURE__ */ e(jt, { className: "w-1/2 h-1/2" }) : /* @__PURE__ */ e(Ft, { className: "w-1/2 h-1/2" }) }) }),
+        ) : /* @__PURE__ */ e("div", { className: "flex aspect-square w-[38%] max-w-16 min-w-6 items-center justify-center rounded-full bg-video-surface-strong", children: a ? /* @__PURE__ */ e(Ft, { className: "w-1/2 h-1/2" }) : /* @__PURE__ */ e(Rt, { className: "w-1/2 h-1/2" }) }) }),
         /* @__PURE__ */ c("div", { className: "absolute inset-x-2 bottom-2 flex w-fit max-w-[calc(100%-1rem)] items-center gap-1.5 rounded bg-video-overlay px-1.5 py-1 text-xs text-white", children: [
-          n ? /* @__PURE__ */ e(Rt, { className: "size-3 shrink-0" }) : /* @__PURE__ */ e(Bt, { className: "size-3 shrink-0" }),
+          n ? /* @__PURE__ */ e(Bt, { className: "size-3 shrink-0" }) : /* @__PURE__ */ e(Ht, { className: "size-3 shrink-0" }),
           /* @__PURE__ */ e("span", { className: "hidden truncate @[9rem]:inline", children: t })
         ] })
       ]
     }
   );
 }
-function Ks({
+function ta({
   attach: t,
   active: r = !0,
   mirrored: n = !1,
   className: s
 }) {
   const a = ne(null);
-  return X(() => {
+  return Z(() => {
     if (!r || !a.current) return;
     const l = t(a.current);
     return () => {
@@ -5686,7 +5794,7 @@ function Ks({
     }
   );
 }
-const Ln = () => /* @__PURE__ */ e(qe, { variant: "inline", shape: "menu" }), ut = ({ item: t, isSelectedHandler: r, onClick: n, depth: s = 0 }) => {
+const On = () => /* @__PURE__ */ e(qe, { variant: "inline", shape: "menu" }), ft = ({ item: t, isSelectedHandler: r, onClick: n, depth: s = 0 }) => {
   const a = !!(t.children && t.children.length > 0), l = r ? r(t.path) : !1;
   if (a)
     return /* @__PURE__ */ c("li", { children: [
@@ -5703,7 +5811,7 @@ const Ln = () => /* @__PURE__ */ e(qe, { variant: "inline", shape: "menu" }), ut
         }
       ),
       /* @__PURE__ */ e("ul", { className: "flex flex-col gap-px", children: t.children?.map((d, v) => /* @__PURE__ */ e(
-        ut,
+        ft,
         {
           item: d,
           isSelectedHandler: r,
@@ -5793,7 +5901,7 @@ const Ln = () => /* @__PURE__ */ e(qe, { variant: "inline", shape: "menu" }), ut
       ]
     }
   ) });
-}, Gs = ({
+}, ra = ({
   items: t,
   isSelectedHandler: r,
   onClick: n,
@@ -5801,12 +5909,12 @@ const Ln = () => /* @__PURE__ */ e(qe, { variant: "inline", shape: "menu" }), ut
   loading: a = !1
 }) => a ? /* @__PURE__ */ c("nav", { className: "flex h-full min-h-0 shrink-0 flex-col", children: [
   s && /* @__PURE__ */ e("div", { className: "pb-4", children: s }),
-  /* @__PURE__ */ e(Ln, {})
+  /* @__PURE__ */ e(On, {})
 ] }) : /* @__PURE__ */ c("nav", { className: "flex h-full min-h-0 shrink-0 flex-col", children: [
   s && /* @__PURE__ */ e("div", { className: "pb-4", children: s }),
   /* @__PURE__ */ e("ul", { className: "flex min-h-0 flex-1 flex-col gap-px overflow-y-auto", children: t.map(
     (l, o) => !l.path && !l.label && !l.children ? /* @__PURE__ */ e("li", { "aria-hidden": !0, className: "h-4" }, o) : /* @__PURE__ */ e(
-      ut,
+      ft,
       {
         item: l,
         isSelectedHandler: r,
@@ -5816,7 +5924,7 @@ const Ln = () => /* @__PURE__ */ e(qe, { variant: "inline", shape: "menu" }), ut
     )
   ) })
 ] });
-function Js({
+function na({
   open: t,
   title: r,
   description: n,
@@ -5828,7 +5936,7 @@ function Js({
   onCancel: d
 }) {
   return /* @__PURE__ */ e(
-    dt,
+    mt,
     {
       open: t,
       onClose: d,
@@ -5850,7 +5958,7 @@ function Js({
     }
   );
 }
-const In = {
+const jn = {
   none: "p-0",
   xs: "p-1",
   sm: "p-2",
@@ -5858,7 +5966,7 @@ const In = {
   lg: "p-6",
   xl: "p-8",
   "2xl": "p-12"
-}, Pn = {
+}, Fn = {
   none: "m-0",
   xs: "m-1",
   sm: "m-2",
@@ -5866,7 +5974,7 @@ const In = {
   lg: "m-6",
   xl: "m-8",
   "2xl": "m-12"
-}, On = {
+}, Rn = {
   none: "",
   primary: "bg-accent text-accent-fg",
   secondary: "bg-surface-hover",
@@ -5882,26 +5990,26 @@ const In = {
   backdrop: "bg-page",
   editor: "bg-surface",
   input: "bg-surface-input"
-}, jn = {
+}, Bn = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   xl: "rounded-xl",
   full: "rounded-full"
-}, Fn = {
+}, Hn = {
   none: "shadow-none",
   sm: "shadow-none",
   md: "shadow-overlay",
   lg: "shadow-overlay",
   xl: "shadow-modal",
   "2xl": "shadow-modal"
-}, Rn = {
+}, qn = {
   none: "border-0",
   sm: "border",
   md: "border-2",
   lg: "border-4"
-}, Bn = {
+}, Vn = {
   primary: "border-accent-border",
   secondary: "border-border",
   accent: "border-accent-border",
@@ -5911,7 +6019,7 @@ const In = {
   info: "border-info-border",
   neutral: "border-border-subtle",
   white: "border-border-subtle"
-}, mt = ve(
+}, ht = ve(
   ({
     padding: t,
     margin: r,
@@ -5928,13 +6036,13 @@ const In = {
     {
       ref: m,
       className: i(
-        t && In[t],
-        r && Pn[r],
-        n && On[n],
-        s && jn[s],
-        a && Fn[a],
-        l && Rn[l],
-        o && Bn[o],
+        t && jn[t],
+        r && Fn[r],
+        n && Rn[n],
+        s && Bn[s],
+        a && Hn[a],
+        l && qn[l],
+        o && Vn[o],
         u
       ),
       ...v,
@@ -5942,11 +6050,11 @@ const In = {
     }
   )
 );
-mt.displayName = "Box";
-const Ys = ({ children: t, title: r, ...n }) => /* @__PURE__ */ c(mt, { background: "module", radius: "lg", shadow: "none", border: "sm", borderColor: "neutral", ...n, children: [
+ht.displayName = "Box";
+const sa = ({ children: t, title: r, ...n }) => /* @__PURE__ */ c(ht, { background: "module", radius: "lg", shadow: "none", border: "sm", borderColor: "neutral", ...n, children: [
   r && /* @__PURE__ */ e("span", { className: "mb-2 block text-sm font-semibold text-text", children: r }),
   t
-] }), Hn = {
+] }), Un = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-base",
@@ -5955,13 +6063,13 @@ const Ys = ({ children: t, title: r, ...n }) => /* @__PURE__ */ c(mt, { backgrou
   "2xl": "text-2xl",
   "3xl": "text-3xl",
   "4xl": "text-3xl"
-}, qn = {
+}, Wn = {
   light: "font-normal",
   normal: "font-normal",
   medium: "font-medium",
   semibold: "font-semibold",
   bold: "font-bold"
-}, Vn = {
+}, Kn = {
   primary: "text-text",
   secondary: "text-text-muted",
   accent: "text-accent",
@@ -5971,11 +6079,11 @@ const Ys = ({ children: t, title: r, ...n }) => /* @__PURE__ */ c(mt, { backgrou
   info: "text-info-fg",
   neutral: "text-text",
   current: "text-current"
-}, Un = {
+}, Gn = {
   left: "text-left",
   center: "text-center",
   right: "text-right"
-}, Xs = ({
+}, aa = ({
   level: t = 1,
   size: r,
   weight: n = "semibold",
@@ -5988,16 +6096,16 @@ const Ys = ({ children: t, title: r, ...n }) => /* @__PURE__ */ c(mt, { backgrou
 }) => {
   const v = `h${t}`, m = i(
     "font-sans text-pretty",
-    Hn[r || Wn(t)],
-    qn[n],
-    Vn[s],
-    Un[a],
+    Un[r || Jn(t)],
+    Wn[n],
+    Kn[s],
+    Gn[a],
     l && "truncate",
     o
   );
   return /* @__PURE__ */ e(v, { className: m, ...d, children: u });
 };
-function Wn(t) {
+function Jn(t) {
   return {
     1: "2xl",
     2: "xl",
@@ -6008,103 +6116,109 @@ function Wn(t) {
   }[t] || "md";
 }
 const Qe = ["cat-1", "cat-2", "cat-3", "cat-4", "cat-5"];
-function Zs(t) {
+function la(t) {
   let r = 0;
   for (let n = 0; n < t.length; n++) r = r * 31 + t.charCodeAt(n) >>> 0;
   return Qe[r % Qe.length];
 }
 export {
-  ls as ArtifactView,
-  os as AssistantCard,
-  Nr as Avatar,
-  is as AvatarStack,
-  Kr as Badge,
-  mt as Box,
+  hs as ActivityAvatar,
+  xs as ActivityGlyph,
+  ms as ActivityRow,
+  cs as ArtifactView,
+  is as AssistantCard,
+  lt as Avatar,
+  us as AvatarStack,
+  Yr as Badge,
+  ht as Box,
   se as Button,
-  rs as ButtonGroup,
-  Ys as Card,
-  ds as ChannelBadge,
+  as as ButtonGroup,
+  sa as Card,
+  ps as ChannelBadge,
   we as Checkbox,
-  as as CommandPalette,
-  Js as ConfirmDialog,
+  os as CommandPalette,
+  na as ConfirmDialog,
   qe as ContentLoading,
   Be as DatePicker,
-  jr as Dropdown,
-  Ps as EmptyState,
-  Ls as ErrorBoundary,
-  Is as FederatedResource,
-  Qt as FilterChip,
-  hn as FolderSelect,
-  qs as Form,
-  wn as FormSection,
-  Xs as Heading,
-  hr as IDENTITY_TONE_COUNT,
-  ee as Icon,
-  us as Image,
-  Vs as ImageField,
-  Os as Kbd,
-  ms as KpiCard,
-  ss as Link,
-  hs as List,
-  fs as ListBulkAction,
-  Us as MeetingGrid,
-  xs as MessageBubble,
-  gs as MetaSeparator,
-  bs as MetaValue,
-  dt as Modal,
-  ps as Page,
-  $r as PageHeader,
-  vs as PageToolbar,
+  Br as Dropdown,
+  Vs as EmptyState,
+  Hs as ErrorBoundary,
+  qs as FederatedResource,
+  tr as FilterChip,
+  gn as FolderSelect,
+  Xs as Form,
+  Sn as FormSection,
+  aa as Heading,
+  br as IDENTITY_TONE_COUNT,
+  J as Icon,
+  vs as Image,
+  Zs as ImageField,
+  Us as Kbd,
+  ys as KpiCard,
+  ls as Link,
+  ws as List,
+  Ns as ListBulkAction,
+  Qs as MeetingGrid,
+  ks as MessageBubble,
+  Ss as MetaSeparator,
+  Cs as MetaValue,
+  mt as Modal,
+  Es as Page,
+  Dr as PageHeader,
+  zs as PageToolbar,
   ke as PageToolbarActions,
-  Ws as ParticipantTile,
-  tt as Popover,
-  js as ProgressBar,
+  ea as ParticipantTile,
+  rt as Popover,
+  Ws as ProgressBar,
   Me as RichText,
-  lt as SearchField,
-  Mn as SearchableTextField,
-  ys as SectionCaption,
-  Ns as SectionDivider,
-  sr as SegmentedToggle,
-  De as Select,
-  ws as SettingsFrameProvider,
-  Cs as SettingsPage,
-  Ss as SettingsRow,
-  Es as SettingsSection,
-  Gs as SidebarMenu,
-  zs as SourceChip,
-  Fs as Spinner,
-  rt as SplitButton,
-  Rs as StatusDot,
-  Bs as StepIndicator,
-  pn as StorageInput,
-  Tn as Switch,
-  Hs as TabBar,
+  bs as RowCard,
+  ct as SearchField,
+  _n as SearchableTextField,
+  Ms as SectionCaption,
+  Ts as SectionDivider,
+  lr as SegmentedToggle,
+  $e as Select,
+  As as SettingsFrameProvider,
+  $s as SettingsPage,
+  Ds as SettingsRow,
+  Ls as SettingsSection,
+  ra as SidebarMenu,
+  Is as SourceChip,
+  Ks as Spinner,
+  nt as SplitButton,
+  Gs as StatusDot,
+  Js as StepIndicator,
+  Nn as StorageInput,
+  $n as Switch,
+  Ys as TabBar,
   Ye as Table,
-  bn as Tabs,
+  vn as Tabs,
   ue as Text,
   He as TextArea,
   Ce as TextField,
-  Ks as VideoSurface,
-  As as View,
+  gs as TimelineEvent,
+  ta as VideoSurface,
+  Bs as View,
   Xe as autofillProps,
-  Gr as badgeColumn,
-  _s as booleanBadgeColumn,
-  Zs as catTone,
+  Xr as badgeColumn,
+  Fs as booleanBadgeColumn,
+  fs as cardActionClass,
+  la as catTone,
   i as cn,
-  ts as createSizes,
-  es as createVariants,
-  Ms as dateFilterHandler,
-  cs as identityDotClass,
-  st as identityPlateClass,
-  nt as identityTone,
-  Ds as labelsColumn,
-  $s as multiSelectFilterHandler,
-  un as normalizeText,
-  ns as resolveLucideIcon,
-  Ts as selectFilterHandler,
+  ss as createSizes,
+  ns as createVariants,
+  Ps as dateFilterHandler,
+  ds as identityDotClass,
+  at as identityPlateClass,
+  st as identityTone,
+  Rs as labelsColumn,
+  js as multiSelectFilterHandler,
+  hn as normalizeText,
+  Jt as resolveLucideIcon,
+  Os as selectFilterHandler,
   _e as text,
   Pe as useAnchoredPosition,
-  Ar as useSettingsFrame,
-  ks as useSettingsFrameHost
+  Pr as useSettingsFrame,
+  _s as useSettingsFrameHost
 };
 //# sourceMappingURL=index.js.map