@opencxh/ui-kit 3.57.7 → 3.57.9

package/dist/index.js

@@ -1,8 +1,8 @@
 import { clsx as Ie } from "clsx";
-import { jsxs as i, jsx as e, Fragment as Ee } from "react/jsx-runtime";
-import { VideoOff as je, User as Be, MicOff as Pe, Mic as _e, ChevronDown as Oe, FileText as pe, HardDrive as ke, X as Ve, ArrowLeft as we, Search as $e, FolderPlus as Fe, Upload as We, Folder as Ce, Pencil as Re, ChevronDownIcon as qe, ChevronRight as He } from "lucide-react";
-import se, { useRef as X, useEffect as G, forwardRef as ce, useState as V, useCallback as ne, useMemo as de, createContext as Ue, Component as Ge } from "react";
-function b(...t) {
+import { jsxs as d, jsx as e, Fragment as Ee } from "react/jsx-runtime";
+import { VideoOff as je, User as Be, MicOff as Pe, Mic as _e, ChevronDown as Oe, FileText as pe, HardDrive as ke, X as Ve, ArrowLeft as we, Search as $e, FolderPlus as Fe, Upload as We, Folder as Ce, Pencil as Re, ChevronDownIcon as He, ChevronRight as qe } from "lucide-react";
+import se, { useRef as X, useEffect as K, forwardRef as ce, useState as V, useCallback as ae, useMemo as de, createContext as Ue, Component as Ge } from "react";
+function x(...t) {
   return Ie(t);
 }
 function Kt(t) {
@@ -13,12 +13,12 @@ function Jt(t) {
 }
 function Yt({ tiles: t, pinned: a, className: r }) {
   if (a)
-    return /* @__PURE__ */ i("div", { className: b("flex flex-col md:flex-row gap-2 h-full", r), children: [
+    return /* @__PURE__ */ d("div", { className: x("flex flex-col md:flex-row gap-2 h-full", r), children: [
       /* @__PURE__ */ e("div", { className: "flex-1 min-h-[240px]", children: a }),
       t.length > 0 && /* @__PURE__ */ e("div", { className: "flex md:flex-col gap-2 md:w-48 overflow-auto", children: t.map((s, c) => /* @__PURE__ */ e("div", { className: "min-w-[160px] md:min-w-0", children: s }, c)) })
     ] });
   const n = 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: b("grid gap-2 h-full", n, r), children: t.map((s, c) => /* @__PURE__ */ e("div", { children: s }, c)) });
+  return /* @__PURE__ */ e("div", { className: x("grid gap-2 h-full", n, r), children: t.map((s, c) => /* @__PURE__ */ e("div", { children: s }, c)) });
 }
 function Zt({
   name: t,
@@ -29,17 +29,17 @@ function Zt({
   videoSlot: c,
   className: f
 }) {
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: b(
+      className: x(
         "relative rounded-lg overflow-hidden bg-gray-800 aspect-video flex items-center justify-center",
         n && "ring-2 ring-emerald-400",
         f
       ),
       children: [
         s && c ? /* @__PURE__ */ e("div", { className: "absolute inset-0", children: c }) : /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-2 text-gray-300", children: a ? /* @__PURE__ */ e("img", { src: a, alt: t, className: "w-16 h-16 rounded-full object-cover" }) : /* @__PURE__ */ e("div", { className: "w-16 h-16 rounded-full bg-gray-700 flex items-center justify-center", children: s ? /* @__PURE__ */ e(je, { className: "w-8 h-8" }) : /* @__PURE__ */ e(Be, { 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-black/50 text-white text-xs", children: [
+        /* @__PURE__ */ d("div", { className: "absolute bottom-2 left-2 flex items-center gap-1.5 px-2 py-1 rounded bg-black/50 text-white text-xs", children: [
           r ? /* @__PURE__ */ e(Pe, { className: "w-3 h-3" }) : /* @__PURE__ */ e(_e, { className: "w-3 h-3" }),
           /* @__PURE__ */ e("span", { className: "truncate max-w-[140px]", children: t })
         ] })
@@ -49,7 +49,7 @@ function Zt({
 }
 function Xt({ attach: t, active: a = !0, mirrored: r = !1, className: n }) {
   const s = X(null);
-  return G(() => {
+  return K(() => {
     if (!a || !s.current) return;
     const c = t(s.current);
     return () => {
@@ -59,7 +59,7 @@ function Xt({ attach: t, active: a = !0, mirrored: r = !1, className: n }) {
     "div",
     {
       ref: s,
-      className: b(
+      className: x(
         "w-full h-full bg-gray-900 overflow-hidden",
         r && "[&>*]:scale-x-[-1]",
         n
@@ -87,7 +87,7 @@ const Ke = {
   lg: "p-3",
   xl: "p-4",
   full: "p-4"
-}, ee = ce(
+}, te = ce(
   ({
     variant: t = "primary",
     size: a = "md",
@@ -96,18 +96,18 @@ const Ke = {
     leftIcon: s,
     rightIcon: c,
     iconOnly: f = !1,
-    className: g,
+    className: b,
     children: p,
-    disabled: y,
-    ...u
+    disabled: g,
+    ...m
   }, l) => {
-    const d = y || n;
-    return /* @__PURE__ */ i(
+    const u = g || n;
+    return /* @__PURE__ */ d(
       "button",
       {
         ref: l,
         type: "button",
-        className: b(
+        className: x(
           // Base styles — radius/focus/colors come from the token-driven `.btn o__*` CSS
           "inline-flex items-center justify-center transition-colors duration-200",
           "disabled:opacity-50 disabled:cursor-not-allowed",
@@ -119,15 +119,15 @@ const Ke = {
           r && "w-full",
           // Loading state
           n && "cursor-wait",
-          g
+          b
         ),
-        disabled: d,
-        ...u,
+        disabled: u,
+        ...m,
         children: [
-          n && /* @__PURE__ */ i(
+          n && /* @__PURE__ */ d(
             "svg",
             {
-              className: b(
+              className: x(
                 "animate-spin",
                 f ? "h-4 w-4" : "h-4 w-4 mr-2"
               ),
@@ -156,16 +156,16 @@ const Ke = {
               ]
             }
           ),
-          !n && s && /* @__PURE__ */ e("span", { className: b("flex-shrink-0", !f && "mr-2"), children: s }),
+          !n && s && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", !f && "mr-2"), children: s }),
           !f && p,
-          !n && c && /* @__PURE__ */ e("span", { className: b("flex-shrink-0", !f && "ml-2"), children: c }),
+          !n && c && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", !f && "ml-2"), children: c }),
           f && !n && !s && !c && p
         ]
       }
     );
   }
 );
-ee.displayName = "Button";
+te.displayName = "Button";
 const Qt = ({
   children: t,
   size: a = "md",
@@ -173,7 +173,7 @@ const Qt = ({
   attached: n = !0,
   className: s
 }) => {
-  const c = b(
+  const c = x(
     "inline-flex",
     {
       // Orientation
@@ -204,12 +204,12 @@ const Qt = ({
   external: s = !1,
   className: c,
   children: f,
-  href: g,
+  href: b,
   target: p,
-  rel: y,
-  ...u
+  rel: g,
+  ...m
 }) => {
-  const l = s || g && (g.startsWith("http") || g.startsWith("mailto:")), d = b(
+  const l = s || b && (b.startsWith("http") || b.startsWith("mailto:")), u = x(
     // Base styles
     "inline-flex items-center gap-1 transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2",
     // Size variants
@@ -264,12 +264,12 @@ const Qt = ({
     },
     c
   ), h = {
-    ...u,
-    href: n ? void 0 : g,
+    ...m,
+    href: n ? void 0 : b,
     target: l ? "_blank" : p,
-    rel: l ? "noopener noreferrer" : y
+    rel: l ? "noopener noreferrer" : g
   };
-  return /* @__PURE__ */ i("a", { className: d, ...h, children: [
+  return /* @__PURE__ */ d("a", { className: u, ...h, children: [
     f,
     l && /* @__PURE__ */ e(
       "svg",
@@ -308,22 +308,22 @@ function ze({
   options: c,
   disabled: f = !1
 }) {
-  const [g, p] = V(!1), y = X(null), u = ne(() => {
+  const [b, p] = V(!1), g = X(null), m = ae(() => {
     p((l) => !l);
   }, []);
-  return G(() => {
-    const l = (d) => {
-      y.current && !y.current.contains(d.target) && p(!1);
+  return K(() => {
+    const l = (u) => {
+      g.current && !g.current.contains(u.target) && p(!1);
     };
     return document.addEventListener("mousedown", l), () => document.removeEventListener("mousedown", l);
-  }, []), /* @__PURE__ */ i("div", { ref: y, className: "relative inline-flex items-center gap-px", children: [
-    /* @__PURE__ */ i(
+  }, []), /* @__PURE__ */ d("div", { ref: g, className: "relative inline-flex items-center gap-px", children: [
+    /* @__PURE__ */ d(
       "button",
       {
         type: "button",
         onClick: a,
         disabled: f,
-        className: b(
+        className: x(
           "inline-flex items-center justify-center font-medium transition-colors duration-200",
           "focus:outline-none focus:ring-1 focus:ring-offset-1",
           "disabled:opacity-50 disabled:cursor-not-allowed",
@@ -341,9 +341,9 @@ function ze({
       "button",
       {
         type: "button",
-        onClick: u,
+        onClick: m,
         disabled: f,
-        className: b(
+        className: x(
           "inline-flex items-center justify-center font-medium transition-colors duration-200",
           "focus:outline-none focus:ring-1 focus:ring-offset-1",
           "disabled:opacity-50 disabled:cursor-not-allowed",
@@ -354,14 +354,14 @@ function ze({
         children: /* @__PURE__ */ e(Oe, { className: "h-4 w-4" })
       }
     ),
-    g && c.length > 0 && /* @__PURE__ */ e("div", { className: "absolute right-0 top-full mt-1 z-50 min-w-[160px] rounded-lg border border-gray-200 bg-white shadow-lg py-1", children: c.map((l) => /* @__PURE__ */ e(
+    b && c.length > 0 && /* @__PURE__ */ e("div", { className: "absolute right-0 top-full mt-1 z-50 min-w-[160px] rounded-lg border border-gray-200 bg-white shadow-lg py-1", children: c.map((l) => /* @__PURE__ */ e(
       "button",
       {
         type: "button",
         onClick: () => {
           l.onClick(), p(!1);
         },
-        className: b(
+        className: x(
           "w-full text-left px-3 py-2 text-sm hover:bg-gray-50 transition-colors",
           l.variant === "destructive" ? "text-red-600 hover:bg-red-50" : "text-gray-700"
         ),
@@ -390,22 +390,22 @@ const Xe = {
     indeterminate: s = !1,
     containerClassName: c,
     labelClassName: f,
-    className: g,
+    className: b,
     id: p,
-    ...y
-  }, u) => {
-    const l = p || `checkbox-${Math.random().toString(36).substr(2, 9)}`, d = !!r;
+    ...g
+  }, m) => {
+    const l = p || `checkbox-${Math.random().toString(36).substr(2, 9)}`, u = !!r;
     return se.useEffect(() => {
-      u && typeof u == "object" && u.current && (u.current.indeterminate = s);
-    }, [s, u]), /* @__PURE__ */ i("div", { className: b("flex flex-col", c), children: [
-      /* @__PURE__ */ i("div", { className: "flex items-start", children: [
+      m && typeof m == "object" && m.current && (m.current.indeterminate = s);
+    }, [s, m]), /* @__PURE__ */ d("div", { className: x("flex flex-col", c), children: [
+      /* @__PURE__ */ d("div", { className: "flex items-start", children: [
         /* @__PURE__ */ e("div", { className: "flex items-center h-5", children: /* @__PURE__ */ e(
           "input",
           {
-            ref: u,
+            ref: m,
             id: l,
             type: "checkbox",
-            className: b(
+            className: x(
               // Base styles
               "rounded border transition-colors duration-200",
               "focus:ring-2 focus:ring-offset-2 focus:outline-none",
@@ -416,20 +416,20 @@ const Xe = {
               // checked fill is the forms-plugin `currentColor`. The plugin's
               // check glyph is white, so the fill must stay dark in both modes
               // (accent-fill would invert to near-white in dark → invisible check).
-              d ? "border-error bg-input text-error focus:border-error focus:ring-error" : "border-neutral bg-input text-[#1a1a1a] focus:border-primary focus:ring-primary",
-              g
+              u ? "border-error bg-[var(--base-input)] text-error focus:border-error focus:ring-error" : "border-neutral bg-[var(--base-input)] text-[#1a1a1a] focus:border-primary focus:ring-primary",
+              b
             ),
-            ...y
+            ...g
           }
         ) }),
-        t && /* @__PURE__ */ i("div", { className: "ml-3 flex-1", children: [
+        t && /* @__PURE__ */ d("div", { className: "ml-3 flex-1", children: [
           /* @__PURE__ */ e(
             "label",
             {
               htmlFor: l,
-              className: b(
+              className: x(
                 "font-medium cursor-pointer",
-                d ? "text-error" : "text-default",
+                u ? "text-error" : "text-default",
                 Qe[n],
                 f
               ),
@@ -452,14 +452,14 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
   required: s = !1,
   size: c = "md",
   className: f,
-  minDate: g,
+  minDate: b,
   maxDate: p,
-  format: y = "MM/dd/yyyy"
-}, u) => {
-  const [l, d] = V(!1), [h, C] = V(() => t || /* @__PURE__ */ new Date()), w = X(null);
-  G(() => {
-    const z = (v) => {
-      w.current && !w.current.contains(v.target) && d(!1);
+  format: g = "MM/dd/yyyy"
+}, m) => {
+  const [l, u] = V(!1), [h, C] = V(() => t || /* @__PURE__ */ new Date()), w = X(null);
+  K(() => {
+    const z = (P) => {
+      w.current && !w.current.contains(P.target) && u(!1);
     };
     return l && document.addEventListener("mousedown", z), () => {
       document.removeEventListener("mousedown", z);
@@ -467,32 +467,32 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
   }, [l]);
   const N = (z) => {
     if (!z) return "";
-    const v = z.getDate().toString().padStart(2, "0"), T = (z.getMonth() + 1).toString().padStart(2, "0"), m = z.getFullYear();
-    switch (y) {
+    const P = z.getDate().toString().padStart(2, "0"), H = (z.getMonth() + 1).toString().padStart(2, "0"), i = z.getFullYear();
+    switch (g) {
       case "dd/MM/yyyy":
-        return `${v}/${T}/${m}`;
+        return `${P}/${H}/${i}`;
       case "yyyy-MM-dd":
-        return `${m}-${T}-${v}`;
+        return `${i}-${H}-${P}`;
       case "MM/dd/yyyy":
       default:
-        return `${T}/${v}/${m}`;
+        return `${H}/${P}/${i}`;
     }
-  }, B = () => {
-    const z = h.getFullYear(), v = h.getMonth(), T = new Date(z, v, 1), m = new Date(T);
-    m.setDate(m.getDate() - T.getDay());
-    const $ = [], L = new Date(m);
-    for (let D = 0; D < 42; D++)
-      $.push(new Date(L)), L.setDate(L.getDate() + 1);
-    return $;
-  }, x = (z) => {
-    z.getMonth() === h.getMonth() && (g && z < g || p && z > p || (a?.(z), d(!1)));
+  }, I = () => {
+    const z = h.getFullYear(), P = h.getMonth(), H = new Date(z, P, 1), i = new Date(H);
+    i.setDate(i.getDate() - H.getDay());
+    const y = [], $ = new Date(i);
+    for (let L = 0; L < 42; L++)
+      y.push(new Date($)), $.setDate($.getDate() + 1);
+    return y;
+  }, v = (z) => {
+    z.getMonth() === h.getMonth() && (b && z < b || p && z > p || (a?.(z), u(!1)));
   }, q = () => {
     C(new Date(h.getFullYear(), h.getMonth() - 1, 1));
-  }, K = () => {
+  }, B = () => {
     C(new Date(h.getFullYear(), h.getMonth() + 1, 1));
-  }, H = () => {
-    a?.(null), d(!1);
-  }, F = b(
+  }, U = () => {
+    a?.(null), u(!1);
+  }, F = x(
     "w-full border border-neutral rounded-md transition-colors duration-200",
     "bg-module text-default",
     "placeholder:text-default dark:placeholder:text-muted",
@@ -505,7 +505,7 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
       "px-4 py-3 text-base": c === "full"
     },
     f
-  ), E = B(), J = [
+  ), E = I(), J = [
     "January",
     "February",
     "March",
@@ -519,35 +519,35 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
     "November",
     "December"
   ];
-  return /* @__PURE__ */ i("div", { ref: w, className: "relative", children: [
-    /* @__PURE__ */ i("div", { className: "relative", children: [
+  return /* @__PURE__ */ d("div", { ref: w, className: "relative", children: [
+    /* @__PURE__ */ d("div", { className: "relative", children: [
       /* @__PURE__ */ e(
         "input",
         {
-          ref: u,
+          ref: m,
           type: "text",
           value: N(t ?? null),
           placeholder: r,
           disabled: n,
           required: s,
           readOnly: !0,
-          onClick: () => !n && d(!l),
-          className: b(F, "pr-10 cursor-pointer")
+          onClick: () => !n && u(!l),
+          className: x(F, "pr-10 cursor-pointer")
         }
       ),
       /* @__PURE__ */ e(
         "button",
         {
           type: "button",
-          onClick: () => !n && d(!l),
+          onClick: () => !n && u(!l),
           disabled: n,
           className: "absolute inset-y-0 right-0 flex items-center pr-3 text-muted hover:text-muted",
           children: /* @__PURE__ */ e(et, {})
         }
       )
     ] }),
-    l && /* @__PURE__ */ i("div", { className: "absolute z-50 mt-1 bg-module border border-neutral rounded-md shadow-lg p-4 min-w-[280px]", children: [
-      /* @__PURE__ */ i("div", { className: "flex items-center justify-between mb-4", children: [
+    l && /* @__PURE__ */ d("div", { className: "absolute z-50 mt-1 bg-module border border-neutral rounded-md shadow-lg p-4 min-w-[280px]", children: [
+      /* @__PURE__ */ d("div", { className: "flex items-center justify-between mb-4", children: [
         /* @__PURE__ */ e(
           "button",
           {
@@ -556,7 +556,7 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
             children: /* @__PURE__ */ e(tt, {})
           }
         ),
-        /* @__PURE__ */ i("h3", { className: "text-sm font-medium text-default", children: [
+        /* @__PURE__ */ d("h3", { className: "text-sm font-medium text-default", children: [
           J[h.getMonth()],
           " ",
           h.getFullYear()
@@ -564,39 +564,39 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: K,
+            onClick: B,
             className: "p-1 hover:bg-neutral-container rounded",
             children: /* @__PURE__ */ e(rt, {})
           }
         )
       ] }),
       /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1 mb-2", children: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((z) => /* @__PURE__ */ e("div", { className: "text-xs font-medium text-muted text-center py-1", children: z }, z)) }),
-      /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1", children: E.map((z, v) => {
-        const T = z.getMonth() === h.getMonth(), m = t && z.toDateString() === t.toDateString(), $ = z.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), L = !T || g && z < g || p && z > p;
+      /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1", children: E.map((z, P) => {
+        const H = z.getMonth() === h.getMonth(), i = t && z.toDateString() === t.toDateString(), y = z.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), $ = !H || b && z < b || p && z > p;
         return /* @__PURE__ */ e(
           "button",
           {
-            onClick: () => !L && x(z),
-            disabled: L,
-            className: b(
+            onClick: () => !$ && v(z),
+            disabled: $,
+            className: x(
               "w-8 h-8 text-sm rounded transition-colors duration-200",
               {
-                "text-default hover:bg-neutral-container": T && !m && !L,
-                "bg-primary text-white": m,
-                "bg-neutral-container text-default": $ && !m,
-                "text-muted cursor-not-allowed": L
+                "text-default hover:bg-neutral-container": H && !i && !$,
+                "bg-primary text-white": i,
+                "bg-neutral-container text-default": y && !i,
+                "text-muted cursor-not-allowed": $
               }
             ),
             children: z.getDate()
           },
-          v
+          P
         );
       }) }),
-      /* @__PURE__ */ i("div", { className: "flex justify-between items-center mt-4 pt-3 border-t border-neutral", children: [
+      /* @__PURE__ */ d("div", { className: "flex justify-between items-center mt-4 pt-3 border-t border-neutral", children: [
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: H,
+            onClick: U,
             className: "text-sm text-muted hover:text-default",
             children: "Clear"
           }
@@ -604,7 +604,7 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: () => d(!1),
+            onClick: () => u(!1),
             className: "text-sm text-primary hover:text-primary/80",
             children: "Close"
           }
@@ -667,71 +667,71 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
     fullWidth: s = !1,
     startIcon: c = /* @__PURE__ */ e(nt, {}),
     loading: f = !1,
-    containerClassName: g,
+    containerClassName: b,
     labelClassName: p,
-    className: y,
-    id: u,
+    className: g,
+    id: m,
     options: l,
-    onRemoteSearch: d,
+    onRemoteSearch: u,
     onSelect: h,
     debounceTime: C = 500,
     value: w,
     onChange: N,
-    ...B
-  }, x) => {
-    const q = u || `searchfield-${Math.random().toString(36).substr(2, 9)}`, K = !!r, H = X(null), F = X(null), [E, J] = V(w || ""), [z, v] = V(!1), [T, m] = V(!1);
-    G(() => {
+    ...I
+  }, v) => {
+    const q = m || `searchfield-${Math.random().toString(36).substr(2, 9)}`, B = !!r, U = X(null), F = X(null), [E, J] = V(w || ""), [z, P] = V(!1), [H, i] = V(!1);
+    K(() => {
       w !== void 0 && J(w);
     }, [w]);
-    const $ = de(() => {
+    const y = de(() => {
       if (!E) return l;
       const W = String(E).toLowerCase();
       return l.filter(
         (S) => String(S.label).toLowerCase().includes(W)
       );
     }, [E, l]);
-    G(() => {
-      if (!d || !E) {
-        m(!1);
+    K(() => {
+      if (!u || !E) {
+        i(!1);
         return;
       }
       const W = setTimeout(async () => {
-        m(!0);
+        i(!0);
         try {
-          await d(String(E));
+          await u(String(E));
         } catch (S) {
           console.error("Remote search failed:", S);
         } finally {
-          m(!1);
+          i(!1);
         }
       }, C);
       return () => {
-        clearTimeout(W), m(!1);
+        clearTimeout(W), i(!1);
       };
-    }, [E, C, d]), G(() => {
+    }, [E, C, u]), K(() => {
       const W = (S) => {
-        H.current && !H.current.contains(S.target) && v(!1);
+        U.current && !U.current.contains(S.target) && P(!1);
       };
       return document.addEventListener("mousedown", W), () => document.removeEventListener("mousedown", W);
     }, []);
-    const L = (W) => {
+    const $ = (W) => {
       const S = W.target.value;
-      J(S), v(!0), N && N(W);
-    }, D = (W) => {
-      J(W.label), v(!1), h && h(W.value);
-    }, P = () => {
-      (l.length > 0 || d) && v(!0);
-    }, M = f || T, te = z && ($.length > 0 || M), ae = de(() => x || F, [x]);
-    return /* @__PURE__ */ i(
+      J(S), P(!0), N && N(W);
+    }, L = (W) => {
+      J(W.label), P(!1), h && h(W.value);
+    }, D = () => {
+      (l.length > 0 || u) && P(!0);
+    }, M = f || H, Q = z && (y.length > 0 || M), re = de(() => v || F, [v]);
+    return /* @__PURE__ */ d(
       "div",
       {
         className: ie(
           "flex flex-col",
           s ? "w-full" : "",
-          g || "",
+          b || "",
           "relative"
         ),
-        ref: H,
+        ref: U,
         children: [
           t && /* @__PURE__ */ e(
             "label",
@@ -739,22 +739,22 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
               htmlFor: q,
               className: ie(
                 "block text-sm font-medium mb-1",
-                K ? "text-error" : "text-default",
+                B ? "text-error" : "text-default",
                 p || ""
               ),
               children: t
             }
           ),
-          /* @__PURE__ */ i("div", { className: "relative", children: [
+          /* @__PURE__ */ d("div", { className: "relative", children: [
             c && /* @__PURE__ */ e("div", { className: "absolute left-0 pl-3 flex items-center pointer-events-none h-full", children: /* @__PURE__ */ e("span", { className: ie("text-muted", xe[n]), children: c }) }),
             /* @__PURE__ */ e(
               "input",
               {
-                ref: ae,
+                ref: re,
                 id: q,
                 value: E,
-                onChange: L,
-                onFocus: P,
+                onChange: $,
+                onFocus: D,
                 className: ie(
                   // Base styles
                   "block w-full rounded-lg border transition-colors duration-200 bg-input",
@@ -767,15 +767,15 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
                   "pr-10",
                   // Altijd padding rechts voor de dropdown/loading icon
                   // State styles
-                  K ? "border-red-500 text-error focus:border-red-500 focus:ring-red-500" : "border-neutral text-default",
-                  y || ""
+                  B ? "border-red-500 text-error focus:border-red-500 focus:ring-red-500" : "border-neutral text-default",
+                  g || ""
                 ),
-                ...B
+                ...I
               }
             ),
             /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: M || f ? (
               // Loading Spinner
-              /* @__PURE__ */ i(
+              /* @__PURE__ */ d(
                 "svg",
                 {
                   className: ie("animate-spin text-link", xe[n]),
@@ -815,21 +815,21 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
                     xe[n],
                     z ? "rotate-180" : "rotate-0"
                   ),
-                  onClick: () => v((W) => !W)
+                  onClick: () => P((W) => !W)
                 }
               )
             ) })
           ] }),
-          te && /* @__PURE__ */ e(
+          Q && /* @__PURE__ */ e(
             "ul",
             {
               className: "absolute z-10 mt-1 w-full bg-module border border-neutral rounded-lg shadow-lg max-h-60 overflow-auto top-full",
               role: "listbox",
-              children: $.length > 0 ? $.map((W) => /* @__PURE__ */ e(
+              children: y.length > 0 ? y.map((W) => /* @__PURE__ */ e(
                 "li",
                 {
                   className: "px-4 py-2 cursor-pointer text-default hover:bg-accent-container hover:text-accent transition-colors",
-                  onClick: () => D(W),
+                  onClick: () => L(W),
                   role: "option",
                   "aria-selected": E === W.label,
                   children: W.label
@@ -843,12 +843,12 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
             {
               className: ie(
                 "mt-1 text-xs",
-                K ? "text-error" : "text-muted"
+                B ? "text-error" : "text-muted"
               ),
               children: r || a
             }
           ),
-          d && /* @__PURE__ */ i("p", { className: "mt-2 text-xs text-success dark:text-success", children: [
+          u && /* @__PURE__ */ d("p", { className: "mt-2 text-xs text-success dark:text-success", children: [
             "Huidige zoekterm (niet-gedebounced): ",
             String(E)
           ] })
@@ -872,115 +872,115 @@ const ot = {
     fullWidth: s = !1,
     options: c,
     placeholder: f,
-    containerClassName: g,
+    containerClassName: b,
     labelClassName: p,
-    className: y,
-    id: u,
+    className: g,
+    id: m,
     searchable: l,
-    multiple: d,
+    multiple: u,
     value: h,
     onChange: C,
     allowCreate: w,
     onCreateOption: N,
-    ...B
-  }, x) => {
-    const q = u || `select-${Math.random().toString(36).substr(2, 9)}`, K = !!r, [H, F] = se.useState(!1), [E, J] = se.useState(""), z = se.useRef(null), [v, T] = se.useState(c);
-    se.useImperativeHandle(x, () => z.current), se.useEffect(() => {
-      const S = (I) => {
-        z.current && !z.current.contains(I.target) && F(!1);
+    ...I
+  }, v) => {
+    const q = m || `select-${Math.random().toString(36).substr(2, 9)}`, B = !!r, [U, F] = se.useState(!1), [E, J] = se.useState(""), z = se.useRef(null), [P, H] = se.useState(c);
+    se.useImperativeHandle(v, () => z.current), se.useEffect(() => {
+      const S = (A) => {
+        z.current && !z.current.contains(A.target) && F(!1);
       };
       return document.addEventListener("mousedown", S), () => document.removeEventListener("mousedown", S);
     }, []);
-    const m = se.useCallback(
-      (S, I) => S.some(
-        (O) => me(O.value) === me(I) || me(O.label) === me(I)
+    const i = se.useCallback(
+      (S, A) => S.some(
+        (O) => me(O.value) === me(A) || me(O.label) === me(A)
       ),
       []
-    ), $ = se.useCallback(
-      (S, I) => {
-        const O = [...S], A = (Q) => {
-          const re = (Q ?? "").trim();
-          re && (m(O, re) || O.push({ value: re, label: re }));
+    ), y = se.useCallback(
+      (S, A) => {
+        const O = [...S], T = (ee) => {
+          const ne = (ee ?? "").trim();
+          ne && (i(O, ne) || O.push({ value: ne, label: ne }));
         };
-        return Array.isArray(I) ? I.forEach(A) : A(I), O;
+        return Array.isArray(A) ? A.forEach(T) : T(A), O;
       },
-      [m]
+      [i]
     );
     se.useEffect(() => {
-      T((S) => {
-        const I = [...c];
+      H((S) => {
+        const A = [...c];
         return S.forEach((O) => {
-          !m(I, O.value) && !m(I, O.label) && I.push(O);
-        }), $(I, h);
+          !i(A, O.value) && !i(A, O.label) && A.push(O);
+        }), y(A, h);
       });
-    }, [c, h, $, m]);
-    const L = (S) => {
-      if (d) {
-        const I = Array.isArray(h) ? h : [], O = I.includes(S) ? I.filter((A) => A !== S) : [...I, S];
+    }, [c, h, y, i]);
+    const $ = (S) => {
+      if (u) {
+        const A = Array.isArray(h) ? h : [], O = A.includes(S) ? A.filter((T) => T !== S) : [...A, S];
         C?.(O);
       } else
         C?.(S), F(!1), J("");
-    }, D = d ? null : v.find((S) => S.value === h), P = d ? v.filter(
+    }, L = u ? null : P.find((S) => S.value === h), D = u ? P.filter(
       (S) => Array.isArray(h) && h.includes(S.value)
-    ) : [], M = l && E ? v.filter(
+    ) : [], M = l && E ? P.filter(
       (S) => S.label.toLowerCase().includes(E.toLowerCase())
-    ) : v, te = !!w && !!l && !!E.trim() && !m(v, E), ae = (S) => {
-      const I = S.trim();
-      if (!I) return;
-      const O = N?.(I) ?? {
-        value: I,
-        label: I
+    ) : P, Q = !!w && !!l && !!E.trim() && !i(P, E), re = (S) => {
+      const A = S.trim();
+      if (!A) return;
+      const O = N?.(A) ?? {
+        value: A,
+        label: A
       };
-      if (m(v, O.value) || m(v, O.label)) {
-        L(O.value), J(""), d || F(!1);
+      if (i(P, O.value) || i(P, O.label)) {
+        $(O.value), J(""), u || F(!1);
         return;
       }
-      T((A) => [...A, O]), L(O.value), J(""), d || F(!1);
-    }, W = () => d ? P.length > 0 ? P.map((S) => S.label).join(", ") : f || "Select options" : D?.label || f || "Select an option";
-    return /* @__PURE__ */ i(
+      H((T) => [...T, O]), $(O.value), J(""), u || F(!1);
+    }, W = () => u ? D.length > 0 ? D.map((S) => S.label).join(", ") : f || "Select options" : L?.label || f || "Select an option";
+    return /* @__PURE__ */ d(
       "div",
       {
         ref: z,
-        className: b(
+        className: x(
           "relative flex flex-col",
           s && "w-full",
-          g
+          b
         ),
-        ...B,
+        ...I,
         children: [
           t && /* @__PURE__ */ e(
             "label",
             {
               htmlFor: q,
-              onClick: () => F(!H),
-              className: b(
+              onClick: () => F(!U),
+              className: x(
                 "block text-sm font-medium mb-1",
-                K ? "text-error" : "text-default",
+                B ? "text-error" : "text-default",
                 p
               ),
               children: t
             }
           ),
-          /* @__PURE__ */ i("div", { className: "relative", children: [
+          /* @__PURE__ */ d("div", { className: "relative", children: [
             /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
                 id: q,
-                onClick: () => F(!H),
-                className: b(
+                onClick: () => F(!U),
+                className: x(
                   "block w-full rounded-lg border transition-colors duration-200 text-left",
                   "focus:outline-none focus:ring-0 focus:ring-offset-0",
                   "disabled:opacity-50 disabled:cursor-not-allowed",
                   "bg-module",
                   ot[n],
-                  K ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default",
-                  y
+                  B ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default",
+                  g
                 ),
                 children: /* @__PURE__ */ e("span", { className: "block truncate", children: W() })
               }
             ),
-            H && /* @__PURE__ */ i("div", { className: "absolute z-10 mt-1 w-full rounded-md bg-module shadow-lg border border-neutral", children: [
+            U && /* @__PURE__ */ d("div", { className: "absolute z-10 mt-1 w-full rounded-md bg-module shadow-lg border border-neutral", children: [
               l && /* @__PURE__ */ e("div", { className: "p-2", children: /* @__PURE__ */ e(
                 "input",
                 {
@@ -989,22 +989,22 @@ const ot = {
                   value: E,
                   onChange: (S) => J(S.target.value),
                   onKeyDown: (S) => {
-                    S.key === "Enter" && te && (S.preventDefault(), ae(E));
+                    S.key === "Enter" && Q && (S.preventDefault(), re(E));
                   },
-                  className: b(
+                  className: x(
                     "w-full px-3 py-2 text-sm rounded-md border",
                     "text-default border-neutral focus:outline-none focus:ring-0"
                   )
                 }
               ) }),
-              te && /* @__PURE__ */ i(
+              Q && /* @__PURE__ */ d(
                 "div",
                 {
-                  className: b(
+                  className: x(
                     "px-4 py-2 text-sm cursor-pointer",
                     "text-primary hover:bg-neutral-container"
                   ),
-                  onClick: () => ae(E),
+                  onClick: () => re(E),
                   children: [
                     "+: “",
                     E.trim(),
@@ -1012,8 +1012,8 @@ const ot = {
                   ]
                 }
               ),
-              /* @__PURE__ */ i("ul", { className: "max-h-60 overflow-auto py-1", children: [
-                f && !d && /* @__PURE__ */ e(
+              /* @__PURE__ */ d("ul", { className: "max-h-60 overflow-auto py-1", children: [
+                f && !u && /* @__PURE__ */ e(
                   "li",
                   {
                     className: "px-4 py-2 text-sm text-muted cursor-pointer hover:bg-neutral-container",
@@ -1024,23 +1024,23 @@ const ot = {
                   }
                 ),
                 M.map((S) => {
-                  const I = d ? Array.isArray(h) && h.includes(S.value) : h === S.value;
+                  const A = u ? Array.isArray(h) && h.includes(S.value) : h === S.value;
                   return /* @__PURE__ */ e(
                     "li",
                     {
-                      onClick: () => !S.disabled && L(S.value),
-                      className: b(
+                      onClick: () => !S.disabled && $(S.value),
+                      className: x(
                         "px-4 py-2 text-sm cursor-pointer",
                         "text-default",
                         S.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-neutral-container",
-                        I && "font-semibold"
+                        A && "font-semibold"
                       ),
-                      children: /* @__PURE__ */ i("div", { className: "flex items-center", children: [
-                        d && /* @__PURE__ */ e(
+                      children: /* @__PURE__ */ d("div", { className: "flex items-center", children: [
+                        u && /* @__PURE__ */ e(
                           "input",
                           {
                             type: "checkbox",
-                            checked: I,
+                            checked: A,
                             readOnly: !0,
                             className: "mr-3 h-4 w-4 rounded border-neutral text-primary focus:ring-primary"
                           }
@@ -1057,9 +1057,9 @@ const ot = {
           (r || a) && /* @__PURE__ */ e(
             "p",
             {
-              className: b(
+              className: x(
                 "mt-1 text-xs",
-                K ? "text-error" : "text-muted"
+                B ? "text-error" : "text-muted"
               ),
               children: r || a
             }
@@ -1084,34 +1084,34 @@ const ct = {
     fullWidth: s = !1,
     loading: c = !1,
     containerClassName: f,
-    labelClassName: g,
+    labelClassName: b,
     className: p,
-    id: y,
-    rows: u = 4,
+    id: g,
+    rows: m = 4,
     ...l
-  }, d) => {
-    const h = y || `textarea-${Math.random().toString(36).substr(2, 9)}`, C = !!r;
-    return /* @__PURE__ */ i("div", { className: b("flex flex-col", s && "w-full", f), children: [
+  }, u) => {
+    const h = g || `textarea-${Math.random().toString(36).substr(2, 9)}`, C = !!r;
+    return /* @__PURE__ */ d("div", { className: x("flex flex-col", s && "w-full", f), children: [
       t && /* @__PURE__ */ e(
         "label",
         {
           htmlFor: h,
-          className: b(
+          className: x(
             "block text-sm font-medium mb-1",
             C ? "text-error" : "text-default",
-            g
+            b
           ),
           children: t
         }
       ),
-      /* @__PURE__ */ i("div", { className: "relative", children: [
+      /* @__PURE__ */ d("div", { className: "relative", children: [
         /* @__PURE__ */ e(
           "textarea",
           {
-            ref: d,
+            ref: u,
             id: h,
-            rows: u,
-            className: b(
+            rows: m,
+            className: x(
               // Base styles
               "block w-full rounded-lg border transition-colors duration-200 resize-vertical bg-input",
               "placeholder:text-[var(--text-muted)] focus:outline-none focus:ring-0",
@@ -1125,7 +1125,7 @@ const ct = {
             ...l
           }
         ),
-        c && /* @__PURE__ */ e("div", { className: "absolute top-3 right-3", children: /* @__PURE__ */ i(
+        c && /* @__PURE__ */ e("div", { className: "absolute top-3 right-3", children: /* @__PURE__ */ d(
           "svg",
           {
             className: "animate-spin h-4 w-4 text-muted",
@@ -1158,7 +1158,7 @@ const ct = {
       (r || a) && /* @__PURE__ */ e(
         "p",
         {
-          className: b(
+          className: x(
             "mt-1 text-xs",
             C ? "text-error" : "text-muted"
           ),
@@ -1188,36 +1188,36 @@ const it = {
     fullWidth: s = !1,
     startIcon: c,
     endIcon: f,
-    loading: g = !1,
+    loading: b = !1,
     containerClassName: p,
-    labelClassName: y,
-    className: u,
+    labelClassName: g,
+    className: m,
     id: l,
-    ...d
+    ...u
   }, h) => {
     const C = l || `textfield-${Math.random().toString(36).substr(2, 9)}`, w = !!r;
-    return /* @__PURE__ */ i("div", { className: b("flex flex-col", s && "w-full", p), children: [
+    return /* @__PURE__ */ d("div", { className: x("flex flex-col", s && "w-full", p), children: [
       t && /* @__PURE__ */ e(
         "label",
         {
           htmlFor: C,
-          className: b(
+          className: x(
             "block text-sm font-medium mb-1",
             w ? "text-error" : "text-default",
-            y
+            g
           ),
           children: t
         }
       ),
-      /* @__PURE__ */ i("div", { className: "relative", children: [
+      /* @__PURE__ */ d("div", { className: "relative", children: [
         c && // Todo fix inset not showing correctly on different sizes
-        /* @__PURE__ */ e("div", { className: "absolute left-0 pl-3 flex items-center pointer-events-none h-full", children: /* @__PURE__ */ e("span", { className: b("text-muted", be[n]), children: c }) }),
+        /* @__PURE__ */ e("div", { className: "absolute left-0 pl-3 flex items-center pointer-events-none h-full", children: /* @__PURE__ */ e("span", { className: x("text-muted", be[n]), children: c }) }),
         /* @__PURE__ */ e(
           "input",
           {
             ref: h,
             id: C,
-            className: b(
+            className: x(
               // Base styles
               "block w-full rounded-lg border transition-colors duration-200 bg-input",
               "placeholder:text-[var(--text-muted)] focus:outline-none focus:ring-1 focus:ring-offset-0",
@@ -1229,15 +1229,15 @@ const it = {
               f && "pr-10",
               // State styles
               w ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default focus:border-primary focus:ring-primary",
-              u
+              m
             ),
-            ...d
+            ...u
           }
         ),
-        (f || g) && /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: g ? /* @__PURE__ */ i(
+        (f || b) && /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: b ? /* @__PURE__ */ d(
           "svg",
           {
-            className: b("animate-spin text-muted", be[n]),
+            className: x("animate-spin text-muted", be[n]),
             fill: "none",
             viewBox: "0 0 24 24",
             children: [
@@ -1262,12 +1262,12 @@ const it = {
               )
             ]
           }
-        ) : f && /* @__PURE__ */ e("span", { className: b("text-muted", be[n]), children: f }) })
+        ) : f && /* @__PURE__ */ e("span", { className: x("text-muted", be[n]), children: f }) })
       ] }),
       (r || a) && /* @__PURE__ */ e(
         "p",
         {
-          className: b(
+          className: x(
             "mt-1 text-xs",
             w ? "text-error" : "text-muted"
           ),
@@ -1286,9 +1286,9 @@ const oe = ({
   onClick: s,
   className: c,
   "aria-label": f,
-  ...g
+  ...b
 }) => {
-  const p = typeof a == "number" ? a : dt(a), y = b(
+  const p = typeof a == "number" ? a : dt(a), g = x(
     "inline-block",
     // Color variants
     {
@@ -1308,9 +1308,9 @@ const oe = ({
       "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/20 rounded": n
     },
     c
-  ), u = {
+  ), m = {
     size: p,
-    className: y,
+    className: g,
     onClick: n ? s : void 0,
     "aria-label": f,
     role: n ? "button" : void 0,
@@ -1318,9 +1318,9 @@ const oe = ({
     onKeyDown: n ? (l) => {
       (l.key === "Enter" || l.key === " ") && (l.preventDefault(), s?.());
     } : void 0,
-    ...g
+    ...b
   };
-  return /* @__PURE__ */ e(t, { ...u });
+  return /* @__PURE__ */ e(t, { ...m });
 };
 function dt(t) {
   return {
@@ -1337,15 +1337,15 @@ function ut({
   tableColumns: r = 6,
   tableRows: n = 8
 }) {
-  return t ? /* @__PURE__ */ e("main", { className: "flex-1 bg-module p-6", children: /* @__PURE__ */ e("div", { className: "w-full max-w-6xl mx-auto animate-pulse", children: t }) }) : /* @__PURE__ */ e("main", { className: "flex-1 bg-module p-6", children: /* @__PURE__ */ i("div", { className: "w-full mx-auto space-y-6 animate-pulse", children: [
-    !a && /* @__PURE__ */ i(Ee, { children: [
+  return t ? /* @__PURE__ */ e("main", { className: "flex-1 bg-module p-6", children: /* @__PURE__ */ e("div", { className: "w-full max-w-6xl mx-auto animate-pulse", children: t }) }) : /* @__PURE__ */ e("main", { className: "flex-1 bg-module p-6", children: /* @__PURE__ */ d("div", { className: "w-full mx-auto space-y-6 animate-pulse", children: [
+    !a && /* @__PURE__ */ d(Ee, { children: [
       /* @__PURE__ */ e("div", { className: "h-6 bg-neutral-container-emphasis rounded w-1/4" }),
-      /* @__PURE__ */ i("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ d("div", { className: "space-y-2", children: [
         /* @__PURE__ */ e("div", { className: "h-4 bg-neutral-container-emphasis rounded w-3/4" }),
         /* @__PURE__ */ e("div", { className: "h-4 bg-neutral-container-emphasis rounded w-1/2" })
       ] })
     ] }),
-    a && /* @__PURE__ */ i("div", { className: "rounded-lg overflow-hidden", children: [
+    a && /* @__PURE__ */ d("div", { className: "rounded-lg overflow-hidden", children: [
       /* @__PURE__ */ e("div", { className: `grid grid-cols-${r} gap-2 bg-neutral-container p-3`, children: Array.from({ length: r }).map((s, c) => /* @__PURE__ */ e(
         "div",
         {
@@ -1357,12 +1357,12 @@ function ut({
         "div",
         {
           className: `grid grid-cols-${r} gap-2 p-3 border-t border-neutral`,
-          children: Array.from({ length: r }).map((f, g) => /* @__PURE__ */ e(
+          children: Array.from({ length: r }).map((f, b) => /* @__PURE__ */ e(
             "div",
             {
               className: "h-4 bg-neutral-container-emphasis rounded w-full"
             },
-            `cell-${c}-${g}`
+            `cell-${c}-${b}`
           ))
         },
         `row-${c}`
@@ -1378,70 +1378,73 @@ const mt = ({
   placement: s = "bottom-start",
   disabled: c = !1,
   className: f,
-  showCheck: g = !0,
+  showCheck: b = !0,
   header: p
 }) => {
-  const [y, u] = V(!1), [l, d] = V(null), [h, C] = V({ top: 0, left: 0 }), w = X(null), N = X(null), B = X(null), x = X(null);
-  G(() => {
-    const v = (T) => {
-      w.current && (!w.current.contains(T.target) || B.current && !B.current.contains(T.target)) && (u(!1), d(null), x.current && (clearTimeout(x.current), x.current = null));
+  const [g, m] = V(!1), [l, u] = V(null), [h, C] = V({ top: 0, left: 0 }), [w, N] = V({}), I = X(null), v = X(null), q = X(null), B = X(null);
+  K(() => {
+    const i = (y) => {
+      I.current && (!I.current.contains(y.target) || q.current && !q.current.contains(y.target)) && (m(!1), u(null), B.current && (clearTimeout(B.current), B.current = null));
     };
-    return y && document.addEventListener("mousedown", v), () => {
-      document.removeEventListener("mousedown", v);
+    return g && document.addEventListener("mousedown", i), () => {
+      document.removeEventListener("mousedown", i);
     };
-  }, [y]), G(() => {
-    const v = (T) => {
-      T.key === "Escape" && (u(!1), d(null), x.current && (clearTimeout(x.current), x.current = null));
+  }, [g]), K(() => {
+    const i = (y) => {
+      y.key === "Escape" && (m(!1), u(null), B.current && (clearTimeout(B.current), B.current = null));
     };
-    return y && document.addEventListener("keydown", v), () => {
-      document.removeEventListener("keydown", v);
+    return g && document.addEventListener("keydown", i), () => {
+      document.removeEventListener("keydown", i);
     };
-  }, [y]), G(() => {
-    if (l && w.current) {
-      const v = w.current.querySelector(
+  }, [g]), K(() => {
+    if (l && I.current) {
+      const i = I.current.querySelector(
         `[data-option-value="${l}"]`
       );
-      if (v) {
-        const T = v.getBoundingClientRect();
+      if (i) {
+        const y = i.getBoundingClientRect();
         C({
-          top: T.top,
-          left: T.right + 8
+          top: y.top,
+          left: y.right + 8
         });
       }
     }
-  }, [l]), G(() => () => {
-    x.current && clearTimeout(x.current);
+  }, [l]), K(() => () => {
+    B.current && clearTimeout(B.current);
   }, []);
-  const q = (v) => {
-    v.stopPropagation(), c || (u(!y), d(null), x.current && (clearTimeout(x.current), x.current = null));
-  }, K = (v, T, m) => {
-    v.stopPropagation(), !T.disabled && !T.divider && (!T.children || T.children.length === 0) && (n?.(T.value, m), u(!1), d(null));
-  }, H = (v) => {
-    x.current && (clearTimeout(x.current), x.current = null), v.children && v.children.length > 0 ? d(v.value) : d(null);
-  }, F = (v) => {
-    v.children && v.children.length > 0 ? x.current = setTimeout(() => {
-      d(null);
-    }, 150) : d(null);
-  }, E = (v, T, m) => {
-    v.stopPropagation(), !T.disabled && !T.divider && (n?.(T.value, m), u(!1), d(null));
-  }, J = b(
-    "absolute z-50 min-w-[200px] bg-module rounded-md shadow-xs border border-neutral",
-    "max-h-60 overflow-auto",
-    {
-      "top-full left-0 mt-2": s === "bottom-start",
-      "top-full right-0 mt-2": s === "bottom-end",
-      "bottom-full left-0 mb-2": s === "top-start",
-      "bottom-full right-0 mb-2": s === "top-end"
+  const U = (i) => {
+    if (i.stopPropagation(), !c) {
+      if (!g) {
+        const y = v.current?.getBoundingClientRect();
+        if (y) {
+          const L = {};
+          s.startsWith("bottom") ? L.top = y.bottom + 6 : L.bottom = window.innerHeight - y.top + 6, s.endsWith("start") ? L.left = y.left : L.right = window.innerWidth - y.right, N(L);
+        }
+      }
+      m(!g), u(null), B.current && (clearTimeout(B.current), B.current = null);
     }
-  ), z = b(
+  }, F = (i, y, $) => {
+    i.stopPropagation(), !y.disabled && !y.divider && (!y.children || y.children.length === 0) && (n?.(y.value, $), m(!1), u(null));
+  }, E = (i) => {
+    B.current && (clearTimeout(B.current), B.current = null), i.children && i.children.length > 0 ? u(i.value) : u(null);
+  }, J = (i) => {
+    i.children && i.children.length > 0 ? B.current = setTimeout(() => {
+      u(null);
+    }, 150) : u(null);
+  }, z = (i, y, $) => {
+    i.stopPropagation(), !y.disabled && !y.divider && (n?.(y.value, $), m(!1), u(null));
+  }, P = x(
+    "fixed z-[60] min-w-[200px] bg-module rounded-md shadow-lg border border-neutral",
+    "max-h-60 overflow-auto"
+  ), H = x(
     "fixed z-[60] min-w-[200px] bg-module rounded-md shadow-lg border border-neutral",
     "max-h-60 overflow-auto"
   );
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ d(
     "div",
     {
-      ref: w,
-      className: b(
+      ref: I,
+      className: x(
         "relative flex flex-row items-center justify-center rounded-lg hover:bg-neutral-container",
         f
       ),
@@ -1449,128 +1452,128 @@ const mt = ({
         /* @__PURE__ */ e(
           "button",
           {
-            ref: N,
-            onClick: q,
+            ref: v,
+            onClick: U,
             disabled: c,
-            className: b("inline-flex items-center justify-center", {
+            className: x("inline-flex items-center justify-center", {
               "opacity-50 cursor-not-allowed": c
             }),
             children: t
           }
         ),
-        y && /* @__PURE__ */ e("div", { className: J, children: /* @__PURE__ */ i("div", { className: "p-2", children: [
+        g && /* @__PURE__ */ e("div", { className: P, style: w, children: /* @__PURE__ */ d("div", { className: "p-2", children: [
           p && (typeof p == "string" ? /* @__PURE__ */ e("div", { className: "text-xs font-medium text-muted uppercase tracking-wider px-3 py-2", children: p }) : p),
-          a.map((v, T) => {
-            if (v.divider)
+          a.map((i, y) => {
+            if (i.divider)
               return /* @__PURE__ */ e(
                 "div",
                 {
                   className: "border-t border-neutral my-2"
                 },
-                `divider-${T}`
+                `divider-${y}`
               );
-            const m = v.children && v.children.length > 0, $ = l === v.value;
-            return /* @__PURE__ */ i("div", { className: "relative group", children: [
-              /* @__PURE__ */ i(
+            const $ = i.children && i.children.length > 0, L = l === i.value;
+            return /* @__PURE__ */ d("div", { className: "relative group", children: [
+              /* @__PURE__ */ d(
                 "button",
                 {
-                  "data-option-value": v.value,
-                  onClick: (L) => K(L, v),
-                  onMouseEnter: () => H(v),
-                  onMouseLeave: () => F(v),
-                  disabled: v.disabled,
-                  className: b(
+                  "data-option-value": i.value,
+                  onClick: (D) => F(D, i),
+                  onMouseEnter: () => E(i),
+                  onMouseLeave: () => J(i),
+                  disabled: i.disabled,
+                  className: x(
                     "w-full flex items-center justify-between px-3 py-2 text-sm text-default hover:bg-neutral-container rounded-md transition-colors",
                     {
-                      "opacity-50 cursor-not-allowed": v.disabled,
-                      "bg-neutral-container": $ && m
+                      "opacity-50 cursor-not-allowed": i.disabled,
+                      "bg-neutral-container": L && $
                     }
                   ),
                   children: [
-                    /* @__PURE__ */ i("div", { className: "flex items-center space-x-2 min-w-0", children: [
-                      v.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: v.icon }),
-                      /* @__PURE__ */ i("div", { className: "flex flex-col items-start min-w-0", children: [
-                        /* @__PURE__ */ e("span", { className: "font-base truncate", children: v.label }),
-                        v.description && /* @__PURE__ */ e("span", { className: "text-xs text-muted", children: v.description })
+                    /* @__PURE__ */ d("div", { className: "flex items-center space-x-2 min-w-0", children: [
+                      i.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: i.icon }),
+                      /* @__PURE__ */ d("div", { className: "flex flex-col items-start min-w-0", children: [
+                        /* @__PURE__ */ e("span", { className: "font-base truncate", children: i.label }),
+                        i.description && /* @__PURE__ */ e("span", { className: "text-xs text-muted", children: i.description })
                       ] })
                     ] }),
-                    /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
-                      g && r === v.value && /* @__PURE__ */ e("span", { className: "h-4 w-4 text-success flex-shrink-0 text-sm font-bold", children: "✓" }),
-                      m && /* @__PURE__ */ e("span", { className: "text-muted text-xs", children: "▶" })
+                    /* @__PURE__ */ d("div", { className: "flex items-center space-x-2", children: [
+                      b && r === i.value && /* @__PURE__ */ e("span", { className: "h-4 w-4 text-success flex-shrink-0 text-sm font-bold", children: "✓" }),
+                      $ && /* @__PURE__ */ e("span", { className: "text-muted text-xs", children: "▶" })
                     ] })
                   ]
                 }
               ),
-              m && $ && /* @__PURE__ */ e(
+              $ && L && /* @__PURE__ */ e(
                 "div",
                 {
-                  ref: B,
-                  className: z,
+                  ref: q,
+                  className: H,
                   style: {
                     top: `${h.top}px`,
                     left: `${h.left}px`
                   },
                   onMouseEnter: () => {
-                    x.current && (clearTimeout(x.current), x.current = null), d(v.value);
+                    B.current && (clearTimeout(B.current), B.current = null), u(i.value);
                   },
                   onMouseLeave: () => {
-                    x.current = setTimeout(() => {
-                      d(null);
+                    B.current = setTimeout(() => {
+                      u(null);
                     }, 150);
                   },
-                  children: /* @__PURE__ */ e("div", { className: "p-2", children: v.children.map((L, D) => {
-                    if (L.divider)
+                  children: /* @__PURE__ */ e("div", { className: "p-2", children: i.children.map((D, M) => {
+                    if (D.divider)
                       return /* @__PURE__ */ e(
                         "div",
                         {
                           className: "border-t border-neutral my-2"
                         },
-                        `divider-${D}`
+                        `divider-${M}`
                       );
-                    const P = typeof r == "object" && r[v.value] && r[v.value].includes(
-                      L.value
-                    ) || r === L.value;
-                    return /* @__PURE__ */ i(
+                    const Q = typeof r == "object" && r[i.value] && r[i.value].includes(
+                      D.value
+                    ) || r === D.value;
+                    return /* @__PURE__ */ d(
                       "button",
                       {
-                        onClick: (M) => E(
-                          M,
-                          L,
-                          v.value
+                        onClick: (re) => z(
+                          re,
+                          D,
+                          i.value
                         ),
-                        disabled: L.disabled,
-                        className: b(
+                        disabled: D.disabled,
+                        className: x(
                           "w-full flex items-center justify-between px-3 py-2 text-sm text-default hover:bg-neutral-container rounded-md transition-colors",
                           {
-                            "opacity-50 cursor-not-allowed": L.disabled
+                            "opacity-50 cursor-not-allowed": D.disabled
                           }
                         ),
                         children: [
-                          /* @__PURE__ */ i("div", { className: "flex items-center space-x-2 min-w-0", children: [
-                            L.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: L.icon }),
-                            /* @__PURE__ */ i("div", { className: "flex flex-col items-start min-w-0", children: [
-                              /* @__PURE__ */ e("span", { className: "font-base truncate", children: L.label }),
-                              L.description && /* @__PURE__ */ e("span", { className: "text-xs text-muted", children: L.description })
+                          /* @__PURE__ */ d("div", { className: "flex items-center space-x-2 min-w-0", children: [
+                            D.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: D.icon }),
+                            /* @__PURE__ */ d("div", { className: "flex flex-col items-start min-w-0", children: [
+                              /* @__PURE__ */ e("span", { className: "font-base truncate", children: D.label }),
+                              D.description && /* @__PURE__ */ e("span", { className: "text-xs text-muted", children: D.description })
                             ] })
                           ] }),
-                          g && P && /* @__PURE__ */ e("span", { className: "h-4 w-4 text-success flex-shrink-0 text-sm font-bold", children: "✓" })
+                          b && Q && /* @__PURE__ */ e("span", { className: "h-4 w-4 text-success flex-shrink-0 text-sm font-bold", children: "✓" })
                         ]
                       },
-                      L.value
+                      D.value
                     );
                   }) })
                 }
               )
-            ] }, v.value);
+            ] }, i.value);
           }),
           (() => {
-            const v = a.reduce((T, m) => {
-              if (m.divider) return T;
-              const $ = m.children ? m.children.filter((L) => !L.divider).length : 0;
-              return T + 1 + $;
+            const i = a.reduce((y, $) => {
+              if ($.divider) return y;
+              const L = $.children ? $.children.filter((D) => !D.divider).length : 0;
+              return y + 1 + L;
             }, 0);
-            return v > 1 && /* @__PURE__ */ e("div", { className: "border-t border-neutral mt-2 pt-2", children: /* @__PURE__ */ i("div", { className: "text-xs text-muted px-3 py-1", children: [
-              v,
+            return i > 1 && /* @__PURE__ */ e("div", { className: "border-t border-neutral mt-2 pt-2", children: /* @__PURE__ */ d("div", { className: "text-xs text-muted px-3 py-1", children: [
+              i,
               " options available"
             ] }) });
           })()
@@ -1598,7 +1601,7 @@ const mt = ({
 ), ht = ({ active: t }) => /* @__PURE__ */ e(
   "svg",
   {
-    className: b(
+    className: x(
       "h-3 w-3",
       t ? "text-default" : "text-muted"
     ),
@@ -1618,7 +1621,7 @@ const mt = ({
 ), pt = ({ active: t }) => /* @__PURE__ */ e(
   "svg",
   {
-    className: b(
+    className: x(
       "h-3 w-3",
       t ? "text-default" : "text-muted"
     ),
@@ -1733,15 +1736,15 @@ const mt = ({
       placeholder: t.placeholder || `Select ${t.label.toLowerCase()}`,
       className: "min-w-[160px] btn btn o__secondary"
     }
-  ) }) : /* @__PURE__ */ e("div", { className: "flex items-center space-x-1 max-w-[240px]", children: /* @__PURE__ */ e("div", { className: "relative", children: /* @__PURE__ */ i("details", { className: "group", children: [
-    /* @__PURE__ */ i("summary", { className: "flex items-center space-x-2 cursor-pointer rounded-full px-3 py-2 text-sm btn btn o__secondary", children: [
+  ) }) : /* @__PURE__ */ e("div", { className: "flex items-center space-x-1 max-w-[240px]", children: /* @__PURE__ */ e("div", { className: "relative", children: /* @__PURE__ */ d("details", { className: "group", children: [
+    /* @__PURE__ */ d("summary", { className: "flex items-center space-x-2 cursor-pointer rounded-full px-3 py-2 text-sm btn btn o__secondary", children: [
       /* @__PURE__ */ e("span", { children: t.label }),
       /* @__PURE__ */ e("span", { className: "text-default", children: t.multiSelect && Array.isArray(t.value) ? t.value?.map(
         (n) => t.options?.find((s) => s.value === n)?.label
       ).join(", ") : t.options?.find((n) => n.value === t.value)?.label }),
       /* @__PURE__ */ e("span", { className: "text-muted text-sm group-open:rotate-180 transition-transform", children: /* @__PURE__ */ e(De, {}) })
     ] }),
-    /* @__PURE__ */ i("div", { className: "absolute z-10 left-0 mt-1 bg-module border border-neutral rounded-lg shadow-lvl-0 p-2 w-48", children: [
+    /* @__PURE__ */ d("div", { className: "absolute z-10 left-0 mt-1 bg-module border border-neutral rounded-lg shadow-lvl-0 p-2 w-48", children: [
       t.options?.map((n) => /* @__PURE__ */ e(
         "button",
         {
@@ -1750,7 +1753,7 @@ const mt = ({
           children: /* @__PURE__ */ e(
             "span",
             {
-              className: b(a(n.value) && "text-primary-500"),
+              className: x(a(n.value) && "text-primary-500"),
               children: n.label
             }
           )
@@ -1775,33 +1778,33 @@ const mt = ({
   searchPlaceholder: s = "Search...",
   filters: c = [],
   paginated: f = !1,
-  pageSizeOptions: g = [10, 25, 50, 100],
+  pageSizeOptions: b = [10, 25, 50, 100],
   defaultPageSize: p = 10,
-  actions: y = [],
-  onRowClick: u,
+  actions: g = [],
+  onRowClick: m,
   selectable: l = !1,
-  selectedRows: d = [],
+  selectedRows: u = [],
   onSelectionChange: h,
-  getRowKey: C = (H, F) => F,
+  getRowKey: C = (U, F) => F,
   emptyContent: w,
   hoverable: N = !0,
-  bordered: B = !1,
-  striped: x = !1,
+  bordered: I = !1,
+  striped: v = !1,
   className: q,
-  rowClassName: K
+  rowClassName: B
 }) => {
-  const [H, F] = V(""), [E, J] = V({
+  const [U, F] = V(""), [E, J] = V({
     column: null,
     direction: null
-  }), [z, v] = V({
+  }), [z, P] = V({
     page: 0,
     pageSize: p
-  }), T = X(null), m = de(() => {
+  }), H = X(null), i = de(() => {
     let o = t;
-    if (n && H.trim()) {
+    if (n && U.trim()) {
       const k = a.filter(
         (R) => R.searchable !== !1
-      ), _ = H.toLowerCase();
+      ), _ = U.toLowerCase();
       o = o.filter((R) => k.some((j) => {
         const Y = typeof j.accessor == "function" ? j.accessor(R) : R[j.accessor];
         return String(Y || "").toLowerCase().includes(_);
@@ -1815,81 +1818,81 @@ const mt = ({
         return String(j || "") === k.value;
       }));
     }), o;
-  }, [t, H, a, n, c]), $ = de(() => {
-    if (!E.column || !E.direction) return m;
+  }, [t, U, a, n, c]), y = de(() => {
+    if (!E.column || !E.direction) return i;
     const o = a.find((k) => k.id === E.column);
-    return o ? [...m].sort((k, _) => {
+    return o ? [...i].sort((k, _) => {
       const R = typeof o.accessor == "function" ? o.accessor(k) : k[o.accessor], j = typeof o.accessor == "function" ? o.accessor(_) : _[o.accessor];
       let Y = 0;
       return R < j ? Y = -1 : R > j && (Y = 1), E.direction === "desc" ? -Y : Y;
-    }) : m;
-  }, [m, E, a]), L = de(() => {
-    if (!f) return $;
+    }) : i;
+  }, [i, E, a]), $ = de(() => {
+    if (!f) return y;
     const o = z.page * z.pageSize, k = o + z.pageSize;
-    return $.slice(o, k);
-  }, [$, z, f]), D = ne(
+    return y.slice(o, k);
+  }, [y, z, f]), L = ae(
     (o) => {
       a.find((_) => _.id === o)?.sortable && J((_) => _.column !== o ? { column: o, direction: "asc" } : _.direction === "asc" ? { column: o, direction: "desc" } : { column: null, direction: null });
     },
     [a]
-  ), P = ne((o) => {
-    v((k) => ({ ...k, page: o }));
-  }, []), M = ne((o) => {
-    v({ page: 0, pageSize: o });
-  }, []), te = ne(
+  ), D = ae((o) => {
+    P((k) => ({ ...k, page: o }));
+  }, []), M = ae((o) => {
+    P({ page: 0, pageSize: o });
+  }, []), Q = ae(
     (o, k) => {
       if (!h) return;
       const _ = C(o, 0);
-      d.map((R, j) => C(R, j)), h(k ? [...d, o] : d.filter(
-        (R, j) => C(d[j], j) !== _
+      u.map((R, j) => C(R, j)), h(k ? [...u, o] : u.filter(
+        (R, j) => C(u[j], j) !== _
       ));
     },
-    [d, h, C]
-  ), ae = ne(
+    [u, h, C]
+  ), re = ae(
     (o) => {
-      h && h(o ? [...L] : []);
+      h && h(o ? [...$] : []);
     },
-    [L, h]
+    [$, h]
   );
-  G(() => {
-    v((o) => ({ ...o, page: 0 }));
-  }, [H, E]), G(() => {
-    v((o) => ({ ...o, page: 0 }));
+  K(() => {
+    P((o) => ({ ...o, page: 0 }));
+  }, [U, E]), K(() => {
+    P((o) => ({ ...o, page: 0 }));
   }, [c.map((o) => o.value).join(",")]);
-  const W = $.length, S = Math.ceil(W / z.pageSize), I = z.page * z.pageSize + 1, O = Math.min(I + z.pageSize - 1, W), A = L.length > 0 && L.every((o) => {
+  const W = y.length, S = Math.ceil(W / z.pageSize), A = z.page * z.pageSize + 1, O = Math.min(A + z.pageSize - 1, W), T = $.length > 0 && $.every((o) => {
     const k = C(o, 0);
-    return d.some(
+    return u.some(
       (_, R) => C(_, R) === k
     );
-  }), Q = L.some((o) => {
+  }), ee = $.some((o) => {
     const k = C(o, 0);
-    return d.some(
+    return u.some(
       (_, R) => C(_, R) === k
     );
-  }), re = b(
+  }), ne = x(
     "w-full text-sm leading-5 text-[var(--text-default)] border-collapse",
     q
-  ), U = b("bg-[var(--base-module)]"), le = b(
+  ), G = x("bg-[var(--base-module)]"), le = x(
     "text-[var(--text-default)] p-3 border-b border-[var(--neutral-border)]"
-  ), fe = b("h-12", {
+  ), fe = x("h-12", {
     "hover:bg-[var(--neutral-container)] dark:hover:bg-[var(--neutral-container-emphasis)]": N,
-    "cursor-pointer": u
+    "cursor-pointer": m
   });
-  return /* @__PURE__ */ i("div", { className: "space-y-4", children: [
-    (n || c.length > 0) && /* @__PURE__ */ e("div", { className: "pt-4 pb-2", children: /* @__PURE__ */ i("div", { className: "flex flex-wrap gap-4 items-start", children: [
+  return /* @__PURE__ */ d("div", { className: "space-y-4", children: [
+    (n || c.length > 0) && /* @__PURE__ */ e("div", { className: "pt-4 pb-2", children: /* @__PURE__ */ d("div", { className: "flex flex-wrap gap-4 items-start", children: [
       c.map((o) => /* @__PURE__ */ e(vt, { ...o }, o.id)),
       /* @__PURE__ */ e("div", { className: "w-full sm:w-auto sm:ml-auto min-w-[200px]", children: /* @__PURE__ */ e(
         ue,
         {
           placeholder: s,
-          value: H,
+          value: U,
           onChange: (o) => F(o.target.value),
           startIcon: /* @__PURE__ */ e(ft, {}),
           className: "max-w-sm"
         }
       ) })
     ] }) }),
-    /* @__PURE__ */ i("div", { className: "relative w-full overflow-x-auto min-h-[400px]", children: [
+    /* @__PURE__ */ d("div", { className: "relative w-full overflow-x-auto min-h-[400px]", children: [
       r && /* @__PURE__ */ e("div", { className: "flex items-center justify-center z-10", children: /* @__PURE__ */ e(
         ut,
         {
@@ -1898,24 +1901,24 @@ const mt = ({
           tableColumns: a.length
         }
       ) }),
-      /* @__PURE__ */ i("table", { ref: T, className: b(re, "min-w-full"), children: [
-        /* @__PURE__ */ e("thead", { className: U, children: /* @__PURE__ */ i("tr", { children: [
-          l && /* @__PURE__ */ e("th", { className: b(le, "w-12"), children: /* @__PURE__ */ e(
+      /* @__PURE__ */ d("table", { ref: H, className: x(ne, "min-w-full"), children: [
+        /* @__PURE__ */ e("thead", { className: G, children: /* @__PURE__ */ d("tr", { children: [
+          l && /* @__PURE__ */ e("th", { className: x(le, "w-12"), children: /* @__PURE__ */ e(
             "input",
             {
               type: "checkbox",
-              checked: A,
+              checked: T,
               ref: (o) => {
-                o && (o.indeterminate = Q && !A);
+                o && (o.indeterminate = ee && !T);
               },
-              onChange: (o) => ae(o.target.checked),
+              onChange: (o) => re(o.target.checked),
               className: "rounded border-neutral"
             }
           ) }),
           !r && a.map((o) => /* @__PURE__ */ e(
             "th",
             {
-              className: b(
+              className: x(
                 le,
                 "font-semibold text-xs text-[var(--text-muted)] dark:text-[var(--text-muted)] uppercase tracking-wider",
                 "group",
@@ -1929,13 +1932,13 @@ const mt = ({
                 }
               ),
               style: { width: o.width },
-              onClick: () => o.sortable && D(o.id),
-              children: /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+              onClick: () => o.sortable && L(o.id),
+              children: /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
                 o.headerCell ? o.headerCell() : o.header,
-                o.sortable && /* @__PURE__ */ i(
+                o.sortable && /* @__PURE__ */ d(
                   "div",
                   {
-                    className: b(
+                    className: x(
                       "flex flex-col opacity-0 group-hover:opacity-100 transition-opacity",
                       E.column === o.id && "opacity-100"
                     ),
@@ -1959,32 +1962,32 @@ const mt = ({
             },
             o.id
           )),
-          y.length > 0 && /* @__PURE__ */ e("th", { className: b(le, "w-20"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
+          g.length > 0 && /* @__PURE__ */ e("th", { className: x(le, "w-20"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
         ] }) }),
-        /* @__PURE__ */ e("tbody", { children: L.length === 0 || r ? !r && /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
+        /* @__PURE__ */ e("tbody", { children: $.length === 0 || r ? !r && /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
           "td",
           {
-            colSpan: a.length + (l ? 1 : 0) + (y.length > 0 ? 1 : 0),
-            className: b(
+            colSpan: a.length + (l ? 1 : 0) + (g.length > 0 ? 1 : 0),
+            className: x(
               le,
               "text-center py-8 text-muted"
             ),
             children: w || "No data available"
           }
-        ) }) : L.map((o, k) => {
-          const _ = C(o, k), R = d.some(
+        ) }) : $.map((o, k) => {
+          const _ = C(o, k), R = u.some(
             (j, Y) => C(j, Y) === _
           );
-          return /* @__PURE__ */ i(
+          return /* @__PURE__ */ d(
             "tr",
             {
-              className: b(
+              className: x(
                 fe,
                 { "bg-accent-container": R },
-                K?.(o, k)
+                B?.(o, k)
               ),
               onClick: (j) => {
-                j.stopPropagation(), u?.(o, k);
+                j.stopPropagation(), m?.(o, k);
               },
               children: [
                 l && /* @__PURE__ */ e("td", { className: le, children: /* @__PURE__ */ e(
@@ -1993,7 +1996,7 @@ const mt = ({
                     type: "checkbox",
                     checked: R,
                     onChange: (j) => {
-                      j.stopPropagation(), te(o, j.target.checked);
+                      j.stopPropagation(), Q(o, j.target.checked);
                     },
                     className: "rounded border-neutral"
                   }
@@ -2003,7 +2006,7 @@ const mt = ({
                   return /* @__PURE__ */ e(
                     "td",
                     {
-                      className: b(le, {
+                      className: x(le, {
                         "text-left": j.align === "left" || !j.align,
                         "text-center": j.align === "center",
                         "text-right": j.align === "right",
@@ -2015,21 +2018,21 @@ const mt = ({
                     j.id
                   );
                 }),
-                y.length > 0 && /* @__PURE__ */ e("td", { className: le, children: /* @__PURE__ */ e(
+                g.length > 0 && /* @__PURE__ */ e("td", { className: le, children: /* @__PURE__ */ e(
                   mt,
                   {
-                    trigger: /* @__PURE__ */ i("div", { className: "inline-flex items-center gap-1 px-2 py-1 text-sm text-muted hover:text-default", children: [
+                    trigger: /* @__PURE__ */ d("div", { className: "inline-flex items-center gap-1 px-2 py-1 text-sm text-muted hover:text-default", children: [
                       /* @__PURE__ */ e("span", { children: "Options" }),
                       /* @__PURE__ */ e(De, {})
                     ] }),
-                    options: y.map((j) => ({
+                    options: g.map((j) => ({
                       value: j.id,
                       label: j.label,
                       icon: j.icon,
                       disabled: j.disabled?.(o)
                     })),
                     onSelect: (j) => {
-                      const Y = y.find(
+                      const Y = g.find(
                         (he) => he.id === j
                       );
                       Y && Y.onClick(o, k);
@@ -2044,18 +2047,18 @@ const mt = ({
         }) })
       ] })
     ] }),
-    f && W > 0 && /* @__PURE__ */ i("div", { className: "flex items-center justify-between px-6", children: [
-      /* @__PURE__ */ i("div", { className: "flex items-center gap-4", children: [
-        /* @__PURE__ */ i("span", { className: "text-sm text-muted", children: [
+    f && W > 0 && /* @__PURE__ */ d("div", { className: "flex items-center justify-between px-6", children: [
+      /* @__PURE__ */ d("div", { className: "flex items-center gap-4", children: [
+        /* @__PURE__ */ d("span", { className: "text-sm text-muted", children: [
           "Showing ",
-          I,
+          A,
           " to ",
           O,
           " of ",
           W,
           " results"
         ] }),
-        /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ e("span", { className: "text-sm text-muted", children: "Rows per page:" }),
           /* @__PURE__ */ e(
             "select",
@@ -2063,57 +2066,57 @@ const mt = ({
               value: z.pageSize,
               onChange: (o) => M(Number(o.target.value)),
               className: "border border-[var(--neutral-border)] text-[var(--text-default)] rounded-md px-2 py-1 text-sm bg-[var(--base-input)] w-16",
-              children: g.map((o) => /* @__PURE__ */ e("option", { value: o, children: o }, o))
+              children: b.map((o) => /* @__PURE__ */ e("option", { value: o, children: o }, o))
             }
           )
         ] })
       ] }),
-      /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ d("div", { className: "flex items-center gap-1", children: [
         /* @__PURE__ */ e(
-          ee,
+          te,
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => P(0),
+            onClick: () => D(0),
             disabled: z.page === 0,
             iconOnly: !0,
             children: /* @__PURE__ */ e(gt, {})
           }
         ),
         /* @__PURE__ */ e(
-          ee,
+          te,
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => P(z.page - 1),
+            onClick: () => D(z.page - 1),
             disabled: z.page === 0,
             iconOnly: !0,
             children: /* @__PURE__ */ e(xt, {})
           }
         ),
-        /* @__PURE__ */ i("span", { className: "px-3 py-1 text-sm text-muted", children: [
+        /* @__PURE__ */ d("span", { className: "px-3 py-1 text-sm text-muted", children: [
           "Page ",
           z.page + 1,
           " of ",
           S
         ] }),
         /* @__PURE__ */ e(
-          ee,
+          te,
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => P(z.page + 1),
+            onClick: () => D(z.page + 1),
             disabled: z.page >= S - 1,
             iconOnly: !0,
             children: /* @__PURE__ */ e(bt, {})
           }
         ),
         /* @__PURE__ */ e(
-          ee,
+          te,
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => P(S - 1),
+            onClick: () => D(S - 1),
             disabled: z.page >= S - 1,
             iconOnly: !0,
             children: /* @__PURE__ */ e(yt, {})
@@ -2128,15 +2131,15 @@ const mt = ({
   onTabChange: r,
   className: n
 }) => {
-  const [s, c] = V(t[0]?.id || ""), f = a || s, g = (p) => {
+  const [s, c] = V(t[0]?.id || ""), f = a || s, b = (p) => {
     r ? r(p) : c(p);
   };
-  return /* @__PURE__ */ e("div", { className: b("border-b border-neutral-200 dark:border-neutral-700", n), children: /* @__PURE__ */ e("nav", { className: "-mb-px flex space-x-8", children: t.map((p) => /* @__PURE__ */ e(
+  return /* @__PURE__ */ e("div", { className: x("border-b border-neutral-200 dark:border-neutral-700", n), children: /* @__PURE__ */ e("nav", { className: "-mb-px flex space-x-8", children: t.map((p) => /* @__PURE__ */ e(
     "button",
     {
-      onClick: () => !p.disabled && g(p.id),
+      onClick: () => !p.disabled && b(p.id),
       disabled: p.disabled,
-      className: b(
+      className: x(
         "border-b-2 py-2 px-1 text-sm font-medium transition-colors duration-200",
         {
           "border-primary text-primary": f === p.id,
@@ -2144,9 +2147,9 @@ const mt = ({
           "border-transparent text-neutral-300 cursor-not-allowed dark:text-neutral-600": p.disabled
         }
       ),
-      children: /* @__PURE__ */ i("span", { className: "flex items-center gap-2", children: [
+      children: /* @__PURE__ */ d("span", { className: "flex items-center gap-2", children: [
         p.label,
-        p.badge && /* @__PURE__ */ e("span", { className: b(
+        p.badge && /* @__PURE__ */ e("span", { className: x(
           "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium",
           f === p.id ? "bg-primary/10 text-primary" : "bg-neutral-100 text-neutral-600 dark:bg-neutral-800 dark:text-neutral-400"
         ), children: p.badge })
@@ -2163,14 +2166,14 @@ const mt = ({
   size: c = "md",
   className: f
 }) => {
-  const [g, p] = V(
+  const [b, p] = V(
     a || r || t[0]?.id || ""
-  ), y = r || g, u = (w) => {
+  ), g = r || b, m = (w) => {
     n ? n(w) : p(w);
   }, l = {
-    activeTab: y,
-    setActiveTab: u
-  }, d = t.find((w) => w.id === y), h = b(
+    activeTab: g,
+    setActiveTab: m
+  }, u = t.find((w) => w.id === g), h = x(
     "flex",
     {
       "border-b border-neutral-200 dark:border-neutral-700 px-2": s === "default" || s === "underline",
@@ -2180,7 +2183,7 @@ const mt = ({
     },
     f
   ), C = (w, N) => {
-    const B = "transition-colors duration-200 font-medium", x = {
+    const I = "transition-colors duration-200 font-medium", v = {
       "text-xs px-2 py-1": c === "sm",
       "text-sm px-3 py-2": c === "md",
       "text-base px-4 py-3": c === "lg"
@@ -2191,10 +2194,10 @@ const mt = ({
       "rounded-md": s === "pills",
       // Underline variant
       "border-b-2 pb-2": s === "underline"
-    }, K = {
+    }, B = {
       "opacity-50 cursor-not-allowed": w.disabled,
       "cursor-pointer": !w.disabled
-    }, H = N ? {
+    }, U = N ? {
       "border-primary text-primary": s === "default" || s === "underline",
       "bg-white dark:bg-neutral-700 text-neutral-900 dark:text-neutral-100 shadow-sm": s === "pills"
     } : {}, F = !N && !w.disabled ? {
@@ -2202,34 +2205,34 @@ const mt = ({
       "text-neutral-600 hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-neutral-100": s === "pills",
       "border-transparent text-neutral-600 hover:text-neutral-900 hover:border-neutral-300 dark:text-neutral-400 dark:hover:text-neutral-100": s === "underline"
     } : {};
-    return b(B, x, q, K, H, F);
+    return x(I, v, q, B, U, F);
   };
-  return /* @__PURE__ */ e(Nt.Provider, { value: l, children: /* @__PURE__ */ i("div", { children: [
+  return /* @__PURE__ */ e(Nt.Provider, { value: l, children: /* @__PURE__ */ d("div", { children: [
     /* @__PURE__ */ e("div", { className: h, role: "tablist", children: t.map((w) => /* @__PURE__ */ e(
       "button",
       {
         type: "button",
         role: "tab",
-        "aria-selected": y === w.id,
+        "aria-selected": g === w.id,
         "aria-controls": `tabpanel-${w.id}`,
         disabled: w.disabled,
-        onClick: () => !w.disabled && u(w.id),
-        className: C(w, y === w.id),
-        children: /* @__PURE__ */ i("span", { className: "flex items-center gap-2", children: [
+        onClick: () => !w.disabled && m(w.id),
+        className: C(w, g === w.id),
+        children: /* @__PURE__ */ d("span", { className: "flex items-center gap-2", children: [
           w.label,
           w.badge && /* @__PURE__ */ e("span", { className: "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-neutral-200 text-neutral-700 dark:bg-neutral-700 dark:text-neutral-300", children: w.badge })
         ] })
       },
       w.id
     )) }),
-    d?.content && /* @__PURE__ */ e(
+    u?.content && /* @__PURE__ */ e(
       "div",
       {
         role: "tabpanel",
-        id: `tabpanel-${y}`,
-        "aria-labelledby": `tab-${y}`,
+        id: `tabpanel-${g}`,
+        "aria-labelledby": `tab-${g}`,
         className: "mt-4",
-        children: d.content
+        children: u.content
       }
     )
   ] }) });
@@ -2248,19 +2251,19 @@ function Ct({
   closeOnBackdropClick: s = !0,
   closeOnEscape: c = !0,
   className: f,
-  backdropClassName: g,
+  backdropClassName: b,
   children: p,
-  footer: y,
-  showCloseButton: u = !0
+  footer: g,
+  showCloseButton: m = !0
 }) {
-  const l = X(null), d = X(null);
-  G(() => {
+  const l = X(null), u = X(null);
+  K(() => {
     if (!t || !c) return;
     const C = (w) => {
       w.key === "Escape" && a();
     };
     return document.addEventListener("keydown", C), () => document.removeEventListener("keydown", C);
-  }, [t, c, a]), G(() => (t ? (d.current = document.activeElement, l.current && l.current.focus(), document.body.style.overflow = "hidden") : (d.current && d.current.focus(), document.body.style.overflow = ""), () => {
+  }, [t, c, a]), K(() => (t ? (u.current = document.activeElement, l.current && l.current.focus(), document.body.style.overflow = "hidden") : (u.current && u.current.focus(), document.body.style.overflow = ""), () => {
     document.body.style.overflow = "";
   }), [t]);
   const h = (C) => {
@@ -2269,18 +2272,18 @@ function Ct({
   return t ? /* @__PURE__ */ e(
     "div",
     {
-      className: b(
+      className: x(
         "fixed inset-0 z-50 flex items-center justify-center p-4",
         "bg-black/20",
         // 'animate-fade-in',
-        g
+        b
       ),
       onClick: h,
-      children: /* @__PURE__ */ i(
+      children: /* @__PURE__ */ d(
         "div",
         {
           ref: l,
-          className: b(
+          className: x(
             "relative w-full bg-module rounded-modal shadow-modal rounded-md",
             // 'animate-scale-in',
             "focus:outline-none",
@@ -2292,7 +2295,7 @@ function Ct({
           "aria-labelledby": r ? "modal-title" : void 0,
           tabIndex: -1,
           children: [
-            (r || u) && /* @__PURE__ */ i("div", { className: "flex items-center justify-between p-6 pb-0", children: [
+            (r || m) && /* @__PURE__ */ d("div", { className: "flex items-center justify-between p-6 pb-0", children: [
               r && /* @__PURE__ */ e(
                 "span",
                 {
@@ -2301,7 +2304,7 @@ function Ct({
                   children: r
                 }
               ),
-              u && /* @__PURE__ */ e(
+              m && /* @__PURE__ */ e(
                 "button",
                 {
                   onClick: a,
@@ -2312,7 +2315,7 @@ function Ct({
               )
             ] }),
             /* @__PURE__ */ e("div", { className: "p-6", children: p }),
-            y && /* @__PURE__ */ e("div", { className: "px-6 py-4", children: y })
+            g && /* @__PURE__ */ e("div", { className: "px-6 py-4", children: g })
           ]
         }
       )
@@ -2327,14 +2330,14 @@ const Z = ({
   align: s = "left",
   truncate: c = !1,
   italic: f = !1,
-  underline: g = !1,
+  underline: b = !1,
   lineHeight: p = "normal",
-  as: y,
-  className: u,
+  as: g,
+  className: m,
   children: l,
-  ...d
+  ...u
 }) => {
-  const h = y || St(t), C = b(
+  const h = g || St(t), C = x(
     // Base styles
     "font-primary",
     // Variant styles
@@ -2392,12 +2395,12 @@ const Z = ({
     // Text decorations
     {
       italic: f,
-      underline: g,
+      underline: b,
       truncate: c
     },
-    u
+    m
   );
-  return /* @__PURE__ */ e(h, { className: C, ...d, children: l });
+  return /* @__PURE__ */ e(h, { className: C, ...u, children: l });
 };
 function St(t) {
   return {
@@ -2415,20 +2418,20 @@ const Lt = ({
   error: s,
   disabled: c,
   accept: f,
-  onListFiles: g,
+  onListFiles: b,
   onListMounts: p,
-  onUploadFile: y,
-  onDownloadFile: u,
+  onUploadFile: g,
+  onDownloadFile: m,
   onRegisterFile: l
 }) => {
-  const [d, h] = V(!1), [C, w] = V([]), [N, B] = V(null), [x, q] = V("/"), [K, H] = V([]), [F, E] = V(!1), [J, z] = V(""), [v, T] = V(
+  const [u, h] = V(!1), [C, w] = V([]), [N, I] = V(null), [v, q] = V("/"), [B, U] = V([]), [F, E] = V(!1), [J, z] = V(""), [P, H] = V(
     typeof t == "object" ? t : null
-  ), [m, $] = V(!1), [L, D] = V(""), P = X(null);
-  G(() => {
-    d && M();
-  }, [d]), G(() => {
-    d && N && te();
-  }, [d, N, x, J]);
+  ), [i, y] = V(!1), [$, L] = V(""), D = X(null);
+  K(() => {
+    u && M();
+  }, [u]), K(() => {
+    u && N && Q();
+  }, [u, N, v, J]);
   const M = async () => {
     E(!0);
     try {
@@ -2439,19 +2442,19 @@ const Lt = ({
     } finally {
       E(!1);
     }
-  }, te = async () => {
+  }, Q = async () => {
     if (N) {
       E(!0);
       try {
-        const o = await g?.({ mountId: N.id, name: J, path: x });
-        o?.data && H(o.data);
+        const o = await b?.({ mountId: N.id, name: J, path: v });
+        o?.data && U(o.data);
       } catch (o) {
         console.error("Failed to load files", o);
       } finally {
         E(!1);
       }
     }
-  }, ae = async (o) => {
+  }, re = async (o) => {
     const k = o.target.files?.[0];
     if (k) {
       E(!0);
@@ -2467,7 +2470,7 @@ const Lt = ({
           providerKey: k.name,
           ownerId: "me"
         };
-        T(j), a(j, R), h(!1);
+        H(j), a(j, R), h(!1);
       } catch (_) {
         console.error("Local file selection failed", _);
       } finally {
@@ -2479,16 +2482,16 @@ const Lt = ({
     if (!(!k || !N)) {
       E(!0);
       try {
-        const _ = await k.arrayBuffer(), R = await y?.({
+        const _ = await k.arrayBuffer(), R = await g?.({
           file: new Uint8Array(_),
           filename: k.name,
           mimeType: k.type || "application/octet-stream",
           mountId: N.id,
-          path: x
+          path: v
         });
         if (R?.data) {
           const j = R.data;
-          T(j), a(j, new Uint8Array(_)), h(!1);
+          H(j), a(j, new Uint8Array(_)), h(!1);
         }
       } catch (_) {
         console.error("Upload failed", _);
@@ -2497,74 +2500,74 @@ const Lt = ({
       }
     }
   }, S = async () => {
-    if (!(!L || !N)) {
+    if (!(!$ || !N)) {
       E(!0);
       try {
-        const o = `${x}${L}/`;
+        const o = `${v}${$}/`;
         l && (await l({
-          name: L,
+          name: $,
           type: "folder",
-          path: x,
+          path: v,
           mimeType: "application/x-directory",
           size: 0,
           mountId: N.id,
           providerKey: o,
           ownerId: "me"
-        }), await te()), $(!1), D("");
+        }), await Q()), y(!1), L("");
       } catch (o) {
         console.error("Failed to create folder", o);
       } finally {
         E(!1);
       }
     }
-  }, I = async (o) => {
+  }, A = async (o) => {
     E(!0);
     try {
-      const k = await u?.(o.id);
-      T(o), a(o, k), h(!1);
+      const k = await m?.(o.id);
+      H(o), a(o, k), h(!1);
     } catch (k) {
       console.error("Failed to download file", k);
     } finally {
       E(!1);
     }
   }, O = (o) => {
-    o.stopPropagation(), T(null), a(null);
-  }, A = de(() => {
+    o.stopPropagation(), H(null), a(null);
+  }, T = de(() => {
     const o = /* @__PURE__ */ new Set(), k = [];
-    return K.forEach((_) => {
+    return B.forEach((_) => {
       if (_.type === "folder") {
-        _.path === x && o.add(_.name);
+        _.path === v && o.add(_.name);
         return;
       }
-      const R = _.providerKey || _.name, Y = (x ? R.substring(x.length) : R).split("/").filter((he) => he !== "");
+      const R = _.providerKey || _.name, Y = (v ? R.substring(v.length) : R).split("/").filter((he) => he !== "");
       Y.length > 1 ? o.add(Y[0]) : Y.length === 1 && k.push(_);
     }), {
       folders: Array.from(o).sort(),
       files: k.sort((_, R) => _.name.localeCompare(R.name))
     };
-  }, [K, x]), Q = (o) => {
+  }, [B, v]), ee = (o) => {
     q((k) => `${k}${o}/`);
-  }, re = () => {
-    const o = x.split("/").filter((k) => k !== "");
+  }, ne = () => {
+    const o = v.split("/").filter((k) => k !== "");
     o.pop(), o.length === 0 ? q("/") : q(`${o.join("/")}/`);
-  }, U = de(() => {
-    const o = A.folders.map((k) => ({
+  }, G = de(() => {
+    const o = T.folders.map((k) => ({
       id: `folder-${k}`,
       name: k,
       type: "folder"
     }));
-    return A.files.forEach((k) => {
+    return T.files.forEach((k) => {
       o.push({
         ...k,
         type: "file"
       });
     }), o;
-  }, [A]), le = [
+  }, [T]), le = [
     {
       id: "name",
       header: "Name",
       accessor: "name",
-      cell: (o, k) => /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+      cell: (o, k) => /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e(
           oe,
           {
@@ -2573,7 +2576,7 @@ const Lt = ({
             color: k.type === "folder" ? "warning" : "secondary"
           }
         ),
-        /* @__PURE__ */ e("span", { className: b(k.type === "folder" && "font-medium"), children: o })
+        /* @__PURE__ */ e("span", { className: x(k.type === "folder" && "font-medium"), children: o })
       ] })
     },
     {
@@ -2592,14 +2595,14 @@ const Lt = ({
       accessor: "id",
       align: "right",
       cell: (o, k) => /* @__PURE__ */ e(
-        ee,
+        te,
         {
           size: "sm",
           variant: "outline",
           onClick: (_) => {
-            _.stopPropagation(), k.type === "folder" ? Q(k.name) : I(k);
+            _.stopPropagation(), k.type === "folder" ? ee(k.name) : A(k);
           },
-          loading: F && k.type === "file" && v?.id === k.id,
+          loading: F && k.type === "file" && P?.id === k.id,
           children: k.type === "folder" ? "Open" : "Select"
         }
       )
@@ -2609,7 +2612,7 @@ const Lt = ({
       id: "name",
       header: "Mount Name",
       accessor: "name",
-      cell: (o) => /* @__PURE__ */ i("div", { className: "flex items-center gap-2 font-medium", children: [
+      cell: (o) => /* @__PURE__ */ d("div", { className: "flex items-center gap-2 font-medium", children: [
         /* @__PURE__ */ e(oe, { icon: ke, size: "sm", color: "primary" }),
         /* @__PURE__ */ e("span", { children: o })
       ] })
@@ -2619,25 +2622,25 @@ const Lt = ({
       header: "",
       accessor: "id",
       align: "right",
-      cell: (o, k) => /* @__PURE__ */ e(ee, { size: "sm", variant: "outline", onClick: () => B(k), children: "Open" })
+      cell: (o, k) => /* @__PURE__ */ e(te, { size: "sm", variant: "outline", onClick: () => I(k), children: "Open" })
     }
   ];
-  return /* @__PURE__ */ i("div", { className: "space-y-1", children: [
+  return /* @__PURE__ */ d("div", { className: "space-y-1", children: [
     r && /* @__PURE__ */ e(Z, { variant: "label", size: "sm", weight: "medium", children: r }),
-    /* @__PURE__ */ i(
+    /* @__PURE__ */ d(
       "div",
       {
         onClick: () => !c && h(!0),
-        className: b(
+        className: x(
           "flex items-center gap-3 px-3 py-2 border rounded-lg cursor-pointer transition-colors",
           "hover:border-primary-400 bg-module",
           s ? "border-error" : "border-neutral",
           c && "opacity-50 cursor-not-allowed bg-module-subtle"
         ),
         children: [
-          /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(oe, { icon: v ? pe : ke, color: v ? "primary" : "secondary" }) }),
-          /* @__PURE__ */ e("div", { className: "flex-grow truncate", children: v ? /* @__PURE__ */ e("span", { className: "text-sm text-default font-medium", children: v.name }) : /* @__PURE__ */ e("span", { className: "text-sm text-muted", children: n }) }),
-          v && !c && /* @__PURE__ */ e(
+          /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(oe, { icon: P ? pe : ke, color: P ? "primary" : "secondary" }) }),
+          /* @__PURE__ */ e("div", { className: "flex-grow truncate", children: P ? /* @__PURE__ */ e("span", { className: "text-sm text-default font-medium", children: P.name }) : /* @__PURE__ */ e("span", { className: "text-sm text-muted", children: n }) }),
+          P && !c && /* @__PURE__ */ e(
             "button",
             {
               onClick: O,
@@ -2652,9 +2655,9 @@ const Lt = ({
     /* @__PURE__ */ e(
       Ct,
       {
-        open: d,
+        open: u,
         onClose: () => {
-          h(!1), B(null), q("/"), $(!1);
+          h(!1), I(null), q("/"), y(!1);
         },
         title: N ? `Explorer: ${N.name}` : "Select Storage Mount",
         size: "lg",
@@ -2666,21 +2669,21 @@ const Lt = ({
               {
                 id: "remote",
                 label: "Platform Storage",
-                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: N ? /* @__PURE__ */ i(Ee, { children: [
-                  /* @__PURE__ */ i("div", { className: "flex flex-wrap items-center gap-2", children: [
+                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: N ? /* @__PURE__ */ d(Ee, { children: [
+                  /* @__PURE__ */ d("div", { className: "flex flex-wrap items-center gap-2", children: [
                     /* @__PURE__ */ e(
-                      ee,
+                      te,
                       {
                         variant: "ghost",
                         size: "sm",
                         onClick: () => {
-                          x && x !== "/" ? re() : B(null);
+                          v && v !== "/" ? ne() : I(null);
                         },
                         leftIcon: /* @__PURE__ */ e(oe, { icon: we, size: "xs" }),
-                        children: x ? "Back" : "Back to Mounts"
+                        children: v ? "Back" : "Back to Mounts"
                       }
                     ),
-                    /* @__PURE__ */ e("div", { className: "flex items-center gap-1 text-xs text-muted overflow-hidden bg-neutral-container px-2 py-1 rounded", children: /* @__PURE__ */ e("span", { className: "truncate", children: x }) }),
+                    /* @__PURE__ */ e("div", { className: "flex items-center gap-1 text-xs text-muted overflow-hidden bg-neutral-container px-2 py-1 rounded", children: /* @__PURE__ */ e("span", { className: "truncate", children: v }) }),
                     /* @__PURE__ */ e("div", { className: "flex-grow min-w-[150px]", children: /* @__PURE__ */ e(
                       ue,
                       {
@@ -2692,23 +2695,23 @@ const Lt = ({
                         size: "sm"
                       }
                     ) }),
-                    /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
+                    /* @__PURE__ */ d("div", { className: "flex items-center gap-1", children: [
                       /* @__PURE__ */ e(
-                        ee,
+                        te,
                         {
                           variant: "outline",
                           size: "sm",
-                          onClick: () => $(!0),
+                          onClick: () => y(!0),
                           leftIcon: /* @__PURE__ */ e(oe, { icon: Fe, size: "xs" }),
                           children: "New Folder"
                         }
                       ),
                       /* @__PURE__ */ e(
-                        ee,
+                        te,
                         {
                           variant: "primary",
                           size: "sm",
-                          onClick: () => P.current?.click(),
+                          onClick: () => D.current?.click(),
                           leftIcon: /* @__PURE__ */ e(oe, { icon: We, size: "xs" }),
                           loading: F,
                           children: "Upload"
@@ -2719,36 +2722,36 @@ const Lt = ({
                         {
                           type: "file",
                           className: "hidden",
-                          ref: P,
+                          ref: D,
                           onChange: W,
                           accept: f
                         }
                       )
                     ] })
                   ] }),
-                  m && /* @__PURE__ */ i("div", { className: "flex items-center gap-2 p-3 bg-module-subtle rounded-lg border border-neutral", children: [
+                  i && /* @__PURE__ */ d("div", { className: "flex items-center gap-2 p-3 bg-module-subtle rounded-lg border border-neutral", children: [
                     /* @__PURE__ */ e(oe, { icon: Ce, size: "sm", color: "warning" }),
                     /* @__PURE__ */ e(
                       ue,
                       {
                         size: "sm",
                         placeholder: "Folder name",
-                        value: L,
-                        onChange: (o) => D(o.target.value),
+                        value: $,
+                        onChange: (o) => L(o.target.value),
                         autoFocus: !0
                       }
                     ),
-                    /* @__PURE__ */ e(ee, { size: "sm", onClick: S, loading: F, children: "Create" }),
-                    /* @__PURE__ */ e(ee, { size: "sm", variant: "ghost", onClick: () => $(!1), children: "Cancel" })
+                    /* @__PURE__ */ e(te, { size: "sm", onClick: S, loading: F, children: "Create" }),
+                    /* @__PURE__ */ e(te, { size: "sm", variant: "ghost", onClick: () => y(!1), children: "Cancel" })
                   ] }),
                   /* @__PURE__ */ e("div", { className: "max-h-[400px] overflow-auto rounded-lg border border-neutral", children: /* @__PURE__ */ e(
                     Le,
                     {
-                      data: U,
+                      data: G,
                       columns: le,
                       loading: F,
                       emptyContent: "This folder is empty",
-                      onRowClick: (o) => o.type === "folder" ? Q(o.name) : I(o)
+                      onRowClick: (o) => o.type === "folder" ? ee(o.name) : A(o)
                     }
                   ) })
                 ] }) : /* @__PURE__ */ e("div", { className: "max-h-[400px] overflow-auto rounded-lg border border-neutral", children: /* @__PURE__ */ e(
@@ -2758,27 +2761,27 @@ const Lt = ({
                     columns: fe,
                     loading: F,
                     emptyContent: "No storage mounts configured",
-                    onRowClick: (o) => B(o)
+                    onRowClick: (o) => I(o)
                   }
                 ) }) })
               },
               {
                 id: "local",
                 label: "Local File",
-                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-neutral rounded-xl bg-module-subtle/50", children: [
+                content: /* @__PURE__ */ e("div", { className: "space-y-6", children: /* @__PURE__ */ d("div", { className: "flex flex-col items-center justify-center py-12 border-2 border-dashed border-neutral rounded-xl bg-module-subtle/50", children: [
                   /* @__PURE__ */ e("div", { className: "p-4 bg-primary/10 rounded-full mb-4", children: /* @__PURE__ */ e(oe, { icon: pe, size: "xl", color: "primary" }) }),
                   /* @__PURE__ */ e(Z, { variant: "label", size: "lg", weight: "semibold", children: "Select a file from your computer" }),
-                  /* @__PURE__ */ i(Z, { variant: "body", size: "sm", className: "text-muted mt-1 mb-6 text-center max-w-xs", children: [
+                  /* @__PURE__ */ d(Z, { variant: "body", size: "sm", className: "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__ */ i("label", { className: "cursor-pointer", children: [
-                    /* @__PURE__ */ i("div", { className: b(
+                  /* @__PURE__ */ d("label", { className: "cursor-pointer", children: [
+                    /* @__PURE__ */ d("div", { className: x(
                       "inline-flex items-center justify-center font-medium rounded-lg transition-colors duration-200 px-6 py-3 text-base bg-primary text-white hover:bg-primary-600",
                       F && "opacity-50 cursor-wait"
                     ), children: [
-                      F && /* @__PURE__ */ i("svg", { className: "animate-spin h-4 w-4 mr-2", fill: "none", viewBox: "0 0 24 24", children: [
+                      F && /* @__PURE__ */ d("svg", { className: "animate-spin h-4 w-4 mr-2", fill: "none", viewBox: "0 0 24 24", children: [
                         /* @__PURE__ */ e("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
                         /* @__PURE__ */ e("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
                       ] }),
@@ -2789,7 +2792,7 @@ const Lt = ({
                       {
                         type: "file",
                         className: "hidden",
-                        onChange: ae,
+                        onChange: re,
                         accept: f,
                         disabled: F
                       }
@@ -2814,8 +2817,8 @@ function Mt(t, a, r) {
   const n = a.split("."), s = Array.isArray(t) ? [...t] : { ...t };
   let c = s;
   for (let f = 0; f < n.length - 1; f++) {
-    const g = n[f], p = c[g];
-    c[g] = p && typeof p == "object" ? Array.isArray(p) ? [...p] : { ...p } : {}, c = c[g];
+    const b = n[f], p = c[b];
+    c[b] = p && typeof p == "object" ? Array.isArray(p) ? [...p] : { ...p } : {}, c = c[b];
   }
   return c[n[n.length - 1]] = r, s;
 }
@@ -2837,102 +2840,102 @@ const rr = ({
   onChange: s,
   transform: c,
   validate: f,
-  submitButton: g = { label: "Submit", variant: "primary" },
+  submitButton: b = { label: "Submit", variant: "primary" },
   cancelButton: p = { label: "Cancel", variant: "outline" },
-  showButtons: y = !0,
-  layout: u = "vertical",
+  showButtons: g = !0,
+  layout: m = "vertical",
   size: l = "md",
-  loading: d = !1,
+  loading: u = !1,
   className: h,
   ref: C,
   sdk: w
 }) => {
-  const [N, B] = V(a || {}), [x, q] = V({}), [K, H] = V({});
-  G(() => {
-    a && B({ ...a });
+  const [N, I] = V(a || {}), [v, q] = V({}), [B, U] = V({});
+  K(() => {
+    a && I({ ...a });
   }, [a]);
-  const F = ne(
-    (m, $, L) => {
-      const D = t.flatMap((P) => P.items).find((P) => P.name === m);
-      if (!D) return null;
-      if (D.required && ($ == null || $ === ""))
-        return `${D.label} is required`;
-      if (D.type === "array") {
-        if (D.required && (!$ || $.length === 0))
-          return `${D.label} cannot be empty.`;
-        if ($ && !Array.isArray($))
-          return `${D.label} must be an array.`;
-        if (Array.isArray($) && D.arrayFields) {
-          const P = [];
+  const F = ae(
+    (i, y, $) => {
+      const L = t.flatMap((D) => D.items).find((D) => D.name === i);
+      if (!L) return null;
+      if (L.required && (y == null || y === ""))
+        return `${L.label} is required`;
+      if (L.type === "array") {
+        if (L.required && (!y || y.length === 0))
+          return `${L.label} cannot be empty.`;
+        if (y && !Array.isArray(y))
+          return `${L.label} must be an array.`;
+        if (Array.isArray(y) && L.arrayFields) {
+          const D = [];
           let M = !1;
-          if ($.forEach((te, ae) => {
+          if (y.forEach((Q, re) => {
             const W = {};
-            for (const S of D.arrayFields) {
-              const I = te?.[S.name];
-              if (S.required && (I == null || I === ""))
+            for (const S of L.arrayFields) {
+              const A = Q?.[S.name];
+              if (S.required && (A == null || A === ""))
                 W[S.name] = `${S.label} is required`, M = !0;
               else if (S.validator) {
-                const O = S.validator(I, te);
+                const O = S.validator(A, Q);
                 O && (W[S.name] = O, M = !0);
               }
             }
-            P[ae] = W;
+            D[re] = W;
           }), M)
-            return JSON.stringify(P);
+            return JSON.stringify(D);
         }
       }
-      return D.validator ? D.validator($, L) : null;
+      return L.validator ? L.validator(y, $) : null;
     },
     [t]
-  ), E = ne(
-    (m, $) => {
-      let L = Mt(
+  ), E = ae(
+    (i, y) => {
+      let $ = Mt(
         N,
-        m,
-        $
+        i,
+        y
       );
-      t.flatMap((M) => M.items).find((M) => M.name === m)?.removeIfEmpty && ($ == null || $ === "") && (L = Et(L, m)), B(L), H((M) => ({ ...M, [m]: !0 }));
-      const P = F(m, $, L);
+      t.flatMap((M) => M.items).find((M) => M.name === i)?.removeIfEmpty && (y == null || y === "") && ($ = Et($, i)), I($), U((M) => ({ ...M, [i]: !0 }));
+      const D = F(i, y, $);
       q((M) => ({
         ...M,
-        [m]: P || ""
-      })), s?.(L, m);
+        [i]: D || ""
+      })), s?.($, i);
     },
     [N, t, F, s]
-  ), J = ne(
-    async (m) => {
-      if (console.log("handleSubmit"), m.preventDefault(), d) return;
-      const $ = {}, L = t.flatMap((P) => P.items);
-      for (const P of L) {
-        if (P.hidden || P.conditional && !P.conditional(N))
+  ), J = ae(
+    async (i) => {
+      if (console.log("handleSubmit"), i.preventDefault(), u) return;
+      const y = {}, $ = t.flatMap((D) => D.items);
+      for (const D of $) {
+        if (D.hidden || D.conditional && !D.conditional(N))
           continue;
         const M = F(
-          P.name,
-          Me(N, P.name),
+          D.name,
+          Me(N, D.name),
           N
         );
-        M && ($[P.name] = M);
+        M && (y[D.name] = M);
       }
       if (f) {
-        const P = f(N);
-        P && Object.assign($, P);
+        const D = f(N);
+        D && Object.assign(y, D);
       }
-      if (q($), console.log("newErrors", $), Object.keys($).some((P) => $[P]))
+      if (q(y), console.log("newErrors", y), Object.keys(y).some((D) => y[D]))
         return;
-      const D = c ? c(N) : N;
-      await r?.(N, D);
+      const L = c ? c(N) : N;
+      await r?.(N, L);
     },
-    [N, t, F, f, c, r, d]
-  ), z = ne(
-    (m) => {
-      const $ = Me(N, m.name), L = K[m.name] ? x[m.name] : void 0, D = m.disabled || d, P = {
-        value: $ || "",
-        disabled: D,
-        required: m.required,
-        placeholder: m.placeholder,
-        ...m.fieldProps
+    [N, t, F, f, c, r, u]
+  ), z = ae(
+    (i) => {
+      const y = Me(N, i.name), $ = B[i.name] ? v[i.name] : void 0, L = i.disabled || u, D = {
+        value: y || "",
+        disabled: L,
+        required: i.required,
+        placeholder: i.placeholder,
+        ...i.fieldProps
       };
-      switch (m.type) {
+      switch (i.type) {
         case "text":
         case "email":
         case "password":
@@ -2942,11 +2945,11 @@ const rr = ({
           return /* @__PURE__ */ e(
             ue,
             {
-              ...P,
-              onChange: (M) => E(m.name, M.target.value),
-              type: m.textType || m.type,
-              autoComplete: m.autocomplete,
-              error: L,
+              ...D,
+              onChange: (M) => E(i.name, M.target.value),
+              type: i.textType || i.type,
+              autoComplete: i.autocomplete,
+              error: $,
               size: l
             }
           );
@@ -2954,10 +2957,10 @@ const rr = ({
           return /* @__PURE__ */ e(
             Ne,
             {
-              ...P,
-              onChange: (M) => E(m.name, M.target.value),
+              ...D,
+              onChange: (M) => E(i.name, M.target.value),
               rows: 4,
-              error: L,
+              error: $,
               size: l
             }
           );
@@ -2965,16 +2968,16 @@ const rr = ({
           return /* @__PURE__ */ e(
             ve,
             {
-              ...P,
-              onChange: (M) => E(m.name, M),
-              options: (m.options || []).map((M) => ({
+              ...D,
+              onChange: (M) => E(i.name, M),
+              options: (i.options || []).map((M) => ({
                 ...M,
                 value: String(M.value)
               })),
-              searchable: m.searchable,
-              multiple: m.multiple,
-              allowCreate: m.allowCreate,
-              error: L,
+              searchable: i.searchable,
+              multiple: i.multiple,
+              allowCreate: i.allowCreate,
+              error: $,
               size: l
             }
           );
@@ -2982,23 +2985,23 @@ const rr = ({
           return /* @__PURE__ */ e(
             ge,
             {
-              ...P,
-              checked: !!$,
-              onChange: (M) => E(m.name, M.target.checked),
+              ...D,
+              checked: !!y,
+              onChange: (M) => E(i.name, M.target.checked),
               size: l
             }
           );
         case "radio":
-          return /* @__PURE__ */ e("div", { className: "space-y-1", children: m.options?.map((M) => /* @__PURE__ */ i("label", { className: "flex items-center gap-2", children: [
+          return /* @__PURE__ */ e("div", { className: "space-y-1", children: i.options?.map((M) => /* @__PURE__ */ d("label", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ e(
               "input",
               {
                 type: "radio",
-                name: m.name,
+                name: i.name,
                 value: M.value,
-                checked: $ === M.value,
-                onChange: () => E(m.name, M.value),
-                disabled: D || M.disabled,
+                checked: y === M.value,
+                onChange: () => E(i.name, M.value),
+                disabled: L || M.disabled,
                 className: "rounded-full border-neutral-100 dark:border-neutral-600"
               }
             ),
@@ -3008,9 +3011,9 @@ const rr = ({
           return /* @__PURE__ */ e(
             ye,
             {
-              ...P,
-              value: $ ? new Date($) : null,
-              onChange: (M) => E(m.name, M),
+              ...D,
+              value: y ? new Date(y) : null,
+              onChange: (M) => E(i.name, M),
               size: l
             }
           );
@@ -3018,10 +3021,10 @@ const rr = ({
           return /* @__PURE__ */ e(
             Lt,
             {
-              ...P,
-              value: $,
-              onChange: (M) => E(m.name, M),
-              error: L,
+              ...D,
+              value: y,
+              onChange: (M) => E(i.name, M),
+              error: $,
               onListFiles: (M) => w?.http.invoke({
                 method: "POST",
                 action: "storage.file.list",
@@ -3048,79 +3051,79 @@ const rr = ({
             }
           );
         case "custom":
-          return m.customComponent?.({
-            value: $,
-            onChange: (M) => E(m.name, M),
-            error: L,
-            disabled: D
+          return i.customComponent?.({
+            value: y,
+            onChange: (M) => E(i.name, M),
+            error: $,
+            disabled: L
           });
         case "array": {
-          const M = $ || [];
-          let te = [];
-          if (typeof L == "string" && L.startsWith("["))
+          const M = y || [];
+          let Q = [];
+          if (typeof $ == "string" && $.startsWith("["))
             try {
-              te = JSON.parse(L);
+              Q = JSON.parse($);
             } catch {
             }
-          const ae = () => {
-            E(m.name, [...M, {}]);
-          }, W = (I) => {
+          const re = () => {
+            E(i.name, [...M, {}]);
+          }, W = (A) => {
             E(
-              m.name,
-              M.filter((O, A) => A !== I)
+              i.name,
+              M.filter((O, T) => T !== A)
             );
-          }, S = (I, O, A) => {
-            const Q = [...M];
-            Q[I] = {
-              ...Q[I],
-              [O]: A
-            }, E(m.name, Q);
+          }, S = (A, O, T) => {
+            const ee = [...M];
+            ee[A] = {
+              ...ee[A],
+              [O]: T
+            }, E(i.name, ee);
           };
-          return /* @__PURE__ */ i("div", { className: "space-y-2", children: [
-            M.map((I, O) => /* @__PURE__ */ i(
+          return /* @__PURE__ */ d("div", { className: "space-y-2", children: [
+            M.map((A, O) => /* @__PURE__ */ d(
               "div",
               {
                 className: "p-4 border rounded-md dark:border-neutral-700 space-y-2 relative",
                 children: [
                   /* @__PURE__ */ e("div", { className: "absolute top-2 right-2", children: /* @__PURE__ */ e(
-                    ee,
+                    te,
                     {
                       type: "button",
                       variant: "ghost",
                       size: "sm",
                       onClick: () => W(O),
-                      disabled: D,
+                      disabled: L,
                       children: "Remove"
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: m.arrayFields?.map((A) => {
-                    const Q = te?.[O]?.[A.name];
-                    return /* @__PURE__ */ i(
+                  /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: i.arrayFields?.map((T) => {
+                    const ee = Q?.[O]?.[T.name];
+                    return /* @__PURE__ */ d(
                       "div",
                       {
                         className: "space-y-1",
                         children: [
-                          /* @__PURE__ */ e("label", { className: "block", children: /* @__PURE__ */ i(
+                          /* @__PURE__ */ e("label", { className: "block", children: /* @__PURE__ */ d(
                             Z,
                             {
                               variant: "label",
                               size: "sm",
                               className: "font-semibold text-neutral-700 dark:text-neutral-300",
                               children: [
-                                A.label,
-                                A.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
+                                T.label,
+                                T.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
                               ]
                             }
                           ) }),
                           (() => {
-                            const re = {
-                              value: I?.[A.name] || "",
-                              disabled: D,
-                              required: A.required,
-                              placeholder: A.placeholder,
-                              ...A.fieldProps
+                            const ne = {
+                              value: A?.[T.name] || "",
+                              disabled: L,
+                              required: T.required,
+                              placeholder: T.placeholder,
+                              ...T.fieldProps
                             };
-                            switch (A.type) {
+                            switch (T.type) {
                               case "text":
                               case "email":
                               case "password":
@@ -3130,15 +3133,15 @@ const rr = ({
                                 return /* @__PURE__ */ e(
                                   ue,
                                   {
-                                    ...re,
-                                    onChange: (U) => S(
+                                    ...ne,
+                                    onChange: (G) => S(
                                       O,
-                                      A.name,
-                                      U.target.value
+                                      T.name,
+                                      G.target.value
                                     ),
-                                    type: A.textType || A.type,
-                                    autoComplete: A.autocomplete,
-                                    error: Q,
+                                    type: T.textType || T.type,
+                                    autoComplete: T.autocomplete,
+                                    error: ee,
                                     size: l
                                   }
                                 );
@@ -3146,14 +3149,14 @@ const rr = ({
                                 return /* @__PURE__ */ e(
                                   Ne,
                                   {
-                                    ...re,
-                                    onChange: (U) => S(
+                                    ...ne,
+                                    onChange: (G) => S(
                                       O,
-                                      A.name,
-                                      U.target.value
+                                      T.name,
+                                      G.target.value
                                     ),
                                     rows: 4,
-                                    error: Q,
+                                    error: ee,
                                     size: l
                                   }
                                 );
@@ -3161,22 +3164,22 @@ const rr = ({
                                 return /* @__PURE__ */ e(
                                   ve,
                                   {
-                                    ...re,
-                                    onChange: (U) => S(
+                                    ...ne,
+                                    onChange: (G) => S(
                                       O,
-                                      A.name,
-                                      U
+                                      T.name,
+                                      G
                                     ),
-                                    options: (A.options || []).map(
-                                      (U) => ({
-                                        ...U,
-                                        value: String(U.value)
+                                    options: (T.options || []).map(
+                                      (G) => ({
+                                        ...G,
+                                        value: String(G.value)
                                       })
                                     ),
-                                    searchable: A.searchable,
-                                    multiple: A.multiple,
-                                    allowCreate: A.allowCreate,
-                                    error: Q,
+                                    searchable: T.searchable,
+                                    multiple: T.multiple,
+                                    allowCreate: T.allowCreate,
+                                    error: ee,
                                     size: l
                                   }
                                 );
@@ -3184,18 +3187,18 @@ const rr = ({
                                 return /* @__PURE__ */ e(
                                   ge,
                                   {
-                                    ...re,
-                                    checked: !!I?.[A.name],
-                                    onChange: (U) => S(
+                                    ...ne,
+                                    checked: !!A?.[T.name],
+                                    onChange: (G) => S(
                                       O,
-                                      A.name,
-                                      U.target.checked
+                                      T.name,
+                                      G.target.checked
                                     ),
                                     size: l
                                   }
                                 );
                               case "radio":
-                                return /* @__PURE__ */ e("div", { className: "space-y-1", children: A.options?.map((U) => /* @__PURE__ */ i(
+                                return /* @__PURE__ */ e("div", { className: "space-y-1", children: T.options?.map((G) => /* @__PURE__ */ d(
                                   "label",
                                   {
                                     className: "flex items-center gap-2",
@@ -3204,33 +3207,33 @@ const rr = ({
                                         "input",
                                         {
                                           type: "radio",
-                                          name: `${m.name}.${O}.${A.name}`,
-                                          value: U.value,
-                                          checked: I?.[A.name] === U.value,
+                                          name: `${i.name}.${O}.${T.name}`,
+                                          value: G.value,
+                                          checked: A?.[T.name] === G.value,
                                           onChange: () => S(
                                             O,
-                                            A.name,
-                                            U.value
+                                            T.name,
+                                            G.value
                                           ),
-                                          disabled: D || U.disabled,
+                                          disabled: L || G.disabled,
                                           className: "rounded-full border-neutral-100 dark:border-neutral-600"
                                         }
                                       ),
-                                      /* @__PURE__ */ e(Z, { variant: "label", size: "sm", children: U.label })
+                                      /* @__PURE__ */ e(Z, { variant: "label", size: "sm", children: G.label })
                                     ]
                                   },
-                                  U.value
+                                  G.value
                                 )) });
                               case "date": {
-                                const U = I?.[A.name];
+                                const G = A?.[T.name];
                                 return /* @__PURE__ */ e(
                                   ye,
                                   {
-                                    ...re,
-                                    value: U ? new Date(U) : null,
+                                    ...ne,
+                                    value: G ? new Date(G) : null,
                                     onChange: (le) => S(
                                       O,
-                                      A.name,
+                                      T.name,
                                       le
                                     ),
                                     size: l
@@ -3238,54 +3241,54 @@ const rr = ({
                                 );
                               }
                               case "custom":
-                                return A.customComponent?.({
-                                  value: I?.[A.name],
-                                  onChange: (U) => S(
+                                return T.customComponent?.({
+                                  value: A?.[T.name],
+                                  onChange: (G) => S(
                                     O,
-                                    A.name,
-                                    U
+                                    T.name,
+                                    G
                                   ),
-                                  error: Q,
-                                  disabled: D
+                                  error: ee,
+                                  disabled: L
                                 });
                               // Add other field types here as needed
                               default:
-                                return /* @__PURE__ */ i("p", { children: [
+                                return /* @__PURE__ */ d("p", { children: [
                                   "Unsupported field type in array:",
                                   " ",
-                                  A.type
+                                  T.type
                                 ] });
                             }
                           })(),
-                          Q && /* @__PURE__ */ e(
+                          ee && /* @__PURE__ */ e(
                             Z,
                             {
                               variant: "body",
                               size: "sm",
                               className: "text-red-600 dark:text-red-400",
-                              children: Q
+                              children: ee
                             }
                           )
                         ]
                       },
-                      A.name
+                      T.name
                     );
                   }) })
                 ]
               },
               O
             )),
-            /* @__PURE__ */ i(
-              ee,
+            /* @__PURE__ */ d(
+              te,
               {
                 type: "button",
                 variant: "outline",
                 size: "sm",
-                onClick: ae,
-                disabled: D,
+                onClick: re,
+                disabled: L,
                 children: [
                   "Add ",
-                  m.label
+                  i.label
                 ]
               }
             )
@@ -3295,33 +3298,33 @@ const rr = ({
           return null;
       }
     },
-    [N, K, x, d, l, E]
-  ), v = ne(
-    (m) => {
-      if (m.conditional && !m.conditional(N))
+    [N, B, v, u, l, E]
+  ), P = ae(
+    (i) => {
+      if (i.conditional && !i.conditional(N))
         return null;
-      const $ = m.items.filter((D) => !(D.hidden || D.conditional && !D.conditional(N)));
-      if ($.length === 0) return null;
-      const L = b(
+      const y = i.items.filter((L) => !(L.hidden || L.conditional && !L.conditional(N)));
+      if (y.length === 0) return null;
+      const $ = x(
         "space-y-2",
         {
-          "grid gap-2": m.layout === "grid",
-          "flex flex-wrap gap-2": m.layout === "flex"
+          "grid gap-2": i.layout === "grid",
+          "flex flex-wrap gap-2": i.layout === "flex"
         },
-        m.layout === "grid" && {
-          "grid-cols-1": !m.columns || m.columns === 1,
-          "grid-cols-2": m.columns === 2,
-          "grid-cols-3": m.columns === 3,
-          "grid-cols-4": m.columns === 4
+        i.layout === "grid" && {
+          "grid-cols-1": !i.columns || i.columns === 1,
+          "grid-cols-2": i.columns === 2,
+          "grid-cols-3": i.columns === 3,
+          "grid-cols-4": i.columns === 4
         },
-        m.className
+        i.className
       );
-      return /* @__PURE__ */ i(
+      return /* @__PURE__ */ d(
         "div",
         {
           className: "grid grid-cols-1 md:grid-cols-3 gap-8 p-6 border border-neutral dark:border-neutral-700 rounded-xl",
           children: [
-            /* @__PURE__ */ i("div", { className: "md:col-span-1", children: [
+            /* @__PURE__ */ d("div", { className: "md:col-span-1", children: [
               /* @__PURE__ */ e(
                 Z,
                 {
@@ -3329,52 +3332,52 @@ const rr = ({
                   size: "lg",
                   weight: "semibold",
                   className: "text-neutral-900 dark:text-neutral-100",
-                  children: m.title
+                  children: i.title
                 }
               ),
-              m.description && /* @__PURE__ */ e(
+              i.description && /* @__PURE__ */ e(
                 Z,
                 {
                   variant: "body",
                   size: "sm",
                   className: "text-neutral-600 dark:text-neutral-400 mt-1",
-                  children: m.description
+                  children: i.description
                 }
               )
             ] }),
-            /* @__PURE__ */ e("div", { className: "md:col-span-2", children: /* @__PURE__ */ e("div", { className: L, children: $.map((D) => (K[D.name] && x[D.name], /* @__PURE__ */ i(
+            /* @__PURE__ */ e("div", { className: "md:col-span-2", children: /* @__PURE__ */ e("div", { className: $, children: y.map((L) => (B[L.name] && v[L.name], /* @__PURE__ */ d(
               "div",
               {
-                className: b(
+                className: x(
                   "space-y-1",
-                  D.width && typeof D.width == "string" && `w-[${D.width}]`,
-                  D.width && typeof D.width == "number" && `col-span-${D.width}`
+                  L.width && typeof L.width == "string" && `w-[${L.width}]`,
+                  L.width && typeof L.width == "number" && `col-span-${L.width}`
                 ),
                 children: [
-                  D.type !== "custom" && /* @__PURE__ */ e("label", { className: "block", children: /* @__PURE__ */ i(
+                  L.type !== "custom" && /* @__PURE__ */ e("label", { className: "block", children: /* @__PURE__ */ d(
                     Z,
                     {
                       variant: "label",
                       size: "sm",
                       className: "font-medium text-neutral-700 dark:text-neutral-300",
                       children: [
-                        D.label,
-                        D.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
+                        L.label,
+                        L.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
                       ]
                     }
                   ) }),
-                  z(D)
+                  z(L)
                 ]
               },
-              D.name
+              L.name
             ))) }) })
           ]
         },
-        m.id
+        i.id
       );
     },
-    [N, K, x, z]
-  ), T = b(
+    [N, B, v, z]
+  ), H = x(
     "space-y-6",
     {
       "max-w-md": l === "sm",
@@ -3384,31 +3387,31 @@ const rr = ({
     },
     h
   );
-  return /* @__PURE__ */ i("form", { ref: C, onSubmit: J, className: T, children: [
-    /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(v) }),
-    y && /* @__PURE__ */ i("div", { className: b("flex gap-3 justify-end pt-8"), children: [
+  return /* @__PURE__ */ d("form", { ref: C, onSubmit: J, className: H, children: [
+    /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(P) }),
+    g && /* @__PURE__ */ d("div", { className: x("flex gap-3 justify-end pt-8"), children: [
       n && /* @__PURE__ */ e(
-        ee,
+        te,
         {
           type: "button",
           variant: p.variant,
           size: p.size || l,
-          disabled: p.disabled || d,
+          disabled: p.disabled || u,
           onClick: n,
           className: p.className,
           children: p.label
         }
       ),
       /* @__PURE__ */ e(
-        ee,
+        te,
         {
           type: "submit",
-          variant: g.variant,
-          size: g.size || l,
-          disabled: g.disabled || d,
-          loading: d,
-          className: g.className,
-          children: g.label
+          variant: b.variant,
+          size: b.size || l,
+          disabled: b.disabled || u,
+          loading: u,
+          className: b.className,
+          children: b.label
         }
       )
     ] })
@@ -3442,13 +3445,13 @@ function nr({
   dismissible: s = !1,
   onDismiss: c,
   className: f,
-  children: g,
+  children: b,
   ...p
 }) {
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ d(
     "span",
     {
-      className: b(
+      className: x(
         // Base styles
         "inline-flex items-center font-medium rounded-full",
         // Variant styles
@@ -3462,14 +3465,14 @@ function nr({
         r && /* @__PURE__ */ e(
           "span",
           {
-            className: b(
+            className: x(
               "w-2 h-2 rounded-full mr-1.5",
               Dt[t]
             )
           }
         ),
-        n && /* @__PURE__ */ e("span", { className: b("flex-shrink-0", g && "mr-1"), children: n }),
-        g,
+        n && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", b && "mr-1"), children: n }),
+        b,
         s && c && /* @__PURE__ */ e(
           "button",
           {
@@ -3516,20 +3519,20 @@ function ar({
   className: s,
   ...c
 }) {
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: b(
+      className: x(
         "inline-flex items-center",
         n ? "flex-col space-y-2" : "",
         s
       ),
       ...c,
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ d(
           "svg",
           {
-            className: b(
+            className: x(
               "animate-spin",
               Tt[t],
               At[a]
@@ -3564,7 +3567,7 @@ function ar({
         n && /* @__PURE__ */ e(
           "span",
           {
-            className: b(
+            className: x(
               "text-secondary-600 dark:text-secondary-400",
               It[t]
             ),
@@ -3584,23 +3587,23 @@ const lr = ({
   radius: s = "md",
   showLoading: c = !0,
   showError: f = !0,
-  fallback: g,
+  fallback: b,
   loadingContent: p,
-  errorContent: y,
-  className: u,
+  errorContent: g,
+  className: m,
   onLoad: l,
-  onError: d,
+  onError: u,
   ...h
 }) => {
-  const [C, w] = V(!0), [N, B] = V(!1), [x, q] = V(t), K = (T) => {
-    w(!1), B(!1), l?.(T);
-  }, H = (T) => {
-    if (w(!1), B(!0), g && x !== g) {
-      q(g), B(!1), w(!0);
+  const [C, w] = V(!0), [N, I] = V(!1), [v, q] = V(t), B = (H) => {
+    w(!1), I(!1), l?.(H);
+  }, U = (H) => {
+    if (w(!1), I(!0), b && v !== b) {
+      q(b), I(!1), w(!0);
       return;
     }
-    d?.(T);
-  }, F = b(
+    u?.(H);
+  }, F = x(
     "relative overflow-hidden bg-neutral-100 dark:bg-neutral-800",
     // Size variants
     {
@@ -3627,17 +3630,17 @@ const lr = ({
       "rounded-xl": s === "xl",
       "rounded-full": s === "full"
     },
-    u
-  ), E = b(
+    m
+  ), E = x(
     "w-full h-full object-cover transition-opacity duration-200",
     {
       "opacity-0": C || N,
       "opacity-100": !C && !N
     }
-  ), J = b(
+  ), J = x(
     "absolute inset-0 flex items-center justify-center",
     "text-neutral-400 dark:text-neutral-500"
-  ), z = /* @__PURE__ */ e("div", { className: "animate-pulse", children: /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-neutral-300 dark:bg-neutral-600 rounded" }) }), v = /* @__PURE__ */ i("div", { className: "text-center", children: [
+  ), z = /* @__PURE__ */ e("div", { className: "animate-pulse", children: /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-neutral-300 dark:bg-neutral-600 rounded" }) }), P = /* @__PURE__ */ d("div", { className: "text-center", children: [
     /* @__PURE__ */ e(
       "svg",
       {
@@ -3658,20 +3661,20 @@ const lr = ({
     ),
     /* @__PURE__ */ e("span", { className: "text-xs", children: "Failed to load" })
   ] });
-  return /* @__PURE__ */ i("div", { className: F, children: [
+  return /* @__PURE__ */ d("div", { className: F, children: [
     /* @__PURE__ */ e(
       "img",
       {
         ...h,
-        src: x,
+        src: v,
         alt: a,
         className: E,
-        onLoad: K,
-        onError: H
+        onLoad: B,
+        onError: U
       }
     ),
     C && c && /* @__PURE__ */ e("div", { className: J, children: p || z }),
-    N && f && /* @__PURE__ */ e("div", { className: J, children: y || v })
+    N && f && /* @__PURE__ */ e("div", { className: J, children: g || P })
   ] });
 }, sr = ({
   title: t,
@@ -3681,62 +3684,62 @@ const lr = ({
   className: s,
   backLabel: c = "Back",
   backClassName: f,
-  onBack: g,
+  onBack: b,
   editable: p = !1,
-  onTitleChange: y
+  onTitleChange: g
 }) => {
-  const [u, l] = V(!1), [d, h] = V(t), C = X(null);
-  G(() => {
+  const [m, l] = V(!1), [u, h] = V(t), C = X(null);
+  K(() => {
     h(t);
-  }, [t]), G(() => {
-    u && C.current && (C.current.focus(), C.current.select());
-  }, [u]);
+  }, [t]), K(() => {
+    m && C.current && (C.current.focus(), C.current.select());
+  }, [m]);
   const w = () => {
     p && l(!0);
   }, N = () => {
-    l(!1), d.trim() !== "" && d !== t && y ? y(d.trim()) : h(t);
-  }, B = (x) => {
-    x.key === "Enter" ? C.current?.blur() : x.key === "Escape" && (h(t), l(!1));
+    l(!1), u.trim() !== "" && u !== t && g ? g(u.trim()) : h(t);
+  }, I = (v) => {
+    v.key === "Enter" ? C.current?.blur() : v.key === "Escape" && (h(t), l(!1));
   };
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: b(
+      className: x(
         "p-5 pb-3 border-b border-neutral",
         s
       ),
       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-center gap-2 text-default", children: [
-            g && /* @__PURE__ */ e(
+        /* @__PURE__ */ d("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__ */ d("div", { className: "flex items-center gap-2 text-default", children: [
+            b && /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
-                onClick: g,
-                className: b(
+                onClick: b,
+                className: x(
                   "flex items-center text-sm cursor-pointer transition",
                   f
                 ),
                 children: /* @__PURE__ */ e(we, { size: 16, color: "currentColor" })
               }
             ),
-            u ? /* @__PURE__ */ e(
+            m ? /* @__PURE__ */ e(
               "input",
               {
                 ref: C,
                 type: "text",
-                value: d,
-                onChange: (x) => h(x.target.value),
+                value: u,
+                onChange: (v) => h(v.target.value),
                 onBlur: N,
-                onKeyDown: B,
+                onKeyDown: I,
                 className: "text-1xl font-semibold bg-transparent border-b-1 border-neutral rounded-lg outline-none focus:border-none px-1 -mx-1 min-w-0 flex-1"
               }
-            ) : /* @__PURE__ */ i("div", { className: "group flex items-center gap-1.5 min-w-0", children: [
+            ) : /* @__PURE__ */ d("div", { className: "group flex items-center gap-1.5 min-w-0", children: [
               /* @__PURE__ */ e(
                 "h2",
                 {
                   onClick: w,
-                  className: b(
+                  className: x(
                     "text-2xl font-semibold truncate",
                     p && "cursor-pointer"
                   ),
@@ -3755,37 +3758,37 @@ const lr = ({
             ] })
           ] }) }),
           r.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-wrap sm:flex-nowrap gap-2 sm:gap-3", children: r.map(
-            (x) => x.splitOptions && x.splitOptions.length > 0 ? /* @__PURE__ */ e(
+            (v) => v.splitOptions && v.splitOptions.length > 0 ? /* @__PURE__ */ e(
               ze,
               {
-                label: x.label,
-                onClick: x.onClick,
-                icon: x.icon,
-                variant: x.variant === "primary" ? "primary" : "secondary",
-                options: x.splitOptions,
-                disabled: x.disabled
+                label: v.label,
+                onClick: v.onClick,
+                icon: v.icon,
+                variant: v.variant === "primary" ? "primary" : "secondary",
+                options: v.splitOptions,
+                disabled: v.disabled
               },
-              x.id
-            ) : /* @__PURE__ */ i(
+              v.id
+            ) : /* @__PURE__ */ d(
               "button",
               {
                 type: "button",
                 onClick: (q) => {
-                  q.stopPropagation(), q.target.blur(), x.onClick();
+                  q.stopPropagation(), q.target.blur(), v.onClick();
                 },
-                disabled: x.disabled,
-                className: b("btn", {
-                  o__primary: x.variant === "primary",
-                  o__secondary: x.variant === "secondary" || x.variant === "outline",
-                  o__ghost: x.variant === "ghost",
-                  o__destructive: x.variant === "destructive"
+                disabled: v.disabled,
+                className: x("btn", {
+                  o__primary: v.variant === "primary",
+                  o__secondary: v.variant === "secondary" || v.variant === "outline",
+                  o__ghost: v.variant === "ghost",
+                  o__destructive: v.variant === "destructive"
                 }),
                 children: [
-                  x.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: x.icon }),
-                  x.label
+                  v.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: v.icon }),
+                  v.label
                 ]
               },
-              x.id
+              v.id
             )
           ) })
         ] }),
@@ -3799,8 +3802,8 @@ const lr = ({
   backLabel: r = "Back",
   className: n,
   children: s
-}) => /* @__PURE__ */ i("div", { className: b("flex items-center gap-2 mb-3", n), children: [
-  a && /* @__PURE__ */ i(
+}) => /* @__PURE__ */ d("div", { className: x("flex items-center gap-2 mb-3", n), children: [
+  a && /* @__PURE__ */ d(
     "button",
     {
       type: "button",
@@ -3813,7 +3816,7 @@ const lr = ({
     }
   ),
   s && /* @__PURE__ */ e("div", { className: "flex-1 min-w-0", children: s }),
-  t.length > 0 && /* @__PURE__ */ e("div", { className: b("flex flex-wrap gap-2", !s && "ml-auto"), children: t.map(
+  t.length > 0 && /* @__PURE__ */ e("div", { className: x("flex flex-wrap gap-2", !s && "ml-auto"), children: t.map(
     (c) => c.splitOptions && c.splitOptions.length > 0 ? /* @__PURE__ */ e(
       ze,
       {
@@ -3825,7 +3828,7 @@ const lr = ({
         disabled: c.disabled
       },
       c.id
-    ) : /* @__PURE__ */ i(
+    ) : /* @__PURE__ */ d(
       "button",
       {
         type: "button",
@@ -3833,7 +3836,7 @@ const lr = ({
           f.stopPropagation(), f.target.blur(), c.onClick();
         },
         disabled: c.disabled,
-        className: b("btn", {
+        className: x("btn", {
           o__primary: c.variant === "primary",
           o__secondary: c.variant === "secondary" || c.variant === "outline",
           o__ghost: c.variant === "ghost",
@@ -3860,25 +3863,25 @@ const cr = ({
   size: r = "md",
   className: n
 }) => {
-  const s = (u) => {
-    if (!u) return "-";
+  const s = (m) => {
+    if (!m) return "-";
     try {
-      return new Date(u).toLocaleDateString("nl-NL", {
+      return new Date(m).toLocaleDateString("nl-NL", {
         year: "numeric",
         month: "long",
         day: "numeric"
       });
     } catch {
-      return String(u);
+      return String(m);
     }
-  }, c = (u) => u ? "Ja" : "Nee", f = (u, l) => {
-    if (!l) return String(u || "-");
-    const d = l.find((h) => h.value === u);
-    return d ? d.label : String(u || "-");
-  }, g = ne(
-    (u) => {
-      const l = jt(a, u.name);
-      if (u.type === "array") {
+  }, c = (m) => m ? "Ja" : "Nee", f = (m, l) => {
+    if (!l) return String(m || "-");
+    const u = l.find((h) => h.value === m);
+    return u ? u.label : String(m || "-");
+  }, b = ae(
+    (m) => {
+      const l = jt(a, m.name);
+      if (m.type === "array") {
         const h = l;
         return !h || h.length === 0 ? /* @__PURE__ */ e(
           Z,
@@ -3888,12 +3891,12 @@ const cr = ({
             className: "text-neutral-500 dark:text-neutral-400",
             children: "Geen items"
           }
-        ) : /* @__PURE__ */ e("div", { className: "space-y-3", children: h.map((C, w) => /* @__PURE__ */ i(
+        ) : /* @__PURE__ */ e("div", { className: "space-y-3", children: h.map((C, w) => /* @__PURE__ */ d(
           "div",
           {
             className: "p-4 border border-neutral-200 dark:border-neutral-700 rounded-lg space-y-3",
             children: [
-              /* @__PURE__ */ e("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ i(
+              /* @__PURE__ */ e("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ d(
                 Z,
                 {
                   variant: "label",
@@ -3901,15 +3904,15 @@ const cr = ({
                   weight: "medium",
                   className: "text-neutral-700 dark:text-neutral-300",
                   children: [
-                    u.label,
+                    m.label,
                     " ",
                     w + 1
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: u.arrayFields?.map((N) => {
-                const B = C?.[N.name];
-                let x = "-";
+              /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: m.arrayFields?.map((N) => {
+                const I = C?.[N.name];
+                let v = "-";
                 switch (N.type) {
                   case "text":
                   case "email":
@@ -3917,30 +3920,30 @@ const cr = ({
                   case "tel":
                   case "url":
                   case "textarea":
-                    x = B || "-";
+                    v = I || "-";
                     break;
                   case "select":
                   case "radio":
-                    x = f(
-                      B,
+                    v = f(
+                      I,
                       N.options
                     );
                     break;
                   case "checkbox":
-                    x = c(B);
+                    v = c(I);
                     break;
                   case "date":
-                    x = s(B);
+                    v = s(I);
                     break;
                   case "custom":
-                    x = N.customComponent?.({
-                      value: B
+                    v = N.customComponent?.({
+                      value: I
                     });
                     break;
                   default:
-                    x = String(B || "-");
+                    v = String(I || "-");
                 }
-                return N.format && (x = N.format(B, C)), /* @__PURE__ */ i("div", { className: "space-y-1", children: [
+                return N.format && (v = N.format(I, C)), /* @__PURE__ */ d("div", { className: "space-y-1", children: [
                   /* @__PURE__ */ e(
                     Z,
                     {
@@ -3956,7 +3959,7 @@ const cr = ({
                       variant: "body",
                       size: "sm",
                       className: "text-neutral-900 dark:text-neutral-100",
-                      children: x
+                      children: v
                     }
                   )
                 ] }, N.name);
@@ -3966,10 +3969,10 @@ const cr = ({
           w
         )) });
       }
-      if (u.type === "custom" && u.customComponent)
-        return u.customComponent({ value: l });
-      if (u.format) {
-        const h = u.format(l, a);
+      if (m.type === "custom" && m.customComponent)
+        return m.customComponent({ value: l });
+      if (m.format) {
+        const h = m.format(l, a);
         return /* @__PURE__ */ e(
           Z,
           {
@@ -3980,31 +3983,31 @@ const cr = ({
           }
         );
       }
-      let d = "-";
-      switch (u.type) {
+      let u = "-";
+      switch (m.type) {
         case "text":
         case "email":
         case "password":
         case "number":
         case "tel":
         case "url":
-          d = l ? String(l) : "-";
+          u = l ? String(l) : "-";
           break;
         case "textarea":
-          d = l ? /* @__PURE__ */ e("div", { className: "whitespace-pre-wrap", children: String(l || "-") }) : "-";
+          u = l ? /* @__PURE__ */ e("div", { className: "whitespace-pre-wrap", children: String(l || "-") }) : "-";
           break;
         case "select":
         case "radio":
-          d = f(l, u.options);
+          u = f(l, m.options);
           break;
         case "checkbox":
-          d = c(l);
+          u = c(l);
           break;
         case "date":
-          d = s(l);
+          u = s(l);
           break;
         default:
-          d = l ? String(l) : "-";
+          u = l ? String(l) : "-";
       }
       return /* @__PURE__ */ e(
         Z,
@@ -4012,37 +4015,37 @@ const cr = ({
           variant: "body",
           size: "sm",
           className: "text-neutral-900 dark:text-neutral-100",
-          children: d
+          children: u
         }
       );
     },
     [a]
-  ), p = ne(
-    (u) => {
-      if (u.conditional && !u.conditional(a))
+  ), p = ae(
+    (m) => {
+      if (m.conditional && !m.conditional(a))
         return null;
-      const l = u.items.filter((h) => !(h.hidden || h.conditional && !h.conditional(a)));
+      const l = m.items.filter((h) => !(h.hidden || h.conditional && !h.conditional(a)));
       if (l.length === 0) return null;
-      const d = b(
+      const u = x(
         "space-y-4",
         {
-          "grid gap-4": u.layout === "grid",
-          "flex flex-wrap gap-4": u.layout === "flex"
+          "grid gap-4": m.layout === "grid",
+          "flex flex-wrap gap-4": m.layout === "flex"
         },
-        u.layout === "grid" && {
-          "grid-cols-1": !u.columns || u.columns === 1,
-          "grid-cols-2": u.columns === 2,
-          "grid-cols-3": u.columns === 3,
-          "grid-cols-4": u.columns === 4
+        m.layout === "grid" && {
+          "grid-cols-1": !m.columns || m.columns === 1,
+          "grid-cols-2": m.columns === 2,
+          "grid-cols-3": m.columns === 3,
+          "grid-cols-4": m.columns === 4
         },
-        u.className
+        m.className
       );
-      return /* @__PURE__ */ i(
+      return /* @__PURE__ */ d(
         "div",
         {
           className: "grid grid-cols-1 md:grid-cols-3 gap-8 p-6 border border-neutral dark:border-neutral-700 rounded-xl",
           children: [
-            /* @__PURE__ */ i("div", { className: "md:col-span-1", children: [
+            /* @__PURE__ */ d("div", { className: "md:col-span-1", children: [
               /* @__PURE__ */ e(
                 Z,
                 {
@@ -4050,23 +4053,23 @@ const cr = ({
                   size: "lg",
                   weight: "semibold",
                   className: "text-neutral-900 dark:text-neutral-100",
-                  children: u.title
+                  children: m.title
                 }
               ),
-              u.description && /* @__PURE__ */ e(
+              m.description && /* @__PURE__ */ e(
                 Z,
                 {
                   variant: "body",
                   size: "sm",
                   className: "text-neutral-600 dark:text-neutral-400 mt-1",
-                  children: u.description
+                  children: m.description
                 }
               )
             ] }),
-            /* @__PURE__ */ e("div", { className: "md:col-span-2", children: /* @__PURE__ */ e("div", { className: d, children: l.map((h) => /* @__PURE__ */ i(
+            /* @__PURE__ */ e("div", { className: "md:col-span-2", children: /* @__PURE__ */ e("div", { className: u, children: l.map((h) => /* @__PURE__ */ d(
               "div",
               {
-                className: b(
+                className: x(
                   "space-y-1",
                   h.width && typeof h.width == "string" && `w-[${h.width}]`,
                   h.width && typeof h.width == "number" && `col-span-${h.width}`
@@ -4081,18 +4084,18 @@ const cr = ({
                       children: h.label
                     }
                   ),
-                  g(h)
+                  b(h)
                 ]
               },
               h.name
             )) }) })
           ]
         },
-        u.id
+        m.id
       );
     },
-    [a, g]
-  ), y = b(
+    [a, b]
+  ), g = x(
     "space-y-6",
     {
       "max-w-md": r === "sm",
@@ -4102,21 +4105,21 @@ const cr = ({
     },
     n
   );
-  return /* @__PURE__ */ e("div", { className: y, children: /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(p) }) });
+  return /* @__PURE__ */ e("div", { className: g, children: /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(p) }) });
 }, Te = ({ item: t, isSelectedHandler: a, onClick: r }) => {
   const [n, s] = V(!1), c = t.children && t.children.length > 0, f = () => {
     c && s(!n);
-  }, g = a ? a(t.path) : !1;
-  return /* @__PURE__ */ i("li", { children: [
-    /* @__PURE__ */ i(
+  }, b = a ? a(t.path) : !1;
+  return /* @__PURE__ */ d("li", { children: [
+    /* @__PURE__ */ d(
       "div",
       {
-        className: b(
+        className: x(
           "flex flex-row w-full py-1 rounded-lg items-center h-8 transition-colors cursor-pointer px-3 pr-1 no-underline text-sm",
           {
-            "active-nav-item": g && !c,
-            "shadow-lvl-0": g && !c,
-            "font-semibold": g || c || t.children !== void 0
+            "active-nav-item": b && !c,
+            "shadow-lvl-0": b && !c,
+            "font-semibold": b || c || t.children !== void 0
           }
         ),
         onClick: () => {
@@ -4126,18 +4129,18 @@ const cr = ({
           t.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: t.icon }),
           /* @__PURE__ */ e("span", { className: "flex-1", children: t.label }),
           t.count !== void 0 && t.count > 0 && /* @__PURE__ */ e("span", { className: "ml-2 mr-1.5", children: t.count }),
-          c && /* @__PURE__ */ e("span", { className: `${n ? "collapsed" : ""}`, children: /* @__PURE__ */ e(qe, { className: "w-4 h-4 text-muted" }) })
+          c && /* @__PURE__ */ e("span", { className: `${n ? "collapsed" : ""}`, children: /* @__PURE__ */ e(He, { className: "w-4 h-4 text-muted" }) })
         ]
       }
     ),
-    c && !n && /* @__PURE__ */ e("ul", { className: "sidebar-menu-nested-items mb-1", children: t.children?.map((p, y) => /* @__PURE__ */ e(
+    c && !n && /* @__PURE__ */ e("ul", { className: "sidebar-menu-nested-items mb-1", children: t.children?.map((p, g) => /* @__PURE__ */ e(
       Te,
       {
         item: p,
         isSelectedHandler: a,
         onClick: r
       },
-      y
+      g
     )) })
   ] });
 }, ir = ({
@@ -4147,21 +4150,21 @@ const cr = ({
   isSelectedHandler: n,
   onClick: s,
   preMenuItemsComponent: c
-}) => /* @__PURE__ */ i("div", { className: "flex flex-col h-screen mb-6", children: [
-  /* @__PURE__ */ i("div", { className: "sidebar-menu-header", children: [
+}) => /* @__PURE__ */ d("div", { className: "flex flex-col h-screen mb-6", children: [
+  /* @__PURE__ */ d("div", { className: "sidebar-menu-header", children: [
     /* @__PURE__ */ e("span", { className: "text-xl font-semibold text-default mb-2", children: t }),
-    /* @__PURE__ */ e("div", { className: "sidebar-menu-actions", children: a?.map((f, g) => /* @__PURE__ */ e("span", { className: "sidebar-menu-action-icon", children: f }, g)) })
+    /* @__PURE__ */ e("div", { className: "sidebar-menu-actions", children: a?.map((f, b) => /* @__PURE__ */ e("span", { className: "sidebar-menu-action-icon", children: f }, b)) })
   ] }),
   c && /* @__PURE__ */ e("div", { className: "sidebar-menu-pre-items mb-4", children: c }),
   /* @__PURE__ */ e("ul", { children: r.map(
-    (f, g) => !f.path && !f.label && !f.children ? /* @__PURE__ */ e("span", { className: "flex w-full h-4" }, g) : /* @__PURE__ */ e(
+    (f, b) => !f.path && !f.label && !f.children ? /* @__PURE__ */ e("span", { className: "flex w-full h-4" }, b) : /* @__PURE__ */ e(
       Te,
       {
         item: f,
         isSelectedHandler: n,
         onClick: s
       },
-      g
+      b
     )
   ) })
 ] }), dr = ({
@@ -4172,21 +4175,21 @@ const cr = ({
   align: s = "left",
   truncate: c = !1,
   className: f,
-  children: g,
+  children: b,
   ...p
 }) => {
-  const y = a || Bt(t), u = b(
+  const g = a || Bt(t), m = x(
     "font-primary",
     // Size variants
     {
-      "text-xs": y === "xs",
-      "text-sm": y === "sm",
-      "text-base": y === "md",
-      "text-lg": y === "lg",
-      "text-xl": y === "xl",
-      "text-2xl": y === "2xl",
-      "text-3xl": y === "3xl",
-      "text-4xl": y === "4xl"
+      "text-xs": g === "xs",
+      "text-sm": g === "sm",
+      "text-base": g === "md",
+      "text-lg": g === "lg",
+      "text-xl": g === "xl",
+      "text-2xl": g === "2xl",
+      "text-3xl": g === "3xl",
+      "text-4xl": g === "4xl"
     },
     // Weight variants
     {
@@ -4220,7 +4223,7 @@ const cr = ({
     },
     f
   ), l = `h${t}`;
-  return /* @__PURE__ */ e(l, { className: u, ...p, children: g });
+  return /* @__PURE__ */ e(l, { className: m, ...p, children: b });
 };
 function Bt(t) {
   return {
@@ -4241,7 +4244,7 @@ const ur = ({
   className: c,
   itemClassName: f
 }) => {
-  const g = b(
+  const b = x(
     // Base styles
     "space-y-1",
     // Variant styles
@@ -4262,7 +4265,7 @@ const ur = ({
       "text-lg": n === "lg"
     },
     c
-  ), p = (l, d) => b(
+  ), p = (l, u) => x(
     // Base item styles
     "transition-colors duration-200",
     // Size-based padding
@@ -4281,44 +4284,44 @@ const ur = ({
       "opacity-50 cursor-not-allowed": !0
     },
     f
-  ), y = (l) => {
+  ), g = (l) => {
     s && !l.disabled && l.onClick && l.onClick();
-  }, u = (l, d) => {
-    s && !d.disabled && (l.key === "Enter" || l.key === " ") && (l.preventDefault(), d.onClick?.());
+  }, m = (l, u) => {
+    s && !u.disabled && (l.key === "Enter" || l.key === " ") && (l.preventDefault(), u.onClick?.());
   };
-  return a === "ordered" ? /* @__PURE__ */ e("ol", { className: g, children: t.map((l, d) => /* @__PURE__ */ e(
+  return a === "ordered" ? /* @__PURE__ */ e("ol", { className: b, children: t.map((l, u) => /* @__PURE__ */ e(
     "li",
     {
       className: p(l),
-      onClick: () => y(l),
-      onKeyDown: (h) => u(h, l),
+      onClick: () => g(l),
+      onKeyDown: (h) => m(h, l),
       tabIndex: s && !l.disabled ? 0 : void 0,
       role: s ? "button" : void 0,
       children: l.content
     },
-    l.id || d
-  )) }) : a === "description" ? /* @__PURE__ */ e("dl", { className: g, children: t.map((l, d) => /* @__PURE__ */ e(
+    l.id || u
+  )) }) : a === "description" ? /* @__PURE__ */ e("dl", { className: b, children: t.map((l, u) => /* @__PURE__ */ e(
     "div",
     {
       className: p(l),
-      onClick: () => y(l),
-      onKeyDown: (h) => u(h, l),
+      onClick: () => g(l),
+      onKeyDown: (h) => m(h, l),
       tabIndex: s && !l.disabled ? 0 : void 0,
       role: s ? "button" : void 0,
       children: l.content
     },
-    l.id || d
-  )) }) : /* @__PURE__ */ e("ul", { className: g, children: t.map((l, d) => /* @__PURE__ */ e(
+    l.id || u
+  )) }) : /* @__PURE__ */ e("ul", { className: b, children: t.map((l, u) => /* @__PURE__ */ e(
     "li",
     {
       className: p(l),
-      onClick: () => y(l),
-      onKeyDown: (h) => u(h, l),
+      onClick: () => g(l),
+      onKeyDown: (h) => m(h, l),
       tabIndex: s && !l.disabled ? 0 : void 0,
       role: s ? "button" : void 0,
       children: l.content
     },
-    l.id || d
+    l.id || u
   )) });
 }, mr = ({
   commands: t,
@@ -4328,46 +4331,46 @@ const ur = ({
   initialCommandPath: s,
   initialActiveIndex: c
 }) => {
-  const [f, g] = V(""), [p, y] = V(s || []), [u, l] = V(c || 0), d = X(null), h = X(null), w = (p.length ? t.find((N) => N.id === p[0])?.subCommands || [] : t).filter(
+  const [f, b] = V(""), [p, g] = V(s || []), [m, l] = V(c || 0), u = X(null), h = X(null), w = (p.length ? t.find((N) => N.id === p[0])?.subCommands || [] : t).filter(
     (N) => N.label.toLowerCase().includes(f.toLowerCase())
   );
-  return G(() => {
-    a || (g(""), y(s || []), l(c || 0));
-  }, [a]), G(() => {
-    const N = (B) => {
+  return K(() => {
+    a || (b(""), g(s || []), l(c || 0));
+  }, [a]), K(() => {
+    const N = (I) => {
       if (a) {
-        if (B.key === "Escape")
+        if (I.key === "Escape")
           r();
-        else if (B.key === "ArrowUp")
+        else if (I.key === "ArrowUp")
           l(
-            (x) => x > 0 ? x - 1 : w.length - 1
+            (v) => v > 0 ? v - 1 : w.length - 1
           );
-        else if (B.key === "ArrowDown")
+        else if (I.key === "ArrowDown")
           l(
-            (x) => x < w.length - 1 ? x + 1 : 0
+            (v) => v < w.length - 1 ? v + 1 : 0
           );
-        else if (B.key === "Enter") {
-          const x = w[u];
-          x && (x.subCommands ? (y([...p, x.id]), l(0)) : x.action && (x.action(), r()));
+        else if (I.key === "Enter") {
+          const v = w[m];
+          v && (v.subCommands ? (g([...p, v.id]), l(0)) : v.action && (v.action(), r()));
         }
       }
     };
     return document.addEventListener("keydown", N), () => document.removeEventListener("keydown", N);
-  }, [a, r, w, u, p]), G(() => {
-    const N = (B) => {
-      d.current && !d.current.contains(B.target) && r();
+  }, [a, r, w, m, p]), K(() => {
+    const N = (I) => {
+      u.current && !u.current.contains(I.target) && r();
     };
     return a && document.addEventListener("mousedown", N), () => document.removeEventListener("mousedown", N);
-  }, [a, r]), G(() => {
+  }, [a, r]), K(() => {
     if (!a) return;
-    h.current?.querySelector(`[data-index="${u}"]`)?.scrollIntoView({ block: "nearest" });
-  }, [u, a]), a ? /* @__PURE__ */ e("div", { className: "fixed inset-0 z-50 flex items-center justify-center shadow-lvl-0", children: /* @__PURE__ */ i(
+    h.current?.querySelector(`[data-index="${m}"]`)?.scrollIntoView({ block: "nearest" });
+  }, [m, a]), a ? /* @__PURE__ */ e("div", { className: "fixed inset-0 z-50 flex items-center justify-center shadow-lvl-0", children: /* @__PURE__ */ d(
     "div",
     {
       className: "flex flex-col w-full max-w-lg max-h-[80vh] p-2 mx-auto rounded-xl border border-neutral shadow-lg bg-module",
-      ref: d,
+      ref: u,
       children: [
-        /* @__PURE__ */ i("div", { className: "flex items-center gap-2 px-3 flex-shrink-0", children: [
+        /* @__PURE__ */ d("div", { className: "flex items-center gap-2 px-3 flex-shrink-0", children: [
           /* @__PURE__ */ e($e, { className: "w-4 h-4 text-muted shrink-0" }),
           /* @__PURE__ */ e(
             "input",
@@ -4376,31 +4379,31 @@ const ur = ({
               autoFocus: !0,
               placeholder: n?.searchPlaceholder || "Search commands...",
               value: f,
-              onChange: (N) => g(N.target.value),
+              onChange: (N) => b(N.target.value),
               className: "w-full py-2 text-default border-0 focus:outline-none focus:ring-0 focus:border-0 focus:shadow-none bg-transparent"
             }
           )
         ] }),
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ d(
           "div",
           {
             ref: h,
             className: "mt-2 pt-2 text-sm border-t border-neutral max-h-[50vh] overflow-y-auto",
             children: [
               w.length === 0 && /* @__PURE__ */ e("div", { className: "text-muted text-center text-sm", children: n?.noCommandsFound || "No commands found" }),
-              w.map((N, B) => /* @__PURE__ */ i(
+              w.map((N, I) => /* @__PURE__ */ d(
                 "div",
                 {
-                  "data-index": B,
-                  className: `flex items-center p-2 cursor-pointer rounded-md text-default ${B === u ? "bg-neutral-container" : ""}`,
+                  "data-index": I,
+                  className: `flex items-center p-2 cursor-pointer rounded-md text-default ${I === m ? "bg-neutral-container" : ""}`,
                   onClick: () => {
-                    N.subCommands ? (y([...p, N.id]), l(0)) : N.action && (N.action(), r());
+                    N.subCommands ? (g([...p, N.id]), l(0)) : N.action && (N.action(), r());
                   },
-                  onMouseEnter: () => l(B),
+                  onMouseEnter: () => l(I),
                   children: [
                     N.icon && /* @__PURE__ */ e("span", { className: "mr-3", children: N.icon }),
                     /* @__PURE__ */ e("span", { className: "flex-grow", children: N.label }),
-                    N.subCommands && /* @__PURE__ */ e("span", { className: "text-muted", children: /* @__PURE__ */ e(He, { className: "w-4 h-4" }) })
+                    N.subCommands && /* @__PURE__ */ e("span", { className: "text-muted", children: /* @__PURE__ */ e(qe, { className: "w-4 h-4" }) })
                   ]
                 },
                 N.id
@@ -4408,16 +4411,16 @@ const ur = ({
             ]
           }
         ),
-        /* @__PURE__ */ i("div", { className: "flex items-center gap-4 px-3 pt-2 mt-2 text-xs text-muted border-t border-neutral", children: [
-          /* @__PURE__ */ i("span", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ d("div", { className: "flex items-center gap-4 px-3 pt-2 mt-2 text-xs text-muted border-t border-neutral", children: [
+          /* @__PURE__ */ d("span", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ e("kbd", { className: "inline-flex items-center justify-center min-w-[1.25rem] px-1 py-0.5 rounded border border-neutral bg-module-subtle text-[10px] font-medium not-italic", children: "↑↓" }),
             n?.navigate || "to navigate"
           ] }),
-          /* @__PURE__ */ i("span", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ d("span", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ e("kbd", { className: "inline-flex items-center justify-center min-w-[1.25rem] px-1 py-0.5 rounded border border-neutral bg-module-subtle text-[10px] font-medium not-italic", children: "↵" }),
             n?.select || "to select"
           ] }),
-          /* @__PURE__ */ i("span", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ d("span", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ e("kbd", { className: "inline-flex items-center justify-center min-w-[1.25rem] px-1 py-0.5 rounded border border-neutral bg-module-subtle text-[10px] font-medium not-italic", children: "Esc" }),
             n?.close || "to close"
           ] })
@@ -4495,14 +4498,14 @@ const ur = ({
     shadow: s,
     border: c,
     borderColor: f,
-    className: g,
+    className: b,
     children: p,
-    ...y
-  }, u) => /* @__PURE__ */ e(
+    ...g
+  }, m) => /* @__PURE__ */ e(
     "div",
     {
-      ref: u,
-      className: b(
+      ref: m,
+      className: x(
         t && Pt[t],
         a && _t[a],
         r && Ot[r],
@@ -4510,15 +4513,15 @@ const ur = ({
         s && Ft[s],
         c && Wt[c],
         f && Rt[f],
-        g
+        b
       ),
-      ...y,
+      ...g,
       children: p
     }
   )
 );
 Ae.displayName = "Box";
-const fr = ({ children: t, title: a, ...r }) => /* @__PURE__ */ i(Ae, { background: "module", radius: "xl", shadow: "sm", ...r, children: [
+const fr = ({ children: t, title: a, ...r }) => /* @__PURE__ */ d(Ae, { background: "module", radius: "xl", shadow: "sm", ...r, children: [
   a && /* @__PURE__ */ e("span", { className: "text-base font-medium text-default mb-2", children: a }),
   t
 ] });
@@ -4530,44 +4533,44 @@ function hr({
   componentProps: s,
   className: c
 }) {
-  const f = X(null), [g, p] = V(!0), [y, u] = V(null), l = X(null);
-  return X(null), G(() => {
-    let d = !0;
+  const f = X(null), [b, p] = V(!0), [g, m] = V(null), l = X(null);
+  return X(null), K(() => {
+    let u = !0;
     return (async () => {
       p(!0);
       try {
         const C = await a();
-        if (!d) return;
+        if (!u) return;
         const w = C.component || C.default || C;
-        u(r === "react" ? () => w : () => C);
+        m(r === "react" ? () => w : () => C);
       } catch (C) {
         console.error(`[FederatedResource] Load failed: ${t}`, C);
       } finally {
-        d && p(!1);
+        u && p(!1);
       }
     })(), () => {
-      d = !1;
+      u = !1;
     };
-  }, [t, a]), G(() => {
-    if (g || !y || r === "react") return;
-    const d = f.current;
-    if (d) {
+  }, [t, a]), K(() => {
+    if (b || !g || r === "react") return;
+    const u = f.current;
+    if (u) {
       if (r === "svelte") {
-        const h = y.default || y, C = new h({ target: d, props: s || {} });
+        const h = g.default || g, C = new h({ target: u, props: s || {} });
         return l.current = C, () => C.$destroy();
       }
-      if (y.mount) {
-        const h = y.mount({ container: d, props: s || {} });
+      if (g.mount) {
+        const h = g.mount({ container: u, props: s || {} });
         return () => {
-          typeof h == "function" ? h() : y.unmount?.(d);
+          typeof h == "function" ? h() : g.unmount?.(u);
         };
       }
     }
-  }, [y, r, g]), G(() => {
+  }, [g, r, b]), K(() => {
     r === "svelte" && l.current && l.current.$set?.(s);
-  }, [s, r]), /* @__PURE__ */ i("div", { ref: f, className: c, style: { display: "contents" }, children: [
-    g && n,
-    r === "react" && y && /* @__PURE__ */ e(y, { ...s })
+  }, [s, r]), /* @__PURE__ */ d("div", { ref: f, className: c, style: { display: "contents" }, children: [
+    b && n,
+    r === "react" && g && /* @__PURE__ */ e(g, { ...s })
   ] });
 }
 class pr extends Ge {
@@ -4584,7 +4587,7 @@ class pr extends Ge {
     console.error(`[ErrorBoundary] Error in ${this.props.name || "Component"}:`, a, r);
   }
   render() {
-    return this.state.hasError ? this.props.fallback ? this.props.fallback : /* @__PURE__ */ i("div", { className: "p-4 m-4 border border-red-200 bg-red-50 rounded-lg", children: [
+    return this.state.hasError ? this.props.fallback ? this.props.fallback : /* @__PURE__ */ d("div", { className: "p-4 m-4 border border-red-200 bg-red-50 rounded-lg", children: [
       /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-red-800", children: "Something went wrong" }),
       /* @__PURE__ */ e("p", { className: "text-sm text-red-600 mt-1", children: this.props.name ? `Error in ${this.props.name}` : "The component failed to render." }),
       /* @__PURE__ */ e(
@@ -4601,7 +4604,7 @@ class pr extends Ge {
 export {
   nr as Badge,
   Ae as Box,
-  ee as Button,
+  te as Button,
   Qt as ButtonGroup,
   fr as Card,
   ge as Checkbox,
@@ -4636,7 +4639,7 @@ export {
   ue as TextField,
   Xt as VideoSurface,
   cr as View,
-  b as cn,
+  x as cn,
   Jt as createSizes,
   Kt as createVariants
 };