npm - @opencxh/ui-kit - Versions diffs - 3.137.10 → 3.137.11 - Mend

@opencxh/ui-kit 3.137.10 → 3.137.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/dist/index.cjs +2 -2
package/dist/index.cjs.map +1 -1
package/dist/index.js +959 -864
package/dist/index.js.map +1 -1
package/dist/src/content/Avatar.d.ts +6 -1
package/dist/src/content/ChannelBadge.d.ts +6 -1
package/dist/src/content/Icon.d.ts +9 -0
package/dist/src/forms/Form.d.ts +5 -1
package/dist/src/forms/autofill.d.ts +30 -0
package/dist/src/index.d.ts +4 -1
package/dist/src/utils/identity.d.ts +25 -0
package/package.json +1 -1

package/dist/index.js CHANGED Viewed

@@ -1,35 +1,81 @@
-import { clsx as at } from "clsx";
-import { jsxs as c, jsx as e, Fragment as ke } from "react/jsx-runtime";
-import { VideoOff as lt, User as ot, MicOff as ct, Mic as it, X as we, ChevronDown as Me, ExternalLink as dt, Calendar as ut, ChevronLeft as Ce, ChevronRight as $e, ChevronDownIcon as mt, Loader2 as ft, Search as Te, Check as je, ChevronUp as ht, Ellipsis as xt, FileText as Ae, HardDrive as Oe, ArrowLeft as bt, FolderPlus as gt, Upload as pt, Folder as Fe, Trash2 as vt, Plus as yt, Sparkles as Nt, ImageOff as wt, Pencil as kt, ArrowUpRight as Ct } from "lucide-react";
-import ce, { useRef as ne, useEffect as G, forwardRef as be, useState as O, useLayoutEffect as St, useMemo as pe, useCallback as xe, createContext as We, useId as Et, useContext as zt, Component as Mt } from "react";
-import $t from "dompurify";
-import Tt from "react-markdown";
-import _t from "remark-gfm";
-function i(...t) {
-  return at(t);
+import { clsx as ct } from "clsx";
+import ce, { useState as O, useLayoutEffect as it, useRef as ne, useEffect as G, forwardRef as be, useMemo as pe, useCallback as xe, createContext as Ke, useId as dt, useContext as ut, Component as mt } from "react";
+import { jsxs as i, jsx as e, Fragment as ke } from "react/jsx-runtime";
+import * as ft from "lucide-react";
+import { VideoOff as ht, User as xt, MicOff as bt, Mic as gt, X as we, ChevronDown as Te, ExternalLink as pt, Calendar as vt, ChevronLeft as Ce, ChevronRight as $e, ChevronDownIcon as yt, Loader2 as Nt, Search as _e, Check as Oe, ChevronUp as wt, Ellipsis as kt, FileText as Le, HardDrive as Fe, ArrowLeft as Ct, FolderPlus as St, Upload as Et, Folder as Be, Trash2 as zt, Plus as Mt, Sparkles as Tt, ImageOff as $t, Pencil as _t, ArrowUpRight as Dt } from "lucide-react";
+import At from "dompurify";
+import Lt from "react-markdown";
+import It from "remark-gfm";
+function c(...t) {
+  return ct(t);
 }
-function kn(t) {
+function Dn(t) {
   return (r, n) => t[r]?.[n] || "";
 }
-function Cn(t) {
+function An(t) {
   return (r) => t[r] || "";
 }
-const Be = ["cat-1", "cat-2", "cat-3", "cat-4", "cat-5"];
-function Sn(t) {
+function De(t, r, { gap: n = 6, matchWidth: s = !1, placement: a = "bottom-start" } = {}) {
+  const [l, o] = O({});
+  return it(() => {
+    if (!t) return;
+    const f = () => {
+      const d = r.current;
+      if (!d) return;
+      const v = d.getBoundingClientRect(), h = window.innerHeight - v.bottom, m = v.top, b = a.startsWith("top"), p = b ? m < 200 && h > m : h < 200 && m > h, w = b !== p, g = { position: "fixed" };
+      w ? (g.bottom = window.innerHeight - v.top + n, g.maxHeight = Math.max(120, m - n * 2)) : (g.top = v.bottom + n, g.maxHeight = Math.max(120, h - n * 2)), a.endsWith("end") ? g.right = window.innerWidth - v.right : g.left = v.left, s && (g.width = v.width), o(g);
+    };
+    return f(), window.addEventListener("scroll", f, !0), window.addEventListener("resize", f), () => {
+      window.removeEventListener("scroll", f, !0), window.removeEventListener("resize", f);
+    };
+  }, [t, r, n, s, a]), l;
+}
+const Pt = 5;
+function jt(t) {
+  let r = 2166136261;
+  for (let n = 0; n < t.length; n++)
+    r ^= t.charCodeAt(n), r = Math.imul(r, 16777619);
+  return r >>> 0;
+}
+function Ge(t) {
+  const r = (t ?? "").trim().toLowerCase();
+  return r ? jt(r) % Pt + 1 : 1;
+}
+const Ot = {
+  1: "bg-cat-1-soft text-cat-1-fg",
+  2: "bg-cat-2-soft text-cat-2-fg",
+  3: "bg-cat-3-soft text-cat-3-fg",
+  4: "bg-cat-4-soft text-cat-4-fg",
+  5: "bg-cat-5-soft text-cat-5-fg"
+}, Ft = {
+  1: "bg-cat-1",
+  2: "bg-cat-2",
+  3: "bg-cat-3",
+  4: "bg-cat-4",
+  5: "bg-cat-5"
+};
+function Je(t) {
+  return Ot[Ge(t)];
+}
+function Ln(t) {
+  return Ft[Ge(t)];
+}
+const Re = ["cat-1", "cat-2", "cat-3", "cat-4", "cat-5"];
+function In(t) {
   let r = 0;
   for (let n = 0; n < t.length; n++) r = r * 31 + t.charCodeAt(n) >>> 0;
-  return Be[r % Be.length];
+  return Re[r % Re.length];
 }
-function En({ tiles: t, pinned: r, className: n }) {
+function Pn({ tiles: t, pinned: r, className: n }) {
   if (r)
-    return /* @__PURE__ */ c("div", { className: i("flex flex-col md:flex-row gap-2 h-full min-h-0", n), children: [
+    return /* @__PURE__ */ i("div", { className: c("flex flex-col md:flex-row gap-2 h-full min-h-0", n), children: [
       /* @__PURE__ */ e("div", { className: "flex-1 min-h-0", children: r }),
       t.length > 0 && /* @__PURE__ */ e("div", { className: "flex md:flex-col gap-2 md:w-48 overflow-auto", children: t.map((a, l) => /* @__PURE__ */ e("div", { className: "min-w-40 md:min-w-0", children: a }, l)) })
     ] });
   const s = t.length <= 1 ? "grid-cols-1" : t.length <= 4 ? "grid-cols-2" : t.length <= 9 ? "grid-cols-3" : "grid-cols-4";
-  return /* @__PURE__ */ e("div", { className: i("grid gap-2 h-full", s, n), children: t.map((a, l) => /* @__PURE__ */ e("div", { children: a }, l)) });
+  return /* @__PURE__ */ e("div", { className: c("grid gap-2 h-full", s, n), children: t.map((a, l) => /* @__PURE__ */ e("div", { children: a }, l)) });
 }
-function zn({
+function jn({
   name: t,
   avatarUrl: r,
   muted: n,
@@ -39,26 +85,26 @@ function zn({
   className: o,
   fill: f
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: i(
+      className: c(
         "relative rounded-lg overflow-hidden bg-video-surface flex items-center justify-center",
         f ? "h-full w-full" : "aspect-video",
         s && "ring-2 ring-speaking",
         o
       ),
       children: [
-        a && l ? /* @__PURE__ */ e("div", { className: "absolute inset-0", children: l }) : /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-2 text-gray-300", children: r ? /* @__PURE__ */ e("img", { src: r, alt: t, className: "w-16 h-16 rounded-full object-cover" }) : /* @__PURE__ */ e("div", { className: "w-16 h-16 rounded-full bg-video-surface-strong flex items-center justify-center", children: a ? /* @__PURE__ */ e(lt, { className: "w-8 h-8" }) : /* @__PURE__ */ e(ot, { className: "w-8 h-8" }) }) }),
-        /* @__PURE__ */ c("div", { className: "absolute bottom-2 left-2 flex items-center gap-1.5 px-2 py-1 rounded bg-video-overlay text-white text-xs", children: [
-          n ? /* @__PURE__ */ e(ct, { className: "w-3 h-3" }) : /* @__PURE__ */ e(it, { className: "w-3 h-3" }),
+        a && l ? /* @__PURE__ */ e("div", { className: "absolute inset-0", children: l }) : /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-2 text-gray-300", children: r ? /* @__PURE__ */ e("img", { src: r, alt: t, className: "w-16 h-16 rounded-full object-cover" }) : /* @__PURE__ */ e("div", { className: "w-16 h-16 rounded-full bg-video-surface-strong flex items-center justify-center", children: a ? /* @__PURE__ */ e(ht, { className: "w-8 h-8" }) : /* @__PURE__ */ e(xt, { className: "w-8 h-8" }) }) }),
+        /* @__PURE__ */ i("div", { className: "absolute bottom-2 left-2 flex items-center gap-1.5 px-2 py-1 rounded bg-video-overlay text-white text-xs", children: [
+          n ? /* @__PURE__ */ e(bt, { className: "w-3 h-3" }) : /* @__PURE__ */ e(gt, { className: "w-3 h-3" }),
           /* @__PURE__ */ e("span", { className: "truncate max-w-35", children: t })
         ] })
       ]
     }
   );
 }
-function Mn({ attach: t, active: r = !0, mirrored: n = !1, className: s }) {
+function On({ attach: t, active: r = !0, mirrored: n = !1, className: s }) {
   const a = ne(null);
   return G(() => {
     if (!r || !a.current) return;
@@ -70,7 +116,7 @@ function Mn({ attach: t, active: r = !0, mirrored: n = !1, className: s }) {
     "div",
     {
       ref: a,
-      className: i(
+      className: c(
         "w-full h-full bg-video-surface-strong overflow-hidden",
         n && "[&>*]:scale-x-[-1]",
         s
@@ -78,7 +124,7 @@ function Mn({ attach: t, active: r = !0, mirrored: n = !1, className: s }) {
     }
   );
 }
-const Dt = {
+const Bt = {
   primary: "bg-accent text-accent-fg hover:bg-accent-hover disabled:bg-surface-hover",
   secondary: "bg-surface-sunk text-text-strong hover:bg-surface-hover disabled:bg-surface-hover",
   // No resting fill, so no disabled fill either — a greyed-out plate where
@@ -91,7 +137,7 @@ const Dt = {
   success: "bg-success text-text-inverse hover:opacity-90 disabled:bg-surface-hover",
   warning: "bg-warning text-text-inverse hover:opacity-90 disabled:bg-surface-hover",
   "danger-solid": "bg-danger text-text-inverse hover:opacity-90 disabled:bg-surface-hover"
-}, At = {
+}, Rt = {
   xs: "h-control-xs px-2 text-xs",
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-4 text-sm",
@@ -99,7 +145,7 @@ const Dt = {
   xl: "h-control-xl px-6 text-base",
   "2xl": "h-control-2xl px-6 text-base",
   full: "h-control-md px-4 text-sm"
-}, Lt = {
+}, Ht = {
   xs: "h-control-xs w-6",
   sm: "h-control-sm w-7",
   md: "h-control-md w-8",
@@ -123,12 +169,12 @@ const Dt = {
     ...m
   }, b) => {
     const p = h || s;
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ i(
       "button",
       {
         ref: b,
         type: "button",
-        className: i(
+        className: c(
           // font-medium, not semibold: in the design a button's label carries
           // the same weight as an emphasised nav item, and 600 at 12–13px
           // reads as a heavier control than the surrounding chrome.
@@ -138,8 +184,8 @@ const Dt = {
           "focus-visible:outline-none focus-visible:focus-ring",
           "disabled:cursor-not-allowed disabled:border-border-subtle",
           "disabled:text-text-disabled",
-          Dt[t],
-          o ? Lt[r] : At[r],
+          Bt[t],
+          o ? Ht[r] : Rt[r],
           (n || r === "full") && "w-full",
           s && "cursor-wait",
           d
@@ -165,14 +211,14 @@ const Dt = {
   }
 );
 le.displayName = "Button";
-const $n = ({
+const Fn = ({
   children: t,
   size: r = "md",
   orientation: n = "horizontal",
   attached: s = !0,
   className: a
 }) => {
-  const l = i(
+  const l = c(
     "inline-flex",
     {
       // Orientation
@@ -195,7 +241,13 @@ const $n = ({
     a
   );
   return /* @__PURE__ */ e("div", { className: l, role: "group", children: t });
-}, Pt = {
+};
+function Bn(t) {
+  if (!t) return;
+  const r = t.split(/[-_ ]/).filter(Boolean).map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join(""), n = ft[r];
+  return typeof n == "function" || typeof n == "object" && n !== null ? n : void 0;
+}
+const Vt = {
   primary: "text-text",
   secondary: "text-text-muted",
   accent: "text-accent",
@@ -215,9 +267,9 @@ const $n = ({
   "aria-label": o,
   ...f
 }) => {
-  const d = typeof r == "number" ? r : It(r), v = i(
+  const d = typeof r == "number" ? r : qt(r), v = c(
     "inline-block shrink-0",
-    Pt[n],
+    Vt[n],
     s && [
       "cursor-pointer rounded-sm transition-opacity duration-fast ease-out hover:opacity-80",
       "focus-visible:outline-none focus-visible:focus-ring"
@@ -239,7 +291,7 @@ const $n = ({
   };
   return /* @__PURE__ */ e(t, { ...h });
 };
-function It(t) {
+function qt(t) {
   return {
     xs: 12,
     sm: 14,
@@ -248,22 +300,7 @@ function It(t) {
     xl: 24
   }[t];
 }
-function _e(t, r, { gap: n = 6, matchWidth: s = !1, placement: a = "bottom-start" } = {}) {
-  const [l, o] = O({});
-  return St(() => {
-    if (!t) return;
-    const f = () => {
-      const d = r.current;
-      if (!d) return;
-      const v = d.getBoundingClientRect(), h = window.innerHeight - v.bottom, m = v.top, b = a.startsWith("top"), p = b ? m < 200 && h > m : h < 200 && m > h, w = b !== p, g = { position: "fixed" };
-      w ? (g.bottom = window.innerHeight - v.top + n, g.maxHeight = Math.max(120, m - n * 2)) : (g.top = v.bottom + n, g.maxHeight = Math.max(120, h - n * 2)), a.endsWith("end") ? g.right = window.innerWidth - v.right : g.left = v.left, s && (g.width = v.width), o(g);
-    };
-    return f(), window.addEventListener("scroll", f, !0), window.addEventListener("resize", f), () => {
-      window.removeEventListener("scroll", f, !0), window.removeEventListener("resize", f);
-    };
-  }, [t, r, n, s, a]), l;
-}
-const Ke = ({
+const Ye = ({
   trigger: t,
   children: r,
   placement: n = "bottom-start",
@@ -273,13 +310,13 @@ const Ke = ({
   disabled: o = !1,
   triggerLabel: f
 }) => {
-  const [d, v] = O(!1), h = ne(null), m = ne(null), b = _e(d, m, { placement: n });
+  const [d, v] = O(!1), h = ne(null), m = ne(null), b = De(d, m, { placement: n });
   G(() => {
     if (!d) return;
-    const g = ($) => {
-      h.current && !h.current.contains($.target) && v(!1);
-    }, x = ($) => {
-      $.key === "Escape" && v(!1);
+    const g = (T) => {
+      h.current && !h.current.contains(T.target) && v(!1);
+    }, x = (T) => {
+      T.key === "Escape" && v(!1);
     };
     return document.addEventListener("mousedown", g), document.addEventListener("keydown", x), () => {
       document.removeEventListener("mousedown", g), document.removeEventListener("keydown", x);
@@ -288,7 +325,7 @@ const Ke = ({
   const p = (g) => {
     g.stopPropagation(), !o && v((x) => !x);
   }, w = () => v(!1);
-  return /* @__PURE__ */ c("div", { ref: h, className: i("relative inline-flex", a), children: [
+  return /* @__PURE__ */ i("div", { ref: h, className: c("relative inline-flex", a), children: [
     /* @__PURE__ */ e(
       "button",
       {
@@ -298,7 +335,7 @@ const Ke = ({
         disabled: o,
         "aria-label": f,
         "aria-expanded": d,
-        className: i(
+        className: c(
           "inline-flex items-center",
           o && "cursor-not-allowed opacity-50",
           l
@@ -309,7 +346,7 @@ const Ke = ({
     d && /* @__PURE__ */ e(
       "div",
       {
-        className: i(
+        className: c(
           // overflow-y-auto pairs with the hook's max-height: without it a
           // panel taller than the space available is simply cut off.
           "fixed z-overlay overflow-y-auto rounded-lg border border-border bg-surface shadow-overlay",
@@ -320,29 +357,29 @@ const Ke = ({
       }
     )
   ] });
-}, jt = {
+}, Ut = {
   none: "hover:bg-surface-sunk hover:text-text",
   default: "bg-surface-sunk text-text-muted hover:text-text",
   muted: "bg-surface-sunk text-text-subtle hover:text-text",
   outline: "text-text-muted ring-1 ring-inset ring-border-strong hover:bg-surface-hover hover:text-text",
   warning: "bg-warning-soft text-warning-fg",
   danger: "bg-danger-soft text-danger-fg"
-}, Ot = (t) => i(
+}, Wt = (t) => c(
   // A button's default cursor is an arrow, so it has to be asked for.
   "inline-flex cursor-pointer select-none items-center text-sm font-medium",
   t.size === "sm" ? "h-control-sm" : "h-control-md",
   "transition-colors duration-fast ease-out",
   t.shape === "pill" ? "rounded-full" : "rounded-md",
   // Picking a value outranks whatever the value happens to mean.
-  t.active ? "bg-info-soft text-info-fg" : jt[t.tone ?? "default"],
+  t.active ? "bg-info-soft text-info-fg" : Ut[t.tone ?? "default"],
   t.className
-), Ft = (t) => i(
+), Kt = (t) => c(
   "inline-flex items-center gap-1.5 pl-3",
   t.shape === "pill" ? "rounded-full" : "rounded-md",
   t.withClear ? "pr-1.5" : "pr-3",
   "focus-visible:outline-none focus-visible:focus-ring"
 );
-function Bt({
+function Gt({
   label: t,
   icon: r,
   tone: n = "default",
@@ -358,44 +395,44 @@ function Bt({
   title: b,
   className: p
 }) {
-  const w = l && !!v, g = s === "pill" ? "rounded-full" : "rounded-md", x = Ot({ active: l, tone: n, shape: s, size: a, className: p }), $ = /* @__PURE__ */ c(ke, { children: [
+  const w = l && !!v, g = s === "pill" ? "rounded-full" : "rounded-md", x = Wt({ active: l, tone: n, shape: s, size: a, className: p }), T = /* @__PURE__ */ i(ke, { children: [
     r,
     t,
-    o && /* @__PURE__ */ e(Z, { icon: Me, size: "xs" })
-  ] }), C = Ft({ shape: s, withClear: w }), q = w && /* @__PURE__ */ e(
+    o && /* @__PURE__ */ e(Z, { icon: Te, size: "xs" })
+  ] }), C = Kt({ shape: s, withClear: w }), q = w && /* @__PURE__ */ e(
     "button",
     {
       type: "button",
       "aria-label": h,
       onClick: v,
-      className: i("inline-flex h-full items-center pr-3 focus-visible:outline-none focus-visible:focus-ring", g),
+      className: c("inline-flex h-full items-center pr-3 focus-visible:outline-none focus-visible:focus-ring", g),
       children: /* @__PURE__ */ e(Z, { icon: we, size: "xs" })
     }
   );
-  return f ? /* @__PURE__ */ c("span", { className: x, title: b, children: [
+  return f ? /* @__PURE__ */ i("span", { className: x, title: b, children: [
     /* @__PURE__ */ e(
-      Ke,
+      Ye,
       {
-        trigger: $,
+        trigger: T,
         rootClassName: "h-full",
-        triggerClassName: i(C, "h-full"),
-        className: i("min-w-menu p-1.5", d),
+        triggerClassName: c(C, "h-full"),
+        className: c("min-w-menu p-1.5", d),
         children: f
       }
     ),
     q
-  ] }) : w ? /* @__PURE__ */ c("span", { className: x, title: b, children: [
-    /* @__PURE__ */ e("button", { type: "button", onClick: m, className: C, children: $ }),
+  ] }) : w ? /* @__PURE__ */ i("span", { className: x, title: b, children: [
+    /* @__PURE__ */ e("button", { type: "button", onClick: m, className: C, children: T }),
     q
-  ] }) : /* @__PURE__ */ e("button", { type: "button", title: b, onClick: m, className: i(x, C), children: $ });
+  ] }) : /* @__PURE__ */ e("button", { type: "button", title: b, onClick: m, className: c(x, C), children: T });
 }
-const Rt = {
+const Jt = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-base",
   lg: "text-md",
   xl: "text-lg"
-}, Ht = {
+}, Yt = {
   primary: "text-text hover:text-info-fg hover:underline",
   info: "text-info-fg hover:underline",
   secondary: "text-text-muted hover:text-text",
@@ -404,7 +441,7 @@ const Rt = {
   success: "text-success-fg hover:underline",
   warning: "text-warning-fg hover:underline",
   error: "text-danger-fg hover:underline"
-}, Vt = {
+}, Xt = {
   primary: "bg-accent-soft",
   accent: "bg-accent-soft",
   secondary: "bg-surface-hover",
@@ -413,7 +450,7 @@ const Rt = {
   warning: "bg-warning-soft",
   error: "bg-danger-soft",
   info: "bg-info-soft"
-}, Tn = ({
+}, Rn = ({
   variant: t = "default",
   size: r = "md",
   color: n = "primary",
@@ -426,17 +463,17 @@ const Rt = {
   rel: v,
   ...h
 }) => {
-  const m = a || f && (f.startsWith("http") || f.startsWith("mailto:")), b = i(
+  const m = a || f && (f.startsWith("http") || f.startsWith("mailto:")), b = c(
     "inline-flex items-center gap-1 underline-offset-2",
     "transition-colors duration-fast ease-out",
     "focus-visible:outline-none focus-visible:focus-ring",
-    Rt[r],
-    !s && Ht[n],
+    Jt[r],
+    !s && Yt[n],
     t === "subtle" && "no-underline opacity-70 hover:opacity-100",
     t === "underline" && "underline decoration-1 hover:decoration-2",
     t === "button" && [
       "h-control-md rounded-md px-3 font-semibold no-underline hover:no-underline",
-      Vt[n]
+      Xt[n]
     ],
     s && "pointer-events-none cursor-not-allowed text-text-disabled opacity-50",
     l
@@ -447,15 +484,15 @@ const Rt = {
     rel: m ? "noopener noreferrer" : v,
     "aria-disabled": s || void 0
   };
-  return /* @__PURE__ */ c("a", { className: b, ...p, children: [
+  return /* @__PURE__ */ i("a", { className: b, ...p, children: [
     o,
-    m && /* @__PURE__ */ e(dt, { className: "size-icon-sm shrink-0", "aria-hidden": !0 })
+    m && /* @__PURE__ */ e(pt, { className: "size-icon-sm shrink-0", "aria-hidden": !0 })
   ] });
-}, qt = {
+}, Zt = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-sm"
 };
-function Ut({
+function Qt({
   options: t,
   value: r,
   onChange: n,
@@ -470,7 +507,7 @@ function Ut({
     {
       role: "tablist",
       "aria-label": f,
-      className: i(
+      className: c(
         "gap-0.5 rounded-md p-0.5",
         a === "track" ? "bg-surface-track" : "bg-surface-sunk",
         l ? "flex w-full" : "inline-flex",
@@ -485,12 +522,12 @@ function Ut({
             "aria-selected": v,
             type: "button",
             onClick: () => n(d.value),
-            className: i(
+            className: c(
               "inline-flex cursor-pointer items-center justify-center gap-1.5 rounded-sm",
               "transition-colors duration-fast ease-out",
               "focus-visible:outline-none focus-visible:focus-ring",
               l && "min-w-0 flex-1",
-              qt[s],
+              Zt[s],
               v ? "bg-surface text-text font-medium shadow-sm" : "text-text-muted hover:text-text"
             ),
             children: d.label
@@ -501,15 +538,15 @@ function Ut({
     }
   );
 }
-const Wt = {
+const er = {
   primary: "bg-accent text-accent-fg hover:bg-accent-hover",
   secondary: "border border-border bg-surface text-text hover:bg-surface-hover",
   outline: "border border-accent-border text-accent hover:bg-accent-soft"
-}, Kt = {
+}, tr = {
   sm: "h-control-sm w-7",
   md: "h-control-md w-8"
 };
-function Ge({
+function Xe({
   label: t,
   onClick: r,
   variant: n = "primary",
@@ -527,7 +564,7 @@ function Ge({
     // lijn: bij een ink-gevulde knop leest 2px als een spleet. 1px is genoeg
     // om te zien dat het twee doelen zijn. De omrande varianten hebben hun
     // eigen randen al en houden de helften tegen elkaar.
-    /* @__PURE__ */ c("div", { className: i("inline-flex items-center", n === "primary" && "gap-px"), children: [
+    /* @__PURE__ */ i("div", { className: c("inline-flex items-center", n === "primary" && "gap-px"), children: [
       /* @__PURE__ */ e(
         le,
         {
@@ -537,12 +574,12 @@ function Ge({
           disabled: o,
           loading: f,
           leftIcon: a,
-          className: i(m && "rounded-r-none"),
+          className: c(m && "rounded-r-none"),
           children: t
         }
       ),
       m && /* @__PURE__ */ e(
-        Ke,
+        Ye,
         {
           placement: d,
           disabled: h,
@@ -552,24 +589,24 @@ function Ge({
             "span",
             {
               "aria-hidden": "true",
-              className: i(
+              className: c(
                 "inline-flex items-center justify-center rounded-md rounded-l-none",
                 "transition-colors duration-fast ease-out",
-                Wt[n],
-                Kt[s],
+                er[n],
+                tr[s],
                 h && "cursor-not-allowed opacity-50"
               ),
-              children: /* @__PURE__ */ e(Me, { className: "size-icon-md" })
+              children: /* @__PURE__ */ e(Te, { className: "size-icon-md" })
             }
           ),
-          children: (b) => /* @__PURE__ */ e(ke, { children: l.map((p) => /* @__PURE__ */ c(
+          children: (b) => /* @__PURE__ */ e(ke, { children: l.map((p) => /* @__PURE__ */ i(
             "button",
             {
               type: "button",
               onClick: () => {
                 p.onClick(), b();
               },
-              className: i(
+              className: c(
                 "flex w-full items-center gap-2 px-3 py-1.5 text-left text-sm",
                 "transition-colors duration-fast ease-out",
                 "focus-visible:outline-none focus-visible:focus-ring",
@@ -587,17 +624,17 @@ function Ge({
     ] })
   );
 }
-const Gt = {
+const rr = {
   sm: "size-checkbox-sm",
   md: "size-checkbox",
   lg: "size-checkbox-lg",
   full: "size-checkbox"
-}, Jt = {
+}, nr = {
   sm: "min-h-control-sm",
   md: "min-h-control-md",
   lg: "min-h-control-lg",
   full: "min-h-control-md"
-}, Yt = {
+}, sr = {
   sm: "text-sm",
   md: "text-base",
   lg: "text-md",
@@ -623,8 +660,8 @@ const Gt = {
     );
     return ce.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", Jt[s]), children: [
+    }, [a]), /* @__PURE__ */ i("div", { className: c("flex flex-col", l), children: [
+      /* @__PURE__ */ i("div", { className: c("flex items-center gap-3", nr[s]), children: [
         /* @__PURE__ */ e(
           "input",
           {
@@ -632,7 +669,7 @@ const Gt = {
             id: b,
             type: "checkbox",
             "aria-invalid": p || void 0,
-            className: i(
+            className: c(
               // radius-xs (5px): its own step on the scale. At 16px the 9px
               // button radius reads as a circle and the 7px chip radius still
               // rounds the corners away — a checkbox has to stay a square you
@@ -641,22 +678,22 @@ const Gt = {
               "transition-colors duration-fast ease-out",
               "focus-visible:outline-none focus-visible:focus-ring",
               "disabled:cursor-not-allowed disabled:bg-surface-hover",
-              Gt[s],
+              rr[s],
               p ? "border-danger-border" : "border-border-strong",
               f
             ),
             ...v
           }
         ),
-        t && /* @__PURE__ */ c("div", { className: "flex-1", children: [
+        t && /* @__PURE__ */ i("div", { className: "flex-1", children: [
           /* @__PURE__ */ e(
             "label",
             {
               htmlFor: b,
-              className: i(
+              className: c(
                 "cursor-pointer",
                 p ? "text-danger-fg" : "text-text",
-                Yt[s],
+                sr[s],
                 o
               ),
               children: t
@@ -670,7 +707,7 @@ const Gt = {
   }
 );
 ye.displayName = "Checkbox";
-const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }), Zt = () => /* @__PURE__ */ e(Z, { icon: Ce, size: "md", color: "current" }), Qt = () => /* @__PURE__ */ e(Z, { icon: $e, size: "md", color: "current" }), Pe = be(({
+const ar = () => /* @__PURE__ */ e(Z, { icon: vt, size: "md", color: "current" }), lr = () => /* @__PURE__ */ e(Z, { icon: Ce, size: "md", color: "current" }), or = () => /* @__PURE__ */ e(Z, { icon: $e, size: "md", color: "current" }), Pe = be(({
   value: t,
   onChange: r,
   placeholder: n = "Select date",
@@ -683,7 +720,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
   format: v = "MM/dd/yyyy",
   withTime: h = !1
 }, m) => {
-  const [b, p] = O(!1), [w, g] = O(() => t || /* @__PURE__ */ new Date()), x = ne(null), $ = ne(null), C = _e(b, $);
+  const [b, p] = O(!1), [w, g] = O(() => t || /* @__PURE__ */ new Date()), x = ne(null), T = ne(null), C = De(b, T);
   G(() => {
     const u = (E) => {
       x.current && !x.current.contains(E.target) && p(!1);
@@ -708,7 +745,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
     for (let se = 0; se < 42; se++)
       N.push(new Date(W)), W.setDate(W.getDate() + 1);
     return N;
-  }, P = (u) => {
+  }, I = (u) => {
     if (u.getMonth() === w.getMonth() && !(f && u < f) && !(d && u > d)) {
       if (h) {
         const y = new Date(u);
@@ -723,7 +760,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
     g(new Date(w.getFullYear(), w.getMonth() + 1, 1));
   }, Y = () => {
     r?.(null), p(!1);
-  }, K = i(
+  }, K = c(
     "w-full border border-border-strong rounded-tile transition-colors duration-fast",
     "bg-surface text-text",
     "placeholder:text-text-muted",
@@ -750,8 +787,8 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
     "November",
     "December"
   ];
-  return /* @__PURE__ */ c("div", { ref: x, className: "relative", children: [
-    /* @__PURE__ */ c("div", { ref: $, className: "relative", children: [
+  return /* @__PURE__ */ i("div", { ref: x, className: "relative", children: [
+    /* @__PURE__ */ i("div", { ref: T, className: "relative", children: [
       /* @__PURE__ */ e(
         "input",
         {
@@ -763,7 +800,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
           required: a,
           readOnly: !0,
           onClick: () => !s && p(!b),
-          className: i(K, "pr-10 cursor-pointer")
+          className: c(K, "pr-10 cursor-pointer")
         }
       ),
       /* @__PURE__ */ e(
@@ -773,21 +810,21 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
           onClick: () => !s && p(!b),
           disabled: s,
           className: "absolute inset-y-0 right-0 flex items-center pr-3 text-text-muted hover:text-text-muted",
-          children: /* @__PURE__ */ e(Xt, {})
+          children: /* @__PURE__ */ e(ar, {})
         }
       )
     ] }),
-    b && /* @__PURE__ */ c("div", { style: C, 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: [
+    b && /* @__PURE__ */ i("div", { style: C, className: "fixed z-overlay overflow-auto rounded-lg border border-border bg-surface p-4 shadow-overlay min-w-panel", children: [
+      /* @__PURE__ */ i("div", { className: "flex items-center justify-between mb-4", children: [
         /* @__PURE__ */ e(
           "button",
           {
             onClick: H,
             className: "p-1 hover:bg-surface-hover rounded",
-            children: /* @__PURE__ */ e(Zt, {})
+            children: /* @__PURE__ */ e(lr, {})
           }
         ),
-        /* @__PURE__ */ c("h3", { className: "text-sm font-medium text-text", children: [
+        /* @__PURE__ */ i("h3", { className: "text-sm font-medium text-text", children: [
           k[w.getMonth()],
           " ",
           w.getFullYear()
@@ -797,7 +834,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
           {
             onClick: te,
             className: "p-1 hover:bg-surface-hover rounded",
-            children: /* @__PURE__ */ e(Qt, {})
+            children: /* @__PURE__ */ e(or, {})
           }
         )
       ] }),
@@ -807,9 +844,9 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
         return /* @__PURE__ */ e(
           "button",
           {
-            onClick: () => !W && P(u),
+            onClick: () => !W && I(u),
             disabled: W,
-            className: i(
+            className: c(
               "w-8 h-8 text-sm rounded transition-colors duration-fast",
               {
                 "text-text hover:bg-surface-hover": y && !A && !W,
@@ -823,7 +860,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
           E
         );
       }) }),
-      h && /* @__PURE__ */ c("div", { className: "mt-3 flex items-center gap-2 border-t border-border pt-3", children: [
+      h && /* @__PURE__ */ i("div", { className: "mt-3 flex items-center gap-2 border-t border-border pt-3", children: [
         /* @__PURE__ */ e("label", { htmlFor: "datepicker-time", className: "text-sm text-text-muted", children: "Tijd" }),
         /* @__PURE__ */ e(
           "input",
@@ -836,7 +873,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
           }
         )
       ] }),
-      /* @__PURE__ */ c("div", { className: "flex justify-between items-center mt-4 pt-3 border-t border-border", children: [
+      /* @__PURE__ */ i("div", { className: "flex justify-between items-center mt-4 pt-3 border-t border-border", children: [
         /* @__PURE__ */ e(
           "button",
           {
@@ -856,12 +893,12 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
       ] })
     ] })
   ] });
-}), er = {
+}), cr = {
   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"
-}, Se = (t) => t.trim().toLowerCase(), Ee = be(
+}, Se = (t) => t.trim().toLowerCase(), ze = be(
   ({
     label: t,
     helperText: r,
@@ -880,24 +917,24 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
     value: w,
     onChange: g,
     allowCreate: x,
-    onCreateOption: $,
+    onCreateOption: T,
     ...C
   }, q) => {
-    const D = m || `select-${Math.random().toString(36).substr(2, 9)}`, J = !!n, [V, P] = ce.useState(!1), [H, te] = ce.useState(""), Y = ce.useRef(null), K = ce.useRef(null), ie = _e(V, K, { matchWidth: !0 }), [k, u] = ce.useState(o);
+    const D = m || `select-${Math.random().toString(36).substr(2, 9)}`, J = !!n, [V, I] = ce.useState(!1), [H, te] = ce.useState(""), Y = ce.useRef(null), K = ce.useRef(null), ie = De(V, K, { matchWidth: !0 }), [k, u] = ce.useState(o);
     ce.useImperativeHandle(q, () => Y.current), ce.useEffect(() => {
-      const T = (_) => {
-        Y.current && !Y.current.contains(_.target) && P(!1);
+      const $ = (_) => {
+        Y.current && !Y.current.contains(_.target) && I(!1);
       };
-      return document.addEventListener("mousedown", T), () => document.removeEventListener("mousedown", T);
+      return document.addEventListener("mousedown", $), () => document.removeEventListener("mousedown", $);
     }, []);
     const E = ce.useCallback(
-      (T, _) => T.some(
+      ($, _) => $.some(
         (z) => Se(z.value) === Se(_) || Se(z.label) === Se(_)
       ),
       []
     ), y = ce.useCallback(
-      (T, _) => {
-        const z = [...T], F = (j) => {
+      ($, _) => {
+        const z = [...$], F = (j) => {
           const B = (j ?? "").trim();
           B && (E(z, B) || z.push({ value: B, label: B }));
         };
@@ -906,41 +943,41 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
       [E]
     );
     ce.useEffect(() => {
-      u((T) => {
+      u(($) => {
         const _ = [...o];
-        return T.forEach((z) => {
+        return $.forEach((z) => {
           !E(_, z.value) && !E(_, z.label) && _.push(z);
         }), y(_, w);
       });
     }, [o, w, y, E]);
-    const A = (T) => {
+    const A = ($) => {
       if (p) {
-        const _ = Array.isArray(w) ? w : [], z = _.includes(T) ? _.filter((F) => F !== T) : [..._, T];
+        const _ = Array.isArray(w) ? w : [], z = _.includes($) ? _.filter((F) => F !== $) : [..._, $];
         g?.(z);
       } else
-        g?.(T), P(!1), te("");
-    }, N = p ? null : k.find((T) => T.value === w), W = p ? k.filter(
-      (T) => Array.isArray(w) && w.includes(T.value)
+        g?.($), I(!1), te("");
+    }, N = p ? null : k.find(($) => $.value === w), W = p ? k.filter(
+      ($) => Array.isArray(w) && w.includes($.value)
     ) : [], se = b && H ? k.filter(
-      (T) => T.label.toLowerCase().includes(H.toLowerCase())
-    ) : k, ee = !!x && !!b && !!H.trim() && !E(k, H), X = (T) => {
-      const _ = T.trim();
+      ($) => $.label.toLowerCase().includes(H.toLowerCase())
+    ) : k, ee = !!x && !!b && !!H.trim() && !E(k, H), X = ($) => {
+      const _ = $.trim();
       if (!_) return;
-      const z = $?.(_) ?? {
+      const z = T?.(_) ?? {
         value: _,
         label: _
       };
       if (E(k, z.value) || E(k, z.label)) {
-        A(z.value), te(""), p || P(!1);
+        A(z.value), te(""), p || I(!1);
         return;
       }
-      u((F) => [...F, z]), A(z.value), te(""), p || P(!1);
-    }, I = () => p ? W.length > 0 ? W.map((T) => T.label).join(", ") : f || "Select options" : N?.label || f || "Select an option";
-    return /* @__PURE__ */ c(
+      u((F) => [...F, z]), A(z.value), te(""), p || I(!1);
+    }, P = () => p ? W.length > 0 ? W.map(($) => $.label).join(", ") : f || "Select options" : N?.label || f || "Select an option";
+    return /* @__PURE__ */ i(
       "div",
       {
         ref: Y,
-        className: i(
+        className: c(
           "relative flex flex-col",
           a && "w-full",
           d
@@ -951,8 +988,8 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
             "label",
             {
               htmlFor: D,
-              onClick: () => P(!V),
-              className: i(
+              onClick: () => I(!V),
+              className: c(
                 "block text-xs font-semibold uppercase tracking-label mb-1.5",
                 J ? "text-danger-fg" : "text-text-muted",
                 v
@@ -960,31 +997,31 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
               children: t
             }
           ),
-          /* @__PURE__ */ c("div", { className: "relative", children: [
-            /* @__PURE__ */ c(
+          /* @__PURE__ */ i("div", { className: "relative", children: [
+            /* @__PURE__ */ i(
               "button",
               {
                 ref: K,
                 type: "button",
                 id: D,
                 disabled: l,
-                onClick: () => P(!V),
-                className: i(
+                onClick: () => I(!V),
+                className: c(
                   "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",
-                  er[s],
+                  cr[s],
                   J ? "border-danger-border text-danger-fg focus-visible:focus-ring" : "border-border-strong text-text",
                   h
                 ),
                 children: [
-                  /* @__PURE__ */ e("span", { className: "truncate flex-1 min-w-0", children: I() }),
+                  /* @__PURE__ */ e("span", { className: "truncate flex-1 min-w-0", children: P() }),
                   /* @__PURE__ */ e(
-                    mt,
+                    yt,
                     {
                       size: 16,
-                      className: i(
+                      className: c(
                         "shrink-0 opacity-60 transition-transform duration-fast",
                         V && "rotate-180"
                       )
@@ -993,27 +1030,27 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
                 ]
               }
             ),
-            V && /* @__PURE__ */ c("div", { style: ie, className: "fixed z-overlay flex flex-col overflow-hidden rounded-lg border border-border bg-surface shadow-overlay", children: [
+            V && /* @__PURE__ */ i("div", { style: ie, 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: H,
-                  onChange: (T) => te(T.target.value),
-                  onKeyDown: (T) => {
-                    T.key === "Enter" && ee && (T.preventDefault(), X(H));
+                  onChange: ($) => te($.target.value),
+                  onKeyDown: ($) => {
+                    $.key === "Enter" && ee && ($.preventDefault(), X(H));
                   },
-                  className: i(
+                  className: c(
                     "w-full px-3 py-2 text-sm rounded-md border",
                     "text-text border-border focus-visible:outline-none focus-visible:focus-ring"
                   )
                 }
               ) }),
-              ee && /* @__PURE__ */ c(
+              ee && /* @__PURE__ */ i(
                 "div",
                 {
-                  className: i(
+                  className: c(
                     "cursor-pointer px-3 py-1.5 text-sm",
                     "text-info-fg hover:bg-surface-hover"
                   ),
@@ -1025,30 +1062,30 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
                   ]
                 }
               ),
-              /* @__PURE__ */ c("ul", { className: "min-h-0 flex-1 overflow-auto py-1", children: [
+              /* @__PURE__ */ i("ul", { className: "min-h-0 flex-1 overflow-auto py-1", children: [
                 f && !p && /* @__PURE__ */ e(
                   "li",
                   {
                     className: "cursor-pointer px-3 py-1.5 text-sm text-text-muted hover:bg-surface-hover",
                     onClick: () => {
-                      g?.(""), P(!1);
+                      g?.(""), I(!1);
                     },
                     children: f
                   }
                 ),
-                se.map((T) => {
-                  const _ = p ? Array.isArray(w) && w.includes(T.value) : w === T.value;
+                se.map(($) => {
+                  const _ = p ? Array.isArray(w) && w.includes($.value) : w === $.value;
                   return /* @__PURE__ */ e(
                     "li",
                     {
-                      onClick: () => !T.disabled && A(T.value),
-                      className: i(
+                      onClick: () => !$.disabled && A($.value),
+                      className: c(
                         "cursor-pointer px-3 py-1.5 text-sm",
                         "text-text",
-                        T.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-surface-hover",
+                        $.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-surface-hover",
                         _ && "bg-accent-soft text-accent font-semibold"
                       ),
-                      children: /* @__PURE__ */ c("div", { className: "flex items-center", children: [
+                      children: /* @__PURE__ */ i("div", { className: "flex items-center", children: [
                         p && /* @__PURE__ */ e(
                           "input",
                           {
@@ -1058,10 +1095,10 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
                             className: "mr-3 h-4 w-4 rounded border-border [&:not(:checked)]:bg-surface-input text-accent "
                           }
                         ),
-                        /* @__PURE__ */ e("span", { children: T.label })
+                        /* @__PURE__ */ e("span", { children: $.label })
                       ] })
                     },
-                    T.value
+                    $.value
                   );
                 })
               ] })
@@ -1070,7 +1107,7 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
           (n || r) && /* @__PURE__ */ e(
             "p",
             {
-              className: i(
+              className: c(
                 "mt-1 text-xs",
                 J ? "text-danger-fg" : "text-text-muted"
               ),
@@ -1082,13 +1119,13 @@ const Xt = () => /* @__PURE__ */ e(Z, { icon: ut, size: "md", color: "current" }
     );
   }
 );
-Ee.displayName = "Select";
-const tr = {
+ze.displayName = "Select";
+const 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",
   full: "h-control-md px-3 text-base"
-}, Je = "mb-1.5 block text-sm font-medium", Ye = "block w-full rounded-tile border bg-surface-input text-text transition-colors duration-fast ease-out placeholder:text-text-subtle focus-visible:outline-none focus-visible:focus-ring disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled", Xe = (t) => t ? "border-danger-border bg-danger-soft" : "border-border-strong", Ne = be(
+}, Ze = "mb-1.5 block text-sm font-medium", Qe = "block w-full rounded-tile border bg-surface-input text-text transition-colors duration-fast ease-out placeholder:text-text-subtle focus-visible:outline-none focus-visible:focus-ring disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled", et = (t) => t ? "border-danger-border bg-danger-soft" : "border-border-strong", Ne = be(
   ({
     label: t,
     helperText: r,
@@ -1104,21 +1141,21 @@ const tr = {
     id: m,
     ...b
   }, p) => {
-    const w = ce.useId(), g = m || `textfield-${w}`, x = !!n, $ = n || r ? `${g}-description` : void 0;
-    return /* @__PURE__ */ c("div", { className: i("flex flex-col", a && "w-full", d), children: [
+    const w = ce.useId(), g = m || `textfield-${w}`, x = !!n, T = n || r ? `${g}-description` : void 0;
+    return /* @__PURE__ */ i("div", { className: c("flex flex-col", a && "w-full", d), children: [
       t && /* @__PURE__ */ e(
         "label",
         {
           htmlFor: g,
-          className: i(
-            Je,
+          className: c(
+            Ze,
             x ? "text-danger-fg" : "text-text-muted",
             v
           ),
           children: t
         }
       ),
-      /* @__PURE__ */ c("div", { className: "relative", children: [
+      /* @__PURE__ */ i("div", { className: "relative", children: [
         l && /* @__PURE__ */ e("span", { className: "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-text-muted", children: l }),
         /* @__PURE__ */ e(
           "input",
@@ -1126,13 +1163,13 @@ const tr = {
             ref: p,
             id: g,
             "aria-invalid": x || void 0,
-            "aria-describedby": $,
-            className: i(
-              Ye,
-              tr[s],
+            "aria-describedby": T,
+            className: c(
+              Qe,
+              ir[s],
               l && "pl-9",
               (o || f) && "pr-9",
-              Xe(x),
+              et(x),
               h
             ),
             ...b
@@ -1149,8 +1186,8 @@ const tr = {
       (n || r) && /* @__PURE__ */ e(
         "p",
         {
-          id: $,
-          className: i("mt-1 text-xs", x ? "text-danger-fg" : "text-text-subtle"),
+          id: T,
+          className: c("mt-1 text-xs", x ? "text-danger-fg" : "text-text-subtle"),
           children: n || r
         }
       )
@@ -1158,7 +1195,7 @@ const tr = {
   }
 );
 Ne.displayName = "TextField";
-function rr({
+function dr({
   value: t,
   onChange: r,
   onListFolders: n,
@@ -1179,9 +1216,9 @@ function rr({
     };
   }, []);
   const h = t ?? {};
-  return /* @__PURE__ */ c("div", { className: "flex flex-col gap-2", children: [
+  return /* @__PURE__ */ i("div", { className: "flex flex-col gap-2", children: [
     /* @__PURE__ */ e(
-      Ee,
+      ze,
       {
         size: a,
         fullWidth: !0,
@@ -1203,24 +1240,24 @@ function rr({
     )
   ] });
 }
-const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(Te, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), sr = (t) => /* @__PURE__ */ e(Me, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), ar = {
+const ve = (...t) => t.filter(Boolean).join(" "), ur = (t) => /* @__PURE__ */ e(_e, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), mr = (t) => /* @__PURE__ */ e(Te, { ...t, strokeWidth: 1.5, "aria-hidden": !0 }), fr = {
   sm: "h-control-sm px-3 text-sm",
   md: "h-control-md px-3 text-base",
   lg: "h-control-lg px-3 text-base",
   full: "h-control-md w-full px-3 text-base"
-}, Le = {
+}, Ie = {
   sm: "h-4 w-4",
   md: "h-5 w-5",
   lg: "h-6 w-6",
   full: "h-6 w-6"
-}, lr = be(
+}, hr = be(
   ({
     label: t,
     helperText: r,
     error: n,
     size: s = "md",
     fullWidth: a = !1,
-    startIcon: l = /* @__PURE__ */ e(nr, {}),
+    startIcon: l = /* @__PURE__ */ e(ur, {}),
     loading: o = !1,
     containerClassName: f,
     labelClassName: d,
@@ -1232,18 +1269,18 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
     debounceTime: w = 500,
     showAllOnOpen: g = !1,
     value: x,
-    onChange: $,
+    onChange: T,
     ...C
   }, q) => {
-    const D = h || `searchfield-${Math.random().toString(36).substr(2, 9)}`, J = !!n, V = ne(null), P = ne(null), [H, te] = O(x || ""), [Y, K] = O(!1), [ie, k] = O(!1), [u, E] = O(!1);
+    const D = h || `searchfield-${Math.random().toString(36).substr(2, 9)}`, J = !!n, V = ne(null), I = ne(null), [H, te] = O(x || ""), [Y, K] = O(!1), [ie, k] = O(!1), [u, E] = O(!1);
     G(() => {
       x !== void 0 && te(x);
     }, [x]);
     const y = pe(() => {
       if (g && !u || !H) return m;
-      const I = String(H).toLowerCase();
+      const P = String(H).toLowerCase();
       return m.filter(
-        (T) => String(T.label).toLowerCase().includes(I)
+        ($) => String($.label).toLowerCase().includes(P)
       );
     }, [H, m, g, u]);
     G(() => {
@@ -1251,34 +1288,34 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
         k(!1);
         return;
       }
-      const I = setTimeout(async () => {
+      const P = setTimeout(async () => {
         k(!0);
         try {
           await b(String(H));
-        } catch (T) {
-          console.error("Remote search failed:", T);
+        } catch ($) {
+          console.error("Remote search failed:", $);
         } finally {
           k(!1);
         }
       }, w);
       return () => {
-        clearTimeout(I), k(!1);
+        clearTimeout(P), k(!1);
       };
     }, [H, w, b]), G(() => {
-      const I = (T) => {
-        V.current && !V.current.contains(T.target) && K(!1);
+      const P = ($) => {
+        V.current && !V.current.contains($.target) && K(!1);
       };
-      return document.addEventListener("mousedown", I), () => document.removeEventListener("mousedown", I);
+      return document.addEventListener("mousedown", P), () => document.removeEventListener("mousedown", P);
     }, []);
-    const A = (I) => {
-      const T = I.target.value;
-      te(T), K(!0), E(!0), $ && $(I);
-    }, N = (I) => {
-      te(I.label), K(!1), E(!1), p && p(I.value);
+    const A = (P) => {
+      const $ = P.target.value;
+      te($), K(!0), E(!0), T && T(P);
+    }, N = (P) => {
+      te(P.label), K(!1), E(!1), p && p(P.value);
     }, W = () => {
       (m.length > 0 || b) && (K(!0), E(!1));
-    }, se = o || ie, ee = Y && (y.length > 0 || se), X = pe(() => q || P, [q]);
-    return /* @__PURE__ */ c(
+    }, se = o || ie, ee = Y && (y.length > 0 || se), X = pe(() => q || I, [q]);
+    return /* @__PURE__ */ i(
       "div",
       {
         className: ve(
@@ -1301,8 +1338,8 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
               children: t
             }
           ),
-          /* @__PURE__ */ c("div", { className: "relative", children: [
-            l && /* @__PURE__ */ e("div", { className: "absolute left-0 pl-3 flex items-center pointer-events-none h-full", children: /* @__PURE__ */ e("span", { className: ve("text-text-muted", Le[s]), children: l }) }),
+          /* @__PURE__ */ i("div", { className: "relative", children: [
+            l && /* @__PURE__ */ e("div", { className: "absolute left-0 pl-3 flex items-center pointer-events-none h-full", children: /* @__PURE__ */ e("span", { className: ve("text-text-muted", Ie[s]), children: l }) }),
             /* @__PURE__ */ e(
               "input",
               {
@@ -1317,7 +1354,7 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
                   "placeholder:text-text-subtle focus-visible:outline-none focus-visible:focus-ring",
                   "disabled:cursor-not-allowed disabled:bg-surface-hover disabled:text-text-disabled",
                   // Size styles
-                  ar[s],
+                  fr[s],
                   // Icon padding
                   l ? "pl-10" : "",
                   "pr-10",
@@ -1332,24 +1369,24 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
             /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: se || o ? (
               // Loading Spinner
               /* @__PURE__ */ e(
-                ft,
+                Nt,
                 {
-                  className: ve("animate-spin text-info-fg", Le[s]),
+                  className: ve("animate-spin text-info-fg", Ie[s]),
                   "aria-hidden": !0
                 }
               )
             ) : (
               // Dropdown Chevron
               /* @__PURE__ */ e(
-                sr,
+                mr,
                 {
                   className: ve(
                     "text-text-muted cursor-pointer transition-transform",
-                    Le[s],
+                    Ie[s],
                     Y ? "rotate-180" : "rotate-0"
                   ),
                   onClick: () => {
-                    K((I) => (I || E(!1), !I));
+                    K((P) => (P || E(!1), !P));
                   }
                 }
               )
@@ -1360,16 +1397,16 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
             {
               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: y.length > 0 ? y.map((I) => /* @__PURE__ */ e(
+              children: y.length > 0 ? y.map((P) => /* @__PURE__ */ e(
                 "li",
                 {
                   className: "px-4 py-2 cursor-pointer text-text hover:bg-accent-soft hover:text-accent transition-colors",
-                  onClick: () => N(I),
+                  onClick: () => N(P),
                   role: "option",
-                  "aria-selected": H === I.label,
-                  children: I.label
+                  "aria-selected": H === P.label,
+                  children: P.label
                 },
-                I.value
+                P.value
               )) : /* @__PURE__ */ e("li", { className: "px-4 py-2 text-text-muted", children: se || o ? "Zoeken op afstand..." : "Geen resultaten gevonden." })
             }
           ),
@@ -1383,7 +1420,7 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
               children: n || r
             }
           ),
-          b && /* @__PURE__ */ c("p", { className: "mt-2 text-xs text-success-fg", children: [
+          b && /* @__PURE__ */ i("p", { className: "mt-2 text-xs text-success-fg", children: [
             "Huidige zoekterm (niet-gedebounced): ",
             String(H)
           ] })
@@ -1392,8 +1429,8 @@ const ve = (...t) => t.filter(Boolean).join(" "), nr = (t) => /* @__PURE__ */ e(
     );
   }
 );
-lr.displayName = "SearchableTextField";
-const Ze = be(
+hr.displayName = "SearchableTextField";
+const tt = be(
   ({
     value: t,
     onValueChange: r,
@@ -1404,10 +1441,10 @@ const Ze = be(
     className: o,
     disabled: f,
     ...d
-  }, v) => /* @__PURE__ */ c(
+  }, v) => /* @__PURE__ */ i(
     "div",
     {
-      className: i(
+      className: c(
         // No focus ring: the plate is a container, not the control, and a ring
         // around a frameless search box reads as the border it deliberately
         // does not have.
@@ -1418,7 +1455,7 @@ const Ze = be(
         l
       ),
       children: [
-        /* @__PURE__ */ e(Z, { icon: Te, size: "md", color: "current", className: "shrink-0" }),
+        /* @__PURE__ */ e(Z, { icon: _e, size: "md", color: "current", className: "shrink-0" }),
         /* @__PURE__ */ e(
           "input",
           {
@@ -1427,7 +1464,7 @@ const Ze = be(
             value: t,
             disabled: f,
             onChange: (h) => r(h.target.value),
-            className: i(
+            className: c(
               // The forms base layer hands every input a white fill, a 1px border
               // and a blue focus ring; a field that is only a caret inside a plate
               // has to switch all three off explicitly. Padding too — the base rule
@@ -1457,14 +1494,14 @@ const Ze = be(
     }
   )
 );
-Ze.displayName = "SearchField";
-const or = be(
+tt.displayName = "SearchField";
+const xr = be(
   ({ checked: t, onChange: r, label: n, disabled: s = !1, className: a, ...l }, o) => {
     const f = /* @__PURE__ */ e(
       "span",
       {
         "aria-hidden": !0,
-        className: i(
+        className: c(
           "relative inline-flex size-switch-track shrink-0 items-center rounded-full",
           "transition-colors duration-fast ease-out",
           t ? "bg-accent" : "bg-surface-hover",
@@ -1473,7 +1510,7 @@ const or = be(
         children: /* @__PURE__ */ e(
           "span",
           {
-            className: i(
+            className: c(
               "absolute left-0.5 size-switch-knob rounded-full bg-surface shadow-overlay",
               "transition-transform duration-fast ease-out",
               t && "translate-switch"
@@ -1482,10 +1519,10 @@ const or = be(
         )
       }
     );
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ i(
       "label",
       {
-        className: i(
+        className: c(
           "inline-flex items-center gap-2",
           s ? "cursor-not-allowed" : "cursor-pointer",
           a
@@ -1511,8 +1548,8 @@ const or = be(
     );
   }
 );
-or.displayName = "Switch";
-const cr = ({
+xr.displayName = "Switch";
+const br = ({
   trigger: t,
   options: r,
   value: n,
@@ -1523,7 +1560,7 @@ const cr = ({
   showCheck: f = !0,
   header: d
 }) => {
-  const [v, h] = O(!1), [m, b] = O(null), [p, w] = O({ top: 0, left: 0 }), g = ne(null), x = ne(null), $ = ne(null), C = ne(null), q = _e(v, x, { placement: a }), D = ne(null), J = () => Array.from(
+  const [v, h] = O(!1), [m, b] = O(null), [p, w] = O({ top: 0, left: 0 }), g = ne(null), x = ne(null), T = ne(null), C = ne(null), q = De(v, x, { placement: a }), D = ne(null), J = () => Array.from(
     C.current?.querySelectorAll("button[data-option-value]:not(:disabled)") ?? []
   );
   G(() => {
@@ -1539,7 +1576,7 @@ const cr = ({
   };
   G(() => {
     const u = (E) => {
-      g.current && (!g.current.contains(E.target) || $.current && !$.current.contains(E.target)) && (h(!1), b(null), D.current && (clearTimeout(D.current), D.current = null));
+      g.current && (!g.current.contains(E.target) || T.current && !T.current.contains(E.target)) && (h(!1), b(null), D.current && (clearTimeout(D.current), D.current = null));
     };
     return v && document.addEventListener("mousedown", u), () => {
       document.removeEventListener("mousedown", u);
@@ -1567,7 +1604,7 @@ const cr = ({
   }, [m]), G(() => () => {
     D.current && clearTimeout(D.current);
   }, []);
-  const P = (u) => {
+  const I = (u) => {
     u.stopPropagation(), !l && (h(!v), b(null), D.current && (clearTimeout(D.current), D.current = null));
   }, H = (u, E, y) => {
     u.stopPropagation(), !E.disabled && !E.divider && (!E.children || E.children.length === 0) && (s?.(E.value, y), h(!1), b(null));
@@ -1579,18 +1616,18 @@ const cr = ({
     }, 150) : b(null);
   }, K = (u, E, y) => {
     u.stopPropagation(), !E.disabled && !E.divider && (s?.(E.value, y), h(!1), b(null));
-  }, ie = i(
+  }, ie = c(
     "fixed z-overlay min-w-menu bg-surface rounded-lg shadow-overlay border border-border",
     "max-h-60 overflow-auto"
-  ), k = i(
+  ), k = c(
     "fixed z-overlay min-w-menu bg-surface rounded-lg shadow-overlay border border-border",
     "max-h-60 overflow-auto"
   );
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "div",
     {
       ref: g,
-      className: i(
+      className: c(
         "relative flex flex-row items-center justify-center rounded-lg hover:bg-surface-hover",
         o
       ),
@@ -1599,17 +1636,17 @@ const cr = ({
           "button",
           {
             ref: x,
-            onClick: P,
+            onClick: I,
             disabled: l,
             "aria-haspopup": "menu",
             "aria-expanded": v,
-            className: i("inline-flex items-center justify-center", {
+            className: c("inline-flex items-center justify-center", {
               "opacity-50 cursor-not-allowed": l
             }),
             children: t
           }
         ),
-        v && /* @__PURE__ */ e("div", { ref: C, className: ie, style: q, onKeyDown: V, children: /* @__PURE__ */ c("div", { className: "p-2", role: "menu", children: [
+        v && /* @__PURE__ */ e("div", { ref: C, className: ie, style: q, onKeyDown: V, children: /* @__PURE__ */ i("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((u, E) => {
             if (u.divider)
@@ -1621,8 +1658,8 @@ const cr = ({
                 `divider-${E}`
               );
             const y = u.children && u.children.length > 0, A = m === u.value;
-            return /* @__PURE__ */ c("div", { className: "relative group", children: [
-              /* @__PURE__ */ c(
+            return /* @__PURE__ */ i("div", { className: "relative group", children: [
+              /* @__PURE__ */ i(
                 "button",
                 {
                   "data-option-value": u.value,
@@ -1632,7 +1669,7 @@ const cr = ({
                   onMouseEnter: () => te(u),
                   onMouseLeave: () => Y(u),
                   disabled: u.disabled,
-                  className: i(
+                  className: c(
                     "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": u.disabled,
@@ -1640,15 +1677,15 @@ const cr = ({
                     }
                   ),
                   children: [
-                    /* @__PURE__ */ c("div", { className: "flex items-center space-x-2 min-w-0", children: [
+                    /* @__PURE__ */ i("div", { className: "flex items-center space-x-2 min-w-0", children: [
                       u.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: u.icon }),
-                      /* @__PURE__ */ c("div", { className: "flex flex-col items-start min-w-0", children: [
+                      /* @__PURE__ */ i("div", { className: "flex flex-col items-start min-w-0", children: [
                         /* @__PURE__ */ e("span", { className: "font-base truncate", children: u.label }),
                         u.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: u.description })
                       ] })
                     ] }),
-                    /* @__PURE__ */ c("div", { className: "flex items-center space-x-2", children: [
-                      f && n === u.value && /* @__PURE__ */ e(je, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 }),
+                    /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
+                      f && n === u.value && /* @__PURE__ */ e(Oe, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 }),
                       y && /* @__PURE__ */ e("span", { className: "text-text-muted text-xs", children: "▶" })
                     ] })
                   ]
@@ -1657,7 +1694,7 @@ const cr = ({
               y && A && /* @__PURE__ */ e(
                 "div",
                 {
-                  ref: $,
+                  ref: T,
                   className: k,
                   style: {
                     top: `${p.top}px`,
@@ -1683,7 +1720,7 @@ const cr = ({
                     const se = typeof n == "object" && n[u.value] && n[u.value].includes(
                       N.value
                     ) || n === N.value;
-                    return /* @__PURE__ */ c(
+                    return /* @__PURE__ */ i(
                       "button",
                       {
                         onClick: (ee) => K(
@@ -1692,21 +1729,21 @@ const cr = ({
                           u.value
                         ),
                         disabled: N.disabled,
-                        className: i(
+                        className: c(
                           "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": N.disabled
                           }
                         ),
                         children: [
-                          /* @__PURE__ */ c("div", { className: "flex items-center space-x-2 min-w-0", children: [
+                          /* @__PURE__ */ i("div", { className: "flex items-center space-x-2 min-w-0", children: [
                             N.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: N.icon }),
-                            /* @__PURE__ */ c("div", { className: "flex flex-col items-start min-w-0", children: [
+                            /* @__PURE__ */ i("div", { className: "flex flex-col items-start min-w-0", children: [
                               /* @__PURE__ */ e("span", { className: "font-base truncate", children: N.label }),
                               N.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: N.description })
                             ] })
                           ] }),
-                          f && se && /* @__PURE__ */ e(je, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 })
+                          f && se && /* @__PURE__ */ e(Oe, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 })
                         ]
                       },
                       N.value
@@ -1722,7 +1759,7 @@ const cr = ({
               const A = y.children ? y.children.filter((N) => !N.divider).length : 0;
               return E + 1 + A;
             }, 0);
-            return u > 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: [
+            return u > 1 && /* @__PURE__ */ e("div", { className: "border-t border-border mt-2 pt-2", children: /* @__PURE__ */ i("div", { className: "text-xs text-text-muted px-3 py-1", children: [
               u,
               " options available"
             ] }) });
@@ -1731,13 +1768,13 @@ const cr = ({
       ]
     }
   );
-}, ze = ({
+}, Me = ({
   actions: t,
   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(
+}) => t.length === 0 ? null : /* @__PURE__ */ e("div", { className: c("flex flex-wrap items-center gap-2", n), children: t.map(
   (s) => s.render ? /* @__PURE__ */ e(ce.Fragment, { children: s.render() }, s.id) : s.splitOptions && s.splitOptions.length > 0 ? /* @__PURE__ */ e(
-    Ge,
+    Xe,
     {
       label: s.label,
       onClick: s.onClick,
@@ -1760,19 +1797,19 @@ const cr = ({
     },
     s.id
   )
-) }), ir = {
+) }), gr = {
   none: "p-0",
   sm: "p-2",
   md: "px-5 py-4",
   lg: "p-6"
-}, _n = ({
+}, Hn = ({
   actions: t = [],
   onBack: r,
   backLabel: n = "Back",
   className: s,
   padding: a = "md",
   children: l
-}) => /* @__PURE__ */ c("div", { className: i("flex items-center gap-2", ir[a], s), children: [
+}) => /* @__PURE__ */ i("div", { className: c("flex items-center gap-2", gr[a], s), children: [
   r && /* @__PURE__ */ e(
     le,
     {
@@ -1784,25 +1821,25 @@ const cr = ({
     }
   ),
   l && /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: l }),
-  /* @__PURE__ */ e(ze, { actions: t, className: i(!l && "ml-auto") })
-] }), Dn = (t) => (r) => t(r instanceof Date ? r : null), An = (t) => (r) => t(typeof r == "string" ? r : ""), dr = {
+  /* @__PURE__ */ e(Me, { actions: t, className: c(!l && "ml-auto") })
+] }), Vn = (t) => (r) => t(r instanceof Date ? r : null), qn = (t) => (r) => t(typeof r == "string" ? r : ""), pr = {
   none: "px-0",
   sm: "px-2",
   md: "px-3.5",
   lg: "px-5"
-}, ur = {
+}, vr = {
   sm: "h-row-lg",
   md: "h-row-xl",
   lg: "h-14"
-}, mr = 8, Re = ["62%", "44%", "74%", "52%", "68%", "48%", "80%", "56%"];
-function fr(t, r) {
+}, yr = 8, He = ["62%", "44%", "74%", "52%", "68%", "48%", "80%", "56%"];
+function Nr(t, r) {
   if (r <= 7) return Array.from({ length: r }, (l, o) => o);
   const s = [.../* @__PURE__ */ new Set([0, r - 1, t - 1, t, t + 1])].filter((l) => l >= 0 && l < r).sort((l, o) => l - o), a = [];
   return s.forEach((l, o) => {
     o > 0 && l - s[o - 1] > 1 && a.push("gap"), a.push(l);
   }), a;
 }
-const hr = (t) => {
+const wr = (t) => {
   const r = Array.isArray(t.value) ? t.value : t.value != null && t.value !== "" && t.value !== "all" ? [t.value] : [];
   if (t.type === "date") {
     const o = t.value instanceof Date;
@@ -1812,7 +1849,7 @@ const hr = (t) => {
         value: t.value,
         onChange: (f) => t.onChange(f),
         placeholder: t.placeholder || t.label,
-        className: i("min-w-40", o && "bg-info-soft text-info-fg")
+        className: c("min-w-40", o && "bg-info-soft text-info-fg")
       }
     );
   }
@@ -1824,7 +1861,7 @@ const hr = (t) => {
     );
   }, l = r.length > 0;
   return /* @__PURE__ */ e(
-    Bt,
+    Gt,
     {
       tone: "outline",
       caret: !0,
@@ -1842,7 +1879,7 @@ const hr = (t) => {
           onClick: () => {
             a(f.value), t.multiSelect || o();
           },
-          className: i(
+          className: c(
             "flex cursor-pointer items-center gap-2 rounded-md px-2.5 py-1.5 text-left text-sm",
             "transition-colors duration-fast ease-out hover:bg-surface-hover",
             "focus-visible:outline-none focus-visible:focus-ring",
@@ -1854,7 +1891,7 @@ const hr = (t) => {
       )) })
     }
   );
-}, He = ({
+}, Ve = ({
   data: t,
   columns: r,
   loading: n = !1,
@@ -1872,13 +1909,13 @@ const hr = (t) => {
   selectedRows: w = [],
   onSelectionChange: g,
   getRowKey: x = (te, Y) => Y,
-  emptyContent: $,
+  emptyContent: T,
   footerSummary: C,
   size: q = "md",
   hoverable: D = !0,
   padding: J = "md",
   className: V,
-  rowClassName: P,
+  rowClassName: I,
   headerBackground: H = !0
 }) => {
   const [te, Y] = O(""), K = l !== void 0, ie = K ? l : te, k = o ?? Y, [u, E] = O({
@@ -1923,9 +1960,9 @@ const hr = (t) => {
       r.find((re) => re.id === S)?.sortable && E((re) => re.column !== S ? { column: S, direction: "asc" } : re.direction === "asc" ? { column: S, direction: "desc" } : { column: null, direction: null });
     },
     [r]
-  ), I = xe((S) => {
+  ), P = xe((S) => {
     A((U) => ({ ...U, page: S }));
-  }, []), T = xe(
+  }, []), $ = xe(
     (S, U) => {
       if (!g) return;
       const re = x(S, 0);
@@ -1955,11 +1992,11 @@ const hr = (t) => {
     return w.some(
       (re, oe) => x(re, oe) === U
     );
-  }), Q = dr[J], ae = H ? "bg-surface-sunk" : "bg-surface", de = i("text-text", Q), ge = s || f.length > 0 || d.length > 0, he = v && z > 0, De = he || C !== void 0;
-  return /* @__PURE__ */ c("div", { className: i("flex min-w-0 flex-col", V), children: [
-    ge && /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-2 pb-3", children: [
+  }), Q = pr[J], ae = H ? "bg-surface-sunk" : "bg-surface", de = c("text-text", Q), ge = s || f.length > 0 || d.length > 0, he = v && z > 0, Ae = he || C !== void 0;
+  return /* @__PURE__ */ i("div", { className: c("flex min-w-0 flex-col", V), children: [
+    ge && /* @__PURE__ */ i("div", { className: "flex flex-wrap items-center gap-2 pb-3", children: [
       s && /* @__PURE__ */ e(
-        Ze,
+        tt,
         {
           value: ie,
           onValueChange: k,
@@ -1967,12 +2004,12 @@ const hr = (t) => {
           containerClassName: "w-full sm:w-66"
         }
       ),
-      f.map((S) => /* @__PURE__ */ e(hr, { ...S }, S.id)),
-      d.length > 0 && /* @__PURE__ */ e(ze, { actions: d, className: "ml-auto" })
+      f.map((S) => /* @__PURE__ */ e(wr, { ...S }, S.id)),
+      d.length > 0 && /* @__PURE__ */ e(Me, { 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: N, className: "min-w-full border-collapse text-base text-text", children: [
-      /* @__PURE__ */ e("thead", { className: i(ae, "h-control-lg"), children: /* @__PURE__ */ c("tr", { children: [
-        p && /* @__PURE__ */ e("th", { className: i(de, "w-10"), children: /* @__PURE__ */ e(
+    /* @__PURE__ */ e("div", { className: "relative w-full overflow-x-auto rounded-lg ring-1 ring-border", children: /* @__PURE__ */ i("table", { ref: N, className: "min-w-full border-collapse text-base text-text", children: [
+      /* @__PURE__ */ e("thead", { className: c(ae, "h-control-lg"), children: /* @__PURE__ */ i("tr", { children: [
+        p && /* @__PURE__ */ e("th", { className: c(de, "w-10"), children: /* @__PURE__ */ e(
           ye,
           {
             size: "sm",
@@ -1985,7 +2022,7 @@ const hr = (t) => {
         r.map((S) => /* @__PURE__ */ e(
           "th",
           {
-            className: i(
+            className: c(
               de,
               "text-xs font-semibold uppercase tracking-label text-text-muted",
               "group",
@@ -2000,14 +2037,14 @@ const hr = (t) => {
             ),
             style: { width: S.width },
             onClick: () => S.sortable && X(S.id),
-            children: /* @__PURE__ */ c("div", { className: "flex items-center gap-1.5", children: [
+            children: /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5", children: [
               S.headerCell ? S.headerCell() : S.header,
               S.sortable && /* @__PURE__ */ e(
                 Z,
                 {
-                  icon: u.column === S.id && u.direction === "desc" ? Me : ht,
+                  icon: u.column === S.id && u.direction === "desc" ? Te : wt,
                   size: "xs",
-                  className: i(
+                  className: c(
                     "transition-opacity duration-fast ease-out",
                     u.column === S.id ? "text-text opacity-100" : "text-text-subtle opacity-0 group-hover:opacity-100"
                   )
@@ -2017,44 +2054,44 @@ const hr = (t) => {
           },
           S.id
         )),
-        m.length > 0 && /* @__PURE__ */ e("th", { className: i(de, "w-10"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
+        m.length > 0 && /* @__PURE__ */ e("th", { className: c(de, "w-10"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
       ] }) }),
-      /* @__PURE__ */ e("tbody", { children: n ? Array.from({ length: mr }).map((S, U) => /* @__PURE__ */ c("tr", { className: "animate-pulse border-t border-border-subtle", "aria-hidden": !0, children: [
-        p && /* @__PURE__ */ e("td", { className: i(de, "h-row-lg"), children: /* @__PURE__ */ e("span", { className: "block size-4 rounded-xs bg-surface-hover" }) }),
-        r.map((re, oe) => /* @__PURE__ */ e("td", { className: i(de, "h-row-lg"), style: { width: re.width }, children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e("tbody", { children: n ? Array.from({ length: yr }).map((S, U) => /* @__PURE__ */ i("tr", { className: "animate-pulse border-t border-border-subtle", "aria-hidden": !0, children: [
+        p && /* @__PURE__ */ e("td", { className: c(de, "h-row-lg"), children: /* @__PURE__ */ e("span", { className: "block size-4 rounded-xs bg-surface-hover" }) }),
+        r.map((re, oe) => /* @__PURE__ */ e("td", { className: c(de, "h-row-lg"), style: { width: re.width }, children: /* @__PURE__ */ e(
           "span",
           {
             className: "block h-3 rounded-xs bg-surface-hover",
-            style: { width: Re[(U + oe) % Re.length] }
+            style: { width: He[(U + oe) % He.length] }
           }
         ) }, re.id)),
-        m.length > 0 && /* @__PURE__ */ e("td", { className: i(de, "h-row-lg") })
+        m.length > 0 && /* @__PURE__ */ e("td", { className: c(de, "h-row-lg") })
       ] }, `skeleton-${U}`)) : ee.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
         "td",
         {
           colSpan: r.length + (p ? 1 : 0) + (m.length > 0 ? 1 : 0),
-          className: i(
+          className: c(
             de,
             "border-t border-border-subtle py-10 text-center text-text-muted"
           ),
-          children: $ || "No data available"
+          children: T || "No data available"
         }
       ) }) : ee.map((S, U) => {
         const re = x(S, U), oe = w.some(
           (R, ue) => x(R, ue) === re
         );
-        return /* @__PURE__ */ c(
+        return /* @__PURE__ */ i(
           "tr",
           {
-            className: i(
-              ur[q],
+            className: c(
+              vr[q],
               // 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",
               b && "cursor-pointer",
               oe && "bg-accent-soft",
-              P?.(S, U)
+              I?.(S, U)
             ),
             onClick: (R) => {
               R.stopPropagation(), b?.(S, U);
@@ -2067,7 +2104,7 @@ const hr = (t) => {
                   checked: oe,
                   onClick: (R) => R.stopPropagation(),
                   onChange: (R) => {
-                    R.stopPropagation(), T(S, R.target.checked);
+                    R.stopPropagation(), $(S, R.target.checked);
                   },
                   "aria-label": "Select row"
                 }
@@ -2077,7 +2114,7 @@ const hr = (t) => {
                 return /* @__PURE__ */ e(
                   "td",
                   {
-                    className: i(de, {
+                    className: c(de, {
                       "text-left": R.align === "left" || !R.align,
                       "text-center": R.align === "center",
                       "text-right": R.align === "right",
@@ -2090,10 +2127,10 @@ const hr = (t) => {
                 );
               }),
               m.length > 0 && /* @__PURE__ */ e("td", { className: de, children: /* @__PURE__ */ e(
-                cr,
+                br,
                 {
                   className: "rounded-md",
-                  trigger: /* @__PURE__ */ e("span", { className: "grid size-7 place-items-center text-text-subtle", children: /* @__PURE__ */ e(Z, { icon: xt, size: "md", color: "current" }) }),
+                  trigger: /* @__PURE__ */ e("span", { className: "grid size-7 place-items-center text-text-subtle", children: /* @__PURE__ */ e(Z, { icon: kt, size: "md", color: "current" }) }),
                   options: m.map((R) => ({
                     value: R.id,
                     label: R.label,
@@ -2102,7 +2139,7 @@ const hr = (t) => {
                   })),
                   onSelect: (R) => {
                     const ue = m.find(
-                      (st) => st.id === R
+                      (ot) => ot.id === R
                     );
                     ue && ue.onClick(S, U);
                   },
@@ -2115,9 +2152,9 @@ const hr = (t) => {
         );
       }) })
     ] }) }),
-    De && /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-3 px-1 pt-3 text-xs text-text-muted", children: [
+    Ae && /* @__PURE__ */ i("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: C ?? `Showing ${j}–${B} of ${z}` }),
-      he && /* @__PURE__ */ c("div", { className: "flex items-center gap-0.5", children: [
+      he && /* @__PURE__ */ i("div", { className: "flex items-center gap-0.5", children: [
         /* @__PURE__ */ e(
           le,
           {
@@ -2125,19 +2162,19 @@ const hr = (t) => {
             variant: "ghost",
             iconOnly: !0,
             "aria-label": "Previous page",
-            onClick: () => I(y.page - 1),
+            onClick: () => P(y.page - 1),
             disabled: y.page === 0,
             children: /* @__PURE__ */ e(Z, { icon: Ce, size: "md", color: "current" })
           }
         ),
-        fr(y.page, F).map(
+        Nr(y.page, F).map(
           (S, U) => S === "gap" ? /* @__PURE__ */ e("span", { className: "px-1 text-text-subtle", children: "…" }, `gap-${U}`) : /* @__PURE__ */ e(
             "button",
             {
               type: "button",
               "aria-current": S === y.page ? "page" : void 0,
-              onClick: () => I(S),
-              className: i(
+              onClick: () => P(S),
+              className: c(
                 "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",
@@ -2155,7 +2192,7 @@ const hr = (t) => {
             variant: "ghost",
             iconOnly: !0,
             "aria-label": "Next page",
-            onClick: () => I(y.page + 1),
+            onClick: () => P(y.page + 1),
             disabled: y.page >= F - 1,
             children: /* @__PURE__ */ e(Z, { icon: $e, size: "md", color: "current" })
           }
@@ -2163,7 +2200,7 @@ const hr = (t) => {
       ] })
     ] })
   ] });
-}, xr = We(null), Ln = ({
+}, kr = Ke(null), Un = ({
   items: t,
   activeTab: r,
   onTabChange: n,
@@ -2172,12 +2209,12 @@ const hr = (t) => {
   const [a, l] = O(t[0]?.id || ""), o = r || a, f = (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(
+  return /* @__PURE__ */ e("div", { className: c("border-b border-border", s), children: /* @__PURE__ */ e("nav", { className: "-mb-px flex space-x-8", children: t.map((d) => /* @__PURE__ */ e(
     "button",
     {
       onClick: () => !d.disabled && f(d.id),
       disabled: d.disabled,
-      className: i(
+      className: c(
         "border-b-2 py-2 px-1 text-sm font-medium transition-colors duration-fast",
         {
           "border-accent-border text-text": o === d.id,
@@ -2185,9 +2222,9 @@ const hr = (t) => {
           "border-transparent text-disabled cursor-not-allowed": d.disabled
         }
       ),
-      children: /* @__PURE__ */ c("span", { className: "flex items-center gap-2", children: [
+      children: /* @__PURE__ */ i("span", { className: "flex items-center gap-2", children: [
         d.label,
-        d.badge && /* @__PURE__ */ e("span", { className: i(
+        d.badge && /* @__PURE__ */ e("span", { className: c(
           "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium",
           o === d.id ? "bg-accent-soft text-accent" : "bg-surface-hover text-text-muted"
         ), children: d.badge })
@@ -2195,7 +2232,7 @@ const hr = (t) => {
     },
     d.id
   )) }) });
-}, br = ({
+}, Cr = ({
   items: t,
   defaultTab: r,
   activeTab: n,
@@ -2211,7 +2248,7 @@ const hr = (t) => {
   }, m = {
     activeTab: v,
     setActiveTab: h
-  }, b = t.find((g) => g.id === v), p = i(
+  }, b = t.find((g) => g.id === v), p = c(
     "flex",
     {
       "border-b border-border px-2": a === "default" || a === "underline",
@@ -2221,7 +2258,7 @@ const hr = (t) => {
     },
     o
   ), w = (g, x) => {
-    const $ = "transition-colors duration-fast font-medium", C = {
+    const T = "transition-colors duration-fast font-medium", C = {
       "text-xs px-2 py-1": l === "sm",
       "text-sm px-3 py-2": l === "md",
       "text-base px-4 py-3": l === "lg"
@@ -2243,9 +2280,9 @@ const hr = (t) => {
       "text-text-muted hover:text-text": a === "pills",
       "border-transparent text-text-muted hover:text-text hover:border-border": a === "underline"
     } : {};
-    return i($, C, q, D, J, V);
+    return c(T, C, q, D, J, V);
   };
-  return /* @__PURE__ */ e(xr.Provider, { value: m, children: /* @__PURE__ */ c("div", { children: [
+  return /* @__PURE__ */ e(kr.Provider, { value: m, children: /* @__PURE__ */ i("div", { children: [
     /* @__PURE__ */ e("div", { className: p, role: "tablist", children: t.map((g) => /* @__PURE__ */ e(
       "button",
       {
@@ -2256,7 +2293,7 @@ const hr = (t) => {
         disabled: g.disabled,
         onClick: () => !g.disabled && h(g.id),
         className: w(g, v === g.id),
-        children: /* @__PURE__ */ c("span", { className: "flex items-center gap-2", children: [
+        children: /* @__PURE__ */ i("span", { className: "flex items-center gap-2", children: [
           g.label,
           g.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: g.badge })
         ] })
@@ -2274,14 +2311,14 @@ const hr = (t) => {
       }
     )
   ] }) });
-}, gr = {
+}, Sr = {
   sm: "max-w-md",
   md: "max-w-lg",
   lg: "max-w-2xl",
   xl: "max-w-4xl",
   full: "max-w-full mx-4"
 };
-function Qe({
+function rt({
   open: t,
   onClose: r,
   title: n,
@@ -2310,22 +2347,22 @@ function Qe({
   return t ? /* @__PURE__ */ e(
     "div",
     {
-      className: i(
+      className: c(
         "fixed inset-0 z-modal flex items-center justify-center p-4",
         "bg-scrim",
         // 'animate-fade-in',
         f
       ),
       onClick: p,
-      children: /* @__PURE__ */ c(
+      children: /* @__PURE__ */ i(
         "div",
         {
           ref: m,
-          className: i(
+          className: c(
             "relative w-full bg-surface rounded-lg shadow-modal",
             // 'animate-scale-in',
             "focus:outline-none",
-            gr[s],
+            Sr[s],
             o
           ),
           role: "dialog",
@@ -2333,7 +2370,7 @@ function Qe({
           "aria-labelledby": n ? "modal-title" : void 0,
           tabIndex: -1,
           children: [
-            (n || h) && /* @__PURE__ */ c("div", { className: "flex items-center justify-between p-6 pb-0", children: [
+            (n || h) && /* @__PURE__ */ i("div", { className: "flex items-center justify-between p-6 pb-0", children: [
               n && /* @__PURE__ */ e(
                 "span",
                 {
@@ -2360,19 +2397,19 @@ function Qe({
     }
   ) : null;
 }
-const pr = {
+const Er = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-base",
   lg: "text-md",
   xl: "text-lg"
-}, vr = {
+}, zr = {
   light: "font-normal",
   normal: "font-normal",
   medium: "font-medium",
   semibold: "font-semibold",
   bold: "font-bold"
-}, yr = {
+}, Mr = {
   primary: "text-text",
   secondary: "text-text-muted",
   accent: "text-accent",
@@ -2383,12 +2420,12 @@ const pr = {
   neutral: "text-text",
   current: "text-current",
   muted: "text-text-subtle"
-}, Nr = {
+}, Tr = {
   left: "text-left",
   center: "text-center",
   right: "text-right",
   justify: "text-justify"
-}, wr = {
+}, $r = {
   tight: "leading-tight",
   normal: "leading-normal",
   relaxed: "leading-relaxed"
@@ -2407,28 +2444,28 @@ const pr = {
   children: m,
   ...b
 }) => {
-  const p = v || kr(t), w = t === "caption", g = t === "label", x = t === "code", $ = i(
+  const p = v || _r(t), w = t === "caption", g = t === "label", x = t === "code", T = c(
     "font-sans",
     // Variant — caption and label pin their own size/weight
     w && "text-xs text-text-subtle",
     g && "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",
     // Size — only where the variant does not pin it
-    !w && !g && !x && pr[r],
+    !w && !g && !x && Er[r],
     // Weight — label owns its weight
-    !g && vr[n],
-    yr[s],
-    Nr[a],
+    !g && zr[n],
+    Mr[s],
+    Tr[a],
     // Line height only overrides the body variant
-    t === "body" && wr[d],
+    t === "body" && $r[d],
     o && "italic",
     f && "underline",
     l && "truncate",
     h
   );
-  return /* @__PURE__ */ e(p, { className: $, ...b, children: m });
+  return /* @__PURE__ */ e(p, { className: T, ...b, children: m });
 };
-function kr(t) {
+function _r(t) {
   return {
     body: "p",
     caption: "span",
@@ -2436,7 +2473,7 @@ function kr(t) {
     code: "code"
   }[t] || "p";
 }
-const Cr = ({
+const Dr = ({
   value: t,
   onChange: r,
   label: n,
@@ -2450,7 +2487,7 @@ const Cr = ({
   onDownloadFile: h,
   onRegisterFile: m
 }) => {
-  const [b, p] = O(!1), [w, g] = O([]), [x, $] = O(null), [C, q] = O("/"), [D, J] = O([]), [V, P] = O(!1), [H, te] = O(""), [Y, K] = O(
+  const [b, p] = O(!1), [w, g] = O([]), [x, T] = O(null), [C, q] = O("/"), [D, J] = O([]), [V, I] = O(!1), [H, te] = O(""), [Y, K] = O(
     typeof t == "object" ? t : null
   ), [ie, k] = O(!1), [u, E] = O(""), y = ne(null);
   G(() => {
@@ -2459,31 +2496,31 @@ const Cr = ({
     b && x && N();
   }, [b, x, C, H]);
   const A = async () => {
-    P(!0);
+    I(!0);
     try {
       const M = await d?.();
       M?.data && g(M.data);
     } catch (M) {
       console.error("Failed to load mounts", M);
     } finally {
-      P(!1);
+      I(!1);
     }
   }, N = async () => {
     if (x) {
-      P(!0);
+      I(!0);
       try {
         const M = await f?.({ mountId: x.id, name: H, path: C });
         M?.data && J(M.data);
       } catch (M) {
         console.error("Failed to load files", M);
       } finally {
-        P(!1);
+        I(!1);
       }
     }
   }, W = async (M) => {
     const L = M.target.files?.[0];
     if (L) {
-      P(!0);
+      I(!0);
       try {
         const Q = await L.arrayBuffer(), ae = new Uint8Array(Q), de = {
           id: `local-${Date.now()}`,
@@ -2500,13 +2537,13 @@ const Cr = ({
       } catch (Q) {
         console.error("Local file selection failed", Q);
       } finally {
-        P(!1);
+        I(!1);
       }
     }
   }, se = async (M) => {
     const L = M.target.files?.[0];
     if (!(!L || !x)) {
-      P(!0);
+      I(!0);
       try {
         const Q = await L.arrayBuffer(), ae = await v?.({
           file: new Uint8Array(Q),
@@ -2522,12 +2559,12 @@ const Cr = ({
       } catch (Q) {
         console.error("Upload failed", Q);
       } finally {
-        P(!1);
+        I(!1);
       }
     }
   }, ee = async () => {
     if (!(!u || !x)) {
-      P(!0);
+      I(!0);
       try {
         const M = `${C}${u}/`;
         m && (await m({
@@ -2543,22 +2580,22 @@ const Cr = ({
       } catch (M) {
         console.error("Failed to create folder", M);
       } finally {
-        P(!1);
+        I(!1);
       }
     }
   }, X = async (M) => {
-    P(!0);
+    I(!0);
     try {
       const L = await h?.(M.id);
       K(M), r(M, L), p(!1);
     } catch (L) {
       console.error("Failed to download file", L);
     } finally {
-      P(!1);
+      I(!1);
     }
-  }, I = (M) => {
+  }, P = (M) => {
     M.stopPropagation(), K(null), r(null);
-  }, T = pe(() => {
+  }, $ = pe(() => {
     const M = /* @__PURE__ */ new Set(), L = [];
     return D.forEach((Q) => {
       if (Q.type === "folder") {
@@ -2577,32 +2614,32 @@ const Cr = ({
     const M = C.split("/").filter((L) => L !== "");
     M.pop(), M.length === 0 ? q("/") : q(`${M.join("/")}/`);
   }, F = pe(() => {
-    const M = T.folders.map((L) => ({
+    const M = $.folders.map((L) => ({
       id: `folder-${L}`,
       name: L,
       type: "folder"
     }));
-    return T.files.forEach((L) => {
+    return $.files.forEach((L) => {
       M.push({
         ...L,
         type: "file"
       });
     }), M;
-  }, [T]), j = [
+  }, [$]), j = [
     {
       id: "name",
       header: "Name",
       accessor: "name",
-      cell: (M, L) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
+      cell: (M, L) => /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e(
           Z,
           {
-            icon: L.type === "folder" ? Fe : Ae,
+            icon: L.type === "folder" ? Be : Le,
             size: "sm",
             color: L.type === "folder" ? "warning" : "secondary"
           }
         ),
-        /* @__PURE__ */ e("span", { className: i(L.type === "folder" && "font-medium"), children: M })
+        /* @__PURE__ */ e("span", { className: c(L.type === "folder" && "font-medium"), children: M })
       ] })
     },
     {
@@ -2637,8 +2674,8 @@ const Cr = ({
       id: "name",
       header: "Mount Name",
       accessor: "name",
-      cell: (M) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2 font-medium", children: [
-        /* @__PURE__ */ e(Z, { icon: Oe, size: "sm", color: "primary" }),
+      cell: (M) => /* @__PURE__ */ i("div", { className: "flex items-center gap-2 font-medium", children: [
+        /* @__PURE__ */ e(Z, { icon: Fe, size: "sm", color: "primary" }),
         /* @__PURE__ */ e("span", { children: M })
       ] })
     },
@@ -2647,28 +2684,28 @@ const Cr = ({
       header: "",
       accessor: "id",
       align: "right",
-      cell: (M, L) => /* @__PURE__ */ e(le, { variant: "outline", onClick: () => $(L), children: "Open" })
+      cell: (M, L) => /* @__PURE__ */ e(le, { variant: "outline", onClick: () => T(L), children: "Open" })
     }
   ];
-  return /* @__PURE__ */ c("div", { className: "space-y-1", children: [
+  return /* @__PURE__ */ i("div", { className: "space-y-1", children: [
     n && /* @__PURE__ */ e(fe, { variant: "label", size: "sm", weight: "medium", children: n }),
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ i(
       "div",
       {
         onClick: () => !l && p(!0),
-        className: i(
+        className: c(
           "flex items-center gap-3 px-3 py-2 border rounded-lg cursor-pointer transition-colors",
           "hover:border-border-strong bg-surface",
           a ? "border-danger-border" : "border-border",
           l && "opacity-50 cursor-not-allowed bg-surface-sunk"
         ),
         children: [
-          /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(Z, { icon: Y ? Ae : Oe, color: Y ? "primary" : "secondary" }) }),
+          /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(Z, { icon: Y ? Le : Fe, 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(
             "button",
             {
-              onClick: I,
+              onClick: P,
               className: "p-1 hover:bg-surface-hover rounded",
               children: /* @__PURE__ */ e(Z, { icon: we, size: "xs" })
             }
@@ -2678,32 +2715,32 @@ const Cr = ({
     ),
     a && /* @__PURE__ */ e(fe, { variant: "body", size: "xs", className: "text-danger-fg", children: a }),
     /* @__PURE__ */ e(
-      Qe,
+      rt,
       {
         open: b,
         onClose: () => {
-          p(!1), $(null), q("/"), k(!1);
+          p(!1), T(null), q("/"), k(!1);
         },
         title: x ? `Explorer: ${x.name}` : "Select Storage Mount",
         size: "lg",
         children: /* @__PURE__ */ e(
-          br,
+          Cr,
           {
             variant: "pills",
             items: [
               {
                 id: "remote",
                 label: "Platform Storage",
-                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: x ? /* @__PURE__ */ c(ke, { children: [
-                  /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center gap-2", children: [
+                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: x ? /* @__PURE__ */ i(ke, { children: [
+                  /* @__PURE__ */ i("div", { className: "flex flex-wrap items-center gap-2", children: [
                     /* @__PURE__ */ e(
                       le,
                       {
                         variant: "ghost",
                         onClick: () => {
-                          C && C !== "/" ? z() : $(null);
+                          C && C !== "/" ? z() : T(null);
                         },
-                        leftIcon: /* @__PURE__ */ e(Z, { icon: bt, size: "xs" }),
+                        leftIcon: /* @__PURE__ */ e(Z, { icon: Ct, size: "xs" }),
                         children: C ? "Back" : "Back to Mounts"
                       }
                     ),
@@ -2714,17 +2751,17 @@ const Cr = ({
                         placeholder: "Search...",
                         value: H,
                         onChange: (M) => te(M.target.value),
-                        startIcon: /* @__PURE__ */ e(Te, { size: 14 }),
+                        startIcon: /* @__PURE__ */ e(_e, { size: 14 }),
                         fullWidth: !0
                       }
                     ) }),
-                    /* @__PURE__ */ c("div", { className: "flex items-center gap-1", children: [
+                    /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
                       /* @__PURE__ */ e(
                         le,
                         {
                           variant: "outline",
                           onClick: () => k(!0),
-                          leftIcon: /* @__PURE__ */ e(Z, { icon: gt, size: "xs" }),
+                          leftIcon: /* @__PURE__ */ e(Z, { icon: St, size: "xs" }),
                           children: "New Folder"
                         }
                       ),
@@ -2733,7 +2770,7 @@ const Cr = ({
                         {
                           variant: "primary",
                           onClick: () => y.current?.click(),
-                          leftIcon: /* @__PURE__ */ e(Z, { icon: pt, size: "xs" }),
+                          leftIcon: /* @__PURE__ */ e(Z, { icon: Et, size: "xs" }),
                           loading: V,
                           children: "Upload"
                         }
@@ -2750,8 +2787,8 @@ const Cr = ({
                       )
                     ] })
                   ] }),
-                  ie && /* @__PURE__ */ c("div", { className: "flex items-center gap-2 p-3 bg-surface-sunk rounded-lg border border-border", children: [
-                    /* @__PURE__ */ e(Z, { icon: Fe, size: "sm", color: "warning" }),
+                  ie && /* @__PURE__ */ i("div", { className: "flex items-center gap-2 p-3 bg-surface-sunk rounded-lg border border-border", children: [
+                    /* @__PURE__ */ e(Z, { icon: Be, size: "sm", color: "warning" }),
                     /* @__PURE__ */ e(
                       Ne,
                       {
@@ -2765,7 +2802,7 @@ const Cr = ({
                     /* @__PURE__ */ e(le, { variant: "ghost", onClick: () => k(!1), children: "Cancel" })
                   ] }),
                   /* @__PURE__ */ e("div", { className: "max-h-100 overflow-auto rounded-lg border border-border", children: /* @__PURE__ */ e(
-                    He,
+                    Ve,
                     {
                       data: F,
                       columns: j,
@@ -2775,28 +2812,28 @@ const Cr = ({
                     }
                   ) })
                 ] }) : /* @__PURE__ */ e("div", { className: "max-h-100 overflow-auto rounded-lg border border-border", children: /* @__PURE__ */ e(
-                  He,
+                  Ve,
                   {
                     data: w,
                     columns: B,
                     loading: V,
                     emptyContent: "No storage mounts configured",
-                    onRowClick: (M) => $(M)
+                    onRowClick: (M) => T(M)
                   }
                 ) }) })
               },
               {
                 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(Z, { icon: Ae, size: "xl", color: "primary" }) }),
+                content: /* @__PURE__ */ e("div", { className: "space-y-6", children: /* @__PURE__ */ i("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(Z, { icon: Le, size: "xl", color: "primary" }) }),
                   /* @__PURE__ */ e(fe, { variant: "label", size: "lg", weight: "semibold", children: "Select a file from your computer" }),
-                  /* @__PURE__ */ c(fe, { variant: "body", size: "sm", className: "text-text-muted mt-1 mb-6 text-center max-w-xs", children: [
+                  /* @__PURE__ */ i(fe, { 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 ",
                     /* @__PURE__ */ e("strong", { children: "not" }),
                     " be uploaded to platform storage."
                   ] }),
-                  /* @__PURE__ */ c("label", { className: "cursor-pointer", children: [
+                  /* @__PURE__ */ i("label", { className: "cursor-pointer", children: [
                     /* @__PURE__ */ e(le, { variant: "primary", size: "lg", loading: V, className: "pointer-events-none", children: "Browse Local File" }),
                     /* @__PURE__ */ e(
                       "input",
@@ -2817,12 +2854,12 @@ const Cr = ({
       }
     )
   ] });
-}, Sr = {
+}, Ar = {
   sm: "px-3 py-1.5 text-sm",
   md: "px-3 py-2 text-base",
   lg: "px-3 py-2 text-md",
   full: "px-3 py-2 text-md"
-}, Ie = be(
+}, je = be(
   ({
     label: t,
     helperText: r,
@@ -2838,20 +2875,20 @@ const Cr = ({
     ...m
   }, b) => {
     const p = ce.useId(), w = v || `textarea-${p}`, g = !!n, x = n || r ? `${w}-description` : void 0;
-    return /* @__PURE__ */ c("div", { className: i("flex flex-col", a && "w-full", o), children: [
+    return /* @__PURE__ */ i("div", { className: c("flex flex-col", a && "w-full", o), children: [
       t && /* @__PURE__ */ e(
         "label",
         {
           htmlFor: w,
-          className: i(
-            Je,
+          className: c(
+            Ze,
             g ? "text-danger-fg" : "text-text-muted",
             f
           ),
           children: t
         }
       ),
-      /* @__PURE__ */ c("div", { className: "relative", children: [
+      /* @__PURE__ */ i("div", { className: "relative", children: [
         /* @__PURE__ */ e(
           "textarea",
           {
@@ -2860,11 +2897,11 @@ const Cr = ({
             rows: h,
             "aria-invalid": g || void 0,
             "aria-describedby": x,
-            className: i(
-              Ye,
+            className: c(
+              Qe,
               "resize-y leading-relaxed",
-              Sr[s],
-              Xe(g),
+              Ar[s],
+              et(g),
               d
             ),
             ...m
@@ -2882,21 +2919,68 @@ const Cr = ({
         "p",
         {
           id: x,
-          className: i("mt-1 text-xs", g ? "text-danger-fg" : "text-text-subtle"),
+          className: c("mt-1 text-xs", g ? "text-danger-fg" : "text-text-subtle"),
           children: n || r
         }
       )
     ] });
   }
 );
-Ie.displayName = "TextArea";
-function Ve(t, r) {
+je.displayName = "TextArea";
+const Lr = /* @__PURE__ */ new Set([
+  "name",
+  "given-name",
+  "family-name",
+  "additional-name",
+  "nickname",
+  "honorific-prefix",
+  "honorific-suffix",
+  "email",
+  "username",
+  "organization",
+  "organization-title",
+  "tel",
+  "tel-country-code",
+  "tel-national",
+  "tel-extension",
+  "url",
+  "photo",
+  "language",
+  "bday",
+  "sex",
+  "street-address",
+  "address-line1",
+  "address-line2",
+  "address-line3",
+  "address-level1",
+  "address-level2",
+  "country",
+  "country-name",
+  "postal-code",
+  "current-password",
+  "new-password",
+  "one-time-code"
+]);
+function qe(t) {
+  return t && Lr.has(t) ? { autoComplete: t } : {
+    autoComplete: "off",
+    // 1Password
+    "data-1p-ignore": "true",
+    // LastPass
+    "data-lpignore": "true",
+    // Bitwarden
+    "data-bwignore": "true",
+    // Dashlane — "other" means "not a login field".
+    "data-form-type": "other"
+  };
+}
+function Ue(t, r) {
   return r.split(".").reduce(
     (n, s) => n && typeof n == "object" && s in n ? n[s] : void 0,
     t
   );
 }
-function Er(t, r, n) {
+function Ir(t, r, n) {
   const s = r.split("."), a = Array.isArray(t) ? [...t] : { ...t };
   let l = a;
   for (let o = 0; o < s.length - 1; o++) {
@@ -2905,7 +2989,7 @@ function Er(t, r, n) {
   }
   return l[s[s.length - 1]] = n, a;
 }
-function zr(t, r) {
+function Pr(t, r) {
   const n = r.split("."), s = Array.isArray(t) ? [...t] : { ...t };
   let a = s;
   for (let l = 0; l < n.length - 1; l++) {
@@ -2915,21 +2999,21 @@ function zr(t, r) {
   }
   return delete a[n[n.length - 1]], s;
 }
-function Mr({
+function jr({
   title: t,
   description: r,
   className: n,
   children: s
 }) {
-  return /* @__PURE__ */ c("div", { className: i("flex flex-col gap-4 py-6 sm:flex-row sm:gap-8", n), children: [
-    /* @__PURE__ */ c("div", { className: "w-full shrink-0 sm:w-form-label", children: [
+  return /* @__PURE__ */ i("div", { className: c("flex flex-col gap-4 py-6 sm:flex-row sm:gap-8", n), children: [
+    /* @__PURE__ */ i("div", { className: "w-full shrink-0 sm:w-form-label", children: [
       t && /* @__PURE__ */ e("span", { className: "text-base font-semibold text-text", children: t }),
       r && /* @__PURE__ */ e("p", { className: "mt-1 text-sm leading-relaxed text-pretty text-text-subtle", children: r })
     ] }),
     /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: s })
   ] });
 }
-const Pn = ({
+const Wn = ({
   groups: t,
   data: r,
   onSubmit: n,
@@ -2947,9 +3031,9 @@ const Pn = ({
   ref: w,
   sdk: g
 }) => {
-  const [x, $] = O(r || {}), [C, q] = O({}), [D, J] = O({});
+  const [x, T] = O(r || {}), [C, q] = O({}), [D, J] = O({});
   G(() => {
-    r && $({ ...r });
+    r && T({ ...r });
   }, [r]);
   const V = xe(
     (k, u, E) => {
@@ -2968,12 +3052,12 @@ const Pn = ({
           if (u.forEach((W, se) => {
             const ee = {};
             for (const X of y.arrayFields) {
-              const I = W?.[X.name];
-              if (X.required && (I == null || I === ""))
+              const P = W?.[X.name];
+              if (X.required && (P == null || P === ""))
                 ee[X.name] = `${X.label} is required`, N = !0;
               else if (X.validator) {
-                const T = X.validator(I, W);
-                T && (ee[X.name] = T, N = !0);
+                const $ = X.validator(P, W);
+                $ && (ee[X.name] = $, N = !0);
               }
             }
             A[se] = ee;
@@ -2984,14 +3068,14 @@ const Pn = ({
       return y.validator ? y.validator(u, E) : null;
     },
     [t]
-  ), P = xe(
+  ), I = xe(
     (k, u) => {
-      let E = Er(
+      let E = Ir(
         x,
         k,
         u
       );
-      t.flatMap((N) => N.items).find((N) => N.name === k)?.removeIfEmpty && (u == null || u === "") && (E = zr(E, k)), $(E), J((N) => ({ ...N, [k]: !0 }));
+      t.flatMap((N) => N.items).find((N) => N.name === k)?.removeIfEmpty && (u == null || u === "") && (E = Pr(E, k)), T(E), J((N) => ({ ...N, [k]: !0 }));
       const A = V(k, u, E);
       q((N) => ({
         ...N,
@@ -3008,7 +3092,7 @@ const Pn = ({
           continue;
         const N = V(
           A.name,
-          Ve(x, A.name),
+          Ue(x, A.name),
           x
         );
         N && (u[A.name] = N);
@@ -3025,7 +3109,7 @@ const Pn = ({
     [x, t, V, o, l, n, b]
   ), te = xe(
     (k) => {
-      const u = Ve(x, k.name), E = D[k.name] ? C[k.name] : void 0, y = k.disabled || b, A = {
+      const u = Ue(x, k.name), E = D[k.name] ? C[k.name] : void 0, y = k.disabled || b, A = {
         value: u || "",
         disabled: y,
         required: k.required,
@@ -3043,19 +3127,19 @@ const Pn = ({
             Ne,
             {
               ...A,
-              onChange: (N) => P(k.name, N.target.value),
+              onChange: (N) => I(k.name, N.target.value),
               type: k.textType || k.type,
-              autoComplete: k.autocomplete,
+              ...qe(k.autocomplete),
               error: E,
               size: m
             }
           );
         case "textarea":
           return /* @__PURE__ */ e(
-            Ie,
+            je,
             {
               ...A,
-              onChange: (N) => P(k.name, N.target.value),
+              onChange: (N) => I(k.name, N.target.value),
               rows: k.rows ?? 4,
               error: E,
               size: m
@@ -3063,10 +3147,10 @@ const Pn = ({
           );
         case "select":
           return /* @__PURE__ */ e(
-            Ee,
+            ze,
             {
               ...A,
-              onChange: (N) => P(k.name, N),
+              onChange: (N) => I(k.name, N),
               options: (k.options || []).map((N) => ({
                 ...N,
                 value: String(N.value)
@@ -3083,11 +3167,11 @@ const Pn = ({
         // open to learn what the choices even are.
         case "segmented":
           return /* @__PURE__ */ e(
-            Ut,
+            Qt,
             {
               "aria-label": k.label,
               value: u == null ? "" : String(u),
-              onChange: (N) => P(k.name, N),
+              onChange: (N) => I(k.name, N),
               options: (k.options || []).map((N) => ({
                 value: String(N.value),
                 label: N.label
@@ -3103,12 +3187,12 @@ const Pn = ({
               ...A,
               label: k.label,
               checked: !!u,
-              onChange: (N) => P(k.name, N.target.checked),
+              onChange: (N) => I(k.name, N.target.checked),
               size: m
             }
           );
         case "radio":
-          return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: k.options?.map((N) => /* @__PURE__ */ c(
+          return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: k.options?.map((N) => /* @__PURE__ */ i(
             "label",
             {
               className: "flex cursor-pointer items-center gap-3 text-base text-text",
@@ -3120,7 +3204,7 @@ const Pn = ({
                     name: k.name,
                     value: N.value,
                     checked: u === N.value,
-                    onChange: () => P(k.name, N.value),
+                    onChange: () => I(k.name, N.value),
                     disabled: y || 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"
                   }
@@ -3136,17 +3220,17 @@ const Pn = ({
             {
               ...A,
               value: u ? new Date(u) : null,
-              onChange: (N) => P(k.name, N),
+              onChange: (N) => I(k.name, N),
               size: m
             }
           );
         case "file":
           return /* @__PURE__ */ e(
-            Cr,
+            Dr,
             {
               ...A,
               value: u,
-              onChange: (N) => P(k.name, N),
+              onChange: (N) => I(k.name, N),
               error: E,
               onListFiles: (N) => g?.http.invoke({
                 method: "POST",
@@ -3175,10 +3259,10 @@ const Pn = ({
           );
         case "folder":
           return /* @__PURE__ */ e(
-            rr,
+            dr,
             {
               value: u || {},
-              onChange: (N) => P(k.name, N),
+              onChange: (N) => I(k.name, N),
               onListFolders: () => g?.http.invoke({
                 method: "GET",
                 action: "storage.mount"
@@ -3191,7 +3275,7 @@ const Pn = ({
         case "custom":
           return k.customComponent?.({
             value: u,
-            onChange: (N) => P(k.name, N),
+            onChange: (N) => I(k.name, N),
             error: E,
             disabled: y
           });
@@ -3204,35 +3288,35 @@ const Pn = ({
             } catch {
             }
           const se = () => {
-            P(k.name, [...N, {}]);
-          }, ee = (I) => {
-            P(
+            I(k.name, [...N, {}]);
+          }, ee = (P) => {
+            I(
               k.name,
-              N.filter((T, _) => _ !== I)
+              N.filter(($, _) => _ !== P)
             );
-          }, X = (I, T, _) => {
+          }, X = (P, $, _) => {
             const z = [...N];
-            z[I] = {
-              ...z[I],
-              [T]: _
-            }, P(k.name, z);
+            z[P] = {
+              ...z[P],
+              [$]: _
+            }, I(k.name, z);
           };
-          return /* @__PURE__ */ c("div", { className: "flex flex-col gap-2", children: [
-            N.map((I, T) => /* @__PURE__ */ c("div", { className: "flex items-start gap-2", children: [
+          return /* @__PURE__ */ i("div", { className: "flex flex-col gap-2", children: [
+            N.map((P, $) => /* @__PURE__ */ i("div", { className: "flex items-start gap-2", children: [
               /* @__PURE__ */ e("div", { className: "grid flex-1 gap-2 sm:grid-cols-2", children: k.arrayFields?.map((_) => {
-                const z = W?.[T]?.[_.name];
-                return /* @__PURE__ */ c(
+                const z = W?.[$]?.[_.name];
+                return /* @__PURE__ */ i(
                   "div",
                   {
                     className: "flex flex-col gap-1",
                     children: [
-                      T === 0 && /* @__PURE__ */ c("label", { className: "block text-xs font-semibold uppercase tracking-label text-text-subtle", children: [
+                      $ === 0 && /* @__PURE__ */ i("label", { className: "block text-xs font-semibold uppercase tracking-label text-text-subtle", children: [
                         _.label,
                         _.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
                       ] }),
                       (() => {
                         const F = {
-                          value: I?.[_.name] || "",
+                          value: P?.[_.name] || "",
                           disabled: y,
                           required: _.required,
                           placeholder: _.placeholder,
@@ -3250,23 +3334,23 @@ const Pn = ({
                               {
                                 ...F,
                                 onChange: (j) => X(
-                                  T,
+                                  $,
                                   _.name,
                                   j.target.value
                                 ),
                                 type: _.textType || _.type,
-                                autoComplete: _.autocomplete,
+                                ...qe(_.autocomplete),
                                 error: z,
                                 size: m
                               }
                             );
                           case "textarea":
                             return /* @__PURE__ */ e(
-                              Ie,
+                              je,
                               {
                                 ...F,
                                 onChange: (j) => X(
-                                  T,
+                                  $,
                                   _.name,
                                   j.target.value
                                 ),
@@ -3277,11 +3361,11 @@ const Pn = ({
                             );
                           case "select":
                             return /* @__PURE__ */ e(
-                              Ee,
+                              ze,
                               {
                                 ...F,
                                 onChange: (j) => X(
-                                  T,
+                                  $,
                                   _.name,
                                   j
                                 ),
@@ -3303,9 +3387,9 @@ const Pn = ({
                               ye,
                               {
                                 ...F,
-                                checked: !!I?.[_.name],
+                                checked: !!P?.[_.name],
                                 onChange: (j) => X(
-                                  T,
+                                  $,
                                   _.name,
                                   j.target.checked
                                 ),
@@ -3313,7 +3397,7 @@ const Pn = ({
                               }
                             );
                           case "radio":
-                            return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: _.options?.map((j) => /* @__PURE__ */ c(
+                            return /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: _.options?.map((j) => /* @__PURE__ */ i(
                               "label",
                               {
                                 className: "flex cursor-pointer items-center gap-2 text-base text-text",
@@ -3322,11 +3406,11 @@ const Pn = ({
                                     "input",
                                     {
                                       type: "radio",
-                                      name: `${k.name}.${T}.${_.name}`,
+                                      name: `${k.name}.${$}.${_.name}`,
                                       value: j.value,
-                                      checked: I?.[_.name] === j.value,
+                                      checked: P?.[_.name] === j.value,
                                       onChange: () => X(
-                                        T,
+                                        $,
                                         _.name,
                                         j.value
                                       ),
@@ -3340,14 +3424,14 @@ const Pn = ({
                               j.value
                             )) });
                           case "date": {
-                            const j = I?.[_.name];
+                            const j = P?.[_.name];
                             return /* @__PURE__ */ e(
                               Pe,
                               {
                                 ...F,
                                 value: j ? new Date(j) : null,
                                 onChange: (B) => X(
-                                  T,
+                                  $,
                                   _.name,
                                   B
                                 ),
@@ -3357,9 +3441,9 @@ const Pn = ({
                           }
                           case "custom":
                             return _.customComponent?.({
-                              value: I?.[_.name],
+                              value: P?.[_.name],
                               onChange: (j) => X(
-                                T,
+                                $,
                                 _.name,
                                 j
                               ),
@@ -3368,7 +3452,7 @@ const Pn = ({
                             });
                           // Add other field types here as needed
                           default:
-                            return /* @__PURE__ */ c("p", { children: [
+                            return /* @__PURE__ */ i("p", { children: [
                               "Unsupported field type in array:",
                               " ",
                               _.type
@@ -3389,19 +3473,19 @@ const Pn = ({
                   variant: "ghost",
                   size: "md",
                   "aria-label": `${k.label} verwijderen`,
-                  onClick: () => ee(T),
+                  onClick: () => ee($),
                   disabled: y,
-                  className: i("shrink-0", T === 0 && "mt-5"),
-                  children: /* @__PURE__ */ e(vt, { className: "size-icon-md" })
+                  className: c("shrink-0", $ === 0 && "mt-5"),
+                  children: /* @__PURE__ */ e(zt, { className: "size-icon-md" })
                 }
               )
-            ] }, T)),
-            /* @__PURE__ */ c(
+            ] }, $)),
+            /* @__PURE__ */ i(
               le,
               {
                 type: "button",
                 variant: "secondary",
-                leftIcon: /* @__PURE__ */ e(yt, { className: "size-icon-sm" }),
+                leftIcon: /* @__PURE__ */ e(Mt, { className: "size-icon-sm" }),
                 onClick: se,
                 disabled: y,
                 children: [
@@ -3416,14 +3500,14 @@ const Pn = ({
           return null;
       }
     },
-    [x, D, C, b, m, P]
+    [x, D, C, b, m, I]
   ), Y = xe(
     (k) => {
       if (k.conditional && !k.conditional(x))
         return null;
       const u = k.items.filter((y) => !(y.hidden || y.conditional && !y.conditional(x)));
       if (u.length === 0) return null;
-      const E = i(
+      const E = c(
         k.layout === "flex" ? "flex flex-wrap gap-3.5" : "grid gap-3.5",
         k.layout !== "flex" && {
           "grid-cols-1": !k.columns || k.columns === 1,
@@ -3438,17 +3522,17 @@ const Pn = ({
         // form *is* the page now, so a panel around each section would be a
         // second surface on top of the one it already sits on.
         /* @__PURE__ */ e(
-          Mr,
+          jr,
           {
             title: k.title,
             description: k.description,
             className: "not-last:border-b not-last:border-border-subtle",
             children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: E, children: u.map((y) => {
               const A = D[y.name] ? C[y.name] : void 0;
-              return /* @__PURE__ */ c(
+              return /* @__PURE__ */ i(
                 "div",
                 {
-                  className: i(
+                  className: c(
                     "flex min-w-0 flex-col gap-1.5",
                     y.type === "checkbox" && "justify-center"
                   ),
@@ -3457,7 +3541,7 @@ const Pn = ({
                     gridColumn: typeof y.width == "number" ? `span ${y.width} / span ${y.width}` : void 0
                   },
                   children: [
-                    y.type !== "custom" && y.type !== "checkbox" && /* @__PURE__ */ c("label", { className: "block text-sm font-medium text-text-muted", children: [
+                    y.type !== "custom" && y.type !== "checkbox" && /* @__PURE__ */ i("label", { className: "block text-sm font-medium text-text-muted", children: [
                       y.label,
                       y.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
                     ] }),
@@ -3474,7 +3558,7 @@ const Pn = ({
       );
     },
     [x, D, C, te]
-  ), K = i(
+  ), K = c(
     {
       "max-w-settings": m === "sm",
       "max-w-form": m === "md",
@@ -3483,10 +3567,10 @@ const Pn = ({
     },
     p
   ), ie = m === "full" ? "md" : m;
-  return /* @__PURE__ */ c("form", { ref: w, onSubmit: H, className: K, children: [
+  return /* @__PURE__ */ i("form", { ref: w, onSubmit: H, className: K, 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) }),
-    v && /* @__PURE__ */ e("div", { className: "flex items-center gap-2 border-t border-border-subtle py-4", children: /* @__PURE__ */ c(ke, { children: [
+    v && /* @__PURE__ */ e("div", { className: "flex items-center gap-2 border-t border-border-subtle py-4", children: /* @__PURE__ */ i(ke, { children: [
       /* @__PURE__ */ e("div", { className: "ml-auto" }),
       s && /* @__PURE__ */ e(
         le,
@@ -3515,7 +3599,7 @@ const Pn = ({
     ] }) })
   ] });
 };
-function In({
+function Kn({
   open: t,
   title: r,
   description: n,
@@ -3527,13 +3611,13 @@ function In({
   onCancel: d
 }) {
   return /* @__PURE__ */ e(
-    Qe,
+    rt,
     {
       open: t,
       onClose: d,
       title: r,
       size: "sm",
-      footer: /* @__PURE__ */ c("div", { className: "flex w-full items-center justify-end gap-2", children: [
+      footer: /* @__PURE__ */ i("div", { className: "flex w-full items-center justify-end gap-2", children: [
         /* @__PURE__ */ e(le, { variant: "ghost", onClick: d, disabled: o, children: a }),
         /* @__PURE__ */ e(
           le,
@@ -3549,7 +3633,7 @@ function In({
     }
   );
 }
-const $r = {
+const Or = {
   default: "bg-surface-hover text-text",
   primary: "bg-accent-soft text-accent",
   secondary: "bg-surface-hover text-text-muted",
@@ -3559,11 +3643,11 @@ const $r = {
   info: "bg-info-soft text-info-fg",
   // Internal-note amber. Never for customer-visible content.
   note: "bg-note-soft text-note"
-}, Tr = {
+}, Fr = {
   sm: "px-2 py-0.5 text-xs",
   md: "px-2.5 py-1 text-sm",
   lg: "px-3 py-1.5 text-base"
-}, _r = {
+}, Br = {
   default: "bg-surface-hover",
   primary: "bg-accent",
   secondary: "bg-surface-hover",
@@ -3573,7 +3657,7 @@ const $r = {
   info: "bg-info",
   note: "bg-note"
 };
-function Dr({
+function Rr({
   variant: t = "default",
   size: r = "md",
   dot: n = !1,
@@ -3584,16 +3668,16 @@ function Dr({
   children: f,
   ...d
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "span",
     {
-      className: i(
+      className: c(
         // Base styles
         "inline-flex items-center font-medium rounded-full",
         // Variant styles
-        $r[t],
+        Or[t],
         // Size styles
-        Tr[r],
+        Fr[r],
         o
       ),
       ...d,
@@ -3601,13 +3685,13 @@ function Dr({
         n && /* @__PURE__ */ e(
           "span",
           {
-            className: i(
+            className: c(
               "w-2 h-2 rounded-full mr-1.5",
-              _r[t]
+              Br[t]
             )
           }
         ),
-        s && /* @__PURE__ */ e("span", { className: i("flex-shrink-0", f && "mr-1"), children: s }),
+        s && /* @__PURE__ */ e("span", { className: c("flex-shrink-0", f && "mr-1"), children: s }),
         f,
         a && l && /* @__PURE__ */ e(
           "button",
@@ -3622,11 +3706,11 @@ function Dr({
     }
   );
 }
-const me = ({ className: t }) => /* @__PURE__ */ e("span", { className: i("block rounded-xs bg-surface-hover", t) });
-function Ar({ shape: t, rows: r, columns: n }) {
+const me = ({ className: t }) => /* @__PURE__ */ e("span", { className: c("block rounded-xs bg-surface-hover", t) });
+function Hr({ shape: t, rows: r, columns: n }) {
   switch (t) {
     case "table":
-      return /* @__PURE__ */ c("div", { className: "overflow-hidden rounded-lg ring-1 ring-border", children: [
+      return /* @__PURE__ */ i("div", { className: "overflow-hidden rounded-lg ring-1 ring-border", children: [
         /* @__PURE__ */ e(
           "div",
           {
@@ -3646,22 +3730,22 @@ function Ar({ shape: t, rows: r, columns: n }) {
         ))
       ] });
     case "list":
-      return /* @__PURE__ */ e("div", { className: "flex flex-col divide-y divide-border-subtle rounded-lg ring-1 ring-border", children: Array.from({ length: r }).map((s, a) => /* @__PURE__ */ c("div", { className: "flex items-center gap-3 p-3", children: [
+      return /* @__PURE__ */ e("div", { className: "flex flex-col divide-y divide-border-subtle rounded-lg ring-1 ring-border", children: Array.from({ length: r }).map((s, a) => /* @__PURE__ */ i("div", { className: "flex items-center gap-3 p-3", children: [
         /* @__PURE__ */ e(me, { className: "size-avatar-sm shrink-0 rounded-full" }),
-        /* @__PURE__ */ c("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
+        /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
           /* @__PURE__ */ e(me, { className: "h-3" }),
           /* @__PURE__ */ e(me, { className: "h-2.5 opacity-70" })
         ] })
       ] }, a)) });
     case "form":
-      return /* @__PURE__ */ e("div", { className: "flex flex-col gap-5", children: Array.from({ length: r }).map((s, a) => /* @__PURE__ */ c("div", { className: "flex flex-col gap-2", children: [
+      return /* @__PURE__ */ e("div", { className: "flex flex-col gap-5", children: Array.from({ length: r }).map((s, a) => /* @__PURE__ */ i("div", { className: "flex flex-col gap-2", children: [
         /* @__PURE__ */ e(me, { className: "h-2.5 w-28" }),
         /* @__PURE__ */ e(me, { className: "h-control-md w-full rounded-md" })
       ] }, a)) });
     case "menu":
-      return /* @__PURE__ */ c("div", { className: "flex flex-col gap-px", children: [
+      return /* @__PURE__ */ i("div", { className: "flex flex-col gap-px", children: [
         /* @__PURE__ */ e("div", { className: "px-2.5 pb-2 pt-5", children: /* @__PURE__ */ e(me, { className: "h-2 w-16" }) }),
-        Array.from({ length: r }).map((s, a) => /* @__PURE__ */ c("div", { className: "flex h-row-md items-center gap-2.5 px-2.5", children: [
+        Array.from({ length: r }).map((s, a) => /* @__PURE__ */ i("div", { className: "flex h-row-md items-center gap-2.5 px-2.5", children: [
           /* @__PURE__ */ e(me, { className: "size-4 shrink-0" }),
           /* @__PURE__ */ e(me, { className: "h-2" })
         ] }, a))
@@ -3672,7 +3756,7 @@ function Ar({ shape: t, rows: r, columns: n }) {
         {
           className: "grid gap-4",
           style: { gridTemplateColumns: `repeat(${n}, minmax(0, 1fr))` },
-          children: Array.from({ length: r * n }).map((s, a) => /* @__PURE__ */ c("div", { className: "flex flex-col gap-2 rounded-lg p-4 ring-1 ring-border", children: [
+          children: Array.from({ length: r * n }).map((s, a) => /* @__PURE__ */ i("div", { className: "flex flex-col gap-2 rounded-lg p-4 ring-1 ring-border", children: [
             /* @__PURE__ */ e(me, { className: "h-3 w-1/2" }),
             /* @__PURE__ */ e(me, { className: "h-2.5" }),
             /* @__PURE__ */ e(me, { className: "h-2.5 w-3/4 opacity-70" })
@@ -3681,13 +3765,13 @@ function Ar({ shape: t, rows: r, columns: n }) {
       );
     case "text":
     default:
-      return /* @__PURE__ */ c("div", { className: "flex flex-col gap-6", children: [
+      return /* @__PURE__ */ i("div", { className: "flex flex-col gap-6", children: [
         /* @__PURE__ */ e(me, { className: "h-6 w-1/4" }),
         /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: Array.from({ length: r }).map((s, a) => /* @__PURE__ */ e(me, { className: "h-4" }, a)) })
       ] });
   }
 }
-const Lr = {
+const Vr = {
   text: 2,
   table: 8,
   list: 6,
@@ -3695,7 +3779,7 @@ const Lr = {
   menu: 4,
   cards: 2
 };
-function et({
+function nt({
   variant: t = "page",
   shape: r,
   rows: n,
@@ -3706,14 +3790,14 @@ function et({
   tableColumns: f,
   tableRows: d
 }) {
-  const v = r ?? (o ? "table" : "text"), h = n ?? d ?? Lr[v], m = s ?? f ?? (v === "cards" ? 3 : 6), b = /* @__PURE__ */ e("div", { className: i("w-full animate-pulse", l), "aria-hidden": !0, children: a ?? /* @__PURE__ */ e(Ar, { shape: v, rows: h, columns: m }) });
+  const v = r ?? (o ? "table" : "text"), h = n ?? d ?? Vr[v], m = s ?? f ?? (v === "cards" ? 3 : 6), b = /* @__PURE__ */ e("div", { className: c("w-full animate-pulse", l), "aria-hidden": !0, children: a ?? /* @__PURE__ */ e(Hr, { shape: v, rows: h, columns: m }) });
   return t === "inline" ? b : /* @__PURE__ */ e("main", { className: "flex-1 bg-surface p-6", children: b });
 }
-const Pr = {
+const qr = {
   neutral: "bg-surface-hover text-text-muted",
   success: "bg-success-soft text-success-fg"
 };
-function jn({
+function Gn({
   icon: t,
   tone: r = "neutral",
   title: n,
@@ -3723,17 +3807,17 @@ function jn({
   className: o,
   ...f
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: i(
+      className: c(
         "flex flex-col items-center gap-2.5 text-center",
         l && "rounded-lg border border-border bg-surface px-11 py-9 shadow-overlay",
         o
       ),
       ...f,
       children: [
-        t != null && /* @__PURE__ */ e("span", { className: i("flex size-disc items-center justify-center rounded-full text-2xl", Pr[r]), children: t }),
+        t != null && /* @__PURE__ */ e("span", { className: c("flex size-disc items-center justify-center rounded-full text-2xl", qr[r]), children: t }),
         /* @__PURE__ */ e("div", { className: "text-lg font-semibold text-text", children: n }),
         s && /* @__PURE__ */ e("div", { className: "max-w-sm text-sm leading-relaxed text-text-muted", children: s }),
         a && /* @__PURE__ */ e("div", { className: "flex gap-2 pt-1.5", children: a })
@@ -3741,11 +3825,11 @@ function jn({
     }
   );
 }
-function On({ children: t, className: r, ...n }) {
+function Jn({ children: t, className: r, ...n }) {
   return /* @__PURE__ */ e(
     "kbd",
     {
-      className: i(
+      className: c(
         "inline-flex items-center rounded border border-border px-1.5 py-px text-xs font-medium leading-none text-text-muted",
         r
       ),
@@ -3754,14 +3838,14 @@ function On({ children: t, className: r, ...n }) {
     }
   );
 }
-const Ir = {
+const Ur = {
   sm: "h-1",
   md: "h-1.5"
-}, jr = {
+}, Wr = {
   accent: "bg-accent",
   success: "bg-success"
 };
-function Fn({ value: t, variant: r = "accent", size: n = "md", className: s, ...a }) {
+function Yn({ value: t, variant: r = "accent", size: n = "md", className: s, ...a }) {
   const l = Math.max(0, Math.min(100, t));
   return /* @__PURE__ */ e(
     "div",
@@ -3770,37 +3854,37 @@ function Fn({ value: t, variant: r = "accent", size: n = "md", className: s, ...
       "aria-valuenow": Math.round(l),
       "aria-valuemin": 0,
       "aria-valuemax": 100,
-      className: i("w-full overflow-hidden rounded-full bg-surface-hover", Ir[n], s),
+      className: c("w-full overflow-hidden rounded-full bg-surface-hover", Ur[n], s),
       ...a,
       children: /* @__PURE__ */ e(
         "div",
         {
-          className: i("h-full rounded-full transition-[width] duration-300 ease-out", jr[r]),
+          className: c("h-full rounded-full transition-[width] duration-300 ease-out", Wr[r]),
           style: { width: `${l}%` }
         }
       )
     }
   );
 }
-const Or = {
+const Kr = {
   xs: "h-3 w-3",
   sm: "h-4 w-4",
   md: "h-6 w-6",
   lg: "h-8 w-8",
   xl: "h-12 w-12"
-}, Fr = {
+}, Gr = {
   primary: "text-accent",
   secondary: "text-text-muted",
   white: "text-white",
   current: "text-current"
-}, Br = {
+}, Jr = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-sm",
   lg: "text-base",
   xl: "text-lg"
 };
-function Bn({
+function Xn({
   size: t = "md",
   variant: r = "primary",
   label: n = "Loading...",
@@ -3808,23 +3892,23 @@ function Bn({
   className: a,
   ...l
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: i(
+      className: c(
         "inline-flex items-center",
         s ? "flex-col space-y-2" : "",
         a
       ),
       ...l,
       children: [
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ i(
           "svg",
           {
-            className: i(
+            className: c(
               "animate-spin",
-              Or[t],
-              Fr[r]
+              Kr[t],
+              Gr[r]
             ),
             fill: "none",
             viewBox: "0 0 24 24",
@@ -3856,9 +3940,9 @@ function Bn({
         s && /* @__PURE__ */ e(
           "span",
           {
-            className: i(
+            className: c(
               "text-text-muted",
-              Br[t]
+              Jr[t]
             ),
             children: n
           }
@@ -3868,7 +3952,7 @@ function Bn({
     }
   );
 }
-const Rr = {
+const Yr = {
   neutral: "bg-text-disabled",
   accent: "bg-accent",
   success: "bg-success",
@@ -3882,7 +3966,7 @@ const Rr = {
   "cat-4": "bg-cat-4",
   "cat-5": "bg-cat-5"
 };
-function Rn({
+function Zn({
   tone: t = "neutral",
   shape: r = "round",
   pulse: n = !1,
@@ -3895,17 +3979,17 @@ function Rn({
       role: s ? "img" : void 0,
       "aria-label": s,
       "aria-hidden": s ? void 0 : !0,
-      className: i(
+      className: c(
         "inline-block size-dot shrink-0",
         r === "round" ? "rounded-full" : "rounded-sm",
-        Rr[t],
+        Yr[t],
         n && "animate-pulse",
         a
       )
     }
   );
 }
-function Hn({
+function Qn({
   steps: t,
   current: r,
   variant: n = "numbered",
@@ -3913,10 +3997,10 @@ function Hn({
   className: a
 }) {
   const l = t.indexOf(r), o = { role: s ? "group" : void 0, "aria-label": s, "aria-hidden": s ? void 0 : !0 };
-  return n === "dots" ? /* @__PURE__ */ e("div", { ...o, className: i("flex items-center gap-1.5", a), children: t.map((f, d) => /* @__PURE__ */ e(
+  return n === "dots" ? /* @__PURE__ */ e("div", { ...o, className: c("flex items-center gap-1.5", a), children: t.map((f, d) => /* @__PURE__ */ e(
     "span",
     {
-      className: i(
+      className: c(
         "h-step-bar rounded-full transition-all duration-fast ease-out",
         d === l ? "w-5 bg-accent" : "w-3.5",
         d < l && "bg-border-strong",
@@ -3924,12 +4008,12 @@ function Hn({
       )
     },
     f
-  )) }) : /* @__PURE__ */ e("div", { ...o, className: i("flex items-center gap-2", a), children: t.map((f, d) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
+  )) }) : /* @__PURE__ */ e("div", { ...o, className: c("flex items-center gap-2", a), children: t.map((f, d) => /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
     /* @__PURE__ */ e(
       "span",
       {
         "aria-current": d === l ? "step" : void 0,
-        className: i(
+        className: c(
           "flex size-tile-sm items-center justify-center rounded-full text-xs font-medium",
           d === l && "bg-accent text-accent-fg",
           d < l && "bg-accent-soft text-accent",
@@ -3941,18 +4025,18 @@ function Hn({
     d < t.length - 1 && /* @__PURE__ */ e("span", { className: "h-px w-8 bg-border-strong" })
   ] }, f)) });
 }
-function Vn({ title: t, icon: r = /* @__PURE__ */ e(Nt, { className: "size-icon-md", "aria-hidden": !0 }), action: n, children: s, className: a, ...l }) {
-  return /* @__PURE__ */ c(
+function es({ title: t, icon: r = /* @__PURE__ */ e(Tt, { className: "size-icon-md", "aria-hidden": !0 }), action: n, children: s, className: a, ...l }) {
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: i(
+      className: c(
         "flex flex-col gap-2 rounded-xl border p-4",
         "border-assistant-border bg-assistant-soft",
         a
       ),
       ...l,
       children: [
-        /* @__PURE__ */ c("div", { className: "flex items-center gap-2 text-assistant", children: [
+        /* @__PURE__ */ i("div", { className: "flex items-center gap-2 text-assistant", children: [
           /* @__PURE__ */ e("span", { "aria-hidden": !0, children: r }),
           /* @__PURE__ */ e("span", { className: "text-sm font-semibold", children: t }),
           n && /* @__PURE__ */ e("span", { className: "ml-auto", children: n })
@@ -3962,30 +4046,32 @@ function Vn({ title: t, icon: r = /* @__PURE__ */ e(Nt, { className: "size-icon-
     }
   );
 }
-const Hr = {
+const Xr = {
   default: "bg-avatar text-avatar-fg",
   in: "bg-avatar-in text-avatar-in-fg",
   out: "bg-accent text-accent-fg",
   note: "bg-avatar-note text-avatar-note-fg"
-}, Vr = {
+}, Zr = {
   xs: "w-5 h-5 text-xs",
   sm: "w-6 h-6 text-xs",
   md: "w-7 h-7 text-base",
   lg: "w-9 h-9 text-sm"
 };
-function qr(t) {
+function Qr(t) {
   if (!t) return "?";
   const r = t.trim().split(/[^\p{L}\p{N}]+/u).filter(Boolean);
   return r.length >= 2 ? (r[0][0] + r[1][0]).toUpperCase() : r.length === 1 ? r[0].slice(0, 2).toUpperCase() : "?";
 }
-const Ur = ({ name: t, src: r, tone: n = "default", size: s = "sm", className: a, title: l }) => {
-  const [o, f] = ce.useState(!1), d = i(
+const en = ({ name: t, src: r, tone: n = "default", size: s = "sm", className: a, title: l }) => {
+  const [o, f] = ce.useState(!1), d = c(
     // 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.
     "inline-flex items-center justify-center rounded-full overflow-hidden shrink-0 font-semibold select-none",
-    Hr[n],
-    Vr[s],
+    // `identity` is seeded on the name, so the same person keeps their colour
+    // wherever they appear; the fixed tones stay as they were.
+    n === "identity" ? Je(t) : Xr[n],
+    Zr[s],
     a
   );
   return r && !o ? /* @__PURE__ */ e(
@@ -3994,38 +4080,38 @@ const Ur = ({ name: t, src: r, tone: n = "default", size: s = "sm", className: a
       src: r,
       alt: t ?? "",
       title: l ?? t,
-      className: i(d, "object-cover"),
+      className: c(d, "object-cover"),
       onError: () => f(!0)
     }
-  ) : /* @__PURE__ */ e("span", { className: d, title: l ?? t, "aria-label": t, children: qr(t) });
-}, qe = "ring-surface", Wr = "ring-surface-accent", qn = ({ people: t, max: r = 4, size: n = "sm", className: s }) => {
+  ) : /* @__PURE__ */ e("span", { className: d, title: l ?? t, "aria-label": t, children: Qr(t) });
+}, We = "ring-surface", tn = "ring-surface-accent", ts = ({ people: t, max: r = 4, size: n = "sm", className: s }) => {
   if (t.length === 0) return null;
   const a = t.slice(0, r), l = t.length - a.length;
-  return /* @__PURE__ */ c("span", { className: i("inline-flex items-center", s), children: [
+  return /* @__PURE__ */ i("span", { className: c("inline-flex items-center", s), children: [
     a.map((o, f) => /* @__PURE__ */ e(
-      Ur,
+      en,
       {
         name: o.name,
         src: o.src,
         size: n,
         title: o.name ? o.seen === !1 ? `${o.name} — nog niet gelezen` : o.name : void 0,
-        className: i(
+        className: c(
           f > 0 && "-ml-2",
-          o.owner ? Wr : qe,
+          o.owner ? tn : We,
           o.seen === !1 && "opacity-40"
         )
       },
       o.id ?? `${o.name}-${f}`
     )),
-    l > 0 && /* @__PURE__ */ c(
+    l > 0 && /* @__PURE__ */ i(
       "span",
       {
-        className: i(
+        className: c(
           // Same fill as an Avatar plate, so the "+3" reads as one more disc
           // in the row rather than a gap at the end of it.
           "inline-flex items-center justify-center rounded-full shrink-0 -ml-2 font-semibold bg-avatar text-avatar-fg",
           n === "xs" ? "w-5 h-5 text-xs" : n === "md" ? "w-7 h-7 text-xs" : n === "lg" ? "w-9 h-9 text-xs" : "w-6 h-6 text-xs",
-          qe
+          We
         ),
         children: [
           "+",
@@ -4034,35 +4120,37 @@ const Ur = ({ name: t, src: r, tone: n = "default", size: s = "sm", className: a
       }
     )
   ] });
-}, Ue = {
+}, Ee = {
   mail: { fg: "text-channel-mail-fg", bg: "bg-channel-mail-soft" },
   wa: { fg: "text-channel-whatsapp-fg", bg: "bg-channel-whatsapp-soft" },
   chat: { fg: "text-channel-chat-fg", bg: "bg-channel-chat-soft" },
   tel: { fg: "text-channel-phone-fg", bg: "bg-channel-phone-soft" },
   note: { fg: "text-channel-note-fg", bg: "bg-channel-note-soft" }
-}, Kr = {
+}, rn = {
   sm: "size-avatar-xs rounded-sm text-xs",
   md: "size-avatar-sm rounded-md text-xs",
   lg: "size-avatar-lg rounded-md text-base"
 };
-function Un({ channel: t, children: r, size: n = "md", className: s, title: a }) {
-  const l = Ue[t in Ue ? t : "note"];
+function rs({ channel: t, children: r, size: n = "md", className: s, title: a }) {
+  const l = t in Ee ? Ee[t] : void 0;
   return /* @__PURE__ */ e(
     "span",
     {
       title: a,
-      className: i(
+      className: c(
         "inline-flex shrink-0 items-center justify-center font-bold",
-        Kr[n],
-        l.fg,
-        l.bg,
+        rn[n],
+        // An undeclared channel used to collapse onto the neutral "note" tone,
+        // which is also what a real internal note looks like. Deriving from the
+        // key keeps it distinguishable and keeps `note` meaning `note`.
+        l ? c(l.fg, l.bg) : t ? Je(t) : c(Ee.note.fg, Ee.note.bg),
         s
       ),
       children: r
     }
   );
 }
-const Wn = ({
+const ns = ({
   src: t,
   alt: r,
   size: n = "md",
@@ -4078,15 +4166,15 @@ const Wn = ({
   onError: b,
   ...p
 }) => {
-  const [w, g] = O(!0), [x, $] = O(!1), [C, q] = O(t), D = (K) => {
-    g(!1), $(!1), m?.(K);
+  const [w, g] = O(!0), [x, T] = O(!1), [C, q] = O(t), D = (K) => {
+    g(!1), T(!1), m?.(K);
   }, J = (K) => {
-    if (g(!1), $(!0), f && C !== f) {
-      q(f), $(!1), g(!0);
+    if (g(!1), T(!0), f && C !== f) {
+      q(f), T(!1), g(!0);
       return;
     }
     b?.(K);
-  }, V = i(
+  }, V = c(
     "relative overflow-hidden bg-surface-hover",
     // Size variants
     {
@@ -4114,27 +4202,27 @@ const Wn = ({
       "rounded-full": a === "full"
     },
     h
-  ), P = i(
+  ), I = c(
     "w-full h-full object-cover transition-opacity duration-fast",
     {
       "opacity-0": w || x,
       "opacity-100": !w && !x
     }
-  ), H = i(
+  ), H = c(
     "absolute inset-0 flex items-center justify-center",
     "text-text-muted"
-  ), te = /* @__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(Z, { icon: wt, size: "lg", className: "mx-auto mb-1" }),
+  ), te = /* @__PURE__ */ e("div", { className: "animate-pulse", children: /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-surface-hover rounded" }) }), Y = /* @__PURE__ */ i("div", { className: "text-center", children: [
+    /* @__PURE__ */ e(Z, { icon: $t, size: "lg", className: "mx-auto mb-1" }),
     /* @__PURE__ */ e("span", { className: "text-xs", children: "Failed to load" })
   ] });
-  return /* @__PURE__ */ c("div", { className: V, children: [
+  return /* @__PURE__ */ i("div", { className: V, children: [
     /* @__PURE__ */ e(
       "img",
       {
         ...p,
         src: C,
         alt: r,
-        className: P,
+        className: I,
         onLoad: D,
         onError: J
       }
@@ -4143,17 +4231,17 @@ const Wn = ({
     x && o && /* @__PURE__ */ e("div", { className: H, children: v || Y })
   ] });
 };
-function Kn({
+function ss({
   icon: t,
   onClick: r,
   children: n
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "button",
     {
       type: "button",
       onClick: r,
-      className: i(
+      className: c(
         "inline-flex h-control-sm shrink-0 cursor-pointer items-center gap-1.5 rounded-md px-2.5",
         "text-sm font-medium whitespace-nowrap",
         "transition-colors duration-fast ease-out hover:bg-white/15",
@@ -4166,7 +4254,7 @@ function Kn({
     }
   );
 }
-function Gn({
+function as({
   items: t,
   getRowKey: r,
   variant: n = "divided",
@@ -4184,13 +4272,13 @@ function Gn({
   stickyGroupHeaders: w = !1,
   collapsibleGroups: g = !1,
   hideGroupCount: x = !1,
-  selectable: $ = !1,
+  selectable: T = !1,
   selectedItems: C = [],
   onSelectionChange: q,
   bulkActions: D,
   header: J,
   stickyHeader: V = !1,
-  bordered: P = !1,
+  bordered: I = !1,
   emptyContent: H,
   loading: te = !1,
   loadingRows: Y = 4,
@@ -4214,7 +4302,7 @@ function Gn({
     q && q(
       F ? [...C, z] : C.filter((j) => j !== z)
     );
-  }, se = (z) => q?.(z ? [...t] : []), ee = i(
+  }, se = (z) => q?.(z ? [...t] : []), ee = c(
     "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
@@ -4222,15 +4310,15 @@ function Gn({
     // 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.length > 0 && "min-h-full",
-    P && "overflow-hidden rounded-lg border border-border-subtle",
+    T && C.length > 0 && "min-h-full",
+    I && "overflow-hidden rounded-lg border border-border-subtle",
     K
   );
   if (te)
-    return /* @__PURE__ */ e("div", { className: ee, children: Array.from({ length: Y }).map((z, F) => /* @__PURE__ */ c(
+    return /* @__PURE__ */ e("div", { className: ee, children: Array.from({ length: Y }).map((z, F) => /* @__PURE__ */ i(
       "div",
       {
-        className: i(
+        className: c(
           "flex animate-pulse items-center gap-3 px-4 py-2",
           n === "divided" && F > 0 && "border-t border-border-subtle"
         ),
@@ -4245,9 +4333,9 @@ function Gn({
     )) });
   if (t.length === 0 && H)
     return /* @__PURE__ */ e("div", { className: ee, children: H });
-  const X = t.length > 0 && C.length === t.length, I = C.length > 0 && !X, T = (z, F, j) => {
-    const B = d?.(z, F) ?? !1, M = v?.(z, F) ?? !1, L = h?.(z, F) ?? !1, Q = $ && N(z);
-    return /* @__PURE__ */ c(
+  const X = t.length > 0 && C.length === t.length, P = C.length > 0 && !X, $ = (z, F, j) => {
+    const B = d?.(z, F) ?? !1, M = v?.(z, F) ?? !1, L = h?.(z, F) ?? !1, Q = T && N(z);
+    return /* @__PURE__ */ i(
       "li",
       {
         ...o ? {
@@ -4261,7 +4349,7 @@ function Gn({
             ae.key !== "Enter" && ae.key !== " " || (ae.preventDefault(), o(z, F));
           }
         } : {},
-        className: i(
+        className: c(
           "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",
@@ -4270,14 +4358,14 @@ function Gn({
           // 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.
-          B || Q ? "bg-accent-soft text-text" : M ? i("bg-surface-unread", o && "hover:bg-surface-unread-hover") : o && "hover:bg-surface-hover",
+          B || Q ? "bg-accent-soft text-text" : M ? c("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"
         ),
         children: [
-          $ && /* @__PURE__ */ e("span", { onClick: (ae) => ae.stopPropagation(), children: /* @__PURE__ */ e(
+          T && /* @__PURE__ */ e("span", { onClick: (ae) => ae.stopPropagation(), children: /* @__PURE__ */ e(
             ye,
             {
               checked: N(z),
@@ -4301,7 +4389,7 @@ function Gn({
     );
   }, _ = (() => {
     if (!m)
-      return t.map((B, M) => T(B, M, M === 0));
+      return t.map((B, M) => $(B, M, M === 0));
     const z = /* @__PURE__ */ new Map();
     t.forEach((B, M) => {
       const L = m(B, M);
@@ -4316,7 +4404,7 @@ function Gn({
         "li",
         {
           onClick: g ? () => u((he) => ({ ...he, [B.id]: !he[B.id] })) : void 0,
-          className: i(
+          className: c(
             // 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.
@@ -4328,12 +4416,12 @@ function Gn({
           ),
           "aria-expanded": g ? !Q : void 0,
           style: w ? { top: V ? 28 : 0 } : void 0,
-          children: p ? p(B, L.map((he) => he.item)) : /* @__PURE__ */ c(ke, { children: [
+          children: p ? p(B, L.map((he) => he.item)) : /* @__PURE__ */ i(ke, { children: [
             g && /* @__PURE__ */ e(
               $e,
               {
                 "aria-hidden": !0,
-                className: i(
+                className: c(
                   "size-icon-md shrink-0 text-text-subtle transition-transform duration-fast ease-out",
                   !Q && "rotate-90"
                 )
@@ -4343,7 +4431,7 @@ function Gn({
             !x && /* @__PURE__ */ e(
               "span",
               {
-                className: i(
+                className: c(
                   "rounded-full px-2 text-xs font-normal tabular-nums",
                   B.tone === "danger" ? "bg-danger-soft text-danger-fg" : "bg-surface-sunk text-text-subtle"
                 ),
@@ -4357,16 +4445,16 @@ function Gn({
       return Q ? [ge] : [
         ge,
         ...L.map(
-          ({ item: he, index: De }, S) => T(he, De, S === 0)
+          ({ item: he, index: Ae }, S) => $(he, Ae, S === 0)
         )
       ];
     });
   })();
-  return /* @__PURE__ */ c("div", { ref: E, className: ee, onKeyDown: o ? y : void 0, children: [
-    J && /* @__PURE__ */ c(
+  return /* @__PURE__ */ i("div", { ref: E, className: ee, onKeyDown: o ? y : void 0, children: [
+    J && /* @__PURE__ */ i(
       "div",
       {
-        className: i(
+        className: c(
           // h-row-sm keeps the strip exactly 28px, which is the offset the
           // sticky group headers park against.
           "flex h-row-sm items-end gap-3 border-b border-border bg-surface px-5 pb-2",
@@ -4374,11 +4462,11 @@ function Gn({
           V && "sticky top-0 z-20"
         ),
         children: [
-          $ && /* @__PURE__ */ e("span", { className: "flex items-center", children: /* @__PURE__ */ e(
+          T && /* @__PURE__ */ e("span", { className: "flex items-center", children: /* @__PURE__ */ e(
             ye,
             {
               checked: X,
-              indeterminate: I,
+              indeterminate: P,
               onChange: (z) => se(z.target.checked),
               "aria-label": "Alles selecteren"
             }
@@ -4388,8 +4476,8 @@ function Gn({
       }
     ),
     /* @__PURE__ */ e("ul", { "aria-label": ie, className: "flex flex-col", children: _ }),
-    $ && C.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: [
+    T && C.length > 0 && /* @__PURE__ */ e("div", { className: "pointer-events-none sticky bottom-0 z-10 flex justify-center px-5 pb-4", children: /* @__PURE__ */ i("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__ */ i("span", { className: "text-sm font-medium", children: [
         C.length,
         " geselecteerd"
       ] }),
@@ -4409,7 +4497,7 @@ function Gn({
     ] }) })
   ] });
 }
-function Jn({
+function ls({
   side: t,
   continued: r = !1,
   tone: n = "default",
@@ -4419,7 +4507,7 @@ function Jn({
   return /* @__PURE__ */ e(
     "div",
     {
-      className: i(
+      className: c(
         // A bubble never spans the whole column; it narrows further from md,
         // where the thread itself is wide enough for the difference to matter.
         // No shadow: a bubble is an inner card, and inner cards separate
@@ -4446,18 +4534,18 @@ function Jn({
     }
   );
 }
-const Gr = {
+const nn = {
   default: "text-text",
   urgent: "text-danger-fg",
   success: "text-success-fg"
 };
-function Yn({ 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", Gr[n]), children: t }),
+function os({ value: t, label: r, tone: n = "default", className: s, ...a }) {
+  return /* @__PURE__ */ i("div", { className: c("rounded-xl bg-editor px-4 py-3.5", s), ...a, children: [
+    /* @__PURE__ */ e("div", { className: c("text-2xl font-semibold", nn[n]), children: t }),
     /* @__PURE__ */ e("div", { className: "pt-0.5 text-xs text-text-muted", children: r })
   ] });
 }
-const Xn = ({
+const cs = ({
   surface: t = !1,
   title: r,
   subtitle: n,
@@ -4477,17 +4565,17 @@ const Xn = ({
   }, [r]), G(() => {
     b && x.current && (x.current.focus(), x.current.select());
   }, [b]);
-  const $ = () => {
+  const T = () => {
     h && p(!0);
   }, C = () => {
     p(!1), w.trim() !== "" && w !== r && m ? m(w.trim()) : g(r);
   }, q = (D) => {
     D.key === "Enter" ? x.current?.blur() : D.key === "Escape" && (g(r), p(!1));
   };
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: i(
+      className: c(
         "px-5 pt-4 pb-2.5",
         // Inside the content card the header shares the card's surface; the
         // rule is the only thing that still closes it off. `surface` therefore
@@ -4497,12 +4585,12 @@ const Xn = ({
         o
       ),
       children: [
-        /* @__PURE__ */ c("div", { className: "flex flex-row sm:items-start sm:justify-between items-center gap-4", children: [
-          /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ c("div", { className: "flex items-start gap-4 text-text", children: [
+        /* @__PURE__ */ i("div", { className: "flex flex-row sm:items-start sm:justify-between items-center gap-4", children: [
+          /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ i("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(le, { variant: "ghost", onClick: v, leftIcon: /* @__PURE__ */ e(Z, { icon: Ce, size: "md" }), iconOnly: !0 }),
-            /* @__PURE__ */ c("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ i("div", { className: "min-w-0 flex-1", children: [
               b ? /* @__PURE__ */ e(
                 "input",
                 {
@@ -4514,12 +4602,12 @@ const Xn = ({
                   onKeyDown: q,
                   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: [
+              ) : /* @__PURE__ */ i("div", { className: "group flex items-baseline gap-2.5 min-w-0", children: [
                 /* @__PURE__ */ e(
                   "h2",
                   {
-                    onClick: $,
-                    className: i(
+                    onClick: T,
+                    className: c(
                       "text-lg font-semibold tracking-title truncate",
                       h && "cursor-pointer"
                     ),
@@ -4529,10 +4617,10 @@ const Xn = ({
                 ),
                 n && /* @__PURE__ */ e("span", { className: "shrink-0 text-base text-text-muted truncate", children: n }),
                 h && /* @__PURE__ */ e(
-                  kt,
+                  _t,
                   {
                     size: 15,
-                    onClick: $,
+                    onClick: T,
                     className: "shrink-0 cursor-pointer text-text-muted opacity-0 group-hover:opacity-100 transition-opacity"
                   }
                 )
@@ -4544,7 +4632,7 @@ const Xn = ({
               /* @__PURE__ */ e(
                 "div",
                 {
-                  className: i(
+                  className: c(
                     "mt-1 min-w-0 text-sm text-text-subtle",
                     typeof s == "string" && "truncate"
                   ),
@@ -4555,7 +4643,7 @@ const Xn = ({
           ] }) }),
           a.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-wrap sm:flex-nowrap gap-2 sm:gap-3", children: a.map(
             (D) => D.render ? /* @__PURE__ */ e(ce.Fragment, { children: D.render() }, D.id) : D.splitOptions && D.splitOptions.length > 0 ? /* @__PURE__ */ e(
-              Ge,
+              Xe,
               {
                 label: D.label,
                 onClick: D.onClick,
@@ -4584,7 +4672,7 @@ const Xn = ({
       ]
     }
   );
-}, Jr = /<[a-z][\s\S]*>/i, Yr = [
+}, sn = /<[a-z][\s\S]*>/i, an = [
   "[&_p]:my-1.5 [&_p:first-child]:mt-0 [&_p:last-child]:mb-0 [&_p]:leading-relaxed",
   "[&_a]:text-accent [&_a]:underline [&_a]:underline-offset-2",
   "[&_strong]:font-semibold [&_em]:italic",
@@ -4599,7 +4687,7 @@ const Xn = ({
   "[&_table]:my-1.5 [&_table]:w-full [&_table]:border-collapse [&_table]:text-xs",
   "[&_th]:border [&_th]:border-border [&_th]:px-2 [&_th]:py-1 [&_th]:text-left [&_th]:font-semibold",
   "[&_td]:border [&_td]:border-border [&_td]:px-2 [&_td]:py-1"
-].join(" "), Xr = {
+].join(" "), ln = {
   p: (t) => /* @__PURE__ */ e("p", { className: "my-1.5 leading-relaxed first:mt-0 last:mb-0", ...t }),
   a: (t) => /* @__PURE__ */ e("a", { className: "text-accent underline underline-offset-2 hover:opacity-80", target: "_blank", rel: "noopener noreferrer", ...t }),
   strong: (t) => /* @__PURE__ */ e("strong", { className: "font-semibold", ...t }),
@@ -4622,35 +4710,35 @@ const Xn = ({
   th: (t) => /* @__PURE__ */ e("th", { className: "border border-border px-2 py-1 text-left font-semibold", ...t }),
   td: (t) => /* @__PURE__ */ e("td", { className: "border border-border px-2 py-1", ...t })
 };
-function Zn({ text: t, className: r, as: n }) {
+function is({ text: t, className: r, as: n }) {
   const s = t ?? "";
-  return (n ? n === "html" : Jr.test(s)) ? /* @__PURE__ */ e(
+  return (n ? n === "html" : sn.test(s)) ? /* @__PURE__ */ e(
     "div",
     {
-      className: i("break-words", Yr, r),
-      dangerouslySetInnerHTML: { __html: $t.sanitize(s, { ADD_ATTR: ["target", "rel"] }) }
+      className: c("break-words", an, r),
+      dangerouslySetInnerHTML: { __html: At.sanitize(s, { ADD_ATTR: ["target", "rel"] }) }
     }
-  ) : /* @__PURE__ */ e("div", { className: i("break-words", r), children: /* @__PURE__ */ e(Tt, { remarkPlugins: [_t], components: Xr, children: s }) });
+  ) : /* @__PURE__ */ e("div", { className: c("break-words", r), children: /* @__PURE__ */ e(Lt, { remarkPlugins: [It], components: ln, children: s }) });
 }
-const Qn = ({ label: t, meta: r, action: n, className: s }) => /* @__PURE__ */ c("div", { className: i("flex items-center gap-2 px-1 pb-2 pt-7 first:pt-0", s), children: [
+const ds = ({ label: t, meta: r, action: n, className: s }) => /* @__PURE__ */ i("div", { className: c("flex items-center gap-2 px-1 pb-2 pt-7 first:pt-0", s), children: [
   /* @__PURE__ */ e("span", { className: "shrink-0 text-2xs font-semibold uppercase tracking-label text-text-subtle", children: t }),
   r && /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate text-right text-xs tabular-nums text-text-subtle", children: r }),
   n && /* @__PURE__ */ e("span", { className: "ml-auto shrink-0", children: n })
 ] });
-function es({ label: t, trailing: r, align: n = "center", className: s }) {
+function us({ label: t, trailing: r, align: n = "center", className: s }) {
   const a = /* @__PURE__ */ e("span", { className: "h-px flex-1 bg-border-subtle", "aria-hidden": !0 });
-  return !t && !r ? /* @__PURE__ */ e("div", { className: i("flex items-center py-2", s), children: a }) : /* @__PURE__ */ c("div", { className: i("flex items-center gap-3 py-2", s), children: [
+  return !t && !r ? /* @__PURE__ */ e("div", { className: c("flex items-center py-2", s), children: a }) : /* @__PURE__ */ i("div", { className: c("flex items-center gap-3 py-2", s), children: [
     n === "center" && a,
     /* @__PURE__ */ e("span", { className: "shrink-0 text-xs font-medium text-text-muted", children: t }),
     a,
     r && /* @__PURE__ */ e("span", { className: "shrink-0", children: r })
   ] });
 }
-const tt = We(null), ts = tt.Provider;
-function Zr() {
-  return zt(tt);
+const st = Ke(null), ms = st.Provider;
+function on() {
+  return ut(st);
 }
-function rs() {
+function fs() {
   const [t, r] = O(null), n = pe(
     () => ({
       setTrail: (s, a) => r((l) => a ? { ownerId: s, entry: a } : l && l.ownerId !== s ? l : null)
@@ -4659,13 +4747,13 @@ function rs() {
   );
   return { trail: t?.entry ?? null, api: n };
 }
-const Qr = {
+const cn = {
   none: "",
   sm: "px-3 py-3",
   // Matches the frame header's own horizontal padding, so content lines up
   // with the title above it.
   md: "px-5 py-4"
-}, ns = ({
+}, hs = ({
   children: t,
   actions: r = [],
   secondaryActions: n = [],
@@ -4678,7 +4766,7 @@ const Qr = {
   className: v,
   contentClassName: h
 }) => {
-  const m = Zr(), b = Et(), p = ne(s);
+  const m = on(), b = dt(), p = ne(s);
   p.current = s;
   const w = !!s;
   G(() => {
@@ -4696,8 +4784,8 @@ const Qr = {
      * panel that has not been migrated yet. This way a short page still drops
      * 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", v), children: [
-      !m && (w || l) && /* @__PURE__ */ c("div", { className: "flex shrink-0 items-center gap-2 px-5 pt-4", children: [
+    /* @__PURE__ */ i("div", { className: c("flex min-h-full flex-col", v), children: [
+      !m && (w || l) && /* @__PURE__ */ i("div", { className: "flex shrink-0 items-center gap-2 px-5 pt-4", children: [
         w && /* @__PURE__ */ e(
           le,
           {
@@ -4710,15 +4798,15 @@ const Qr = {
         ),
         l && /* @__PURE__ */ e("h2", { className: "min-w-0 truncate text-md font-semibold tracking-title text-text", children: l })
       ] }),
-      /* @__PURE__ */ e("div", { className: i("flex-1", Qr[d], h), children: o ? /* @__PURE__ */ e(et, { variant: "inline", shape: f }) : t }),
-      g && /* @__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(ze, { actions: n, defaultVariant: "ghost" }),
-        r.length > 0 && /* @__PURE__ */ e(ze, { actions: r, className: "ml-auto" })
+      /* @__PURE__ */ e("div", { className: c("flex-1", cn[d], h), children: o ? /* @__PURE__ */ e(nt, { variant: "inline", shape: f }) : t }),
+      g && /* @__PURE__ */ i("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(Me, { actions: n, defaultVariant: "ghost" }),
+        r.length > 0 && /* @__PURE__ */ e(Me, { actions: r, className: "ml-auto" })
       ] })
     ] })
   );
 };
-function ss({
+function xs({
   label: t,
   description: r,
   control: n,
@@ -4726,17 +4814,17 @@ function ss({
   disabled: a = !1,
   className: l
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: i(
+      className: c(
         "flex items-center justify-between gap-4 py-2",
         s && "rounded-lg border border-border px-3",
         a && "opacity-50",
         l
       ),
       children: [
-        /* @__PURE__ */ c("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ i("div", { className: "min-w-0", children: [
           /* @__PURE__ */ e("div", { className: "text-sm text-text", children: t }),
           r && /* @__PURE__ */ e("div", { className: "text-xs text-text-muted", children: r })
         ] }),
@@ -4745,7 +4833,7 @@ function ss({
     }
   );
 }
-function as({
+function bs({
   icon: t,
   title: r,
   description: n,
@@ -4753,37 +4841,37 @@ function as({
   children: a,
   className: l
 }) {
-  return /* @__PURE__ */ c("section", { className: i("flex flex-col gap-2", l), children: [
-    /* @__PURE__ */ c("div", { className: "flex items-start gap-2", children: [
+  return /* @__PURE__ */ i("section", { className: c("flex flex-col gap-2", l), children: [
+    /* @__PURE__ */ i("div", { className: "flex items-start gap-2", children: [
       t && /* @__PURE__ */ e(Z, { icon: t, size: "md", color: "secondary", className: "mt-0.5" }),
-      /* @__PURE__ */ c("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ i("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 })
       ] }),
       s && /* @__PURE__ */ e("div", { className: "shrink-0", children: s })
     ] }),
-    /* @__PURE__ */ e("div", { className: i("flex flex-col", t && "pl-6"), children: a })
+    /* @__PURE__ */ e("div", { className: c("flex flex-col", t && "pl-6"), children: a })
   ] });
 }
-function ls({ label: t, dotColor: r, onClick: n, className: s }) {
-  return /* @__PURE__ */ c(
+function gs({ label: t, dotColor: r, onClick: n, className: s }) {
+  return /* @__PURE__ */ i(
     "button",
     {
       type: "button",
       onClick: n,
-      className: i(
+      className: c(
         "inline-flex max-w-full items-center gap-1.5 rounded-full bg-surface-sunk px-2.5 py-1 text-xs text-text-muted transition-colors duration-fast ease-out hover:bg-surface-hover hover:text-text",
         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(Z, { icon: Ct, size: "xs", className: "opacity-70" })
+        /* @__PURE__ */ e(Z, { icon: Dt, size: "xs", className: "opacity-70" })
       ]
     }
   );
 }
-function en(t) {
+function dn(t) {
   const { id: r, header: n, accessor: s, label: a, tone: l, visible: o, width: f, sortable: d, align: v } = t;
   return {
     id: r,
@@ -4791,14 +4879,14 @@ function en(t) {
     accessor: (h) => a(s(h), h),
     cell: (h, m) => {
       const b = s(m);
-      return o && !o(b, m) ? null : /* @__PURE__ */ e(Dr, { variant: l ? l(b, m) : "default", size: "sm", children: a(b, m) });
+      return o && !o(b, m) ? null : /* @__PURE__ */ e(Rr, { variant: l ? l(b, m) : "default", size: "sm", children: a(b, m) });
     },
     width: f,
     sortable: d,
     align: v
   };
 }
-function os(t) {
+function ps(t) {
   const {
     id: r,
     header: n,
@@ -4810,7 +4898,7 @@ function os(t) {
     width: d,
     sortable: v
   } = t;
-  return en({
+  return dn({
     id: r,
     header: n,
     accessor: (h) => !!s(h),
@@ -4820,7 +4908,7 @@ function os(t) {
     sortable: v
   });
 }
-function cs(t) {
+function vs(t) {
   const {
     id: r,
     header: n,
@@ -4844,13 +4932,13 @@ function cs(t) {
     sortable: v
   };
 }
-function tn(t, r) {
+function un(t, r) {
   return r.split(".").reduce(
     (n, s) => n && typeof n == "object" && s in n ? n[s] : void 0,
     t
   );
 }
-const is = ({
+const ys = ({
   groups: t,
   data: r,
   size: n = "md",
@@ -4873,7 +4961,7 @@ const is = ({
     return b ? b.label : String(h || "-");
   }, f = xe(
     (h) => {
-      const m = tn(r, h.name);
+      const m = un(r, h.name);
       if (h.type === "array") {
         const p = m;
         return !p || p.length === 0 ? /* @__PURE__ */ e(
@@ -4884,12 +4972,12 @@ const is = ({
             className: "text-text-muted",
             children: "Geen items"
           }
-        ) : /* @__PURE__ */ e("div", { className: "space-y-3", children: p.map((w, g) => /* @__PURE__ */ c(
+        ) : /* @__PURE__ */ e("div", { className: "space-y-3", children: p.map((w, g) => /* @__PURE__ */ i(
           "div",
           {
             className: "p-4 border border-border rounded-xl space-y-3",
             children: [
-              /* @__PURE__ */ e("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ c(
+              /* @__PURE__ */ e("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ i(
                 fe,
                 {
                   variant: "label",
@@ -4904,7 +4992,7 @@ const is = ({
                 }
               ) }),
               /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: h.arrayFields?.map((x) => {
-                const $ = w?.[x.name];
+                const T = w?.[x.name];
                 let C = "-";
                 switch (x.type) {
                   case "text":
@@ -4913,30 +5001,30 @@ const is = ({
                   case "tel":
                   case "url":
                   case "textarea":
-                    C = $ || "-";
+                    C = T || "-";
                     break;
                   case "select":
                   case "radio":
                     C = o(
-                      $,
+                      T,
                       x.options
                     );
                     break;
                   case "checkbox":
-                    C = l($);
+                    C = l(T);
                     break;
                   case "date":
-                    C = a($);
+                    C = a(T);
                     break;
                   case "custom":
                     C = x.customComponent?.({
-                      value: $
+                      value: T
                     });
                     break;
                   default:
-                    C = String($ || "-");
+                    C = String(T || "-");
                 }
-                return x.format && (C = x.format($, w)), /* @__PURE__ */ c("div", { className: "space-y-1", children: [
+                return x.format && (C = x.format(T, w)), /* @__PURE__ */ i("div", { className: "space-y-1", children: [
                   /* @__PURE__ */ e(
                     fe,
                     {
@@ -5019,7 +5107,7 @@ const is = ({
         return null;
       const m = h.items.filter((p) => !(p.hidden || p.conditional && !p.conditional(r)));
       if (m.length === 0) return null;
-      const b = i(
+      const b = c(
         "space-y-4",
         {
           "grid gap-4": h.layout === "grid",
@@ -5033,12 +5121,12 @@ const is = ({
         },
         h.className
       );
-      return /* @__PURE__ */ c(
+      return /* @__PURE__ */ i(
         "div",
         {
           className: "grid grid-cols-1 md:grid-cols-3 gap-8 p-6 border border-border rounded-xl",
           children: [
-            /* @__PURE__ */ c("div", { className: "md:col-span-1", children: [
+            /* @__PURE__ */ i("div", { className: "md:col-span-1", children: [
               /* @__PURE__ */ e(
                 fe,
                 {
@@ -5059,7 +5147,7 @@ const is = ({
                 }
               )
             ] }),
-            /* @__PURE__ */ e("div", { className: "md:col-span-2", children: /* @__PURE__ */ e("div", { className: b, children: m.map((p) => /* @__PURE__ */ c(
+            /* @__PURE__ */ e("div", { className: "md:col-span-2", children: /* @__PURE__ */ e("div", { className: b, children: m.map((p) => /* @__PURE__ */ i(
               "div",
               {
                 className: "space-y-1",
@@ -5088,7 +5176,7 @@ const is = ({
       );
     },
     [r, f]
-  ), v = i(
+  ), v = c(
     "space-y-6",
     {
       "max-w-md": n === "sm",
@@ -5099,14 +5187,14 @@ const is = ({
     s
   );
   return /* @__PURE__ */ e("div", { className: v, children: /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(d) }) });
-}, rn = () => /* @__PURE__ */ e(et, { variant: "inline", shape: "menu" }), rt = ({ item: t, isSelectedHandler: r, onClick: n, depth: s = 0 }) => {
+}, mn = () => /* @__PURE__ */ e(nt, { variant: "inline", shape: "menu" }), at = ({ item: t, isSelectedHandler: r, onClick: n, depth: s = 0 }) => {
   const a = !!(t.children && t.children.length > 0), l = r ? r(t.path) : !1;
   if (a)
-    return /* @__PURE__ */ c("li", { children: [
-      /* @__PURE__ */ c(
+    return /* @__PURE__ */ i("li", { children: [
+      /* @__PURE__ */ i(
         "div",
         {
-          className: i(
+          className: c(
             "flex items-center gap-2 px-2.5 pt-5 pb-2 text-2xs font-semibold uppercase tracking-label text-text-disabled"
           ),
           children: [
@@ -5116,7 +5204,7 @@ const is = ({
         }
       ),
       /* @__PURE__ */ e("ul", { className: "flex flex-col gap-px", children: t.children?.map((d, v) => /* @__PURE__ */ e(
-        rt,
+        at,
         {
           item: d,
           isSelectedHandler: r,
@@ -5127,7 +5215,7 @@ const is = ({
       )) })
     ] });
   const o = t.action, f = o?.visibility !== "always";
-  return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ c(
+  return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(
     "div",
     {
       role: "button",
@@ -5136,7 +5224,7 @@ const is = ({
       onKeyDown: (d) => {
         (d.key === "Enter" || d.key === " ") && (d.preventDefault(), t.path && n?.(t.path));
       },
-      className: i(
+      className: c(
         // De kolom ligt op de backdrop, niet op een paneel: het actieve item
         // is daarom een opliggende witte plaat, en de hover is de backdrop-
         // hover (donkerder) in plaats van de surface-hover (lichter).
@@ -5149,7 +5237,7 @@ const is = ({
         t.icon && /* @__PURE__ */ e(
           "span",
           {
-            className: i(
+            className: c(
               "flex w-5 shrink-0 items-center justify-center",
               l ? "text-text-muted" : "text-text-subtle"
             ),
@@ -5160,7 +5248,7 @@ const is = ({
         t.count !== void 0 && t.count > 0 && /* @__PURE__ */ e(
           "span",
           {
-            className: i(
+            className: c(
               "shrink-0 text-xs tabular-nums",
               l ? "rounded-full bg-accent px-1.5 font-semibold text-accent-fg" : "text-text-subtle",
               o && f && "group-hover/item:hidden group-focus-within/item:hidden"
@@ -5178,7 +5266,7 @@ const is = ({
               d.stopPropagation(), o.onClick();
             },
             onKeyDown: (d) => d.stopPropagation(),
-            className: i(
+            className: c(
               "flex size-5 shrink-0 items-center justify-center rounded-sm",
               "text-text-subtle transition-colors duration-fast ease-out",
               "hover:bg-page-hover hover:text-text",
@@ -5191,20 +5279,20 @@ const is = ({
       ]
     }
   ) });
-}, ds = ({
+}, Ns = ({
   items: t,
   isSelectedHandler: r,
   onClick: n,
   preMenuItemsComponent: s,
   loading: a = !1
-}) => a ? /* @__PURE__ */ c("nav", { className: "flex h-full min-h-0 shrink-0 flex-col", children: [
+}) => a ? /* @__PURE__ */ i("nav", { className: "flex h-full min-h-0 shrink-0 flex-col", children: [
   s && /* @__PURE__ */ e("div", { className: "pb-4", children: s }),
-  /* @__PURE__ */ e(rn, {})
-] }) : /* @__PURE__ */ c("nav", { className: "flex h-full min-h-0 shrink-0 flex-col", children: [
+  /* @__PURE__ */ e(mn, {})
+] }) : /* @__PURE__ */ i("nav", { className: "flex h-full min-h-0 shrink-0 flex-col", children: [
   s && /* @__PURE__ */ e("div", { className: "pb-4", children: s }),
   /* @__PURE__ */ e("ul", { className: "flex min-h-0 flex-1 flex-col gap-px overflow-y-auto", children: t.map(
     (l, o) => !l.path && !l.label && !l.children ? /* @__PURE__ */ e("li", { "aria-hidden": !0, className: "h-4" }, o) : /* @__PURE__ */ e(
-      rt,
+      at,
       {
         item: l,
         isSelectedHandler: r,
@@ -5213,7 +5301,7 @@ const is = ({
       o
     )
   ) })
-] }), nn = {
+] }), fn = {
   xs: "text-xs",
   sm: "text-sm",
   md: "text-base",
@@ -5222,13 +5310,13 @@ const is = ({
   "2xl": "text-2xl",
   "3xl": "text-3xl",
   "4xl": "text-3xl"
-}, sn = {
+}, hn = {
   light: "font-normal",
   normal: "font-normal",
   medium: "font-medium",
   semibold: "font-semibold",
   bold: "font-bold"
-}, an = {
+}, xn = {
   primary: "text-text",
   secondary: "text-text-muted",
   accent: "text-accent",
@@ -5238,11 +5326,11 @@ const is = ({
   info: "text-info-fg",
   neutral: "text-text",
   current: "text-current"
-}, ln = {
+}, bn = {
   left: "text-left",
   center: "text-center",
   right: "text-right"
-}, us = ({
+}, ws = ({
   level: t = 1,
   size: r,
   weight: n = "semibold",
@@ -5253,18 +5341,18 @@ const is = ({
   children: f,
   ...d
 }) => {
-  const v = `h${t}`, h = i(
+  const v = `h${t}`, h = c(
     "font-sans text-pretty",
-    nn[r || on(t)],
-    sn[n],
-    an[s],
-    ln[a],
+    fn[r || gn(t)],
+    hn[n],
+    xn[s],
+    bn[a],
     l && "truncate",
     o
   );
   return /* @__PURE__ */ e(v, { className: h, ...d, children: f });
 };
-function on(t) {
+function gn(t) {
   return {
     1: "2xl",
     2: "xl",
@@ -5274,7 +5362,7 @@ function on(t) {
     6: "md"
   }[t] || "md";
 }
-const ms = ({
+const ks = ({
   commands: t,
   isOpen: r,
   onClose: n,
@@ -5288,19 +5376,19 @@ const ms = ({
   return G(() => {
     r || (f(""), v(a || []), m(l || 0));
   }, [r]), G(() => {
-    const x = ($) => {
+    const x = (T) => {
       if (r) {
-        if ($.key === "Escape")
+        if (T.key === "Escape")
           n();
-        else if ($.key === "ArrowUp")
+        else if (T.key === "ArrowUp")
           m(
             (C) => C > 0 ? C - 1 : g.length - 1
           );
-        else if ($.key === "ArrowDown")
+        else if (T.key === "ArrowDown")
           m(
             (C) => C < g.length - 1 ? C + 1 : 0
           );
-        else if ($.key === "Enter") {
+        else if (T.key === "Enter") {
           const C = g[h];
           C && (C.subCommands ? (v([...d, C.id]), m(0)) : C.action && (C.action(), n()));
         }
@@ -5308,21 +5396,21 @@ const ms = ({
     };
     return document.addEventListener("keydown", x), () => document.removeEventListener("keydown", x);
   }, [r, n, g, h, d]), G(() => {
-    const x = ($) => {
-      b.current && !b.current.contains($.target) && n();
+    const x = (T) => {
+      b.current && !b.current.contains(T.target) && n();
     };
     return r && document.addEventListener("mousedown", x), () => document.removeEventListener("mousedown", x);
   }, [r, n]), G(() => {
     if (!r) return;
     p.current?.querySelector(`[data-index="${h}"]`)?.scrollIntoView({ block: "nearest" });
-  }, [h, r]), r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 z-modal flex items-center justify-center bg-scrim", children: /* @__PURE__ */ c(
+  }, [h, r]), r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 z-modal flex items-center justify-center bg-scrim", children: /* @__PURE__ */ i(
     "div",
     {
       className: "flex flex-col w-full max-w-lg max-h-dialog p-2 mx-auto rounded-lg border border-border shadow-modal bg-surface",
       ref: b,
       children: [
-        /* @__PURE__ */ c("div", { className: "flex items-center gap-2 px-3 flex-shrink-0", children: [
-          /* @__PURE__ */ e(Te, { className: "w-4 h-4 text-text-muted shrink-0" }),
+        /* @__PURE__ */ i("div", { className: "flex items-center gap-2 px-3 flex-shrink-0", children: [
+          /* @__PURE__ */ e(_e, { className: "w-4 h-4 text-text-muted shrink-0" }),
           /* @__PURE__ */ e(
             "input",
             {
@@ -5335,22 +5423,22 @@ const ms = ({
             }
           )
         ] }),
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ i(
           "div",
           {
             ref: p,
             className: "mt-2 pt-2 text-sm border-t border-border max-h-dialog-list overflow-y-auto",
             children: [
               g.length === 0 && /* @__PURE__ */ e("div", { className: "text-text-muted text-center text-sm", children: s?.noCommandsFound || "No commands found" }),
-              g.map((x, $) => /* @__PURE__ */ c(
+              g.map((x, T) => /* @__PURE__ */ i(
                 "div",
                 {
-                  "data-index": $,
-                  className: `flex items-center p-2 cursor-pointer rounded-md ${$ === h ? "bg-accent-soft text-accent" : "text-text"}`,
+                  "data-index": T,
+                  className: `flex items-center p-2 cursor-pointer rounded-md ${T === h ? "bg-accent-soft text-accent" : "text-text"}`,
                   onClick: () => {
                     x.subCommands ? (v([...d, x.id]), m(0)) : x.action && (x.action(), n());
                   },
-                  onMouseEnter: () => m($),
+                  onMouseEnter: () => m(T),
                   children: [
                     x.icon && /* @__PURE__ */ e("span", { className: "mr-3", children: x.icon }),
                     /* @__PURE__ */ e("span", { className: "flex-grow", children: x.label }),
@@ -5362,16 +5450,16 @@ const ms = ({
             ]
           }
         ),
-        /* @__PURE__ */ c("div", { className: "flex items-center gap-4 px-3 pt-2 mt-2 text-xs text-text-muted border-t border-border", children: [
-          /* @__PURE__ */ c("span", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ i("div", { className: "flex items-center gap-4 px-3 pt-2 mt-2 text-xs text-text-muted border-t border-border", children: [
+          /* @__PURE__ */ i("span", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ e("kbd", { className: "inline-flex items-center justify-center min-w-5 px-1 py-0.5 rounded border border-border bg-surface-sunk text-xs font-medium not-italic", children: "↑↓" }),
             s?.navigate || "to navigate"
           ] }),
-          /* @__PURE__ */ c("span", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ i("span", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ e("kbd", { className: "inline-flex items-center justify-center min-w-5 px-1 py-0.5 rounded border border-border bg-surface-sunk text-xs font-medium not-italic", children: "↵" }),
             s?.select || "to select"
           ] }),
-          /* @__PURE__ */ c("span", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ i("span", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ e("kbd", { className: "inline-flex items-center justify-center min-w-5 px-1 py-0.5 rounded border border-border bg-surface-sunk text-xs font-medium not-italic", children: "Esc" }),
             s?.close || "to close"
           ] })
@@ -5379,7 +5467,7 @@ const ms = ({
       ]
     }
   ) }) : null;
-}, cn = {
+}, pn = {
   none: "p-0",
   xs: "p-1",
   sm: "p-2",
@@ -5387,7 +5475,7 @@ const ms = ({
   lg: "p-6",
   xl: "p-8",
   "2xl": "p-12"
-}, dn = {
+}, vn = {
   none: "m-0",
   xs: "m-1",
   sm: "m-2",
@@ -5395,7 +5483,7 @@ const ms = ({
   lg: "m-6",
   xl: "m-8",
   "2xl": "m-12"
-}, un = {
+}, yn = {
   none: "",
   primary: "bg-accent text-accent-fg",
   secondary: "bg-surface-hover",
@@ -5411,26 +5499,26 @@ const ms = ({
   backdrop: "bg-page",
   editor: "bg-surface",
   input: "bg-surface-input"
-}, mn = {
+}, Nn = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   xl: "rounded-xl",
   full: "rounded-full"
-}, fn = {
+}, wn = {
   none: "shadow-none",
   sm: "shadow-none",
   md: "shadow-overlay",
   lg: "shadow-overlay",
   xl: "shadow-modal",
   "2xl": "shadow-modal"
-}, hn = {
+}, kn = {
   none: "border-0",
   sm: "border",
   md: "border-2",
   lg: "border-4"
-}, xn = {
+}, Cn = {
   primary: "border-accent-border",
   secondary: "border-border",
   accent: "border-accent-border",
@@ -5440,7 +5528,7 @@ const ms = ({
   info: "border-info-border",
   neutral: "border-border-subtle",
   white: "border-border-subtle"
-}, nt = be(
+}, lt = be(
   ({
     padding: t,
     margin: r,
@@ -5456,14 +5544,14 @@ const ms = ({
     "div",
     {
       ref: h,
-      className: i(
-        t && cn[t],
-        r && dn[r],
-        n && un[n],
-        s && mn[s],
-        a && fn[a],
-        l && hn[l],
-        o && xn[o],
+      className: c(
+        t && pn[t],
+        r && vn[r],
+        n && yn[n],
+        s && Nn[s],
+        a && wn[a],
+        l && kn[l],
+        o && Cn[o],
         f
       ),
       ...v,
@@ -5471,9 +5559,9 @@ const ms = ({
     }
   )
 );
-nt.displayName = "Box";
-const fs = ({ children: t, title: r, ...n }) => /* @__PURE__ */ c(
-  nt,
+lt.displayName = "Box";
+const Cs = ({ children: t, title: r, ...n }) => /* @__PURE__ */ i(
+  lt,
   {
     background: "module",
     radius: "lg",
@@ -5487,7 +5575,7 @@ const fs = ({ children: t, title: r, ...n }) => /* @__PURE__ */ c(
     ]
   }
 );
-function hs({
+function Ss({
   identifier: t,
   resourceLoader: r,
   framework: n = "react",
@@ -5521,25 +5609,25 @@ function hs({
     const x = f.current;
     if (x) {
       if (n === "svelte") {
-        const $ = b.default || b, C = new $({ target: x, props: l || {} });
+        const T = b.default || b, C = new T({ target: x, props: l || {} });
         return w.current = C, () => C.$destroy();
       }
       if (b.mount) {
-        const $ = b.mount({ container: x, props: l || {} });
+        const T = b.mount({ container: x, props: l || {} });
         return () => {
-          typeof $ == "function" ? $() : b.unmount?.(x);
+          typeof T == "function" ? T() : b.unmount?.(x);
         };
       }
     }
   }, [b, n, d]), G(() => {
     n === "svelte" && w.current && w.current.$set?.(l);
-  }, [l, n]), /* @__PURE__ */ c("div", { ref: f, className: o, style: { display: "contents" }, children: [
+  }, [l, n]), /* @__PURE__ */ i("div", { ref: f, className: o, style: { display: "contents" }, children: [
     d && s,
     !d && h && a,
     n === "react" && !h && b && /* @__PURE__ */ e(b, { ...l })
   ] });
 }
-class xs extends Mt {
+class Es extends mt {
   constructor() {
     super(...arguments), this.state = {
       hasError: !1,
@@ -5553,7 +5641,7 @@ class xs extends Mt {
     console.error(`[ErrorBoundary] Error in ${this.props.name || "Component"}:`, r, n);
   }
   render() {
-    return this.state.hasError ? this.props.fallback ? this.props.fallback : /* @__PURE__ */ c("div", { className: "p-4 m-4 border border-danger-border bg-danger-soft rounded-lg", children: [
+    return this.state.hasError ? this.props.fallback ? this.props.fallback : /* @__PURE__ */ i("div", { className: "p-4 m-4 border border-danger-border bg-danger-soft rounded-lg", children: [
       /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-danger-fg", children: "Something went wrong" }),
       /* @__PURE__ */ e("p", { className: "text-sm text-danger-fg mt-1", children: this.props.name ? `Error in ${this.props.name}` : "The component failed to render." }),
       /* @__PURE__ */ e(
@@ -5568,82 +5656,89 @@ class xs extends Mt {
   }
 }
 export {
-  Vn as AssistantCard,
-  Ur as Avatar,
-  qn as AvatarStack,
-  Dr as Badge,
-  nt as Box,
+  es as AssistantCard,
+  en as Avatar,
+  ts as AvatarStack,
+  Rr as Badge,
+  lt as Box,
   le as Button,
-  $n as ButtonGroup,
-  fs as Card,
-  Un as ChannelBadge,
+  Fn as ButtonGroup,
+  Cs as Card,
+  rs as ChannelBadge,
   ye as Checkbox,
-  ms as CommandPalette,
-  In as ConfirmDialog,
-  et as ContentLoading,
+  ks as CommandPalette,
+  Kn as ConfirmDialog,
+  nt as ContentLoading,
   Pe as DatePicker,
-  cr as Dropdown,
-  jn as EmptyState,
-  xs as ErrorBoundary,
-  hs as FederatedResource,
-  Bt as FilterChip,
-  rr as FolderSelect,
-  Pn as Form,
-  Mr as FormSection,
-  us as Heading,
+  br as Dropdown,
+  Gn as EmptyState,
+  Es as ErrorBoundary,
+  Ss as FederatedResource,
+  Gt as FilterChip,
+  dr as FolderSelect,
+  Wn as Form,
+  jr as FormSection,
+  ws as Heading,
+  Pt as IDENTITY_TONE_COUNT,
   Z as Icon,
-  Wn as Image,
-  On as Kbd,
-  Yn as KpiCard,
-  Tn as Link,
-  Gn as List,
-  Kn as ListBulkAction,
-  En as MeetingGrid,
-  Jn as MessageBubble,
-  Qe as Modal,
-  Xn as PageHeader,
-  _n as PageToolbar,
-  ze as PageToolbarActions,
-  zn as ParticipantTile,
-  Ke as Popover,
-  Fn as ProgressBar,
-  Zn as RichText,
-  Ze as SearchField,
-  lr as SearchableTextField,
-  Qn as SectionCaption,
-  es as SectionDivider,
-  Ut as SegmentedToggle,
-  Ee as Select,
-  ts as SettingsFrameProvider,
-  ns as SettingsPage,
-  ss as SettingsRow,
-  as as SettingsSection,
-  ds as SidebarMenu,
-  ls as SourceChip,
-  Bn as Spinner,
-  Ge as SplitButton,
-  Rn as StatusDot,
-  Hn as StepIndicator,
-  Cr as StorageInput,
-  or as Switch,
-  Ln as TabBar,
-  He as Table,
-  br as Tabs,
+  ns as Image,
+  Jn as Kbd,
+  os as KpiCard,
+  Rn as Link,
+  as as List,
+  ss as ListBulkAction,
+  Pn as MeetingGrid,
+  ls as MessageBubble,
+  rt as Modal,
+  cs as PageHeader,
+  Hn as PageToolbar,
+  Me as PageToolbarActions,
+  jn as ParticipantTile,
+  Ye as Popover,
+  Yn as ProgressBar,
+  is as RichText,
+  tt as SearchField,
+  hr as SearchableTextField,
+  ds as SectionCaption,
+  us as SectionDivider,
+  Qt as SegmentedToggle,
+  ze as Select,
+  ms as SettingsFrameProvider,
+  hs as SettingsPage,
+  xs as SettingsRow,
+  bs as SettingsSection,
+  Ns as SidebarMenu,
+  gs as SourceChip,
+  Xn as Spinner,
+  Xe as SplitButton,
+  Zn as StatusDot,
+  Qn as StepIndicator,
+  Dr as StorageInput,
+  xr as Switch,
+  Un as TabBar,
+  Ve as Table,
+  Cr as Tabs,
   fe as Text,
-  Ie as TextArea,
+  je as TextArea,
   Ne as TextField,
-  Mn as VideoSurface,
-  is as View,
-  en as badgeColumn,
-  os as booleanBadgeColumn,
-  Sn as catTone,
-  i as cn,
-  Cn as createSizes,
-  kn as createVariants,
-  Dn as dateFilterHandler,
-  cs as labelsColumn,
-  An as selectFilterHandler,
-  Zr as useSettingsFrame,
-  rs as useSettingsFrameHost
+  On as VideoSurface,
+  ys as View,
+  qe as autofillProps,
+  dn as badgeColumn,
+  ps as booleanBadgeColumn,
+  In as catTone,
+  c as cn,
+  An as createSizes,
+  Dn as createVariants,
+  Vn as dateFilterHandler,
+  Ln as identityDotClass,
+  Je as identityPlateClass,
+  Ge as identityTone,
+  vs as labelsColumn,
+  Bn as resolveLucideIcon,
+  qn as selectFilterHandler,
+  De as useAnchoredPosition,
+  on as useSettingsFrame,
+  fs as useSettingsFrameHost
 };
 //# sourceMappingURL=index.js.map