@opencxh/ui-kit 3.172.0 → 3.175.1

package/dist/index.js

@@ -1,8 +1,8 @@
 import { clsx as gt } from "clsx";
-import oe, { useState as B, useLayoutEffect as pt, useRef as re, useEffect as J, forwardRef as ve, useMemo as pe, useCallback as xe, createContext as et, useId as vt, useContext as yt, Component as Nt } from "react";
+import ae, { useState as R, useLayoutEffect as pt, useRef as ne, useEffect as X, forwardRef as ve, useMemo as pe, useCallback as xe, createContext as et, useId as vt, useContext as yt, Component as Nt } from "react";
 import { jsxs as c, jsx as e, Fragment as Ee } from "react/jsx-runtime";
 import * as wt from "lucide-react";
-import { VideoOff as kt, User as Ct, MicOff as St, Mic as Et, X as Se, ChevronDown as De, ExternalLink as zt, Calendar as Mt, ChevronLeft as ze, ChevronRight as Le, ChevronDownIcon as Tt, Loader2 as _t, Search as Ie, Check as Ue, ChevronUp as $t, Ellipsis as At, FileText as je, HardDrive as We, ArrowLeft as Dt, FolderPlus as Lt, Upload as It, Folder as Ke, Trash2 as Pt, Plus as Ot, Sparkles as jt, ImageOff as Ft, Pencil as Rt, ArrowUpRight as Bt } from "lucide-react";
+import { VideoOff as kt, User as Ct, MicOff as St, Mic as Et, X as Se, ChevronDown as Ae, ExternalLink as zt, Calendar as Mt, ChevronLeft as ze, ChevronRight as Le, ChevronDownIcon as Tt, Loader2 as $t, Search as Ie, Check as Ue, ChevronUp as _t, Ellipsis as Dt, FileText as je, HardDrive as We, ArrowLeft as At, FolderPlus as Lt, Upload as It, Folder as Ke, Trash2 as Pt, Plus as Ot, Sparkles as jt, ImageOff as Ft, Pencil as Rt, ArrowUpRight as Bt } from "lucide-react";
 import Ht from "dompurify";
 import qt from "react-markdown";
 import Vt from "remark-gfm";
