@opencxh/ui-kit 3.70.0 → 3.82.0

package/dist/index.js

@@ -1,7 +1,7 @@
 import { clsx as Ie } from "clsx";
 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";
+import se, { useRef as Z, useEffect as K, forwardRef as ce, useState as O, useCallback as ae, useMemo as de, createContext as Ue, Component as Ge } from "react";
 function x(...t) {
   return Ie(t);
 }
@@ -15,10 +15,10 @@ function Yt({ tiles: t, pinned: a, className: r }) {
   if (a)
     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)) })
+      t.length > 0 && /* @__PURE__ */ e("div", { className: "flex md:flex-col gap-2 md:w-48 overflow-auto", children: t.map((s, i) => /* @__PURE__ */ e("div", { className: "min-w-[160px] md:min-w-0", children: s }, i)) })
     ] });
   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: x("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, i) => /* @__PURE__ */ e("div", { children: s }, i)) });
 }
 function Zt({
   name: t,
@@ -26,8 +26,8 @@ function Zt({
   muted: r,
   speaking: n,
   hasVideo: s,
-  videoSlot: c,
-  className: f
+  videoSlot: i,
+  className: m
 }) {
   return /* @__PURE__ */ d(
     "div",
@@ -35,10 +35,10 @@ function Zt({
       className: x(
         "relative rounded-lg overflow-hidden bg-gray-800 aspect-video flex items-center justify-center",
         n && "ring-2 ring-emerald-400",
-        f
+        m
       ),
       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" }) }) }),
+        s && i ? /* @__PURE__ */ e("div", { className: "absolute inset-0", children: i }) : /* @__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__ */ 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 })
@@ -48,12 +48,12 @@ function Zt({
   );
 }
 function Xt({ attach: t, active: a = !0, mirrored: r = !1, className: n }) {
-  const s = X(null);
+  const s = Z(null);
   return K(() => {
     if (!a || !s.current) return;
-    const c = t(s.current);
+    const i = t(s.current);
     return () => {
-      typeof c == "function" && c(), s.current && (s.current.innerHTML = "");
+      typeof i == "function" && i(), s.current && (s.current.innerHTML = "");
     };
   }, [t, a]), /* @__PURE__ */ e(
     "div",
@@ -94,14 +94,14 @@ const Ke = {
     fullWidth: r = !1,
     loading: n = !1,
     leftIcon: s,
-    rightIcon: c,
-    iconOnly: f = !1,
-    className: b,
+    rightIcon: i,
+    iconOnly: m = !1,
+    className: g,
     children: p,
-    disabled: g,
-    ...m
+    disabled: b,
+    ...f
   }, l) => {
-    const u = g || n;
+    const u = b || n;
     return /* @__PURE__ */ d(
       "button",
       {
@@ -114,22 +114,22 @@ const Ke = {
           // Variant styles
           Ke[t],
           // Size styles
-          f ? Ye[a] : Je[a],
+          m ? Ye[a] : Je[a],
           // Full width
           r && "w-full",
           // Loading state
           n && "cursor-wait",
-          b
+          g
         ),
         disabled: u,
-        ...m,
+        ...f,
         children: [
           n && /* @__PURE__ */ d(
             "svg",
             {
               className: x(
                 "animate-spin",
-                f ? "h-4 w-4" : "h-4 w-4 mr-2"
+                m ? "h-4 w-4" : "h-4 w-4 mr-2"
               ),
               fill: "none",
               viewBox: "0 0 24 24",
@@ -156,10 +156,10 @@ const Ke = {
               ]
             }
           ),
-          !n && s && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", !f && "mr-2"), children: s }),
-          !f && p,
-          !n && c && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", !f && "ml-2"), children: c }),
-          f && !n && !s && !c && p
+          !n && s && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", !m && "mr-2"), children: s }),
+          !m && p,
+          !n && i && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", !m && "ml-2"), children: i }),
+          m && !n && !s && !i && p
         ]
       }
     );
@@ -173,7 +173,7 @@ const Qt = ({
   attached: n = !0,
   className: s
 }) => {
-  const c = x(
+  const i = x(
     "inline-flex",
     {
       // Orientation
@@ -195,21 +195,21 @@ const Qt = ({
     },
     s
   );
-  return /* @__PURE__ */ e("div", { className: c, role: "group", children: t });
+  return /* @__PURE__ */ e("div", { className: i, role: "group", children: t });
 }, er = ({
   variant: t = "default",
   size: a = "md",
   color: r = "primary",
   disabled: n = !1,
   external: s = !1,
-  className: c,
-  children: f,
-  href: b,
+  className: i,
+  children: m,
+  href: g,
   target: p,
-  rel: g,
-  ...m
+  rel: b,
+  ...f
 }) => {
-  const l = s || b && (b.startsWith("http") || b.startsWith("mailto:")), u = x(
+  const l = s || g && (g.startsWith("http") || g.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
@@ -262,15 +262,15 @@ const Qt = ({
     {
       "opacity-50 cursor-not-allowed pointer-events-none": n
     },
-    c
+    i
   ), h = {
-    ...m,
-    href: n ? void 0 : b,
+    ...f,
+    href: n ? void 0 : g,
     target: l ? "_blank" : p,
-    rel: l ? "noopener noreferrer" : g
+    rel: l ? "noopener noreferrer" : b
   };
   return /* @__PURE__ */ d("a", { className: u, ...h, children: [
-    f,
+    m,
     l && /* @__PURE__ */ e(
       "svg",
       {
@@ -305,24 +305,24 @@ function ze({
   variant: r = "primary",
   size: n = "md",
   icon: s,
-  options: c,
-  disabled: f = !1
+  options: i,
+  disabled: m = !1
 }) {
-  const [b, p] = V(!1), g = X(null), m = ae(() => {
+  const [g, p] = O(!1), b = Z(null), f = ae(() => {
     p((l) => !l);
   }, []);
   return K(() => {
     const l = (u) => {
-      g.current && !g.current.contains(u.target) && p(!1);
+      b.current && !b.current.contains(u.target) && p(!1);
     };
     return document.addEventListener("mousedown", l), () => document.removeEventListener("mousedown", l);
-  }, []), /* @__PURE__ */ d("div", { ref: g, className: "relative inline-flex items-center gap-px", children: [
+  }, []), /* @__PURE__ */ d("div", { ref: b, className: "relative inline-flex items-center gap-px", children: [
     /* @__PURE__ */ d(
       "button",
       {
         type: "button",
         onClick: a,
-        disabled: f,
+        disabled: m,
         className: x(
           "inline-flex items-center justify-center font-medium transition-colors duration-200",
           "focus:outline-none focus:ring-1 focus:ring-offset-1",
@@ -341,8 +341,8 @@ function ze({
       "button",
       {
         type: "button",
-        onClick: m,
-        disabled: f,
+        onClick: f,
+        disabled: m,
         className: x(
           "inline-flex items-center justify-center font-medium transition-colors duration-200",
           "focus:outline-none focus:ring-1 focus:ring-offset-1",
@@ -354,7 +354,7 @@ function ze({
         children: /* @__PURE__ */ e(Oe, { className: "h-4 w-4" })
       }
     ),
-    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(
+    g && i.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: i.map((l) => /* @__PURE__ */ e(
       "button",
       {
         type: "button",
@@ -388,21 +388,21 @@ const Xe = {
     error: r,
     size: n = "md",
     indeterminate: s = !1,
-    containerClassName: c,
-    labelClassName: f,
-    className: b,
+    containerClassName: i,
+    labelClassName: m,
+    className: g,
     id: p,
-    ...g
-  }, m) => {
+    ...b
+  }, f) => {
     const l = p || `checkbox-${Math.random().toString(36).substr(2, 9)}`, u = !!r;
     return se.useEffect(() => {
-      m && typeof m == "object" && m.current && (m.current.indeterminate = s);
-    }, [s, m]), /* @__PURE__ */ d("div", { className: x("flex flex-col", c), children: [
+      f && typeof f == "object" && f.current && (f.current.indeterminate = s);
+    }, [s, f]), /* @__PURE__ */ d("div", { className: x("flex flex-col", i), children: [
       /* @__PURE__ */ d("div", { className: "flex items-start", children: [
         /* @__PURE__ */ e("div", { className: "flex items-center h-5", children: /* @__PURE__ */ e(
           "input",
           {
-            ref: m,
+            ref: f,
             id: l,
             type: "checkbox",
             className: x(
@@ -417,9 +417,9 @@ const Xe = {
               // check glyph is white, so the fill must stay dark in both modes
               // (accent-fill would invert to near-white in dark → invisible check).
               u ? "border-error [&:not(:checked)]:bg-[var(--base-input)] text-error focus:border-error focus:ring-error" : "border-neutral [&:not(:checked)]:bg-[var(--base-input)] text-[#1a1a1a] focus:border-primary focus:ring-primary",
-              b
+              g
             ),
-            ...g
+            ...b
           }
         ) }),
         t && /* @__PURE__ */ d("div", { className: "ml-3 flex-1", children: [
@@ -431,7 +431,7 @@ const Xe = {
                 "font-medium cursor-pointer",
                 u ? "text-error" : "text-default",
                 Qe[n],
-                f
+                m
               ),
               children: t
             }
@@ -450,46 +450,46 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
   placeholder: r = "Select date",
   disabled: n = !1,
   required: s = !1,
-  size: c = "md",
-  className: f,
-  minDate: b,
+  size: i = "md",
+  className: m,
+  minDate: g,
   maxDate: p,
-  format: g = "MM/dd/yyyy"
-}, m) => {
-  const [l, u] = V(!1), [h, C] = V(() => t || /* @__PURE__ */ new Date()), w = X(null);
+  format: b = "MM/dd/yyyy"
+}, f) => {
+  const [l, u] = O(!1), [h, k] = O(() => t || /* @__PURE__ */ new Date()), C = Z(null);
   K(() => {
-    const z = (P) => {
-      w.current && !w.current.contains(P.target) && u(!1);
+    const T = (V) => {
+      C.current && !C.current.contains(V.target) && u(!1);
     };
-    return l && document.addEventListener("mousedown", z), () => {
-      document.removeEventListener("mousedown", z);
+    return l && document.addEventListener("mousedown", T), () => {
+      document.removeEventListener("mousedown", T);
     };
   }, [l]);
-  const N = (z) => {
-    if (!z) return "";
-    const P = z.getDate().toString().padStart(2, "0"), H = (z.getMonth() + 1).toString().padStart(2, "0"), i = z.getFullYear();
-    switch (g) {
+  const v = (T) => {
+    if (!T) return "";
+    const V = T.getDate().toString().padStart(2, "0"), W = (T.getMonth() + 1).toString().padStart(2, "0"), c = T.getFullYear();
+    switch (b) {
       case "dd/MM/yyyy":
-        return `${P}/${H}/${i}`;
+        return `${V}/${W}/${c}`;
       case "yyyy-MM-dd":
-        return `${i}-${H}-${P}`;
+        return `${c}-${W}-${V}`;
       case "MM/dd/yyyy":
       default:
-        return `${H}/${P}/${i}`;
+        return `${W}/${V}/${c}`;
     }
-  }, 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);
+  }, j = () => {
+    const T = h.getFullYear(), V = h.getMonth(), W = new Date(T, V, 1), c = new Date(W);
+    c.setDate(c.getDate() - W.getDay());
+    const y = [], L = new Date(c);
+    for (let S = 0; S < 42; S++)
+      y.push(new Date(L)), L.setDate(L.getDate() + 1);
     return y;
-  }, v = (z) => {
-    z.getMonth() === h.getMonth() && (b && z < b || p && z > p || (a?.(z), u(!1)));
+  }, N = (T) => {
+    T.getMonth() === h.getMonth() && (g && T < g || p && T > p || (a?.(T), u(!1)));
   }, q = () => {
-    C(new Date(h.getFullYear(), h.getMonth() - 1, 1));
-  }, B = () => {
-    C(new Date(h.getFullYear(), h.getMonth() + 1, 1));
+    k(new Date(h.getFullYear(), h.getMonth() - 1, 1));
+  }, P = () => {
+    k(new Date(h.getFullYear(), h.getMonth() + 1, 1));
   }, U = () => {
     a?.(null), u(!1);
   }, F = x(
@@ -499,13 +499,13 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
     "focus:outline-none focus:ring-2 focus:ring-primary/20 focus:border-primary",
     "disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-module-subtle",
     {
-      "px-3 py-2 text-sm": c === "sm",
-      "px-3 py-2 text-base": c === "md",
-      "px-4 py-3 text-lg": c === "lg",
-      "px-4 py-3 text-base": c === "full"
+      "px-3 py-2 text-sm": i === "sm",
+      "px-3 py-2 text-base": i === "md",
+      "px-4 py-3 text-lg": i === "lg",
+      "px-4 py-3 text-base": i === "full"
     },
-    f
-  ), E = I(), J = [
+    m
+  ), A = j(), H = [
     "January",
     "February",
     "March",
@@ -519,14 +519,14 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
     "November",
     "December"
   ];
-  return /* @__PURE__ */ d("div", { ref: w, className: "relative", children: [
+  return /* @__PURE__ */ d("div", { ref: C, className: "relative", children: [
     /* @__PURE__ */ d("div", { className: "relative", children: [
       /* @__PURE__ */ e(
         "input",
         {
-          ref: m,
+          ref: f,
           type: "text",
-          value: N(t ?? null),
+          value: v(t ?? null),
           placeholder: r,
           disabled: n,
           required: s,
@@ -557,39 +557,39 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
           }
         ),
         /* @__PURE__ */ d("h3", { className: "text-sm font-medium text-default", children: [
-          J[h.getMonth()],
+          H[h.getMonth()],
           " ",
           h.getFullYear()
         ] }),
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: B,
+            onClick: P,
             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, 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;
+      /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1 mb-2", children: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((T) => /* @__PURE__ */ e("div", { className: "text-xs font-medium text-muted text-center py-1", children: T }, T)) }),
+      /* @__PURE__ */ e("div", { className: "grid grid-cols-7 gap-1", children: A.map((T, V) => {
+        const W = T.getMonth() === h.getMonth(), c = t && T.toDateString() === t.toDateString(), y = T.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), L = !W || g && T < g || p && T > p;
         return /* @__PURE__ */ e(
           "button",
           {
-            onClick: () => !$ && v(z),
-            disabled: $,
+            onClick: () => !L && N(T),
+            disabled: L,
             className: x(
               "w-8 h-8 text-sm rounded transition-colors duration-200",
               {
-                "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": $
+                "text-default hover:bg-neutral-container": W && !c && !L,
+                "bg-primary text-white": c,
+                "bg-neutral-container text-default": y && !c,
+                "text-muted cursor-not-allowed": L
               }
             ),
-            children: z.getDate()
+            children: T.getDate()
           },
-          P
+          V
         );
       }) }),
       /* @__PURE__ */ d("div", { className: "flex justify-between items-center mt-4 pt-3 border-t border-neutral", children: [
@@ -665,96 +665,97 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
     error: r,
     size: n = "md",
     fullWidth: s = !1,
-    startIcon: c = /* @__PURE__ */ e(nt, {}),
-    loading: f = !1,
-    containerClassName: b,
+    startIcon: i = /* @__PURE__ */ e(nt, {}),
+    loading: m = !1,
+    containerClassName: g,
     labelClassName: p,
-    className: g,
-    id: m,
+    className: b,
+    id: f,
     options: l,
     onRemoteSearch: u,
     onSelect: h,
-    debounceTime: C = 500,
-    value: w,
-    onChange: N,
-    ...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);
+    debounceTime: k = 500,
+    showAllOnOpen: C = !1,
+    value: v,
+    onChange: j,
+    ...N
+  }, q) => {
+    const P = f || `searchfield-${Math.random().toString(36).substr(2, 9)}`, U = !!r, F = Z(null), A = Z(null), [H, T] = O(v || ""), [V, W] = O(!1), [c, y] = O(!1), [L, S] = O(!1);
     K(() => {
-      w !== void 0 && J(w);
-    }, [w]);
-    const y = de(() => {
-      if (!E) return l;
-      const W = String(E).toLowerCase();
+      v !== void 0 && T(v);
+    }, [v]);
+    const M = de(() => {
+      if (C && !L || !H) return l;
+      const z = String(H).toLowerCase();
       return l.filter(
-        (S) => String(S.label).toLowerCase().includes(W)
+        (D) => String(D.label).toLowerCase().includes(z)
       );
-    }, [E, l]);
+    }, [H, l, C, L]);
     K(() => {
-      if (!u || !E) {
-        i(!1);
+      if (!u || !H) {
+        y(!1);
         return;
       }
-      const W = setTimeout(async () => {
-        i(!0);
+      const z = setTimeout(async () => {
+        y(!0);
         try {
-          await u(String(E));
-        } catch (S) {
-          console.error("Remote search failed:", S);
+          await u(String(H));
+        } catch (D) {
+          console.error("Remote search failed:", D);
         } finally {
-          i(!1);
+          y(!1);
         }
-      }, C);
+      }, k);
       return () => {
-        clearTimeout(W), i(!1);
+        clearTimeout(z), y(!1);
       };
-    }, [E, C, u]), K(() => {
-      const W = (S) => {
-        U.current && !U.current.contains(S.target) && P(!1);
+    }, [H, k, u]), K(() => {
+      const z = (D) => {
+        F.current && !F.current.contains(D.target) && W(!1);
       };
-      return document.addEventListener("mousedown", W), () => document.removeEventListener("mousedown", W);
+      return document.addEventListener("mousedown", z), () => document.removeEventListener("mousedown", z);
     }, []);
-    const $ = (W) => {
-      const S = W.target.value;
-      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]);
+    const E = (z) => {
+      const D = z.target.value;
+      T(D), W(!0), S(!0), j && j(z);
+    }, Q = (z) => {
+      T(z.label), W(!1), S(!1), h && h(z.value);
+    }, re = () => {
+      (l.length > 0 || u) && (W(!0), S(!1));
+    }, X = m || c, $ = V && (M.length > 0 || X), I = de(() => q || A, [q]);
     return /* @__PURE__ */ d(
       "div",
       {
         className: ie(
           "flex flex-col",
           s ? "w-full" : "",
-          b || "",
+          g || "",
           "relative"
         ),
-        ref: U,
+        ref: F,
         children: [
           t && /* @__PURE__ */ e(
             "label",
             {
-              htmlFor: q,
+              htmlFor: P,
               className: ie(
                 "block text-sm font-medium mb-1",
-                B ? "text-error" : "text-default",
+                U ? "text-error" : "text-default",
                 p || ""
               ),
               children: t
             }
           ),
           /* @__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 }) }),
+            i && /* @__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: i }) }),
             /* @__PURE__ */ e(
               "input",
               {
-                ref: re,
-                id: q,
-                value: E,
-                onChange: $,
-                onFocus: D,
+                ref: I,
+                id: P,
+                value: H,
+                onChange: E,
+                onFocus: re,
                 className: ie(
                   // Base styles
                   "block w-full rounded-lg border transition-colors duration-200 bg-input",
@@ -763,17 +764,17 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
                   // Size styles
                   lt[n],
                   // Icon padding
-                  c ? "pl-10" : "",
+                  i ? "pl-10" : "",
                   "pr-10",
                   // Altijd padding rechts voor de dropdown/loading icon
                   // State styles
-                  B ? "border-red-500 text-error focus:border-red-500 focus:ring-red-500" : "border-neutral text-default",
-                  g || ""
+                  U ? "border-red-500 text-error focus:border-red-500 focus:ring-red-500" : "border-neutral text-default",
+                  b || ""
                 ),
-                ...I
+                ...N
               }
             ),
-            /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: M || f ? (
+            /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: X || m ? (
               // Loading Spinner
               /* @__PURE__ */ d(
                 "svg",
@@ -813,29 +814,31 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
                   className: ie(
                     "text-muted cursor-pointer transition-transform",
                     xe[n],
-                    z ? "rotate-180" : "rotate-0"
+                    V ? "rotate-180" : "rotate-0"
                   ),
-                  onClick: () => P((W) => !W)
+                  onClick: () => {
+                    W((z) => (z || S(!1), !z));
+                  }
                 }
               )
             ) })
           ] }),
-          Q && /* @__PURE__ */ e(
+          $ && /* @__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: y.length > 0 ? y.map((W) => /* @__PURE__ */ e(
+              children: M.length > 0 ? M.map((z) => /* @__PURE__ */ e(
                 "li",
                 {
                   className: "px-4 py-2 cursor-pointer text-default hover:bg-accent-container hover:text-accent transition-colors",
-                  onClick: () => L(W),
+                  onClick: () => Q(z),
                   role: "option",
-                  "aria-selected": E === W.label,
-                  children: W.label
+                  "aria-selected": H === z.label,
+                  children: z.label
                 },
-                W.value
-              )) : /* @__PURE__ */ e("li", { className: "px-4 py-2 text-muted", children: M || f ? "Zoeken op afstand..." : "Geen resultaten gevonden." })
+                z.value
+              )) : /* @__PURE__ */ e("li", { className: "px-4 py-2 text-muted", children: X || m ? "Zoeken op afstand..." : "Geen resultaten gevonden." })
             }
           ),
           (r || a) && /* @__PURE__ */ e(
@@ -843,14 +846,14 @@ const et = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
             {
               className: ie(
                 "mt-1 text-xs",
-                B ? "text-error" : "text-muted"
+                U ? "text-error" : "text-muted"
               ),
               children: r || a
             }
           ),
           u && /* @__PURE__ */ d("p", { className: "mt-2 text-xs text-success dark:text-success", children: [
             "Huidige zoekterm (niet-gedebounced): ",
-            String(E)
+            String(H)
           ] })
         ]
       }
@@ -870,83 +873,83 @@ const ot = {
     error: r,
     size: n = "md",
     fullWidth: s = !1,
-    options: c,
-    placeholder: f,
-    containerClassName: b,
+    options: i,
+    placeholder: m,
+    containerClassName: g,
     labelClassName: p,
-    className: g,
-    id: m,
+    className: b,
+    id: f,
     searchable: l,
     multiple: u,
     value: h,
-    onChange: C,
-    allowCreate: w,
-    onCreateOption: N,
-    ...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);
+    onChange: k,
+    allowCreate: C,
+    onCreateOption: v,
+    ...j
+  }, N) => {
+    const q = f || `select-${Math.random().toString(36).substr(2, 9)}`, P = !!r, [U, F] = se.useState(!1), [A, H] = se.useState(""), T = se.useRef(null), [V, W] = se.useState(i);
+    se.useImperativeHandle(N, () => T.current), se.useEffect(() => {
+      const $ = (I) => {
+        T.current && !T.current.contains(I.target) && F(!1);
       };
-      return document.addEventListener("mousedown", S), () => document.removeEventListener("mousedown", S);
+      return document.addEventListener("mousedown", $), () => document.removeEventListener("mousedown", $);
     }, []);
-    const i = se.useCallback(
-      (S, A) => S.some(
-        (O) => me(O.value) === me(A) || me(O.label) === me(A)
+    const c = se.useCallback(
+      ($, I) => $.some(
+        (z) => me(z.value) === me(I) || me(z.label) === me(I)
       ),
       []
     ), y = se.useCallback(
-      (S, A) => {
-        const O = [...S], T = (ee) => {
+      ($, I) => {
+        const z = [...$], D = (ee) => {
           const ne = (ee ?? "").trim();
-          ne && (i(O, ne) || O.push({ value: ne, label: ne }));
+          ne && (c(z, ne) || z.push({ value: ne, label: ne }));
         };
-        return Array.isArray(A) ? A.forEach(T) : T(A), O;
+        return Array.isArray(I) ? I.forEach(D) : D(I), z;
       },
-      [i]
+      [c]
     );
     se.useEffect(() => {
-      H((S) => {
-        const A = [...c];
-        return S.forEach((O) => {
-          !i(A, O.value) && !i(A, O.label) && A.push(O);
-        }), y(A, h);
+      W(($) => {
+        const I = [...i];
+        return $.forEach((z) => {
+          !c(I, z.value) && !c(I, z.label) && I.push(z);
+        }), y(I, h);
       });
-    }, [c, h, y, i]);
-    const $ = (S) => {
+    }, [i, h, y, c]);
+    const L = ($) => {
       if (u) {
-        const A = Array.isArray(h) ? h : [], O = A.includes(S) ? A.filter((T) => T !== S) : [...A, S];
-        C?.(O);
+        const I = Array.isArray(h) ? h : [], z = I.includes($) ? I.filter((D) => D !== $) : [...I, $];
+        k?.(z);
       } else
-        C?.(S), F(!1), J("");
-    }, L = u ? null : P.find((S) => S.value === h), D = u ? P.filter(
-      (S) => Array.isArray(h) && h.includes(S.value)
-    ) : [], M = l && E ? P.filter(
-      (S) => S.label.toLowerCase().includes(E.toLowerCase())
-    ) : 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
+        k?.($), F(!1), H("");
+    }, S = u ? null : V.find(($) => $.value === h), M = u ? V.filter(
+      ($) => Array.isArray(h) && h.includes($.value)
+    ) : [], E = l && A ? V.filter(
+      ($) => $.label.toLowerCase().includes(A.toLowerCase())
+    ) : V, Q = !!C && !!l && !!A.trim() && !c(V, A), re = ($) => {
+      const I = $.trim();
+      if (!I) return;
+      const z = v?.(I) ?? {
+        value: I,
+        label: I
       };
-      if (i(P, O.value) || i(P, O.label)) {
-        $(O.value), J(""), u || F(!1);
+      if (c(V, z.value) || c(V, z.label)) {
+        L(z.value), H(""), u || F(!1);
         return;
       }
-      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";
+      W((D) => [...D, z]), L(z.value), H(""), u || F(!1);
+    }, X = () => u ? M.length > 0 ? M.map(($) => $.label).join(", ") : m || "Select options" : S?.label || m || "Select an option";
     return /* @__PURE__ */ d(
       "div",
       {
-        ref: z,
+        ref: T,
         className: x(
           "relative flex flex-col",
           s && "w-full",
-          b
+          g
         ),
-        ...I,
+        ...j,
         children: [
           t && /* @__PURE__ */ e(
             "label",
@@ -955,7 +958,7 @@ const ot = {
               onClick: () => F(!U),
               className: x(
                 "block text-sm font-medium mb-1",
-                B ? "text-error" : "text-default",
+                P ? "text-error" : "text-default",
                 p
               ),
               children: t
@@ -974,10 +977,10 @@ const ot = {
                   "disabled:opacity-50 disabled:cursor-not-allowed",
                   "bg-module",
                   ot[n],
-                  B ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default",
-                  g
+                  P ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default",
+                  b
                 ),
-                children: /* @__PURE__ */ e("span", { className: "block truncate", children: W() })
+                children: /* @__PURE__ */ e("span", { className: "block truncate", children: X() })
               }
             ),
             U && /* @__PURE__ */ d("div", { className: "absolute z-10 mt-1 w-full rounded-md bg-module shadow-lg border border-neutral", children: [
@@ -986,10 +989,10 @@ const ot = {
                 {
                   type: "text",
                   placeholder: "Search...",
-                  value: E,
-                  onChange: (S) => J(S.target.value),
-                  onKeyDown: (S) => {
-                    S.key === "Enter" && Q && (S.preventDefault(), re(E));
+                  value: A,
+                  onChange: ($) => H($.target.value),
+                  onKeyDown: ($) => {
+                    $.key === "Enter" && Q && ($.preventDefault(), re(A));
                   },
                   className: x(
                     "w-full px-3 py-2 text-sm rounded-md border",
@@ -1004,51 +1007,51 @@ const ot = {
                     "px-4 py-2 text-sm cursor-pointer",
                     "text-primary hover:bg-neutral-container"
                   ),
-                  onClick: () => re(E),
+                  onClick: () => re(A),
                   children: [
                     "+: “",
-                    E.trim(),
+                    A.trim(),
                     "”"
                   ]
                 }
               ),
               /* @__PURE__ */ d("ul", { className: "max-h-60 overflow-auto py-1", children: [
-                f && !u && /* @__PURE__ */ e(
+                m && !u && /* @__PURE__ */ e(
                   "li",
                   {
                     className: "px-4 py-2 text-sm text-muted cursor-pointer hover:bg-neutral-container",
                     onClick: () => {
-                      C?.(""), F(!1);
+                      k?.(""), F(!1);
                     },
-                    children: f
+                    children: m
                   }
                 ),
-                M.map((S) => {
-                  const A = u ? Array.isArray(h) && h.includes(S.value) : h === S.value;
+                E.map(($) => {
+                  const I = u ? Array.isArray(h) && h.includes($.value) : h === $.value;
                   return /* @__PURE__ */ e(
                     "li",
                     {
-                      onClick: () => !S.disabled && $(S.value),
+                      onClick: () => !$.disabled && L($.value),
                       className: x(
                         "px-4 py-2 text-sm cursor-pointer",
                         "text-default",
-                        S.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-neutral-container",
-                        A && "font-semibold"
+                        $.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-neutral-container",
+                        I && "font-semibold"
                       ),
                       children: /* @__PURE__ */ d("div", { className: "flex items-center", children: [
                         u && /* @__PURE__ */ e(
                           "input",
                           {
                             type: "checkbox",
-                            checked: A,
+                            checked: I,
                             readOnly: !0,
                             className: "mr-3 h-4 w-4 rounded border-neutral [&:not(:checked)]:bg-[var(--base-input)] text-[#1a1a1a] focus:ring-primary"
                           }
                         ),
-                        /* @__PURE__ */ e("span", { children: S.label })
+                        /* @__PURE__ */ e("span", { children: $.label })
                       ] })
                     },
-                    S.value
+                    $.value
                   );
                 })
               ] })
@@ -1059,7 +1062,7 @@ const ot = {
             {
               className: x(
                 "mt-1 text-xs",
-                B ? "text-error" : "text-muted"
+                P ? "text-error" : "text-muted"
               ),
               children: r || a
             }
@@ -1082,24 +1085,24 @@ const ct = {
     error: r,
     size: n = "md",
     fullWidth: s = !1,
-    loading: c = !1,
-    containerClassName: f,
-    labelClassName: b,
+    loading: i = !1,
+    containerClassName: m,
+    labelClassName: g,
     className: p,
-    id: g,
-    rows: m = 4,
+    id: b,
+    rows: f = 4,
     ...l
   }, 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: [
+    const h = b || `textarea-${Math.random().toString(36).substr(2, 9)}`, k = !!r;
+    return /* @__PURE__ */ d("div", { className: x("flex flex-col", s && "w-full", m), children: [
       t && /* @__PURE__ */ e(
         "label",
         {
           htmlFor: h,
           className: x(
             "block text-sm font-medium mb-1",
-            C ? "text-error" : "text-default",
-            b
+            k ? "text-error" : "text-default",
+            g
           ),
           children: t
         }
@@ -1110,7 +1113,7 @@ const ct = {
           {
             ref: u,
             id: h,
-            rows: m,
+            rows: f,
             className: x(
               // Base styles
               "block w-full rounded-lg border transition-colors duration-200 resize-vertical bg-input",
@@ -1119,13 +1122,13 @@ const ct = {
               // Size styles
               ct[n],
               // State styles
-              C ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default",
+              k ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default",
               p
             ),
             ...l
           }
         ),
-        c && /* @__PURE__ */ e("div", { className: "absolute top-3 right-3", children: /* @__PURE__ */ d(
+        i && /* @__PURE__ */ e("div", { className: "absolute top-3 right-3", children: /* @__PURE__ */ d(
           "svg",
           {
             className: "animate-spin h-4 w-4 text-muted",
@@ -1160,7 +1163,7 @@ const ct = {
         {
           className: x(
             "mt-1 text-xs",
-            C ? "text-error" : "text-muted"
+            k ? "text-error" : "text-muted"
           ),
           children: r || a
         }
@@ -1186,37 +1189,37 @@ const it = {
     error: r,
     size: n = "md",
     fullWidth: s = !1,
-    startIcon: c,
-    endIcon: f,
-    loading: b = !1,
+    startIcon: i,
+    endIcon: m,
+    loading: g = !1,
     containerClassName: p,
-    labelClassName: g,
-    className: m,
+    labelClassName: b,
+    className: f,
     id: l,
     ...u
   }, h) => {
-    const C = l || `textfield-${Math.random().toString(36).substr(2, 9)}`, w = !!r;
+    const k = l || `textfield-${Math.random().toString(36).substr(2, 9)}`, C = !!r;
     return /* @__PURE__ */ d("div", { className: x("flex flex-col", s && "w-full", p), children: [
       t && /* @__PURE__ */ e(
         "label",
         {
-          htmlFor: C,
+          htmlFor: k,
           className: x(
             "block text-sm font-medium mb-1",
-            w ? "text-error" : "text-default",
-            g
+            C ? "text-error" : "text-default",
+            b
           ),
           children: t
         }
       ),
       /* @__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: x("text-muted", be[n]), children: c }) }),
+        i && // 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: x("text-muted", be[n]), children: i }) }),
         /* @__PURE__ */ e(
           "input",
           {
             ref: h,
-            id: C,
+            id: k,
             className: x(
               // Base styles
               "block w-full rounded-lg border transition-colors duration-200 bg-input",
@@ -1225,16 +1228,16 @@ const it = {
               // Size styles
               it[n],
               // Icon padding
-              c && "pl-10",
-              f && "pr-10",
+              i && "pl-10",
+              m && "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",
-              m
+              C ? "border-error text-error focus:border-error focus:ring-error" : "border-neutral text-default focus:border-primary focus:ring-primary",
+              f
             ),
             ...u
           }
         ),
-        (f || b) && /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: b ? /* @__PURE__ */ d(
+        (m || g) && /* @__PURE__ */ e("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center", children: g ? /* @__PURE__ */ d(
           "svg",
           {
             className: x("animate-spin text-muted", be[n]),
@@ -1262,14 +1265,14 @@ const it = {
               )
             ]
           }
-        ) : f && /* @__PURE__ */ e("span", { className: x("text-muted", be[n]), children: f }) })
+        ) : m && /* @__PURE__ */ e("span", { className: x("text-muted", be[n]), children: m }) })
       ] }),
       (r || a) && /* @__PURE__ */ e(
         "p",
         {
           className: x(
             "mt-1 text-xs",
-            w ? "text-error" : "text-muted"
+            C ? "text-error" : "text-muted"
           ),
           children: r || a
         }
@@ -1284,11 +1287,11 @@ const oe = ({
   color: r = "current",
   clickable: n = !1,
   onClick: s,
-  className: c,
-  "aria-label": f,
-  ...b
+  className: i,
+  "aria-label": m,
+  ...g
 }) => {
-  const p = typeof a == "number" ? a : dt(a), g = x(
+  const p = typeof a == "number" ? a : dt(a), b = x(
     "inline-block",
     // Color variants
     {
@@ -1307,20 +1310,20 @@ const oe = ({
       "cursor-pointer hover:opacity-80 transition-opacity duration-200": n,
       "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/20 rounded": n
     },
-    c
-  ), m = {
+    i
+  ), f = {
     size: p,
-    className: g,
+    className: b,
     onClick: n ? s : void 0,
-    "aria-label": f,
+    "aria-label": m,
     role: n ? "button" : void 0,
     tabIndex: n ? 0 : void 0,
     onKeyDown: n ? (l) => {
       (l.key === "Enter" || l.key === " ") && (l.preventDefault(), s?.());
     } : void 0,
-    ...b
+    ...g
   };
-  return /* @__PURE__ */ e(t, { ...m });
+  return /* @__PURE__ */ e(t, { ...f });
 };
 function dt(t) {
   return {
@@ -1346,26 +1349,26 @@ function ut({
       ] })
     ] }),
     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(
+      /* @__PURE__ */ e("div", { className: `grid grid-cols-${r} gap-2 bg-neutral-container p-3`, children: Array.from({ length: r }).map((s, i) => /* @__PURE__ */ e(
         "div",
         {
           className: "h-4 bg-neutral-border-emphasis rounded w-2/3"
         },
-        `header-${c}`
+        `header-${i}`
       )) }),
-      Array.from({ length: n }).map((s, c) => /* @__PURE__ */ e(
+      Array.from({ length: n }).map((s, i) => /* @__PURE__ */ e(
         "div",
         {
           className: `grid grid-cols-${r} gap-2 p-3 border-t border-neutral`,
-          children: Array.from({ length: r }).map((f, b) => /* @__PURE__ */ e(
+          children: Array.from({ length: r }).map((m, g) => /* @__PURE__ */ e(
             "div",
             {
               className: "h-4 bg-neutral-container-emphasis rounded w-full"
             },
-            `cell-${c}-${b}`
+            `cell-${i}-${g}`
           ))
         },
-        `row-${c}`
+        `row-${i}`
       ))
     ] })
   ] }) });
@@ -1376,95 +1379,95 @@ const mt = ({
   value: r,
   onSelect: n,
   placement: s = "bottom-start",
-  disabled: c = !1,
-  className: f,
-  showCheck: b = !0,
+  disabled: i = !1,
+  className: m,
+  showCheck: g = !0,
   header: p
 }) => {
-  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);
+  const [b, f] = O(!1), [l, u] = O(null), [h, k] = O({ top: 0, left: 0 }), [C, v] = O({}), j = Z(null), N = Z(null), q = Z(null), P = Z(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));
+    const c = (y) => {
+      j.current && (!j.current.contains(y.target) || q.current && !q.current.contains(y.target)) && (f(!1), u(null), P.current && (clearTimeout(P.current), P.current = null));
     };
-    return g && document.addEventListener("mousedown", i), () => {
-      document.removeEventListener("mousedown", i);
+    return b && document.addEventListener("mousedown", c), () => {
+      document.removeEventListener("mousedown", c);
     };
-  }, [g]), K(() => {
-    const i = (y) => {
-      y.key === "Escape" && (m(!1), u(null), B.current && (clearTimeout(B.current), B.current = null));
+  }, [b]), K(() => {
+    const c = (y) => {
+      y.key === "Escape" && (f(!1), u(null), P.current && (clearTimeout(P.current), P.current = null));
     };
-    return g && document.addEventListener("keydown", i), () => {
-      document.removeEventListener("keydown", i);
+    return b && document.addEventListener("keydown", c), () => {
+      document.removeEventListener("keydown", c);
     };
-  }, [g]), K(() => {
-    if (l && I.current) {
-      const i = I.current.querySelector(
+  }, [b]), K(() => {
+    if (l && j.current) {
+      const c = j.current.querySelector(
         `[data-option-value="${l}"]`
       );
-      if (i) {
-        const y = i.getBoundingClientRect();
-        C({
+      if (c) {
+        const y = c.getBoundingClientRect();
+        k({
           top: y.top,
           left: y.right + 8
         });
       }
     }
   }, [l]), K(() => () => {
-    B.current && clearTimeout(B.current);
+    P.current && clearTimeout(P.current);
   }, []);
-  const U = (i) => {
-    if (i.stopPropagation(), !c) {
-      if (!g) {
-        const y = v.current?.getBoundingClientRect();
+  const U = (c) => {
+    if (c.stopPropagation(), !i) {
+      if (!b) {
+        const y = N.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);
+          const S = {};
+          s.startsWith("bottom") ? S.top = y.bottom + 6 : S.bottom = window.innerHeight - y.top + 6, s.endsWith("start") ? S.left = y.left : S.right = window.innerWidth - y.right, v(S);
         }
       }
-      m(!g), u(null), B.current && (clearTimeout(B.current), B.current = null);
+      f(!b), u(null), P.current && (clearTimeout(P.current), P.current = null);
     }
-  }, 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(() => {
+  }, F = (c, y, L) => {
+    c.stopPropagation(), !y.disabled && !y.divider && (!y.children || y.children.length === 0) && (n?.(y.value, L), f(!1), u(null));
+  }, A = (c) => {
+    P.current && (clearTimeout(P.current), P.current = null), c.children && c.children.length > 0 ? u(c.value) : u(null);
+  }, H = (c) => {
+    c.children && c.children.length > 0 ? P.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(
+  }, T = (c, y, L) => {
+    c.stopPropagation(), !y.disabled && !y.divider && (n?.(y.value, L), f(!1), u(null));
+  }, V = x(
     "fixed z-[60] min-w-[200px] bg-module rounded-md shadow-lg border border-neutral",
     "max-h-60 overflow-auto"
-  ), H = x(
+  ), W = x(
     "fixed z-[60] min-w-[200px] bg-module rounded-md shadow-lg border border-neutral",
     "max-h-60 overflow-auto"
   );
   return /* @__PURE__ */ d(
     "div",
     {
-      ref: I,
+      ref: j,
       className: x(
         "relative flex flex-row items-center justify-center rounded-lg hover:bg-neutral-container",
-        f
+        m
       ),
       children: [
         /* @__PURE__ */ e(
           "button",
           {
-            ref: v,
+            ref: N,
             onClick: U,
-            disabled: c,
+            disabled: i,
             className: x("inline-flex items-center justify-center", {
-              "opacity-50 cursor-not-allowed": c
+              "opacity-50 cursor-not-allowed": i
             }),
             children: t
           }
         ),
-        g && /* @__PURE__ */ e("div", { className: P, style: w, children: /* @__PURE__ */ d("div", { className: "p-2", children: [
+        b && /* @__PURE__ */ e("div", { className: V, style: C, 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((i, y) => {
-            if (i.divider)
+          a.map((c, y) => {
+            if (c.divider)
               return /* @__PURE__ */ e(
                 "div",
                 {
@@ -1472,108 +1475,108 @@ const mt = ({
                 },
                 `divider-${y}`
               );
-            const $ = i.children && i.children.length > 0, L = l === i.value;
+            const L = c.children && c.children.length > 0, S = l === c.value;
             return /* @__PURE__ */ d("div", { className: "relative group", children: [
               /* @__PURE__ */ d(
                 "button",
                 {
-                  "data-option-value": i.value,
-                  onClick: (D) => F(D, i),
-                  onMouseEnter: () => E(i),
-                  onMouseLeave: () => J(i),
-                  disabled: i.disabled,
+                  "data-option-value": c.value,
+                  onClick: (M) => F(M, c),
+                  onMouseEnter: () => A(c),
+                  onMouseLeave: () => H(c),
+                  disabled: c.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": i.disabled,
-                      "bg-neutral-container": L && $
+                      "opacity-50 cursor-not-allowed": c.disabled,
+                      "bg-neutral-container": S && L
                     }
                   ),
                   children: [
                     /* @__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 }),
+                      c.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: c.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__ */ e("span", { className: "font-base truncate", children: c.label }),
+                        c.description && /* @__PURE__ */ e("span", { className: "text-xs text-muted", children: c.description })
                       ] })
                     ] }),
                     /* @__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: "▶" })
+                      g && r === c.value && /* @__PURE__ */ e("span", { className: "h-4 w-4 text-success flex-shrink-0 text-sm font-bold", children: "✓" }),
+                      L && /* @__PURE__ */ e("span", { className: "text-muted text-xs", children: "▶" })
                     ] })
                   ]
                 }
               ),
-              $ && L && /* @__PURE__ */ e(
+              L && S && /* @__PURE__ */ e(
                 "div",
                 {
                   ref: q,
-                  className: H,
+                  className: W,
                   style: {
                     top: `${h.top}px`,
                     left: `${h.left}px`
                   },
                   onMouseEnter: () => {
-                    B.current && (clearTimeout(B.current), B.current = null), u(i.value);
+                    P.current && (clearTimeout(P.current), P.current = null), u(c.value);
                   },
                   onMouseLeave: () => {
-                    B.current = setTimeout(() => {
+                    P.current = setTimeout(() => {
                       u(null);
                     }, 150);
                   },
-                  children: /* @__PURE__ */ e("div", { className: "p-2", children: i.children.map((D, M) => {
-                    if (D.divider)
+                  children: /* @__PURE__ */ e("div", { className: "p-2", children: c.children.map((M, E) => {
+                    if (M.divider)
                       return /* @__PURE__ */ e(
                         "div",
                         {
                           className: "border-t border-neutral my-2"
                         },
-                        `divider-${M}`
+                        `divider-${E}`
                       );
-                    const Q = typeof r == "object" && r[i.value] && r[i.value].includes(
-                      D.value
-                    ) || r === D.value;
+                    const Q = typeof r == "object" && r[c.value] && r[c.value].includes(
+                      M.value
+                    ) || r === M.value;
                     return /* @__PURE__ */ d(
                       "button",
                       {
-                        onClick: (re) => z(
+                        onClick: (re) => T(
                           re,
-                          D,
-                          i.value
+                          M,
+                          c.value
                         ),
-                        disabled: D.disabled,
+                        disabled: M.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": D.disabled
+                            "opacity-50 cursor-not-allowed": M.disabled
                           }
                         ),
                         children: [
                           /* @__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 }),
+                            M.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: M.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 })
+                              /* @__PURE__ */ e("span", { className: "font-base truncate", children: M.label }),
+                              M.description && /* @__PURE__ */ e("span", { className: "text-xs text-muted", children: M.description })
                             ] })
                           ] }),
-                          b && Q && /* @__PURE__ */ e("span", { className: "h-4 w-4 text-success flex-shrink-0 text-sm font-bold", children: "✓" })
+                          g && Q && /* @__PURE__ */ e("span", { className: "h-4 w-4 text-success flex-shrink-0 text-sm font-bold", children: "✓" })
                         ]
                       },
-                      D.value
+                      M.value
                     );
                   }) })
                 }
               )
-            ] }, i.value);
+            ] }, c.value);
           }),
           (() => {
-            const i = a.reduce((y, $) => {
-              if ($.divider) return y;
-              const L = $.children ? $.children.filter((D) => !D.divider).length : 0;
-              return y + 1 + L;
+            const c = a.reduce((y, L) => {
+              if (L.divider) return y;
+              const S = L.children ? L.children.filter((M) => !M.divider).length : 0;
+              return y + 1 + S;
             }, 0);
-            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,
+            return c > 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: [
+              c,
               " options available"
             ] }) });
           })()
@@ -1706,7 +1709,7 @@ const mt = ({
       }
     )
   }
-), De = () => /* @__PURE__ */ e(
+), Te = () => /* @__PURE__ */ e(
   "svg",
   {
     className: "h-4 w-4",
@@ -1742,7 +1745,7 @@ const mt = ({
       /* @__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__ */ e("span", { className: "text-muted text-sm group-open:rotate-180 transition-transform", children: /* @__PURE__ */ e(Te, {}) })
     ] }),
     /* @__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(
@@ -1776,98 +1779,98 @@ const mt = ({
   loading: r = !1,
   searchable: n = !1,
   searchPlaceholder: s = "Search...",
-  filters: c = [],
-  paginated: f = !1,
-  pageSizeOptions: b = [10, 25, 50, 100],
+  filters: i = [],
+  paginated: m = !1,
+  pageSizeOptions: g = [10, 25, 50, 100],
   defaultPageSize: p = 10,
-  actions: g = [],
-  onRowClick: m,
+  actions: b = [],
+  onRowClick: f,
   selectable: l = !1,
   selectedRows: u = [],
   onSelectionChange: h,
-  getRowKey: C = (U, F) => F,
-  emptyContent: w,
-  hoverable: N = !0,
-  bordered: I = !1,
-  striped: v = !1,
+  getRowKey: k = (U, F) => F,
+  emptyContent: C,
+  hoverable: v = !0,
+  bordered: j = !1,
+  striped: N = !1,
   className: q,
-  rowClassName: B
+  rowClassName: P
 }) => {
-  const [U, F] = V(""), [E, J] = V({
+  const [U, F] = O(""), [A, H] = O({
     column: null,
     direction: null
-  }), [z, P] = V({
+  }), [T, V] = O({
     page: 0,
     pageSize: p
-  }), H = X(null), i = de(() => {
+  }), W = Z(null), c = de(() => {
     let o = t;
     if (n && U.trim()) {
-      const k = a.filter(
+      const w = a.filter(
         (R) => R.searchable !== !1
       ), _ = 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(_);
+      o = o.filter((R) => w.some((B) => {
+        const J = typeof B.accessor == "function" ? B.accessor(R) : R[B.accessor];
+        return String(J || "").toLowerCase().includes(_);
       }));
     }
-    return c.forEach((k) => {
-      k.value && k.value !== "all" && (o = o.filter((_) => {
-        const R = a.find((Y) => Y.id === k.id);
+    return i.forEach((w) => {
+      w.value && w.value !== "all" && (o = o.filter((_) => {
+        const R = a.find((J) => J.id === w.id);
         if (!R) return !0;
-        const j = typeof R.accessor == "function" ? R.accessor(_) : _[R.accessor];
-        return String(j || "") === k.value;
+        const B = typeof R.accessor == "function" ? R.accessor(_) : _[R.accessor];
+        return String(B || "") === w.value;
       }));
     }), o;
-  }, [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 ? [...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;
-    }) : i;
-  }, [i, E, a]), $ = de(() => {
-    if (!f) return y;
-    const o = z.page * z.pageSize, k = o + z.pageSize;
-    return y.slice(o, k);
-  }, [y, z, f]), L = ae(
+  }, [t, U, a, n, i]), y = de(() => {
+    if (!A.column || !A.direction) return c;
+    const o = a.find((w) => w.id === A.column);
+    return o ? [...c].sort((w, _) => {
+      const R = typeof o.accessor == "function" ? o.accessor(w) : w[o.accessor], B = typeof o.accessor == "function" ? o.accessor(_) : _[o.accessor];
+      let J = 0;
+      return R < B ? J = -1 : R > B && (J = 1), A.direction === "desc" ? -J : J;
+    }) : c;
+  }, [c, A, a]), L = de(() => {
+    if (!m) return y;
+    const o = T.page * T.pageSize, w = o + T.pageSize;
+    return y.slice(o, w);
+  }, [y, T, m]), S = 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.find((_) => _.id === o)?.sortable && H((_) => _.column !== o ? { column: o, direction: "asc" } : _.direction === "asc" ? { column: o, direction: "desc" } : { column: null, direction: null });
     },
     [a]
-  ), D = ae((o) => {
-    P((k) => ({ ...k, page: o }));
-  }, []), M = ae((o) => {
-    P({ page: 0, pageSize: o });
+  ), M = ae((o) => {
+    V((w) => ({ ...w, page: o }));
+  }, []), E = ae((o) => {
+    V({ page: 0, pageSize: o });
   }, []), Q = ae(
-    (o, k) => {
+    (o, w) => {
       if (!h) return;
-      const _ = C(o, 0);
-      u.map((R, j) => C(R, j)), h(k ? [...u, o] : u.filter(
-        (R, j) => C(u[j], j) !== _
+      const _ = k(o, 0);
+      u.map((R, B) => k(R, B)), h(w ? [...u, o] : u.filter(
+        (R, B) => k(u[B], B) !== _
       ));
     },
-    [u, h, C]
+    [u, h, k]
   ), re = ae(
     (o) => {
-      h && h(o ? [...$] : []);
+      h && h(o ? [...L] : []);
     },
-    [$, h]
+    [L, h]
   );
   K(() => {
-    P((o) => ({ ...o, page: 0 }));
-  }, [U, E]), K(() => {
-    P((o) => ({ ...o, page: 0 }));
-  }, [c.map((o) => o.value).join(",")]);
-  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);
+    V((o) => ({ ...o, page: 0 }));
+  }, [U, A]), K(() => {
+    V((o) => ({ ...o, page: 0 }));
+  }, [i.map((o) => o.value).join(",")]);
+  const X = y.length, $ = Math.ceil(X / T.pageSize), I = T.page * T.pageSize + 1, z = Math.min(I + T.pageSize - 1, X), D = L.length > 0 && L.every((o) => {
+    const w = k(o, 0);
     return u.some(
-      (_, R) => C(_, R) === k
+      (_, R) => k(_, R) === w
     );
-  }), ee = $.some((o) => {
-    const k = C(o, 0);
+  }), ee = L.some((o) => {
+    const w = k(o, 0);
     return u.some(
-      (_, R) => C(_, R) === k
+      (_, R) => k(_, R) === w
     );
   }), ne = x(
     "w-full text-sm leading-5 text-[var(--text-default)] border-collapse",
@@ -1875,12 +1878,12 @@ const mt = ({
   ), G = x("bg-[var(--base-module)]"), le = x(
     "text-[var(--text-default)] p-3 border-b border-[var(--neutral-border)]"
   ), fe = x("h-12", {
-    "hover:bg-[var(--neutral-container)] dark:hover:bg-[var(--neutral-container-emphasis)]": N,
-    "cursor-pointer": m
+    "hover:bg-[var(--neutral-container)] dark:hover:bg-[var(--neutral-container-emphasis)]": v,
+    "cursor-pointer": f
   });
   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)),
+    (n || i.length > 0) && /* @__PURE__ */ e("div", { className: "pt-4 pb-2", children: /* @__PURE__ */ d("div", { className: "flex flex-wrap gap-4 items-start", children: [
+      i.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,
         {
@@ -1901,15 +1904,15 @@ const mt = ({
           tableColumns: a.length
         }
       ) }),
-      /* @__PURE__ */ d("table", { ref: H, className: x(ne, "min-w-full"), children: [
+      /* @__PURE__ */ d("table", { ref: W, 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: T,
+              checked: D,
               ref: (o) => {
-                o && (o.indeterminate = ee && !T);
+                o && (o.indeterminate = ee && !D);
               },
               onChange: (o) => re(o.target.checked),
               className: "rounded border-neutral [&:not(:checked)]:bg-[var(--base-input)] text-[#1a1a1a]"
@@ -1932,7 +1935,7 @@ const mt = ({
                 }
               ),
               style: { width: o.width },
-              onClick: () => o.sortable && L(o.id),
+              onClick: () => o.sortable && S(o.id),
               children: /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
                 o.headerCell ? o.headerCell() : o.header,
                 o.sortable && /* @__PURE__ */ d(
@@ -1940,19 +1943,19 @@ const mt = ({
                   {
                     className: x(
                       "flex flex-col opacity-0 group-hover:opacity-100 transition-opacity",
-                      E.column === o.id && "opacity-100"
+                      A.column === o.id && "opacity-100"
                     ),
                     children: [
                       /* @__PURE__ */ e(
                         ht,
                         {
-                          active: E.column === o.id && E.direction === "asc"
+                          active: A.column === o.id && A.direction === "asc"
                         }
                       ),
                       /* @__PURE__ */ e(
                         pt,
                         {
-                          active: E.column === o.id && E.direction === "desc"
+                          active: A.column === o.id && A.direction === "desc"
                         }
                       )
                     ]
@@ -1962,21 +1965,21 @@ const mt = ({
             },
             o.id
           )),
-          g.length > 0 && /* @__PURE__ */ e("th", { className: x(le, "w-20"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
+          b.length > 0 && /* @__PURE__ */ e("th", { className: x(le, "w-20"), children: /* @__PURE__ */ e("span", { className: "sr-only", children: "Actions" }) })
         ] }) }),
-        /* @__PURE__ */ e("tbody", { children: $.length === 0 || r ? !r && /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
+        /* @__PURE__ */ e("tbody", { children: L.length === 0 || r ? !r && /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
           "td",
           {
-            colSpan: a.length + (l ? 1 : 0) + (g.length > 0 ? 1 : 0),
+            colSpan: a.length + (l ? 1 : 0) + (b.length > 0 ? 1 : 0),
             className: x(
               le,
               "text-center py-8 text-muted"
             ),
-            children: w || "No data available"
+            children: C || "No data available"
           }
-        ) }) : $.map((o, k) => {
-          const _ = C(o, k), R = u.some(
-            (j, Y) => C(j, Y) === _
+        ) }) : L.map((o, w) => {
+          const _ = k(o, w), R = u.some(
+            (B, J) => k(B, J) === _
           );
           return /* @__PURE__ */ d(
             "tr",
@@ -1984,10 +1987,10 @@ const mt = ({
               className: x(
                 fe,
                 { "bg-accent-container": R },
-                B?.(o, k)
+                P?.(o, w)
               ),
-              onClick: (j) => {
-                j.stopPropagation(), m?.(o, k);
+              onClick: (B) => {
+                B.stopPropagation(), f?.(o, w);
               },
               children: [
                 l && /* @__PURE__ */ e("td", { className: le, children: /* @__PURE__ */ e(
@@ -1995,47 +1998,47 @@ const mt = ({
                   {
                     type: "checkbox",
                     checked: R,
-                    onChange: (j) => {
-                      j.stopPropagation(), Q(o, j.target.checked);
+                    onChange: (B) => {
+                      B.stopPropagation(), Q(o, B.target.checked);
                     },
                     className: "rounded border-neutral [&:not(:checked)]:bg-[var(--base-input)] text-[#1a1a1a]"
                   }
                 ) }),
-                a.map((j) => {
-                  const Y = typeof j.accessor == "function" ? j.accessor(o) : o[j.accessor];
+                a.map((B) => {
+                  const J = typeof B.accessor == "function" ? B.accessor(o) : o[B.accessor];
                   return /* @__PURE__ */ e(
                     "td",
                     {
                       className: x(le, {
-                        "text-left": j.align === "left" || !j.align,
-                        "text-center": j.align === "center",
-                        "text-right": j.align === "right",
-                        "sticky left-0 bg-module": j.sticky === "left",
-                        "sticky right-0 bg-module": j.sticky === "right"
+                        "text-left": B.align === "left" || !B.align,
+                        "text-center": B.align === "center",
+                        "text-right": B.align === "right",
+                        "sticky left-0 bg-module": B.sticky === "left",
+                        "sticky right-0 bg-module": B.sticky === "right"
                       }),
-                      children: j.cell ? j.cell(Y, o, k) : String(Y || "")
+                      children: B.cell ? B.cell(J, o, w) : String(J || "")
                     },
-                    j.id
+                    B.id
                   );
                 }),
-                g.length > 0 && /* @__PURE__ */ e("td", { className: le, children: /* @__PURE__ */ e(
+                b.length > 0 && /* @__PURE__ */ e("td", { className: le, children: /* @__PURE__ */ e(
                   mt,
                   {
                     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, {})
+                      /* @__PURE__ */ e(Te, {})
                     ] }),
-                    options: g.map((j) => ({
-                      value: j.id,
-                      label: j.label,
-                      icon: j.icon,
-                      disabled: j.disabled?.(o)
+                    options: b.map((B) => ({
+                      value: B.id,
+                      label: B.label,
+                      icon: B.icon,
+                      disabled: B.disabled?.(o)
                     })),
-                    onSelect: (j) => {
-                      const Y = g.find(
-                        (he) => he.id === j
+                    onSelect: (B) => {
+                      const J = b.find(
+                        (he) => he.id === B
                       );
-                      Y && Y.onClick(o, k);
+                      J && J.onClick(o, w);
                     },
                     placement: "bottom-end"
                   }
@@ -2047,15 +2050,15 @@ const mt = ({
         }) })
       ] })
     ] }),
-    f && W > 0 && /* @__PURE__ */ d("div", { className: "flex items-center justify-between px-6", children: [
+    m && X > 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 ",
-          A,
+          I,
           " to ",
-          O,
+          z,
           " of ",
-          W,
+          X,
           " results"
         ] }),
         /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
@@ -2063,10 +2066,10 @@ const mt = ({
           /* @__PURE__ */ e(
             "select",
             {
-              value: z.pageSize,
-              onChange: (o) => M(Number(o.target.value)),
+              value: T.pageSize,
+              onChange: (o) => E(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: b.map((o) => /* @__PURE__ */ e("option", { value: o, children: o }, o))
+              children: g.map((o) => /* @__PURE__ */ e("option", { value: o, children: o }, o))
             }
           )
         ] })
@@ -2077,8 +2080,8 @@ const mt = ({
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => D(0),
-            disabled: z.page === 0,
+            onClick: () => M(0),
+            disabled: T.page === 0,
             iconOnly: !0,
             children: /* @__PURE__ */ e(gt, {})
           }
@@ -2088,25 +2091,25 @@ const mt = ({
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => D(z.page - 1),
-            disabled: z.page === 0,
+            onClick: () => M(T.page - 1),
+            disabled: T.page === 0,
             iconOnly: !0,
             children: /* @__PURE__ */ e(xt, {})
           }
         ),
         /* @__PURE__ */ d("span", { className: "px-3 py-1 text-sm text-muted", children: [
           "Page ",
-          z.page + 1,
+          T.page + 1,
           " of ",
-          S
+          $
         ] }),
         /* @__PURE__ */ e(
           te,
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => D(z.page + 1),
-            disabled: z.page >= S - 1,
+            onClick: () => M(T.page + 1),
+            disabled: T.page >= $ - 1,
             iconOnly: !0,
             children: /* @__PURE__ */ e(bt, {})
           }
@@ -2116,8 +2119,8 @@ const mt = ({
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => D(S - 1),
-            disabled: z.page >= S - 1,
+            onClick: () => M($ - 1),
+            disabled: T.page >= $ - 1,
             iconOnly: !0,
             children: /* @__PURE__ */ e(yt, {})
           }
@@ -2131,19 +2134,19 @@ const mt = ({
   onTabChange: r,
   className: n
 }) => {
-  const [s, c] = V(t[0]?.id || ""), f = a || s, b = (p) => {
-    r ? r(p) : c(p);
+  const [s, i] = O(t[0]?.id || ""), m = a || s, g = (p) => {
+    r ? r(p) : i(p);
   };
   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 && b(p.id),
+      onClick: () => !p.disabled && g(p.id),
       disabled: p.disabled,
       className: x(
         "border-b-2 py-2 px-1 text-sm font-medium transition-colors duration-200",
         {
-          "border-primary text-primary": f === p.id,
-          "border-transparent text-neutral-500 hover:text-neutral-700 dark:text-neutral-400 dark:hover:text-neutral-300": f !== p.id && !p.disabled,
+          "border-primary text-primary": m === p.id,
+          "border-transparent text-neutral-500 hover:text-neutral-700 dark:text-neutral-400 dark:hover:text-neutral-300": m !== p.id && !p.disabled,
           "border-transparent text-neutral-300 cursor-not-allowed dark:text-neutral-600": p.disabled
         }
       ),
@@ -2151,7 +2154,7 @@ const mt = ({
         p.label,
         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"
+          m === 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,17 +2166,17 @@ const mt = ({
   activeTab: r,
   onTabChange: n,
   variant: s = "default",
-  size: c = "md",
-  className: f
+  size: i = "md",
+  className: m
 }) => {
-  const [b, p] = V(
+  const [g, p] = O(
     a || r || t[0]?.id || ""
-  ), g = r || b, m = (w) => {
-    n ? n(w) : p(w);
+  ), b = r || g, f = (C) => {
+    n ? n(C) : p(C);
   }, l = {
-    activeTab: g,
-    setActiveTab: m
-  }, u = t.find((w) => w.id === g), h = x(
+    activeTab: b,
+    setActiveTab: f
+  }, u = t.find((C) => C.id === b), h = x(
     "flex",
     {
       "border-b border-neutral-200 dark:border-neutral-700 px-2": s === "default" || s === "underline",
@@ -2181,12 +2184,12 @@ const mt = ({
       "space-x-1": s === "pills",
       "space-x-8": s === "default" || s === "underline"
     },
-    f
-  ), C = (w, N) => {
-    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"
+    m
+  ), k = (C, v) => {
+    const j = "transition-colors duration-200 font-medium", N = {
+      "text-xs px-2 py-1": i === "sm",
+      "text-sm px-3 py-2": i === "md",
+      "text-base px-4 py-3": i === "lg"
     }, q = {
       // Default variant
       "border-b-2 -mb-px": s === "default",
@@ -2194,43 +2197,43 @@ const mt = ({
       "rounded-md": s === "pills",
       // Underline variant
       "border-b-2 pb-2": s === "underline"
-    }, B = {
-      "opacity-50 cursor-not-allowed": w.disabled,
-      "cursor-pointer": !w.disabled
-    }, U = N ? {
+    }, P = {
+      "opacity-50 cursor-not-allowed": C.disabled,
+      "cursor-pointer": !C.disabled
+    }, U = v ? {
       "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 ? {
+    } : {}, F = !v && !C.disabled ? {
       "border-transparent text-neutral-600 hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-neutral-100": s === "default",
       "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 x(I, v, q, B, U, F);
+    return x(j, N, q, P, U, F);
   };
   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(
+    /* @__PURE__ */ e("div", { className: h, role: "tablist", children: t.map((C) => /* @__PURE__ */ e(
       "button",
       {
         type: "button",
         role: "tab",
-        "aria-selected": g === w.id,
-        "aria-controls": `tabpanel-${w.id}`,
-        disabled: w.disabled,
-        onClick: () => !w.disabled && m(w.id),
-        className: C(w, g === w.id),
+        "aria-selected": b === C.id,
+        "aria-controls": `tabpanel-${C.id}`,
+        disabled: C.disabled,
+        onClick: () => !C.disabled && f(C.id),
+        className: k(C, b === C.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 })
+          C.label,
+          C.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: C.badge })
         ] })
       },
-      w.id
+      C.id
     )) }),
     u?.content && /* @__PURE__ */ e(
       "div",
       {
         role: "tabpanel",
-        id: `tabpanel-${g}`,
-        "aria-labelledby": `tab-${g}`,
+        id: `tabpanel-${b}`,
+        "aria-labelledby": `tab-${b}`,
         className: "mt-4",
         children: u.content
       }
@@ -2249,25 +2252,25 @@ function Ct({
   title: r,
   size: n = "md",
   closeOnBackdropClick: s = !0,
-  closeOnEscape: c = !0,
-  className: f,
-  backdropClassName: b,
+  closeOnEscape: i = !0,
+  className: m,
+  backdropClassName: g,
   children: p,
-  footer: g,
-  showCloseButton: m = !0
+  footer: b,
+  showCloseButton: f = !0
 }) {
-  const l = X(null), u = X(null);
+  const l = Z(null), u = Z(null);
   K(() => {
-    if (!t || !c) return;
-    const C = (w) => {
-      w.key === "Escape" && a();
+    if (!t || !i) return;
+    const k = (C) => {
+      C.key === "Escape" && a();
     };
-    return document.addEventListener("keydown", C), () => document.removeEventListener("keydown", C);
-  }, [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 = ""), () => {
+    return document.addEventListener("keydown", k), () => document.removeEventListener("keydown", k);
+  }, [t, i, 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) => {
-    s && C.target === C.currentTarget && a();
+  const h = (k) => {
+    s && k.target === k.currentTarget && a();
   };
   return t ? /* @__PURE__ */ e(
     "div",
@@ -2276,7 +2279,7 @@ function Ct({
         "fixed inset-0 z-50 flex items-center justify-center p-4",
         "bg-black/20",
         // 'animate-fade-in',
-        b
+        g
       ),
       onClick: h,
       children: /* @__PURE__ */ d(
@@ -2288,14 +2291,14 @@ function Ct({
             // 'animate-scale-in',
             "focus:outline-none",
             kt[n],
-            f
+            m
           ),
           role: "dialog",
           "aria-modal": "true",
           "aria-labelledby": r ? "modal-title" : void 0,
           tabIndex: -1,
           children: [
-            (r || m) && /* @__PURE__ */ d("div", { className: "flex items-center justify-between p-6 pb-0", children: [
+            (r || f) && /* @__PURE__ */ d("div", { className: "flex items-center justify-between p-6 pb-0", children: [
               r && /* @__PURE__ */ e(
                 "span",
                 {
@@ -2304,7 +2307,7 @@ function Ct({
                   children: r
                 }
               ),
-              m && /* @__PURE__ */ e(
+              f && /* @__PURE__ */ e(
                 "button",
                 {
                   onClick: a,
@@ -2315,29 +2318,29 @@ function Ct({
               )
             ] }),
             /* @__PURE__ */ e("div", { className: "p-6", children: p }),
-            g && /* @__PURE__ */ e("div", { className: "px-6 py-4", children: g })
+            b && /* @__PURE__ */ e("div", { className: "px-6 py-4", children: b })
           ]
         }
       )
     }
   ) : null;
 }
-const Z = ({
+const Y = ({
   variant: t = "body",
   size: a = "md",
   weight: r = "normal",
   color: n = "current",
   align: s = "left",
-  truncate: c = !1,
-  italic: f = !1,
-  underline: b = !1,
+  truncate: i = !1,
+  italic: m = !1,
+  underline: g = !1,
   lineHeight: p = "normal",
-  as: g,
-  className: m,
+  as: b,
+  className: f,
   children: l,
   ...u
 }) => {
-  const h = g || St(t), C = x(
+  const h = b || St(t), k = x(
     // Base styles
     "font-primary",
     // Variant styles
@@ -2394,13 +2397,13 @@ const Z = ({
     },
     // Text decorations
     {
-      italic: f,
-      underline: b,
-      truncate: c
+      italic: m,
+      underline: g,
+      truncate: i
     },
-    m
+    f
   );
-  return /* @__PURE__ */ e(h, { className: C, ...u, children: l });
+  return /* @__PURE__ */ e(h, { className: k, ...u, children: l });
 };
 function St(t) {
   return {
@@ -2416,167 +2419,167 @@ const Lt = ({
   label: r,
   placeholder: n = "Select or upload a file",
   error: s,
-  disabled: c,
-  accept: f,
-  onListFiles: b,
+  disabled: i,
+  accept: m,
+  onListFiles: g,
   onListMounts: p,
-  onUploadFile: g,
-  onDownloadFile: m,
+  onUploadFile: b,
+  onDownloadFile: f,
   onRegisterFile: l
 }) => {
-  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(
+  const [u, h] = O(!1), [k, C] = O([]), [v, j] = O(null), [N, q] = O("/"), [P, U] = O([]), [F, A] = O(!1), [H, T] = O(""), [V, W] = O(
     typeof t == "object" ? t : null
-  ), [i, y] = V(!1), [$, L] = V(""), D = X(null);
+  ), [c, y] = O(!1), [L, S] = O(""), M = Z(null);
   K(() => {
-    u && M();
+    u && E();
   }, [u]), K(() => {
-    u && N && Q();
-  }, [u, N, v, J]);
-  const M = async () => {
-    E(!0);
+    u && v && Q();
+  }, [u, v, N, H]);
+  const E = async () => {
+    A(!0);
     try {
       const o = await p?.();
-      o?.data && w(o.data);
+      o?.data && C(o.data);
     } catch (o) {
       console.error("Failed to load mounts", o);
     } finally {
-      E(!1);
+      A(!1);
     }
   }, Q = async () => {
-    if (N) {
-      E(!0);
+    if (v) {
+      A(!0);
       try {
-        const o = await b?.({ mountId: N.id, name: J, path: v });
+        const o = await g?.({ mountId: v.id, name: H, path: N });
         o?.data && U(o.data);
       } catch (o) {
         console.error("Failed to load files", o);
       } finally {
-        E(!1);
+        A(!1);
       }
     }
   }, re = async (o) => {
-    const k = o.target.files?.[0];
-    if (k) {
-      E(!0);
+    const w = o.target.files?.[0];
+    if (w) {
+      A(!0);
       try {
-        const _ = await k.arrayBuffer(), R = new Uint8Array(_), j = {
+        const _ = await w.arrayBuffer(), R = new Uint8Array(_), B = {
           id: `local-${Date.now()}`,
-          name: k.name,
+          name: w.name,
           type: "file",
           path: "/",
-          mimeType: k.type || "application/octet-stream",
-          size: k.size,
+          mimeType: w.type || "application/octet-stream",
+          size: w.size,
           mountId: "local",
-          providerKey: k.name,
+          providerKey: w.name,
           ownerId: "me"
         };
-        H(j), a(j, R), h(!1);
+        W(B), a(B, R), h(!1);
       } catch (_) {
         console.error("Local file selection failed", _);
       } finally {
-        E(!1);
+        A(!1);
       }
     }
-  }, W = async (o) => {
-    const k = o.target.files?.[0];
-    if (!(!k || !N)) {
-      E(!0);
+  }, X = async (o) => {
+    const w = o.target.files?.[0];
+    if (!(!w || !v)) {
+      A(!0);
       try {
-        const _ = await k.arrayBuffer(), R = await g?.({
+        const _ = await w.arrayBuffer(), R = await b?.({
           file: new Uint8Array(_),
-          filename: k.name,
-          mimeType: k.type || "application/octet-stream",
-          mountId: N.id,
-          path: v
+          filename: w.name,
+          mimeType: w.type || "application/octet-stream",
+          mountId: v.id,
+          path: N
         });
         if (R?.data) {
-          const j = R.data;
-          H(j), a(j, new Uint8Array(_)), h(!1);
+          const B = R.data;
+          W(B), a(B, new Uint8Array(_)), h(!1);
         }
       } catch (_) {
         console.error("Upload failed", _);
       } finally {
-        E(!1);
+        A(!1);
       }
     }
-  }, S = async () => {
-    if (!(!$ || !N)) {
-      E(!0);
+  }, $ = async () => {
+    if (!(!L || !v)) {
+      A(!0);
       try {
-        const o = `${v}${$}/`;
+        const o = `${N}${L}/`;
         l && (await l({
-          name: $,
+          name: L,
           type: "folder",
-          path: v,
+          path: N,
           mimeType: "application/x-directory",
           size: 0,
-          mountId: N.id,
+          mountId: v.id,
           providerKey: o,
           ownerId: "me"
-        }), await Q()), y(!1), L("");
+        }), await Q()), y(!1), S("");
       } catch (o) {
         console.error("Failed to create folder", o);
       } finally {
-        E(!1);
+        A(!1);
       }
     }
-  }, A = async (o) => {
-    E(!0);
+  }, I = async (o) => {
+    A(!0);
     try {
-      const k = await m?.(o.id);
-      H(o), a(o, k), h(!1);
-    } catch (k) {
-      console.error("Failed to download file", k);
+      const w = await f?.(o.id);
+      W(o), a(o, w), h(!1);
+    } catch (w) {
+      console.error("Failed to download file", w);
     } finally {
-      E(!1);
+      A(!1);
     }
-  }, O = (o) => {
-    o.stopPropagation(), H(null), a(null);
-  }, T = de(() => {
-    const o = /* @__PURE__ */ new Set(), k = [];
-    return B.forEach((_) => {
+  }, z = (o) => {
+    o.stopPropagation(), W(null), a(null);
+  }, D = de(() => {
+    const o = /* @__PURE__ */ new Set(), w = [];
+    return P.forEach((_) => {
       if (_.type === "folder") {
-        _.path === v && o.add(_.name);
+        _.path === N && o.add(_.name);
         return;
       }
-      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(_);
+      const R = _.providerKey || _.name, J = (N ? R.substring(N.length) : R).split("/").filter((he) => he !== "");
+      J.length > 1 ? o.add(J[0]) : J.length === 1 && w.push(_);
     }), {
       folders: Array.from(o).sort(),
-      files: k.sort((_, R) => _.name.localeCompare(R.name))
+      files: w.sort((_, R) => _.name.localeCompare(R.name))
     };
-  }, [B, v]), ee = (o) => {
-    q((k) => `${k}${o}/`);
+  }, [P, N]), ee = (o) => {
+    q((w) => `${w}${o}/`);
   }, ne = () => {
-    const o = v.split("/").filter((k) => k !== "");
+    const o = N.split("/").filter((w) => w !== "");
     o.pop(), o.length === 0 ? q("/") : q(`${o.join("/")}/`);
   }, G = de(() => {
-    const o = T.folders.map((k) => ({
-      id: `folder-${k}`,
-      name: k,
+    const o = D.folders.map((w) => ({
+      id: `folder-${w}`,
+      name: w,
       type: "folder"
     }));
-    return T.files.forEach((k) => {
+    return D.files.forEach((w) => {
       o.push({
-        ...k,
+        ...w,
         type: "file"
       });
     }), o;
-  }, [T]), le = [
+  }, [D]), le = [
     {
       id: "name",
       header: "Name",
       accessor: "name",
-      cell: (o, k) => /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
+      cell: (o, w) => /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e(
           oe,
           {
-            icon: k.type === "folder" ? Ce : pe,
+            icon: w.type === "folder" ? Ce : pe,
             size: "sm",
-            color: k.type === "folder" ? "warning" : "secondary"
+            color: w.type === "folder" ? "warning" : "secondary"
           }
         ),
-        /* @__PURE__ */ e("span", { className: x(k.type === "folder" && "font-medium"), children: o })
+        /* @__PURE__ */ e("span", { className: x(w.type === "folder" && "font-medium"), children: o })
       ] })
     },
     {
@@ -2594,16 +2597,16 @@ const Lt = ({
       header: "",
       accessor: "id",
       align: "right",
-      cell: (o, k) => /* @__PURE__ */ e(
+      cell: (o, w) => /* @__PURE__ */ e(
         te,
         {
           size: "sm",
           variant: "outline",
           onClick: (_) => {
-            _.stopPropagation(), k.type === "folder" ? ee(k.name) : A(k);
+            _.stopPropagation(), w.type === "folder" ? ee(w.name) : I(w);
           },
-          loading: F && k.type === "file" && P?.id === k.id,
-          children: k.type === "folder" ? "Open" : "Select"
+          loading: F && w.type === "file" && V?.id === w.id,
+          children: w.type === "folder" ? "Open" : "Select"
         }
       )
     }
@@ -2622,28 +2625,28 @@ const Lt = ({
       header: "",
       accessor: "id",
       align: "right",
-      cell: (o, k) => /* @__PURE__ */ e(te, { size: "sm", variant: "outline", onClick: () => I(k), children: "Open" })
+      cell: (o, w) => /* @__PURE__ */ e(te, { size: "sm", variant: "outline", onClick: () => j(w), children: "Open" })
     }
   ];
   return /* @__PURE__ */ d("div", { className: "space-y-1", children: [
-    r && /* @__PURE__ */ e(Z, { variant: "label", size: "sm", weight: "medium", children: r }),
+    r && /* @__PURE__ */ e(Y, { variant: "label", size: "sm", weight: "medium", children: r }),
     /* @__PURE__ */ d(
       "div",
       {
-        onClick: () => !c && h(!0),
+        onClick: () => !i && h(!0),
         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"
+          i && "opacity-50 cursor-not-allowed bg-module-subtle"
         ),
         children: [
-          /* @__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(
+          /* @__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 && !i && /* @__PURE__ */ e(
             "button",
             {
-              onClick: O,
+              onClick: z,
               className: "p-1 hover:bg-neutral-container rounded",
               children: /* @__PURE__ */ e(oe, { icon: Ve, size: "xs" })
             }
@@ -2651,15 +2654,15 @@ const Lt = ({
         ]
       }
     ),
-    s && /* @__PURE__ */ e(Z, { variant: "body", size: "xs", className: "text-error", children: s }),
+    s && /* @__PURE__ */ e(Y, { variant: "body", size: "xs", className: "text-error", children: s }),
     /* @__PURE__ */ e(
       Ct,
       {
         open: u,
         onClose: () => {
-          h(!1), I(null), q("/"), y(!1);
+          h(!1), j(null), q("/"), y(!1);
         },
-        title: N ? `Explorer: ${N.name}` : "Select Storage Mount",
+        title: v ? `Explorer: ${v.name}` : "Select Storage Mount",
         size: "lg",
         children: /* @__PURE__ */ e(
           wt,
@@ -2669,7 +2672,7 @@ const Lt = ({
               {
                 id: "remote",
                 label: "Platform Storage",
-                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: N ? /* @__PURE__ */ d(Ee, { children: [
+                content: /* @__PURE__ */ e("div", { className: "space-y-4", children: v ? /* @__PURE__ */ d(Ee, { children: [
                   /* @__PURE__ */ d("div", { className: "flex flex-wrap items-center gap-2", children: [
                     /* @__PURE__ */ e(
                       te,
@@ -2677,19 +2680,19 @@ const Lt = ({
                         variant: "ghost",
                         size: "sm",
                         onClick: () => {
-                          v && v !== "/" ? ne() : I(null);
+                          N && N !== "/" ? ne() : j(null);
                         },
                         leftIcon: /* @__PURE__ */ e(oe, { icon: we, size: "xs" }),
-                        children: v ? "Back" : "Back to Mounts"
+                        children: N ? "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: v }) }),
+                    /* @__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: N }) }),
                     /* @__PURE__ */ e("div", { className: "flex-grow min-w-[150px]", children: /* @__PURE__ */ e(
                       ue,
                       {
                         placeholder: "Search...",
-                        value: J,
-                        onChange: (o) => z(o.target.value),
+                        value: H,
+                        onChange: (o) => T(o.target.value),
                         startIcon: /* @__PURE__ */ e($e, { size: 14 }),
                         fullWidth: !0,
                         size: "sm"
@@ -2711,7 +2714,7 @@ const Lt = ({
                         {
                           variant: "primary",
                           size: "sm",
-                          onClick: () => D.current?.click(),
+                          onClick: () => M.current?.click(),
                           leftIcon: /* @__PURE__ */ e(oe, { icon: We, size: "xs" }),
                           loading: F,
                           children: "Upload"
@@ -2722,26 +2725,26 @@ const Lt = ({
                         {
                           type: "file",
                           className: "hidden",
-                          ref: D,
-                          onChange: W,
-                          accept: f
+                          ref: M,
+                          onChange: X,
+                          accept: m
                         }
                       )
                     ] })
                   ] }),
-                  i && /* @__PURE__ */ d("div", { className: "flex items-center gap-2 p-3 bg-module-subtle rounded-lg border border-neutral", children: [
+                  c && /* @__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: $,
-                        onChange: (o) => L(o.target.value),
+                        value: L,
+                        onChange: (o) => S(o.target.value),
                         autoFocus: !0
                       }
                     ),
-                    /* @__PURE__ */ e(te, { size: "sm", onClick: S, loading: F, children: "Create" }),
+                    /* @__PURE__ */ e(te, { size: "sm", onClick: $, 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(
@@ -2751,17 +2754,17 @@ const Lt = ({
                       columns: le,
                       loading: F,
                       emptyContent: "This folder is empty",
-                      onRowClick: (o) => o.type === "folder" ? ee(o.name) : A(o)
+                      onRowClick: (o) => o.type === "folder" ? ee(o.name) : I(o)
                     }
                   ) })
                 ] }) : /* @__PURE__ */ e("div", { className: "max-h-[400px] overflow-auto rounded-lg border border-neutral", children: /* @__PURE__ */ e(
                   Le,
                   {
-                    data: C,
+                    data: k,
                     columns: fe,
                     loading: F,
                     emptyContent: "No storage mounts configured",
-                    onRowClick: (o) => I(o)
+                    onRowClick: (o) => j(o)
                   }
                 ) }) })
               },
@@ -2770,8 +2773,8 @@ const Lt = ({
                 label: "Local File",
                 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__ */ d(Z, { variant: "body", size: "sm", className: "text-muted mt-1 mb-6 text-center max-w-xs", children: [
+                  /* @__PURE__ */ e(Y, { variant: "label", size: "lg", weight: "semibold", children: "Select a file from your computer" }),
+                  /* @__PURE__ */ d(Y, { 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."
@@ -2793,7 +2796,7 @@ const Lt = ({
                         type: "file",
                         className: "hidden",
                         onChange: re,
-                        accept: f,
+                        accept: m,
                         disabled: F
                       }
                     )
@@ -2815,20 +2818,20 @@ function Me(t, a) {
 }
 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 b = n[f], p = c[b];
-    c[b] = p && typeof p == "object" ? Array.isArray(p) ? [...p] : { ...p } : {}, c = c[b];
+  let i = s;
+  for (let m = 0; m < n.length - 1; m++) {
+    const g = n[m], p = i[g];
+    i[g] = p && typeof p == "object" ? Array.isArray(p) ? [...p] : { ...p } : {}, i = i[g];
   }
-  return c[n[n.length - 1]] = r, s;
+  return i[n[n.length - 1]] = r, s;
 }
 function Et(t, a) {
   const r = a.split("."), n = Array.isArray(t) ? [...t] : { ...t };
   let s = n;
-  for (let c = 0; c < r.length - 1; c++) {
-    const f = r[c];
-    if (!s[f] || typeof s[f] != "object") return n;
-    s[f] = Array.isArray(s[f]) ? [...s[f]] : { ...s[f] }, s = s[f];
+  for (let i = 0; i < r.length - 1; i++) {
+    const m = r[i];
+    if (!s[m] || typeof s[m] != "object") return n;
+    s[m] = Array.isArray(s[m]) ? [...s[m]] : { ...s[m] }, s = s[m];
   }
   return delete s[r[r.length - 1]], n;
 }
@@ -2838,104 +2841,104 @@ const rr = ({
   onSubmit: r,
   onCancel: n,
   onChange: s,
-  transform: c,
-  validate: f,
-  submitButton: b = { label: "Submit", variant: "primary" },
+  transform: i,
+  validate: m,
+  submitButton: g = { label: "Submit", variant: "primary" },
   cancelButton: p = { label: "Cancel", variant: "outline" },
-  showButtons: g = !0,
-  layout: m = "vertical",
+  showButtons: b = !0,
+  layout: f = "vertical",
   size: l = "md",
   loading: u = !1,
   className: h,
-  ref: C,
-  sdk: w
+  ref: k,
+  sdk: C
 }) => {
-  const [N, I] = V(a || {}), [v, q] = V({}), [B, U] = V({});
+  const [v, j] = O(a || {}), [N, q] = O({}), [P, U] = O({});
   K(() => {
-    a && I({ ...a });
+    a && j({ ...a });
   }, [a]);
   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.`;
+    (c, y, L) => {
+      const S = t.flatMap((M) => M.items).find((M) => M.name === c);
+      if (!S) return null;
+      if (S.required && (y == null || y === ""))
+        return `${S.label} is required`;
+      if (S.type === "array") {
+        if (S.required && (!y || y.length === 0))
+          return `${S.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;
+          return `${S.label} must be an array.`;
+        if (Array.isArray(y) && S.arrayFields) {
+          const M = [];
+          let E = !1;
           if (y.forEach((Q, re) => {
-            const W = {};
-            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(A, Q);
-                O && (W[S.name] = O, M = !0);
+            const X = {};
+            for (const $ of S.arrayFields) {
+              const I = Q?.[$.name];
+              if ($.required && (I == null || I === ""))
+                X[$.name] = `${$.label} is required`, E = !0;
+              else if ($.validator) {
+                const z = $.validator(I, Q);
+                z && (X[$.name] = z, E = !0);
               }
             }
-            D[re] = W;
-          }), M)
-            return JSON.stringify(D);
+            M[re] = X;
+          }), E)
+            return JSON.stringify(M);
         }
       }
-      return L.validator ? L.validator(y, $) : null;
+      return S.validator ? S.validator(y, L) : null;
     },
     [t]
-  ), E = ae(
-    (i, y) => {
-      let $ = Mt(
-        N,
-        i,
+  ), A = ae(
+    (c, y) => {
+      let L = Mt(
+        v,
+        c,
         y
       );
-      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,
-        [i]: D || ""
-      })), s?.($, i);
+      t.flatMap((E) => E.items).find((E) => E.name === c)?.removeIfEmpty && (y == null || y === "") && (L = Et(L, c)), j(L), U((E) => ({ ...E, [c]: !0 }));
+      const M = F(c, y, L);
+      q((E) => ({
+        ...E,
+        [c]: M || ""
+      })), s?.(L, c);
     },
-    [N, t, F, s]
-  ), 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))
+    [v, t, F, s]
+  ), H = ae(
+    async (c) => {
+      if (console.log("handleSubmit"), c.preventDefault(), u) return;
+      const y = {}, L = t.flatMap((M) => M.items);
+      for (const M of L) {
+        if (M.hidden || M.conditional && !M.conditional(v))
           continue;
-        const M = F(
-          D.name,
-          Me(N, D.name),
-          N
+        const E = F(
+          M.name,
+          Me(v, M.name),
+          v
         );
-        M && (y[D.name] = M);
+        E && (y[M.name] = E);
       }
-      if (f) {
-        const D = f(N);
-        D && Object.assign(y, D);
+      if (m) {
+        const M = m(v);
+        M && Object.assign(y, M);
       }
-      if (q(y), console.log("newErrors", y), Object.keys(y).some((D) => y[D]))
+      if (q(y), console.log("newErrors", y), Object.keys(y).some((M) => y[M]))
         return;
-      const L = c ? c(N) : N;
-      await r?.(N, L);
+      const S = i ? i(v) : v;
+      await r?.(v, S);
     },
-    [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 = {
+    [v, t, F, m, i, r, u]
+  ), T = ae(
+    (c) => {
+      const y = Me(v, c.name), L = P[c.name] ? N[c.name] : void 0, S = c.disabled || u, M = {
         value: y || "",
-        disabled: L,
-        required: i.required,
-        placeholder: i.placeholder,
-        ...i.fieldProps
+        disabled: S,
+        required: c.required,
+        placeholder: c.placeholder,
+        ...c.fieldProps
       };
-      switch (i.type) {
+      switch (c.type) {
         case "text":
         case "email":
         case "password":
@@ -2945,11 +2948,11 @@ const rr = ({
           return /* @__PURE__ */ e(
             ue,
             {
-              ...D,
-              onChange: (M) => E(i.name, M.target.value),
-              type: i.textType || i.type,
-              autoComplete: i.autocomplete,
-              error: $,
+              ...M,
+              onChange: (E) => A(c.name, E.target.value),
+              type: c.textType || c.type,
+              autoComplete: c.autocomplete,
+              error: L,
               size: l
             }
           );
@@ -2957,10 +2960,10 @@ const rr = ({
           return /* @__PURE__ */ e(
             Ne,
             {
-              ...D,
-              onChange: (M) => E(i.name, M.target.value),
+              ...M,
+              onChange: (E) => A(c.name, E.target.value),
               rows: 4,
-              error: $,
+              error: L,
               size: l
             }
           );
@@ -2968,16 +2971,16 @@ const rr = ({
           return /* @__PURE__ */ e(
             ve,
             {
-              ...D,
-              onChange: (M) => E(i.name, M),
-              options: (i.options || []).map((M) => ({
-                ...M,
-                value: String(M.value)
+              ...M,
+              onChange: (E) => A(c.name, E),
+              options: (c.options || []).map((E) => ({
+                ...E,
+                value: String(E.value)
               })),
-              searchable: i.searchable,
-              multiple: i.multiple,
-              allowCreate: i.allowCreate,
-              error: $,
+              searchable: c.searchable,
+              multiple: c.multiple,
+              allowCreate: c.allowCreate,
+              error: L,
               size: l
             }
           );
@@ -2985,35 +2988,35 @@ const rr = ({
           return /* @__PURE__ */ e(
             ge,
             {
-              ...D,
+              ...M,
               checked: !!y,
-              onChange: (M) => E(i.name, M.target.checked),
+              onChange: (E) => A(c.name, E.target.checked),
               size: l
             }
           );
         case "radio":
-          return /* @__PURE__ */ e("div", { className: "space-y-1", children: i.options?.map((M) => /* @__PURE__ */ d("label", { className: "flex items-center gap-2", children: [
+          return /* @__PURE__ */ e("div", { className: "space-y-1", children: c.options?.map((E) => /* @__PURE__ */ d("label", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ e(
               "input",
               {
                 type: "radio",
-                name: i.name,
-                value: M.value,
-                checked: y === M.value,
-                onChange: () => E(i.name, M.value),
-                disabled: L || M.disabled,
+                name: c.name,
+                value: E.value,
+                checked: y === E.value,
+                onChange: () => A(c.name, E.value),
+                disabled: S || E.disabled,
                 className: "rounded-full border-neutral-100 dark:border-neutral-600"
               }
             ),
-            /* @__PURE__ */ e(Z, { variant: "label", size: "sm", children: M.label })
-          ] }, M.value)) });
+            /* @__PURE__ */ e(Y, { variant: "label", size: "sm", children: E.label })
+          ] }, E.value)) });
         case "date":
           return /* @__PURE__ */ e(
             ye,
             {
-              ...D,
+              ...M,
               value: y ? new Date(y) : null,
-              onChange: (M) => E(i.name, M),
+              onChange: (E) => A(c.name, E),
               size: l
             }
           );
@@ -3021,66 +3024,66 @@ const rr = ({
           return /* @__PURE__ */ e(
             Lt,
             {
-              ...D,
+              ...M,
               value: y,
-              onChange: (M) => E(i.name, M),
-              error: $,
-              onListFiles: (M) => w?.http.invoke({
+              onChange: (E) => A(c.name, E),
+              error: L,
+              onListFiles: (E) => C?.http.invoke({
                 method: "POST",
                 action: "storage.file.list",
-                body: M
+                body: E
               }),
-              onListMounts: () => w?.http.invoke({
+              onListMounts: () => C?.http.invoke({
                 method: "GET",
                 action: "storage.mount"
               }),
-              onUploadFile: (M) => w?.http.invoke({
+              onUploadFile: (E) => C?.http.invoke({
                 method: "POST",
                 action: "storage.file.upload",
-                body: M
+                body: E
               }),
-              onDownloadFile: (M) => w?.http.invoke({
+              onDownloadFile: (E) => C?.http.invoke({
                 method: "GET",
-                action: `storage.file.${M}.download`
+                action: `storage.file.${E}.download`
               }),
-              onRegisterFile: (M) => w?.http.invoke({
+              onRegisterFile: (E) => C?.http.invoke({
                 method: "POST",
                 action: "storage.file.folder",
-                body: M
+                body: E
               })
             }
           );
         case "custom":
-          return i.customComponent?.({
+          return c.customComponent?.({
             value: y,
-            onChange: (M) => E(i.name, M),
-            error: $,
-            disabled: L
+            onChange: (E) => A(c.name, E),
+            error: L,
+            disabled: S
           });
         case "array": {
-          const M = y || [];
+          const E = y || [];
           let Q = [];
-          if (typeof $ == "string" && $.startsWith("["))
+          if (typeof L == "string" && L.startsWith("["))
             try {
-              Q = JSON.parse($);
+              Q = JSON.parse(L);
             } catch {
             }
           const re = () => {
-            E(i.name, [...M, {}]);
-          }, W = (A) => {
-            E(
-              i.name,
-              M.filter((O, T) => T !== A)
+            A(c.name, [...E, {}]);
+          }, X = (I) => {
+            A(
+              c.name,
+              E.filter((z, D) => D !== I)
             );
-          }, S = (A, O, T) => {
-            const ee = [...M];
-            ee[A] = {
-              ...ee[A],
-              [O]: T
-            }, E(i.name, ee);
+          }, $ = (I, z, D) => {
+            const ee = [...E];
+            ee[I] = {
+              ...ee[I],
+              [z]: D
+            }, A(c.name, ee);
           };
           return /* @__PURE__ */ d("div", { className: "space-y-2", children: [
-            M.map((A, O) => /* @__PURE__ */ d(
+            E.map((I, z) => /* @__PURE__ */ d(
               "div",
               {
                 className: "p-4 border rounded-md dark:border-neutral-700 space-y-2 relative",
@@ -3091,39 +3094,39 @@ const rr = ({
                       type: "button",
                       variant: "ghost",
                       size: "sm",
-                      onClick: () => W(O),
-                      disabled: L,
+                      onClick: () => X(z),
+                      disabled: S,
                       children: "Remove"
                     }
                   ) }),
-                  /* @__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];
+                  /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: c.arrayFields?.map((D) => {
+                    const ee = Q?.[z]?.[D.name];
                     return /* @__PURE__ */ d(
                       "div",
                       {
                         className: "space-y-1",
                         children: [
                           /* @__PURE__ */ e("label", { className: "block", children: /* @__PURE__ */ d(
-                            Z,
+                            Y,
                             {
                               variant: "label",
                               size: "sm",
                               className: "font-semibold text-neutral-700 dark:text-neutral-300",
                               children: [
-                                T.label,
-                                T.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
+                                D.label,
+                                D.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
                               ]
                             }
                           ) }),
                           (() => {
                             const ne = {
-                              value: A?.[T.name] || "",
-                              disabled: L,
-                              required: T.required,
-                              placeholder: T.placeholder,
-                              ...T.fieldProps
+                              value: I?.[D.name] || "",
+                              disabled: S,
+                              required: D.required,
+                              placeholder: D.placeholder,
+                              ...D.fieldProps
                             };
-                            switch (T.type) {
+                            switch (D.type) {
                               case "text":
                               case "email":
                               case "password":
@@ -3134,13 +3137,13 @@ const rr = ({
                                   ue,
                                   {
                                     ...ne,
-                                    onChange: (G) => S(
-                                      O,
-                                      T.name,
+                                    onChange: (G) => $(
+                                      z,
+                                      D.name,
                                       G.target.value
                                     ),
-                                    type: T.textType || T.type,
-                                    autoComplete: T.autocomplete,
+                                    type: D.textType || D.type,
+                                    autoComplete: D.autocomplete,
                                     error: ee,
                                     size: l
                                   }
@@ -3150,9 +3153,9 @@ const rr = ({
                                   Ne,
                                   {
                                     ...ne,
-                                    onChange: (G) => S(
-                                      O,
-                                      T.name,
+                                    onChange: (G) => $(
+                                      z,
+                                      D.name,
                                       G.target.value
                                     ),
                                     rows: 4,
@@ -3165,20 +3168,20 @@ const rr = ({
                                   ve,
                                   {
                                     ...ne,
-                                    onChange: (G) => S(
-                                      O,
-                                      T.name,
+                                    onChange: (G) => $(
+                                      z,
+                                      D.name,
                                       G
                                     ),
-                                    options: (T.options || []).map(
+                                    options: (D.options || []).map(
                                       (G) => ({
                                         ...G,
                                         value: String(G.value)
                                       })
                                     ),
-                                    searchable: T.searchable,
-                                    multiple: T.multiple,
-                                    allowCreate: T.allowCreate,
+                                    searchable: D.searchable,
+                                    multiple: D.multiple,
+                                    allowCreate: D.allowCreate,
                                     error: ee,
                                     size: l
                                   }
@@ -3188,17 +3191,17 @@ const rr = ({
                                   ge,
                                   {
                                     ...ne,
-                                    checked: !!A?.[T.name],
-                                    onChange: (G) => S(
-                                      O,
-                                      T.name,
+                                    checked: !!I?.[D.name],
+                                    onChange: (G) => $(
+                                      z,
+                                      D.name,
                                       G.target.checked
                                     ),
                                     size: l
                                   }
                                 );
                               case "radio":
-                                return /* @__PURE__ */ e("div", { className: "space-y-1", children: T.options?.map((G) => /* @__PURE__ */ d(
+                                return /* @__PURE__ */ e("div", { className: "space-y-1", children: D.options?.map((G) => /* @__PURE__ */ d(
                                   "label",
                                   {
                                     className: "flex items-center gap-2",
@@ -3207,33 +3210,33 @@ const rr = ({
                                         "input",
                                         {
                                           type: "radio",
-                                          name: `${i.name}.${O}.${T.name}`,
+                                          name: `${c.name}.${z}.${D.name}`,
                                           value: G.value,
-                                          checked: A?.[T.name] === G.value,
-                                          onChange: () => S(
-                                            O,
-                                            T.name,
+                                          checked: I?.[D.name] === G.value,
+                                          onChange: () => $(
+                                            z,
+                                            D.name,
                                             G.value
                                           ),
-                                          disabled: L || G.disabled,
+                                          disabled: S || G.disabled,
                                           className: "rounded-full border-neutral-100 dark:border-neutral-600"
                                         }
                                       ),
-                                      /* @__PURE__ */ e(Z, { variant: "label", size: "sm", children: G.label })
+                                      /* @__PURE__ */ e(Y, { variant: "label", size: "sm", children: G.label })
                                     ]
                                   },
                                   G.value
                                 )) });
                               case "date": {
-                                const G = A?.[T.name];
+                                const G = I?.[D.name];
                                 return /* @__PURE__ */ e(
                                   ye,
                                   {
                                     ...ne,
                                     value: G ? new Date(G) : null,
-                                    onChange: (le) => S(
-                                      O,
-                                      T.name,
+                                    onChange: (le) => $(
+                                      z,
+                                      D.name,
                                       le
                                     ),
                                     size: l
@@ -3241,27 +3244,27 @@ const rr = ({
                                 );
                               }
                               case "custom":
-                                return T.customComponent?.({
-                                  value: A?.[T.name],
-                                  onChange: (G) => S(
-                                    O,
-                                    T.name,
+                                return D.customComponent?.({
+                                  value: I?.[D.name],
+                                  onChange: (G) => $(
+                                    z,
+                                    D.name,
                                     G
                                   ),
                                   error: ee,
-                                  disabled: L
+                                  disabled: S
                                 });
                               // Add other field types here as needed
                               default:
                                 return /* @__PURE__ */ d("p", { children: [
                                   "Unsupported field type in array:",
                                   " ",
-                                  T.type
+                                  D.type
                                 ] });
                             }
                           })(),
                           ee && /* @__PURE__ */ e(
-                            Z,
+                            Y,
                             {
                               variant: "body",
                               size: "sm",
@@ -3271,12 +3274,12 @@ const rr = ({
                           )
                         ]
                       },
-                      T.name
+                      D.name
                     );
                   }) })
                 ]
               },
-              O
+              z
             )),
             /* @__PURE__ */ d(
               te,
@@ -3285,10 +3288,10 @@ const rr = ({
                 variant: "outline",
                 size: "sm",
                 onClick: re,
-                disabled: L,
+                disabled: S,
                 children: [
                   "Add ",
-                  i.label
+                  c.label
                 ]
               }
             )
@@ -3298,26 +3301,26 @@ const rr = ({
           return null;
       }
     },
-    [N, B, v, u, l, E]
-  ), P = ae(
-    (i) => {
-      if (i.conditional && !i.conditional(N))
+    [v, P, N, u, l, A]
+  ), V = ae(
+    (c) => {
+      if (c.conditional && !c.conditional(v))
         return null;
-      const y = i.items.filter((L) => !(L.hidden || L.conditional && !L.conditional(N)));
+      const y = c.items.filter((S) => !(S.hidden || S.conditional && !S.conditional(v)));
       if (y.length === 0) return null;
-      const $ = x(
+      const L = x(
         "space-y-2",
         {
-          "grid gap-2": i.layout === "grid",
-          "flex flex-wrap gap-2": i.layout === "flex"
+          "grid gap-2": c.layout === "grid",
+          "flex flex-wrap gap-2": c.layout === "flex"
         },
-        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
+        c.layout === "grid" && {
+          "grid-cols-1": !c.columns || c.columns === 1,
+          "grid-cols-2": c.columns === 2,
+          "grid-cols-3": c.columns === 3,
+          "grid-cols-4": c.columns === 4
         },
-        i.className
+        c.className
       );
       return /* @__PURE__ */ d(
         "div",
@@ -3326,58 +3329,58 @@ const rr = ({
           children: [
             /* @__PURE__ */ d("div", { className: "md:col-span-1", children: [
               /* @__PURE__ */ e(
-                Z,
+                Y,
                 {
                   variant: "label",
                   size: "lg",
                   weight: "semibold",
                   className: "text-neutral-900 dark:text-neutral-100",
-                  children: i.title
+                  children: c.title
                 }
               ),
-              i.description && /* @__PURE__ */ e(
-                Z,
+              c.description && /* @__PURE__ */ e(
+                Y,
                 {
                   variant: "body",
                   size: "sm",
                   className: "text-neutral-600 dark:text-neutral-400 mt-1",
-                  children: i.description
+                  children: c.description
                 }
               )
             ] }),
-            /* @__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(
+            /* @__PURE__ */ e("div", { className: "md:col-span-2", children: /* @__PURE__ */ e("div", { className: L, children: y.map((S) => (P[S.name] && N[S.name], /* @__PURE__ */ d(
               "div",
               {
                 className: x(
                   "space-y-1",
-                  L.width && typeof L.width == "string" && `w-[${L.width}]`,
-                  L.width && typeof L.width == "number" && `col-span-${L.width}`
+                  S.width && typeof S.width == "string" && `w-[${S.width}]`,
+                  S.width && typeof S.width == "number" && `col-span-${S.width}`
                 ),
                 children: [
-                  L.type !== "custom" && /* @__PURE__ */ e("label", { className: "block", children: /* @__PURE__ */ d(
-                    Z,
+                  S.type !== "custom" && /* @__PURE__ */ e("label", { className: "block", children: /* @__PURE__ */ d(
+                    Y,
                     {
                       variant: "label",
                       size: "sm",
                       className: "font-medium text-neutral-700 dark:text-neutral-300",
                       children: [
-                        L.label,
-                        L.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
+                        S.label,
+                        S.required && /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
                       ]
                     }
                   ) }),
-                  z(L)
+                  T(S)
                 ]
               },
-              L.name
+              S.name
             ))) }) })
           ]
         },
-        i.id
+        c.id
       );
     },
-    [N, B, v, z]
-  ), H = x(
+    [v, P, N, T]
+  ), W = x(
     "space-y-6",
     {
       "max-w-md": l === "sm",
@@ -3387,9 +3390,9 @@ const rr = ({
     },
     h
   );
-  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: [
+  return /* @__PURE__ */ d("form", { ref: k, onSubmit: H, className: W, children: [
+    /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(V) }),
+    b && /* @__PURE__ */ d("div", { className: x("flex gap-3 justify-end pt-8"), children: [
       n && /* @__PURE__ */ e(
         te,
         {
@@ -3406,12 +3409,12 @@ const rr = ({
         te,
         {
           type: "submit",
-          variant: b.variant,
-          size: b.size || l,
-          disabled: b.disabled || u,
+          variant: g.variant,
+          size: g.size || l,
+          disabled: g.disabled || u,
           loading: u,
-          className: b.className,
-          children: b.label
+          className: g.className,
+          children: g.label
         }
       )
     ] })
@@ -3428,7 +3431,7 @@ const rr = ({
   sm: "px-2 py-0.5 text-xs",
   md: "px-2.5 py-1 text-sm",
   lg: "px-3 py-1.5 text-base"
-}, Dt = {
+}, Tt = {
   default: "bg-neutral-fill",
   primary: "bg-accent-fill",
   secondary: "bg-neutral-fill",
@@ -3443,9 +3446,9 @@ function nr({
   dot: r = !1,
   icon: n,
   dismissible: s = !1,
-  onDismiss: c,
-  className: f,
-  children: b,
+  onDismiss: i,
+  className: m,
+  children: g,
   ...p
 }) {
   return /* @__PURE__ */ d(
@@ -3458,7 +3461,7 @@ function nr({
         $t[t],
         // Size styles
         zt[a],
-        f
+        m
       ),
       ...p,
       children: [
@@ -3467,16 +3470,16 @@ function nr({
           {
             className: x(
               "w-2 h-2 rounded-full mr-1.5",
-              Dt[t]
+              Tt[t]
             )
           }
         ),
-        n && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", b && "mr-1"), children: n }),
-        b,
-        s && c && /* @__PURE__ */ e(
+        n && /* @__PURE__ */ e("span", { className: x("flex-shrink-0", g && "mr-1"), children: n }),
+        g,
+        s && i && /* @__PURE__ */ e(
           "button",
           {
-            onClick: c,
+            onClick: i,
             className: "ml-1.5 flex-shrink-0 hover:opacity-70 transition-opacity",
             "aria-label": "Remove badge",
             children: /* @__PURE__ */ e("svg", { className: "h-3 w-3", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ e(
@@ -3493,7 +3496,7 @@ function nr({
     }
   );
 }
-const Tt = {
+const Dt = {
   xs: "h-3 w-3",
   sm: "h-4 w-4",
   md: "h-6 w-6",
@@ -3517,7 +3520,7 @@ function ar({
   label: r = "Loading...",
   showLabel: n = !1,
   className: s,
-  ...c
+  ...i
 }) {
   return /* @__PURE__ */ d(
     "div",
@@ -3527,14 +3530,14 @@ function ar({
         n ? "flex-col space-y-2" : "",
         s
       ),
-      ...c,
+      ...i,
       children: [
         /* @__PURE__ */ d(
           "svg",
           {
             className: x(
               "animate-spin",
-              Tt[t],
+              Dt[t],
               At[a]
             ),
             fill: "none",
@@ -3585,24 +3588,24 @@ const lr = ({
   size: r = "md",
   aspectRatio: n = "auto",
   radius: s = "md",
-  showLoading: c = !0,
-  showError: f = !0,
-  fallback: b,
+  showLoading: i = !0,
+  showError: m = !0,
+  fallback: g,
   loadingContent: p,
-  errorContent: g,
-  className: m,
+  errorContent: b,
+  className: f,
   onLoad: l,
   onError: u,
   ...h
 }) => {
-  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);
+  const [k, C] = O(!0), [v, j] = O(!1), [N, q] = O(t), P = (W) => {
+    C(!1), j(!1), l?.(W);
+  }, U = (W) => {
+    if (C(!1), j(!0), g && N !== g) {
+      q(g), j(!1), C(!0);
       return;
     }
-    u?.(H);
+    u?.(W);
   }, F = x(
     "relative overflow-hidden bg-neutral-100 dark:bg-neutral-800",
     // Size variants
@@ -3630,17 +3633,17 @@ const lr = ({
       "rounded-xl": s === "xl",
       "rounded-full": s === "full"
     },
-    m
-  ), E = x(
+    f
+  ), A = x(
     "w-full h-full object-cover transition-opacity duration-200",
     {
-      "opacity-0": C || N,
-      "opacity-100": !C && !N
+      "opacity-0": k || v,
+      "opacity-100": !k && !v
     }
-  ), J = x(
+  ), H = 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" }) }), P = /* @__PURE__ */ d("div", { className: "text-center", children: [
+  ), T = /* @__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__ */ d("div", { className: "text-center", children: [
     /* @__PURE__ */ e(
       "svg",
       {
@@ -3666,15 +3669,15 @@ const lr = ({
       "img",
       {
         ...h,
-        src: v,
+        src: N,
         alt: a,
-        className: E,
-        onLoad: B,
+        className: A,
+        onLoad: P,
         onError: U
       }
     ),
-    C && c && /* @__PURE__ */ e("div", { className: J, children: p || z }),
-    N && f && /* @__PURE__ */ e("div", { className: J, children: g || P })
+    k && i && /* @__PURE__ */ e("div", { className: H, children: p || T }),
+    v && m && /* @__PURE__ */ e("div", { className: H, children: b || V })
   ] });
 }, sr = ({
   title: t,
@@ -3682,24 +3685,24 @@ const lr = ({
   actions: r = [],
   children: n,
   className: s,
-  backLabel: c = "Back",
-  backClassName: f,
-  onBack: b,
+  backLabel: i = "Back",
+  backClassName: m,
+  onBack: g,
   editable: p = !1,
-  onTitleChange: g
+  onTitleChange: b
 }) => {
-  const [m, l] = V(!1), [u, h] = V(t), C = X(null);
+  const [f, l] = O(!1), [u, h] = O(t), k = Z(null);
   K(() => {
     h(t);
   }, [t]), K(() => {
-    m && C.current && (C.current.focus(), C.current.select());
-  }, [m]);
-  const w = () => {
+    f && k.current && (k.current.focus(), k.current.select());
+  }, [f]);
+  const C = () => {
     p && l(!0);
-  }, N = () => {
-    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));
+  }, v = () => {
+    l(!1), u.trim() !== "" && u !== t && b ? b(u.trim()) : h(t);
+  }, j = (N) => {
+    N.key === "Enter" ? k.current?.blur() : N.key === "Escape" && (h(t), l(!1));
   };
   return /* @__PURE__ */ d(
     "div",
@@ -3711,34 +3714,34 @@ const lr = ({
       children: [
         /* @__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(
+            g && /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
-                onClick: b,
+                onClick: g,
                 className: x(
                   "flex items-center text-sm cursor-pointer transition",
-                  f
+                  m
                 ),
                 children: /* @__PURE__ */ e(we, { size: 16, color: "currentColor" })
               }
             ),
-            m ? /* @__PURE__ */ e(
+            f ? /* @__PURE__ */ e(
               "input",
               {
-                ref: C,
+                ref: k,
                 type: "text",
                 value: u,
-                onChange: (v) => h(v.target.value),
-                onBlur: N,
-                onKeyDown: I,
+                onChange: (N) => h(N.target.value),
+                onBlur: v,
+                onKeyDown: j,
                 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__ */ d("div", { className: "group flex items-center gap-1.5 min-w-0", children: [
               /* @__PURE__ */ e(
                 "h2",
                 {
-                  onClick: w,
+                  onClick: C,
                   className: x(
                     "text-2xl font-semibold truncate",
                     p && "cursor-pointer"
@@ -3751,44 +3754,44 @@ const lr = ({
                 Re,
                 {
                   size: 15,
-                  onClick: w,
+                  onClick: C,
                   className: "shrink-0 cursor-pointer text-muted opacity-0 group-hover:opacity-100 transition-opacity"
                 }
               )
             ] })
           ] }) }),
           r.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-wrap sm:flex-nowrap gap-2 sm:gap-3", children: r.map(
-            (v) => v.splitOptions && v.splitOptions.length > 0 ? /* @__PURE__ */ e(
+            (N) => N.splitOptions && N.splitOptions.length > 0 ? /* @__PURE__ */ e(
               ze,
               {
-                label: v.label,
-                onClick: v.onClick,
-                icon: v.icon,
-                variant: v.variant === "primary" ? "primary" : "secondary",
-                options: v.splitOptions,
-                disabled: v.disabled
+                label: N.label,
+                onClick: N.onClick,
+                icon: N.icon,
+                variant: N.variant === "primary" ? "primary" : "secondary",
+                options: N.splitOptions,
+                disabled: N.disabled
               },
-              v.id
+              N.id
             ) : /* @__PURE__ */ d(
               "button",
               {
                 type: "button",
                 onClick: (q) => {
-                  q.stopPropagation(), q.target.blur(), v.onClick();
+                  q.stopPropagation(), q.target.blur(), N.onClick();
                 },
-                disabled: v.disabled,
+                disabled: N.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"
+                  o__primary: N.variant === "primary",
+                  o__secondary: N.variant === "secondary" || N.variant === "outline",
+                  o__ghost: N.variant === "ghost",
+                  o__destructive: N.variant === "destructive"
                 }),
                 children: [
-                  v.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: v.icon }),
-                  v.label
+                  N.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: N.icon }),
+                  N.label
                 ]
               },
-              v.id
+              N.id
             )
           ) })
         ] }),
@@ -3817,37 +3820,37 @@ const lr = ({
   ),
   s && /* @__PURE__ */ e("div", { className: "flex-1 min-w-0", children: s }),
   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(
+    (i) => i.splitOptions && i.splitOptions.length > 0 ? /* @__PURE__ */ e(
       ze,
       {
-        label: c.label,
-        onClick: c.onClick,
-        icon: c.icon,
-        variant: c.variant === "primary" ? "primary" : "secondary",
-        options: c.splitOptions,
-        disabled: c.disabled
+        label: i.label,
+        onClick: i.onClick,
+        icon: i.icon,
+        variant: i.variant === "primary" ? "primary" : "secondary",
+        options: i.splitOptions,
+        disabled: i.disabled
       },
-      c.id
+      i.id
     ) : /* @__PURE__ */ d(
       "button",
       {
         type: "button",
-        onClick: (f) => {
-          f.stopPropagation(), f.target.blur(), c.onClick();
+        onClick: (m) => {
+          m.stopPropagation(), m.target.blur(), i.onClick();
         },
-        disabled: c.disabled,
+        disabled: i.disabled,
         className: x("btn", {
-          o__primary: c.variant === "primary",
-          o__secondary: c.variant === "secondary" || c.variant === "outline",
-          o__ghost: c.variant === "ghost",
-          o__destructive: c.variant === "destructive"
+          o__primary: i.variant === "primary",
+          o__secondary: i.variant === "secondary" || i.variant === "outline",
+          o__ghost: i.variant === "ghost",
+          o__destructive: i.variant === "destructive"
         }),
         children: [
-          c.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: c.icon }),
-          c.label
+          i.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: i.icon }),
+          i.label
         ]
       },
-      c.id
+      i.id
     )
   ) })
 ] });
@@ -3863,118 +3866,118 @@ const cr = ({
   size: r = "md",
   className: n
 }) => {
-  const s = (m) => {
-    if (!m) return "-";
+  const s = (f) => {
+    if (!f) return "-";
     try {
-      return new Date(m).toLocaleDateString("nl-NL", {
+      return new Date(f).toLocaleDateString("nl-NL", {
         year: "numeric",
         month: "long",
         day: "numeric"
       });
     } catch {
-      return String(m);
+      return String(f);
     }
-  }, 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") {
+  }, i = (f) => f ? "Ja" : "Nee", m = (f, l) => {
+    if (!l) return String(f || "-");
+    const u = l.find((h) => h.value === f);
+    return u ? u.label : String(f || "-");
+  }, g = ae(
+    (f) => {
+      const l = jt(a, f.name);
+      if (f.type === "array") {
         const h = l;
         return !h || h.length === 0 ? /* @__PURE__ */ e(
-          Z,
+          Y,
           {
             variant: "body",
             size: "sm",
             className: "text-neutral-500 dark:text-neutral-400",
             children: "Geen items"
           }
-        ) : /* @__PURE__ */ e("div", { className: "space-y-3", children: h.map((C, w) => /* @__PURE__ */ d(
+        ) : /* @__PURE__ */ e("div", { className: "space-y-3", children: h.map((k, C) => /* @__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__ */ d(
-                Z,
+                Y,
                 {
                   variant: "label",
                   size: "sm",
                   weight: "medium",
                   className: "text-neutral-700 dark:text-neutral-300",
                   children: [
-                    m.label,
+                    f.label,
                     " ",
-                    w + 1
+                    C + 1
                   ]
                 }
               ) }),
-              /* @__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) {
+              /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: f.arrayFields?.map((v) => {
+                const j = k?.[v.name];
+                let N = "-";
+                switch (v.type) {
                   case "text":
                   case "email":
                   case "number":
                   case "tel":
                   case "url":
                   case "textarea":
-                    v = I || "-";
+                    N = j || "-";
                     break;
                   case "select":
                   case "radio":
-                    v = f(
-                      I,
-                      N.options
+                    N = m(
+                      j,
+                      v.options
                     );
                     break;
                   case "checkbox":
-                    v = c(I);
+                    N = i(j);
                     break;
                   case "date":
-                    v = s(I);
+                    N = s(j);
                     break;
                   case "custom":
-                    v = N.customComponent?.({
-                      value: I
+                    N = v.customComponent?.({
+                      value: j
                     });
                     break;
                   default:
-                    v = String(I || "-");
+                    N = String(j || "-");
                 }
-                return N.format && (v = N.format(I, C)), /* @__PURE__ */ d("div", { className: "space-y-1", children: [
+                return v.format && (N = v.format(j, k)), /* @__PURE__ */ d("div", { className: "space-y-1", children: [
                   /* @__PURE__ */ e(
-                    Z,
+                    Y,
                     {
                       variant: "label",
                       size: "xs",
                       className: "text-neutral-600 dark:text-neutral-400",
-                      children: N.label
+                      children: v.label
                     }
                   ),
                   /* @__PURE__ */ e(
-                    Z,
+                    Y,
                     {
                       variant: "body",
                       size: "sm",
                       className: "text-neutral-900 dark:text-neutral-100",
-                      children: v
+                      children: N
                     }
                   )
-                ] }, N.name);
+                ] }, v.name);
               }) })
             ]
           },
-          w
+          C
         )) });
       }
-      if (m.type === "custom" && m.customComponent)
-        return m.customComponent({ value: l });
-      if (m.format) {
-        const h = m.format(l, a);
+      if (f.type === "custom" && f.customComponent)
+        return f.customComponent({ value: l });
+      if (f.format) {
+        const h = f.format(l, a);
         return /* @__PURE__ */ e(
-          Z,
+          Y,
           {
             variant: "body",
             size: "sm",
@@ -3984,7 +3987,7 @@ const cr = ({
         );
       }
       let u = "-";
-      switch (m.type) {
+      switch (f.type) {
         case "text":
         case "email":
         case "password":
@@ -3998,10 +4001,10 @@ const cr = ({
           break;
         case "select":
         case "radio":
-          u = f(l, m.options);
+          u = m(l, f.options);
           break;
         case "checkbox":
-          u = c(l);
+          u = i(l);
           break;
         case "date":
           u = s(l);
@@ -4010,7 +4013,7 @@ const cr = ({
           u = l ? String(l) : "-";
       }
       return /* @__PURE__ */ e(
-        Z,
+        Y,
         {
           variant: "body",
           size: "sm",
@@ -4021,24 +4024,24 @@ const cr = ({
     },
     [a]
   ), p = ae(
-    (m) => {
-      if (m.conditional && !m.conditional(a))
+    (f) => {
+      if (f.conditional && !f.conditional(a))
         return null;
-      const l = m.items.filter((h) => !(h.hidden || h.conditional && !h.conditional(a)));
+      const l = f.items.filter((h) => !(h.hidden || h.conditional && !h.conditional(a)));
       if (l.length === 0) return null;
       const u = x(
         "space-y-4",
         {
-          "grid gap-4": m.layout === "grid",
-          "flex flex-wrap gap-4": m.layout === "flex"
+          "grid gap-4": f.layout === "grid",
+          "flex flex-wrap gap-4": f.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
+        f.layout === "grid" && {
+          "grid-cols-1": !f.columns || f.columns === 1,
+          "grid-cols-2": f.columns === 2,
+          "grid-cols-3": f.columns === 3,
+          "grid-cols-4": f.columns === 4
         },
-        m.className
+        f.className
       );
       return /* @__PURE__ */ d(
         "div",
@@ -4047,22 +4050,22 @@ const cr = ({
           children: [
             /* @__PURE__ */ d("div", { className: "md:col-span-1", children: [
               /* @__PURE__ */ e(
-                Z,
+                Y,
                 {
                   variant: "label",
                   size: "lg",
                   weight: "semibold",
                   className: "text-neutral-900 dark:text-neutral-100",
-                  children: m.title
+                  children: f.title
                 }
               ),
-              m.description && /* @__PURE__ */ e(
-                Z,
+              f.description && /* @__PURE__ */ e(
+                Y,
                 {
                   variant: "body",
                   size: "sm",
                   className: "text-neutral-600 dark:text-neutral-400 mt-1",
-                  children: m.description
+                  children: f.description
                 }
               )
             ] }),
@@ -4076,7 +4079,7 @@ const cr = ({
                 ),
                 children: [
                   h.type !== "custom" && /* @__PURE__ */ e(
-                    Z,
+                    Y,
                     {
                       variant: "label",
                       size: "sm",
@@ -4084,18 +4087,18 @@ const cr = ({
                       children: h.label
                     }
                   ),
-                  b(h)
+                  g(h)
                 ]
               },
               h.name
             )) }) })
           ]
         },
-        m.id
+        f.id
       );
     },
-    [a, b]
-  ), g = x(
+    [a, g]
+  ), b = x(
     "space-y-6",
     {
       "max-w-md": r === "sm",
@@ -4105,10 +4108,10 @@ const cr = ({
     },
     n
   );
-  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);
+  return /* @__PURE__ */ e("div", { className: b, children: /* @__PURE__ */ e("div", { className: "space-y-8", children: t.map(p) }) });
+}, De = ({ item: t, isSelectedHandler: a, onClick: r, depth: n = 0 }) => {
+  const [s, i] = O(t.defaultCollapsed ?? !1), m = t.children && t.children.length > 0, g = m && n === 0, p = () => {
+    m && i(!s);
   }, b = a ? a(t.path) : !1;
   return /* @__PURE__ */ d("li", { children: [
     /* @__PURE__ */ d(
@@ -4117,30 +4120,31 @@ const cr = ({
         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": b && !c,
-            "shadow-lvl-0": b && !c,
-            "font-semibold": b || c || t.children !== void 0
+            "active-nav-item": b && !m,
+            "shadow-lvl-0": b && !m,
+            "font-semibold": b || g
           }
         ),
         onClick: () => {
-          c ? f() : t.path && r?.(t.path);
+          m ? p() : t.path && r?.(t.path);
         },
         children: [
-          t.icon && /* @__PURE__ */ e("span", { className: "mr-2", children: t.icon }),
-          /* @__PURE__ */ e("span", { className: "flex-1", children: t.label }),
+          t.icon && /* @__PURE__ */ e("span", { className: "mr-2 shrink-0", children: t.icon }),
+          /* @__PURE__ */ e("span", { className: "flex-1 min-w-0 truncate", 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(He, { className: "w-4 h-4 text-muted" }) })
+          m && /* @__PURE__ */ e("span", { className: `${s ? "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, g) => /* @__PURE__ */ e(
-      Te,
+    m && !s && /* @__PURE__ */ e("ul", { className: "sidebar-menu-nested-items mb-1", children: t.children?.map((f, l) => /* @__PURE__ */ e(
+      De,
       {
-        item: p,
+        item: f,
         isSelectedHandler: a,
-        onClick: r
+        onClick: r,
+        depth: n + 1
       },
-      g
+      l
     )) })
   ] });
 }, ir = ({
@@ -4149,22 +4153,22 @@ const cr = ({
   items: r,
   isSelectedHandler: n,
   onClick: s,
-  preMenuItemsComponent: c
+  preMenuItemsComponent: i
 }) => /* @__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, b) => /* @__PURE__ */ e("span", { className: "sidebar-menu-action-icon", children: f }, b)) })
+    /* @__PURE__ */ e("div", { className: "sidebar-menu-actions", children: a?.map((m, g) => /* @__PURE__ */ e("span", { className: "sidebar-menu-action-icon", children: m }, g)) })
   ] }),
-  c && /* @__PURE__ */ e("div", { className: "sidebar-menu-pre-items mb-4", children: c }),
+  i && /* @__PURE__ */ e("div", { className: "sidebar-menu-pre-items mb-4", children: i }),
   /* @__PURE__ */ e("ul", { children: r.map(
-    (f, b) => !f.path && !f.label && !f.children ? /* @__PURE__ */ e("span", { className: "flex w-full h-4" }, b) : /* @__PURE__ */ e(
-      Te,
+    (m, g) => !m.path && !m.label && !m.children ? /* @__PURE__ */ e("span", { className: "flex w-full h-4" }, g) : /* @__PURE__ */ e(
+      De,
       {
-        item: f,
+        item: m,
         isSelectedHandler: n,
         onClick: s
       },
-      b
+      g
     )
   ) })
 ] }), dr = ({
@@ -4173,23 +4177,23 @@ const cr = ({
   weight: r = "bold",
   color: n = "current",
   align: s = "left",
-  truncate: c = !1,
-  className: f,
-  children: b,
+  truncate: i = !1,
+  className: m,
+  children: g,
   ...p
 }) => {
-  const g = a || Bt(t), m = x(
+  const b = a || Bt(t), f = x(
     "font-primary",
     // Size variants
     {
-      "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"
+      "text-xs": b === "xs",
+      "text-sm": b === "sm",
+      "text-base": b === "md",
+      "text-lg": b === "lg",
+      "text-xl": b === "xl",
+      "text-2xl": b === "2xl",
+      "text-3xl": b === "3xl",
+      "text-4xl": b === "4xl"
     },
     // Weight variants
     {
@@ -4219,11 +4223,11 @@ const cr = ({
     },
     // Truncation
     {
-      truncate: c
+      truncate: i
     },
-    f
+    m
   ), l = `h${t}`;
-  return /* @__PURE__ */ e(l, { className: m, ...p, children: b });
+  return /* @__PURE__ */ e(l, { className: f, ...p, children: g });
 };
 function Bt(t) {
   return {
@@ -4241,10 +4245,10 @@ const ur = ({
   variant: r = "default",
   size: n = "md",
   interactive: s = !1,
-  className: c,
-  itemClassName: f
+  className: i,
+  itemClassName: m
 }) => {
-  const b = x(
+  const g = x(
     // Base styles
     "space-y-1",
     // Variant styles
@@ -4264,7 +4268,7 @@ const ur = ({
       "text-base": n === "md",
       "text-lg": n === "lg"
     },
-    c
+    i
   ), p = (l, u) => x(
     // Base item styles
     "transition-colors duration-200",
@@ -4283,40 +4287,40 @@ const ur = ({
     l.disabled && {
       "opacity-50 cursor-not-allowed": !0
     },
-    f
-  ), g = (l) => {
+    m
+  ), b = (l) => {
     s && !l.disabled && l.onClick && l.onClick();
-  }, m = (l, u) => {
+  }, f = (l, u) => {
     s && !u.disabled && (l.key === "Enter" || l.key === " ") && (l.preventDefault(), u.onClick?.());
   };
-  return a === "ordered" ? /* @__PURE__ */ e("ol", { className: b, children: t.map((l, u) => /* @__PURE__ */ e(
+  return a === "ordered" ? /* @__PURE__ */ e("ol", { className: g, children: t.map((l, u) => /* @__PURE__ */ e(
     "li",
     {
       className: p(l),
-      onClick: () => g(l),
-      onKeyDown: (h) => m(h, l),
+      onClick: () => b(l),
+      onKeyDown: (h) => f(h, l),
       tabIndex: s && !l.disabled ? 0 : void 0,
       role: s ? "button" : void 0,
       children: l.content
     },
     l.id || u
-  )) }) : a === "description" ? /* @__PURE__ */ e("dl", { className: b, children: t.map((l, u) => /* @__PURE__ */ e(
+  )) }) : a === "description" ? /* @__PURE__ */ e("dl", { className: g, children: t.map((l, u) => /* @__PURE__ */ e(
     "div",
     {
       className: p(l),
-      onClick: () => g(l),
-      onKeyDown: (h) => m(h, l),
+      onClick: () => b(l),
+      onKeyDown: (h) => f(h, l),
       tabIndex: s && !l.disabled ? 0 : void 0,
       role: s ? "button" : void 0,
       children: l.content
     },
     l.id || u
-  )) }) : /* @__PURE__ */ e("ul", { className: b, children: t.map((l, u) => /* @__PURE__ */ e(
+  )) }) : /* @__PURE__ */ e("ul", { className: g, children: t.map((l, u) => /* @__PURE__ */ e(
     "li",
     {
       className: p(l),
-      onClick: () => g(l),
-      onKeyDown: (h) => m(h, l),
+      onClick: () => b(l),
+      onKeyDown: (h) => f(h, l),
       tabIndex: s && !l.disabled ? 0 : void 0,
       role: s ? "button" : void 0,
       children: l.content
@@ -4329,42 +4333,42 @@ const ur = ({
   onClose: r,
   labels: n,
   initialCommandPath: s,
-  initialActiveIndex: c
+  initialActiveIndex: i
 }) => {
-  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())
+  const [m, g] = O(""), [p, b] = O(s || []), [f, l] = O(i || 0), u = Z(null), h = Z(null), C = (p.length ? t.find((v) => v.id === p[0])?.subCommands || [] : t).filter(
+    (v) => v.label.toLowerCase().includes(m.toLowerCase())
   );
   return K(() => {
-    a || (b(""), g(s || []), l(c || 0));
+    a || (g(""), b(s || []), l(i || 0));
   }, [a]), K(() => {
-    const N = (I) => {
+    const v = (j) => {
       if (a) {
-        if (I.key === "Escape")
+        if (j.key === "Escape")
           r();
-        else if (I.key === "ArrowUp")
+        else if (j.key === "ArrowUp")
           l(
-            (v) => v > 0 ? v - 1 : w.length - 1
+            (N) => N > 0 ? N - 1 : C.length - 1
           );
-        else if (I.key === "ArrowDown")
+        else if (j.key === "ArrowDown")
           l(
-            (v) => v < w.length - 1 ? v + 1 : 0
+            (N) => N < C.length - 1 ? N + 1 : 0
           );
-        else if (I.key === "Enter") {
-          const v = w[m];
-          v && (v.subCommands ? (g([...p, v.id]), l(0)) : v.action && (v.action(), r()));
+        else if (j.key === "Enter") {
+          const N = C[f];
+          N && (N.subCommands ? (b([...p, N.id]), l(0)) : N.action && (N.action(), r()));
         }
       }
     };
-    return document.addEventListener("keydown", N), () => document.removeEventListener("keydown", N);
-  }, [a, r, w, m, p]), K(() => {
-    const N = (I) => {
-      u.current && !u.current.contains(I.target) && r();
+    return document.addEventListener("keydown", v), () => document.removeEventListener("keydown", v);
+  }, [a, r, C, f, p]), K(() => {
+    const v = (j) => {
+      u.current && !u.current.contains(j.target) && r();
     };
-    return a && document.addEventListener("mousedown", N), () => document.removeEventListener("mousedown", N);
+    return a && document.addEventListener("mousedown", v), () => document.removeEventListener("mousedown", v);
   }, [a, r]), K(() => {
     if (!a) return;
-    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(
+    h.current?.querySelector(`[data-index="${f}"]`)?.scrollIntoView({ block: "nearest" });
+  }, [f, 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",
@@ -4378,8 +4382,8 @@ const ur = ({
               type: "text",
               autoFocus: !0,
               placeholder: n?.searchPlaceholder || "Search commands...",
-              value: f,
-              onChange: (N) => b(N.target.value),
+              value: m,
+              onChange: (v) => g(v.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"
             }
           )
@@ -4390,23 +4394,23 @@ const ur = ({
             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, I) => /* @__PURE__ */ d(
+              C.length === 0 && /* @__PURE__ */ e("div", { className: "text-muted text-center text-sm", children: n?.noCommandsFound || "No commands found" }),
+              C.map((v, j) => /* @__PURE__ */ d(
                 "div",
                 {
-                  "data-index": I,
-                  className: `flex items-center p-2 cursor-pointer rounded-md text-default ${I === m ? "bg-neutral-container" : ""}`,
+                  "data-index": j,
+                  className: `flex items-center p-2 cursor-pointer rounded-md text-default ${j === f ? "bg-neutral-container" : ""}`,
                   onClick: () => {
-                    N.subCommands ? (g([...p, N.id]), l(0)) : N.action && (N.action(), r());
+                    v.subCommands ? (b([...p, v.id]), l(0)) : v.action && (v.action(), r());
                   },
-                  onMouseEnter: () => l(I),
+                  onMouseEnter: () => l(j),
                   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(qe, { className: "w-4 h-4" }) })
+                    v.icon && /* @__PURE__ */ e("span", { className: "mr-3", children: v.icon }),
+                    /* @__PURE__ */ e("span", { className: "flex-grow", children: v.label }),
+                    v.subCommands && /* @__PURE__ */ e("span", { className: "text-muted", children: /* @__PURE__ */ e(qe, { className: "w-4 h-4" }) })
                   ]
                 },
-                N.id
+                v.id
               ))
             ]
           }
@@ -4496,26 +4500,26 @@ const ur = ({
     background: r,
     radius: n,
     shadow: s,
-    border: c,
-    borderColor: f,
-    className: b,
+    border: i,
+    borderColor: m,
+    className: g,
     children: p,
-    ...g
-  }, m) => /* @__PURE__ */ e(
+    ...b
+  }, f) => /* @__PURE__ */ e(
     "div",
     {
-      ref: m,
+      ref: f,
       className: x(
         t && Pt[t],
         a && _t[a],
         r && Ot[r],
         n && Vt[n],
         s && Ft[s],
-        c && Wt[c],
-        f && Rt[f],
-        b
+        i && Wt[i],
+        m && Rt[m],
+        g
       ),
-      ...g,
+      ...b,
       children: p
     }
   )
@@ -4531,20 +4535,20 @@ function hr({
   framework: r = "react",
   fallback: n,
   componentProps: s,
-  className: c
+  className: i
 }) {
-  const f = X(null), [b, p] = V(!0), [g, m] = V(null), l = X(null);
-  return X(null), K(() => {
+  const m = Z(null), [g, p] = O(!0), [b, f] = O(null), l = Z(null);
+  return Z(null), K(() => {
     let u = !0;
     return (async () => {
       p(!0);
       try {
-        const C = await a();
+        const k = await a();
         if (!u) return;
-        const w = C.component || C.default || C;
-        m(r === "react" ? () => w : () => C);
-      } catch (C) {
-        console.error(`[FederatedResource] Load failed: ${t}`, C);
+        const C = k.component || k.default || k;
+        f(r === "react" ? () => C : () => k);
+      } catch (k) {
+        console.error(`[FederatedResource] Load failed: ${t}`, k);
       } finally {
         u && p(!1);
       }
@@ -4552,25 +4556,25 @@ function hr({
       u = !1;
     };
   }, [t, a]), K(() => {
-    if (b || !g || r === "react") return;
-    const u = f.current;
+    if (g || !b || r === "react") return;
+    const u = m.current;
     if (u) {
       if (r === "svelte") {
-        const h = g.default || g, C = new h({ target: u, props: s || {} });
-        return l.current = C, () => C.$destroy();
+        const h = b.default || b, k = new h({ target: u, props: s || {} });
+        return l.current = k, () => k.$destroy();
       }
-      if (g.mount) {
-        const h = g.mount({ container: u, props: s || {} });
+      if (b.mount) {
+        const h = b.mount({ container: u, props: s || {} });
         return () => {
-          typeof h == "function" ? h() : g.unmount?.(u);
+          typeof h == "function" ? h() : b.unmount?.(u);
         };
       }
     }
-  }, [g, r, b]), K(() => {
+  }, [b, r, g]), K(() => {
     r === "svelte" && l.current && l.current.$set?.(s);
-  }, [s, r]), /* @__PURE__ */ d("div", { ref: f, className: c, style: { display: "contents" }, children: [
-    b && n,
-    r === "react" && g && /* @__PURE__ */ e(g, { ...s })
+  }, [s, r]), /* @__PURE__ */ d("div", { ref: m, className: i, style: { display: "contents" }, children: [
+    g && n,
+    r === "react" && b && /* @__PURE__ */ e(b, { ...s })
   ] });
 }
 class pr extends Ge {
@@ -4634,7 +4638,7 @@ export {
   tr as TabBar,
   Le as Table,
   wt as Tabs,
-  Z as Text,
+  Y as Text,
   Ne as TextArea,
   ue as TextField,
   Xt as VideoSurface,