unifyedx-storybook-new 0.2.27 → 0.2.29

package/dist/unifyedx-storybook-new.es.js

@@ -1,7 +1,7 @@
 import { jsxs as n, jsx as e, Fragment as te } from "react/jsx-runtime";
-import re, { useState as L, useMemo as ue, useId as Qe, Fragment as Q, useEffect as Z, useCallback as ae, useRef as xe } from "react";
+import se, { useState as M, useMemo as ue, useId as Qe, Fragment as Q, useEffect as Z, useCallback as ae, useRef as xe } from "react";
 import { a as H, U as mt, X as ge, P as c, L as Ua, C as ve, b as tt, f as Ze, d as yt, D as Yt, F as qa, e as Ga, h as Ya, T as Ke, u as Wa, i as zt, I as Wt, j as Jt, k as Ja, l as Xa, m as Ha, n as Xt, S as vt, o as Ht, M as Qa, p as Za, q as wt, r as Ka, A as er, E as Qt, s as tr, t as ar, v as rr, w as nr, x as Zt, y as sr, z as Kt, B as ea, G as lr, H as ir, J as or, K as et, N as ut, O as ht, Q as cr, R as dr, V as ta, W as mr, Y as Nt, Z as ur, _ as hr, $ as Me, a0 as pr, a1 as gr, a2 as br, a3 as fr, a4 as xr, a5 as yr, a6 as St, a7 as vr, a8 as wr, a9 as Nr, aa as kr, ab as Cr, ac as zr, ad as Sr, ae as Dr, af as $r, ag as Fe, ah as aa, ai as Tr, aj as Ar, ak as Fr, al as Er, am as Rr, an as ra, ao as Ir, ap as Or, aq as na, ar as Pr, as as pt, at as sa, au as Lr } from "./vendor-wRQnjUYv.js";
-import { Popover as Mr, PopoverButton as Br, PopoverPanel as jr, Transition as he, Dialog as ye, TransitionChild as Ne, DialogPanel as Ee, DialogTitle as at, TabGroup as Vr, TabList as _r, Tab as se, TabPanels as Ur, RadioGroup as qe, Listbox as K, ListboxButton as qr, ListboxOptions as Gr, ListboxOption as Yr, SwitchGroup as Wr, Switch as ot, Menu as Jr, MenuButton as Xr, Portal as Hr, MenuItems as Qr, MenuItem as Zr, DialogBackdrop as Kr } from "@headlessui/react";
+import { Popover as Mr, PopoverButton as Br, PopoverPanel as jr, Transition as he, Dialog as ye, TransitionChild as Ne, DialogPanel as Ee, DialogTitle as at, TabGroup as Vr, TabList as _r, Tab as ne, TabPanels as Ur, RadioGroup as qe, Listbox as K, ListboxButton as qr, ListboxOptions as Gr, ListboxOption as Yr, SwitchGroup as Wr, Switch as ot, Menu as Jr, MenuButton as Xr, Portal as Hr, MenuItems as Qr, MenuItem as Zr, DialogBackdrop as Kr } from "@headlessui/react";
 import { motion as le, AnimatePresence as Ce } from "framer-motion";
 import { d as en } from "./vendor-lodash-C6Pmit-j.js";
 import { useFloating as la, offset as ia, flip as oa, shift as ca, autoUpdate as da, useClick as tn, useDismiss as an, useInteractions as rn, FloatingPortal as nn } from "@floating-ui/react";