@@ -16,14 +16,14 @@ function ts(t) {
   return (r) => t[r] || "";
 }
 function Pe(t, r, { gap: n = 6, matchWidth: s = !1, placement: a = "bottom-start" } = {}) {
-  const [l, o] = B({});
+  const [l, o] = R({});
   return pt(() => {
     if (!t) return;
     const u = () => {
       const d = r.current;
       if (!d) return;
-      const v = d.getBoundingClientRect(), m = window.innerHeight - v.bottom, f = v.top, b = a.startsWith("top"), g = b ? f < 200 && m > f : m < 200 && f > m, N = b !== g, p = { position: "fixed" };
-      N ? (p.bottom = window.innerHeight - v.top + n, p.maxHeight = Math.max(120, f - n * 2)) : (p.top = v.bottom + n, p.maxHeight = Math.max(120, m - n * 2)), a.endsWith("end") ? p.right = window.innerWidth - v.right : p.left = v.left, s && (p.width = v.width), o(p);
+      const v = d.getBoundingClientRect(), m = window.innerHeight - v.bottom, f = v.top, b = a.startsWith("top"), g = b ? f < 200 && m > f : m < 200 && f > m, w = b !== g, p = { position: "fixed" };
+      w ? (p.bottom = window.innerHeight - v.top + n, p.maxHeight = Math.max(120, f - n * 2)) : (p.top = v.bottom + n, p.maxHeight = Math.max(120, m - n * 2)), a.endsWith("end") ? p.right = window.innerWidth - v.right : p.left = v.left, s && (p.width = v.width), o(p);
     };
     return u(), window.addEventListener("scroll", u, !0), window.addEventListener("resize", u), () => {
       window.removeEventListener("scroll", u, !0), window.removeEventListener("resize", u);
@@ -66,7 +66,7 @@ function ns(t) {
   for (let n = 0; n < t.length; n++) r = r * 31 + t.charCodeAt(n) >>> 0;
   return Ge[r % Ge.length];
 }
-const $e = (t) => t == null ? "" : String(t), Jt = (t) => $e(t).trim().toLowerCase(), Yt = [
+const _e = (t) => t == null ? "" : String(t), Jt = (t) => _e(t).trim().toLowerCase(), Yt = [
   { 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" },
@@ -136,8 +136,8 @@ function as({
   );
 }
 function ls({ attach: t, active: r = !0, mirrored: n = !1, className: s }) {
-  const a = re(null);
-  return J(() => {
+  const a = ne(null);
+  return X(() => {
     if (!r || !a.current) return;
     const l = t(a.current);
     return () => {
@@ -288,7 +288,7 @@ const nr = {
   info: "text-info-fg",
   neutral: "text-text-subtle",
   current: "text-current"
-}, Q = ({
+}, ee = ({
   icon: t,
   size: r = "md",
   color: n = "current",
@@ -341,21 +341,21 @@ const nt = ({
   disabled: o = !1,
   triggerLabel: u
 }) => {
-  const [d, v] = B(!1), m = re(null), f = re(null), b = Pe(d, f, { placement: n });
-  J(() => {
+  const [d, v] = R(!1), m = ne(null), f = ne(null), b = Pe(d, f, { placement: n });
+  X(() => {
     if (!d) return;
     const p = (C) => {
       m.current && !m.current.contains(C.target) && v(!1);
-    }, x = (C) => {
+    }, h = (C) => {
       C.key === "Escape" && v(!1);
     };
-    return document.addEventListener("mousedown", p), document.addEventListener("keydown", x), () => {
-      document.removeEventListener("mousedown", p), document.removeEventListener("keydown", x);
+    return document.addEventListener("mousedown", p), document.addEventListener("keydown", h), () => {
+      document.removeEventListener("mousedown", p), document.removeEventListener("keydown", h);
     };
   }, [d]);
   const g = (p) => {
-    p.stopPropagation(), !o && v((x) => !x);
-  }, N = () => v(!1);
+    p.stopPropagation(), !o && v((h) => !h);
+  }, w = () => v(!1);
   return /* @__PURE__ */ c("div", { ref: m, className: i("relative inline-flex", a), children: [
     /* @__PURE__ */ e(
       "button",
@@ -384,7 +384,7 @@ const nt = ({
           s
         ),
         style: b,
-        children: typeof r == "function" ? r(N) : r
+        children: typeof r == "function" ? r(w) : r
       }
     )
   ] });
@@ -426,36 +426,36 @@ function cr({
   title: b,
   className: g
 }) {
-  const N = l && !!v, p = s === "pill" ? "rounded-full" : "rounded-md", x = lr({ 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 = lr({ active: l, tone: n, shape: s, size: a, className: g }), C = /* @__PURE__ */ c(Ee, { children: [
     r,
     t,
-    o && /* @__PURE__ */ e(Q, { icon: De, size: "xs" })
-  ] }), S = or({ shape: s, withClear: N }), I = N && /* @__PURE__ */ e(
+    o && /* @__PURE__ */ e(ee, { icon: Ae, size: "xs" })
+  ] }), z = or({ shape: s, withClear: w }), P = w && /* @__PURE__ */ e(
     "button",
     {
       type: "button",
       "aria-label": m,
       onClick: v,
       className: i("inline-flex h-full items-center pr-3 focus-visible:outline-none focus-visible:focus-ring", p),
-      children: /* @__PURE__ */ e(Q, { icon: Se, size: "xs" })
+      children: /* @__PURE__ */ e(ee, { icon: Se, size: "xs" })
     }
   );
-  return u ? /* @__PURE__ */ c("span", { className: x, title: b, children: [
+  return u ? /* @__PURE__ */ c("span", { className: h, title: b, children: [
     /* @__PURE__ */ e(
       nt,
       {
         trigger: C,
         rootClassName: "h-full",
-        triggerClassName: i(S, "h-full"),
+        triggerClassName: i(z, "h-full"),
         className: i("min-w-menu p-1.5", d),
         children: u
       }
     ),
-    I
-  ] }) : N ? /* @__PURE__ */ c("span", { className: x, title: b, children: [
-    /* @__PURE__ */ e("button", { type: "button", onClick: f, className: S, children: C }),
-    I
-  ] }) : /* @__PURE__ */ e("button", { type: "button", title: b, onClick: f, className: i(x, S), children: C });
+    P
+  ] }) : w ? /* @__PURE__ */ c("span", { className: h, title: b, children: [
+    /* @__PURE__ */ e("button", { type: "button", onClick: f, className: z, children: C }),
+    P
+  ] }) : /* @__PURE__ */ e("button", { type: "button", title: b, onClick: f, className: i(h, z), children: C });
 }
 const ir = {
   xs: "text-xs",
@@ -629,7 +629,7 @@ function st({
                 xr[s],
                 m && "cursor-not-allowed opacity-50"
               ),
-              children: /* @__PURE__ */ e(De, { className: "size-icon-md" })
+              children: /* @__PURE__ */ e(Ae, { className: "size-icon-md" })
             }
           ),
           children: (b) => /* @__PURE__ */ e(Ee, { children: l.map((g) => /* @__PURE__ */ c(
@@ -685,14 +685,14 @@ const br = {
     id: d,
     ...v
   }, m) => {
-    const f = oe.useId(), b = d || `checkbox-${f}`, g = !!n, N = oe.useRef(null), p = oe.useCallback(
-      (x) => {
-        N.current = x, typeof m == "function" ? m(x) : m && typeof m == "object" && (m.current = x);
+    const f = ae.useId(), b = d || `checkbox-${f}`, g = !!n, w = ae.useRef(null), p = ae.useCallback(
+      (h) => {
+        w.current = h, typeof m == "function" ? m(h) : m && typeof m == "object" && (m.current = h);
       },
       [m]
     );
-    return oe.useEffect(() => {
-      N.current && (N.current.indeterminate = a);
+    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", gr[s]), children: [
         /* @__PURE__ */ e(
@@ -787,14 +787,14 @@ const vr = {
   children: f,
   ...b
 }) => {
-  const g = v || Cr(t), N = t === "caption", p = t === "label", x = t === "code", C = i(
+  const g = v || Cr(t), w = t === "caption", p = t === "label", h = t === "code", C = i(
     "font-sans",
     // Variant — caption and label pin their own size/weight
-    N && "text-xs text-text-subtle",
+    w && "text-xs text-text-subtle",
     p && "text-xs font-semibold uppercase tracking-label text-text-subtle",
-    x && "font-mono text-sm rounded-sm bg-surface-hover px-1 py-0.5",
+    h && "font-mono text-sm rounded-sm bg-surface-hover px-1 py-0.5",
     // Size — only where the variant does not pin it
-    !N && !p && !x && vr[r],
+    !w && !p && !h && vr[r],
     // Weight — label owns its weight
     !p && yr[n],
     Nr[s],
@@ -830,12 +830,12 @@ function ds({
   removeLabel: m = "Remove",
   tooLargeLabel: f = "That image is too large."
 }) {
-  const b = re(null), [g, N] = B(null), p = async (x) => {
-    if (!x) return;
-    N(null);
-    const C = await Er(x, s);
+  const b = ne(null), [g, w] = R(null), p = async (h) => {
+    if (!h) return;
+    w(null);
+    const C = await Er(h, s);
     if (a && Sr(C) > a) {
-      N(f);
+      w(f);
       return;
     }
     n(C);
@@ -872,7 +872,7 @@ function ds({
               variant: "ghost",
               disabled: u,
               onClick: () => {
-                N(null), n(void 0);
+                w(null), n(void 0);
               },
               children: m
             }
@@ -888,7 +888,7 @@ function ds({
         type: "file",
         accept: "image/png,image/jpeg,image/webp",
         className: "hidden",
-        onChange: (x) => void p(x.target.files?.[0])
+        onChange: (h) => void p(h.target.files?.[0])
       }
     )
   ] });
@@ -915,7 +915,7 @@ function Er(t, r) {
     }, a.onerror = s, a.readAsDataURL(t);
   });
 }
-const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }), Mr = () => /* @__PURE__ */ e(Q, { icon: ze, size: "md", color: "current" }), Tr = () => /* @__PURE__ */ e(Q, { icon: Le, size: "md", color: "current" }), Be = ve(({
+const zr = () => /* @__PURE__ */ e(ee, { icon: Mt, size: "md", color: "current" }), Mr = () => /* @__PURE__ */ e(ee, { icon: ze, size: "md", color: "current" }), Tr = () => /* @__PURE__ */ e(ee, { icon: Le, size: "md", color: "current" }), Be = ve(({
   value: t,
   onChange: r,
   placeholder: n = "Select date",
@@ -928,47 +928,47 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
   format: v = "MM/dd/yyyy",
   withTime: m = !1
 }, f) => {
-  const [b, g] = B(!1), [N, p] = B(() => t || /* @__PURE__ */ new Date()), x = re(null), C = re(null), S = Pe(b, C);
-  J(() => {
-    const h = (z) => {
-      x.current && !x.current.contains(z.target) && g(!1);
+  const [b, g] = R(!1), [w, p] = R(() => t || /* @__PURE__ */ new Date()), h = ne(null), C = ne(null), z = Pe(b, C);
+  X(() => {
+    const y = (x) => {
+      h.current && !h.current.contains(x.target) && g(!1);
     };
-    return b && document.addEventListener("mousedown", h), () => {
-      document.removeEventListener("mousedown", h);
+    return b && document.addEventListener("mousedown", y), () => {
+      document.removeEventListener("mousedown", y);
     };
   }, [b]);
-  const I = (h) => {
-    if (!h) return "";
-    const z = h.getDate().toString().padStart(2, "0"), k = (h.getMonth() + 1).toString().padStart(2, "0"), $ = h.getFullYear(), y = v === "dd/MM/yyyy" ? `${z}/${k}/${$}` : v === "yyyy-MM-dd" ? `${$}-${k}-${z}` : `${k}/${z}/${$}`;
-    return m ? `${y} ${A(h)}` : y;
-  }, A = (h) => `${h.getHours().toString().padStart(2, "0")}:${h.getMinutes().toString().padStart(2, "0")}`, K = (h) => {
-    const [z, k] = h.split(":").map(Number);
-    if (Number.isNaN(z) || Number.isNaN(k)) return;
-    const $ = t ? new Date(t) : /* @__PURE__ */ new Date();
-    $.setHours(z, k, 0, 0), r?.($);
-  }, W = () => {
-    const h = N.getFullYear(), z = N.getMonth(), k = new Date(h, z, 1), $ = new Date(k);
-    $.setDate($.getDate() - k.getDay());
-    const y = [], H = new Date($);
-    for (let ae = 0; ae < 42; ae++)
-      y.push(new Date(H)), H.setDate(H.getDate() + 1);
-    return y;
-  }, D = (h) => {
-    if (h.getMonth() === N.getMonth() && !(u && h < u) && !(d && h > d)) {
+  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}`;
+    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);
+  }, 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);
+    return E;
+  }, j = (y) => {
+    if (y.getMonth() === w.getMonth() && !(u && y < u) && !(d && y > d)) {
       if (m) {
-        const k = new Date(h);
-        k.setHours(t?.getHours() ?? 0, t?.getMinutes() ?? 0, 0, 0), r?.(k);
+        const S = new Date(y);
+        S.setHours(t?.getHours() ?? 0, t?.getMinutes() ?? 0, 0, 0), r?.(S);
         return;
       }
-      r?.(h), g(!1);
+      r?.(y), g(!1);
     }
-  }, V = () => {
-    p(new Date(N.getFullYear(), N.getMonth() - 1, 1));
-  }, ne = () => {
-    p(new Date(N.getFullYear(), N.getMonth() + 1, 1));
-  }, Y = () => {
+  }, B = () => {
+    p(new Date(w.getFullYear(), w.getMonth() - 1, 1));
+  }, W = () => {
+    p(new Date(w.getFullYear(), w.getMonth() + 1, 1));
+  }, Z = () => {
     r?.(null), g(!1);
-  }, X = i(
+  }, J = i(
     "w-full border border-border-strong rounded-tile transition-colors duration-fast",
     "bg-surface text-text",
     "placeholder:text-text-muted",
@@ -981,7 +981,7 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
       "h-control-md w-full px-3 text-base": l === "full"
     },
     o
-  ), de = W(), w = [
+  ), de = U(), Y = [
     "January",
     "February",
     "March",
@@ -995,20 +995,20 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
     "November",
     "December"
   ];
-  return /* @__PURE__ */ c("div", { ref: x, className: "relative", children: [
+  return /* @__PURE__ */ c("div", { ref: h, className: "relative", children: [
     /* @__PURE__ */ c("div", { ref: C, className: "relative", children: [
       /* @__PURE__ */ e(
         "input",
         {
           ref: f,
           type: "text",
-          value: I(t ?? null),
+          value: P(t ?? null),
           placeholder: n,
           disabled: s,
           required: a,
           readOnly: !0,
           onClick: () => !s && g(!b),
-          className: i(X, "pr-10 cursor-pointer")
+          className: i(J, "pr-10 cursor-pointer")
         }
       ),
       /* @__PURE__ */ e(
@@ -1022,50 +1022,50 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
         }
       )
     ] }),
-    b && /* @__PURE__ */ c("div", { style: S, className: "fixed z-overlay overflow-auto rounded-lg border border-border bg-surface p-4 shadow-overlay min-w-panel", children: [
+    b && /* @__PURE__ */ c("div", { style: z, 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: V,
+            onClick: B,
             className: "p-1 hover:bg-surface-hover rounded",
             children: /* @__PURE__ */ e(Mr, {})
           }
         ),
         /* @__PURE__ */ c("h3", { className: "text-sm font-medium text-text", children: [
-          w[N.getMonth()],
+          Y[w.getMonth()],
           " ",
-          N.getFullYear()
+          w.getFullYear()
         ] }),
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: ne,
+            onClick: W,
             className: "p-1 hover:bg-surface-hover rounded",
             children: /* @__PURE__ */ e(Tr, {})
           }
         )
       ] }),
-      /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1 mb-2", children: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((h) => /* @__PURE__ */ e("div", { className: "text-xs font-medium text-text-muted text-center py-1", children: h }, h)) }),
-      /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1", children: de.map((h, z) => {
-        const k = h.getMonth() === N.getMonth(), $ = t && h.toDateString() === t.toDateString(), y = h.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), H = !k || u && h < u || d && h > d;
+      /* @__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;
         return /* @__PURE__ */ e(
           "button",
           {
-            onClick: () => !H && D(h),
-            disabled: H,
+            onClick: () => !A && j(y),
+            disabled: A,
             className: i(
               "w-8 h-8 text-sm rounded transition-colors duration-fast",
               {
-                "text-text hover:bg-surface-hover": k && !$ && !H,
-                "bg-accent text-accent-fg": $,
-                "bg-surface-hover text-text": y && !$,
-                "text-text-muted cursor-not-allowed": H
+                "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
               }
             ),
-            children: h.getDate()
+            children: y.getDate()
           },
-          z
+          x
         );
       }) }),
       m && /* @__PURE__ */ c("div", { className: "mt-3 flex items-center gap-2 border-t border-border pt-3", children: [
@@ -1075,8 +1075,8 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
           {
             id: "datepicker-time",
             type: "time",
-            value: t ? A(t) : "",
-            onChange: (h) => K(h.target.value),
+            value: t ? _(t) : "",
+            onChange: (y) => K(y.target.value),
             className: "h-control-sm rounded-md border border-border bg-surface-input px-2 text-sm text-text focus-visible:outline-none focus-visible:focus-ring"
           }
         )
@@ -1085,7 +1085,7 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: Y,
+            onClick: Z,
             className: "text-sm text-text-muted hover:text-text",
             children: "Clear"
           }
@@ -1101,12 +1101,12 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
       ] })
     ] })
   ] });
-}), _r = {
+}), $r = {
   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"
-}, Me = Jt, Ae = ve(
+}, Me = Jt, De = ve(
   ({
     label: t,
     helperText: r,
@@ -1122,84 +1122,84 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
     id: f,
     searchable: b,
     multiple: g,
-    value: N,
+    value: w,
     onChange: p,
-    allowCreate: x,
+    allowCreate: h,
     onCreateOption: C,
-    ...S
-  }, I) => {
-    const A = f || `select-${Math.random().toString(36).substr(2, 9)}`, K = !!n, [W, D] = oe.useState(!1), [V, ne] = oe.useState(""), Y = oe.useRef(null), X = oe.useRef(null), de = Pe(W, X, { matchWidth: !0 }), [w, h] = oe.useState(o);
-    oe.useImperativeHandle(I, () => Y.current), oe.useEffect(() => {
-      const M = (E) => {
-        Y.current && !Y.current.contains(E.target) && D(!1);
+    ...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 L = (k) => {
+        Z.current && !Z.current.contains(k.target) && j(!1);
       };
-      return document.addEventListener("mousedown", M), () => document.removeEventListener("mousedown", M);
+      return document.addEventListener("mousedown", L), () => document.removeEventListener("mousedown", L);
     }, []);
-    const z = oe.useCallback(
-      (M, E) => M.some(
-        (P) => Me(P.value) === Me(E) || Me(P.label) === Me(E)
+    const x = ae.useCallback(
+      (L, k) => L.some(
+        (M) => Me(M.value) === Me(k) || Me(M.label) === Me(k)
       ),
       []
-    ), k = oe.useCallback(
-      (M, E) => {
-        const P = [...M], j = (q) => {
-          const T = $e(q).trim();
-          T && (z(P, T) || P.push({ value: T, label: T }));
+    ), S = ae.useCallback(
+      (L, k) => {
+        const M = [...L], G = (O) => {
+          const N = _e(O).trim();
+          N && (x(M, N) || M.push({ value: N, label: N }));
         };
-        return Array.isArray(E) ? E.forEach(j) : j(E), P;
+        return Array.isArray(k) ? k.forEach(G) : G(k), M;
       },
-      [z]
+      [x]
     );
-    oe.useEffect(() => {
-      h((M) => {
-        const E = [...o];
-        return M.forEach((P) => {
-          !z(E, P.value) && !z(E, P.label) && E.push(P);
-        }), k(E, N);
+    ae.useEffect(() => {
+      y((L) => {
+        const k = [...o];
+        return L.forEach((M) => {
+          !x(k, M.value) && !x(k, M.label) && k.push(M);
+        }), S(k, w);
       });
-    }, [o, N, k, z]);
-    const $ = oe.useMemo(
-      () => Array.isArray(N) ? N.map($e) : N == null ? void 0 : $e(N),
-      [N]
-    ), y = (M) => {
+    }, [o, w, S, x]);
+    const D = ae.useMemo(
+      () => Array.isArray(w) ? w.map(_e) : w == null ? void 0 : _e(w),
+      [w]
+    ), E = (L) => {
       if (g) {
-        const E = Array.isArray($) ? $ : [], P = E.includes(M) ? E.filter((j) => j !== M) : [...E, M];
-        p?.(P);
+        const k = Array.isArray(D) ? D : [], M = k.includes(L) ? k.filter((G) => G !== L) : [...k, L];
+        p?.(M);
       } else
-        p?.(M), D(!1), ne("");
-    }, H = g ? null : w.find((M) => M.value === $), ae = g ? w.filter(
-      (M) => Array.isArray($) && $.includes(M.value)
-    ) : [], ce = b && V ? w.filter(
-      (M) => M.label.toLowerCase().includes(V.toLowerCase())
-    ) : w, G = !!x && !!b && !!V.trim() && !z(w, V), O = (M) => {
-      const E = M.trim();
-      if (!E) return;
-      const P = C?.(E) ?? {
-        value: E,
-        label: E
+        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(
+      (L) => L.label.toLowerCase().includes(B.toLowerCase())
+    ) : Y, ce = !!h && !!b && !!B.trim() && !x(Y, B), q = (L) => {
+      const k = L.trim();
+      if (!k) return;
+      const M = C?.(k) ?? {
+        value: k,
+        label: k
       };
-      if (z(w, P.value) || z(w, P.label)) {
-        y(P.value), ne(""), g || D(!1);
+      if (x(Y, M.value) || x(Y, M.label)) {
+        E(M.value), W(""), g || j(!1);
         return;
       }
-      h((j) => [...j, P]), y(P.value), ne(""), g || D(!1);
-    }, F = () => g ? ae.length > 0 ? ae.map((M) => M.label).join(", ") : u || "Select options" : H?.label || u || "Select an option";
+      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";
     return /* @__PURE__ */ c(
       "div",
       {
-        ref: Y,
+        ref: Z,
         className: i(
           "relative flex flex-col",
           a && "w-full",
           d
         ),
-        ...S,
+        ...z,
         children: [
           t && /* @__PURE__ */ e(
             "label",
             {
-              htmlFor: A,
-              onClick: () => D(!W),
+              htmlFor: _,
+              onClick: () => j(!U),
               className: i(
                 "block text-xs font-semibold uppercase tracking-label mb-1.5",
                 K ? "text-danger-fg" : "text-text-muted",
@@ -1212,45 +1212,45 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
             /* @__PURE__ */ c(
               "button",
               {
-                ref: X,
+                ref: J,
                 type: "button",
-                id: A,
+                id: _,
                 disabled: l,
-                onClick: () => D(!W),
+                onClick: () => j(!U),
                 className: i(
                   "flex w-full items-center justify-between gap-2 rounded-tile border transition-colors duration-fast text-left",
                   "focus-visible:outline-none focus-visible:focus-ring",
                   "disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled",
                   "bg-surface",
-                  _r[s],
+                  $r[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: F() }),
+                  /* @__PURE__ */ e("span", { className: "truncate flex-1 min-w-0", children: H() }),
                   /* @__PURE__ */ e(
                     Tt,
                     {
                       size: 16,
                       className: i(
                         "shrink-0 opacity-60 transition-transform duration-fast",
-                        W && "rotate-180"
+                        U && "rotate-180"
                       )
                     }
                   )
                 ]
               }
             ),
-            W && /* @__PURE__ */ c("div", { style: de, className: "fixed z-overlay flex flex-col overflow-hidden rounded-lg border border-border bg-surface shadow-overlay", children: [
+            U && /* @__PURE__ */ c("div", { style: de, className: "fixed z-overlay flex flex-col overflow-hidden rounded-lg border border-border bg-surface shadow-overlay", children: [
               b && /* @__PURE__ */ e("div", { className: "p-2", children: /* @__PURE__ */ e(
                 "input",
                 {
                   type: "text",
                   placeholder: "Search...",
-                  value: V,
-                  onChange: (M) => ne(M.target.value),
-                  onKeyDown: (M) => {
-                    M.key === "Enter" && G && (M.preventDefault(), O(V));
+                  value: B,
+                  onChange: (L) => W(L.target.value),
+                  onKeyDown: (L) => {
+                    L.key === "Enter" && ce && (L.preventDefault(), q(B));
                   },
                   className: i(
                     "w-full px-3 py-2 text-sm rounded-md border",
@@ -1258,17 +1258,17 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
                   )
                 }
               ) }),
-              G && /* @__PURE__ */ c(
+              ce && /* @__PURE__ */ c(
                 "div",
                 {
                   className: i(
                     "cursor-pointer px-3 py-1.5 text-sm",
                     "text-info-fg hover:bg-surface-hover"
                   ),
-                  onClick: () => O(V),
+                  onClick: () => q(B),
                   children: [
                     "+: “",
-                    V.trim(),
+                    B.trim(),
                     "”"
                   ]
                 }
@@ -1279,37 +1279,37 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
                   {
                     className: "cursor-pointer px-3 py-1.5 text-sm text-text-muted hover:bg-surface-hover",
                     onClick: () => {
-                      p?.(""), D(!1);
+                      p?.(""), j(!1);
                     },
                     children: u
                   }
                 ),
-                ce.map((M) => {
-                  const E = g ? Array.isArray($) && $.includes(M.value) : $ === M.value;
+                oe.map((L) => {
+                  const k = g ? Array.isArray(D) && D.includes(L.value) : D === L.value;
                   return /* @__PURE__ */ e(
                     "li",
                     {
-                      onClick: () => !M.disabled && y(M.value),
+                      onClick: () => !L.disabled && E(L.value),
                       className: i(
                         "cursor-pointer px-3 py-1.5 text-sm",
                         "text-text",
-                        M.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-surface-hover",
-                        E && "bg-accent-soft text-accent font-semibold"
+                        L.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-surface-hover",
+                        k && "bg-accent-soft text-accent font-semibold"
                       ),
                       children: /* @__PURE__ */ c("div", { className: "flex items-center", children: [
                         g && /* @__PURE__ */ e(
                           "input",
                           {
                             type: "checkbox",
-                            checked: E,
+                            checked: k,
                             readOnly: !0,
                             className: "mr-3 h-4 w-4 rounded border-border [&:not(:checked)]:bg-surface-input text-accent "
                           }
                         ),
-                        /* @__PURE__ */ e("span", { children: M.label })
+                        /* @__PURE__ */ e("span", { children: L.label })
                       ] })
                     },
-                    M.value
+                    L.value
                   );
                 })
               ] })
@@ -1330,8 +1330,8 @@ const zr = () => /* @__PURE__ */ e(Q, { icon: Mt, size: "md", color: "current" }
     );
   }
 );
-Ae.displayName = "Select";
-const $r = {
+De.displayName = "Select";
+const _r = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-base",
   lg: "h-control-lg px-3 text-base",
@@ -1352,7 +1352,7 @@ const $r = {
     id: f,
     ...b
   }, g) => {
-    const N = oe.useId(), p = f || `textfield-${N}`, x = !!n, C = n || r ? `${p}-description` : void 0;
+    const w = ae.useId(), p = f || `textfield-${w}`, h = !!n, C = n || r ? `${p}-description` : void 0;
     return /* @__PURE__ */ c("div", { className: i("flex flex-col", a && "w-full", d), children: [
       t && /* @__PURE__ */ e(
         "label",
@@ -1360,7 +1360,7 @@ const $r = {
           htmlFor: p,
           className: i(
             at,
-            x ? "text-danger-fg" : "text-text-muted",
+            h ? "text-danger-fg" : "text-text-muted",
             v
           ),
           children: t
@@ -1373,14 +1373,14 @@ const $r = {
           {
             ref: g,
             id: p,
-            "aria-invalid": x || void 0,
+            "aria-invalid": h || void 0,
             "aria-describedby": C,
             className: i(
               lt,
-              $r[s],
+              _r[s],
               l && "pl-9",
               (o || u) && "pr-9",
-              ot(x),
+              ot(h),
               m
             ),
             ...b
@@ -1398,7 +1398,7 @@ const $r = {
         "p",
         {
           id: C,
-          className: i("mt-1 text-xs", x ? "text-danger-fg" : "text-text-subtle"),
+          className: i("mt-1 text-xs", h ? "text-danger-fg" : "text-text-subtle"),
           children: n || r
         }
       )
@@ -1406,7 +1406,7 @@ const $r = {
   }
 );
 Ce.displayName = "TextField";
-function Ar({
+function Dr({
   value: t,
   onChange: r,
   onListFolders: n,
@@ -1416,8 +1416,8 @@ function Ar({
   templatePlaceholder: o,
   showTemplate: u = !0
 }) {
-  const [d, v] = B([]);
-  J(() => {
+  const [d, v] = R([]);
+  X(() => {
     let f = !0;
     return Promise.resolve(n?.()).then((b) => {
       f && b && v(b.data ?? []);
@@ -1429,7 +1429,7 @@ function Ar({
   const m = t ?? {};
   return /* @__PURE__ */ c("div", { className: "flex flex-col gap-2", children: [
     /* @__PURE__ */ e(
-      Ae,
+      De,
       {
         size: a,
         fullWidth: !0,
@@ -1451,7 +1451,7 @@ function Ar({
     )
   ] });
 }
-const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(Ie, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), Lr = (t) => /* @__PURE__ */ e(De, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), Ir = {
+const Ne = (...t) => t.filter(Boolean).join(" "), Ar = (t) => /* @__PURE__ */ e(Ie, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), Lr = (t) => /* @__PURE__ */ e(Ae, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), Ir = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-base",
   lg: "h-control-lg px-3 text-base",
@@ -1468,7 +1468,7 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(
     error: n,
     size: s = "md",
     fullWidth: a = !1,
-    startIcon: l = /* @__PURE__ */ e(Dr, {}),
+    startIcon: l = /* @__PURE__ */ e(Ar, {}),
     loading: o = !1,
     containerClassName: u,
     labelClassName: d,
@@ -1477,55 +1477,55 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(
     options: f,
     onRemoteSearch: b,
     onSelect: g,
-    debounceTime: N = 500,
+    debounceTime: w = 500,
     showAllOnOpen: p = !1,
-    value: x,
+    value: h,
     onChange: C,
-    ...S
-  }, I) => {
-    const A = m || `searchfield-${Math.random().toString(36).substr(2, 9)}`, K = !!n, W = re(null), D = re(null), [V, ne] = B(x || ""), [Y, X] = B(!1), [de, w] = B(!1), [h, z] = B(!1);
-    J(() => {
-      x !== void 0 && ne(x);
-    }, [x]);
-    const k = pe(() => {
-      if (p && !h || !V) return f;
-      const O = String(V).toLowerCase();
+    ...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(() => {
+      h !== void 0 && W(h);
+    }, [h]);
+    const S = pe(() => {
+      if (p && !y || !B) return f;
+      const q = String(B).toLowerCase();
       return f.filter(
-        (F) => String(F.label).toLowerCase().includes(O)
+        (H) => String(H.label).toLowerCase().includes(q)
       );
-    }, [V, f, p, h]);
-    J(() => {
-      if (!b || !V) {
-        w(!1);
+    }, [B, f, p, y]);
+    X(() => {
+      if (!b || !B) {
+        Y(!1);
         return;
       }
-      const O = setTimeout(async () => {
-        w(!0);
+      const q = setTimeout(async () => {
+        Y(!0);
         try {
-          await b(String(V));
-        } catch (F) {
-          console.error("Remote search failed:", F);
+          await b(String(B));
+        } catch (H) {
+          console.error("Remote search failed:", H);
         } finally {
-          w(!1);
+          Y(!1);
         }
-      }, N);
+      }, w);
       return () => {
-        clearTimeout(O), w(!1);
+        clearTimeout(q), Y(!1);
       };
-    }, [V, N, b]), J(() => {
-      const O = (F) => {
-        W.current && !W.current.contains(F.target) && X(!1);
+    }, [B, w, b]), X(() => {
+      const q = (H) => {
+        U.current && !U.current.contains(H.target) && J(!1);
       };
-      return document.addEventListener("mousedown", O), () => document.removeEventListener("mousedown", O);
+      return document.addEventListener("mousedown", q), () => document.removeEventListener("mousedown", q);
     }, []);
-    const $ = (O) => {
-      const F = O.target.value;
-      ne(F), X(!0), z(!0), C && C(O);
-    }, y = (O) => {
-      ne(O.label), X(!1), z(!1), g && g(O.value);
-    }, H = () => {
-      (f.length > 0 || b) && (X(!0), z(!1));
-    }, ae = o || de, ce = Y && (k.length > 0 || ae), G = pe(() => I || D, [I]);
+    const D = (q) => {
+      const H = q.target.value;
+      W(H), J(!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]);
     return /* @__PURE__ */ c(
       "div",
       {
@@ -1535,12 +1535,12 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(
           u || "",
           "relative"
         ),
-        ref: W,
+        ref: U,
         children: [
           t && /* @__PURE__ */ e(
             "label",
             {
-              htmlFor: A,
+              htmlFor: _,
               className: Ne(
                 "block text-sm font-medium mb-1",
                 K ? "text-danger-fg" : "text-text",
@@ -1554,11 +1554,11 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(
             /* @__PURE__ */ e(
               "input",
               {
-                ref: G,
-                id: A,
-                value: V,
-                onChange: $,
-                onFocus: H,
+                ref: ce,
+                id: _,
+                value: B,
+                onChange: D,
+                onFocus: A,
                 className: Ne(
                   // Base styles
                   "block w-full rounded-tile border bg-surface-input transition-colors duration-fast ease-out",
@@ -1574,13 +1574,13 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(
                   K ? "border-danger-border text-danger-fg focus-visible:focus-ring" : "border-border-strong text-text",
                   v || ""
                 ),
-                ...S
+                ...z
               }
             ),
-            /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: ae || o ? (
+            /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: $ || o ? (
               // Loading Spinner
               /* @__PURE__ */ e(
-                _t,
+                $t,
                 {
                   className: Ne("animate-spin text-info-fg", Fe[s]),
                   "aria-hidden": !0
@@ -1594,31 +1594,31 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(
                   className: Ne(
                     "text-text-muted cursor-pointer transition-transform",
                     Fe[s],
-                    Y ? "rotate-180" : "rotate-0"
+                    Z ? "rotate-180" : "rotate-0"
                   ),
                   onClick: () => {
-                    X((O) => (O || z(!1), !O));
+                    J((q) => (q || x(!1), !q));
                   }
                 }
               )
             ) })
           ] }),
-          ce && /* @__PURE__ */ e(
+          oe && /* @__PURE__ */ e(
             "ul",
             {
               className: "absolute z-10 mt-1 w-full bg-surface border border-border rounded-lg shadow-lg max-h-60 overflow-auto top-full",
               role: "listbox",
-              children: k.length > 0 ? k.map((O) => /* @__PURE__ */ e(
+              children: S.length > 0 ? S.map((q) => /* @__PURE__ */ e(
                 "li",
                 {
                   className: "px-4 py-2 cursor-pointer text-text hover:bg-accent-soft hover:text-accent transition-colors",
-                  onClick: () => y(O),
+                  onClick: () => E(q),
                   role: "option",
-                  "aria-selected": V === O.label,
-                  children: O.label
+                  "aria-selected": B === q.label,
+                  children: q.label
                 },
-                O.value
-              )) : /* @__PURE__ */ e("li", { className: "px-4 py-2 text-text-muted", children: ae || o ? "Zoeken op afstand..." : "Geen resultaten gevonden." })
+                q.value
+              )) : /* @__PURE__ */ e("li", { className: "px-4 py-2 text-text-muted", children: $ || o ? "Zoeken op afstand..." : "Geen resultaten gevonden." })
             }
           ),
           (n || r) && /* @__PURE__ */ e(
@@ -1633,7 +1633,7 @@ const Ne = (...t) => t.filter(Boolean).join(" "), Dr = (t) => /* @__PURE__ */ e(
           ),
           b && /* @__PURE__ */ c("p", { className: "mt-2 text-xs text-success-fg", children: [
             "Huidige zoekterm (niet-gedebounced): ",
-            String(V)
+            String(B)
           ] })
         ]
       }
@@ -1666,7 +1666,7 @@ const ct = ve(
         l
       ),
       children: [
-        /* @__PURE__ */ e(Q, { icon: Ie, size: "md", color: "current", className: "shrink-0" }),
+        /* @__PURE__ */ e(ee, { icon: Ie, size: "md", color: "current", className: "shrink-0" }),
         /* @__PURE__ */ e(
           "input",
           {
@@ -1698,7 +1698,7 @@ const ct = ve(
             "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(Q, { icon: Se, size: "sm", color: "current" })
+            children: /* @__PURE__ */ e(ee, { icon: Se, size: "sm", color: "current" })
           }
         ) : n && /* @__PURE__ */ e("span", { className: "shrink-0 text-xs text-text-subtle", children: n })
       ]
@@ -1771,66 +1771,66 @@ const jr = ({
   showCheck: u = !0,
   header: d
 }) => {
-  const [v, m] = B(!1), [f, b] = B(null), [g, N] = B({ top: 0, left: 0 }), p = re(null), x = re(null), C = re(null), S = re(null), I = Pe(v, x, { placement: a }), A = re(null), K = () => Array.from(
-    S.current?.querySelectorAll("button[data-option-value]:not(:disabled)") ?? []
+  const [v, m] = R(!1), [f, b] = R(null), [g, w] = R({ top: 0, left: 0 }), p = ne(null), h = ne(null), C = ne(null), z = ne(null), P = Pe(v, h, { placement: a }), _ = ne(null), K = () => Array.from(
+    z.current?.querySelectorAll("button[data-option-value]:not(:disabled)") ?? []
   );
-  J(() => {
+  X(() => {
     v && K()[0]?.focus();
   }, [v]);
-  const W = (h) => {
-    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(h.key)) return;
-    const k = K();
-    if (k.length === 0) return;
-    h.preventDefault();
-    const $ = k.indexOf(document.activeElement), y = h.key === "Home" ? 0 : h.key === "End" ? k.length - 1 : h.key === "ArrowDown" ? ($ + 1) % k.length : ($ - 1 + k.length) % k.length;
-    k[y]?.focus();
+  const U = (y) => {
+    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(y.key)) return;
+    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;
+    S[E]?.focus();
   };
-  J(() => {
-    const h = (z) => {
-      p.current && (!p.current.contains(z.target) || C.current && !C.current.contains(z.target)) && (m(!1), b(null), A.current && (clearTimeout(A.current), A.current = null));
+  X(() => {
+    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", h), () => {
-      document.removeEventListener("mousedown", h);
+    return v && document.addEventListener("mousedown", y), () => {
+      document.removeEventListener("mousedown", y);
     };
-  }, [v]), J(() => {
-    const h = (z) => {
-      z.key === "Escape" && (m(!1), b(null), x.current?.focus(), A.current && (clearTimeout(A.current), A.current = null));
+  }, [v]), X(() => {
+    const y = (x) => {
+      x.key === "Escape" && (m(!1), b(null), h.current?.focus(), _.current && (clearTimeout(_.current), _.current = null));
     };
-    return v && document.addEventListener("keydown", h), () => {
-      document.removeEventListener("keydown", h);
+    return v && document.addEventListener("keydown", y), () => {
+      document.removeEventListener("keydown", y);
     };
-  }, [v]), J(() => {
+  }, [v]), X(() => {
     if (f && p.current) {
-      const h = p.current.querySelector(
+      const y = p.current.querySelector(
         `[data-option-value="${f}"]`
       );
-      if (h) {
-        const z = h.getBoundingClientRect();
-        N({
-          top: z.top,
-          left: z.right + 8
+      if (y) {
+        const x = y.getBoundingClientRect();
+        w({
+          top: x.top,
+          left: x.right + 8
         });
       }
     }
-  }, [f]), J(() => () => {
-    A.current && clearTimeout(A.current);
+  }, [f]), X(() => () => {
+    _.current && clearTimeout(_.current);
   }, []);
-  const D = (h) => {
-    h.stopPropagation(), !l && (m(!v), b(null), A.current && (clearTimeout(A.current), A.current = null));
-  }, V = (h, z, k) => {
-    h.stopPropagation(), !z.disabled && !z.divider && (!z.children || z.children.length === 0) && (s?.(z.value, k), m(!1), b(null));
-  }, ne = (h) => {
-    A.current && (clearTimeout(A.current), A.current = null), h.children && h.children.length > 0 ? b(h.value) : b(null);
-  }, Y = (h) => {
-    h.children && h.children.length > 0 ? A.current = setTimeout(() => {
+  const j = (y) => {
+    y.stopPropagation(), !l && (m(!v), b(null), _.current && (clearTimeout(_.current), _.current = null));
+  }, B = (y, x, S) => {
+    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) => {
+    y.children && y.children.length > 0 ? _.current = setTimeout(() => {
       b(null);
     }, 150) : b(null);
-  }, X = (h, z, k) => {
-    h.stopPropagation(), !z.disabled && !z.divider && (s?.(z.value, k), m(!1), b(null));
+  }, J = (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"
-  ), w = i(
+  ), Y = i(
     "fixed z-overlay min-w-menu bg-surface rounded-lg shadow-overlay border border-border",
     "max-h-60 overflow-auto"
   );
@@ -1846,8 +1846,8 @@ const jr = ({
         /* @__PURE__ */ e(
           "button",
           {
-            ref: x,
-            onClick: D,
+            ref: h,
+            onClick: j,
             disabled: l,
             "aria-haspopup": "menu",
             "aria-expanded": v,
@@ -1857,121 +1857,121 @@ const jr = ({
             children: t
           }
         ),
-        v && /* @__PURE__ */ e("div", { ref: S, className: de, style: I, onKeyDown: W, children: /* @__PURE__ */ c("div", { className: "p-2", role: "menu", children: [
+        v && /* @__PURE__ */ e("div", { ref: z, className: de, style: P, onKeyDown: U, children: /* @__PURE__ */ c("div", { className: "p-2", role: "menu", children: [
           d && (typeof d == "string" ? /* @__PURE__ */ e("div", { className: "text-xs font-medium text-text-muted uppercase tracking-label px-3 py-2", children: d }) : d),
-          r.map((h, z) => {
-            if (h.divider)
+          r.map((y, x) => {
+            if (y.divider)
               return /* @__PURE__ */ e(
                 "div",
                 {
                   className: "border-t border-border my-2"
                 },
-                `divider-${z}`
+                `divider-${x}`
               );
-            const k = h.children && h.children.length > 0, $ = f === h.value;
+            const S = y.children && y.children.length > 0, D = f === y.value;
             return /* @__PURE__ */ c("div", { className: "relative group", children: [
               /* @__PURE__ */ c(
                 "button",
                 {
-                  "data-option-value": h.value,
+                  "data-option-value": y.value,
                   role: "menuitem",
-                  "aria-haspopup": k ? "menu" : void 0,
-                  onClick: (y) => V(y, h),
-                  onMouseEnter: () => ne(h),
-                  onMouseLeave: () => Y(h),
-                  disabled: h.disabled,
+                  "aria-haspopup": S ? "menu" : void 0,
+                  onClick: (E) => B(E, y),
+                  onMouseEnter: () => W(y),
+                  onMouseLeave: () => Z(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": h.disabled,
-                      "bg-surface-hover": $ && k
+                      "opacity-50 cursor-not-allowed": y.disabled,
+                      "bg-surface-hover": D && S
                     }
                   ),
                   children: [
                     /* @__PURE__ */ c("div", { className: "flex items-center space-x-2 min-w-0", children: [
-                      h.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: h.icon }),
+                      y.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: y.icon }),
                       /* @__PURE__ */ c("div", { className: "flex flex-col items-start min-w-0", children: [
-                        /* @__PURE__ */ e("span", { className: "font-base truncate", children: h.label }),
-                        h.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: h.description })
+                        /* @__PURE__ */ e("span", { className: "font-base truncate", children: y.label }),
+                        y.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: y.description })
                       ] })
                     ] }),
                     /* @__PURE__ */ c("div", { className: "flex items-center space-x-2", children: [
-                      u && n === h.value && /* @__PURE__ */ e(Ue, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 }),
-                      k && /* @__PURE__ */ e("span", { className: "text-text-muted text-xs", children: "▶" })
+                      u && n === y.value && /* @__PURE__ */ e(Ue, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 }),
+                      S && /* @__PURE__ */ e("span", { className: "text-text-muted text-xs", children: "▶" })
                     ] })
                   ]
                 }
               ),
-              k && $ && /* @__PURE__ */ e(
+              S && D && /* @__PURE__ */ e(
                 "div",
                 {
                   ref: C,
-                  className: w,
+                  className: Y,
                   style: {
                     top: `${g.top}px`,
                     left: `${g.left}px`
                   },
                   onMouseEnter: () => {
-                    A.current && (clearTimeout(A.current), A.current = null), b(h.value);
+                    _.current && (clearTimeout(_.current), _.current = null), b(y.value);
                   },
                   onMouseLeave: () => {
-                    A.current = setTimeout(() => {
+                    _.current = setTimeout(() => {
                       b(null);
                     }, 150);
                   },
-                  children: /* @__PURE__ */ e("div", { className: "p-2", children: h.children.map((y, H) => {
-                    if (y.divider)
+                  children: /* @__PURE__ */ e("div", { className: "p-2", children: y.children.map((E, A) => {
+                    if (E.divider)
                       return /* @__PURE__ */ e(
                         "div",
                         {
                           className: "border-t border-border my-2"
                         },
-                        `divider-${H}`
+                        `divider-${A}`
                       );
-                    const ae = typeof n == "object" && n[h.value] && n[h.value].includes(
-                      y.value
-                    ) || n === y.value;
+                    const $ = typeof n == "object" && n[y.value] && n[y.value].includes(
+                      E.value
+                    ) || n === E.value;
                     return /* @__PURE__ */ c(
                       "button",
                       {
-                        onClick: (ce) => X(
-                          ce,
-                          y,
-                          h.value
+                        onClick: (oe) => J(
+                          oe,
+                          E,
+                          y.value
                         ),
-                        disabled: y.disabled,
+                        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",
                           {
-                            "opacity-50 cursor-not-allowed": y.disabled
+                            "opacity-50 cursor-not-allowed": E.disabled
                           }
                         ),
                         children: [
                           /* @__PURE__ */ c("div", { className: "flex items-center space-x-2 min-w-0", children: [
-                            y.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: y.icon }),
+                            E.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: E.icon }),
                             /* @__PURE__ */ c("div", { className: "flex flex-col items-start min-w-0", children: [
-                              /* @__PURE__ */ e("span", { className: "font-base truncate", children: y.label }),
-                              y.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: y.description })
+                              /* @__PURE__ */ e("span", { className: "font-base truncate", children: E.label }),
+                              E.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: E.description })
                             ] })
                           ] }),
-                          u && ae && /* @__PURE__ */ e(Ue, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 })
+                          u && $ && /* @__PURE__ */ e(Ue, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 })
                         ]
                       },
-                      y.value
+                      E.value
                     );
                   }) })
                 }
               )
-            ] }, h.value);
+            ] }, y.value);
           }),
           (() => {
-            const h = r.reduce((z, k) => {
-              if (k.divider) return z;
-              const $ = k.children ? k.children.filter((y) => !y.divider).length : 0;
-              return z + 1 + $;
+            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;
             }, 0);
-            return h > 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: [
-              h,
+            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,
               " options available"
             ] }) });
           })()
@@ -1984,7 +1984,7 @@ const jr = ({
   defaultVariant: r = "secondary",
   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(oe.Fragment, { children: s.render() }, s.id) : s.splitOptions && s.splitOptions.length > 0 ? /* @__PURE__ */ e(
+  (s) => s.render ? /* @__PURE__ */ e(ae.Fragment, { children: s.render() }, s.id) : s.splitOptions && s.splitOptions.length > 0 ? /* @__PURE__ */ e(
     st,
     {
       label: s.label,
@@ -2027,7 +2027,7 @@ const jr = ({
       variant: "secondary",
       onClick: r,
       "aria-label": n,
-      leftIcon: /* @__PURE__ */ e(Q, { icon: ze, size: "sm" }),
+      leftIcon: /* @__PURE__ */ e(ee, { icon: ze, size: "sm" }),
       iconOnly: !0
     }
   ),
@@ -2117,130 +2117,130 @@ const Vr = (t) => {
   groups: f,
   paginated: b = !1,
   defaultPageSize: g = 10,
-  actions: N = [],
+  actions: w = [],
   onRowClick: p,
-  selectable: x = !1,
+  selectable: h = !1,
   selectedRows: C = [],
-  onSelectionChange: S,
-  getRowKey: I = (de, w) => w,
-  emptyContent: A,
+  onSelectionChange: z,
+  getRowKey: P = (de, Y) => Y,
+  emptyContent: _,
   footerSummary: K,
-  size: W = "md",
-  hoverable: D = !0,
-  padding: V = "md",
-  className: ne,
-  rowClassName: Y,
-  headerBackground: X = !0
+  size: U = "md",
+  hoverable: j = !0,
+  padding: B = "md",
+  className: W,
+  rowClassName: Z,
+  headerBackground: J = !0
 }) => {
-  const [de, w] = B(""), h = l !== void 0, z = h ? l : de, k = o ?? w, [$, y] = B({
+  const [de, Y] = R(""), y = l !== void 0, x = y ? l : de, S = o ?? Y, [D, E] = R({
     column: null,
     direction: null
-  }), [H, ae] = B({
+  }), [A, $] = R({
     page: 0,
     pageSize: g
-  }), ce = re(null), G = pe(() => {
-    let _ = t;
-    if (s && !h && z.trim()) {
-      const U = r.filter(
+  }), oe = ne(null), ce = pe(() => {
+    let T = t;
+    if (s && !y && x.trim()) {
+      const V = r.filter(
         (ie) => ie.searchable !== !1
-      ), te = z.toLowerCase();
-      _ = _.filter((ie) => U.some((Z) => {
-        const R = typeof Z.accessor == "function" ? Z.accessor(ie) : ie[Z.accessor];
-        return String(R || "").toLowerCase().includes(te);
+      ), re = x.toLowerCase();
+      T = T.filter((ie) => V.some((Q) => {
+        const F = typeof Q.accessor == "function" ? Q.accessor(ie) : ie[Q.accessor];
+        return String(F || "").toLowerCase().includes(re);
       }));
     }
-    return _;
-  }, [t, z, h, r, s]), O = pe(() => {
-    if (!$.column || !$.direction) return G;
-    const _ = r.find((U) => U.id === $.column);
-    return _ ? [...G].sort((U, te) => {
-      const ie = typeof _.accessor == "function" ? _.accessor(U) : U[_.accessor], Z = typeof _.accessor == "function" ? _.accessor(te) : te[_.accessor];
-      let R = 0;
-      return ie < Z ? R = -1 : ie > Z && (R = 1), $.direction === "desc" ? -R : R;
-    }) : G;
-  }, [G, $, r]), F = pe(() => {
-    if (!b || m) return O;
-    const _ = H.page * H.pageSize, U = _ + H.pageSize;
-    return O.slice(_, U);
-  }, [O, H, b, m]), M = xe(
-    (_) => {
-      r.find((te) => te.id === _)?.sortable && y((te) => te.column !== _ ? { column: _, direction: "asc" } : te.direction === "asc" ? { column: _, direction: "desc" } : { column: null, direction: null });
+    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);
+    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];
+      let F = 0;
+      return ie < Q ? F = -1 : ie > Q && (F = 1), D.direction === "desc" ? -F : F;
+    }) : ce;
+  }, [ce, D, r]), H = pe(() => {
+    if (!b || m) return q;
+    const T = A.page * A.pageSize, V = T + A.pageSize;
+    return q.slice(T, V);
+  }, [q, A, 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]
-  ), E = xe((_) => {
-    ae((U) => ({ ...U, page: _ }));
-  }, []), P = xe(
-    (_, U) => {
-      if (!S) return;
-      const te = I(_, 0);
-      S(U ? [...C, _] : C.filter(
-        (ie, Z) => I(C[Z], Z) !== te
+  ), k = xe((T) => {
+    $((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
       ));
     },
-    [C, S, I]
-  ), j = xe(
-    (_) => {
-      S && S(_ ? [...F] : []);
+    [C, z, P]
+  ), G = xe(
+    (T) => {
+      z && z(T ? [...H] : []);
     },
-    [F, S]
+    [H, z]
   );
-  J(() => {
-    ae((_) => ({ ..._, page: 0 }));
-  }, [z, $]), J(() => {
-    ae((_) => ({ ..._, page: 0 }));
-  }, [u.map((_) => _.value).join(",")]);
-  const q = O.length, T = Math.ceil(q / H.pageSize), L = H.page * H.pageSize + 1, ee = Math.min(L + H.pageSize - 1, q), le = F.length > 0 && F.every((_) => {
-    const U = I(_, 0);
+  X(() => {
+    $((T) => ({ ...T, page: 0 }));
+  }, [x, D]), X(() => {
+    $((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 V = P(T, 0);
     return C.some(
-      (te, ie) => I(te, ie) === U
+      (re, ie) => P(re, ie) === V
     );
-  }), be = F.some((_) => {
-    const U = I(_, 0);
+  }), be = H.some((T) => {
+    const V = P(T, 0);
     return C.some(
-      (te, ie) => I(te, ie) === U
+      (re, ie) => P(re, ie) === V
     );
-  }), ye = Rr[V], fe = X ? "bg-surface-sunk" : "bg-surface", he = i("text-text", ye), Oe = s || u.length > 0 || d.length > 0 || !!v, ft = pe(() => {
-    const _ = F.map((Z, R) => ({ row: Z, index: R }));
-    if (!m) return [{ group: null, rows: _ }];
-    const U = /* @__PURE__ */ new Map();
-    for (const Z of _) {
-      const R = m(Z.row, Z.index), ge = U.get(R);
-      ge ? ge.push(Z) : U.set(R, [Z]);
+  }), ye = Rr[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 }));
+    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]);
     }
-    const te = f ?? [];
+    const re = f ?? [];
     return [
-      ...te.filter((Z) => U.has(Z.id)),
-      ...[...U.keys()].filter((Z) => !te.some((R) => R.id === Z)).map((Z) => ({ id: Z }))
-    ].map((Z) => ({ group: Z, rows: U.get(Z.id) ?? [] }));
-  }, [F, m, f]), ht = r.length + (x ? 1 : 0) + (N.length > 0 ? 1 : 0), Ve = b && q > 0, xt = Ve || K !== void 0;
-  return /* @__PURE__ */ c("div", { className: i("flex min-w-0 flex-col", ne), children: [
+      ...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;
+  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(
         ct,
         {
-          value: z,
-          onValueChange: k,
+          value: x,
+          onValueChange: S,
           placeholder: a,
           containerClassName: "w-full sm:w-66"
         }
       ),
-      u.map((_) => /* @__PURE__ */ e(Vr, { ..._ }, _.id)),
+      u.map((T) => /* @__PURE__ */ e(Vr, { ...T }, T.id)),
       v,
       d.length > 0 && /* @__PURE__ */ e(ke, { actions: d, className: "ml-auto" })
     ] }),
-    /* @__PURE__ */ e("div", { className: "relative w-full overflow-x-auto rounded-lg ring-1 ring-border", children: /* @__PURE__ */ c("table", { ref: ce, className: "min-w-full border-collapse text-base text-text", children: [
+    /* @__PURE__ */ e("div", { className: "relative w-full overflow-x-auto rounded-lg ring-1 ring-border", children: /* @__PURE__ */ c("table", { ref: oe, className: "min-w-full border-collapse text-base text-text", children: [
       /* @__PURE__ */ e("thead", { className: i(fe, "h-control-lg"), children: /* @__PURE__ */ c("tr", { children: [
-        x && /* @__PURE__ */ e("th", { className: i(he, "w-10"), children: /* @__PURE__ */ e(
+        h && /* @__PURE__ */ e("th", { className: i(he, "w-10"), children: /* @__PURE__ */ e(
           we,
           {
             size: "sm",
             checked: le,
             indeterminate: be && !le,
-            onChange: (_) => j(_.target.checked),
+            onChange: (T) => G(T.target.checked),
             "aria-label": "Select all rows"
           }
         ) }),
-        r.map((_) => /* @__PURE__ */ e(
+        r.map((T) => /* @__PURE__ */ e(
           "th",
           {
             className: i(
@@ -2248,57 +2248,57 @@ const Vr = (t) => {
               "text-xs font-semibold uppercase tracking-label text-text-muted",
               "group",
               {
-                "text-left": _.align === "left" || !_.align,
-                "text-center": _.align === "center",
-                "text-right": _.align === "right",
-                "cursor-pointer select-none": _.sortable,
-                [`sticky left-0 ${fe}`]: _.sticky === "left",
-                [`sticky right-0 ${fe}`]: _.sticky === "right"
+                "text-left": T.align === "left" || !T.align,
+                "text-center": T.align === "center",
+                "text-right": T.align === "right",
+                "cursor-pointer select-none": T.sortable,
+                [`sticky left-0 ${fe}`]: T.sticky === "left",
+                [`sticky right-0 ${fe}`]: T.sticky === "right"
               }
             ),
-            style: { width: _.width },
-            onClick: () => _.sortable && M(_.id),
+            style: { width: T.width },
+            onClick: () => T.sortable && L(T.id),
             children: /* @__PURE__ */ c("div", { className: "flex items-center gap-1.5", children: [
-              _.headerCell ? _.headerCell() : _.header,
-              _.sortable && /* @__PURE__ */ e(
-                Q,
+              T.headerCell ? T.headerCell() : T.header,
+              T.sortable && /* @__PURE__ */ e(
+                ee,
                 {
-                  icon: $.column === _.id && $.direction === "desc" ? De : $t,
+                  icon: D.column === T.id && D.direction === "desc" ? Ae : _t,
                   size: "xs",
                   className: i(
                     "transition-opacity duration-fast ease-out",
-                    $.column === _.id ? "text-text opacity-100" : "text-text-subtle opacity-0 group-hover:opacity-100"
+                    D.column === T.id ? "text-text opacity-100" : "text-text-subtle opacity-0 group-hover:opacity-100"
                   )
                 }
               )
             ] })
           },
-          _.id
+          T.id
         )),
-        N.length > 0 && /* @__PURE__ */ e("th", { className: i(he, "w-10"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
+        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: Hr }).map((_, U) => /* @__PURE__ */ c("tr", { className: "animate-pulse border-t border-border-subtle", "aria-hidden": !0, children: [
-        x && /* @__PURE__ */ e("td", { className: i(he, "h-row-lg"), children: /* @__PURE__ */ e("span", { className: "block size-4 rounded-xs bg-surface-hover" }) }),
-        r.map((te, ie) => /* @__PURE__ */ e("td", { className: i(he, "h-row-lg"), style: { width: te.width }, children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e("tbody", { children: n ? Array.from({ length: Hr }).map((T, V) => /* @__PURE__ */ c("tr", { className: "animate-pulse border-t border-border-subtle", "aria-hidden": !0, children: [
+        h && /* @__PURE__ */ e("td", { className: i(he, "h-row-lg"), children: /* @__PURE__ */ e("span", { className: "block size-4 rounded-xs bg-surface-hover" }) }),
+        r.map((re, ie) => /* @__PURE__ */ e("td", { className: i(he, "h-row-lg"), style: { width: re.width }, children: /* @__PURE__ */ e(
           "span",
           {
             className: "block h-3 rounded-xs bg-surface-hover",
-            style: { width: Je[(U + ie) % Je.length] }
+            style: { width: Je[(V + ie) % Je.length] }
           }
-        ) }, te.id)),
-        N.length > 0 && /* @__PURE__ */ e("td", { className: i(he, "h-row-lg") })
-      ] }, `skeleton-${U}`)) : F.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
+        ) }, re.id)),
+        w.length > 0 && /* @__PURE__ */ e("td", { className: i(he, "h-row-lg") })
+      ] }, `skeleton-${V}`)) : H.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
         "td",
         {
-          colSpan: r.length + (x ? 1 : 0) + (N.length > 0 ? 1 : 0),
+          colSpan: r.length + (h ? 1 : 0) + (w.length > 0 ? 1 : 0),
           className: i(
             he,
             "border-t border-border-subtle py-10 text-center text-text-muted"
           ),
-          children: A || "No data available"
+          children: _ || "No data available"
         }
-      ) }) : ft.flatMap((_) => [
-        ..._.group ? [
+      ) }) : ft.flatMap((T) => [
+        ...T.group ? [
           /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
             "td",
             {
@@ -2307,81 +2307,81 @@ const Vr = (t) => {
                 // A caption over its rows, not a second column strip:
                 // same surface as the rows, no rules, count on the right.
                 "border-t border-border-subtle bg-surface px-4 pb-1.5 pt-4 text-sm font-semibold",
-                _.group.tone === "danger" ? "text-danger-fg" : _.group.tone === "muted" ? "text-text-subtle" : "text-text"
+                T.group.tone === "danger" ? "text-danger-fg" : T.group.tone === "muted" ? "text-text-subtle" : "text-text"
               ),
               children: /* @__PURE__ */ c("span", { className: "flex items-center gap-2.5", children: [
-                _.group.title ?? _.group.id,
-                /* @__PURE__ */ e("span", { className: "rounded-full bg-surface-sunk px-1.5 py-0.5 text-xs font-medium text-text-muted tabular-nums", children: _.group.count ?? _.rows.length })
+                T.group.title ?? T.group.id,
+                /* @__PURE__ */ e("span", { className: "rounded-full bg-surface-sunk px-1.5 py-0.5 text-xs font-medium text-text-muted tabular-nums", children: T.group.count ?? T.rows.length })
               ] })
             }
-          ) }, `group-${_.group.id}`)
+          ) }, `group-${T.group.id}`)
         ] : [],
-        ..._.rows.map(({ row: U, index: te }) => {
-          const ie = I(U, te), Z = C.some(
-            (R, ge) => I(R, ge) === ie
+        ...T.rows.map(({ row: V, index: re }) => {
+          const ie = P(V, re), Q = C.some(
+            (F, ge) => P(F, ge) === ie
           );
           return /* @__PURE__ */ c(
             "tr",
             {
               className: i(
-                Br[W],
+                Br[U],
                 // Hairline above every row, including the first: it is
                 // what separates the body from the column strip.
                 "border-t border-border-subtle",
-                D && "transition-colors duration-fast ease-out hover:bg-surface-hover",
+                j && "transition-colors duration-fast ease-out hover:bg-surface-hover",
                 p && "cursor-pointer",
-                Z && "bg-accent-soft",
-                Y?.(U, te)
+                Q && "bg-accent-soft",
+                Z?.(V, re)
               ),
-              onClick: (R) => {
-                R.stopPropagation(), p?.(U, te);
+              onClick: (F) => {
+                F.stopPropagation(), p?.(V, re);
               },
               children: [
-                x && /* @__PURE__ */ e("td", { className: he, children: /* @__PURE__ */ e(
+                h && /* @__PURE__ */ e("td", { className: he, children: /* @__PURE__ */ e(
                   we,
                   {
                     size: "sm",
-                    checked: Z,
-                    onClick: (R) => R.stopPropagation(),
-                    onChange: (R) => {
-                      R.stopPropagation(), P(U, R.target.checked);
+                    checked: Q,
+                    onClick: (F) => F.stopPropagation(),
+                    onChange: (F) => {
+                      F.stopPropagation(), M(V, F.target.checked);
                     },
                     "aria-label": "Select row"
                   }
                 ) }),
-                r.map((R) => {
-                  const ge = typeof R.accessor == "function" ? R.accessor(U) : U[R.accessor];
+                r.map((F) => {
+                  const ge = typeof F.accessor == "function" ? F.accessor(V) : V[F.accessor];
                   return /* @__PURE__ */ e(
                     "td",
                     {
                       className: i(he, {
-                        "text-left": R.align === "left" || !R.align,
-                        "text-center": R.align === "center",
-                        "text-right": R.align === "right",
-                        "sticky left-0 bg-surface": R.sticky === "left",
-                        "sticky right-0 bg-surface": R.sticky === "right"
+                        "text-left": F.align === "left" || !F.align,
+                        "text-center": F.align === "center",
+                        "text-right": F.align === "right",
+                        "sticky left-0 bg-surface": F.sticky === "left",
+                        "sticky right-0 bg-surface": F.sticky === "right"
                       }),
-                      children: R.cell ? R.cell(ge, U, te) : String(ge || "")
+                      children: F.cell ? F.cell(ge, V, re) : String(ge || "")
                     },
-                    R.id
+                    F.id
                   );
                 }),
-                N.length > 0 && /* @__PURE__ */ e("td", { className: he, children: /* @__PURE__ */ e(
+                w.length > 0 && /* @__PURE__ */ e("td", { className: he, children: /* @__PURE__ */ e(
                   jr,
                   {
                     className: "rounded-md",
-                    trigger: /* @__PURE__ */ e("span", { className: "grid size-7 place-items-center text-text-subtle", children: /* @__PURE__ */ e(Q, { icon: At, size: "md", color: "current" }) }),
-                    options: N.map((R) => ({
-                      value: R.id,
-                      label: R.label,
-                      icon: R.icon,
-                      disabled: R.disabled?.(U)
+                    trigger: /* @__PURE__ */ e("span", { className: "grid size-7 place-items-center text-text-subtle", children: /* @__PURE__ */ e(ee, { icon: Dt, size: "md", color: "current" }) }),
+                    options: w.map((F) => ({
+                      value: F.id,
+                      label: F.label,
+                      icon: F.icon,
+                      disabled: F.disabled?.(V)
                     })),
-                    onSelect: (R) => {
-                      const ge = N.find(
-                        (bt) => bt.id === R
+                    onSelect: (F) => {
+                      const ge = w.find(
+                        (bt) => bt.id === F
                       );
-                      ge && ge.onClick(U, te);
+                      ge && ge.onClick(V, re);
                     },
                     placement: "bottom-end"
                   }
@@ -2394,7 +2394,7 @@ const Vr = (t) => {
       ]) })
     ] }) }),
     xt && /* @__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 ${L}–${ee} of ${q}` }),
+      /* @__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(
           se,
@@ -2403,27 +2403,27 @@ const Vr = (t) => {
             variant: "ghost",
             iconOnly: !0,
             "aria-label": "Previous page",
-            onClick: () => E(H.page - 1),
-            disabled: H.page === 0,
-            children: /* @__PURE__ */ e(Q, { icon: ze, size: "md", color: "current" })
+            onClick: () => k(A.page - 1),
+            disabled: A.page === 0,
+            children: /* @__PURE__ */ e(ee, { icon: ze, size: "md", color: "current" })
           }
         ),
-        qr(H.page, T).map(
-          (_, U) => _ === "gap" ? /* @__PURE__ */ e("span", { className: "px-1 text-text-subtle", children: "…" }, `gap-${U}`) : /* @__PURE__ */ e(
+        qr(A.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": _ === H.page ? "page" : void 0,
-              onClick: () => E(_),
+              "aria-current": T === A.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",
-                _ === H.page ? "bg-surface-sunk font-semibold text-text" : "text-text-muted hover:bg-surface-hover hover:text-text"
+                T === A.page ? "bg-surface-sunk font-semibold text-text" : "text-text-muted hover:bg-surface-hover hover:text-text"
               ),
-              children: _ + 1
+              children: T + 1
             },
-            _
+            T
           )
         ),
         /* @__PURE__ */ e(
@@ -2433,9 +2433,9 @@ const Vr = (t) => {
             variant: "ghost",
             iconOnly: !0,
             "aria-label": "Next page",
-            onClick: () => E(H.page + 1),
-            disabled: H.page >= T - 1,
-            children: /* @__PURE__ */ e(Q, { icon: Le, size: "md", color: "current" })
+            onClick: () => k(A.page + 1),
+            disabled: A.page >= N - 1,
+            children: /* @__PURE__ */ e(ee, { icon: Le, size: "md", color: "current" })
           }
         )
       ] })
@@ -2447,7 +2447,7 @@ const Vr = (t) => {
   onTabChange: n,
   className: s
 }) => {
-  const [a, l] = B(t[0]?.id || ""), o = r || a, u = (d) => {
+  const [a, l] = R(t[0]?.id || ""), o = r || a, u = (d) => {
     n ? n(d) : l(d);
   };
   return /* @__PURE__ */ e("div", { className: i("border-b border-border", s), children: /* @__PURE__ */ e("nav", { className: "-mb-px flex space-x-8", children: t.map((d) => /* @__PURE__ */ e(
@@ -2482,7 +2482,7 @@ const Vr = (t) => {
   size: l = "md",
   className: o
 }) => {
-  const [u, d] = B(
+  const [u, d] = R(
     r || n || t[0]?.id || ""
   ), v = n || u, m = (p) => {
     s ? s(p) : d(p);
@@ -2498,30 +2498,30 @@ const Vr = (t) => {
       "space-x-8": a === "default" || a === "underline"
     },
     o
-  ), N = (p, x) => {
-    const C = "transition-colors duration-fast font-medium", S = {
+  ), w = (p, h) => {
+    const C = "transition-colors duration-fast font-medium", z = {
       "text-xs px-2 py-1": l === "sm",
       "text-sm px-3 py-2": l === "md",
       "text-base px-4 py-3": l === "lg"
-    }, I = {
+    }, P = {
       // Default variant
       "border-b-2 -mb-px": a === "default",
       // Pills variant
       "rounded-md": a === "pills",
       // Underline variant
       "border-b-2 pb-2": a === "underline"
-    }, A = {
+    }, _ = {
       "opacity-50 cursor-not-allowed": p.disabled,
       "cursor-pointer": !p.disabled
-    }, K = x ? {
+    }, K = h ? {
       "border-accent-border text-text": a === "default" || a === "underline",
       "bg-surface text-text shadow-none": a === "pills"
-    } : {}, W = !x && !p.disabled ? {
+    } : {}, U = !h && !p.disabled ? {
       "border-transparent text-text-muted hover:text-text": a === "default",
       "text-text-muted hover:text-text": a === "pills",
       "border-transparent text-text-muted hover:text-text hover:border-border": a === "underline"
     } : {};
-    return i(C, S, I, A, K, W);
+    return i(C, z, P, _, K, U);
   };
   return /* @__PURE__ */ e(Ur.Provider, { value: f, children: /* @__PURE__ */ c("div", { children: [
     /* @__PURE__ */ e("div", { className: g, role: "tablist", children: t.map((p) => /* @__PURE__ */ e(
@@ -2533,7 +2533,7 @@ const Vr = (t) => {
         "aria-controls": `tabpanel-${p.id}`,
         disabled: p.disabled,
         onClick: () => !p.disabled && m(p.id),
-        className: N(p, v === p.id),
+        className: w(p, v === p.id),
         children: /* @__PURE__ */ c("span", { className: "flex items-center gap-2", children: [
           p.label,
           p.badge && /* @__PURE__ */ e("span", { className: "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-surface-hover text-text-muted", children: p.badge })
@@ -2572,18 +2572,18 @@ function it({
   footer: v,
   showCloseButton: m = !0
 }) {
-  const f = re(null), b = re(null);
-  J(() => {
+  const f = ne(null), b = ne(null);
+  X(() => {
     if (!t || !l) return;
-    const N = (p) => {
+    const w = (p) => {
       p.key === "Escape" && r();
     };
-    return document.addEventListener("keydown", N), () => document.removeEventListener("keydown", N);
-  }, [t, l, r]), J(() => (t ? (b.current = document.activeElement, f.current && f.current.focus(), document.body.style.overflow = "hidden") : (b.current && b.current.focus(), document.body.style.overflow = ""), () => {
+    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 = ""), () => {
     document.body.style.overflow = "";
   }), [t]);
-  const g = (N) => {
-    a && N.target === N.currentTarget && r();
+  const g = (w) => {
+    a && w.target === w.currentTarget && r();
   };
   return t ? /* @__PURE__ */ e(
     "div",
@@ -2626,7 +2626,7 @@ function it({
                   onClick: r,
                   className: "p-1 text-text-muted hover:text-text transition-colors",
                   "aria-label": "Close modal",
-                  children: /* @__PURE__ */ e(Q, { icon: Se, size: "lg", color: "current" })
+                  children: /* @__PURE__ */ e(ee, { icon: Se, size: "lg", color: "current" })
                 }
               )
             ] }),
@@ -2652,196 +2652,196 @@ const Gr = ({
   onDownloadFile: m,
   onRegisterFile: f
 }) => {
-  const [b, g] = B(!1), [N, p] = B([]), [x, C] = B(null), [S, I] = B("/"), [A, K] = B([]), [W, D] = B(!1), [V, ne] = B(""), [Y, X] = B(
+  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(
     typeof t == "object" ? t : null
-  ), [de, w] = B(!1), [h, z] = B(""), k = re(null);
-  J(() => {
-    b && $();
-  }, [b]), J(() => {
-    b && x && y();
-  }, [b, x, S, V]);
-  const $ = async () => {
-    D(!0);
+  ), [de, Y] = R(!1), [y, x] = R(""), S = ne(null);
+  X(() => {
+    b && D();
+  }, [b]), X(() => {
+    b && h && E();
+  }, [b, h, z, B]);
+  const D = async () => {
+    j(!0);
     try {
-      const T = await d?.();
-      T?.data && p(T.data);
-    } catch (T) {
-      console.error("Failed to load mounts", T);
+      const N = await d?.();
+      N?.data && p(N.data);
+    } catch (N) {
+      console.error("Failed to load mounts", N);
     } finally {
-      D(!1);
+      j(!1);
     }
-  }, y = async () => {
-    if (x) {
-      D(!0);
+  }, E = async () => {
+    if (h) {
+      j(!0);
       try {
-        const T = await u?.({ mountId: x.id, name: V, path: S });
-        T?.data && K(T.data);
-      } catch (T) {
-        console.error("Failed to load files", T);
+        const N = await u?.({ mountId: h.id, name: B, path: z });
+        N?.data && K(N.data);
+      } catch (N) {
+        console.error("Failed to load files", N);
       } finally {
-        D(!1);
+        j(!1);
       }
     }
-  }, H = async (T) => {
-    const L = T.target.files?.[0];
-    if (L) {
-      D(!0);
+  }, A = async (N) => {
+    const I = N.target.files?.[0];
+    if (I) {
+      j(!0);
       try {
-        const ee = await L.arrayBuffer(), le = new Uint8Array(ee), be = {
+        const te = await I.arrayBuffer(), le = new Uint8Array(te), be = {
           id: `local-${Date.now()}`,
-          name: L.name,
+          name: I.name,
           type: "file",
           path: "/",
-          mimeType: L.type || "application/octet-stream",
-          size: L.size,
+          mimeType: I.type || "application/octet-stream",
+          size: I.size,
           mountId: "local",
-          providerKey: L.name,
+          providerKey: I.name,
           ownerId: "me"
         };
-        X(be), r(be, le), g(!1);
-      } catch (ee) {
-        console.error("Local file selection failed", ee);
+        J(be), r(be, le), g(!1);
+      } catch (te) {
+        console.error("Local file selection failed", te);
       } finally {
-        D(!1);
+        j(!1);
       }
     }
-  }, ae = async (T) => {
-    const L = T.target.files?.[0];
-    if (!(!L || !x)) {
-      D(!0);
+  }, $ = async (N) => {
+    const I = N.target.files?.[0];
+    if (!(!I || !h)) {
+      j(!0);
       try {
-        const ee = await L.arrayBuffer(), le = await v?.({
-          file: new Uint8Array(ee),
-          filename: L.name,
-          mimeType: L.type || "application/octet-stream",
-          mountId: x.id,
-          path: S
+        const te = await I.arrayBuffer(), le = await v?.({
+          file: new Uint8Array(te),
+          filename: I.name,
+          mimeType: I.type || "application/octet-stream",
+          mountId: h.id,
+          path: z
         });
         if (le?.data) {
           const be = le.data;
-          X(be), r(be, new Uint8Array(ee)), g(!1);
+          J(be), r(be, new Uint8Array(te)), g(!1);
         }
-      } catch (ee) {
-        console.error("Upload failed", ee);
+      } catch (te) {
+        console.error("Upload failed", te);
       } finally {
-        D(!1);
+        j(!1);
       }
     }
-  }, ce = async () => {
-    if (!(!h || !x)) {
-      D(!0);
+  }, oe = async () => {
+    if (!(!y || !h)) {
+      j(!0);
       try {
-        const T = `${S}${h}/`;
+        const N = `${z}${y}/`;
         f && (await f({
-          name: h,
+          name: y,
           type: "folder",
-          path: S,
+          path: z,
           mimeType: "application/x-directory",
           size: 0,
-          mountId: x.id,
-          providerKey: T,
+          mountId: h.id,
+          providerKey: N,
           ownerId: "me"
-        }), await y()), w(!1), z("");
-      } catch (T) {
-        console.error("Failed to create folder", T);
+        }), await E()), Y(!1), x("");
+      } catch (N) {
+        console.error("Failed to create folder", N);
       } finally {
-        D(!1);
+        j(!1);
       }
     }
-  }, G = async (T) => {
-    D(!0);
+  }, ce = async (N) => {
+    j(!0);
     try {
-      const L = await m?.(T.id);
-      X(T), r(T, L), g(!1);
-    } catch (L) {
-      console.error("Failed to download file", L);
+      const I = await m?.(N.id);
+      J(N), r(N, I), g(!1);
+    } catch (I) {
+      console.error("Failed to download file", I);
     } finally {
-      D(!1);
+      j(!1);
     }
-  }, O = (T) => {
-    T.stopPropagation(), X(null), r(null);
-  }, F = pe(() => {
-    const T = /* @__PURE__ */ new Set(), L = [];
-    return A.forEach((ee) => {
-      if (ee.type === "folder") {
-        ee.path === S && T.add(ee.name);
+  }, q = (N) => {
+    N.stopPropagation(), J(null), r(null);
+  }, H = pe(() => {
+    const N = /* @__PURE__ */ new Set(), I = [];
+    return _.forEach((te) => {
+      if (te.type === "folder") {
+        te.path === z && N.add(te.name);
         return;
       }
-      const le = ee.providerKey || ee.name, ye = (S ? le.substring(S.length) : le).split("/").filter((fe) => fe !== "");
-      ye.length > 1 ? T.add(ye[0]) : ye.length === 1 && L.push(ee);
+      const le = te.providerKey || te.name, ye = (z ? le.substring(z.length) : le).split("/").filter((fe) => fe !== "");
+      ye.length > 1 ? N.add(ye[0]) : ye.length === 1 && I.push(te);
     }), {
-      folders: Array.from(T).sort(),
-      files: L.sort((ee, le) => ee.name.localeCompare(le.name))
+      folders: Array.from(N).sort(),
+      files: I.sort((te, le) => te.name.localeCompare(le.name))
     };
-  }, [A, S]), M = (T) => {
-    I((L) => `${L}${T}/`);
-  }, E = () => {
-    const T = S.split("/").filter((L) => L !== "");
-    T.pop(), T.length === 0 ? I("/") : I(`${T.join("/")}/`);
-  }, P = pe(() => {
-    const T = F.folders.map((L) => ({
-      id: `folder-${L}`,
-      name: L,
+  }, [_, z]), L = (N) => {
+    P((I) => `${I}${N}/`);
+  }, k = () => {
+    const N = z.split("/").filter((I) => I !== "");
+    N.pop(), N.length === 0 ? P("/") : P(`${N.join("/")}/`);
+  }, M = pe(() => {
+    const N = H.folders.map((I) => ({
+      id: `folder-${I}`,
+      name: I,
       type: "folder"
     }));
-    return F.files.forEach((L) => {
-      T.push({
-        ...L,
+    return H.files.forEach((I) => {
+      N.push({
+        ...I,
         type: "file"
       });
-    }), T;
-  }, [F]), j = [
+    }), N;
+  }, [H]), G = [
     {
       id: "name",
       header: "Name",
       accessor: "name",
-      cell: (T, L) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
+      cell: (N, I) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e(
-          Q,
+          ee,
           {
-            icon: L.type === "folder" ? Ke : je,
+            icon: I.type === "folder" ? Ke : je,
             size: "sm",
-            color: L.type === "folder" ? "warning" : "secondary"
+            color: I.type === "folder" ? "warning" : "secondary"
           }
         ),
-        /* @__PURE__ */ e("span", { className: i(L.type === "folder" && "font-medium"), children: T })
+        /* @__PURE__ */ e("span", { className: i(I.type === "folder" && "font-medium"), children: N })
       ] })
     },
     {
       id: "type",
       header: "Type",
-      accessor: (T) => T.type === "folder" ? "Folder" : T.mimeType
+      accessor: (N) => N.type === "folder" ? "Folder" : N.mimeType
     },
     {
       id: "size",
       header: "Size",
-      accessor: (T) => T.type === "file" ? `${(T.size / 1024).toFixed(1)} KB` : "-"
+      accessor: (N) => N.type === "file" ? `${(N.size / 1024).toFixed(1)} KB` : "-"
     },
     {
       id: "actions",
       header: "",
       accessor: "id",
       align: "right",
-      cell: (T, L) => /* @__PURE__ */ e(
+      cell: (N, I) => /* @__PURE__ */ e(
         se,
         {
           variant: "outline",
-          onClick: (ee) => {
-            ee.stopPropagation(), L.type === "folder" ? M(L.name) : G(L);
+          onClick: (te) => {
+            te.stopPropagation(), I.type === "folder" ? L(I.name) : ce(I);
           },
-          loading: W && L.type === "file" && Y?.id === L.id,
-          children: L.type === "folder" ? "Open" : "Select"
+          loading: U && I.type === "file" && Z?.id === I.id,
+          children: I.type === "folder" ? "Open" : "Select"
         }
       )
     }
-  ], q = [
+  ], O = [
     {
       id: "name",
       header: "Mount Name",
       accessor: "name",
-      cell: (T) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2 font-medium", children: [
-        /* @__PURE__ */ e(Q, { icon: We, size: "sm", color: "primary" }),
-        /* @__PURE__ */ e("span", { children: T })
+      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("span", { children: N })
       ] })
     },
     {
@@ -2849,7 +2849,7 @@ const Gr = ({
       header: "",
       accessor: "id",
       align: "right",
-      cell: (T, L) => /* @__PURE__ */ e(se, { variant: "outline", onClick: () => C(L), children: "Open" })
+      cell: (N, I) => /* @__PURE__ */ e(se, { variant: "outline", onClick: () => C(I), children: "Open" })
     }
   ];
   return /* @__PURE__ */ c("div", { className: "space-y-1", children: [
@@ -2865,14 +2865,14 @@ const Gr = ({
           l && "opacity-50 cursor-not-allowed bg-surface-sunk"
         ),
         children: [
-          /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(Q, { icon: Y ? je : We, color: Y ? "primary" : "secondary" }) }),
-          /* @__PURE__ */ e("div", { className: "flex-grow truncate", children: Y ? /* @__PURE__ */ e("span", { className: "text-sm text-text font-medium", children: Y.name }) : /* @__PURE__ */ e("span", { className: "text-sm text-text-muted", children: s }) }),
-          Y && !l && /* @__PURE__ */ e(
+          /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(ee, { icon: Z ? je : We, color: Z ? "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: O,
+              onClick: q,
               className: "p-1 hover:bg-surface-hover rounded",
-              children: /* @__PURE__ */ e(Q, { icon: Se, size: "xs" })
+              children: /* @__PURE__ */ e(ee, { icon: Se, size: "xs" })
             }
           )
         ]
@@ -2884,9 +2884,9 @@ const Gr = ({
       {
         open: b,
         onClose: () => {
-          g(!1), C(null), I("/"), w(!1);
+          g(!1), C(null), P("/"), Y(!1);
         },
-        title: x ? `Explorer: ${x.name}` : "Select Storage Mount",
+        title: h ? `Explorer: ${h.name}` : "Select Storage Mount",
         size: "lg",
         children: /* @__PURE__ */ e(
           Wr,
@@ -2896,26 +2896,26 @@ const Gr = ({
               {
                 id: "remote",
                 label: "Platform Storage",
-                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: x ? /* @__PURE__ */ c(Ee, { children: [
+                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: h ? /* @__PURE__ */ c(Ee, { children: [
                   /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-2", children: [
                     /* @__PURE__ */ e(
                       se,
                       {
                         variant: "ghost",
                         onClick: () => {
-                          S && S !== "/" ? E() : C(null);
+                          z && z !== "/" ? k() : C(null);
                         },
-                        leftIcon: /* @__PURE__ */ e(Q, { icon: Dt, size: "xs" }),
-                        children: S ? "Back" : "Back to Mounts"
+                        leftIcon: /* @__PURE__ */ e(ee, { icon: At, size: "xs" }),
+                        children: z ? "Back" : "Back to Mounts"
                       }
                     ),
-                    /* @__PURE__ */ e("div", { className: "flex items-center gap-1 text-xs text-text-muted overflow-hidden bg-surface-hover px-2 py-1 rounded", children: /* @__PURE__ */ e("span", { className: "truncate", children: S }) }),
+                    /* @__PURE__ */ e("div", { className: "flex items-center gap-1 text-xs text-text-muted overflow-hidden bg-surface-hover px-2 py-1 rounded", children: /* @__PURE__ */ e("span", { className: "truncate", children: z }) }),
                     /* @__PURE__ */ e("div", { className: "flex-grow min-w-40", children: /* @__PURE__ */ e(
                       Ce,
                       {
                         placeholder: "Search...",
-                        value: V,
-                        onChange: (T) => ne(T.target.value),
+                        value: B,
+                        onChange: (N) => W(N.target.value),
                         startIcon: /* @__PURE__ */ e(Ie, { size: 14 }),
                         fullWidth: !0
                       }
@@ -2925,8 +2925,8 @@ const Gr = ({
                         se,
                         {
                           variant: "outline",
-                          onClick: () => w(!0),
-                          leftIcon: /* @__PURE__ */ e(Q, { icon: Lt, size: "xs" }),
+                          onClick: () => Y(!0),
+                          leftIcon: /* @__PURE__ */ e(ee, { icon: Lt, size: "xs" }),
                           children: "New Folder"
                         }
                       ),
@@ -2934,9 +2934,9 @@ const Gr = ({
                         se,
                         {
                           variant: "primary",
-                          onClick: () => k.current?.click(),
-                          leftIcon: /* @__PURE__ */ e(Q, { icon: It, size: "xs" }),
-                          loading: W,
+                          onClick: () => S.current?.click(),
+                          leftIcon: /* @__PURE__ */ e(ee, { icon: It, size: "xs" }),
+                          loading: U,
                           children: "Upload"
                         }
                       ),
@@ -2945,45 +2945,45 @@ const Gr = ({
                         {
                           type: "file",
                           className: "hidden",
-                          ref: k,
-                          onChange: ae,
+                          ref: S,
+                          onChange: $,
                           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(Q, { icon: Ke, size: "sm", color: "warning" }),
+                    /* @__PURE__ */ e(ee, { icon: Ke, size: "sm", color: "warning" }),
                     /* @__PURE__ */ e(
                       Ce,
                       {
                         placeholder: "Folder name",
-                        value: h,
-                        onChange: (T) => z(T.target.value),
+                        value: y,
+                        onChange: (N) => x(N.target.value),
                         autoFocus: !0
                       }
                     ),
-                    /* @__PURE__ */ e(se, { onClick: ce, loading: W, children: "Create" }),
-                    /* @__PURE__ */ e(se, { variant: "ghost", onClick: () => w(!1), children: "Cancel" })
+                    /* @__PURE__ */ e(se, { onClick: oe, loading: U, children: "Create" }),
+                    /* @__PURE__ */ e(se, { variant: "ghost", onClick: () => Y(!1), children: "Cancel" })
                   ] }),
                   /* @__PURE__ */ e("div", { className: "max-h-100 overflow-auto rounded-lg border border-border", children: /* @__PURE__ */ e(
                     Ye,
                     {
-                      data: P,
-                      columns: j,
-                      loading: W,
+                      data: M,
+                      columns: G,
+                      loading: U,
                       emptyContent: "This folder is empty",
-                      onRowClick: (T) => T.type === "folder" ? M(T.name) : G(T)
+                      onRowClick: (N) => N.type === "folder" ? L(N.name) : ce(N)
                     }
                   ) })
                 ] }) : /* @__PURE__ */ e("div", { className: "max-h-100 overflow-auto rounded-lg border border-border", children: /* @__PURE__ */ e(
                   Ye,
                   {
-                    data: N,
-                    columns: q,
-                    loading: W,
+                    data: w,
+                    columns: O,
+                    loading: U,
                     emptyContent: "No storage mounts configured",
-                    onRowClick: (T) => C(T)
+                    onRowClick: (N) => C(N)
                   }
                 ) }) })
               },
@@ -2991,7 +2991,7 @@ const Gr = ({
                 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(Q, { icon: je, size: "xl", color: "primary" }) }),
+                  /* @__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(ue, { variant: "label", size: "lg", weight: "semibold", children: "Select a file from your computer" }),
                   /* @__PURE__ */ c(ue, { variant: "body", size: "sm", className: "text-text-muted mt-1 mb-6 text-center max-w-xs", children: [
                     "This file will be used directly in the form and will ",
@@ -2999,15 +2999,15 @@ const Gr = ({
                     " be uploaded to platform storage."
                   ] }),
                   /* @__PURE__ */ c("label", { className: "cursor-pointer", children: [
-                    /* @__PURE__ */ e(se, { variant: "primary", size: "lg", loading: W, className: "pointer-events-none", children: "Browse Local File" }),
+                    /* @__PURE__ */ e(se, { variant: "primary", size: "lg", loading: U, className: "pointer-events-none", children: "Browse Local File" }),
                     /* @__PURE__ */ e(
                       "input",
                       {
                         type: "file",
                         className: "hidden",
-                        onChange: H,
+                        onChange: A,
                         accept: o,
-                        disabled: W
+                        disabled: U
                       }
                     )
                   ] })
@@ -3039,12 +3039,12 @@ const Gr = ({
     rows: m = 4,
     ...f
   }, b) => {
-    const g = oe.useId(), N = v || `textarea-${g}`, p = !!n, x = n || r ? `${N}-description` : void 0;
+    const g = ae.useId(), w = v || `textarea-${g}`, p = !!n, h = n || r ? `${w}-description` : void 0;
     return /* @__PURE__ */ c("div", { className: i("flex flex-col", a && "w-full", o), children: [
       t && /* @__PURE__ */ e(
         "label",
         {
-          htmlFor: N,
+          htmlFor: w,
           className: i(
             at,
             p ? "text-danger-fg" : "text-text-muted",
@@ -3058,10 +3058,10 @@ const Gr = ({
           "textarea",
           {
             ref: b,
-            id: N,
+            id: w,
             rows: m,
             "aria-invalid": p || void 0,
-            "aria-describedby": x,
+            "aria-describedby": h,
             className: i(
               lt,
               "resize-y leading-relaxed",
@@ -3083,7 +3083,7 @@ const Gr = ({
       (n || r) && /* @__PURE__ */ e(
         "p",
         {
-          id: x,
+          id: h,
           className: i("mt-1 text-xs", p ? "text-danger-fg" : "text-text-subtle"),
           children: n || r
         }
@@ -3193,95 +3193,103 @@ const bs = ({
   size: f = "md",
   loading: b = !1,
   className: g,
-  ref: N,
+  ref: w,
   sdk: p
 }) => {
-  const [x, C] = B(r || {}), [S, I] = B({}), [A, K] = B({});
-  J(() => {
+  const [h, C] = R(r || {}), z = ae.useId(), P = xe(
+    (x) => `${z}-${String(x).replace(/\./g, "-")}`,
+    [z]
+  ), [_, K] = R({}), [U, j] = R({});
+  X(() => {
     r && C({ ...r });
   }, [r]);
-  const W = xe(
-    (w, h, z) => {
-      const k = t.flatMap(($) => $.items).find(($) => $.name === w);
-      if (!k) return null;
-      if (k.required && (h == null || h === ""))
-        return `${k.label} is required`;
-      if (k.type === "array") {
-        if (k.required && (!h || h.length === 0))
-          return `${k.label} cannot be empty.`;
-        if (h && !Array.isArray(h))
-          return `${k.label} must be an array.`;
-        if (Array.isArray(h) && k.arrayFields) {
-          const $ = [];
-          let y = !1;
-          if (h.forEach((H, ae) => {
-            const ce = {};
-            for (const G of k.arrayFields) {
-              const O = H?.[G.name];
-              if (G.required && (O == null || O === ""))
-                ce[G.name] = `${G.label} is required`, y = !0;
-              else if (G.validator) {
-                const F = G.validator(O, H);
-                F && (ce[G.name] = F, y = !0);
+  const B = xe(
+    (x, S, D) => {
+      const E = t.flatMap((A) => A.items).find((A) => A.name === x);
+      if (!E) return null;
+      if (E.required && (S == null || S === ""))
+        return `${E.label} is required`;
+      if (E.type === "array") {
+        if (E.required && (!S || S.length === 0))
+          return `${E.label} cannot be empty.`;
+        if (S && !Array.isArray(S))
+          return `${E.label} must be an array.`;
+        if (Array.isArray(S) && E.arrayFields) {
+          const A = [];
+          let $ = !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;
+              else if (H.validator) {
+                const k = H.validator(L, oe);
+                k && (q[H.name] = k, $ = !0);
               }
             }
-            $[ae] = ce;
-          }), y)
-            return JSON.stringify($);
+            A[ce] = q;
+          }), $)
+            return JSON.stringify(A);
         }
       }
-      return k.validator ? k.validator(h, z) : null;
+      return E.validator ? E.validator(S, D) : null;
     },
     [t]
-  ), D = xe(
-    (w, h) => {
-      let z = Xr(
+  ), W = xe(
+    (x, S) => {
+      let D = Xr(
+        h,
         x,
-        w,
-        h
+        S
       );
-      t.flatMap((y) => y.items).find((y) => y.name === w)?.removeIfEmpty && (h == null || h === "") && (z = Zr(z, w)), C(z), K((y) => ({ ...y, [w]: !0 }));
-      const $ = W(w, h, z);
-      I((y) => ({
-        ...y,
-        [w]: $ || ""
-      })), a?.(z, w);
+      t.flatMap(($) => $.items).find(($) => $.name === x)?.removeIfEmpty && (S == null || S === "") && (D = Zr(D, x)), C(D), j(($) => ({ ...$, [x]: !0 }));
+      const A = B(x, S, D);
+      K(($) => ({
+        ...$,
+        [x]: A || ""
+      })), a?.(D, x);
     },
-    [x, t, W, a]
-  ), V = xe(
-    async (w) => {
-      if (w.preventDefault(), b) return;
-      const h = {}, z = t.flatMap(($) => $.items);
-      for (const $ of z) {
-        if ($.hidden || $.conditional && !$.conditional(x))
+    [h, t, B, a]
+  ), Z = 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))
           continue;
-        const y = W(
-          $.name,
-          Ze(x, $.name),
-          x
+        const $ = B(
+          A.name,
+          Ze(h, A.name),
+          h
         );
-        y && (h[$.name] = y);
+        $ && (S[A.name] = $);
       }
       if (o) {
-        const $ = o(x);
-        $ && Object.assign(h, $);
+        const A = o(h);
+        A && Object.assign(S, A);
       }
-      if (I(h), Object.keys(h).some(($) => h[$]))
+      if (K(S), Object.keys(S).some((A) => S[A]))
         return;
-      const k = l ? l(x) : x;
-      await n?.(x, k);
+      const E = l ? l(h) : h;
+      await n?.(h, E);
     },
-    [x, t, W, o, l, n, b]
-  ), ne = xe(
-    (w) => {
-      const h = Ze(x, w.name), z = A[w.name] ? S[w.name] : void 0, k = w.disabled || b, $ = {
-        value: h || "",
-        disabled: k,
-        required: w.required,
-        placeholder: w.placeholder,
-        ...w.fieldProps
+    [h, t, B, o, l, n, b]
+  ), J = xe(
+    (x) => {
+      const S = Ze(h, x.name), D = U[x.name] ? _[x.name] : void 0, E = x.disabled || b, A = {
+        // Ties the field to the `<label>` the group wrapper renders. The primitives all
+        // support `htmlFor`/`id` — `Form` just never wired them, so every label was
+        // unassociated: a screen reader announced nothing, clicking a label focused
+        // nothing, and a test could not find a field by its label either.
+        id: P(x.name),
+        value: S || "",
+        disabled: E,
+        required: x.required,
+        placeholder: x.placeholder,
+        ...x.fieldProps
       };
-      switch (w.type) {
+      switch (x.type) {
         case "text":
         case "email":
         case "password":
@@ -3292,11 +3300,11 @@ const bs = ({
           return /* @__PURE__ */ e(
             Ce,
             {
-              ...$,
-              onChange: (y) => D(w.name, y.target.value),
-              type: w.textType || w.type,
-              ...Xe(w.autocomplete),
-              error: z,
+              ...A,
+              onChange: ($) => W(x.name, $.target.value),
+              type: x.textType || x.type,
+              ...Xe(x.autocomplete),
+              error: D,
               size: f
             }
           );
@@ -3304,27 +3312,27 @@ const bs = ({
           return /* @__PURE__ */ e(
             He,
             {
-              ...$,
-              onChange: (y) => D(w.name, y.target.value),
-              rows: w.rows ?? 4,
-              error: z,
+              ...A,
+              onChange: ($) => W(x.name, $.target.value),
+              rows: x.rows ?? 4,
+              error: D,
               size: f
             }
           );
         case "select":
           return /* @__PURE__ */ e(
-            Ae,
+            De,
             {
-              ...$,
-              onChange: (y) => D(w.name, y),
-              options: (w.options || []).map((y) => ({
-                ...y,
-                value: String(y.value)
+              ...A,
+              onChange: ($) => W(x.name, $),
+              options: (x.options || []).map(($) => ({
+                ...$,
+                value: String($.value)
               })),
-              searchable: w.searchable,
-              multiple: w.multiple,
-              allowCreate: w.allowCreate,
-              error: z,
+              searchable: x.searchable,
+              multiple: x.multiple,
+              allowCreate: x.allowCreate,
+              error: D,
               size: f
             }
           );
@@ -3335,30 +3343,30 @@ const bs = ({
           return /* @__PURE__ */ e(
             fr,
             {
-              "aria-label": w.label,
-              value: h == null ? "" : String(h),
-              onChange: (y) => D(w.name, y),
-              options: (w.options || []).map((y) => ({
-                value: String(y.value),
-                label: y.label
+              "aria-label": x.label,
+              value: S == null ? "" : String(S),
+              onChange: ($) => W(x.name, $),
+              options: (x.options || []).map(($) => ({
+                value: String($.value),
+                label: $.label
               })),
               size: f === "sm" ? "sm" : "md",
-              className: w.disabled ? "pointer-events-none opacity-50" : void 0
+              className: x.disabled ? "pointer-events-none opacity-50" : void 0
             }
           );
         case "checkbox":
           return /* @__PURE__ */ e(
             we,
             {
-              ...$,
-              label: w.label,
-              checked: !!h,
-              onChange: (y) => D(w.name, y.target.checked),
+              ...A,
+              label: x.label,
+              checked: !!S,
+              onChange: ($) => W(x.name, $.target.checked),
               size: f
             }
           );
         case "radio":
-          return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: w.options?.map((y) => /* @__PURE__ */ c(
+          return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: x.options?.map(($) => /* @__PURE__ */ c(
             "label",
             {
               className: "flex cursor-pointer items-center gap-3 text-base text-text",
@@ -3367,26 +3375,26 @@ const bs = ({
                   "input",
                   {
                     type: "radio",
-                    name: w.name,
-                    value: y.value,
-                    checked: h === y.value,
-                    onChange: () => D(w.name, y.value),
-                    disabled: k || y.disabled,
+                    name: x.name,
+                    value: $.value,
+                    checked: S === $.value,
+                    onChange: () => W(x.name, $.value),
+                    disabled: E || $.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"
                   }
                 ),
-                y.label
+                $.label
               ]
             },
-            y.value
+            $.value
           )) });
         case "date":
           return /* @__PURE__ */ e(
             Be,
             {
-              ...$,
-              value: h ? new Date(h) : null,
-              onChange: (y) => D(w.name, y),
+              ...A,
+              value: S ? new Date(S) : null,
+              onChange: ($) => W(x.name, $),
               size: f
             }
           );
@@ -3394,96 +3402,96 @@ const bs = ({
           return /* @__PURE__ */ e(
             Gr,
             {
-              ...$,
-              value: h,
-              onChange: (y) => D(w.name, y),
-              error: z,
-              onListFiles: (y) => p?.http.invoke({
+              ...A,
+              value: S,
+              onChange: ($) => W(x.name, $),
+              error: D,
+              onListFiles: ($) => p?.http.invoke({
                 method: "POST",
                 action: "storage.file.list",
-                body: y
+                body: $
               }),
               onListMounts: () => p?.http.invoke({
                 method: "GET",
                 action: "storage.mount"
               }),
-              onUploadFile: (y) => p?.http.invoke({
+              onUploadFile: ($) => p?.http.invoke({
                 method: "POST",
                 action: "storage.file.upload",
-                body: y
+                body: $
               }),
-              onDownloadFile: (y) => p?.http.invoke({
+              onDownloadFile: ($) => p?.http.invoke({
                 method: "GET",
-                action: `storage.file.${y}.download`
+                action: `storage.file.${$}.download`
               }),
-              onRegisterFile: (y) => p?.http.invoke({
+              onRegisterFile: ($) => p?.http.invoke({
                 method: "POST",
                 action: "storage.file.folder",
-                body: y
+                body: $
               })
             }
           );
         case "folder":
           return /* @__PURE__ */ e(
-            Ar,
+            Dr,
             {
-              value: h || {},
-              onChange: (y) => D(w.name, y),
+              value: S || {},
+              onChange: ($) => W(x.name, $),
               onListFolders: () => p?.http.invoke({
                 method: "GET",
                 action: "storage.mount"
               }),
-              disabled: k,
+              disabled: E,
               size: f,
-              placeholder: w.placeholder
+              placeholder: x.placeholder
             }
           );
         case "custom":
-          return w.customComponent?.({
-            value: h,
-            onChange: (y) => D(w.name, y),
-            error: z,
-            disabled: k
+          return x.customComponent?.({
+            value: S,
+            onChange: ($) => W(x.name, $),
+            error: D,
+            disabled: E
           });
         case "array": {
-          const y = h || [];
-          let H = [];
-          if (typeof z == "string" && z.startsWith("["))
+          const $ = S || [];
+          let oe = [];
+          if (typeof D == "string" && D.startsWith("["))
             try {
-              H = JSON.parse(z);
+              oe = JSON.parse(D);
             } catch {
             }
-          const ae = () => {
-            D(w.name, [...y, {}]);
-          }, ce = (O) => {
-            D(
-              w.name,
-              y.filter((F, M) => M !== O)
+          const ce = () => {
+            W(x.name, [...$, {}]);
+          }, q = (L) => {
+            W(
+              x.name,
+              $.filter((k, M) => M !== L)
             );
-          }, G = (O, F, M) => {
-            const E = [...y];
-            E[O] = {
-              ...E[O],
-              [F]: M
-            }, D(w.name, E);
+          }, H = (L, k, M) => {
+            const G = [...$];
+            G[L] = {
+              ...G[L],
+              [k]: M
+            }, W(x.name, G);
           };
           return /* @__PURE__ */ c("div", { className: "flex flex-col gap-2", children: [
-            y.map((O, F) => /* @__PURE__ */ c("div", { className: "flex items-start gap-2", children: [
-              /* @__PURE__ */ e("div", { className: "grid flex-1 gap-2 sm:grid-cols-2", children: w.arrayFields?.map((M) => {
-                const E = H?.[F]?.[M.name];
+            $.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: [
-                      F === 0 && /* @__PURE__ */ c("label", { className: "block text-xs font-semibold uppercase tracking-label text-text-subtle", children: [
+                      k === 0 && /* @__PURE__ */ c("label", { className: "block text-xs font-semibold uppercase tracking-label text-text-subtle", children: [
                         M.label,
                         M.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
                       ] }),
                       (() => {
-                        const P = {
-                          value: O?.[M.name] || "",
-                          disabled: k,
+                        const O = {
+                          value: L?.[M.name] || "",
+                          disabled: E,
                           required: M.required,
                           placeholder: M.placeholder,
                           ...M.fieldProps
@@ -3498,15 +3506,15 @@ const bs = ({
                             return /* @__PURE__ */ e(
                               Ce,
                               {
-                                ...P,
-                                onChange: (j) => G(
-                                  F,
+                                ...O,
+                                onChange: (N) => H(
+                                  k,
                                   M.name,
-                                  j.target.value
+                                  N.target.value
                                 ),
                                 type: M.textType || M.type,
                                 ...Xe(M.autocomplete),
-                                error: E,
+                                error: G,
                                 size: f
                               }
                             );
@@ -3514,37 +3522,37 @@ const bs = ({
                             return /* @__PURE__ */ e(
                               He,
                               {
-                                ...P,
-                                onChange: (j) => G(
-                                  F,
+                                ...O,
+                                onChange: (N) => H(
+                                  k,
                                   M.name,
-                                  j.target.value
+                                  N.target.value
                                 ),
                                 rows: M.rows ?? 4,
-                                error: E,
+                                error: G,
                                 size: f
                               }
                             );
                           case "select":
                             return /* @__PURE__ */ e(
-                              Ae,
+                              De,
                               {
-                                ...P,
-                                onChange: (j) => G(
-                                  F,
+                                ...O,
+                                onChange: (N) => H(
+                                  k,
                                   M.name,
-                                  j
+                                  N
                                 ),
                                 options: (M.options || []).map(
-                                  (j) => ({
-                                    ...j,
-                                    value: String(j.value)
+                                  (N) => ({
+                                    ...N,
+                                    value: String(N.value)
                                   })
                                 ),
                                 searchable: M.searchable,
                                 multiple: M.multiple,
                                 allowCreate: M.allowCreate,
-                                error: E,
+                                error: G,
                                 size: f
                               }
                             );
@@ -3552,18 +3560,18 @@ const bs = ({
                             return /* @__PURE__ */ e(
                               we,
                               {
-                                ...P,
-                                checked: !!O?.[M.name],
-                                onChange: (j) => G(
-                                  F,
+                                ...O,
+                                checked: !!L?.[M.name],
+                                onChange: (N) => H(
+                                  k,
                                   M.name,
-                                  j.target.checked
+                                  N.target.checked
                                 ),
                                 size: f
                               }
                             );
                           case "radio":
-                            return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: M.options?.map((j) => /* @__PURE__ */ c(
+                            return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: M.options?.map((N) => /* @__PURE__ */ c(
                               "label",
                               {
                                 className: "flex cursor-pointer items-center gap-2 text-base text-text",
@@ -3572,34 +3580,34 @@ const bs = ({
                                     "input",
                                     {
                                       type: "radio",
-                                      name: `${w.name}.${F}.${M.name}`,
-                                      value: j.value,
-                                      checked: O?.[M.name] === j.value,
-                                      onChange: () => G(
-                                        F,
+                                      name: `${x.name}.${k}.${M.name}`,
+                                      value: N.value,
+                                      checked: L?.[M.name] === N.value,
+                                      onChange: () => H(
+                                        k,
                                         M.name,
-                                        j.value
+                                        N.value
                                       ),
-                                      disabled: k || j.disabled,
+                                      disabled: E || N.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"
                                     }
                                   ),
-                                  j.label
+                                  N.label
                                 ]
                               },
-                              j.value
+                              N.value
                             )) });
                           case "date": {
-                            const j = O?.[M.name];
+                            const N = L?.[M.name];
                             return /* @__PURE__ */ e(
                               Be,
                               {
-                                ...P,
-                                value: j ? new Date(j) : null,
-                                onChange: (q) => G(
-                                  F,
+                                ...O,
+                                value: N ? new Date(N) : null,
+                                onChange: (I) => H(
+                                  k,
                                   M.name,
-                                  q
+                                  I
                                 ),
                                 size: f
                               }
@@ -3607,14 +3615,14 @@ const bs = ({
                           }
                           case "custom":
                             return M.customComponent?.({
-                              value: O?.[M.name],
-                              onChange: (j) => G(
-                                F,
+                              value: L?.[M.name],
+                              onChange: (N) => H(
+                                k,
                                 M.name,
-                                j
+                                N
                               ),
-                              error: E,
-                              disabled: k
+                              error: G,
+                              disabled: E
                             });
                           // Add other field types here as needed
                           default:
@@ -3625,7 +3633,7 @@ const bs = ({
                             ] });
                         }
                       })(),
-                      E && /* @__PURE__ */ e("p", { className: "text-xs text-danger-fg", children: E })
+                      G && /* @__PURE__ */ e("p", { className: "text-xs text-danger-fg", children: G })
                     ]
                   },
                   M.name
@@ -3638,24 +3646,24 @@ const bs = ({
                   iconOnly: !0,
                   variant: "ghost",
                   size: "md",
-                  "aria-label": `${w.label} verwijderen`,
-                  onClick: () => ce(F),
-                  disabled: k,
-                  className: i("shrink-0", F === 0 && "mt-5"),
+                  "aria-label": `${x.label} verwijderen`,
+                  onClick: () => q(k),
+                  disabled: E,
+                  className: i("shrink-0", k === 0 && "mt-5"),
                   children: /* @__PURE__ */ e(Pt, { className: "size-icon-md" })
                 }
               )
-            ] }, F)),
+            ] }, k)),
             /* @__PURE__ */ c(
               se,
               {
                 type: "button",
                 variant: "secondary",
                 leftIcon: /* @__PURE__ */ e(Ot, { className: "size-icon-sm" }),
-                onClick: ae,
-                disabled: k,
+                onClick: ce,
+                disabled: E,
                 children: [
-                  w.label,
+                  x.label,
                   " toevoegen"
                 ]
               }
@@ -3666,22 +3674,22 @@ const bs = ({
           return null;
       }
     },
-    [x, A, S, b, f, D]
-  ), Y = xe(
-    (w) => {
-      if (w.conditional && !w.conditional(x))
+    [h, U, _, b, f, W]
+  ), de = xe(
+    (x) => {
+      if (x.conditional && !x.conditional(h))
         return null;
-      const h = w.items.filter((k) => !(k.hidden || k.conditional && !k.conditional(x)));
-      if (h.length === 0) return null;
-      const z = i(
-        w.layout === "flex" ? "flex flex-wrap gap-3.5" : "grid gap-3.5",
-        w.layout !== "flex" && {
-          "grid-cols-1": !w.columns || w.columns === 1,
-          "grid-cols-2": w.columns === 2,
-          "grid-cols-3": w.columns === 3,
-          "grid-cols-4": w.columns === 4
+      const S = x.items.filter((E) => !(E.hidden || E.conditional && !E.conditional(h)));
+      if (S.length === 0) return null;
+      const D = 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,
+          "grid-cols-2": x.columns === 2,
+          "grid-cols-3": x.columns === 3,
+          "grid-cols-4": x.columns === 4
         },
-        w.className
+        x.className
       );
       return (
         // A band across the page, closed off with a hairline — no card. The
@@ -3690,41 +3698,48 @@ const bs = ({
         /* @__PURE__ */ e(
           Qr,
           {
-            title: w.title,
-            description: w.description,
+            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: z, children: h.map((k) => {
-              const $ = A[k.name] ? S[k.name] : void 0;
+            children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: D, children: S.map((E) => {
+              const A = U[E.name] ? _[E.name] : void 0;
               return /* @__PURE__ */ c(
                 "div",
                 {
                   className: i(
                     "flex min-w-0 flex-col gap-1.5",
-                    k.type === "checkbox" && "justify-center"
+                    E.type === "checkbox" && "justify-center"
                   ),
                   style: {
-                    width: typeof k.width == "string" ? k.width : void 0,
-                    gridColumn: typeof k.width == "number" ? `span ${k.width} / span ${k.width}` : void 0
+                    width: typeof E.width == "string" ? E.width : void 0,
+                    gridColumn: typeof E.width == "number" ? `span ${E.width} / span ${E.width}` : void 0
                   },
                   children: [
-                    k.type !== "custom" && k.type !== "checkbox" && /* @__PURE__ */ c("label", { className: "block text-sm font-medium text-text-muted", children: [
-                      k.label,
-                      k.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
-                    ] }),
-                    ne(k),
-                    k.help && !$ && /* @__PURE__ */ e("p", { className: "text-xs leading-4 text-text-subtle", children: k.help })
+                    E.type !== "custom" && E.type !== "checkbox" && /* @__PURE__ */ c(
+                      "label",
+                      {
+                        htmlFor: P(E.name),
+                        className: "block text-sm font-medium text-text-muted",
+                        children: [
+                          E.label,
+                          E.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
+                        ]
+                      }
+                    ),
+                    J(E),
+                    E.help && !A && /* @__PURE__ */ e("p", { className: "text-xs leading-4 text-text-subtle", children: E.help })
                   ]
                 },
-                k.name
+                E.name
               );
             }) }) })
           },
-          w.id
+          x.id
         )
       );
     },
-    [x, A, S, ne]
-  ), X = i(
+    [h, U, _, J]
+  ), Y = i(
     {
       "max-w-settings": f === "sm",
       "max-w-form": f === "md",
@@ -3732,10 +3747,10 @@ const bs = ({
       "max-w-full": f === "full"
     },
     g
-  ), de = f === "full" ? "md" : f;
-  return /* @__PURE__ */ c("form", { ref: N, onSubmit: V, className: X, children: [
+  ), y = f === "full" ? "md" : f;
+  return /* @__PURE__ */ c("form", { ref: w, onSubmit: Z, className: Y, children: [
     !v && /* @__PURE__ */ e("button", { type: "submit", className: "hidden", tabIndex: -1, "aria-hidden": !0 }),
-    /* @__PURE__ */ e("div", { className: "flex flex-col", children: t.map(Y) }),
+    /* @__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: [
       /* @__PURE__ */ e("div", { className: "ml-auto" }),
       s && /* @__PURE__ */ e(
@@ -3743,7 +3758,7 @@ const bs = ({
         {
           type: "button",
           variant: d.variant ?? "ghost",
-          size: d.size || de,
+          size: d.size || y,
           disabled: d.disabled || b,
           onClick: s,
           className: d.className,
@@ -3755,7 +3770,7 @@ const bs = ({
         {
           type: "submit",
           variant: u.variant,
-          size: u.size || de,
+          size: u.size || y,
           disabled: u.disabled || b,
           loading: b,
           className: u.className,
@@ -3865,7 +3880,7 @@ function nn({
             onClick: l,
             className: "ml-1.5 flex-shrink-0 hover:opacity-70 transition-opacity",
             "aria-label": "Remove badge",
-            children: /* @__PURE__ */ e(Q, { icon: Se, size: "xs", color: "current" })
+            children: /* @__PURE__ */ e(ee, { icon: Se, size: "xs", color: "current" })
           }
         )
       ]
@@ -4385,7 +4400,7 @@ function kn(t) {
   return r.length >= 2 ? (r[0][0] + r[1][0]).toUpperCase() : r.length === 1 ? r[0].slice(0, 2).toUpperCase() : "?";
 }
 const Cn = ({ name: t, src: r, tone: n = "default", size: s = "sm", className: a, title: l }) => {
-  const [o, u] = oe.useState(!1), d = i(
+  const [o, u] = ae.useState(!1), d = i(
     // Its own token and not `surface-hover`: at 0.972 the plate was within a few
     // percent of every surface it sits on, so the monogram floated instead of
     // sitting in a disc.
@@ -4442,7 +4457,7 @@ const Cn = ({ name: t, src: r, tone: n = "default", size: s = "sm", className: a
       }
     )
   ] });
-}, _e = {
+}, $e = {
   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" },
@@ -4454,7 +4469,7 @@ const Cn = ({ name: t, src: r, tone: n = "default", size: s = "sm", className: a
   lg: "size-avatar-lg rounded-md text-base"
 };
 function zs({ channel: t, children: r, size: n = "md", className: s, title: a }) {
-  const l = t in _e ? _e[t] : void 0;
+  const l = t in $e ? $e[t] : void 0;
   return /* @__PURE__ */ e(
     "span",
     {
@@ -4465,7 +4480,7 @@ function zs({ channel: t, children: r, size: n = "md", className: s, title: a })
         // 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 ? rt(t) : i(_e.note.fg, _e.note.bg),
+        l ? i(l.fg, l.bg) : t ? rt(t) : i($e.note.fg, $e.note.bg),
         s
       ),
       children: r
@@ -4488,15 +4503,15 @@ const Ms = ({
   onError: b,
   ...g
 }) => {
-  const [N, p] = B(!0), [x, C] = B(!1), [S, I] = B(t), A = (X) => {
-    p(!1), C(!1), f?.(X);
-  }, K = (X) => {
-    if (p(!1), C(!0), u && S !== u) {
-      I(u), C(!1), p(!0);
+  const [w, p] = R(!0), [h, C] = R(!1), [z, P] = R(t), _ = (J) => {
+    p(!1), C(!1), f?.(J);
+  }, K = (J) => {
+    if (p(!1), C(!0), u && z !== u) {
+      P(u), C(!1), p(!0);
       return;
     }
-    b?.(X);
-  }, W = i(
+    b?.(J);
+  }, U = i(
     "relative overflow-hidden bg-surface-hover",
     // Size variants
     {
@@ -4524,33 +4539,33 @@ const Ms = ({
       "rounded-full": a === "full"
     },
     m
-  ), D = i(
+  ), j = i(
     "w-full h-full object-cover transition-opacity duration-fast",
     {
-      "opacity-0": N || x,
-      "opacity-100": !N && !x
+      "opacity-0": w || h,
+      "opacity-100": !w && !h
     }
-  ), V = i(
+  ), B = i(
     "absolute inset-0 flex items-center justify-center",
     "text-text-muted"
-  ), ne = /* @__PURE__ */ e("div", { className: "animate-pulse", children: /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-surface-hover rounded" }) }), Y = /* @__PURE__ */ c("div", { className: "text-center", children: [
-    /* @__PURE__ */ e(Q, { icon: Ft, 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" }) }), Z = /* @__PURE__ */ c("div", { className: "text-center", children: [
+    /* @__PURE__ */ e(ee, { icon: Ft, size: "lg", className: "mx-auto mb-1" }),
     /* @__PURE__ */ e("span", { className: "text-xs", children: "Failed to load" })
   ] });
-  return /* @__PURE__ */ c("div", { className: W, children: [
+  return /* @__PURE__ */ c("div", { className: U, children: [
     /* @__PURE__ */ e(
       "img",
       {
         ...g,
-        src: S,
+        src: z,
         alt: r,
-        className: D,
-        onLoad: A,
+        className: j,
+        onLoad: _,
         onError: K
       }
     ),
-    N && l && /* @__PURE__ */ e("div", { className: V, children: d || ne }),
-    x && o && /* @__PURE__ */ e("div", { className: V, children: v || Y })
+    w && l && /* @__PURE__ */ e("div", { className: B, children: d || W }),
+    h && o && /* @__PURE__ */ e("div", { className: B, children: v || Z })
   ] });
 };
 function Ts({
@@ -4576,7 +4591,7 @@ function Ts({
     }
   );
 }
-function _s({
+function $s({
   items: t,
   getRowKey: r,
   variant: n = "divided",
@@ -4591,40 +4606,40 @@ function _s({
   groupBy: f,
   groups: b,
   renderGroupHeader: g,
-  stickyGroupHeaders: N = !1,
+  stickyGroupHeaders: w = !1,
   collapsibleGroups: p = !1,
-  hideGroupCount: x = !1,
+  hideGroupCount: h = !1,
   selectable: C = !1,
-  selectedItems: S = [],
-  onSelectionChange: I,
-  bulkActions: A,
+  selectedItems: z = [],
+  onSelectionChange: P,
+  bulkActions: _,
   header: K,
-  stickyHeader: W = !1,
-  bordered: D = !1,
-  emptyContent: V,
-  loading: ne = !1,
-  loadingRows: Y = 4,
-  className: X,
+  stickyHeader: U = !1,
+  bordered: j = !1,
+  emptyContent: B,
+  loading: W = !1,
+  loadingRows: Z = 4,
+  className: J,
   "aria-label": de
 }) {
-  const [w, h] = oe.useState(
+  const [Y, y] = ae.useState(
     () => Object.fromEntries(
-      (b ?? []).filter((E) => E.defaultCollapsed).map((E) => [E.id, !0])
+      (b ?? []).filter((k) => k.defaultCollapsed).map((k) => [k.id, !0])
     )
-  ), z = oe.useRef(null), k = (E) => {
-    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(E.key)) return;
-    const j = Array.from(
-      z.current?.querySelectorAll("li[data-list-row]") ?? []
+  ), x = ae.useRef(null), S = (k) => {
+    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(k.key)) return;
+    const G = Array.from(
+      x.current?.querySelectorAll("li[data-list-row]") ?? []
     );
-    if (j.length === 0) return;
-    E.preventDefault();
-    const q = j.indexOf(document.activeElement), T = E.key === "Home" ? 0 : E.key === "End" ? j.length - 1 : E.key === "ArrowDown" ? (q + 1) % j.length : (q - 1 + j.length) % j.length;
-    j[T]?.focus();
-  }, $ = (E, P) => r ? r(E, P) : P, y = (E) => S.includes(E), H = (E, P) => {
-    I && I(
-      P ? [...S, E] : S.filter((j) => j !== E)
+    if (G.length === 0) return;
+    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) => {
+    P && P(
+      M ? [...z, k] : z.filter((G) => G !== k)
     );
-  }, ae = (E) => I?.(E ? [...t] : []), ce = i(
+  }, $ = (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
@@ -4632,17 +4647,17 @@ function _s({
     // screen. Growing the box to the height of its parent puts it where it
     // belongs — and only while a selection exists, so an ordinary short list
     // keeps its natural height.
-    C && S.length > 0 && "min-h-full",
-    D && "overflow-hidden rounded-lg border border-border-subtle",
-    X
+    C && z.length > 0 && "min-h-full",
+    j && "overflow-hidden rounded-lg border border-border-subtle",
+    J
   );
-  if (ne)
-    return /* @__PURE__ */ e("div", { className: ce, children: Array.from({ length: Y }).map((E, P) => /* @__PURE__ */ c(
+  if (W)
+    return /* @__PURE__ */ e("div", { className: oe, children: Array.from({ length: Z }).map((k, M) => /* @__PURE__ */ c(
       "div",
       {
         className: i(
           "flex animate-pulse items-center gap-3 px-4 py-2",
-          n === "divided" && P > 0 && "border-t border-border-subtle"
+          n === "divided" && M > 0 && "border-t border-border-subtle"
         ),
         children: [
           /* @__PURE__ */ e("span", { className: "size-tile-sm shrink-0 rounded-md bg-surface-hover" }),
@@ -4651,12 +4666,12 @@ function _s({
           /* @__PURE__ */ e("span", { className: "h-3 w-8 shrink-0 rounded-sm bg-surface-hover" })
         ]
       },
-      `skeleton-${P}`
+      `skeleton-${M}`
     )) });
-  if (t.length === 0 && V)
-    return /* @__PURE__ */ e("div", { className: ce, children: V });
-  const G = t.length > 0 && S.length === t.length, O = S.length > 0 && !G, F = (E, P, j) => {
-    const q = d?.(E, P) ?? !1, T = v?.(E, P) ?? !1, L = m?.(E, P) ?? !1, ee = C && y(E);
+  if (t.length === 0 && B)
+    return /* @__PURE__ */ e("div", { className: oe, children: B });
+  const ce = t.length > 0 && z.length === t.length, q = z.length > 0 && !ce, H = (k, M, G) => {
+    const O = d?.(k, M) ?? !1, N = v?.(k, M) ?? !1, I = m?.(k, M) ?? !1, te = C && E(k);
     return /* @__PURE__ */ c(
       "li",
       {
@@ -4664,34 +4679,34 @@ function _s({
           role: "button",
           tabIndex: 0,
           "data-list-row": "",
-          "aria-current": q || void 0,
-          onClick: () => o(E, P),
-          onFocus: () => u?.(P),
+          "aria-current": O || void 0,
+          onClick: () => o(k, M),
+          onFocus: () => u?.(M),
           onKeyDown: (le) => {
-            le.key !== "Enter" && le.key !== " " || (le.preventDefault(), o(E, P));
+            le.key !== "Enter" && le.key !== " " || (le.preventDefault(), o(k, M));
           }
         } : {},
         className: i(
           "flex items-center gap-3 text-base",
           "transition-colors duration-fast ease-out",
           n === "inset" ? "mx-2 rounded-lg px-3 py-2.5" : "px-5 py-2.5",
-          n === "divided" && !j && "border-t border-border-subtle",
+          n === "divided" && !G && "border-t border-border-subtle",
           o && "cursor-pointer focus-visible:outline-none focus-visible:focus-ring",
           // An unread row is tinted, not bolded: at five columns a bold row
           // shouts across all of them, while the tint marks the row and leaves
           // the consumer free to weight only the sender and the subject.
-          q || ee ? "bg-accent-soft text-text" : T ? i("bg-surface-unread", o && "hover:bg-surface-unread-hover") : o && "hover:bg-surface-hover",
+          O || te ? "bg-accent-soft text-text" : N ? i("bg-surface-unread", o && "hover:bg-surface-unread-hover") : o && "hover:bg-surface-hover",
           // Read rows stay at full opacity — fading them also fades the avatars
           // and team dots, which is exactly the identity you scan by. They read
           // as secondary through weight and text colour instead.
-          L && "text-text-muted"
+          I && "text-text-muted"
         ),
         children: [
           C && /* @__PURE__ */ e("span", { onClick: (le) => le.stopPropagation(), children: /* @__PURE__ */ e(
             we,
             {
-              checked: y(E),
-              onChange: (le) => H(E, le.target.checked),
+              checked: E(k),
+              onChange: (le) => A(k, le.target.checked),
               "aria-label": "Rij selecteren"
             }
           ) }),
@@ -4702,77 +4717,77 @@ function _s({
               className: "mt-2 size-1.5 shrink-0 self-start rounded-full bg-border-strong"
             }
           ),
-          s && /* @__PURE__ */ e("span", { className: "shrink-0", children: s(E, P) }),
-          /* @__PURE__ */ e("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: a ? a(E, P) : String(E) }),
-          l && /* @__PURE__ */ e("span", { className: "shrink-0 text-xs text-text-subtle", children: l(E, P) })
+          s && /* @__PURE__ */ e("span", { className: "shrink-0", children: s(k, M) }),
+          /* @__PURE__ */ e("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: a ? a(k, M) : String(k) }),
+          l && /* @__PURE__ */ e("span", { className: "shrink-0 text-xs text-text-subtle", children: l(k, M) })
         ]
       },
-      $(E, P)
+      D(k, M)
     );
-  }, M = (() => {
+  }, L = (() => {
     if (!f)
-      return t.map((q, T) => F(q, T, T === 0));
-    const E = /* @__PURE__ */ new Map();
-    t.forEach((q, T) => {
-      const L = f(q, T);
-      E.has(L) || E.set(L, []), E.get(L).push({ item: q, index: T });
+      return t.map((O, N) => H(O, N, N === 0));
+    const k = /* @__PURE__ */ new Map();
+    t.forEach((O, N) => {
+      const I = f(O, N);
+      k.has(I) || k.set(I, []), k.get(I).push({ item: O, index: N });
     });
-    const P = b ?? [];
+    const M = b ?? [];
     return [
-      ...P.filter((q) => E.has(q.id)),
-      ...[...E.keys()].filter((q) => !P.some((T) => T.id === q)).map((q) => ({ id: q }))
-    ].flatMap((q, T) => {
-      const L = E.get(q.id) ?? [], ee = p && w[q.id], le = q.title ?? q.id, be = q.count ?? L.length, ye = /* @__PURE__ */ e(
+      ...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(
         "li",
         {
-          onClick: p ? () => h((fe) => ({ ...fe, [q.id]: !fe[q.id] })) : void 0,
+          onClick: p ? () => y((fe) => ({ ...fe, [O.id]: !fe[O.id] })) : void 0,
           className: i(
             // A caption over its rows, not a band across the table: same
             // surface as the rows, no rules, and the count as a quiet pill.
             // The old grey uppercase strip read as a second column header.
             "flex items-center gap-2.5 bg-surface px-5 pb-1.5 text-base font-semibold",
-            T > 0 ? "pt-5" : "pt-3",
-            q.tone === "danger" ? "text-danger-fg" : q.tone === "muted" ? "text-text-subtle" : "text-text",
-            N && "sticky z-10",
+            N > 0 ? "pt-5" : "pt-3",
+            O.tone === "danger" ? "text-danger-fg" : O.tone === "muted" ? "text-text-subtle" : "text-text",
+            w && "sticky z-10",
             p && "cursor-pointer select-none"
           ),
-          "aria-expanded": p ? !ee : void 0,
-          style: N ? { top: W ? 28 : 0 } : void 0,
-          children: g ? g(q, L.map((fe) => fe.item)) : /* @__PURE__ */ c(Ee, { children: [
+          "aria-expanded": p ? !te : void 0,
+          style: w ? { top: U ? 28 : 0 } : void 0,
+          children: g ? g(O, I.map((fe) => fe.item)) : /* @__PURE__ */ c(Ee, { children: [
             p && /* @__PURE__ */ e(
               Le,
               {
                 "aria-hidden": !0,
                 className: i(
                   "size-icon-md shrink-0 text-text-subtle transition-transform duration-fast ease-out",
-                  !ee && "rotate-90"
+                  !te && "rotate-90"
                 )
               }
             ),
             /* @__PURE__ */ e("span", { children: le }),
-            !x && /* @__PURE__ */ e(
+            !h && /* @__PURE__ */ e(
               "span",
               {
                 className: i(
                   "rounded-full px-2 text-xs font-normal tabular-nums",
-                  q.tone === "danger" ? "bg-danger-soft text-danger-fg" : "bg-surface-sunk text-text-subtle"
+                  O.tone === "danger" ? "bg-danger-soft text-danger-fg" : "bg-surface-sunk text-text-subtle"
                 ),
                 children: be
               }
             )
           ] })
         },
-        `group-${q.id}`
+        `group-${O.id}`
       );
-      return ee ? [ye] : [
+      return te ? [ye] : [
         ye,
-        ...L.map(
-          ({ item: fe, index: he }, Oe) => F(fe, he, Oe === 0)
+        ...I.map(
+          ({ item: fe, index: he }, Oe) => H(fe, he, Oe === 0)
         )
       ];
     });
   })();
-  return /* @__PURE__ */ c("div", { ref: z, className: ce, onKeyDown: o ? k : void 0, children: [
+  return /* @__PURE__ */ c("div", { ref: x, className: oe, onKeyDown: o ? S : void 0, children: [
     K && /* @__PURE__ */ c(
       "div",
       {
@@ -4781,15 +4796,15 @@ function _s({
           // sticky group headers park against.
           "flex h-row-sm items-end gap-3 border-b border-border bg-surface px-5 pb-2",
           "text-xs font-semibold uppercase tracking-wider text-text-disabled",
-          W && "sticky top-0 z-20"
+          U && "sticky top-0 z-20"
         ),
         children: [
           C && /* @__PURE__ */ e("span", { className: "flex items-center", children: /* @__PURE__ */ e(
             we,
             {
-              checked: G,
-              indeterminate: O,
-              onChange: (E) => ae(E.target.checked),
+              checked: ce,
+              indeterminate: q,
+              onChange: (k) => $(k.target.checked),
               "aria-label": "Alles selecteren"
             }
           ) }),
@@ -4797,20 +4812,20 @@ function _s({
         ]
       }
     ),
-    /* @__PURE__ */ e("ul", { "aria-label": de, className: "flex flex-col", children: M }),
-    C && S.length > 0 && /* @__PURE__ */ e("div", { className: "pointer-events-none sticky bottom-0 z-10 flex justify-center px-5 pb-4", children: /* @__PURE__ */ c("div", { className: "pointer-events-auto flex items-center gap-1.5 rounded-lg bg-accent py-1.5 pl-3.5 pr-1.5 text-accent-fg shadow-overlay", children: [
+    /* @__PURE__ */ e("ul", { "aria-label": de, className: "flex flex-col", children: L }),
+    C && z.length > 0 && /* @__PURE__ */ e("div", { className: "pointer-events-none sticky bottom-0 z-10 flex justify-center px-5 pb-4", children: /* @__PURE__ */ c("div", { className: "pointer-events-auto flex items-center gap-1.5 rounded-lg bg-accent py-1.5 pl-3.5 pr-1.5 text-accent-fg shadow-overlay", children: [
       /* @__PURE__ */ c("span", { className: "text-sm font-medium", children: [
-        S.length,
+        z.length,
         " geselecteerd"
       ] }),
       /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "mx-1.5 h-4 w-px bg-current opacity-25" }),
-      A,
+      _,
       /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "mx-1.5 h-4 w-px bg-current opacity-25" }),
       /* @__PURE__ */ e(
         "button",
         {
           type: "button",
-          onClick: () => I?.([]),
+          onClick: () => P?.([]),
           "aria-label": "Selectie wissen",
           className: "grid size-tile-md shrink-0 cursor-pointer place-items-center rounded-md transition-colors duration-fast ease-out hover:bg-white/15 focus-visible:outline-none focus-visible:focus-ring",
           children: /* @__PURE__ */ e(Se, { className: "size-icon-lg" })
@@ -4819,7 +4834,7 @@ function _s({
     ] }) })
   ] });
 }
-function $s({
+function _s({
   side: t,
   continued: r = !1,
   tone: n = "default",
@@ -4861,13 +4876,13 @@ const zn = {
   urgent: "text-danger-fg",
   success: "text-success-fg"
 };
-function As({ value: t, label: r, tone: n = "default", className: s, ...a }) {
+function Ds({ 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", zn[n]), children: t }),
     /* @__PURE__ */ e("div", { className: "pt-0.5 text-xs text-text-muted", children: r })
   ] });
 }
-function Ds({ icon: t, label: r, unset: n, className: s }) {
+function As({ icon: t, label: r, unset: n, className: s }) {
   return /* @__PURE__ */ c(
     "span",
     {
@@ -4900,18 +4915,18 @@ const Mn = ({
   editable: m = !1,
   onTitleChange: f
 }) => {
-  const [b, g] = B(!1), [N, p] = B(r), x = re(null);
-  J(() => {
+  const [b, g] = R(!1), [w, p] = R(r), h = ne(null);
+  X(() => {
     p(r);
-  }, [r]), J(() => {
-    b && x.current && (x.current.focus(), x.current.select());
+  }, [r]), X(() => {
+    b && h.current && (h.current.focus(), h.current.select());
   }, [b]);
   const C = () => {
     m && g(!0);
-  }, S = () => {
-    g(!1), N.trim() !== "" && N !== r && f ? f(N.trim()) : p(r);
-  }, I = (A) => {
-    A.key === "Enter" ? x.current?.blur() : A.key === "Escape" && (p(r), g(!1));
+  }, z = () => {
+    g(!1), w.trim() !== "" && w !== r && f ? f(w.trim()) : p(r);
+  }, P = (_) => {
+    _.key === "Enter" ? h.current?.blur() : _.key === "Escape" && (p(r), g(!1));
   };
   return /* @__PURE__ */ c(
     "div",
@@ -4930,17 +4945,17 @@ const Mn = ({
           /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ c("div", { className: "flex items-start gap-4 text-text", children: [
             v && // Ghost: a framed box around a back chevron makes the way out of a
             // page look like the page's primary control.
-            /* @__PURE__ */ e(se, { variant: "ghost", onClick: v, leftIcon: /* @__PURE__ */ e(Q, { icon: ze, size: "md" }), iconOnly: !0 }),
+            /* @__PURE__ */ e(se, { variant: "ghost", onClick: v, leftIcon: /* @__PURE__ */ e(ee, { icon: ze, size: "md" }), iconOnly: !0 }),
             /* @__PURE__ */ c("div", { className: "min-w-0 flex-1", children: [
               b ? /* @__PURE__ */ e(
                 "input",
                 {
-                  ref: x,
+                  ref: h,
                   type: "text",
-                  value: N,
-                  onChange: (A) => p(A.target.value),
-                  onBlur: S,
-                  onKeyDown: I,
+                  value: w,
+                  onChange: (_) => p(_.target.value),
+                  onBlur: z,
+                  onKeyDown: P,
                   className: "text-1xl font-semibold bg-transparent border-b-1 border-border rounded-lg outline-none focus:border-none px-1 -mx-1 min-w-0 w-full"
                 }
               ) : /* @__PURE__ */ c("div", { className: "group flex items-baseline gap-2.5 min-w-0", children: [
@@ -4983,29 +4998,29 @@ const Mn = ({
             ] })
           ] }) }),
           a.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-wrap sm:flex-nowrap gap-2 sm:gap-3", children: a.map(
-            (A) => A.render ? /* @__PURE__ */ e(oe.Fragment, { children: A.render() }, A.id) : A.splitOptions && A.splitOptions.length > 0 ? /* @__PURE__ */ e(
+            (_) => _.render ? /* @__PURE__ */ e(ae.Fragment, { children: _.render() }, _.id) : _.splitOptions && _.splitOptions.length > 0 ? /* @__PURE__ */ e(
               st,
               {
-                label: A.label,
-                onClick: A.onClick,
-                icon: A.icon,
-                variant: A.variant === "primary" ? "primary" : "outline",
-                options: A.splitOptions,
-                disabled: A.disabled
+                label: _.label,
+                onClick: _.onClick,
+                icon: _.icon,
+                variant: _.variant === "primary" ? "primary" : "outline",
+                options: _.splitOptions,
+                disabled: _.disabled
               },
-              A.id
+              _.id
             ) : /* @__PURE__ */ e(
               se,
               {
-                variant: A.variant ?? "secondary",
+                variant: _.variant ?? "secondary",
                 onClick: (K) => {
-                  K.stopPropagation(), K.target.blur(), A.onClick();
+                  K.stopPropagation(), K.target.blur(), _.onClick();
                 },
-                disabled: A.disabled,
-                leftIcon: A.icon,
-                children: A.label
+                disabled: _.disabled,
+                leftIcon: _.icon,
+                children: _.label
               },
-              A.id
+              _.id
             )
           ) })
         ] }),
@@ -5032,11 +5047,11 @@ const Mn = ({
   empty: f,
   padding: b = "md",
   scroll: g = !0,
-  className: N,
+  className: w,
   contentClassName: p,
-  children: x
+  children: h
 }) => {
-  const C = v ? /* @__PURE__ */ e(qe, { variant: "inline", shape: m }) : f ? /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center py-12", children: f }) : x;
+  const C = v ? /* @__PURE__ */ e(qe, { variant: "inline", shape: m }) : f ? /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center py-12", children: f }) : h;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -5046,7 +5061,7 @@ const Mn = ({
         // the header; without `min-h-0` the body would grow past the card
         // instead of scrolling inside it.
         g ? "flex h-full min-h-0 flex-col" : "flex flex-col",
-        N
+        w
       ),
       children: [
         /* @__PURE__ */ e(
@@ -5093,11 +5108,11 @@ function Os({ label: t, trailing: r, align: n = "center", className: s }) {
   ] });
 }
 const dt = et(null), js = dt.Provider;
-function _n() {
+function $n() {
   return yt(dt);
 }
 function Fs() {
-  const [t, r] = B(null), n = pe(
+  const [t, r] = R(null), n = pe(
     () => ({
       setTrail: (s, a) => r((l) => a ? { ownerId: s, entry: a } : l && l.ownerId !== s ? l : null)
     }),
@@ -5105,7 +5120,7 @@ function Fs() {
   );
   return { trail: t?.entry ?? null, api: n };
 }
-const $n = {
+const _n = {
   none: "",
   sm: "px-3 py-3",
   // Matches the frame header's own horizontal padding, so content lines up
@@ -5125,37 +5140,37 @@ const $n = {
   className: m,
   contentClassName: f
 }) => {
-  const b = _n(), g = vt(), N = re(a);
-  N.current = a;
-  const p = !!a, x = re(r);
-  x.current = r;
-  const C = re(n);
+  const b = $n(), g = vt(), w = ne(a);
+  w.current = a;
+  const p = !!a, h = ne(r);
+  h.current = r;
+  const C = ne(n);
   C.current = n;
-  const S = s === "header", I = S && (r.length > 0 || n.length > 0), A = I ? JSON.stringify(
-    [...n, ...r].map((D) => [D.id, D.label, D.variant, D.disabled])
+  const z = s === "header", P = z && (r.length > 0 || n.length > 0), _ = P ? JSON.stringify(
+    [...n, ...r].map((j) => [j.id, j.label, j.variant, j.disabled])
   ) : "", K = pe(() => {
-    if (!I) return;
-    const D = (V) => (ne, Y) => ({
-      ...ne,
+    if (!P) return;
+    const j = (B) => (W, Z) => ({
+      ...W,
       onClick: () => {
-        (V === "primary" ? x.current : C.current)[Y]?.onClick();
+        (B === "primary" ? h.current : C.current)[Z]?.onClick();
       }
     });
     return {
-      actions: x.current.map(D("primary")),
-      secondaryActions: C.current.map(D("secondary"))
+      actions: h.current.map(j("primary")),
+      secondaryActions: C.current.map(j("secondary"))
     };
-  }, [I, A]);
-  J(() => {
+  }, [P, _]);
+  X(() => {
     if (b && !(!p && !o && !K))
       return b.setTrail(g, {
         title: o,
-        onBack: p ? () => N.current?.() : void 0,
+        onBack: p ? () => w.current?.() : void 0,
         actions: K?.actions,
         secondaryActions: K?.secondaryActions
       }), () => b.setTrail(g, null);
   }, [b, g, o, p, K]);
-  const W = !S && (r.length > 0 || n.length > 0);
+  const U = !z && (r.length > 0 || n.length > 0);
   return (
     /**
      * `min-h-full` + a sticky footer, rather than a nested scroll container.
@@ -5164,25 +5179,25 @@ const $n = {
      * its footer to the bottom, and a long one keeps it pinned while scrolling.
      */
     /* @__PURE__ */ c("div", { className: i("flex min-h-full flex-col", m), children: [
-      !b && (p || o || I) && /* @__PURE__ */ c("div", { className: "flex shrink-0 items-center gap-2 px-5 pt-4", children: [
+      !b && (p || o || P) && /* @__PURE__ */ c("div", { className: "flex shrink-0 items-center gap-2 px-5 pt-4", children: [
         p && /* @__PURE__ */ e(
           se,
           {
             variant: "ghost",
-            onClick: () => N.current?.(),
+            onClick: () => w.current?.(),
             "aria-label": l,
-            leftIcon: /* @__PURE__ */ e(Q, { icon: ze, size: "sm" }),
+            leftIcon: /* @__PURE__ */ e(ee, { icon: ze, size: "sm" }),
             iconOnly: !0
           }
         ),
         o && /* @__PURE__ */ e("h2", { className: "min-w-0 truncate text-md font-semibold tracking-title text-text", children: o }),
-        S && /* @__PURE__ */ c("div", { className: "ml-auto flex items-center gap-2", children: [
+        z && /* @__PURE__ */ c("div", { className: "ml-auto flex items-center gap-2", children: [
           n.length > 0 && /* @__PURE__ */ e(ke, { actions: n, defaultVariant: "ghost" }),
           r.length > 0 && /* @__PURE__ */ e(ke, { actions: r })
         ] })
       ] }),
-      /* @__PURE__ */ e("div", { className: i("flex-1", $n[v], f), children: u ? /* @__PURE__ */ e(qe, { variant: "inline", shape: d }) : t }),
-      W && /* @__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: [
+      /* @__PURE__ */ e("div", { className: i("flex-1", _n[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" })
       ] })
@@ -5226,7 +5241,7 @@ function Hs({
 }) {
   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(Q, { icon: t, size: "md", color: "secondary", className: "mt-0.5" }),
+      t && /* @__PURE__ */ e(ee, { 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 })
@@ -5249,12 +5264,12 @@ function qs({ label: t, dotColor: r, onClick: n, className: s }) {
       children: [
         r && /* @__PURE__ */ e("span", { className: "h-1.5 w-1.5 shrink-0 rounded-full", style: { backgroundColor: r }, "aria-hidden": !0 }),
         /* @__PURE__ */ e("span", { className: "min-w-0 truncate", children: t }),
-        /* @__PURE__ */ e(Q, { icon: Bt, size: "xs", className: "opacity-70" })
+        /* @__PURE__ */ e(ee, { icon: Bt, size: "xs", className: "opacity-70" })
       ]
     }
   );
 }
-function An(t) {
+function Dn(t) {
   const { id: r, header: n, accessor: s, label: a, tone: l, visible: o, width: u, sortable: d, align: v } = t;
   return {
     id: r,
@@ -5281,7 +5296,7 @@ function Vs(t) {
     width: d,
     sortable: v
   } = t;
-  return An({
+  return Dn({
     id: r,
     header: n,
     accessor: (m) => !!s(m),
@@ -5307,7 +5322,7 @@ function Us(t) {
     id: r,
     header: n,
     accessor: (m) => {
-      const f = s(m), g = (f == null ? [] : Array.isArray(f) ? f : [f]).filter(Boolean).map((N) => a(N) ?? N);
+      const f = s(m), g = (f == null ? [] : Array.isArray(f) ? f : [f]).filter(Boolean).map((w) => a(w) ?? w);
       return g.length ? g.join(o) : l;
     },
     width: u,
@@ -5315,7 +5330,7 @@ function Us(t) {
     sortable: v
   };
 }
-function Dn(t, r) {
+function An(t, r) {
   return r.split(".").reduce(
     (n, s) => n && typeof n == "object" && s in n ? n[s] : void 0,
     t
@@ -5344,7 +5359,7 @@ const Ws = ({
     return b ? b.label : String(m || "-");
   }, u = xe(
     (m) => {
-      const f = Dn(r, m.name);
+      const f = An(r, m.name);
       if (m.type === "array") {
         const g = f;
         return !g || g.length === 0 ? /* @__PURE__ */ e(
@@ -5355,7 +5370,7 @@ const Ws = ({
             className: "text-text-muted",
             children: "Geen items"
           }
-        ) : /* @__PURE__ */ e("div", { className: "space-y-3", children: g.map((N, p) => /* @__PURE__ */ c(
+        ) : /* @__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",
@@ -5374,47 +5389,47 @@ const Ws = ({
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: m.arrayFields?.map((x) => {
-                const C = N?.[x.name];
-                let S = "-";
-                switch (x.type) {
+              /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: m.arrayFields?.map((h) => {
+                const C = w?.[h.name];
+                let z = "-";
+                switch (h.type) {
                   case "text":
                   case "email":
                   case "number":
                   case "tel":
                   case "url":
                   case "textarea":
-                    S = C || "-";
+                    z = C || "-";
                     break;
                   case "select":
                   case "radio":
-                    S = o(
+                    z = o(
                       C,
-                      x.options
+                      h.options
                     );
                     break;
                   case "checkbox":
-                    S = l(C);
+                    z = l(C);
                     break;
                   case "date":
-                    S = a(C);
+                    z = a(C);
                     break;
                   case "custom":
-                    S = x.customComponent?.({
+                    z = h.customComponent?.({
                       value: C
                     });
                     break;
                   default:
-                    S = String(C || "-");
+                    z = String(C || "-");
                 }
-                return x.format && (S = x.format(C, N)), /* @__PURE__ */ c("div", { className: "space-y-1", children: [
+                return h.format && (z = h.format(C, w)), /* @__PURE__ */ c("div", { className: "space-y-1", children: [
                   /* @__PURE__ */ e(
                     ue,
                     {
                       variant: "label",
                       size: "xs",
                       className: "text-text-muted",
-                      children: x.label
+                      children: h.label
                     }
                   ),
                   /* @__PURE__ */ e(
@@ -5423,10 +5438,10 @@ const Ws = ({
                       variant: "body",
                       size: "sm",
                       className: "text-text",
-                      children: S
+                      children: z
                     }
                   )
-                ] }, x.name);
+                ] }, h.name);
               }) })
             ]
           },
@@ -5763,37 +5778,37 @@ const Js = ({
   initialCommandPath: a,
   initialActiveIndex: l
 }) => {
-  const [o, u] = B(""), [d, v] = B(a || []), [m, f] = B(l || 0), b = re(null), g = re(null), p = (d.length ? t.find((x) => x.id === d[0])?.subCommands || [] : t).filter(
-    (x) => x.label.toLowerCase().includes(o.toLowerCase())
+  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 J(() => {
+  return X(() => {
     r || (u(""), v(a || []), f(l || 0));
-  }, [r]), J(() => {
-    const x = (C) => {
+  }, [r]), X(() => {
+    const h = (C) => {
       if (r) {
         if (C.key === "Escape")
           n();
         else if (C.key === "ArrowUp")
           f(
-            (S) => S > 0 ? S - 1 : p.length - 1
+            (z) => z > 0 ? z - 1 : p.length - 1
           );
         else if (C.key === "ArrowDown")
           f(
-            (S) => S < p.length - 1 ? S + 1 : 0
+            (z) => z < p.length - 1 ? z + 1 : 0
           );
         else if (C.key === "Enter") {
-          const S = p[m];
-          S && (S.subCommands ? (v([...d, S.id]), f(0)) : S.action && (S.action(), n()));
+          const z = p[m];
+          z && (z.subCommands ? (v([...d, z.id]), f(0)) : z.action && (z.action(), n()));
         }
       }
     };
-    return document.addEventListener("keydown", x), () => document.removeEventListener("keydown", x);
-  }, [r, n, p, m, d]), J(() => {
-    const x = (C) => {
+    return document.addEventListener("keydown", h), () => document.removeEventListener("keydown", h);
+  }, [r, n, p, m, d]), X(() => {
+    const h = (C) => {
       b.current && !b.current.contains(C.target) && n();
     };
-    return r && document.addEventListener("mousedown", x), () => document.removeEventListener("mousedown", x);
-  }, [r, n]), J(() => {
+    return r && document.addEventListener("mousedown", h), () => document.removeEventListener("mousedown", h);
+  }, [r, n]), X(() => {
     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(
@@ -5811,7 +5826,7 @@ const Js = ({
               autoFocus: !0,
               placeholder: s?.searchPlaceholder || "Search commands...",
               value: o,
-              onChange: (x) => u(x.target.value),
+              onChange: (h) => u(h.target.value),
               className: "w-full border-0 bg-transparent py-2 text-text focus:outline-none"
             }
           )
@@ -5823,22 +5838,22 @@ const Js = ({
             className: "mt-2 pt-2 text-sm border-t border-border max-h-dialog-list overflow-y-auto",
             children: [
               p.length === 0 && /* @__PURE__ */ e("div", { className: "text-text-muted text-center text-sm", children: s?.noCommandsFound || "No commands found" }),
-              p.map((x, C) => /* @__PURE__ */ c(
+              p.map((h, C) => /* @__PURE__ */ c(
                 "div",
                 {
                   "data-index": C,
                   className: `flex items-center p-2 cursor-pointer rounded-md ${C === m ? "bg-accent-soft text-accent" : "text-text"}`,
                   onClick: () => {
-                    x.subCommands ? (v([...d, x.id]), f(0)) : x.action && (x.action(), n());
+                    h.subCommands ? (v([...d, h.id]), f(0)) : h.action && (h.action(), n());
                   },
                   onMouseEnter: () => f(C),
                   children: [
-                    x.icon && /* @__PURE__ */ e("span", { className: "mr-3", children: x.icon }),
-                    /* @__PURE__ */ e("span", { className: "flex-grow", children: x.label }),
-                    x.subCommands && /* @__PURE__ */ e("span", { className: "text-text-muted", children: /* @__PURE__ */ e(Le, { className: "w-4 h-4" }) })
+                    h.icon && /* @__PURE__ */ e("span", { className: "mr-3", children: h.icon }),
+                    /* @__PURE__ */ e("span", { className: "flex-grow", children: h.label }),
+                    h.subCommands && /* @__PURE__ */ e("span", { className: "text-text-muted", children: /* @__PURE__ */ e(Le, { className: "w-4 h-4" }) })
                   ]
                 },
-                x.id
+                h.id
               ))
             ]
           }
@@ -5977,44 +5992,44 @@ function Xs({
   componentProps: l,
   className: o
 }) {
-  const u = re(null), [d, v] = B(null), [, m] = B(0), f = re(null), b = re(r);
-  b.current = r, J(() => {
+  const u = ne(null), [d, v] = R(null), [, m] = R(0), f = ne(null), b = ne(r);
+  b.current = r, X(() => {
     if (Re.has(t)) return;
     let C = !0;
     return (async () => {
       try {
-        const I = await b.current();
+        const P = await b.current();
         if (!C) return;
-        Re.set(t, I), m((A) => A + 1);
-      } catch (I) {
-        console.error(`[FederatedResource] Load failed: ${t}`, I), C && v(t);
+        Re.set(t, P), m((_) => _ + 1);
+      } catch (P) {
+        console.error(`[FederatedResource] Load failed: ${t}`, P), C && v(t);
       }
     })(), () => {
       C = !1;
     };
   }, [t]);
-  const g = Re.get(t) ?? null, N = !g && d === t, p = !g && !N, x = g ? n === "react" && (g.component || g.default) || g : null;
-  return J(() => {
-    if (!x || n === "react") return;
+  const g = Re.get(t) ?? null, w = !g && d === t, p = !g && !w, h = g ? n === "react" && (g.component || g.default) || g : null;
+  return X(() => {
+    if (!h || n === "react") return;
     const C = u.current;
     if (C) {
       if (n === "svelte") {
-        const S = x.default || x, I = new S({ target: C, props: l || {} });
-        return f.current = I, () => I.$destroy();
+        const z = h.default || h, P = new z({ target: C, props: l || {} });
+        return f.current = P, () => P.$destroy();
       }
-      if (x.mount) {
-        const S = x.mount({ container: C, props: l || {} });
+      if (h.mount) {
+        const z = h.mount({ container: C, props: l || {} });
         return () => {
-          typeof S == "function" ? S() : x.unmount?.(C);
+          typeof z == "function" ? z() : h.unmount?.(C);
         };
       }
     }
-  }, [x, n]), J(() => {
+  }, [h, n]), X(() => {
     n === "svelte" && f.current && f.current.$set?.(l);
   }, [l, n]), /* @__PURE__ */ c("div", { ref: u, className: o, style: { display: "contents" }, children: [
     p && s,
-    N && a,
-    n === "react" && x && /* @__PURE__ */ e(x, { ...l })
+    w && a,
+    n === "react" && h && /* @__PURE__ */ e(h, { ...l })
   ] });
 }
 class Zs extends Nt {
@@ -6066,23 +6081,23 @@ export {
   Zs as ErrorBoundary,
   Xs as FederatedResource,
   cr as FilterChip,
-  Ar as FolderSelect,
+  Dr as FolderSelect,
   bs as Form,
   Qr as FormSection,
   Gs as Heading,
   Ut as IDENTITY_TONE_COUNT,
-  Q as Icon,
+  ee as Icon,
   Ms as Image,
   ds as ImageField,
   vs as Kbd,
-  As as KpiCard,
+  Ds as KpiCard,
   is as Link,
-  _s as List,
+  $s as List,
   Ts as ListBulkAction,
   ss as MeetingGrid,
-  $s as MessageBubble,
+  _s as MessageBubble,
   Ls as MetaSeparator,
-  Ds as MetaValue,
+  As as MetaValue,
   it as Modal,
   Is as Page,
   Mn as PageHeader,
@@ -6097,7 +6112,7 @@ export {
   Ps as SectionCaption,
   Os as SectionDivider,
   fr as SegmentedToggle,
-  Ae as Select,
+  De as Select,
   js as SettingsFrameProvider,
   Rs as SettingsPage,
   Bs as SettingsRow,
@@ -6119,7 +6134,7 @@ export {
   ls as VideoSurface,
   Ws as View,
   Xe as autofillProps,
-  An as badgeColumn,
+  Dn as badgeColumn,
   Vs as booleanBadgeColumn,
   ns as catTone,
   i as cn,
@@ -6134,9 +6149,9 @@ export {
   Jt as normalizeText,
   cs as resolveLucideIcon,
   fs as selectFilterHandler,
-  $e as text,
+  _e as text,
   Pe as useAnchoredPosition,
-  _n as useSettingsFrame,
+  $n as useSettingsFrame,
   Fs as useSettingsFrameHost
 };
 //# sourceMappingURL=index.js.map