@@ -29,14 +29,14 @@ const kn = (t) => {
   className: m,
   ...o
 }) => {
-  const [u, p] = L(!1), b = ue(() => Cn(a), []), f = t && !u, r = !f && a, w = !f && !a, d = H(
+  const [u, p] = M(!1), b = ue(() => Cn(a), []), f = t && !u, r = !f && a, y = !f && !a, d = H(
     "avatar-container",
     `avatar--size-${s}`,
     m
-  ), h = f ? "transparent" : i || b.bg, z = l || b.text;
+  ), h = f ? "transparent" : i || b.bg, $ = l || b.text;
   return /* @__PURE__ */ n("div", { className: d, style: {
     backgroundColor: h,
-    color: z
+    color: $
   }, ...o, children: [
     f && /* @__PURE__ */ e(
       "img",
@@ -48,10 +48,10 @@ const kn = (t) => {
       }
     ),
     r && /* @__PURE__ */ e("span", { className: "avatar-initials", "aria-label": a, children: zn(a) }),
-    w && /* @__PURE__ */ e("span", { className: "avatar-icon", children: /* @__PURE__ */ e(mt, {}) })
+    y && /* @__PURE__ */ e("span", { className: "avatar-icon", children: /* @__PURE__ */ e(mt, {}) })
   ] });
 }, Sn = ({ children: t, max: a = 4, truncatedMessage: s = "Members", ...i }) => {
-  const l = re.Children.toArray(t), m = l.slice(0, a), o = l.length - a;
+  const l = se.Children.toArray(t), m = l.slice(0, a), o = l.length - a;
   return /* @__PURE__ */ n("div", { className: "avatar-group-container", ...i, children: [
     m,
     o > 0 && /* @__PURE__ */ n("div", { className: "avatar-container avatar--size-medium avatar-excess", children: [
@@ -153,16 +153,16 @@ const $n = {
   label: f,
   children: r,
   // ✅ Add children to the props list
-  onClick: w,
+  onClick: y,
   ...d
 }) => {
-  const h = p || m, z = u && !f, $ = H(
+  const h = p || m, $ = u && !f, T = H(
     "btn-base",
     $n[b],
     Tn[o],
     {
       "is-loading": m,
-      "btn-icon-only": z
+      "btn-icon-only": $
     },
     l
   );
@@ -171,11 +171,11 @@ const $n = {
     {
       "data-testid": t,
       type: s,
-      className: $,
+      className: T,
       disabled: h,
-      onClick: w,
-      title: a || z && i || (typeof f == "string" ? f : void 0),
-      "aria-label": i || z && a || (typeof f == "string" ? f : void 0),
+      onClick: y,
+      title: a || $ && i || (typeof f == "string" ? f : void 0),
+      "aria-label": i || $ && a || (typeof f == "string" ? f : void 0),
       ...d,
       children: m ? /* @__PURE__ */ e(Ua, { className: "loader-spin", "data-testid": "button-loader" }) : /* @__PURE__ */ n(te, { children: [
         u && /* @__PURE__ */ e(u, { size: b === "large" ? 20 : 16 }),
@@ -321,7 +321,7 @@ const $n = {
 }) => {
   const b = t?.from, f = t?.to, r = (d) => {
     d.stopPropagation(), d.preventDefault(), s?.();
-  }, w = b && f ? /* @__PURE__ */ n(te, { children: [
+  }, y = b && f ? /* @__PURE__ */ n(te, { children: [
     Ze(b, "MMM d, y"),
     " - ",
     Ze(f, "MMM d, y")
@@ -340,10 +340,10 @@ const $n = {
               "datepicker-trigger--disabled": o
             }),
             disabled: o,
-            "aria-label": b && f ? `Selected range is ${w}` : i,
+            "aria-label": b && f ? `Selected range is ${y}` : i,
             children: [
               /* @__PURE__ */ e(yt, { className: "datepicker-icon" }),
-              /* @__PURE__ */ e("span", { className: "datepicker-value", children: w })
+              /* @__PURE__ */ e("span", { className: "datepicker-value", children: y })
             ]
           }
         ),
@@ -630,12 +630,12 @@ const $n = {
   handleRemoveRejectedFile: b,
   handleSubmit: f,
   isSubmitting: r,
-  formErrors: w,
+  formErrors: y,
   // --- UI Text ---
   title: d = "Upload Files",
   subHeading: h = "Supports PNG, JPG, PDF. Max size: 50MB."
 }) => {
-  const z = o.length > 0 || u.length > 0;
+  const $ = o.length > 0 || u.length > 0;
   return /* @__PURE__ */ e(he, { appear: !0, show: t, as: Q, children: /* @__PURE__ */ n(
     ye,
     {
@@ -671,7 +671,7 @@ const $n = {
               Ee,
               {
                 className: "dialog-panel",
-                onClick: ($) => $.stopPropagation(),
+                onClick: (T) => T.stopPropagation(),
                 children: [
                   /* @__PURE__ */ e("input", { ...i() }),
                   /* @__PURE__ */ n("form", { onSubmit: f, className: "form-wrapper", children: [
@@ -710,11 +710,11 @@ const $n = {
                           ]
                         }
                       ),
-                      w.filesToUpload && /* @__PURE__ */ e("p", { className: "form-error-message", children: w.filesToUpload.message }),
-                      z && /* @__PURE__ */ n("div", { className: "file-list-container", children: [
+                      y.filesToUpload && /* @__PURE__ */ e("p", { className: "form-error-message", children: y.filesToUpload.message }),
+                      $ && /* @__PURE__ */ n("div", { className: "file-list-container", children: [
                         /* @__PURE__ */ e("h3", { children: "Upload Queue" }),
                         /* @__PURE__ */ n("ul", { className: "file-list", children: [
-                          o.map(($, A) => /* @__PURE__ */ n(
+                          o.map((T, A) => /* @__PURE__ */ n(
                             "li",
                             {
                               className: "file-item",
@@ -723,12 +723,12 @@ const $n = {
                                   /* @__PURE__ */ e(
                                     Tt,
                                     {
-                                      extension: $.name.split(".").pop()
+                                      extension: T.name.split(".").pop()
                                     }
                                   ),
                                   /* @__PURE__ */ n("div", { children: [
-                                    /* @__PURE__ */ e("p", { className: "file-item-name", children: $.name }),
-                                    /* @__PURE__ */ e("p", { className: "file-item-size", children: At($.size) })
+                                    /* @__PURE__ */ e("p", { className: "file-item-name", children: T.name }),
+                                    /* @__PURE__ */ e("p", { className: "file-item-size", children: At(T.size) })
                                   ] })
                                 ] }),
                                 /* @__PURE__ */ e(
@@ -742,9 +742,9 @@ const $n = {
                                 )
                               ]
                             },
-                            `${$.name}-${A}`
+                            `${T.name}-${A}`
                           )),
-                          u.map(({ file: $, message: A }, E) => /* @__PURE__ */ n(
+                          u.map(({ file: T, message: A }, E) => /* @__PURE__ */ n(
                             "li",
                             {
                               className: "file-item file-item--rejected",
@@ -753,12 +753,12 @@ const $n = {
                                   /* @__PURE__ */ e(
                                     Tt,
                                     {
-                                      extension: $.name.split(".").pop()
+                                      extension: T.name.split(".").pop()
                                     }
                                   ),
                                   /* @__PURE__ */ n("div", { children: [
-                                    /* @__PURE__ */ e("p", { className: "file-item-name", children: $.name }),
-                                    /* @__PURE__ */ e("p", { className: "file-item-size", children: At($.size) }),
+                                    /* @__PURE__ */ e("p", { className: "file-item-name", children: T.name }),
+                                    /* @__PURE__ */ e("p", { className: "file-item-size", children: At(T.size) }),
                                     /* @__PURE__ */ e("p", { className: "rejection-reason", children: A })
                                   ] })
                                 ] }),
@@ -773,7 +773,7 @@ const $n = {
                                 )
                               ]
                             },
-                            `${$.name}-${E}`
+                            `${T.name}-${E}`
                           ))
                         ] })
                       ] })
@@ -858,75 +858,75 @@ const $n = {
   fetchCreatedOrUpdatedByUsers: u = async () => []
   // Mockable fetcher
 }) => {
-  const [p, b] = L({
+  const [p, b] = M({
     createdBy: [],
     updatedBy: []
-  }), [f, r] = L({
+  }), [f, r] = M({
     createdBy: !1,
     updatedBy: !1
-  }), [w, d] = L({
+  }), [y, d] = M({
     startDate: null
-  }), [h, z] = L({
+  }), [h, $] = M({
     endDate: null
-  }), $ = Wa({
+  }), T = Wa({
     initialValues: JSON.parse(JSON.stringify(m)),
     // Deep copy
-    onSubmit: (T) => {
-      const v = {};
-      Object.keys(T).forEach((g) => {
-        v[g] = {
-          operator: T[g].operator || "in",
-          values: Array.isArray(T[g].values) ? T[g].values : [],
-          range: T[g].range || null
+    onSubmit: (C) => {
+      const g = {};
+      Object.keys(C).forEach((v) => {
+        g[v] = {
+          operator: C[v].operator || "in",
+          values: Array.isArray(C[v].values) ? C[v].values : [],
+          range: C[v].range || null
         };
-      }), console.log("[storybook filter] Applied Filters:", v), typeof s == "function" && s({
-        filters: v,
+      }), console.log("[storybook filter] Applied Filters:", g), typeof s == "function" && s({
+        filters: g,
         activeCount: E
       }), a();
     },
     enableReinitialize: !0
-  }), A = ue(() => l.reduce((T, v) => {
-    const g = v.key, x = $.values[g];
-    let C = !1;
-    if (x)
-      switch (v.type) {
+  }), A = ue(() => l.reduce((C, g) => {
+    const v = g.key, w = T.values[v];
+    let z = !1;
+    if (w)
+      switch (g.type) {
         case "multiselect":
         case "multiselect-users":
-          C = Array.isArray(x.values) && x.values.length > 0;
+          z = Array.isArray(w.values) && w.values.length > 0;
           break;
         case "date":
-          (x.range && x.range !== "" || Array.isArray(x.values) && x.values.length > 0) && (C = !0);
+          (w.range && w.range !== "" || Array.isArray(w.values) && w.values.length > 0) && (z = !0);
           break;
       }
-    return T[g] = C, T;
-  }, {}), [l, $.values]), E = Object.values(A).filter(Boolean).length, I = ue(() => l.some((T) => {
-    if (T.type !== "date") return !1;
-    const v = $.values?.[T.key]?.values;
-    if (!Array.isArray(v) || v.length < 2) return !1;
-    const [g, x] = v;
-    if (!g || !x) return !1;
-    const C = g instanceof Date ? g : new Date(g), N = x instanceof Date ? x : new Date(x);
-    return C > N;
-  }), [l, $.values]), j = async (T, v) => {
+    return C[v] = z, C;
+  }, {}), [l, T.values]), E = Object.values(A).filter(Boolean).length, I = ue(() => l.some((C) => {
+    if (C.type !== "date") return !1;
+    const g = T.values?.[C.key]?.values;
+    if (!Array.isArray(g) || g.length < 2) return !1;
+    const [v, w] = g;
+    if (!v || !w) return !1;
+    const z = v instanceof Date ? v : new Date(v), N = w instanceof Date ? w : new Date(w);
+    return z > N;
+  }), [l, T.values]), j = async (C, g) => {
     try {
-      r((x) => ({ ...x, [T]: !0 }));
-      const g = await u(T, v);
-      b((x) => ({ ...x, [T]: g }));
-    } catch (g) {
-      console.error(`Error fetching ${T} users:`, g);
+      r((w) => ({ ...w, [C]: !0 }));
+      const v = await u(C, g);
+      b((w) => ({ ...w, [C]: v }));
+    } catch (v) {
+      console.error(`Error fetching ${C} users:`, v);
     } finally {
-      r((g) => ({ ...g, [T]: !1 }));
+      r((v) => ({ ...v, [C]: !1 }));
     }
-  }, V = (T) => {
-    const v = l[T].key, g = l[T].url;
-    l[T].type === "multiselect-users" && p[v].length === 0 && !f[v] && j(v, g);
+  }, _ = (C) => {
+    const g = l[C].key, v = l[C].url;
+    l[C].type === "multiselect-users" && p[g].length === 0 && !f[g] && j(g, v);
   }, G = () => {
-    $.resetForm(), b({ createdBy: [], updatedBy: [] }), i();
-  }, q = (T) => {
-    const v = l.find((C) => C.key === T);
-    if (!v) return null;
-    const g = $.values[T] || m[T], x = Array.isArray(g.values) ? g.values : [];
-    switch (v.type) {
+    T.resetForm(), b({ createdBy: [], updatedBy: [] }), i();
+  }, q = (C) => {
+    const g = l.find((z) => z.key === C);
+    if (!g) return null;
+    const v = T.values[C] || m[C], w = Array.isArray(v.values) ? v.values : [];
+    switch (g.type) {
       case "multiselect":
         return /* @__PURE__ */ n("div", { className: "filter-panel-content", children: [
           /* @__PURE__ */ n("div", { className: "filter-operator-group", children: [
@@ -934,10 +934,10 @@ const $n = {
             /* @__PURE__ */ e(
               "select",
               {
-                value: g.operator || "in",
-                onChange: (R) => $.setFieldValue(`${T}.operator`, R.target.value),
+                value: v.operator || "in",
+                onChange: (R) => T.setFieldValue(`${C}.operator`, R.target.value),
                 className: "filter-select",
-                children: v.operators.map((R) => /* @__PURE__ */ e("option", { value: R, children: R === "in" ? "Includes" : "Excludes" }, R))
+                children: g.operators.map((R) => /* @__PURE__ */ e("option", { value: R, children: R === "in" ? "Includes" : "Excludes" }, R))
               }
             )
           ] }),
@@ -947,42 +947,42 @@ const $n = {
                 "input",
                 {
                   type: "checkbox",
-                  id: `select-all-${T}`,
+                  id: `select-all-${C}`,
                   className: "filter-checkbox-input",
-                  checked: v.options.length > 0 && x.length === v.options.length,
+                  checked: g.options.length > 0 && w.length === g.options.length,
                   onChange: (R) => {
-                    const Y = R.target.checked ? v.options.map((W) => W.value) : [];
-                    $.setFieldValue(`${T}.values`, Y);
+                    const Y = R.target.checked ? g.options.map((W) => W.value) : [];
+                    T.setFieldValue(`${C}.values`, Y);
                   }
                 }
               ),
               /* @__PURE__ */ e(
                 "label",
                 {
-                  htmlFor: `select-all-${T}`,
+                  htmlFor: `select-all-${C}`,
                   className: "filter-checkbox-label",
                   children: "Select All"
                 }
               )
             ] }),
-            v.options.map((R) => /* @__PURE__ */ n("div", { className: "filter-checkbox-item", children: [
+            g.options.map((R) => /* @__PURE__ */ n("div", { className: "filter-checkbox-item", children: [
               /* @__PURE__ */ e(
                 "input",
                 {
                   type: "checkbox",
-                  id: `${T}-${R.value}`,
+                  id: `${C}-${R.value}`,
                   className: "filter-checkbox-input",
-                  checked: x.includes(R.value),
+                  checked: w.includes(R.value),
                   onChange: (Y) => {
-                    const W = Y.target.checked ? [...x, R.value] : x.filter((pe) => pe !== R.value);
-                    $.setFieldValue(`${T}.values`, W);
+                    const W = Y.target.checked ? [...w, R.value] : w.filter((pe) => pe !== R.value);
+                    T.setFieldValue(`${C}.values`, W);
                   }
                 }
               ),
               /* @__PURE__ */ e(
                 "label",
                 {
-                  htmlFor: `${T}-${R.value}`,
+                  htmlFor: `${C}-${R.value}`,
                   className: "filter-checkbox-label",
                   children: R.label
                 }
@@ -991,33 +991,33 @@ const $n = {
           ] })
         ] });
       case "multiselect-users":
-        const C = p[T] || [], N = f[T];
+        const z = p[C] || [], N = f[C];
         return /* @__PURE__ */ n("div", { className: "filter-panel-content", children: [
           /* @__PURE__ */ n("div", { className: "filter-operator-group", children: [
             /* @__PURE__ */ e("label", { className: "filter-label", children: "Operator:" }),
             /* @__PURE__ */ e(
               "select",
               {
-                value: g.operator || "in",
-                onChange: (R) => $.setFieldValue(`${T}.operator`, R.target.value),
+                value: v.operator || "in",
+                onChange: (R) => T.setFieldValue(`${C}.operator`, R.target.value),
                 className: "filter-select",
-                children: v.operators.map((R) => /* @__PURE__ */ e("option", { value: R, children: R === "in" ? "Includes" : "Excludes" }, R))
+                children: g.operators.map((R) => /* @__PURE__ */ e("option", { value: R, children: R === "in" ? "Includes" : "Excludes" }, R))
               }
             )
           ] }),
-          N ? /* @__PURE__ */ e("div", { className: "loading-spinner", children: /* @__PURE__ */ e("div", {}) }) : /* @__PURE__ */ e("div", { className: "filter-checkbox-list", children: C.length > 0 ? /* @__PURE__ */ n(te, { children: [
+          N ? /* @__PURE__ */ e("div", { className: "loading-spinner", children: /* @__PURE__ */ e("div", {}) }) : /* @__PURE__ */ e("div", { className: "filter-checkbox-list", children: z.length > 0 ? /* @__PURE__ */ n(te, { children: [
             /* @__PURE__ */ n("div", { className: "filter-checkbox-item", children: [
               /* @__PURE__ */ e(
                 "input",
                 {
                   type: "checkbox",
-                  id: `select-all-users-${T}`,
+                  id: `select-all-users-${C}`,
                   className: "filter-checkbox-input",
-                  checked: C.length > 0 && x.length === C.length,
+                  checked: z.length > 0 && w.length === z.length,
                   onChange: (R) => {
-                    const Y = R.target.checked ? C.map((W) => W.email) : [];
-                    $.setFieldValue(
-                      `${T}.values`,
+                    const Y = R.target.checked ? z.map((W) => W.email) : [];
+                    T.setFieldValue(
+                      `${C}.values`,
                       Y
                     );
                   }
@@ -1026,24 +1026,24 @@ const $n = {
               /* @__PURE__ */ e(
                 "label",
                 {
-                  htmlFor: `select-all-users-${T}`,
+                  htmlFor: `select-all-users-${C}`,
                   className: "filter-checkbox-label",
                   children: "Select All Users"
                 }
               )
             ] }),
-            C.map((R) => /* @__PURE__ */ n("div", { className: "filter-checkbox-item createdby", children: [
+            z.map((R) => /* @__PURE__ */ n("div", { className: "filter-checkbox-item createdby", children: [
               /* @__PURE__ */ e(
                 "input",
                 {
                   type: "checkbox",
-                  id: `${T}-${R.email}`,
+                  id: `${C}-${R.email}`,
                   className: "filter-checkbox-input",
-                  checked: x.includes(R.email),
+                  checked: w.includes(R.email),
                   onChange: (Y) => {
-                    const W = Y.target.checked ? [...x, R.email] : x.filter((pe) => pe !== R.email);
-                    $.setFieldValue(
-                      `${T}.values`,
+                    const W = Y.target.checked ? [...w, R.email] : w.filter((pe) => pe !== R.email);
+                    T.setFieldValue(
+                      `${C}.values`,
                       W
                     );
                   }
@@ -1052,7 +1052,7 @@ const $n = {
               /* @__PURE__ */ n(
                 "label",
                 {
-                  htmlFor: `${T}-${R.email}`,
+                  htmlFor: `${C}-${R.email}`,
                   className: "filter-checkbox-label",
                   children: [
                     /* @__PURE__ */ e("span", { className: "user-label-name", children: R.name }),
@@ -1064,7 +1064,7 @@ const $n = {
           ] }) : /* @__PURE__ */ e("div", { className: "text-center py-4 text-gray-500 text-sm", children: "No users loaded." }) })
         ] });
       case "date":
-        const y = g.values || [], [k, F] = y, M = k && F, U = y[0] || null, S = y[1] || null, O = {
+        const x = v.values || [], [k, F] = x, L = k && F, U = x[0] || null, S = x[1] || null, O = {
           startDate: U instanceof Date ? U.toISOString().slice(0, 10) : null,
           endDate: U instanceof Date ? U.toISOString().slice(0, 10) : null
         }, D = {
@@ -1078,17 +1078,17 @@ const $n = {
           { key: "this_month", label: "This Month" },
           { key: "last_month", label: "Last Month" },
           { key: "custom", label: "Custom" }
-        ], _ = (R) => {
+        ], V = (R) => {
           if (R === "anytime") {
-            $.setFieldValue(`${T}.values`, []), $.setFieldValue(`${T}.range`, "anytime");
+            T.setFieldValue(`${C}.values`, []), T.setFieldValue(`${C}.range`, "anytime");
             return;
           }
           if (R === "custom") {
-            $.setFieldValue(`${T}.range`, "custom");
+            T.setFieldValue(`${C}.range`, "custom");
             return;
           }
           const [Y, W] = On(R);
-          $.setFieldValue(`${T}.values`, Y && W ? [Y, W] : []), $.setFieldValue(`${T}.range`, R);
+          T.setFieldValue(`${C}.values`, Y && W ? [Y, W] : []), T.setFieldValue(`${C}.range`, R);
         };
         return /* @__PURE__ */ n("div", { className: "filter-panel-content", children: [
           /* @__PURE__ */ n("div", { className: "filter-operator-group", children: [
@@ -1096,20 +1096,20 @@ const $n = {
             /* @__PURE__ */ e(
               "select",
               {
-                value: g.operator,
-                onChange: (R) => $.setFieldValue(`${T}.operator`, R.target.value),
+                value: v.operator,
+                onChange: (R) => T.setFieldValue(`${C}.operator`, R.target.value),
                 className: "filter-select",
-                children: v.operators.map((R) => /* @__PURE__ */ e("option", { value: R, children: R === "in" ? "Is" : "Is not" }, R))
+                children: g.operators.map((R) => /* @__PURE__ */ e("option", { value: R, children: R === "in" ? "Is" : "Is not" }, R))
               }
             ),
-            M && /* @__PURE__ */ e(
+            L && /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
                 onClick: () => {
-                  $.setFieldValue(
-                    T,
-                    m[T]
+                  T.setFieldValue(
+                    C,
+                    m[C]
                   );
                 },
                 className: "filter-clear-selection-button",
@@ -1118,7 +1118,7 @@ const $n = {
             )
           ] }),
           /* @__PURE__ */ e("div", { className: "pb-0", children: /* @__PURE__ */ e("div", { className: "space-y-3", children: P.map((R) => {
-            const Y = g.range === R.key || R.key === "anytime" && (!Array.isArray(g.values) || g.values.length === 0);
+            const Y = v.range === R.key || R.key === "anytime" && (!Array.isArray(v.values) || v.values.length === 0);
             return /* @__PURE__ */ n(
               "label",
               {
@@ -1128,9 +1128,9 @@ const $n = {
                     "input",
                     {
                       type: "radio",
-                      name: `preset-${T}`,
+                      name: `preset-${C}`,
                       checked: Y,
-                      onChange: () => _(R.key),
+                      onChange: () => V(R.key),
                       className: "h-4 w-4"
                     }
                   ),
@@ -1152,8 +1152,8 @@ const $n = {
                   useRange: !1,
                   value: O,
                   onChange: (R) => {
-                    const Y = R?.startDate ? Be(new Date(R.startDate)) : null, W = y[1] || null;
-                    Y && ($.setFieldValue(`${T}.values`, [Y, W]), $.setFieldValue(`${T}.range`, "custom"));
+                    const Y = R?.startDate ? Be(new Date(R.startDate)) : null, W = x[1] || null;
+                    Y && (T.setFieldValue(`${C}.values`, [Y, W]), T.setFieldValue(`${C}.range`, "custom"));
                   },
                   inputClassName: "w-full rounded-xl border border-[#767676] px-4 py-2 text-sm font-normal text-[#101112] focus:border-violet-500 focus:outline-none focus:ring-1 focus:ring-violet-500",
                   primaryColor: "violet",
@@ -1176,8 +1176,8 @@ const $n = {
                   useRange: !1,
                   value: D,
                   onChange: (R) => {
-                    const Y = R?.startDate ? je(new Date(R.startDate)) : null, W = y[0] || null;
-                    Y && ($.setFieldValue(`${T}.values`, [W, Y]), $.setFieldValue(`${T}.range`, "custom"));
+                    const Y = R?.startDate ? je(new Date(R.startDate)) : null, W = x[0] || null;
+                    Y && (T.setFieldValue(`${C}.values`, [W, Y]), T.setFieldValue(`${C}.range`, "custom"));
                   },
                   inputClassName: "w-full rounded-xl border border-[#767676] px-4 py-2 text-sm font-normal text-[#101112] focus:border-violet-500 focus:outline-none focus:ring-1 focus:ring-violet-500",
                   primaryColor: "violet",
@@ -1234,22 +1234,22 @@ const $n = {
               }
             )
           ] }),
-          /* @__PURE__ */ n("form", { onSubmit: $.handleSubmit, className: "filter-form", children: [
+          /* @__PURE__ */ n("form", { onSubmit: T.handleSubmit, className: "filter-form", children: [
             /* @__PURE__ */ e("div", { className: "filter-content-wrapper", children: /* @__PURE__ */ n(
               Vr,
               {
                 vertical: !0,
-                onChange: V,
+                onChange: _,
                 style: {
                   display: "flex",
                   flexGrow: 1
                 },
                 children: [
-                  /* @__PURE__ */ e(_r, { className: "filter-tabs-list", children: l.map((T) => /* @__PURE__ */ n(se, { className: "filter-tab-item", children: [
+                  /* @__PURE__ */ e(_r, { className: "filter-tabs-list", children: l.map((C) => /* @__PURE__ */ n(ne, { className: "filter-tab-item", children: [
                     /* @__PURE__ */ e("div", { className: "filter-selection-horizontal-indicator" }),
                     /* @__PURE__ */ n("div", { className: "filter-lbl-indicator-wrapper", children: [
-                      T.label,
-                      A[T.key] && /* @__PURE__ */ e(
+                      C.label,
+                      A[C.key] && /* @__PURE__ */ e(
                         "span",
                         {
                           className: "filter-active-indicator",
@@ -1257,9 +1257,9 @@ const $n = {
                         }
                       )
                     ] })
-                  ] }, T.key)) }),
-                  /* @__PURE__ */ e(Ur, { className: "filter-tabs-panels", children: l.map((T) => /* @__PURE__ */ e(
-                    se.Panel,
+                  ] }, C.key)) }),
+                  /* @__PURE__ */ e(Ur, { className: "filter-tabs-panels", children: l.map((C) => /* @__PURE__ */ e(
+                    ne.Panel,
                     {
                       className: "filter-tab-panel",
                       children: /* @__PURE__ */ e(
@@ -1269,12 +1269,12 @@ const $n = {
                           animate: { opacity: 1, x: 0 },
                           transition: { duration: 0.3 },
                           className: "h-full",
-                          children: q(T.key)
+                          children: q(C.key)
                         },
-                        T.key
+                        C.key
                       )
                     },
-                    T.key
+                    C.key
                   )) })
                 ]
               }
@@ -1293,7 +1293,7 @@ const $n = {
                 "button",
                 {
                   type: "submit",
-                  disabled: !$.dirty || I,
+                  disabled: !T.dirty || I,
                   className: "filter-button apply",
                   children: [
                     "Apply Filters",
@@ -1375,7 +1375,7 @@ const $n = {
   size: b
   // Add size prop
 }) => {
-  const f = Rt[o] || Rt.info, r = f.icon, w = () => {
+  const f = Rt[o] || Rt.info, r = f.icon, y = () => {
     a({ primary: !0, secondary: !1 });
   }, d = () => {
     a({ primary: !1, secondary: !0 });
@@ -1424,7 +1424,7 @@ const $n = {
             l && /* @__PURE__ */ e(
               ee,
               {
-                onClick: w,
+                onClick: y,
                 label: l,
                 ...p
               }
@@ -1442,12 +1442,12 @@ const $n = {
   onItemsPerPageChange: l,
   itemsPerPageOptions: m = [10, 15, 20]
 }) => {
-  const o = Math.ceil(a / s), [u, p] = L(t);
+  const o = Math.ceil(a / s), [u, p] = M(t);
   Z(() => {
     p(t);
   }, [t]);
-  const b = Math.min((t - 1) * s + 1, a), f = Math.min(t * s, a), r = (w) => {
-    w.preventDefault();
+  const b = Math.min((t - 1) * s + 1, a), f = Math.min(t * s, a), r = (y) => {
+    y.preventDefault();
     let d = parseInt(u, 10);
     isNaN(d) || d < 1 ? d = 1 : d > o && (d = o), p(d), d !== t && i(d);
   };
@@ -1460,8 +1460,8 @@ const $n = {
           id: "items-per-page",
           className: "pagination-select",
           value: s,
-          onChange: (w) => l(Number(w.target.value)),
-          children: m.map((w) => /* @__PURE__ */ e("option", { value: w, children: w }, w))
+          onChange: (y) => l(Number(y.target.value)),
+          children: m.map((y) => /* @__PURE__ */ e("option", { value: y, children: y }, y))
         }
       ),
       /* @__PURE__ */ n("span", { className: "pagination-info", children: [
@@ -1500,7 +1500,7 @@ const $n = {
             type: "number",
             className: "page-input",
             value: u,
-            onChange: (w) => p(w.target.value),
+            onChange: (y) => p(y.target.value),
             onBlur: r,
             "aria-label": `Current page, Page ${t}`
           }
@@ -1586,7 +1586,7 @@ const $n = {
   customClass: m = "",
   ...o
 }) => {
-  const [u, p] = L(t);
+  const [u, p] = M(t);
   Z(() => {
     p(t);
   }, [t]);
@@ -1633,9 +1633,9 @@ const $n = {
   // From RHF's <Controller>
   showSearch: p = !0
 }) => {
-  const [b, f] = L(""), r = b === "" ? i : i.filter(
+  const [b, f] = M(""), r = b === "" ? i : i.filter(
     (d) => d.label.toLowerCase().includes(b.toLowerCase())
-  ), w = i.find((d) => a?.id ? d.id === a.id : d.id === a || d.value === a);
+  ), y = i.find((d) => a?.id ? d.id === a.id : d.id === a || d.value === a);
   return /* @__PURE__ */ e(K, { value: a, onChange: s, disabled: m, children: /* @__PURE__ */ n("div", { className: "select-wrapper", ref: u, children: [
     t && /* @__PURE__ */ e("label", { className: "select-label", children: t }),
     /* @__PURE__ */ n("div", { className: "select-button-container", children: [
@@ -1646,7 +1646,7 @@ const $n = {
             "select-button--error": !!o
           }),
           children: [
-            /* @__PURE__ */ e("span", { className: "select-value-display", children: w ? w.label : /* @__PURE__ */ e("span", { className: "placeholder", children: l }) }),
+            /* @__PURE__ */ e("span", { className: "select-value-display", children: y ? y.label : /* @__PURE__ */ e("span", { className: "placeholder", children: l }) }),
             /* @__PURE__ */ e(Ht, { className: "select-chevron", "aria-hidden": "true" })
           ]
         }
@@ -1700,7 +1700,7 @@ const $n = {
     o && /* @__PURE__ */ e("p", { className: "select-error-message", children: o })
   ] }) });
 }, Ln = () => {
-  const [t, a] = L(window.location.pathname);
+  const [t, a] = M(window.location.pathname);
   return Z(() => {
     const s = () => {
       a(window.location.pathname);
@@ -1715,7 +1715,7 @@ const $n = {
       return s;
   return null;
 }, fa = ({ item: t, isCollapsed: a, level: s = 0 }) => {
-  const { pathname: i } = Ln(), l = t.href || t.url || t.path, [m, o] = L(!1), u = t.icon;
+  const { pathname: i } = Ln(), l = t.href || t.url || t.path, [m, o] = M(!1), u = t.icon;
   Z(() => {
     xt([t], i) && o(!0);
   }, [t, i]);
@@ -1905,16 +1905,16 @@ const $n = {
   // ✅ New prop to control visibility
   ...u
 }) => {
-  const p = a || u.name, [b, f] = L(
+  const p = a || u.name, [b, f] = M(
     u.value?.length || u.defaultValue?.length || 0
   ), r = (d) => {
     f(d.target.value.length), u.onChange && u.onChange(d);
-  }, w = m - b;
+  }, y = m - b;
   return /* @__PURE__ */ n("div", { className: `textarea-wrapper ${i || ""}`, children: [
     /* @__PURE__ */ n("div", { className: "textarea-header", children: [
       t && /* @__PURE__ */ e("label", { htmlFor: p, className: "textarea-label", children: t }),
       o && m && /* @__PURE__ */ n("span", { className: "char-counter", children: [
-        w,
+        y,
         " characters remaining"
       ] })
     ] }),
@@ -1972,9 +1972,9 @@ const $n = {
   // For external styling of the tooltip itself
   ...o
 }) => {
-  const u = re.useId();
+  const u = se.useId();
   return /* @__PURE__ */ n(te, { children: [
-    re.cloneElement(t, { "data-tooltip-id": u }),
+    se.cloneElement(t, { "data-tooltip-id": u }),
     /* @__PURE__ */ e(
       Ka,
       {
@@ -2012,7 +2012,7 @@ const $n = {
   showProgress: p = !0,
   closeOnOverlayClick: b = !0
 }) => {
-  const f = s[i], r = Object.keys(s), w = r.indexOf(i), d = (w + 1) / r.length * 100, h = w > 0 && m.onBack;
+  const f = s[i], r = Object.keys(s), y = r.indexOf(i), d = (y + 1) / r.length * 100, h = y > 0 && m.onBack;
   return /* @__PURE__ */ e(he, { show: t, as: Q, children: /* @__PURE__ */ n(
     ye,
     {
@@ -2134,7 +2134,7 @@ const $n = {
   children: f,
   // ✅ Add children to the props list
   onClick: r,
-  ...w
+  ...y
 }) => {
   const d = u, h = H(
     "btn-base",
@@ -2153,7 +2153,7 @@ const $n = {
       onClick: r,
       title: i,
       "aria-label": i,
-      ...w,
+      ...y,
       children: o && /* @__PURE__ */ e(o, { size: p === "large" ? 20 : 16 })
     }
   );
@@ -2478,31 +2478,31 @@ function Hn({
   );
   function i({ open: b = !1, customHeader: f = {} } = {}) {
     if (b) {
-      const { Authorization: r, ...w } = It();
+      const { Authorization: r, ...y } = It();
       return {
-        headers: { ...w, ...a, ...f }
+        headers: { ...y, ...a, ...f }
       };
     }
     return { headers: { ...It(), ...f } };
   }
-  async function l(b, f, r = !1, w = {}) {
+  async function l(b, f, r = !1, y = {}) {
     return s.get(b, {
       params: f,
-      ...i({ open: r, customHeader: w })
+      ...i({ open: r, customHeader: y })
     });
   }
-  async function m(b, f, r = !1, w = {}) {
-    const d = { ...i({ open: r, customHeader: w }) };
+  async function m(b, f, r = !1, y = {}) {
+    const d = { ...i({ open: r, customHeader: y }) };
     return f !== void 0 && (d.data = f), s.delete(b, d);
   }
-  async function o(b, f = {}, r = !1, w = {}) {
-    return s.post(b, f, i({ open: r, customHeader: w }));
+  async function o(b, f = {}, r = !1, y = {}) {
+    return s.post(b, f, i({ open: r, customHeader: y }));
   }
-  async function u(b, f = {}, r = !1, w = {}) {
-    return s.put(b, f, i({ open: r, customHeader: w }));
+  async function u(b, f = {}, r = !1, y = {}) {
+    return s.put(b, f, i({ open: r, customHeader: y }));
   }
-  async function p(b, f = {}, r = !1, w = {}) {
-    return s.patch(b, f, i({ open: r, customHeader: w }));
+  async function p(b, f = {}, r = !1, y = {}) {
+    return s.patch(b, f, i({ open: r, customHeader: y }));
   }
   return {
     instance: s,
@@ -2600,7 +2600,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
     return es(i);
   }
 }, Ct = (t, a) => {
-  const [s, i] = L(t);
+  const [s, i] = M(t);
   return Z(
     () => {
       const l = sn(() => {
@@ -2672,35 +2672,35 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
   },
   isChanged: u = !1
 }) => {
-  const [p, b] = L(Pt[0]), [f, r] = L(""), w = Ct(f, 400), [d, h] = L([]), [z, $] = L(/* @__PURE__ */ new Set()), [A, E] = L(!1), [I, j] = L(Lt[0]), {
-    control: V,
+  const [p, b] = M(Pt[0]), [f, r] = M(""), y = Ct(f, 400), [d, h] = M([]), [$, T] = M(/* @__PURE__ */ new Set()), [A, E] = M(!1), [I, j] = M(Lt[0]), {
+    control: _,
     handleSubmit: G,
     watch: q,
-    formState: { errors: T, isSubmitting: v }
+    formState: { errors: C, isSubmitting: g }
   } = lr({
     defaultValues: { pendingInvites: [] },
     resolver: cr(as)
-  }), { fields: g, append: x, remove: C, update: N } = ir({
-    control: V,
+  }), { fields: v, append: w, remove: z, update: N } = ir({
+    control: _,
     name: "pendingInvites"
-  }), y = q("pendingInvites");
+  }), x = q("pendingInvites");
   Z(() => {
-    w.length > 1 ? (E(!0), Kn(p.name, w).then((D) => {
+    y.length > 1 ? (E(!0), Kn(p.name, y).then((D) => {
       h(D);
-    }).catch((D) => console.error("Search failed:", D)).finally(() => E(!1))) : (h([]), $(/* @__PURE__ */ new Set()));
-  }, [w, p]);
+    }).catch((D) => console.error("Search failed:", D)).finally(() => E(!1))) : (h([]), T(/* @__PURE__ */ new Set()));
+  }, [y, p]);
   const k = (D) => {
-    $((P) => {
-      const _ = new Set(P);
-      return _.has(D) ? _.delete(D) : _.add(D), _;
+    T((P) => {
+      const V = new Set(P);
+      return V.has(D) ? V.delete(D) : V.add(D), V;
     });
   }, F = () => {
-    d.filter((D) => z.has(D.id)).forEach((D) => {
-      g.find((P) => P.id === D.id) || x({ ...D, permission: I.name });
-    }), $(/* @__PURE__ */ new Set()), r("");
-  }, M = (D) => {
-    j(D), g.forEach(
-      (P, _) => N(_, { ...g[_], permission: D.name })
+    d.filter((D) => $.has(D.id)).forEach((D) => {
+      v.find((P) => P.id === D.id) || w({ ...D, permission: I.name });
+    }), T(/* @__PURE__ */ new Set()), r("");
+  }, L = (D) => {
+    j(D), v.forEach(
+      (P, V) => N(V, { ...v[V], permission: D.name })
     );
   }, U = async (D) => {
     try {
@@ -2717,13 +2717,13 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
           // Always send updated existing shares
         }, i);
       } else if (l === de.INTEREST) {
-        const P = D.pendingInvites.map((_) => ({
-          identity: _.id,
-          type: _.type.toLowerCase(),
+        const P = D.pendingInvites.map((V) => ({
+          identity: V.id,
+          type: V.type.toLowerCase(),
           opt: !0,
           lock: !1,
           moderator: !1,
-          userName: _.name,
+          userName: V.name,
           interestId: t?.data?.id
         }));
         o(P, i);
@@ -2747,7 +2747,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
       throw console.error("Failed to submit invites:", P), P;
     }
   }, S = (D) => {
-    const P = i[p.code].find((_) => _.name === D.name && _.permission !== "remove") || y.find((_) => _.name === D.name);
+    const P = i[p.code].find((V) => V.name === D.name && V.permission !== "remove") || x.find((V) => V.name === D.name);
     return P ? `${P.permission}` : "";
   }, O = () => {
     switch (l) {
@@ -2761,7 +2761,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
         return "Add User, Groups or Roles test";
     }
   };
-  return ue(() => (console.log("InviteFlow - isChanged:", u, "pendingInvites.length:", y.length), y.length === 0 && !u), [y.length, u]), /* @__PURE__ */ n("div", { className: "flex flex-col h-full bg-white", children: [
+  return ue(() => (console.log("InviteFlow - isChanged:", u, "pendingInvites.length:", x.length), x.length === 0 && !u), [x.length, u]), /* @__PURE__ */ n("div", { className: "flex flex-col h-full bg-white", children: [
     /* @__PURE__ */ n("header", { className: "flex items-center justify-between p-4 border-b border-gray-300 flex-shrink-0", children: [
       /* @__PURE__ */ e(ye.Title, { className: " text-gray-900 !mb-0 text-lg font-semibold", children: O() }),
       /* @__PURE__ */ n("div", { className: "flex items-center gap-4", children: [
@@ -2863,7 +2863,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                         "input",
                         {
                           type: "checkbox",
-                          checked: z.has(D.id),
+                          checked: $.has(D.id),
                           readOnly: !0,
                           className: "h-4 w-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500",
                           disabled: !!P
@@ -2900,7 +2900,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                   "button",
                   {
                     onClick: F,
-                    disabled: z.size === 0,
+                    disabled: $.size === 0,
                     className: "px-3 py-1 text-sm text-white bg-blue-600 rounded-md hover:bg-blue-700 disabled:bg-blue-300 disabled:cursor-not-allowed hover:cursor-pointer",
                     children: "Add"
                   }
@@ -2910,7 +2910,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
           }
         ) })
       ] }),
-      /* @__PURE__ */ e(Ce, { children: g.length > 0 && /* @__PURE__ */ n(
+      /* @__PURE__ */ e(Ce, { children: v.length > 0 && /* @__PURE__ */ n(
         le.div,
         {
           initial: { opacity: 0, y: 20 },
@@ -2920,14 +2920,14 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
             /* @__PURE__ */ n("div", { className: "flex justify-between items-center", children: [
               /* @__PURE__ */ n("div", { className: "font-semibold text-gray-800", children: [
                 "Pending Invites (",
-                g.length,
+                v.length,
                 ")"
               ] }),
               l === de.DRIVE && /* @__PURE__ */ e(
                 K,
                 {
                   value: I,
-                  onChange: M,
+                  onChange: L,
                   children: /* @__PURE__ */ n("div", { className: "relative", children: [
                     /* @__PURE__ */ n(K.Button, { className: "relative w-full border border-gray-300 bg-white rounded-md shadow-sm pl-3 pr-10 py-2 text-left hover:cursor-pointer focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500 sm:text-sm", children: [
                       /* @__PURE__ */ n("span", { className: "flex items-center", children: [
@@ -2951,7 +2951,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                           {
                             value: D,
                             className: ({ active: P }) => `${P ? "text-white bg-blue-600" : "text-gray-900"} hover:cursor-pointer select-none relative py-2 pl-10`,
-                            children: ({ selected: P, active: _ }) => /* @__PURE__ */ n(te, { children: [
+                            children: ({ selected: P, active: V }) => /* @__PURE__ */ n(te, { children: [
                               /* @__PURE__ */ n(
                                 "span",
                                 {
@@ -2960,7 +2960,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                                     /* @__PURE__ */ e(
                                       D.icon,
                                       {
-                                        className: `h-5 w-5 mr-2 ${_ ? "text-white" : "text-gray-400"}`
+                                        className: `h-5 w-5 mr-2 ${V ? "text-white" : "text-gray-400"}`
                                       }
                                     ),
                                     "Can ",
@@ -2985,7 +2985,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                 }
               )
             ] }),
-            /* @__PURE__ */ e("div", { className: "space-y-2", children: /* @__PURE__ */ e(Ce, { children: g.map((D, P) => /* @__PURE__ */ n(
+            /* @__PURE__ */ e("div", { className: "space-y-2", children: /* @__PURE__ */ e(Ce, { children: v.map((D, P) => /* @__PURE__ */ n(
               le.div,
               {
                 layout: !0,
@@ -3013,7 +3013,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                     /* @__PURE__ */ e(
                       "button",
                       {
-                        onClick: () => C(P),
+                        onClick: () => z(P),
                         className: "text-gray-400 hover:text-red-500 hover:cursor-pointer",
                         children: /* @__PURE__ */ e(et, { className: "h-5 w-5" })
                       }
@@ -3029,9 +3029,9 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
     ] }),
     /* @__PURE__ */ e("footer", { className: "p-4 border-t border-gray-300 flex-shrink-0", children: /* @__PURE__ */ n("div", { className: "flex justify-between items-center", children: [
       /* @__PURE__ */ n("p", { className: "text-sm text-gray-600", children: [
-        y.length,
+        x.length,
         " invitation",
-        y.length !== 1 ? "s" : "",
+        x.length !== 1 ? "s" : "",
         " selected"
       ] }),
       /* @__PURE__ */ n("div", { className: "flex gap-2", children: [
@@ -3047,9 +3047,9 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
           "button",
           {
             onClick: () => G(U)(),
-            disabled: v || y.length === 0 && !u,
+            disabled: g || x.length === 0 && !u,
             className: "px-4 py-2 text-sm font-medium text-white bg-blue-600 border border-transparent rounded-md shadow-sm hover:bg-blue-700 hover:cursor-pointer focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:bg-blue-300 disabled:cursor-not-allowed",
-            children: v ? "Inviting..." : l === de.DRIVE ? "Send Invites" : "Add"
+            children: g ? "Inviting..." : l === de.DRIVE ? "Send Invites" : "Add"
           }
         )
       ] })
@@ -3060,7 +3060,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
   { name: "Can manage", icon: ea, value: "edit" },
   { name: "Remove", icon: dr, isDestructive: !0, value: "remove" }
 ], ns = ({ item: t, allowedPermissions: a, onPermissionChange: s }) => {
-  const [i, l] = L(!1), { refs: m, floatingStyles: o, context: u } = la({
+  const [i, l] = M(!1), { refs: m, floatingStyles: o, context: u } = la({
     open: i,
     onOpenChange: l,
     middleware: [ia(8), oa(), ca({ padding: 8 })],
@@ -3069,11 +3069,11 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
   }), p = tn(u), b = an(u), { getReferenceProps: f, getFloatingProps: r } = rn([
     p,
     b
-  ]), w = dt.find((h) => h.name === t.permission || h.value === t.permission) || dt[0];
+  ]), y = dt.find((h) => h.name === t.permission || h.value === t.permission) || dt[0];
   return (
     // FIX: The <Listbox> component now wraps both the button and the portal.
     // This provides the necessary context for both children.
-    /* @__PURE__ */ n(K, { value: w, onChange: (h) => {
+    /* @__PURE__ */ n(K, { value: y, onChange: (h) => {
       s(h), l(!1);
     }, children: [
       /* @__PURE__ */ n(
@@ -3111,24 +3111,24 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                 K.Option,
                 {
                   className: ({
-                    active: z
+                    active: $
                   }) => `relative select-none py-2 pl-10 pr-4 hover:cursor-pointer
-                                            ${z ? "bg-blue-100 text-blue-900" : "text-gray-900"}
-                                            ${h.isDestructive && z ? "bg-red-100 text-red-900" : ""}
-                                            ${h.isDestructive && !z ? "text-red-600" : ""}`,
+                                            ${$ ? "bg-blue-100 text-blue-900" : "text-gray-900"}
+                                            ${h.isDestructive && $ ? "bg-red-100 text-red-900" : ""}
+                                            ${h.isDestructive && !$ ? "text-red-600" : ""}`,
                   value: h,
-                  children: ({ selected: z }) => /* @__PURE__ */ n(te, { children: [
+                  children: ({ selected: $ }) => /* @__PURE__ */ n(te, { children: [
                     /* @__PURE__ */ n(
                       "span",
                       {
-                        className: `flex items-center gap-2 truncate ${z ? "font-medium" : "font-normal"}`,
+                        className: `flex items-center gap-2 truncate ${$ ? "font-medium" : "font-normal"}`,
                         children: [
                           /* @__PURE__ */ e(h.icon, { className: "h-5 w-5", "aria-hidden": "true" }),
                           h.name
                         ]
                       }
                     ),
-                    z && /* @__PURE__ */ e("span", { className: "absolute inset-y-0 left-0 flex items-center pl-3 text-blue-600", children: /* @__PURE__ */ e(ht, { className: "h-5 w-5", "aria-hidden": "true" }) })
+                    $ && /* @__PURE__ */ e("span", { className: "absolute inset-y-0 left-0 flex items-center pl-3 text-blue-600", children: /* @__PURE__ */ e(ht, { className: "h-5 w-5", "aria-hidden": "true" }) })
                   ] })
                 },
                 h.name
@@ -3148,32 +3148,32 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
   existingShares: l,
   allowedPermissions: m
 }) => {
-  const [o, u] = L(l), [p, b] = L(0), [f, r] = L(""), w = Ct(f, 300), d = {
+  const [o, u] = M(l), [p, b] = M(0), [f, r] = M(""), y = Ct(f, 300), d = {
     users: o.users.filter(
-      (E) => E.name.toLowerCase().includes(w.toLowerCase())
+      (E) => E.name.toLowerCase().includes(y.toLowerCase())
     ),
     groups: o.groups.filter(
-      (E) => E.name.toLowerCase().includes(w.toLowerCase())
+      (E) => E.name.toLowerCase().includes(y.toLowerCase())
     ),
     roles: o.roles.filter(
-      (E) => E.name.toLowerCase().includes(w.toLowerCase())
+      (E) => E.name.toLowerCase().includes(y.toLowerCase())
     )
-  }, h = async (E, I, j, V) => {
+  }, h = async (E, I, j, _) => {
     const G = I.value;
     u((q) => ({
       ...q,
       [j]: q[j].map(
-        (T) => T.id === E.id ? { ...T, permission: G } : T
+        (C) => C.id === E.id ? { ...C, permission: G } : C
       )
     }));
-  }, z = () => {
+  }, $ = () => {
     const E = {
       users: o.users.filter((I) => I.permission !== "remove"),
       groups: o.groups.filter((I) => I.permission !== "remove"),
       roles: o.roles.filter((I) => I.permission !== "remove")
     };
     a(E);
-  }, $ = ["users", "groups", "roles"], A = ["Users", "Groups", "Roles"];
+  }, T = ["users", "groups", "roles"], A = ["Users", "Groups", "Roles"];
   return (
     // The main structure remains the same...
     /* @__PURE__ */ n("div", { className: "flex flex-col h-full bg-gray-50", children: [
@@ -3200,10 +3200,10 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
         )
       ] }),
       /* @__PURE__ */ n("div", { className: "flex flex-col flex-grow", children: [
-        /* @__PURE__ */ n(se.Group, { selectedIndex: p, onChange: b, children: [
+        /* @__PURE__ */ n(ne.Group, { selectedIndex: p, onChange: b, children: [
           /* @__PURE__ */ n("div", { className: "p-4 bg-white border-b border-gray-300", children: [
-            /* @__PURE__ */ e(se.List, { className: "flex space-x-1 bg-gray-100 p-1 rounded-lg", children: A.map((E) => /* @__PURE__ */ e(
-              se,
+            /* @__PURE__ */ e(ne.List, { className: "flex space-x-1 bg-gray-100 p-1 rounded-lg", children: A.map((E) => /* @__PURE__ */ e(
+              ne,
               {
                 className: ({
                   selected: I
@@ -3230,8 +3230,8 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
               animate: { y: 0, opacity: 1 },
               exit: { y: -10, opacity: 0 },
               transition: { duration: 0.2 },
-              children: /* @__PURE__ */ e(se.Panels, { as: Q, children: $.map((E) => /* @__PURE__ */ e(
-                se.Panel,
+              children: /* @__PURE__ */ e(ne.Panels, { as: Q, children: T.map((E) => /* @__PURE__ */ e(
+                ne.Panel,
                 {
                   className: "space-y-3 focus:outline-none",
                   children: /* @__PURE__ */ e(Ce, { children: d[E].length > 0 ? d[E].map((I) => /* @__PURE__ */ n(
@@ -3317,7 +3317,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
         /* @__PURE__ */ e("div", { className: "p-4 bg-white border-t border-gray-300 flex justify-end", children: /* @__PURE__ */ e(
           "button",
           {
-            onClick: z,
+            onClick: $,
             className: "px-4 py-2 bg-blue-600 text-white rounded-md shadow hover:bg-blue-700",
             children: "Update"
           }
@@ -3338,7 +3338,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
   onClose: s,
   members: i
 }) => {
-  const [l, m] = L(!0), [o, u] = L(""), p = Ct(o, 300), b = i.filter(
+  const [l, m] = M(!0), [o, u] = M(""), p = Ct(o, 300), b = i.filter(
     (d) => d.name.toLowerCase().includes(p.toLowerCase())
   ), f = {
     hidden: { opacity: 0 },
@@ -3352,7 +3352,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
     hidden: { y: 20, opacity: 0 },
     visible: { y: 0, opacity: 1 },
     exit: { opacity: 0, x: -20 }
-  }, w = () => l ? (
+  }, y = () => l ? (
     // Show 5 skeleton items while loading
     /* @__PURE__ */ e("div", { children: Array.from({ length: 5 }).map((d, h) => /* @__PURE__ */ e(ls, {}, h)) })
   ) : b.length === 0 ? /* @__PURE__ */ n(
@@ -3436,7 +3436,7 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
         placeholder: "Search members..."
       }
     ) }),
-    /* @__PURE__ */ e("div", { className: "flex-grow overflow-y-auto", children: w() })
+    /* @__PURE__ */ e("div", { className: "flex-grow overflow-y-auto", children: y() })
   ] });
 }, fe = {
   INVITE: "invite",
@@ -3459,28 +3459,28 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
   allowedPermissions: u = [],
   ...p
 }) => {
-  const [b, f] = L(fe.INVITE), [r, w] = L(t), [d, h] = L(null), [z, $] = L(!1), [A, E] = L([]), [I, j] = L(fe.MANAGE), V = () => {
+  const [b, f] = M(fe.INVITE), [r, y] = M(t), [d, h] = M(null), [$, T] = M(!1), [A, E] = M([]), [I, j] = M(fe.MANAGE), _ = () => {
     f(fe.INVITE), h(null), m();
   }, G = () => {
     f(fe.MANAGE);
-  }, q = async ({ id: g, name: x, type: C }) => {
-    if (C === "groups") {
+  }, q = async ({ id: v, name: w, type: z }) => {
+    if (z === "groups") {
       try {
-        const N = await Ve(`${Xe.getMembersForGroup(x)}`);
+        const N = await Ve(`${Xe.getMembersForGroup(w)}`);
       } catch (N) {
         console.log("Error searching entities:", N);
       }
       E(resp);
     }
-    h({ id: g, type: C, name: x }), j(b), f(fe.MEMBERS);
-  }, T = (g) => {
-    console.log("changedExistingShares", g), w(g);
-    const x = ct.mapValues(t, (y) => y.map((k) => ({ id: k.id, permission: k.permission })).sort((k, F) => k.id - F.id)), C = ct.mapValues(g, (y) => y.map((k) => ({ id: k.id, permission: k.permission })).sort((k, F) => k.id - F.id));
-    console.log("Existing data:", x), console.log("Changed data:", C);
-    const N = !ct.isEqual(x, C);
-    console.log("hasPermissionChanged:", N), $(N), f(b === fe.MEMBERS ? I : fe.INVITE);
+    h({ id: v, type: z, name: w }), j(b), f(fe.MEMBERS);
+  }, C = (v) => {
+    console.log("changedExistingShares", v), y(v);
+    const w = ct.mapValues(t, (x) => x.map((k) => ({ id: k.id, permission: k.permission })).sort((k, F) => k.id - F.id)), z = ct.mapValues(v, (x) => x.map((k) => ({ id: k.id, permission: k.permission })).sort((k, F) => k.id - F.id));
+    console.log("Existing data:", w), console.log("Changed data:", z);
+    const N = !ct.isEqual(w, z);
+    console.log("hasPermissionChanged:", N), T(N), f(b === fe.MEMBERS ? I : fe.INVITE);
   };
-  return /* @__PURE__ */ e(he, { appear: !0, show: a, as: Q, children: /* @__PURE__ */ n(ye, { as: "div", className: "relative z-50", onClose: V, children: [
+  return /* @__PURE__ */ e(he, { appear: !0, show: a, as: Q, children: /* @__PURE__ */ n(ye, { as: "div", className: "relative z-50", onClose: _, children: [
     /* @__PURE__ */ e("div", { className: "filter-modal-overlay", "aria-hidden": "true" }),
     /* @__PURE__ */ e("div", { className: "filter-modal-container", children: /* @__PURE__ */ e("div", { className: "filter-modal-positioner", children: /* @__PURE__ */ e(Ee, { className: "filter-modal-panel", style: { background: "white" }, children: (() => {
       switch (b) {
@@ -3497,8 +3497,8 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                 ss,
                 {
                   entity: i,
-                  onBack: T,
-                  onClose: V,
+                  onBack: C,
+                  onClose: _,
                   onOpenMembers: q,
                   existingShares: r,
                   calledBy: l,
@@ -3521,8 +3521,8 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                 is,
                 {
                   entity: d,
-                  onBack: T,
-                  onClose: V,
+                  onBack: C,
+                  onClose: _,
                   calledBy: l,
                   existingShares: r,
                   members: A
@@ -3545,14 +3545,14 @@ const Re = Hn(), Ve = Re.axiosGet, Qn = Re.axiosDelete, _e = Re.axiosPost, Zn =
                 {
                   entity: i,
                   onManage: G,
-                  onClose: V,
+                  onClose: _,
                   existingShares: r,
                   calledBy: l,
                   showExistingShares: o,
-                  onFinalSubmit: (g) => {
-                    s(g, r);
+                  onFinalSubmit: (v) => {
+                    s(v, r);
                   },
-                  isChanged: z
+                  isChanged: $
                 }
               )
             },
@@ -3583,51 +3583,51 @@ function nt({
   onSearch: f,
   // (query: string) => void (required if searchMode==="server")
   serverLoading: r = !1,
-  minSearchChars: w = 2,
+  minSearchChars: y = 2,
   // NEW: mappers (id/label keys)
-  getOptionId: d = (z) => String(z.id),
-  getOptionLabel: h = (z) => z.name
+  getOptionId: d = ($) => String($.id),
+  getOptionLabel: h = ($) => $.name
 }) {
-  const z = Qe(), $ = Qe(), [A, E] = L(""), I = xe(""), j = ue(() => {
-    const g = /* @__PURE__ */ new Map();
-    for (const x of a) g.set(d(x), x);
-    return g;
-  }, [a, d]), V = ue(() => Array.isArray(s) ? s.map((g) => g && typeof g == "object" ? j.get(d(g)) || null : j.get(String(g))).filter(Boolean) : [], [s, j, d]), G = ue(() => {
+  const $ = Qe(), T = Qe(), [A, E] = M(""), I = xe(""), j = ue(() => {
+    const v = /* @__PURE__ */ new Map();
+    for (const w of a) v.set(d(w), w);
+    return v;
+  }, [a, d]), _ = ue(() => Array.isArray(s) ? s.map((v) => v && typeof v == "object" ? j.get(d(v)) || null : j.get(String(v))).filter(Boolean) : [], [s, j, d]), G = ue(() => {
     if (!A) return a;
-    const g = A.toLowerCase();
-    return a.filter((x) => h(x).toLowerCase().includes(g));
+    const v = A.toLowerCase();
+    return a.filter((w) => h(w).toLowerCase().includes(v));
   }, [a, A, h]);
   Z(() => {
-    b === "server" && A.length >= w && A !== I.current && (I.current = A, f && f(A));
-  }, [A, b, w, f]);
-  const q = b === "client" ? G : a, T = () => {
-    if (!V.length)
+    b === "server" && A.length >= y && A !== I.current && (I.current = A, f && f(A));
+  }, [A, b, y, f]);
+  const q = b === "client" ? G : a, C = () => {
+    if (!_.length)
       return /* @__PURE__ */ e("span", { className: "text-gray-500", children: m });
-    const g = V.slice(0, u), x = V.length - u;
+    const v = _.slice(0, u), w = _.length - u;
     return /* @__PURE__ */ n("div", { className: "flex flex-wrap gap-2", children: [
-      g.map((C) => /* @__PURE__ */ e(
+      v.map((z) => /* @__PURE__ */ e(
         "span",
         {
           className: "px-2 py-1 text-xs font-medium text-white bg-gray-800 rounded-full",
-          children: h(C)
+          children: h(z)
         },
-        d(C)
+        d(z)
       )),
-      x > 0 && /* @__PURE__ */ n("span", { className: "px-2 py-1 text-xs font-medium text-gray-600 bg-gray-200 rounded-full", children: [
+      w > 0 && /* @__PURE__ */ n("span", { className: "px-2 py-1 text-xs font-medium text-gray-600 bg-gray-200 rounded-full", children: [
         "+",
-        x,
+        w,
         " more"
       ] })
     ] });
   };
-  return /* @__PURE__ */ e(K, { value: V, onChange: (g) => {
-    const x = Array.from(new Set(g.map((C) => d(C))));
-    p !== -1 && x.length > p || i(x);
-  }, multiple: !0, by: "id", children: ({ open: g }) => /* @__PURE__ */ n("div", { children: [
+  return /* @__PURE__ */ e(K, { value: _, onChange: (v) => {
+    const w = Array.from(new Set(v.map((z) => d(z))));
+    p !== -1 && w.length > p || i(w);
+  }, multiple: !0, by: "id", children: ({ open: v }) => /* @__PURE__ */ n("div", { children: [
     /* @__PURE__ */ e(
       K.Label,
       {
-        id: z,
+        id: $,
         className: "block text-sm font-medium leading-6 text-gray-900",
         children: t
       }
@@ -3636,16 +3636,16 @@ function nt({
       /* @__PURE__ */ n(
         K.Button,
         {
-          "aria-labelledby": z,
+          "aria-labelledby": $,
           "aria-invalid": !!o,
-          "aria-describedby": o ? $ : void 0,
+          "aria-describedby": o ? T : void 0,
           onBlur: l,
           className: Ge(
             "relative w-full min-h-[38px] cursor-default rounded-md bg-white py-1.5 pl-3 pr-10 text-left text-gray-900 shadow-sm ring-1 ring-inset focus:outline-none focus:ring-2 focus:ring-gray-600 sm:text-sm sm:leading-6",
             o ? "ring-red-500" : "ring-gray-300"
           ),
           children: [
-            /* @__PURE__ */ e("span", { className: "block truncate", children: T() }),
+            /* @__PURE__ */ e("span", { className: "block truncate", children: C() }),
             /* @__PURE__ */ e("span", { className: "absolute inset-y-0 right-0 flex items-center pr-2 pointer-events-none", children: /* @__PURE__ */ e(Ht, { className: "w-5 h-5 text-gray-400", "aria-hidden": "true" }) })
           ]
         }
@@ -3654,7 +3654,7 @@ function nt({
         he,
         {
           as: Q,
-          show: g,
+          show: v,
           leave: "transition ease-in duration-100",
           leaveFrom: "opacity-100",
           leaveTo: "opacity-0",
@@ -3664,22 +3664,22 @@ function nt({
               {
                 value: A,
                 onDebouncedChange: E,
-                placeholder: b === "server" ? `Search (min ${w})…` : "Search options…"
+                placeholder: b === "server" ? `Search (min ${y})…` : "Search options…"
               }
             ) }),
             b === "server" && r && /* @__PURE__ */ e("div", { className: "py-2 px-3 text-gray-500", children: "Loading…" }),
-            q.length === 0 && !r ? /* @__PURE__ */ e("div", { className: "py-2 px-3 text-gray-500", children: b === "server" ? A.length < w ? `Type at least ${w} characters to search.` : "No results." : "No options found." }) : q.map((x) => {
-              const C = d(x), N = h(x), y = V.some((F) => d(F) === C), k = p !== -1 && V.length >= p && !y;
+            q.length === 0 && !r ? /* @__PURE__ */ e("div", { className: "py-2 px-3 text-gray-500", children: b === "server" ? A.length < y ? `Type at least ${y} characters to search.` : "No results." : "No options found." }) : q.map((w) => {
+              const z = d(w), N = h(w), x = _.some((F) => d(F) === z), k = p !== -1 && _.length >= p && !x;
               return /* @__PURE__ */ e(
                 K.Option,
                 {
-                  value: x,
+                  value: w,
                   disabled: k,
                   className: ({ active: F }) => Ge(
                     k ? " text-gray-400  bg-white  cursor-not-allowed" : F ? " bg-gray-200  text-gray-900" : " text-gray-900",
                     " relative  cursor-default  select-none  py-2  pl-3  pr-9"
                   ),
-                  children: ({ selected: F, active: M }) => /* @__PURE__ */ n(te, { children: [
+                  children: ({ selected: F, active: L }) => /* @__PURE__ */ n(te, { children: [
                     /* @__PURE__ */ e(
                       "span",
                       {
@@ -3694,7 +3694,7 @@ function nt({
                       "span",
                       {
                         className: Ge(
-                          M ? " text-gray-900" : " text-gray-600",
+                          L ? " text-gray-900" : " text-gray-600",
                           " absolute  inset-y-0  right-0  flex  items-center  pr-4"
                         ),
                         children: /* @__PURE__ */ e(tt, { className: "w-5 h-5", "aria-hidden": "true" })
@@ -3702,13 +3702,13 @@ function nt({
                     )
                   ] })
                 },
-                C
+                z
               );
             })
           ] })
         }
       ),
-      o && /* @__PURE__ */ e("p", { id: $, className: "mt-1 text-sm text-red-600", children: o })
+      o && /* @__PURE__ */ e("p", { id: T, className: "mt-1 text-sm text-red-600", children: o })
     ] })
   ] }) });
 }
@@ -3866,10 +3866,10 @@ function ds({
   dropId: f,
   indent: r = 24
 }) {
-  const { setNodeRef: w, isOver: d } = ur({ id: f }), { attributes: h, listeners: z, setNodeRef: $, transform: A, isDragging: E } = hr({ id: b }), I = A ? { transform: `translate3d(${Math.round(A.x)}px, ${Math.round(A.y)}px, 0)` } : void 0, [j, V] = L(!1), [G, q] = L(t.name), T = () => {
-    const g = G.trim();
-    V(!1), g && g !== t.name ? o?.(t, g) : q(t.name);
-  }, v = ue(() => /* @__PURE__ */ e(
+  const { setNodeRef: y, isOver: d } = ur({ id: f }), { attributes: h, listeners: $, setNodeRef: T, transform: A, isDragging: E } = hr({ id: b }), I = A ? { transform: `translate3d(${Math.round(A.x)}px, ${Math.round(A.y)}px, 0)` } : void 0, [j, _] = M(!1), [G, q] = M(t.name), C = () => {
+    const v = G.trim();
+    _(!1), v && v !== t.name ? o?.(t, v) : q(t.name);
+  }, g = ue(() => /* @__PURE__ */ e(
     _n,
     {
       options: [
@@ -3877,42 +3877,42 @@ function ds({
         { action: "rename", label: "Rename" },
         { action: "delete", label: "Delete" }
       ],
-      onSelect: (x) => {
-        x.action === "create" ? m?.(t) : x.action === "rename" ? V(!0) : x.action === "delete" && u?.(t);
+      onSelect: (w) => {
+        w.action === "create" ? m?.(t) : w.action === "rename" ? _(!0) : w.action === "delete" && u?.(t);
       }
     }
   ), [t, m, u]);
   return /* @__PURE__ */ n(
     "div",
     {
-      ref: w,
+      ref: y,
       className: `tv-row ${d ? "tv-drop-over" : ""} ${E ? "dragging" : ""}`,
       style: { ...I, paddingLeft: 8 + a * r },
-      onClick: (g) => {
-        g.target.closest(".tv-toggle") || g.target.tagName === "INPUT" || l?.(t);
+      onClick: (v) => {
+        v.target.closest(".tv-toggle") || v.target.tagName === "INPUT" || l?.(t);
       },
       children: [
         /* @__PURE__ */ e("button", { className: "tv-toggle", onClick: i, "aria-label": "toggle", children: t.children?.length ? s ? /* @__PURE__ */ e(wt, { size: 16 }) : /* @__PURE__ */ e(ve, { size: 16 }) : /* @__PURE__ */ e("span", { className: "tv-spacer" }) }),
         /* @__PURE__ */ e(Me, { size: 16, className: "tv-folder-ic" }),
-        /* @__PURE__ */ e("div", { className: "tv-name", ref: $, children: j ? /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: "tv-name", ref: T, children: j ? /* @__PURE__ */ e(
           "input",
           {
             className: "tv-input",
             value: G,
-            onChange: (g) => q(g.target.value),
-            onBlur: T,
-            onKeyDown: (g) => {
-              g.key === "Enter" && T(), g.key === "Escape" && (V(!1), q(t.name));
+            onChange: (v) => q(v.target.value),
+            onBlur: C,
+            onKeyDown: (v) => {
+              v.key === "Enter" && C(), v.key === "Escape" && (_(!1), q(t.name));
             },
             autoFocus: !0
           }
-        ) : /* @__PURE__ */ e("span", { onDoubleClick: () => V(!0), children: t.name }) }),
-        /* @__PURE__ */ e(cs, { listeners: z, attributes: h }),
+        ) : /* @__PURE__ */ e("span", { onDoubleClick: () => _(!0), children: t.name }) }),
+        /* @__PURE__ */ e(cs, { listeners: $, attributes: h }),
         /* @__PURE__ */ e("div", { className: "tv-actions", children: p ? p(t, {
           onCreateChild: () => m?.(t),
-          onRename: () => V(!0),
+          onRename: () => _(!0),
           onDelete: () => u?.(t)
-        }) : v })
+        }) : g })
       ]
     }
   );
@@ -4003,43 +4003,43 @@ function Jl({
   onRename: b,
   onDelete: f,
   onMove: r,
-  renderActions: w,
+  renderActions: y,
   disableMoveToRoot: d = !1,
   // ← allow root moves by default now
   indentUnit: h = 24
 }) {
-  const { roots: z } = ue(() => ps(t) ? bs(t, { rootId: a, getId: i, getName: m }) : gs(
+  const { roots: $ } = ue(() => ps(t) ? bs(t, { rootId: a, getId: i, getName: m }) : gs(
     t.map((k) => ({ ...k })),
     { rootId: a, getId: i, getParent: l, getName: m }
-  ), [t, a, i, l, m]), [$, A] = L({}), E = ae((k) => {
+  ), [t, a, i, l, m]), [T, A] = M({}), E = ae((k) => {
     const F = {};
-    return (function M(U) {
+    return (function L(U) {
       U.forEach((S) => {
-        F[S.id] = !0, S.children?.length && M(S.children);
+        F[S.id] = !0, S.children?.length && L(S.children);
       });
     })(k), F;
   }, []);
-  re.useEffect(() => {
-    A(E(z));
-  }, [z, E]);
+  se.useEffect(() => {
+    A(E($));
+  }, [$, E]);
   const I = ae(
     (k) => A((F) => ({ ...F, [k]: !F[k] })),
     []
-  ), [j, V] = L(() => Le(z));
-  re.useEffect(() => V(Le(z)), [z]);
+  ), [j, _] = M(() => Le($));
+  se.useEffect(() => _(Le($)), [$]);
   const G = pr(
     gr(yr, { activationConstraint: { delay: 250, tolerance: 5 } })
-  ), q = xe(null), [T, v] = L(null), g = xe(0), x = () => {
-  }, C = ({ delta: k }) => {
-    g.current = k?.x ?? 0;
+  ), q = xe(null), [C, g] = M(null), v = xe(0), w = () => {
+  }, z = ({ delta: k }) => {
+    v.current = k?.x ?? 0;
   }, N = ae(
     ({ active: k, over: F }) => {
-      const M = g.current;
-      if (g.current = 0, v(null), !k || !F) return;
+      const L = v.current;
+      if (v.current = 0, g(null), !k || !F) return;
       const U = String(k.id).replace(/^drag-/, ""), S = String(F.id).replace(/^drop-/, "");
       if (!U || !S || U === S) return;
       let O = S;
-      const D = Math.max(0, Math.floor(-M / h));
+      const D = Math.max(0, Math.floor(-L / h));
       if (D > 0) {
         let W = S;
         for (let pe = 0; pe < D; pe++) {
@@ -4053,43 +4053,43 @@ function Jl({
         }
       }
       if (d && O === a) {
-        V(Le(z));
+        _(Le($));
         return;
       }
-      const P = Le(j), { newRoots: _, removed: R } = fs(P, U);
+      const P = Le(j), { newRoots: V, removed: R } = fs(P, U);
       if (!R) return;
-      const Y = xs(_, O, R);
-      V(Y), r?.({ sourceId: U, destParentId: O, newTree: Y });
+      const Y = xs(V, O, R);
+      _(Y), r?.({ sourceId: U, destParentId: O, newTree: Y });
     },
-    [j, z, a, d, h, r]
-  ), y = ae(
-    (k, F = 0) => k.map((M) => /* @__PURE__ */ n(re.Fragment, { children: [
+    [j, $, a, d, h, r]
+  ), x = ae(
+    (k, F = 0) => k.map((L) => /* @__PURE__ */ n(se.Fragment, { children: [
       /* @__PURE__ */ e(
         ds,
         {
-          node: M,
+          node: L,
           depth: F,
-          expanded: !!$[M.id],
-          onToggle: () => I(M.id),
+          expanded: !!T[L.id],
+          onToggle: () => I(L.id),
           onSelect: o,
           onCreateChild: p,
           onRename: b,
           onDelete: f,
-          renderActions: w,
-          dragId: `drag-${M.id}`,
-          dropId: `drop-${M.id}`,
+          renderActions: y,
+          dragId: `drag-${L.id}`,
+          dropId: `drop-${L.id}`,
           indent: h
         }
       ),
-      $[M.id] && M.children?.length > 0 ? y(M.children, F + 1) : null
-    ] }, M.id)),
-    [$, h, p, f, b, o, w, I]
+      T[L.id] && L.children?.length > 0 ? x(L.children, F + 1) : null
+    ] }, L.id)),
+    [T, h, p, f, b, o, y, I]
   );
-  return re.useMemo(() => {
-    if (!T) return null;
-    const k = String(T).replace(/^drag-/, "");
-    function F(M) {
-      for (const U of M) {
+  return se.useMemo(() => {
+    if (!C) return null;
+    const k = String(C).replace(/^drag-/, "");
+    function F(L) {
+      for (const U of L) {
         if (U.id === k) return U;
         const S = U.children?.length ? F(U.children) : null;
         if (S) return S;
@@ -4097,7 +4097,7 @@ function Jl({
       return null;
     }
     return F(j);
-  }, [T, j]), /* @__PURE__ */ n("div", { className: "tv", children: [
+  }, [C, j]), /* @__PURE__ */ n("div", { className: "tv", children: [
     s !== !1 && /* @__PURE__ */ n("div", { className: "tv-header", children: [
       /* @__PURE__ */ e("div", { className: "tv-title", children: s }),
       /* @__PURE__ */ e("button", { className: "tv-btn", onClick: u, children: "+ New folder" })
@@ -4112,11 +4112,11 @@ function Jl({
       {
         collisionDetection: xr,
         sensors: G,
-        onDragStart: x,
-        onDragMove: C,
+        onDragStart: w,
+        onDragMove: z,
         onDragEnd: N,
         modifiers: [fr],
-        children: /* @__PURE__ */ e("div", { ref: q, className: "tv-list", children: y(j, 0) })
+        children: /* @__PURE__ */ e("div", { ref: q, className: "tv-list", children: x(j, 0) })
       }
     )
   ] });
@@ -4135,21 +4135,21 @@ const Xl = ({
   ...u
   // Pass remaining props to Tab.Group
 }) => {
-  const p = s === "vertical", b = (w) => ke(
+  const p = s === "vertical", b = (y) => ke(
     "py-2 -mb-px text-sm font-medium focus:outline-none border-b-2",
-    w ? "border-primaryX text-textX" : "border-transparent text-slate-600 hover:text-indigo-700"
-  ), f = (w) => ke(
+    y ? "border-primaryX text-textX" : "border-transparent text-slate-600 hover:text-indigo-700"
+  ), f = (y) => ke(
     "text-left text-sm rounded-md px-2 py-1.5 focus:outline-none",
-    w ? "bg-primaryX text-white" : "text-textX hover:bg-lightgray-100 hover:text-primaryX"
-  ), r = ({ selected: w }) => o ? typeof o == "function" ? o(w) : o : p ? f(w) : b(w);
-  return /* @__PURE__ */ e(se.Group, { vertical: p, ...u, children: p ? /* @__PURE__ */ n("div", { className: ke("flex gap-4", i), children: [
-    /* @__PURE__ */ e(se.List, { className: ke("w-[150px] flex flex-col gap-1 border-r border-gray-300 pr-2", l), children: t.map((w) => /* @__PURE__ */ e(se, { className: r, children: w.label }, w.key)) }),
-    /* @__PURE__ */ e(se.Panels, { unmount: !a, className: ke("flex-1", m), children: t.map((w) => /* @__PURE__ */ e(se.Panel, { className: "focus:outline-none", children: /* @__PURE__ */ e("div", { className: "[overflow-anchor:none]", children: w.content }) }, w.key)) })
+    y ? "bg-primaryX text-white" : "text-textX hover:bg-lightgray-100 hover:text-primaryX"
+  ), r = ({ selected: y }) => o ? typeof o == "function" ? o(y) : o : p ? f(y) : b(y);
+  return /* @__PURE__ */ e(ne.Group, { vertical: p, ...u, children: p ? /* @__PURE__ */ n("div", { className: ke("flex gap-4", i), children: [
+    /* @__PURE__ */ e(ne.List, { className: ke("w-[150px] flex flex-col gap-1 border-r border-gray-300 pr-2", l), children: t.map((y) => /* @__PURE__ */ e(ne, { className: r, children: y.label }, y.key)) }),
+    /* @__PURE__ */ e(ne.Panels, { unmount: !a, className: ke("flex-1", m), children: t.map((y) => /* @__PURE__ */ e(ne.Panel, { className: "focus:outline-none", children: /* @__PURE__ */ e("div", { className: "[overflow-anchor:none]", children: y.content }) }, y.key)) })
   ] }) : (
     // mostly this part is used :  horizontal
     /* @__PURE__ */ n(te, { children: [
-      /* @__PURE__ */ e(se.List, { className: ke("flex gap-6 border rounded-t-2xl px-1.5 border-gray-300 mb-3 ", l), children: t.map((w) => /* @__PURE__ */ e(se, { className: r, children: w.label }, w.key)) }),
-      /* @__PURE__ */ e(se.Panels, { unmount: !a, className: ke("mt-2", m), children: t.map((w) => /* @__PURE__ */ e(se.Panel, { className: "focus:outline-none", children: /* @__PURE__ */ e("div", { className: "[overflow-anchor:none]", children: w.content }) }, w.key)) })
+      /* @__PURE__ */ e(ne.List, { className: ke("flex gap-6 border rounded-t-2xl px-1.5 border-gray-300 mb-3 ", l), children: t.map((y) => /* @__PURE__ */ e(ne, { className: r, children: y.label }, y.key)) }),
+      /* @__PURE__ */ e(ne.Panels, { unmount: !a, className: ke("mt-2", m), children: t.map((y) => /* @__PURE__ */ e(ne.Panel, { className: "focus:outline-none", children: /* @__PURE__ */ e("div", { className: "[overflow-anchor:none]", children: y.content }) }, y.key)) })
     ] })
   ) });
 };
@@ -4159,7 +4159,7 @@ function Hl(t, a = "YYYY-MM-DD HH:mm:ss") {
 c.string;
 function ys({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
   console.log(t);
-  const [l, m] = re.useState(t), [o, u] = re.useState(() => {
+  const [l, m] = se.useState(t), [o, u] = se.useState(() => {
     const r = a && a[t.key] || {};
     return console.log("Initial Section data for", t.key, r), r;
   }), p = xe(a);
@@ -4176,24 +4176,24 @@ function ys({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
   }, [l.key, o, s]);
   const f = (r) => {
     if (!r.dependsOn) return !0;
-    const { field: w, value: d, operator: h = "equals" } = r.dependsOn, z = o[w];
+    const { field: y, value: d, operator: h = "equals" } = r.dependsOn, $ = o[y];
     switch (h) {
       case "equals":
-        return z === d;
+        return $ === d;
       case "notEquals":
-        return z !== d;
+        return $ !== d;
       case "contains":
-        return Array.isArray(z) && z.includes(d);
+        return Array.isArray($) && $.includes(d);
       case "notContains":
-        return !Array.isArray(z) || !z.includes(d);
+        return !Array.isArray($) || !$.includes(d);
       case "greaterThan":
-        return Number(z) > Number(d);
+        return Number($) > Number(d);
       case "lessThan":
-        return Number(z) < Number(d);
+        return Number($) < Number(d);
       case "isEmpty":
-        return !z || Array.isArray(z) && z.length === 0;
+        return !$ || Array.isArray($) && $.length === 0;
       case "isNotEmpty":
-        return z && (!Array.isArray(z) || z.length > 0);
+        return $ && (!Array.isArray($) || $.length > 0);
       default:
         return !0;
     }
@@ -4211,7 +4211,7 @@ function ys({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
       }
     ),
     /* @__PURE__ */ e("p", { style: { fontSize: "14px", marginBottom: "10px" }, children: l.description }),
-    /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: l.fields.map((r, w) => f(r) && /* @__PURE__ */ n("div", { style: { marginBottom: "10px" }, children: [
+    /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: l.fields.map((r, y) => f(r) && /* @__PURE__ */ n("div", { style: { marginBottom: "10px" }, children: [
       /* @__PURE__ */ n(
         "label",
         {
@@ -4411,7 +4411,6 @@ function ys({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
               const h = { ...o, [r.key]: d };
               u(h), s && s(l.key, h);
             },
-            label: r.placeholder || r.label,
             disabled: r.disabled ? r.disabled : !1
           }
         ),
@@ -4474,8 +4473,8 @@ function ys({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
               value: d.value,
               checked: o[r.key] === d.value,
               onChange: (h) => {
-                const z = { ...o, [r.key]: h.target.value };
-                u(z), s && s(l.key, z);
+                const $ = { ...o, [r.key]: h.target.value };
+                u($), s && s(l.key, $);
               },
               disabled: r.disabled
             }
@@ -4592,8 +4591,8 @@ function ys({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
             type: "file",
             name: r.key,
             onChange: (d) => {
-              const h = d.target.files[0], z = { ...o, [r.key]: h ? h.name : "" };
-              u(z), s && s(l.key, z);
+              const h = d.target.files[0], $ = { ...o, [r.key]: h ? h.name : "" };
+              u($), s && s(l.key, $);
             },
             accept: r.accept,
             className: `w-full ${i[l.key]?.[r.key] ? "border-red-500" : ""}`
@@ -4632,23 +4631,23 @@ function ys({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
           children: r.info
         }
       )
-    ] }, w)) })
+    ] }, y)) })
   ] }) });
 }
 const vs = ({ children: t }) => /* @__PURE__ */ e("div", { className: "flex -space-x-2", children: t });
 function ws({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
   console.log(`[DynamicConfig/DataTableRenderer] Component loaded for section: ${t.key}`);
-  const [l, m] = L(t), [o, u] = L(null), [p, b] = L(null);
+  const [l, m] = M(t), [o, u] = M(null), [p, b] = M(null);
   console.log(`[DataTableRenderer] ${l.key} - Received props:`, { item: t, initialData: a });
-  const [f, r] = L(() => {
-    const v = a && a[l.key] || [], g = v.length > 0 ? v : [{ id: 0 }];
-    return console.log(`[DataTableRenderer] ${l.key} - Initial data:`, g), g;
-  }), w = xe(a);
+  const [f, r] = M(() => {
+    const g = a && a[l.key] || [], v = g.length > 0 ? g : [{ id: 0 }];
+    return console.log(`[DataTableRenderer] ${l.key} - Initial data:`, v), v;
+  }), y = xe(a);
   Z(() => {
-    if (console.log(`[DataTableRenderer] ${l.key} - Checking for initialData changes`), console.log(`[DataTableRenderer] ${l.key} - Previous:`, w.current), console.log(`[DataTableRenderer] ${l.key} - Current:`, a), w.current !== a) {
-      w.current = a;
-      const v = a && a[l.key] || [], g = v.length > 0 ? v : [{ id: 0 }];
-      console.log(`[DataTableRenderer] ${l.key} - Setting new data:`, g), r(g);
+    if (console.log(`[DataTableRenderer] ${l.key} - Checking for initialData changes`), console.log(`[DataTableRenderer] ${l.key} - Previous:`, y.current), console.log(`[DataTableRenderer] ${l.key} - Current:`, a), y.current !== a) {
+      y.current = a;
+      const g = a && a[l.key] || [], v = g.length > 0 ? g : [{ id: 0 }];
+      console.log(`[DataTableRenderer] ${l.key} - Setting new data:`, v), r(v);
     }
   }, [a, l.key]);
   const d = xe(f), h = xe(null);
@@ -4659,257 +4658,257 @@ function ws({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
   }, [l.key, f, s]), Z(() => () => {
     h.current && clearTimeout(h.current);
   }, []);
-  const z = (v) => {
-    const g = (N, y) => {
-      console.log("[DataTableRenderer] updateFieldValue called with:", { rowIndex: N, value: y, type: typeof y }), r((k) => {
+  const $ = (g) => {
+    const v = (N, x) => {
+      console.log("[DataTableRenderer] updateFieldValue called with:", { rowIndex: N, value: x, type: typeof x }), r((k) => {
         const F = [...k];
-        return F[N][v.key] = y, F;
+        return F[N][g.key] = x, F;
       });
-    }, x = (N) => i[l.key]?.[N]?.[v.key], C = (N) => {
-      const y = x(N);
-      return y ? /* @__PURE__ */ e("div", { className: "text-red-500 text-xs mt-1", children: y }) : null;
+    }, w = (N) => i[l.key]?.[N]?.[g.key], z = (N) => {
+      const x = w(N);
+      return x ? /* @__PURE__ */ e("div", { className: "text-red-500 text-xs mt-1", children: x }) : null;
     };
-    switch (v.fieldtype) {
+    switch (g.fieldtype) {
       case "text":
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             X,
             {
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k.target.value),
-              placeholder: v.placeholder || `Enter ${v.label}`,
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k.target.value),
+              placeholder: g.placeholder || `Enter ${g.label}`,
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`
             }
           ),
-          C(y)
+          z(x)
         ] });
       case "textarea":
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             ya,
             {
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k.target.value),
-              placeholder: v.placeholder || `Enter ${v.label}`,
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`,
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k.target.value),
+              placeholder: g.placeholder || `Enter ${g.label}`,
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`,
               rows: 3
             }
           ),
-          C(y)
+          z(x)
         ] });
       case "number":
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             X,
             {
               type: "number",
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k.target.value),
-              placeholder: v.placeholder || `Enter ${v.label}`,
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k.target.value),
+              placeholder: g.placeholder || `Enter ${g.label}`,
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`
             }
           ),
-          C(y)
+          z(x)
         ] });
       case "email":
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             X,
             {
               type: "email",
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k.target.value),
-              placeholder: v.placeholder || "Enter email address",
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k.target.value),
+              placeholder: g.placeholder || "Enter email address",
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`
             }
           ),
-          C(y)
+          z(x)
         ] });
       case "url":
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             X,
             {
               type: "url",
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k.target.value),
-              placeholder: v.placeholder || "Enter URL",
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k.target.value),
+              placeholder: g.placeholder || "Enter URL",
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`
             }
           ),
-          C(y)
+          z(x)
         ] });
       case "password":
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             X,
             {
               type: "password",
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k.target.value),
-              placeholder: v.placeholder || "Enter password",
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k.target.value),
+              placeholder: g.placeholder || "Enter password",
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`
             }
           ),
-          C(y)
+          z(x)
         ] });
       case "select":
       case "dropdown":
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             ft,
             {
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k),
-              options: v.options || [],
-              placeholder: v.placeholder || `Select ${v.label}`,
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k),
+              options: g.options || [],
+              placeholder: g.placeholder || `Select ${g.label}`,
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`
             }
           ),
-          C(y)
+          z(x)
         ] });
       case "selectDynamic":
-        return (N, y) => {
+        return (N, x) => {
           const k = () => {
-            if (v.optionsFrom && a) {
-              const { config: F, valueField: M, labelField: U } = v.optionsFrom, S = a[F] || [];
+            if (g.optionsFrom && a) {
+              const { config: F, valueField: L, labelField: U } = g.optionsFrom, S = a[F] || [];
               if (Array.isArray(S))
                 return S.map((O) => ({
-                  id: O[M] || "",
-                  value: O[M] || "",
+                  id: O[L] || "",
+                  value: O[L] || "",
                   label: O[U] || ""
                 }));
             }
-            return v.options || [];
+            return g.options || [];
           };
           return /* @__PURE__ */ n("div", { children: [
             /* @__PURE__ */ e(
               ft,
               {
-                index: y,
-                value: N[v.key] || "",
-                onChange: (F) => g(y, F),
+                index: x,
+                value: N[g.key] || "",
+                onChange: (F) => v(x, F),
                 options: k(),
-                placeholder: v.placeholder || `Select ${v.label}`,
-                required: v.required,
-                className: `w-full ${x(y) ? "border-red-500" : ""}`
+                placeholder: g.placeholder || `Select ${g.label}`,
+                required: g.required,
+                className: `w-full ${w(x) ? "border-red-500" : ""}`
               },
               Math.random()
             ),
-            C(y)
+            z(x)
           ] });
         };
       case "multiselect":
-        return (N, y) => {
-          const k = N[v.key] || [];
+        return (N, x) => {
+          const k = N[g.key] || [];
           return /* @__PURE__ */ e(
             nt,
             {
               selectedItems: k,
-              onSelectionChange: (F) => g(y, F),
-              options: v.options || [],
-              placeholder: v.placeholder || `Select ${v.label}`,
+              onSelectionChange: (F) => v(x, F),
+              options: g.options || [],
+              placeholder: g.placeholder || `Select ${g.label}`,
               className: "w-full"
             }
           );
         };
       case "checkbox":
       case "boolean":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           ma,
           {
-            checked: !!N[v.key],
-            onChange: (k) => g(y, k),
-            label: v.placeholder || v.label,
+            checked: !!N[g.key],
+            onChange: (k) => v(x, k),
+            label: g.placeholder || g.label,
             className: "w-full"
           }
         );
       case "toggle":
       case "switch":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           va,
           {
-            isOn: !!N[v.key],
-            onToggle: (k) => g(y, k),
-            label: v.placeholder || v.label,
+            isOn: !!N[g.key],
+            onToggle: (k) => v(x, k),
+            label: g.placeholder || g.label,
             className: "w-full"
           }
         );
       case "date":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           ga,
           {
-            selectedDate: N[v.key] ? new Date(N[v.key]) : null,
-            onDateChange: (k) => g(y, k ? k.toISOString().split("T")[0] : ""),
-            placeholder: v.placeholder || "Select date",
+            selectedDate: N[g.key] ? new Date(N[g.key]) : null,
+            onDateChange: (k) => v(x, k ? k.toISOString().split("T")[0] : ""),
+            placeholder: g.placeholder || "Select date",
             className: "w-full"
           }
         );
       case "datetime":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           X,
           {
             type: "datetime-local",
-            value: N[v.key] || "",
-            onChange: (k) => g(y, k.target.value),
-            placeholder: v.placeholder || "Select date and time",
-            required: v.required,
+            value: N[g.key] || "",
+            onChange: (k) => v(x, k.target.value),
+            placeholder: g.placeholder || "Select date and time",
+            required: g.required,
             className: "w-full"
           }
         );
       case "time":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           X,
           {
             type: "time",
-            value: N[v.key] || "",
-            onChange: (k) => g(y, k.target.value),
-            placeholder: v.placeholder || "Select time",
-            required: v.required,
+            value: N[g.key] || "",
+            onChange: (k) => v(x, k.target.value),
+            placeholder: g.placeholder || "Select time",
+            required: g.required,
             className: "w-full"
           }
         );
       case "radio":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           ba,
           {
-            selectedValue: N[v.key] || "",
-            onValueChange: (k) => g(y, k),
-            options: v.options || [],
+            selectedValue: N[g.key] || "",
+            onValueChange: (k) => v(x, k),
+            options: g.options || [],
             className: "w-full"
           }
         );
       case "search":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           be,
           {
-            value: N[v.key] || "",
-            onChange: (k) => g(y, k),
-            placeholder: v.placeholder || `Search ${v.label}`,
+            value: N[g.key] || "",
+            onChange: (k) => v(x, k),
+            placeholder: g.placeholder || `Search ${g.label}`,
             className: "w-full"
           }
         );
       case "audience":
-        return (N, y) => {
-          const k = N[v.key] || { users: [], groups: [], roles: [] }, F = [
+        return (N, x) => {
+          const k = N[g.key] || { users: [], groups: [], roles: [] }, F = [
             ...k.users || [],
             ...k.groups || [],
             ...k.roles || []
           ];
           return /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ e(vs, { children: F.length > 0 ? F.slice(0, 3).map((M, U) => /* @__PURE__ */ e(
+            /* @__PURE__ */ e(vs, { children: F.length > 0 ? F.slice(0, 3).map((L, U) => /* @__PURE__ */ e(
               ze,
               {
                 size: "small",
-                name: M.name || M.displayName || M.id,
-                src: M.avatarUrl
+                name: L.name || L.displayName || L.id,
+                src: L.avatarUrl
               },
               U
             )) : null }),
@@ -4918,7 +4917,7 @@ function ws({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
               {
                 className: "text-blue-600 font-semibold hover:text-blue-800",
                 onClick: () => {
-                  b(v.key), u(y);
+                  b(g.key), u(x);
                 },
                 children: F.length > 0 ? "Edit" : "Assign"
               }
@@ -4926,112 +4925,112 @@ function ws({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
           ] });
         };
       case "color":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           X,
           {
             type: "color",
-            value: N[v.key] || "#000000",
-            onChange: (k) => g(y, k.target.value),
+            value: N[g.key] || "#000000",
+            onChange: (k) => v(x, k.target.value),
             className: "w-full h-10"
           }
         );
       case "range":
-        return (N, y) => /* @__PURE__ */ n("div", { className: "w-full", children: [
+        return (N, x) => /* @__PURE__ */ n("div", { className: "w-full", children: [
           /* @__PURE__ */ e(
             X,
             {
               type: "range",
-              value: N[v.key] || v.min || 0,
-              onChange: (k) => g(y, k.target.value),
-              min: v.min || 0,
-              max: v.max || 100,
-              step: v.step || 1,
+              value: N[g.key] || g.min || 0,
+              onChange: (k) => v(x, k.target.value),
+              min: g.min || 0,
+              max: g.max || 100,
+              step: g.step || 1,
               className: "w-full"
             }
           ),
-          /* @__PURE__ */ e("span", { className: "text-sm text-gray-500", children: N[v.key] || v.min || 0 })
+          /* @__PURE__ */ e("span", { className: "text-sm text-gray-500", children: N[g.key] || g.min || 0 })
         ] });
       case "file":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           X,
           {
             type: "file",
             onChange: (k) => {
               const F = k.target.files[0];
-              g(y, F ? F.name : "");
+              v(x, F ? F.name : "");
             },
-            accept: v.accept,
+            accept: g.accept,
             className: "w-full"
           }
         );
       case "hidden":
-        return (N, y) => /* @__PURE__ */ e(
+        return (N, x) => /* @__PURE__ */ e(
           X,
           {
             type: "hidden",
-            value: N[v.key] || "",
-            onChange: (k) => g(y, k.target.value)
+            value: N[g.key] || "",
+            onChange: (k) => v(x, k.target.value)
           }
         );
       // Default fallback for unknown field types
       default:
-        return (N, y) => /* @__PURE__ */ n("div", { children: [
+        return (N, x) => /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e(
             X,
             {
-              value: N[v.key] || "",
-              onChange: (k) => g(y, k.target.value),
-              placeholder: v.placeholder || `Enter ${v.label}`,
-              required: v.required,
-              className: `w-full ${x(y) ? "border-red-500" : ""}`
+              value: N[g.key] || "",
+              onChange: (k) => v(x, k.target.value),
+              placeholder: g.placeholder || `Enter ${g.label}`,
+              required: g.required,
+              className: `w-full ${w(x) ? "border-red-500" : ""}`
             }
           ),
-          C(y)
+          z(x)
         ] });
     }
-  }, $ = ae(() => {
-    console.log("[DataTableRenderer] Adding blank row"), r((v) => {
-      console.log("[DataTableRenderer] Current data before add:", v);
-      const g = {
-        id: v.length
+  }, T = ae(() => {
+    console.log("[DataTableRenderer] Adding blank row"), r((g) => {
+      console.log("[DataTableRenderer] Current data before add:", g);
+      const v = {
+        id: g.length
         // Assign next available ID
       };
-      l.fields.forEach((C) => {
-        C.fieldtype === "audience" ? g[C.key] = { users: [], groups: [], roles: [] } : g[C.key] = C.default || "";
-      }), console.log("[DataTableRenderer] New blank row:", g);
-      const x = [...v, g];
-      return console.log("[DataTableRenderer] Updated data:", x), x;
+      l.fields.forEach((z) => {
+        z.fieldtype === "audience" ? v[z.key] = { users: [], groups: [], roles: [] } : v[z.key] = z.default || "";
+      }), console.log("[DataTableRenderer] New blank row:", v);
+      const w = [...g, v];
+      return console.log("[DataTableRenderer] Updated data:", w), w;
     });
-  }, [l.fields]), A = ae((v) => {
-    r((g) => {
-      if (g.length <= 1)
-        return g;
-      const x = [...g];
-      return x.splice(v, 1), x;
+  }, [l.fields]), A = ae((g) => {
+    r((v) => {
+      if (v.length <= 1)
+        return v;
+      const w = [...v];
+      return w.splice(g, 1), w;
     });
-  }, []), [E, I] = L(null), j = ae((v, g) => {
-    I(g), v.dataTransfer.effectAllowed = "move", v.dataTransfer.setData("text/html", "");
-  }, []), V = ae((v) => {
-    v.preventDefault(), v.dataTransfer.dropEffect = "move";
-  }, []), G = ae((v, g) => {
-    v.preventDefault(), !(E === null || E === g) && (r((x) => {
-      const C = [...x], N = C[E];
-      return C.splice(E, 1), C.splice(g, 0, N), C;
+  }, []), [E, I] = M(null), j = ae((g, v) => {
+    I(v), g.dataTransfer.effectAllowed = "move", g.dataTransfer.setData("text/html", "");
+  }, []), _ = ae((g) => {
+    g.preventDefault(), g.dataTransfer.dropEffect = "move";
+  }, []), G = ae((g, v) => {
+    g.preventDefault(), !(E === null || E === v) && (r((w) => {
+      const z = [...w], N = z[E];
+      return z.splice(E, 1), z.splice(v, 0, N), z;
     }), I(null));
   }, [E]), q = ae(() => {
     I(null);
-  }, []), T = ae((v) => {
-    console.log("[DataTableRenderer] handleAddAudience called with:", v), r((g) => {
-      const x = [...g];
-      if (o !== null && p && x[o]) {
-        const C = v.pendingInvites || [], N = C.filter((F) => F.type === "User"), y = C.filter((F) => F.type === "Group"), k = C.filter((F) => F.type === "Role");
-        x[o][p] = {
-          users: [...x[o][p]?.users || [], ...N],
-          groups: [...x[o][p]?.groups || [], ...y],
-          roles: [...x[o][p]?.roles || [], ...k]
-        }, console.log("[DataTableRenderer] Updated audience data:", x[o][p]);
+  }, []), C = ae((g) => {
+    console.log("[DataTableRenderer] handleAddAudience called with:", g), r((v) => {
+      const w = [...v];
+      if (o !== null && p && w[o]) {
+        const z = g.pendingInvites || [], N = z.filter((F) => F.type === "User"), x = z.filter((F) => F.type === "Group"), k = z.filter((F) => F.type === "Role");
+        w[o][p] = {
+          users: [...w[o][p]?.users || [], ...N],
+          groups: [...w[o][p]?.groups || [], ...x],
+          roles: [...w[o][p]?.roles || [], ...k]
+        }, console.log("[DataTableRenderer] Updated audience data:", w[o][p]);
       }
-      return x;
+      return w;
     }), u(null), b(null);
   }, [o, p]);
   return /* @__PURE__ */ n("div", { children: [
@@ -5042,7 +5041,7 @@ function ws({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
           "button",
           {
             className: "btn btn-primary text-white px-6 py-2 rounded-2xl cursor-pointer hover:bg-gray-800",
-            onClick: $,
+            onClick: T,
             children: "Add"
           }
         )
@@ -5052,32 +5051,32 @@ function ws({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
     /* @__PURE__ */ e("div", { className: "overflow-x-auto", children: /* @__PURE__ */ n("table", { className: "min-w-full bg-white border border-gray-300", style: { marginBottom: "20px" }, children: [
       /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ n("tr", { className: "bg-gray-50", children: [
         /* @__PURE__ */ e("th", { className: "px-4 py-2 w-10" }),
-        l.fields.map((v, g) => /* @__PURE__ */ e(
+        l.fields.map((g, v) => /* @__PURE__ */ e(
           "th",
           {
             className: "px-4 py-2 text-left text-sm font-medium text-gray-700",
-            children: v.label || v.key
+            children: g.label || g.key
           },
-          g
+          v
         )),
         /* @__PURE__ */ e("th", { className: "px-4 py-2 w-16" })
       ] }) }),
-      /* @__PURE__ */ e("tbody", { children: f.map((v, g) => /* @__PURE__ */ n(
+      /* @__PURE__ */ e("tbody", { children: f.map((g, v) => /* @__PURE__ */ n(
         "tr",
         {
-          className: `hover:bg-gray-50 ${E === g ? "opacity-50" : ""}`,
+          className: `hover:bg-gray-50 ${E === v ? "opacity-50" : ""}`,
           draggable: !0,
-          onDragStart: (x) => j(x, g),
-          onDragOver: V,
-          onDrop: (x) => G(x, g),
+          onDragStart: (w) => j(w, v),
+          onDragOver: _,
+          onDrop: (w) => G(w, v),
           onDragEnd: q,
           children: [
             /* @__PURE__ */ e("td", { className: "px-4 py-2 ", children: /* @__PURE__ */ e("div", { className: "cursor-move text-gray-400 hover:text-gray-600", children: /* @__PURE__ */ e(Nt, { size: 16 }) }) }),
-            l.fields.map((x, C) => /* @__PURE__ */ e("td", { className: "px-4 py-2 ", children: z(x)(v, g) }, C)),
+            l.fields.map((w, z) => /* @__PURE__ */ e("td", { className: "px-4 py-2 ", children: $(w)(g, v) }, z)),
             /* @__PURE__ */ e("td", { className: "px-4 py-2 ", children: /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => A(g),
+                onClick: () => A(v),
                 className: "text-red-500 hover:text-red-700",
                 title: "Delete row",
                 children: /* @__PURE__ */ e(vr, { size: 16 })
@@ -5085,24 +5084,24 @@ function ws({ item: t, data: a, updateHandler: s, validationErrors: i = {} }) {
             ) })
           ]
         },
-        g
+        v
       )) })
     ] }) }),
     o !== null && (() => {
-      const v = f[o] && f[o][p] ? {
+      const g = f[o] && f[o][p] ? {
         users: f[o][p].users || [],
         groups: f[o][p].groups || [],
         roles: f[o][p].roles || []
       } : { users: [], groups: [], roles: [] };
-      return console.log("[DataTableRenderer] Opening modal with existing data:", v), console.log("[DataTableRenderer] Row data:", f[o]), console.log("[DataTableRenderer] Field name:", p), /* @__PURE__ */ e(
+      return console.log("[DataTableRenderer] Opening modal with existing data:", g), console.log("[DataTableRenderer] Row data:", f[o]), console.log("[DataTableRenderer] Field name:", p), /* @__PURE__ */ e(
         os,
         {
           isOpen: !0,
           onClose: () => {
             u(null), b(null);
           },
-          onFinalSubmit: T,
-          existingShares: v,
+          onFinalSubmit: C,
+          existingShares: g,
           allowedPermissions: ["view", "remove"]
         }
       );
@@ -5176,7 +5175,7 @@ const Mt = () => {
   initialData: p = null
   // Add prop for initial demo data
 }) => {
-  const [b, f] = L(null), [r, w] = L(""), [d, h] = L(() => Array.isArray(p) ? p : []), [z, $] = L(null), [A, E] = L(null), [I, j] = L(""), V = async () => {
+  const [b, f] = M(null), [r, y] = M(""), [d, h] = M(() => Array.isArray(p) ? p : []), [$, T] = M(null), [A, E] = M(null), [I, j] = M(""), _ = async () => {
     try {
       const S = await Ve(t.collectionList);
       if (S) {
@@ -5191,12 +5190,12 @@ const Mt = () => {
     }
   };
   Z(() => {
-    (!p || p.length === 0) && V();
+    (!p || p.length === 0) && _();
   }, [p]), Z(() => {
     Array.isArray(p) && h(p);
   }, [p]);
   const G = (S) => {
-    m && (f(S.id), w(S.categoryName || ""));
+    m && (f(S.id), y(S.categoryName || ""));
   }, q = () => {
     if (!l || b !== null) return;
     const S = `temp-${Date.now()}`;
@@ -5209,13 +5208,13 @@ const Mt = () => {
         order: (O.at(-1)?.order ?? 0) + 1,
         _temp: !0
       }
-    ]), f(S), w("");
-  }, T = () => {
+    ]), f(S), y("");
+  }, C = () => {
     b != null && (h((S) => {
       const O = S.find((P) => P.id === b), D = O && O._temp ? S.filter((P) => P.id !== b) : S;
       return s?.(D), D;
-    }), f(null), w(""));
-  }, v = async () => {
+    }), f(null), y(""));
+  }, g = async () => {
     if (b == null || !r.trim()) return;
     const S = typeof b == "string" && b.startsWith("temp-");
     try {
@@ -5225,7 +5224,7 @@ const Mt = () => {
           order: (Array.isArray(d) && d.length > 0 ? d.at(-1)?.order ?? 0 : 0) + 1
         });
         O && (h((D) => {
-          const P = D.map((_) => _.id === b ? O : _);
+          const P = D.map((V) => V.id === b ? O : V);
           return s?.(P), P;
         }), De.success("Collection created successfully"));
       } else {
@@ -5234,29 +5233,29 @@ const Mt = () => {
         );
         h((D) => {
           const P = D.map(
-            (_) => _.id === b ? O && O.id ? { ..._, ...O } : { ..._, categoryName: r.trim() } : _
+            (V) => V.id === b ? O && O.id ? { ...V, ...O } : { ...V, categoryName: r.trim() } : V
           );
           return s?.(P), P;
         }), me.success("Collection updated successfully");
       }
-      f(null), w("");
+      f(null), y("");
     } catch (O) {
       console.log(O), me.error("Failed to save collection");
     }
-  }, g = async (S) => {
+  }, v = async (S) => {
     if (o)
       try {
-        await Qn(`${t.collectionUpdate}/${S.id}`) && (me.success("Deleted successfully", { autoClose: 3e3 }), V());
+        await Qn(`${t.collectionUpdate}/${S.id}`) && (me.success("Deleted successfully", { autoClose: 3e3 }), _());
       } catch (O) {
         console.log(O), me.error("Failed to delete collection");
       }
-  }, x = (S, O, D) => {
+  }, w = (S, O, D) => {
     if (!u || !O || !D || O === D) return S;
-    const P = S.findIndex((W) => W.id === O), _ = S.findIndex((W) => W.id === D);
-    if (P === -1 || _ === -1) return S;
+    const P = S.findIndex((W) => W.id === O), V = S.findIndex((W) => W.id === D);
+    if (P === -1 || V === -1) return S;
     const R = [...S], [Y] = R.splice(P, 1);
-    return R.splice(_, 0, Y), R.map((W, pe) => ({ ...W, order: pe + 1 }));
-  }, C = async (S) => {
+    return R.splice(V, 0, Y), R.map((W, pe) => ({ ...W, order: pe + 1 }));
+  }, z = async (S) => {
     const O = S.map((D) => ({
       id: D.id,
       order: D.order,
@@ -5268,20 +5267,20 @@ const Mt = () => {
       console.log(D), me.error("Failed to save order", { autoClose: 2500 });
     }
   }, N = (S, O) => {
-    u && (S.dataTransfer.effectAllowed = "move", S.dataTransfer.setData("text/plain", String(O)), $(O));
-  }, y = (S) => {
-    z && S !== A && E(S);
+    u && (S.dataTransfer.effectAllowed = "move", S.dataTransfer.setData("text/plain", String(O)), T(O));
+  }, x = (S) => {
+    $ && S !== A && E(S);
   }, k = (S) => {
     S.preventDefault();
   }, F = async (S, O) => {
     S.preventDefault();
     const D = S.dataTransfer.getData("text/plain");
     D && (h((P) => {
-      const _ = x(P, D, O);
-      return console.log("Reordered", _), C(_), s?.(_), _;
-    }), $(null), E(null));
-  }, M = () => {
-    $(null), E(null);
+      const V = w(P, D, O);
+      return console.log("Reordered", V), z(V), s?.(V), V;
+    }), T(null), E(null));
+  }, L = () => {
+    T(null), E(null);
   }, U = Array.isArray(d) ? d.filter(
     (S) => S.categoryName?.toLowerCase().includes(I.toLowerCase())
   ) : [];
@@ -5310,18 +5309,18 @@ const Mt = () => {
       )
     ] }) }),
     /* @__PURE__ */ e("div", { className: "mt-5 flex flex-col", children: U.map((S) => {
-      const O = b === S.id, D = S?.links?.length ?? 0, P = z === S.id, _ = A === S.id && z !== S.id;
+      const O = b === S.id, D = S?.links?.length ?? 0, P = $ === S.id, V = A === S.id && $ !== S.id;
       return /* @__PURE__ */ e(
         "div",
         {
-          onDragEnter: () => y(S.id),
+          onDragEnter: () => x(S.id),
           onDragOver: k,
           onDrop: (R) => F(R, S.id),
-          onDragEnd: M,
+          onDragEnd: L,
           className: [
             "flex items-center justify-between p-3 border rounded-2xl mb-3",
             "border-gray-300",
-            _ ? "ring-2 ring-gray-800/20" : "",
+            V ? "ring-2 ring-gray-800/20" : "",
             P ? "opacity-60" : ""
           ].join(" "),
           children: O ? /* @__PURE__ */ n(te, { children: [
@@ -5332,9 +5331,9 @@ const Mt = () => {
                 className: "flex-1 h-10 px-3 max-w-[200px] border border-gray-300 rounded-2xl outline-none focus:ring-2 focus:ring-gray-800/20",
                 value: r,
                 placeholder: S._temp ? "New collection name" : "Edit collection name",
-                onChange: (R) => w(R.target.value),
+                onChange: (R) => y(R.target.value),
                 onKeyDown: (R) => {
-                  R.key === "Enter" && v(), R.key === "Escape" && T();
+                  R.key === "Enter" && g(), R.key === "Escape" && C();
                 },
                 autoFocus: !0
               }
@@ -5344,7 +5343,7 @@ const Mt = () => {
                 "button",
                 {
                   className: "cursor-pointer border border-gray-300 p-2 rounded-2xl",
-                  onClick: T,
+                  onClick: C,
                   "aria-label": "Cancel edit",
                   children: /* @__PURE__ */ e(ge, { color: "#767676" })
                 }
@@ -5356,7 +5355,7 @@ const Mt = () => {
                     "border p-2 rounded-2xl",
                     r.trim() ? "cursor-pointer border-gray-300" : "cursor-not-allowed border-gray-200"
                   ].join(" "),
-                  onClick: v,
+                  onClick: g,
                   "aria-label": "Save",
                   disabled: !r.trim(),
                   title: r.trim() ? "Save" : "Name required",
@@ -5395,7 +5394,7 @@ const Mt = () => {
                 {
                   className: D === 0 && !S.protected ? "cursor-pointer" : "cursor-not-allowed",
                   title: D === 0 && !S.protected ? "Delete" : "Cannot delete this collection",
-                  onClick: D === 0 ? () => g(S) : null,
+                  onClick: D === 0 ? () => v(S) : null,
                   children: /* @__PURE__ */ e(Ke, { color: D === 0 ? "#767676" : "#C2C2C2" })
                 }
               )
@@ -5417,7 +5416,7 @@ const Mt = () => {
     allowEdit: b = !0,
     allowDelete: f = !0,
     allowReorder: r = !0,
-    className: w = ""
+    className: y = ""
   } = t, d = a?.[t.key] || o || [], h = Array.isArray(d) ? d : [];
   return /* @__PURE__ */ n("div", { className: "dynamic-config-manage-collection-list", children: [
     (i || l) && /* @__PURE__ */ n("div", { className: "mb-4", children: [
@@ -5429,9 +5428,9 @@ const Mt = () => {
       {
         endpoints: m,
         initialData: h,
-        className: w,
-        onCollectionChange: ($) => {
-          s && s(t.key, $);
+        className: y,
+        onCollectionChange: (T) => {
+          s && s(t.key, T);
         },
         showSearch: u,
         allowAdd: p,
@@ -5464,53 +5463,53 @@ function Ss({
   onCancel: i,
   onSave: l
 }) {
-  const [m, o] = re.useState(a), [u, p] = re.useState(null), [b, f] = L(!1), [r, w] = L(!1), [d, h] = L({}), z = `${Se()}/unifyedxappmodulemanagement/api/v1/appmanager/${t}/configuration`, $ = z, [A, E] = L(1), I = (x) => {
+  const [m, o] = se.useState(a), [u, p] = se.useState(null), [b, f] = M(!1), [r, y] = M(!1), [d, h] = M({}), $ = `${Se()}/unifyedxappmodulemanagement/api/v1/appmanager/${t}/configuration`, T = $, [A, E] = M(1), I = (w) => {
     if (!a || !a.configuration)
-      return x;
-    const C = {}, N = x?.configuration || {};
-    return a.configuration.forEach((y) => {
-      if (y.key && y.type === "datatable") {
-        const F = (N[y.key] || []).map((M, U) => {
-          const S = { id: M.id || 0 };
-          return y.fields && y.fields.forEach((O) => {
+      return w;
+    const z = {}, N = w?.configuration || {};
+    return a.configuration.forEach((x) => {
+      if (x.key && x.type === "datatable") {
+        const F = (N[x.key] || []).map((L, U) => {
+          const S = { id: L.id || 0 };
+          return x.fields && x.fields.forEach((O) => {
             if (O.fieldtype === "audience") {
               let D = { users: [], groups: [], roles: [] };
-              M[O.key] && (Array.isArray(M[O.key]) ? D = { users: [], groups: [], roles: [] } : typeof M[O.key] == "object" && (D = {
-                users: M[O.key].users || [],
-                groups: M[O.key].groups || [],
-                roles: M[O.key].roles || []
+              L[O.key] && (Array.isArray(L[O.key]) ? D = { users: [], groups: [], roles: [] } : typeof L[O.key] == "object" && (D = {
+                users: L[O.key].users || [],
+                groups: L[O.key].groups || [],
+                roles: L[O.key].roles || []
               })), S[O.key] = D;
             } else
-              S[O.key] = M[O.key] || O.default || "";
+              S[O.key] = L[O.key] || O.default || "";
           }), S;
         });
         if (F.length === 0) {
-          const M = { id: 0 };
-          y.fields && y.fields.forEach((U) => {
-            U.fieldtype === "audience" ? M[U.key] = { users: [], groups: [], roles: [] } : M[U.key] = U.default || "";
-          }), F.push(M);
+          const L = { id: 0 };
+          x.fields && x.fields.forEach((U) => {
+            U.fieldtype === "audience" ? L[U.key] = { users: [], groups: [], roles: [] } : L[U.key] = U.default || "";
+          }), F.push(L);
         }
-        C[y.key] = F;
-      } else y.key && (C[y.key] = N[y.key] || {});
-    }), C;
+        z[x.key] = F;
+      } else x.key && (z[x.key] = N[x.key] || {});
+    }), z;
   }, j = () => {
     if (a && a.configuration) {
-      const x = {};
-      a.configuration.forEach((C) => {
-        if (C.key)
-          if (C.type === "datatable") {
+      const w = {};
+      a.configuration.forEach((z) => {
+        if (z.key)
+          if (z.type === "datatable") {
             const N = { id: 0 };
-            C.fields && C.fields.forEach((y) => {
-              y.fieldtype === "audience" ? N[y.key] = { users: [], groups: [], roles: [] } : N[y.key] = y.default || "";
-            }), x[C.key] = [N];
-          } else if (C.type === "section") {
+            z.fields && z.fields.forEach((x) => {
+              x.fieldtype === "audience" ? N[x.key] = { users: [], groups: [], roles: [] } : N[x.key] = x.default || "";
+            }), w[z.key] = [N];
+          } else if (z.type === "section") {
             const N = {};
-            C.fields && Array.isArray(C.fields) && C.fields.forEach((y) => {
-              y.key && (N[y.key] = y.default || "");
-            }), x[C.key] = N;
+            z.fields && Array.isArray(z.fields) && z.fields.forEach((x) => {
+              x.key && (N[x.key] = x.default || "");
+            }), w[z.key] = N;
           } else
-            x[C.key] = {};
-      }), p(x);
+            w[z.key] = {};
+      }), p(w);
     }
   };
   Z(() => {
@@ -5518,120 +5517,120 @@ function Ss({
       f(!1);
       return;
     }
-    const x = async () => {
+    const w = async () => {
       try {
         f(!0);
-        let C = await Ve(z);
-        if (C) {
-          const N = I(C);
+        let z = await Ve($);
+        if (z) {
+          const N = I(z);
           p(N);
         } else
           j();
-      } catch (C) {
-        console.error("Error fetching configuration:", C);
+      } catch (z) {
+        console.error("Error fetching configuration:", z);
         let N = "Failed to load configuration";
-        if (C.response) {
-          const y = C.response.status, k = C.response.data?.message || C.response.data?.error;
-          y === 400 ? N = k || "Invalid request. Please check the application ID." : y === 401 ? N = "You are not authorized to access this configuration." : y === 403 ? N = "Access denied. You don't have permission to view this configuration." : y === 404 ? N = "Configuration not found. It may not exist yet or the application ID is incorrect." : y >= 500 ? N = k || "Server error. Please try again later." : N = k || `Failed to load configuration (Error ${y})`;
-        } else C.request ? N = "Network error. Please check your connection and try again." : N = C.message || "An unexpected error occurred while loading configuration.";
+        if (z.response) {
+          const x = z.response.status, k = z.response.data?.message || z.response.data?.error;
+          x === 400 ? N = k || "Invalid request. Please check the application ID." : x === 401 ? N = "You are not authorized to access this configuration." : x === 403 ? N = "Access denied. You don't have permission to view this configuration." : x === 404 ? N = "Configuration not found. It may not exist yet or the application ID is incorrect." : x >= 500 ? N = k || "Server error. Please try again later." : N = k || `Failed to load configuration (Error ${x})`;
+        } else z.request ? N = "Network error. Please check your connection and try again." : N = z.message || "An unexpected error occurred while loading configuration.";
         De.error(N), j();
       } finally {
         f(!1);
       }
     };
-    a && (o(a), t ? x() : j());
+    a && (o(a), t ? w() : j());
   }, [a, A, t, s]);
-  const V = (x, C) => {
+  const _ = (w, z) => {
     p((N) => ({
       ...N,
-      [x]: C
+      [w]: z
     })), h((N) => {
-      const y = { ...N };
-      return y[x] && delete y[x], y;
+      const x = { ...N };
+      return x[w] && delete x[w], x;
     });
   }, G = () => {
-    const x = {};
-    return !m || !u || m.configuration.forEach((C) => {
-      if (C.type === "section")
-        C.fields.forEach((N) => {
+    const w = {};
+    return !m || !u || m.configuration.forEach((z) => {
+      if (z.type === "section")
+        z.fields.forEach((N) => {
           if (N.required) {
-            const y = u[C.key]?.[N.key];
-            (!y || typeof y == "string" && y.trim() === "") && (x[C.key] || (x[C.key] = {}), x[C.key][N.key] = `${N.label} is required`);
+            const x = u[z.key]?.[N.key];
+            (!x || typeof x == "string" && x.trim() === "") && (w[z.key] || (w[z.key] = {}), w[z.key][N.key] = `${N.label} is required`);
           }
         });
-      else if (C.type === "datatable") {
-        const N = u[C.key];
-        Array.isArray(N) && N.forEach((y, k) => {
-          C.fields.forEach((F) => {
+      else if (z.type === "datatable") {
+        const N = u[z.key];
+        Array.isArray(N) && N.forEach((x, k) => {
+          z.fields.forEach((F) => {
             if (F.required) {
-              const M = y[F.key];
-              (!M || typeof M == "string" && M.trim() === "") && (x[C.key] || (x[C.key] = {}), x[C.key][k] || (x[C.key][k] = {}), x[C.key][k][F.key] = `${F.label} is required`);
+              const L = x[F.key];
+              (!L || typeof L == "string" && L.trim() === "") && (w[z.key] || (w[z.key] = {}), w[z.key][k] || (w[z.key][k] = {}), w[z.key][k][F.key] = `${F.label} is required`);
             }
           });
         });
       }
-    }), x;
-  }, q = (x) => Object.keys(x).length > 0, T = () => {
-    const x = G();
-    if (h(x), q(x)) {
+    }), w;
+  }, q = (w) => Object.keys(w).length > 0, C = () => {
+    const w = G();
+    if (h(w), q(w)) {
       let N = [];
-      Object.keys(x).forEach((y) => {
-        typeof x[y] == "object" && Object.keys(x[y]).forEach((k) => {
-          typeof x[y][k] == "object" ? Object.keys(x[y][k]).forEach((F) => {
-            N.push(`${y} row ${parseInt(k) + 1}: ${x[y][k][F]}`);
-          }) : N.push(`${y}: ${x[y][k]}`);
+      Object.keys(w).forEach((x) => {
+        typeof w[x] == "object" && Object.keys(w[x]).forEach((k) => {
+          typeof w[x][k] == "object" ? Object.keys(w[x][k]).forEach((F) => {
+            N.push(`${x} row ${parseInt(k) + 1}: ${w[x][k][F]}`);
+          }) : N.push(`${x}: ${w[x][k]}`);
         });
       });
       return;
     }
     (async () => {
       try {
-        w(!0);
+        y(!0);
         const N = {};
         u && Object.keys(u).forEach((k) => {
           const F = a?.configuration?.find(
-            (M) => M.key === k && M.type === "datatable"
+            (L) => L.key === k && L.type === "datatable"
           );
-          F && Array.isArray(u[k]) ? N[k] = u[k].map((M) => {
-            const U = { id: M.id || 0 };
+          F && Array.isArray(u[k]) ? N[k] = u[k].map((L) => {
+            const U = { id: L.id || 0 };
             return F.fields && F.fields.forEach((S) => {
               if (S.fieldtype === "audience") {
                 let O = { users: [], groups: [], roles: [] };
-                M[S.key] && typeof M[S.key] == "object" && !Array.isArray(M[S.key]) && (O = {
-                  users: M[S.key].users || [],
-                  groups: M[S.key].groups || [],
-                  roles: M[S.key].roles || []
+                L[S.key] && typeof L[S.key] == "object" && !Array.isArray(L[S.key]) && (O = {
+                  users: L[S.key].users || [],
+                  groups: L[S.key].groups || [],
+                  roles: L[S.key].roles || []
                 }), U[S.key] = O;
               } else
-                U[S.key] = M[S.key] || "";
+                U[S.key] = L[S.key] || "";
             }), U;
           }) : N[k] = u[k];
         });
-        let y = await _e($, N);
-        if (console.log(), y && y.status != "fail") {
+        let x = await _e(T, N);
+        if (console.log(), x && x.status != "fail") {
           h({});
-          const k = y.message || "Configuration has been saved successfully";
+          const k = x.message || "Configuration has been saved successfully";
           De.success(k), l && typeof l == "function" && l(u);
         } else
-          throw De.error(y?.message || "Failed to save configuration"), new Error("No response received from server");
+          throw De.error(x?.message || "Failed to save configuration"), new Error("No response received from server");
       } catch (N) {
         console.error("Error saving configuration:", N), De.error(N?.message || "Failed to save configuration");
       } finally {
-        w(!1);
+        y(!1);
       }
     })();
-  }, v = () => {
+  }, g = () => {
     if (i) {
       i();
       return;
     }
     d && Object.keys(d).length > 0 && !window.confirm(
       "You have validation errors that will be lost. Are you sure you want to cancel?"
-    ) || (h({}), p(null), E((C) => C + 1), De.info("Configuration changes cancelled"));
+    ) || (h({}), p(null), E((z) => z + 1), De.info("Configuration changes cancelled"));
   };
   if (!m?.configuration && !a?.configuration)
     return /* @__PURE__ */ e("div", { className: "min-h-screen flex items-center justify-center", children: /* @__PURE__ */ e("div", { className: "text-gray-500", children: "No configuration available" }) });
-  const g = a?.configuration || m?.configuration;
+  const v = a?.configuration || m?.configuration;
   return Z(() => {
     s && a ? (!u || Object.keys(u).length === 0) && j() : s && !a && j();
   }, [s, a]), /* @__PURE__ */ n("div", { children: [
@@ -5642,18 +5641,18 @@ function Ss({
         style: { padding: "0px 20px 0px 0px" },
         children: [
           b && /* @__PURE__ */ e("div", { className: "flex justify-center items-center h-64", children: /* @__PURE__ */ e(xa, { size: "large" }) }),
-          !b && g?.map((x, C) => {
-            const N = zs(x.type);
+          !b && v?.map((w, z) => {
+            const N = zs(w.type);
             if (N && N !== "UnknownType")
               return /* @__PURE__ */ e(
                 N,
                 {
-                  item: x,
+                  item: w,
                   data: u,
-                  updateHandler: V,
+                  updateHandler: _,
                   validationErrors: d
                 },
-                C
+                z
               );
           })
         ]
@@ -5664,7 +5663,7 @@ function Ss({
         ee,
         {
           category: "secondary",
-          onClick: v,
+          onClick: g,
           label: "Cancel",
           disabled: r
         }
@@ -5673,7 +5672,7 @@ function Ss({
         ee,
         {
           category: "primary",
-          onClick: T,
+          onClick: C,
           disabled: r,
           label: r ? "Saving..." : "Apply",
           type: "submit"
@@ -5687,32 +5686,32 @@ const Ql = ({
   appid: a = "Configuration-Page",
   disableApi: s = !1
 }) => {
-  const [i, l] = L(0), [m, o] = L(!1), [u, p] = L(a), {
-    pageHeader: b = {},
-    appletHeader: f = {},
-    breadcrumb: r = [],
-    overview: w = {},
-    configuration: d = []
-  } = t, h = d.map((g) => {
-    if (g.type === "section" && g.fields) {
-      const x = [...g.fields], C = x.findIndex((N) => N.key === "appkey");
-      if (C !== -1) {
-        const N = x[C];
-        if (x[C] = {
-          ...N,
+  const [i, l] = M(0), [m, o] = M(!1), {
+    pageHeader: u = {},
+    appletHeader: p = {},
+    breadcrumb: b = [],
+    overview: f = {},
+    configuration: r = []
+  } = t, y = r.map((C) => {
+    if (C.type === "section" && C.fields) {
+      const g = [...C.fields], v = g.findIndex((w) => w.key === "appkey");
+      if (v !== -1) {
+        const w = g[v];
+        if (g[v] = {
+          ...w,
           default: a,
           value: a,
           disabled: !0,
           placeholder: a
-        }, x.some((k) => k.key === "displayname")) {
-          const k = x.findIndex((F) => F.key === "displayname");
-          x[k] = {
-            ...x[k],
-            default: a,
-            value: a
+        }, g.some((N) => N.key === "displayname")) {
+          const N = g.findIndex((k) => k.key === "displayname"), x = g[N] || {};
+          g[N] = {
+            ...x,
+            default: x.default || x.value || a,
+            placeholder: x.placeholder || "Enter display name"
           };
         } else {
-          const k = {
+          const N = {
             key: "displayname",
             label: "Display Name",
             fieldtype: "text",
@@ -5721,52 +5720,46 @@ const Ql = ({
             placeholder: "Enter display name",
             required: !1
           };
-          x.splice(C + 1, 0, k);
+          g.splice(v + 1, 0, N);
         }
       }
       return {
-        ...g,
-        fields: x
+        ...C,
+        fields: g
       };
     }
-    return g;
-  }), z = {
+    return C;
+  }), d = {
     heading: "App Details",
     subHeading: "View app details and customize configurations to align with institutional requirements.",
     isLeftArrow: !0,
     onBackClick: () => window.history.back(),
-    ...b
-  }, $ = r.map((g) => ({
-    label: g.text,
-    href: g.href || "#"
-  })), A = ae(() => {
+    ...u
+  }, h = b.map((C) => ({
+    label: C.text,
+    href: C.href || "#"
+  })), $ = ae(() => {
     console.log("handleCancelRequest called - showing modal"), o(!0);
-  }, []), E = ae((g) => {
-    o(!1), g.primary ? (console.log("User confirmed cancel - navigating back"), window.history.back()) : console.log("User cancelled the cancel action - modal closed, data preserved");
-  }, []), I = () => {
-    for (const g of h)
-      if (g.type === "section" && g.fields) {
-        const x = g.fields.find((C) => C.key === "displayname");
-        if (x)
-          return x.default || x.value || a;
-      }
-    return a;
-  };
-  re.useEffect(() => {
-    p(I());
-  }, [h]);
-  const j = ae((g) => {
-    console.log("Config saved with data:", g), Object.keys(g).forEach((x) => {
-      const C = g[x];
-      console.log(`Checking section ${x}:`, C), C && C.displayname && (console.log("Found displayname:", C.displayname), p(C.displayname));
-    });
-  }, []), V = {
+  }, []), T = ae((C) => {
+    o(!1), C.primary ? (console.log("User confirmed cancel - navigating back"), window.history.back()) : console.log("User cancelled the cancel action - modal closed, data preserved");
+  }, []), A = ae((C) => {
+    console.log("Configuration changed:", C);
+  }, []), E = (() => {
+    if (Array.isArray(r)) {
+      for (const C of r)
+        if (C && C.fields) {
+          const g = C.fields.find((v) => v && v.key === "displayname");
+          if (g) return g.default ?? g.value ?? a;
+        }
+    }
+    return p.heading || a;
+  })(), I = {
     subHeading: "Application configuration and details",
     tags: [],
-    ...f,
-    heading: u
-    // Ensure displayname always overrides config heading
-  }, G = {
+    ...p,
+    heading: E
+    // Use resolvedDisplayName only
+  }, j = {
     about: "This application provides comprehensive functionality for your organization.",
     images: {
       desktop: "https://via.placeholder.com/600x400?text=Desktop+View",
@@ -5783,25 +5776,25 @@ const Ql = ({
         description: "Description of feature 2"
       }
     ],
-    ...w
-  }, q = [
-    { label: "Overview", content: v(G) },
-    { label: "Configuration", content: /* @__PURE__ */ e(Ss, { appid: a, configdata: { configuration: h }, disableApi: s, onCancel: A, onSave: j }) }
+    ...f
+  }, _ = [
+    { label: "Overview", content: q(j) },
+    { label: "Configuration", content: /* @__PURE__ */ e(Ss, { appid: a, configdata: { configuration: y }, disableApi: s, onCancel: $, onSave: A }) }
   ];
-  function T(g) {
-    return g ? g.includes("<svg") ? /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: g } }) : g : "📱";
+  function G(C) {
+    return C ? C.includes("<svg") ? /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: C } }) : C : "📱";
   }
-  function v(g) {
+  function q(C) {
     return /* @__PURE__ */ n("div", { className: "bg-white rounded-2xl p-1", children: [
       /* @__PURE__ */ n("section", { className: "mb-8", children: [
         /* @__PURE__ */ e("h2", { className: "text-xl font-semibold mb-2", children: "About" }),
-        /* @__PURE__ */ e("p", { className: "text-gray-700 text-base", children: g.about })
+        /* @__PURE__ */ e("p", { className: "text-gray-700 text-base", children: C.about })
       ] }),
       /* @__PURE__ */ n("section", { className: "flex flex-row gap-6 justify-center items-center mb-8", children: [
         /* @__PURE__ */ e(
           "img",
           {
-            src: g.images.desktop,
+            src: C.images.desktop,
             alt: "Desktop View",
             className: "rounded-xl border border-gray-200 w-[340px] h-[220px] object-cover"
           }
@@ -5809,7 +5802,7 @@ const Ql = ({
         /* @__PURE__ */ e(
           "img",
           {
-            src: g.images.mobile1,
+            src: C.images.mobile1,
             alt: "Mobile View 1",
             className: "rounded-2xl border border-gray-200 w-[120px] h-[220px] object-cover"
           }
@@ -5817,7 +5810,7 @@ const Ql = ({
         /* @__PURE__ */ e(
           "img",
           {
-            src: g.images.mobile2,
+            src: C.images.mobile2,
             alt: "Mobile View 2",
             className: "rounded-2xl border border-gray-200 w-[120px] h-[220px] object-cover"
           }
@@ -5825,11 +5818,11 @@ const Ql = ({
       ] }),
       /* @__PURE__ */ n("section", { children: [
         /* @__PURE__ */ e("h3", { className: "text-lg font-semibold mb-4", children: "Key Features" }),
-        /* @__PURE__ */ e("ul", { className: "space-y-3", children: g.features.map((x, C) => /* @__PURE__ */ n("li", { children: [
-          /* @__PURE__ */ e("span", { className: "font-semibold", children: x.title }),
+        /* @__PURE__ */ e("ul", { className: "space-y-3", children: C.features.map((g, v) => /* @__PURE__ */ n("li", { children: [
+          /* @__PURE__ */ e("span", { className: "font-semibold", children: g.title }),
           /* @__PURE__ */ e("br", {}),
-          /* @__PURE__ */ e("span", { className: "text-gray-700", children: x.description })
-        ] }, C)) })
+          /* @__PURE__ */ e("span", { className: "text-gray-700", children: g.description })
+        ] }, v)) })
       ] })
     ] });
   }
@@ -5837,45 +5830,45 @@ const Ql = ({
     /* @__PURE__ */ e(
       Vn,
       {
-        heading: z.heading,
-        subHeading: $.length > 0 ? void 0 : z.subHeading,
-        breadcrumbItems: $,
-        isLeftArrow: z.isLeftArrow,
-        onBackClick: z.onBackClick
+        heading: d.heading,
+        subHeading: h.length > 0 ? void 0 : d.subHeading,
+        breadcrumbItems: h,
+        isLeftArrow: d.isLeftArrow,
+        onBackClick: d.onBackClick
       }
     ),
     /* @__PURE__ */ n("div", { className: "bg-[#ffffff] border border-[#eef2f6] rounded-[12px] px-6 py-5 flex gap-4 items-start mb-4 shadow-sm", children: [
-      /* @__PURE__ */ e("div", { className: "icon w-[72px] h-[72px] rounded-full flex items-center justify-center bg-[#F5F5F6] text-[#1C274C] font-bold text-[18px]", children: T(V.icon) }),
+      /* @__PURE__ */ e("div", { className: "icon w-[72px] h-[72px] rounded-full flex items-center justify-center bg-[#F5F5F6] text-[#1C274C] font-bold text-[18px]", children: G(I.icon) }),
       /* @__PURE__ */ n("div", { className: "flex flex-col min-w-0", children: [
-        /* @__PURE__ */ e("h2", { className: "text-[24px] font-semibold m-0 leading-tight truncate", children: V.heading }),
-        /* @__PURE__ */ e("p", { className: "text-[13px] text-[#101112] mt-1 mb-0 max-w-[800px] leading-normal", children: V.subHeading }),
-        /* @__PURE__ */ e("div", { className: "mt-2 flex flex-wrap gap-2", children: V.tags && V.tags.map((g, x) => /* @__PURE__ */ e(
+        /* @__PURE__ */ e("h2", { className: "text-[24px] font-semibold m-0 leading-tight truncate", children: I.heading }),
+        /* @__PURE__ */ e("p", { className: "text-[13px] text-[#101112] mt-1 mb-0 max-w-[800px] leading-normal", children: I.subHeading }),
+        /* @__PURE__ */ e("div", { className: "mt-2 flex flex-wrap gap-2", children: I.tags && I.tags.map((C, g) => /* @__PURE__ */ e(
           "span",
           {
             className: "pill inline-block px-[10px] py-[6px] rounded-[14px] text-[11px] border border-[#e6e9ee] text-[#767676] font-semibold mt-1",
-            children: g
+            children: C
           },
-          x
+          g
         )) })
       ] })
     ] }),
     /* @__PURE__ */ n("div", { className: "bg-white border border-gray-300 rounded-2xl w-full mt-5 ", children: [
-      /* @__PURE__ */ e("div", { className: "border-b border-gray-200", children: /* @__PURE__ */ e("nav", { className: "flex space-x-8", "aria-label": "Tabs", children: q.map((g, x) => /* @__PURE__ */ e(
+      /* @__PURE__ */ e("div", { className: "border-b border-gray-200", children: /* @__PURE__ */ e("nav", { className: "flex space-x-8", "aria-label": "Tabs", children: _.map((C, g) => /* @__PURE__ */ e(
         "button",
         {
-          onClick: () => l(x),
-          className: `${i === x ? "border-black text-black" : "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300"} whitespace-nowrap py-3 px-6 border-b-2 font-medium text-sm transition-colors duration-200`,
-          children: g.label
+          onClick: () => l(g),
+          className: `${i === g ? "border-black text-black" : "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300"} whitespace-nowrap py-3 px-6 border-b-2 font-medium text-sm transition-colors duration-200`,
+          children: C.label
         },
-        x
+        g
       )) }) }),
-      /* @__PURE__ */ e("div", { className: "p-8 h-full overflow-y-auto", children: q[i].content })
+      /* @__PURE__ */ e("div", { className: "p-8 h-full overflow-y-auto", children: _[i].content })
     ] }),
     /* @__PURE__ */ e(
       Pn,
       {
         isOpen: m,
-        onClose: E,
+        onClose: T,
         variant: "warning",
         title: "Are you sure you want to cancel?",
         primaryButtonText: "Proceed",
@@ -5927,12 +5920,12 @@ const Kl = ({
   showColumnChooser: b = !0,
   showFilter: f = !1,
   showPrint: r = !1,
-  showExcel: w = !1,
+  showExcel: y = !1,
   showPdf: d = !1,
   showRefresh: h = !1,
-  showAdd: z = !1,
+  showAdd: $ = !1,
   // Additional props
-  searchPlaceholder: $ = "Search...",
+  searchPlaceholder: T = "Search...",
   handleRefreshClick: A = () => {
   },
   handleSearchChange: E = () => {
@@ -5941,19 +5934,19 @@ const Kl = ({
   excelFileName: I,
   pdfFileName: j
 }) => {
-  const V = () => l?.current || i?.current, [G, q] = re.useState(""), T = (t || "export").toString().trim() || "export", v = `${I || T}.xlsx`, g = `${j || T}.pdf`, x = (y, k, F) => Math.max(k, Math.min(y, F)), C = ae(
-    (y) => {
-      const k = V();
+  const _ = () => l?.current || i?.current, [G, q] = se.useState(""), C = (t || "export").toString().trim() || "export", g = `${I || C}.xlsx`, v = `${j || C}.pdf`, w = (x, k, F) => Math.max(k, Math.min(x, F)), z = ae(
+    (x) => {
+      const k = _();
       if (console.log("openColumnChooserNear", k), !!k?.openColumnChooser) {
-        if (typeof window > "u" || !y?.currentTarget) {
+        if (typeof window > "u" || !x?.currentTarget) {
           k.openColumnChooser();
           return;
         }
         try {
-          const F = y.currentTarget.getBoundingClientRect(), M = F.left + window.scrollX, U = F.bottom + window.scrollY;
-          let S = M - 120, O = U - 120;
+          const F = x.currentTarget.getBoundingClientRect(), L = F.left + window.scrollX, U = F.bottom + window.scrollY;
+          let S = L - 120, O = U - 120;
           const D = window.innerWidth, P = window.innerHeight;
-          S = x(S, window.scrollX + 8, window.scrollX + D - 340), O = x(O, window.scrollY, window.scrollY + P - 120), console.log("openColumnChooserNear", S, O), k.openColumnChooser(S, O);
+          S = w(S, window.scrollX + 8, window.scrollX + D - 340), O = w(O, window.scrollY, window.scrollY + P - 120), console.log("openColumnChooserNear", S, O), k.openColumnChooser(S, O);
         } catch (F) {
           console.log("coloumn choose error", F);
         }
@@ -5962,28 +5955,28 @@ const Kl = ({
     []
     // no external deps; reads ref at call time
   ), N = ae(
-    (y, k) => {
-      const F = V();
+    (x, k) => {
+      const F = _();
       if (F)
-        switch (y) {
+        switch (x) {
           case "ColumnChooser":
-            b && (console.log("openColumnChooser", k), k ? C(k) : F.openColumnChooser?.()), console.log("openColumnChooser out", k);
+            b && (console.log("openColumnChooser", k), k ? z(k) : F.openColumnChooser?.()), console.log("openColumnChooser out", k);
             break;
           case "Print":
             r && F.print?.();
             break;
           case "Excel":
-            w && F.excelExport?.({ fileName: v });
+            y && F.excelExport?.({ fileName: g });
             break;
           case "Pdf":
-            d && F.pdfExport?.({ fileName: g });
+            d && F.pdfExport?.({ fileName: v });
             break;
           case "Refresh":
             h && A();
             break;
         }
     },
-    [b, r, w, d, h, v, g, A, C]
+    [b, r, y, d, h, g, v, A, z]
   );
   return /* @__PURE__ */ n("div", { className: "flex items-center flex-wrap justify-between w-full px-4 py-2 bg-white border border-gray-200 rounded-t-2xl mb-0", children: [
     /* @__PURE__ */ n("div", { className: "flex flex-col", children: [
@@ -5998,10 +5991,10 @@ const Kl = ({
       p && /* @__PURE__ */ e("div", { className: "relative", children: /* @__PURE__ */ e(
         be,
         {
-          placeholder: $,
+          placeholder: T,
           value: G,
-          onDebouncedChange: (y) => {
-            q(y), E(y);
+          onDebouncedChange: (x) => {
+            q(x), E(x);
           }
         }
       ) }),
@@ -6011,7 +6004,7 @@ const Kl = ({
             ee,
             {
               icon: Nr,
-              onClick: (y) => N("ColumnChooser", y),
+              onClick: (x) => N("ColumnChooser", x),
               size: "small",
               ariaLabel: "Column Chooser",
               category: "secondary",
@@ -6040,7 +6033,7 @@ const Kl = ({
               title: "Print Grid"
             }
           ),
-          w && /* @__PURE__ */ e(
+          y && /* @__PURE__ */ e(
             ee,
             {
               icon: zr,
@@ -6048,7 +6041,7 @@ const Kl = ({
               ariaLabel: "Excel Download",
               size: "small",
               category: "secondary",
-              title: `Export Excel (${v})`
+              title: `Export Excel (${g})`
             }
           ),
           d && /* @__PURE__ */ e(
@@ -6059,7 +6052,7 @@ const Kl = ({
               ariaLabel: "PDF Download",
               size: "small",
               category: "secondary",
-              title: `Export PDF (${g})`
+              title: `Export PDF (${v})`
             }
           ),
           h && /* @__PURE__ */ e(
@@ -6074,7 +6067,7 @@ const Kl = ({
             }
           )
         ] }),
-        z && m && /* @__PURE__ */ e(
+        $ && m && /* @__PURE__ */ e(
           ee,
           {
             label: u,
@@ -6104,28 +6097,28 @@ function ei(t) {
     allowReordering: b = !0,
     allowResizing: f = !0,
     allowExcelExport: r = !1,
-    allowPdfExport: w = !1,
+    allowPdfExport: y = !1,
     showColumnChooser: d = !1,
     enableSearchApi: h = !1,
-    height: z = "600",
-    selectionSettings: $ = { type: "Multiple", mode: "Row" },
+    height: $ = "600",
+    selectionSettings: T = { type: "Multiple", mode: "Row" },
     enableCheckbox: A = !1,
     columns: E = [],
     onGridStateChange: I,
     onRowSelected: j,
-    onRowDeselected: V,
+    onRowDeselected: _,
     onRowDoubleClick: G,
     apiRef: q,
-    gridProps: T = {}
-  } = t, v = xe(null), {
-    pageSettings: g,
-    sortSettings: x,
-    ...C
-  } = T || {}, [N, y] = re.useState(g?.page || 1), [k, F] = re.useState(x?.pageSize || 20), [M, U] = re.useState(x?.sortKey || "updatedDate"), [S, O] = re.useState(x?.direction || "Descending"), D = ue(() => {
+    gridProps: C = {}
+  } = t, g = xe(null), {
+    pageSettings: v,
+    sortSettings: w,
+    ...z
+  } = C || {}, [N, x] = se.useState(v?.page || 1), [k, F] = se.useState(w?.pageSize || 20), [L, U] = se.useState(w?.sortKey || "updatedDate"), [S, O] = se.useState(w?.direction || "Descending"), D = ue(() => {
     const B = [cn];
-    return o && B.push(dn), u && B.push(mn), p && B.push(un), h && B.push(hn), r && B.push(pn), w && B.push(gn), d && B.push(bn), f && B.push(fn), b && B.push(xn), B.push(yn), B;
-  }, [o, u, p, h, r, w, d, f, b]), P = ue(() => {
-    const B = () => v.current, ne = (J, we) => {
+    return o && B.push(dn), u && B.push(mn), p && B.push(un), h && B.push(hn), r && B.push(pn), y && B.push(gn), d && B.push(bn), f && B.push(fn), b && B.push(xn), B.push(yn), B;
+  }, [o, u, p, h, r, y, d, f, b]), P = ue(() => {
+    const B = () => g.current, re = (J, we) => {
       !we && process.env.NODE_ENV !== "production" && console.warn(`[CustomDataGrid] ${J} requested but related service/feature is disabled.`);
     };
     return {
@@ -6136,17 +6129,17 @@ function ei(t) {
       selectRow: (J) => B()?.selectRow?.(J),
       selectRows: (J) => B()?.selectRows?.(J),
       search: (J) => {
-        ne("search()", h), B()?.search?.(J);
+        re("search()", h), B()?.search?.(J);
       },
       print: () => B()?.print?.(),
       excelExport: (J) => {
-        ne("excelExport()", r), B()?.excelExport?.(J);
+        re("excelExport()", r), B()?.excelExport?.(J);
       },
       pdfExport: (J) => {
-        ne("pdfExport()", w), B()?.pdfExport?.(J);
+        re("pdfExport()", y), B()?.pdfExport?.(J);
       },
       openColumnChooser: (J, we) => {
-        ne("openColumnChooser()", d), B()?.columnChooserModule?.openColumnChooser?.(J, we);
+        re("openColumnChooser()", d), B()?.columnChooserModule?.openColumnChooser?.(J, we);
       }
     };
   }, []);
@@ -6155,14 +6148,14 @@ function ei(t) {
   }, [q, P]), Z(() => () => {
     q && (q.current = null);
   }, []);
-  const _ = (B) => {
-    const ne = String(B || "");
-    return ne === "Ascending" || ne === "Descending" ? ne : ne.toLowerCase() === "ascending" ? "Ascending" : "Descending";
+  const V = (B) => {
+    const re = String(B || "");
+    return re === "Ascending" || re === "Descending" ? re : re.toLowerCase() === "ascending" ? "Ascending" : "Descending";
   }, R = (B) => {
-    const ne = v.current, J = B?.requestType, we = J === "paging" ? "paging" : J === "sorting" ? "sorting" : J === "searching" ? "searching" : J === "filtering" ? "filtering" : J === "grouping" ? "grouping" : J === "reorder" ? "reorder" : J === "columnstate" ? "columnstate" : "other", Ie = B?.pageSize ?? ne?.pageSettings?.pageSize ?? k, Ue = B?.currentPage ?? ne?.pageSettings?.currentPage ?? l, st = B?.columnName && B?.direction ? [{ field: B.columnName, dir: _(B.direction) }] : (ne?.sortSettings?.columns || []).map((Oe) => ({
+    const re = g.current, J = B?.requestType, we = J === "paging" ? "paging" : J === "sorting" ? "sorting" : J === "searching" ? "searching" : J === "filtering" ? "filtering" : J === "grouping" ? "grouping" : J === "reorder" ? "reorder" : J === "columnstate" ? "columnstate" : "other", Ie = B?.pageSize ?? re?.pageSettings?.pageSize ?? k, Ue = B?.currentPage ?? re?.pageSettings?.currentPage ?? l, st = B?.columnName && B?.direction ? [{ field: B.columnName, dir: V(B.direction) }] : (re?.sortSettings?.columns || []).map((Oe) => ({
       field: Oe.field,
-      dir: _(Oe.direction ?? Oe.dir)
-    })), lt = B?.searchString ?? "", it = B?.columns ?? ne?.filterSettings?.columns ?? [];
+      dir: V(Oe.direction ?? Oe.dir)
+    })), lt = B?.searchString ?? "", it = B?.columns ?? re?.filterSettings?.columns ?? [];
     return {
       reason: we,
       page: { index: Ue, size: Ie, skip: (Ue - 1) * Ie, take: Ie },
@@ -6174,13 +6167,13 @@ function ei(t) {
     };
   }, Y = (B) => {
     setTimeout(() => {
-      v?.current?.hideSpinner();
-    }, 1e3), B.requestType === "paging" && (y(B.currentPage), F(B.pageSize)), B.requestType === "sorting" && (U(B.columnName || "updatedDate"), O(B.direction === "Ascending" ? "ASC" : "DESC")), I && I(R(B), B);
+      g?.current?.hideSpinner();
+    }, 1e3), B.requestType === "paging" && (x(B.currentPage), F(B.pageSize)), B.requestType === "sorting" && (U(B.columnName || "updatedDate"), O(B.direction === "Ascending" ? "ASC" : "DESC")), I && I(R(B), B);
   }, W = (B) => {
     typeof G == "function" && G(B?.rowData, B);
   }, pe = () => {
     const B = [];
-    return A && B.push(/* @__PURE__ */ e(Dt, { type: "checkbox", width: "50" }, "__checkbox__")), E.forEach((ne, J) => {
+    return A && B.push(/* @__PURE__ */ e(Dt, { type: "checkbox", width: "50" }, "__checkbox__")), E.forEach((re, J) => {
       const {
         field: we,
         headerText: Ie,
@@ -6198,7 +6191,7 @@ function ei(t) {
         maxWidth: ja,
         customAttributes: Va,
         ..._a
-      } = ne || {};
+      } = re || {};
       B.push(
         /* @__PURE__ */ e(
           Dt,
@@ -6229,12 +6222,12 @@ function ei(t) {
     vn,
     {
       id: i,
-      ref: v,
+      ref: g,
       dataSource: {
         result: a,
         count: s
       },
-      height: z,
+      height: $,
       allowPaging: m,
       allowSorting: o,
       allowFiltering: u,
@@ -6242,17 +6235,17 @@ function ei(t) {
       allowReordering: b,
       allowResizing: f,
       showColumnChooser: d,
-      selectionSettings: $,
-      pageSettings: { pageSize: 10, pageSizes: g?.pageSizes ?? [20, 40, 60, 80, 100] },
-      sortSettings: x ?? {
-        columns: [{ field: M, direction: _(S) }],
+      selectionSettings: T,
+      pageSettings: { pageSize: 10, pageSizes: v?.pageSizes ?? [20, 40, 60, 80, 100] },
+      sortSettings: w ?? {
+        columns: [{ field: L, direction: V(S) }],
         allowUnsort: !1
       },
       actionBegin: Y,
       rowSelected: j,
-      rowDeselected: V,
+      rowDeselected: _,
       recordDoubleClick: W,
-      ...C,
+      ...z,
       children: [
         /* @__PURE__ */ e(wn, { children: pe() }),
         /* @__PURE__ */ e(Nn, { services: D })
@@ -6294,10 +6287,10 @@ function ie({
   details: o = {},
   ...u
 }) {
-  const p = Qe(), b = Ds(u, m), f = (w) => {
+  const p = Qe(), b = Ds(u, m), f = (y) => {
     l?.({
       key: b,
-      checked: w.target.checked,
+      checked: y.target.checked,
       details: o,
       props: u
     });
@@ -6345,7 +6338,7 @@ function $s({
   imageUrl: f = "https://images.unsplash.com/photo-1469980098053-382eb10ba017?q=80&w=1200&auto=format&fit=crop",
   description: r = "Columbia University is a prestigious Ivy League institution located in the heart of New York City.",
   // spread remaining props (_id, instanceId, etc.)
-  ...w
+  ...y
 }) {
   const d = oe(t), h = ce[d];
   return /* @__PURE__ */ n(
@@ -6357,7 +6350,7 @@ function $s({
       onSelect: i,
       identity: l,
       details: { type: "activity", title: m, group: o, author: p },
-      ...w,
+      ...y,
       children: [
         /* @__PURE__ */ e("div", { className: "flex items-start justify-between", children: /* @__PURE__ */ e("h3", { className: `font-semibold text-zinc-900 dark:text-zinc-100 ${h.title} ml-3`, children: m }) }),
         /* @__PURE__ */ n("div", { className: `text-zinc-500 dark:text-zinc-400 ${h.meta}`, children: [
@@ -6466,7 +6459,7 @@ function Rs({
   // spread for identity (_id/instanceId/etc)
   ...p
 }) {
-  const b = oe(t), f = ce[b], r = Es[b], w = (d) => `px-1 pb-2 text-sm font-medium ${d === o ? "text-zinc-900 dark:text-zinc-100 border-b-2" : "text-zinc-500 dark:text-zinc-400"}`;
+  const b = oe(t), f = ce[b], r = Es[b], y = (d) => `px-1 pb-2 text-sm font-medium ${d === o ? "text-zinc-900 dark:text-zinc-100 border-b-2" : "text-zinc-500 dark:text-zinc-400"}`;
   return /* @__PURE__ */ n(
     ie,
     {
@@ -6493,14 +6486,14 @@ function Rs({
           /* @__PURE__ */ e(
             "span",
             {
-              className: `${w("joined")} ${o === "joined" ? "border-[var(--primaryColor)]" : "border-transparent"}`,
+              className: `${y("joined")} ${o === "joined" ? "border-[var(--primaryColor)]" : "border-transparent"}`,
               children: "Joined"
             }
           ),
           /* @__PURE__ */ e(
             "span",
             {
-              className: `${w("suggested")} ${o === "suggested" ? "border-[var(--primaryColor)]" : "border-transparent"}`,
+              className: `${y("suggested")} ${o === "suggested" ? "border-[var(--primaryColor)]" : "border-transparent"}`,
               children: "Suggested"
             }
           )
@@ -6770,25 +6763,25 @@ function Vs({
   zoom: f = 12,
   mapUrl: r,
   // optional full embed URL override
-  ...w
+  ...y
 }) {
-  const d = oe(t), h = ce[d], z = Ms[d], $ = r || js(b, f);
+  const d = oe(t), h = ce[d], $ = Ms[d], T = r || js(b, f);
   return /* @__PURE__ */ e(
     ie,
     {
-      className: `flex flex-col ${h.card} ${z.wrap}`,
+      className: `flex flex-col ${h.card} ${$.wrap}`,
       showCheckbox: a,
       checkboxPosition: s,
       onSelect: i,
       identity: l,
       details: { type: "campus-map", title: m, campusName: o, activeFilter: p, mapQuery: b, zoom: f },
-      ...w,
-      children: /* @__PURE__ */ n("div", { className: `relative mt-3 overflow-hidden rounded-2xl border border-zinc-200 dark:border-zinc-800 ${z.mapH}`, children: [
+      ...y,
+      children: /* @__PURE__ */ n("div", { className: `relative mt-3 overflow-hidden rounded-2xl border border-zinc-200 dark:border-zinc-800 ${$.mapH}`, children: [
         /* @__PURE__ */ e(
           "iframe",
           {
             title: "Google Map",
-            src: $,
+            src: T,
             className: "h-full w-full",
             style: { border: 0 },
             loading: "lazy",
@@ -6797,7 +6790,7 @@ function Vs({
           }
         ),
         /* @__PURE__ */ n("div", { className: "absolute left-4 right-4 top-3 flex items-center justify-between pointer-events-none", children: [
-          /* @__PURE__ */ n("div", { className: `flex items-center rounded-full bg-white dark:bg-zinc-900 shadow border border-zinc-200 dark:border-zinc-700 ${z.campusPill}`, children: [
+          /* @__PURE__ */ n("div", { className: `flex items-center rounded-full bg-white dark:bg-zinc-900 shadow border border-zinc-200 dark:border-zinc-700 ${$.campusPill}`, children: [
             /* @__PURE__ */ e("span", { className: "truncate max-w-[60vw]", children: o }),
             /* @__PURE__ */ e("span", { className: "ml-2 text-zinc-400", children: "▾" })
           ] }),
@@ -6806,8 +6799,8 @@ function Vs({
             /* @__PURE__ */ e("div", { className: "h-8 w-8 rounded-full bg-white/90 border border-zinc-300 flex items-center justify-center", children: "›" })
           ] })
         ] }),
-        /* @__PURE__ */ e("div", { className: "absolute left-4 right-4 top-14 md:top-12 pointer-events-none mt-2", children: /* @__PURE__ */ e("div", { className: `flex ${z.chipGap} overflow-x-auto scrollbar-none`, children: u.map((A) => /* @__PURE__ */ e(Bs, { label: A, active: A === p, size: d }, A)) }) }),
-        /* @__PURE__ */ e("div", { className: "absolute left-4 right-4 top-28 md:top-24 pointer-events-none", children: /* @__PURE__ */ n("div", { className: `flex items-center rounded-full bg-white dark:bg-zinc-900 shadow border border-zinc-200 dark:border-zinc-700 px-4 ${z.searchH}`, children: [
+        /* @__PURE__ */ e("div", { className: "absolute left-4 right-4 top-14 md:top-12 pointer-events-none mt-2", children: /* @__PURE__ */ e("div", { className: `flex ${$.chipGap} overflow-x-auto scrollbar-none`, children: u.map((A) => /* @__PURE__ */ e(Bs, { label: A, active: A === p, size: d }, A)) }) }),
+        /* @__PURE__ */ e("div", { className: "absolute left-4 right-4 top-28 md:top-24 pointer-events-none", children: /* @__PURE__ */ n("div", { className: `flex items-center rounded-full bg-white dark:bg-zinc-900 shadow border border-zinc-200 dark:border-zinc-700 px-4 ${$.searchH}`, children: [
           /* @__PURE__ */ e("svg", { width: "18", height: "18", viewBox: "0 0 24 24", "aria-hidden": "true", className: "opacity-60", children: /* @__PURE__ */ e("path", { fill: "currentColor", d: "M15.5 14h-.79l-.28-.27a6.471 6.471 0 001.48-4.23C15.91 6.01 13.4 3.5 10.45 3.5S5 6.01 5 9.5 7.5 15.5 10.45 15.5c1.61 0 3.09-.59 4.23-1.48l.27.28v.79l4.25 4.25c.41.41 1.07.41 1.48 0s.41-1.07 0-1.48L15.5 14Zm-5.05 0C8.01 14 6 11.99 6 9.5S8.01 5 10.45 5s4.45 2.01 4.45 4.5-2.01 4.5-4.45 4.5Z" }) }),
           /* @__PURE__ */ e("span", { className: "ml-2 text-zinc-500 dark:text-zinc-400", children: "Search places" })
         ] }) })
@@ -6978,13 +6971,13 @@ function Ys({
   selectedIndex: u = 0,
   ...p
 }) {
-  const [b, f] = L(u), r = oe(t), w = ce[r], d = Us[r], h = o[b] || o[0], z = (A, E) => {
+  const [b, f] = M(u), r = oe(t), y = ce[r], d = Us[r], h = o[b] || o[0], $ = (A, E) => {
     f(E), i?.(A);
-  }, $ = r === "lg";
+  }, T = r === "lg";
   return /* @__PURE__ */ n(
     ie,
     {
-      className: `flex flex-col ${w.card} ${d.wrap}`,
+      className: `flex flex-col ${y.card} ${d.wrap}`,
       showCheckbox: a,
       checkboxPosition: s,
       onSelect: i,
@@ -6993,10 +6986,10 @@ function Ys({
       ...p,
       children: [
         /* @__PURE__ */ n("div", { className: "flex items-center justify-between mb-4", children: [
-          /* @__PURE__ */ e("h3", { className: `font-semibold text-zinc-900 dark:text-zinc-100 ${w.title}`, children: m }),
+          /* @__PURE__ */ e("h3", { className: `font-semibold text-zinc-900 dark:text-zinc-100 ${y.title}`, children: m }),
           /* @__PURE__ */ e("button", { className: "text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300 text-sm font-medium transition-colors duration-200", children: "View All" })
         ] }),
-        $ ? (
+        T ? (
           // Large: Two-column layout
           /* @__PURE__ */ n("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
             /* @__PURE__ */ e("div", { className: "space-y-1", children: o.map((A, E) => /* @__PURE__ */ e(
@@ -7005,7 +6998,7 @@ function Ys({
                 ev: A,
                 sizeMeta: d,
                 isSelected: E === b,
-                onClick: (I) => z(I, E)
+                onClick: (I) => $(I, E)
               },
               A._id || A.id || E
             )) }),
@@ -7019,12 +7012,12 @@ function Ys({
               ev: A,
               sizeMeta: d,
               isSelected: E === b,
-              onClick: (I) => z(I, E)
+              onClick: (I) => $(I, E)
             },
             A._id || A.id || E
           )) })
         ),
-        !$ && /* @__PURE__ */ e("div", { className: "mt-4 pt-3 border-t border-zinc-200 dark:border-zinc-800", children: /* @__PURE__ */ e("button", { className: "w-full text-center text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300 text-sm font-medium transition-colors duration-200", children: "View All" }) })
+        !T && /* @__PURE__ */ e("div", { className: "mt-4 pt-3 border-t border-zinc-200 dark:border-zinc-800", children: /* @__PURE__ */ e("button", { className: "w-full text-center text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300 text-sm font-medium transition-colors duration-200", children: "View All" }) })
       ]
     }
   );
@@ -7195,8 +7188,8 @@ function Hs({
   onPin: b,
   ...f
 }) {
-  const [r, w] = L(u), d = oe(t), h = ce[d], z = Js[d], $ = (I, j) => {
-    w(j), i?.(I);
+  const [r, y] = M(u), d = oe(t), h = ce[d], $ = Js[d], T = (I, j) => {
+    y(j), i?.(I);
   }, A = (I) => {
     const j = { ...I, starred: !I.starred };
     p?.(j);
@@ -7207,7 +7200,7 @@ function Hs({
   return /* @__PURE__ */ n(
     ie,
     {
-      className: `flex flex-col ${h.card} ${z.wrap}`,
+      className: `flex flex-col ${h.card} ${$.wrap}`,
       showCheckbox: a,
       checkboxPosition: s,
       onSelect: i,
@@ -7221,9 +7214,9 @@ function Hs({
           Xs,
           {
             email: I,
-            sizeMeta: z,
+            sizeMeta: $,
             isSelected: j === r,
-            onClick: (V) => $(V, j),
+            onClick: (_) => T(_, j),
             onStar: A,
             onPin: E
           },
@@ -7447,13 +7440,13 @@ function tl({
   selectedIndex: u = 0,
   ...p
 }) {
-  const [b, f] = L(u), r = oe(t), w = ce[r], d = Zs[r], h = (A, E) => {
+  const [b, f] = M(u), r = oe(t), y = ce[r], d = Zs[r], h = (A, E) => {
     f(E), i?.(A);
-  }, z = o[b] || o[0], $ = d.layout === "split";
+  }, $ = o[b] || o[0], T = d.layout === "split";
   return /* @__PURE__ */ n(
     ie,
     {
-      className: `flex flex-col ${w.card} ${d.wrap}`,
+      className: `flex flex-col ${y.card} ${d.wrap}`,
       showCheckbox: a,
       checkboxPosition: s,
       onSelect: i,
@@ -7461,9 +7454,9 @@ function tl({
       details: { type: "directory", title: m, count: o?.length ?? 0 },
       ...p,
       children: [
-        /* @__PURE__ */ e("div", { className: "flex items-center justify-between mb-4", children: /* @__PURE__ */ e("h3", { className: `font-semibold text-zinc-900 dark:text-zinc-100 ${w.title}`, children: m }) }),
+        /* @__PURE__ */ e("div", { className: "flex items-center justify-between mb-4", children: /* @__PURE__ */ e("h3", { className: `font-semibold text-zinc-900 dark:text-zinc-100 ${y.title}`, children: m }) }),
         /* @__PURE__ */ e(el, { sizeMeta: d }),
-        $ ? /* @__PURE__ */ n("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6 min-h-0", children: [
+        T ? /* @__PURE__ */ n("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6 min-h-0", children: [
           /* @__PURE__ */ e("div", { className: "space-y-3", children: o.map((A, E) => /* @__PURE__ */ e(
             _t,
             {
@@ -7477,7 +7470,7 @@ function tl({
           /* @__PURE__ */ e(
             Ks,
             {
-              contact: z,
+              contact: $,
               sizeMeta: d
             }
           )
@@ -7599,7 +7592,7 @@ function nl({
   ],
   ...r
 }) {
-  const w = oe(t), d = ce[w], h = rl[w];
+  const y = oe(t), d = ce[y], h = rl[y];
   return /* @__PURE__ */ n(
     ie,
     {
@@ -7644,16 +7637,16 @@ function nl({
                 /* @__PURE__ */ e("div", { className: "mt-1 font-semibold text-green-600", children: $e(b) })
               ] })
             ] }),
-            /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: f.slice(0, 2).map((z, $) => /* @__PURE__ */ e(
+            /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: f.slice(0, 2).map(($, T) => /* @__PURE__ */ e(
               al,
               {
-                side: $ === 0 ? "left" : "right",
-                date: z.date,
-                title: z.title,
-                amount: z.amount,
-                kind: z.kind
+                side: T === 0 ? "left" : "right",
+                date: $.date,
+                title: $.title,
+                amount: $.amount,
+                kind: $.kind
               },
-              z.id || $
+              $.id || T
             )) })
           ] })
         ] }),
@@ -7772,7 +7765,7 @@ function ll({
   term: o = "Fall 2025",
   ...u
 }) {
-  const [p, b] = L("vacation"), [f, r] = L(!1), w = oe(t), d = ce[w], h = sl[w], z = We.find(($) => $.id === p) || We[0];
+  const [p, b] = M("vacation"), [f, r] = M(!1), y = oe(t), d = ce[y], h = sl[y], $ = We.find((T) => T.id === p) || We[0];
   return /* @__PURE__ */ n(
     ie,
     {
@@ -7808,28 +7801,28 @@ function ll({
             ] })
           ] })
         ] }),
-        h.showTabs && /* @__PURE__ */ e("div", { className: "flex border-b border-zinc-200 dark:border-zinc-800", children: We.map(($) => /* @__PURE__ */ e(
+        h.showTabs && /* @__PURE__ */ e("div", { className: "flex border-b border-zinc-200 dark:border-zinc-800", children: We.map((T) => /* @__PURE__ */ e(
           "button",
           {
-            className: `flex-1 py-2 px-4 text-center ${h.tab} font-medium border-b-2 transition-colors duration-200 ${p === $.id ? "border-blue-500 text-blue-600 dark:text-blue-400" : "border-transparent text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-100"}`,
-            onClick: () => b($.id),
-            children: $.name.split(" ")[0]
+            className: `flex-1 py-2 px-4 text-center ${h.tab} font-medium border-b-2 transition-colors duration-200 ${p === T.id ? "border-blue-500 text-blue-600 dark:text-blue-400" : "border-transparent text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-100"}`,
+            onClick: () => b(T.id),
+            children: T.name.split(" ")[0]
           },
-          $.id
+          T.id
         )) }),
         /* @__PURE__ */ e("div", { className: "space-y-4 mb-6", children: h.showAllLeave ? (
           // LG: Show all leave types
-          We.map(($) => /* @__PURE__ */ e(Ut, { leave: $, sizeMeta: h }, $.id))
+          We.map((T) => /* @__PURE__ */ e(Ut, { leave: T, sizeMeta: h }, T.id))
         ) : h.showSingleLeave ? (
           // MD: Show active tab leave type
-          /* @__PURE__ */ e(Ut, { leave: z, sizeMeta: h })
+          /* @__PURE__ */ e(Ut, { leave: $, sizeMeta: h })
         ) : (
           // SM: Show only available hours
           /* @__PURE__ */ e("div", { className: "bg-white dark:bg-zinc-900 rounded-lg border border-zinc-200 dark:border-zinc-800 p-4", children: /* @__PURE__ */ n("div", { className: "flex items-center gap-3 mb-3", children: [
             /* @__PURE__ */ e(Fe, { className: "h-5 w-5 text-blue-600 dark:text-blue-400" }),
             /* @__PURE__ */ n("div", { children: [
               /* @__PURE__ */ e("div", { className: `font-medium text-zinc-900 dark:text-zinc-100 ${h.table}`, children: "Available Leave" }),
-              /* @__PURE__ */ e("div", { className: `text-zinc-600 dark:text-zinc-400 ${h.table}`, children: z.available })
+              /* @__PURE__ */ e("div", { className: `text-zinc-600 dark:text-zinc-400 ${h.table}`, children: $.available })
             ] })
           ] }) })
         ) }),
@@ -7963,11 +7956,11 @@ function dl({
   subtitle: o = "Drive Shared",
   ...u
 }) {
-  const [p, b] = L(!1), f = oe(t), r = ce[f], w = cl[f];
+  const [p, b] = M(!1), f = oe(t), r = ce[f], y = cl[f];
   return /* @__PURE__ */ n(
     ie,
     {
-      className: `flex flex-col ${r.card} ${w.wrap}`,
+      className: `flex flex-col ${r.card} ${y.wrap}`,
       showCheckbox: a,
       checkboxPosition: s,
       onSelect: i,
@@ -7977,7 +7970,7 @@ function dl({
       children: [
         /* @__PURE__ */ n("div", { className: "flex items-center justify-between", children: [
           /* @__PURE__ */ n("div", { children: [
-            /* @__PURE__ */ e("h3", { className: `text-zinc-900 dark:text-zinc-100 ${w.title} mb-1`, children: m }),
+            /* @__PURE__ */ e("h3", { className: `text-zinc-900 dark:text-zinc-100 ${y.title} mb-1`, children: m }),
             /* @__PURE__ */ e("div", { className: "text-zinc-600 dark:text-zinc-400 text-sm", children: o })
           ] }),
           /* @__PURE__ */ n("div", { className: "relative", children: [
@@ -8001,21 +7994,21 @@ function dl({
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ e("div", { className: `grid ${w.gridCols} gap-3 `, children: il.map((d) => /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: `grid ${y.gridCols} gap-3 `, children: il.map((d) => /* @__PURE__ */ e(
           qt,
           {
             item: d,
-            sizeMeta: w
+            sizeMeta: y
           },
           d.id
         )) }),
-        w.showRecent && /* @__PURE__ */ n("div", { className: "", children: [
-          /* @__PURE__ */ e("h4", { className: `font-semibold text-zinc-900 dark:text-zinc-100 mb-3 ${w.item}`, children: "Recent Files" }),
+        y.showRecent && /* @__PURE__ */ n("div", { className: "", children: [
+          /* @__PURE__ */ e("h4", { className: `font-semibold text-zinc-900 dark:text-zinc-100 mb-3 ${y.item}`, children: "Recent Files" }),
           /* @__PURE__ */ e("div", { className: "space-y-2", children: ol.map((d) => /* @__PURE__ */ e(
             qt,
             {
               item: d,
-              sizeMeta: w,
+              sizeMeta: y,
               showDate: !0
             },
             d.id
@@ -8155,7 +8148,7 @@ const ml = [
   }
 };
 function pl({ alert: t, sizeMeta: a, onDismiss: s, onMarkRead: i }) {
-  const [l, m] = L(!1), o = Ra(t.type), u = hl(t.type);
+  const [l, m] = M(!1), o = Ra(t.type), u = hl(t.type);
   return l ? null : /* @__PURE__ */ n("div", { className: `relative rounded-lg border-l-4 p-4 transition-all duration-200 ${o.bg} ${o.border} ${t.read ? "border-l-2 opacity-80" : "border-l-4"}`, style: { borderLeftColor: o.accent }, children: [
     /* @__PURE__ */ e(
       "button",
@@ -8179,7 +8172,7 @@ function pl({ alert: t, sizeMeta: a, onDismiss: s, onMarkRead: i }) {
   ] });
 }
 function gl({ alert: t, onDismiss: a }) {
-  const [s, i] = L(!1), l = Ra("banner"), m = () => {
+  const [s, i] = M(!1), l = Ra("banner"), m = () => {
     i(!0), a?.(t);
   };
   return s ? null : /* @__PURE__ */ e("div", { className: `rounded-lg border p-4  ${l.bg} ${l.border} relative`, children: /* @__PURE__ */ n("div", { className: "flex items-start gap-3", children: [
@@ -8209,13 +8202,13 @@ function bl({
   showBanner: u = !0,
   ...p
 }) {
-  const [b, f] = L(o), r = oe(t), w = ce[r], d = ul[r], h = (A) => {
+  const [b, f] = M(o), r = oe(t), y = ce[r], d = ul[r], h = (A) => {
     f((E) => E.filter((I) => I.id !== A.id));
-  }, z = b.find((A) => A.type === "banner"), $ = b.filter((A) => A.type !== "banner");
+  }, $ = b.find((A) => A.type === "banner"), T = b.filter((A) => A.type !== "banner");
   return /* @__PURE__ */ n(
     ie,
     {
-      className: `flex flex-col ${w.card} ${d.wrap}`,
+      className: `flex flex-col ${y.card} ${d.wrap}`,
       showCheckbox: a,
       checkboxPosition: s,
       onSelect: i,
@@ -8223,15 +8216,15 @@ function bl({
       details: { type: "alerts", title: m, count: b.length },
       ...p,
       children: [
-        /* @__PURE__ */ e("div", { className: "flex items-center justify-between ", children: /* @__PURE__ */ e("h3", { className: `font-semibold text-zinc-900 dark:text-zinc-100 ${w.title}`, children: m }) }),
-        u && z && t !== "sm" && /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: "flex items-center justify-between ", children: /* @__PURE__ */ e("h3", { className: `font-semibold text-zinc-900 dark:text-zinc-100 ${y.title}`, children: m }) }),
+        u && $ && t !== "sm" && /* @__PURE__ */ e(
           gl,
           {
-            alert: z,
+            alert: $,
             onDismiss: h
           }
         ),
-        /* @__PURE__ */ e("div", { className: "space-y-0.5", children: $.slice(0, 3).map((A) => /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: "space-y-0.5", children: T.slice(0, 3).map((A) => /* @__PURE__ */ e(
           pl,
           {
             alert: A,
@@ -8343,7 +8336,7 @@ const fl = [
   }
 };
 function yl({ video: t, sizeMeta: a }) {
-  const [s, i] = L(!1);
+  const [s, i] = M(!1);
   return /* @__PURE__ */ n("div", { className: "group cursor-pointer", children: [
     /* @__PURE__ */ n("div", { className: `relative ${a.thumbnailHeight} rounded-lg overflow-hidden  bg-zinc-200 dark:bg-zinc-800`, children: [
       /* @__PURE__ */ e(
@@ -8385,11 +8378,11 @@ function vl({
   videos: o = fl,
   ...u
 }) {
-  const [p, b] = L(!1), f = oe(t), r = ce[f], w = xl[f];
+  const [p, b] = M(!1), f = oe(t), r = ce[f], y = xl[f];
   return /* @__PURE__ */ n(
     ie,
     {
-      className: `flex flex-col ${r.card} ${w.wrap}`,
+      className: `flex flex-col ${r.card} ${y.wrap}`,
       showCheckbox: a,
       checkboxPosition: s,
       onSelect: i,
@@ -8419,11 +8412,11 @@ function vl({
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ e("div", { className: `grid ${w.gridCols} gap-4 `, children: o.slice(0, w.gridCols === "grid-cols-3" ? 6 : 4).map((d) => /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: `grid ${y.gridCols} gap-4 `, children: o.slice(0, y.gridCols === "grid-cols-3" ? 6 : 4).map((d) => /* @__PURE__ */ e(
           yl,
           {
             video: d,
-            sizeMeta: w
+            sizeMeta: y
           },
           d.id
         )) }),