unifyedx-storybook-new 0.2.7 → 0.2.12

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

@@ -1,14 +1,14 @@
 import { jsxs as l, jsx as e, Fragment as ee } from "react/jsx-runtime";
 import ae, { useState as O, useMemo as ce, useId as ea, Fragment as Q, useEffect as X, useCallback as K, useRef as ue } from "react";
-import { a as J, U as ut, X as ye, P as _, L as mt, C as je, b as Ge, f as Ve, d as va, D as Na, F as ht, e as pt, h as gt, T as Ue, u as yt, i as ft, I as bt, j as vt, k as Nt, l as xt, m as kt, n as wt, S as xa, o as ka, M as Ct, p as St, q as wa, r as Dt, A as Tt, E as $t, s as Ft, t as At, v as Et, w as Rt, x as Ca, y as It, z as Sa, B as Da, G as zt, H as Bt, J as Pt, K as qe, N as aa, O as ta, Q as Lt, R as Ot, V as Ta, W as Mt, Y as sa, Z as Vt, _ as Ut, $ as $a, a0 as qt, a1 as jt, a2 as Gt, a3 as _t, a4 as Wt, a5 as Yt, a6 as Jt, a7 as Qt, a8 as Xt, a9 as Zt, aa as Ht, ab as Kt, ac as er, ad as ar, ae as tr } from "./vendor-zgKTz69B.js";
+import { a as J, U as ut, X as ye, P as _, L as mt, C as je, b as Ge, f as Ve, d as va, D as Na, F as ht, e as pt, h as gt, T as Ue, u as yt, i as ft, I as bt, j as vt, k as Nt, l as xt, m as kt, n as wt, S as xa, o as ka, M as Ct, p as St, q as wa, r as Dt, A as $t, E as Ft, s as Tt, t as At, v as Et, w as Rt, x as Ca, y as It, z as Sa, B as Da, G as zt, H as Pt, J as Bt, K as qe, N as aa, O as ta, Q as Lt, R as Ot, V as $a, W as Mt, Y as sa, Z as Vt, _ as Ut, $ as Fa, a0 as qt, a1 as jt, a2 as Gt, a3 as _t, a4 as Wt, a5 as Yt, a6 as Jt, a7 as Qt, a8 as Xt, a9 as Zt, aa as Ht, ab as Kt, ac as er, ad as ar, ae as tr } from "./vendor-zgKTz69B.js";
 import { Popover as rr, PopoverButton as nr, PopoverPanel as sr, Transition as oe, Dialog as me, TransitionChild as ge, DialogPanel as Se, DialogTitle as _e, TabGroup as lr, TabList as or, Tab as re, TabPanels as ir, RadioGroup as ze, Listbox as Z, ListboxButton as cr, ListboxOptions as dr, ListboxOption as ur, SwitchGroup as mr, Switch as Ze, Menu as hr, MenuButton as pr, Portal as gr, MenuItems as yr, MenuItem as fr, DialogBackdrop as br } from "@headlessui/react";
 import { motion as ne, AnimatePresence as be } from "framer-motion";
 import { d as vr } from "./vendor-lodash-BD0xlZyL.js";
-import { useFloating as Fa, offset as Aa, flip as Ea, shift as Ra, autoUpdate as Ia, useClick as Nr, useDismiss as xr, useInteractions as kr, FloatingPortal as wr } from "@floating-ui/react";
+import { useFloating as Ta, offset as Aa, flip as Ea, shift as Ra, autoUpdate as Ia, useClick as Nr, useDismiss as xr, useInteractions as kr, FloatingPortal as wr } from "@floating-ui/react";
 import He, { debounce as Cr } from "lodash";
 import { toast as le, ToastContainer as Sr, Slide as Dr } from "react-toastify";
 import "react-toastify/dist/ReactToastify.css";
-import { P as Tr, S as $r, F as Fr, G as Ar, a as Er, E as Rr, b as Ir, C as zr, R as Br, c as Pr, d as Lr, e as Or, f as Mr, I as Vr, g as ia } from "./vendor-syncfusion-DGcZfoFG.js";
+import { P as $r, S as Fr, F as Tr, G as Ar, a as Er, E as Rr, b as Ir, C as zr, R as Pr, c as Br, d as Lr, e as Or, f as Mr, I as Vr, g as ia } from "./vendor-syncfusion-DGcZfoFG.js";
 const Ur = (t) => {
   let r = 2166136261;
   for (let s = 0; s < t.length; s++)
@@ -33,10 +33,10 @@ const Ur = (t) => {
     "avatar-container",
     `avatar--size-${s}`,
     u
-  ), g = N ? "transparent" : o || b.bg, T = n || b.text;
+  ), g = N ? "transparent" : o || b.bg, $ = n || b.text;
   return /* @__PURE__ */ l("div", { className: m, style: {
     backgroundColor: g,
-    color: T
+    color: $
   }, ...i, children: [
     N && /* @__PURE__ */ e(
       "img",
@@ -156,13 +156,13 @@ const _r = {
   onClick: k,
   ...m
 }) => {
-  const g = y || u, T = d && !N, L = J(
+  const g = y || u, $ = d && !N, L = J(
     "btn-base",
     _r[b],
     Wr[i],
     {
       "is-loading": u,
-      "btn-icon-only": T
+      "btn-icon-only": $
     },
     n
   );
@@ -174,8 +174,8 @@ const _r = {
       className: L,
       disabled: g,
       onClick: k,
-      title: r || T && o || (typeof N == "string" ? N : void 0),
-      "aria-label": o || T && r || (typeof N == "string" ? N : void 0),
+      title: r || $ && o || (typeof N == "string" ? N : void 0),
+      "aria-label": o || $ && r || (typeof N == "string" ? N : void 0),
       ...m,
       children: u ? /* @__PURE__ */ e(mt, { className: "loader-spin", "data-testid": "button-loader" }) : /* @__PURE__ */ l(ee, { children: [
         d && /* @__PURE__ */ e(d, { size: b === "large" ? 20 : 16 }),
@@ -208,7 +208,7 @@ const _r = {
       }
     )
   ] }, o);
-}) }) }), Ba = ({
+}) }) }), Pa = ({
   label: t,
   id: r,
   error: s,
@@ -248,7 +248,7 @@ const _r = {
     ] }),
     s && /* @__PURE__ */ e("p", { className: "checkbox-error-message", children: s })
   ] });
-}, Pa = ({ children: t }) => /* @__PURE__ */ e(rr, { className: "popover-container", children: t }), La = ({ children: t }) => /* @__PURE__ */ e(nr, { as: "div", children: t }), Oa = ({ children: t, className: r }) => /* @__PURE__ */ e(sr, { className: `popover-panel ${r || ""}`, children: t }), Ma = ({
+}, Ba = ({ children: t }) => /* @__PURE__ */ e(rr, { className: "popover-container", children: t }), La = ({ children: t }) => /* @__PURE__ */ e(nr, { as: "div", children: t }), Oa = ({ children: t, className: r }) => /* @__PURE__ */ e(sr, { className: `popover-panel ${r || ""}`, children: t }), Ma = ({
   value: t,
   onChange: r,
   onClear: s,
@@ -264,7 +264,7 @@ const _r = {
   };
   return /* @__PURE__ */ l("div", { className: J("datepicker-wrapper", d), children: [
     n && /* @__PURE__ */ e("label", { className: "datepicker-label", htmlFor: "datepicker-input", children: n }),
-    /* @__PURE__ */ l(Pa, { children: [
+    /* @__PURE__ */ l(Ba, { children: [
       /* @__PURE__ */ e(La, { asChild: !0, children: /* @__PURE__ */ l("div", { className: "datepicker-input-container", children: [
         /* @__PURE__ */ l(
           "button",
@@ -328,7 +328,7 @@ const _r = {
   ] }) : /* @__PURE__ */ e("span", { className: "datepicker-placeholder", children: o });
   return /* @__PURE__ */ l("div", { className: J("datepicker-wrapper", d), children: [
     n && /* @__PURE__ */ e("label", { className: "datepicker-label", htmlFor: "daterangepicker-input", children: n }),
-    /* @__PURE__ */ l(Pa, { children: [
+    /* @__PURE__ */ l(Ba, { children: [
       /* @__PURE__ */ e(La, { asChild: !0, children: /* @__PURE__ */ l("div", { className: "datepicker-input-container", children: [
         /* @__PURE__ */ l(
           "button",
@@ -635,7 +635,7 @@ const _r = {
   title: m = "Upload Files",
   subHeading: g = "Supports PNG, JPG, PDF. Max size: 50MB."
 }) => {
-  const T = i.length > 0 || d.length > 0;
+  const $ = i.length > 0 || d.length > 0;
   return /* @__PURE__ */ e(oe, { appear: !0, show: t, as: Q, children: /* @__PURE__ */ l(
     me,
     {
@@ -711,7 +711,7 @@ const _r = {
                         }
                       ),
                       k.filesToUpload && /* @__PURE__ */ e("p", { className: "form-error-message", children: k.filesToUpload.message }),
-                      T && /* @__PURE__ */ l("div", { className: "file-list-container", children: [
+                      $ && /* @__PURE__ */ l("div", { className: "file-list-container", children: [
                         /* @__PURE__ */ e("h3", { children: "Upload Queue" }),
                         /* @__PURE__ */ l("ul", { className: "file-list", children: [
                           i.map((L, E) => /* @__PURE__ */ l(
@@ -828,11 +828,11 @@ const _r = {
     // Deep copy
     onSubmit: (C) => {
       const I = {};
-      Object.keys(C).forEach((B) => {
-        I[B] = {
-          operator: C[B].operator || "in",
-          values: Array.isArray(C[B].values) ? C[B].values : [],
-          range: C[B].range || null
+      Object.keys(C).forEach((P) => {
+        I[P] = {
+          operator: C[P].operator || "in",
+          values: Array.isArray(C[P].values) ? C[P].values : [],
+          range: C[P].range || null
         };
       }), console.log("[storybook filter] Applied Filters:", I), typeof s == "function" && s({
         filters: I,
@@ -841,7 +841,7 @@ const _r = {
     },
     enableReinitialize: !0
   }), k = ce(() => n.reduce((C, I) => {
-    const B = I.key, A = a.values[B];
+    const P = I.key, A = a.values[P];
     let U = !1;
     if (A)
       switch (I.type) {
@@ -853,26 +853,26 @@ const _r = {
           (A.range && A.range !== "" || Array.isArray(A.values) && A.values.length > 0) && (U = !0);
           break;
       }
-    return C[B] = U, C;
+    return C[P] = U, C;
   }, {}), [n, a.values]), m = Object.values(k).filter(Boolean).length, g = async (C, I) => {
     try {
       N((A) => ({ ...A, [C]: !0 }));
-      const B = await i(C, I);
-      y((A) => ({ ...A, [C]: B }));
-    } catch (B) {
-      console.error(`Error fetching ${C} users:`, B);
+      const P = await i(C, I);
+      y((A) => ({ ...A, [C]: P }));
+    } catch (P) {
+      console.error(`Error fetching ${C} users:`, P);
     } finally {
-      N((B) => ({ ...B, [C]: !1 }));
+      N((P) => ({ ...P, [C]: !1 }));
     }
-  }, T = (C) => {
-    const I = n[C].key, B = n[C].url;
-    n[C].type === "multiselect-users" && d[I].length === 0 && !b[I] && g(I, B);
+  }, $ = (C) => {
+    const I = n[C].key, P = n[C].url;
+    n[C].type === "multiselect-users" && d[I].length === 0 && !b[I] && g(I, P);
   }, L = () => {
     a.resetForm(), y({ createdBy: [], updatedBy: [] }), o();
   }, E = (C) => {
     const I = n.find((U) => U.key === C);
     if (!I) return null;
-    const B = a.values[C] || u[C], A = Array.isArray(B.values) ? B.values : [];
+    const P = a.values[C] || u[C], A = Array.isArray(P.values) ? P.values : [];
     switch (I.type) {
       case "multiselect":
         return /* @__PURE__ */ l("div", { className: "filter-panel-content", children: [
@@ -881,7 +881,7 @@ const _r = {
             /* @__PURE__ */ e(
               "select",
               {
-                value: B.operator || "in",
+                value: P.operator || "in",
                 onChange: (c) => a.setFieldValue(`${C}.operator`, c.target.value),
                 className: "filter-select",
                 children: I.operators.map((c) => /* @__PURE__ */ e("option", { value: c, children: c === "in" ? "Includes" : "Excludes" }, c))
@@ -921,7 +921,7 @@ const _r = {
                   className: "filter-checkbox-input",
                   checked: A.includes(c.value),
                   onChange: (h) => {
-                    const x = h.target.checked ? [...A, c.value] : A.filter(($) => $ !== c.value);
+                    const x = h.target.checked ? [...A, c.value] : A.filter((F) => F !== c.value);
                     a.setFieldValue(`${C}.values`, x);
                   }
                 }
@@ -945,7 +945,7 @@ const _r = {
             /* @__PURE__ */ e(
               "select",
               {
-                value: B.operator || "in",
+                value: P.operator || "in",
                 onChange: (c) => a.setFieldValue(`${C}.operator`, c.target.value),
                 className: "filter-select",
                 children: I.operators.map((c) => /* @__PURE__ */ e("option", { value: c, children: c === "in" ? "Includes" : "Excludes" }, c))
@@ -988,7 +988,7 @@ const _r = {
                   className: "filter-checkbox-input",
                   checked: A.includes(c.email),
                   onChange: (h) => {
-                    const x = h.target.checked ? [...A, c.email] : A.filter(($) => $ !== c.email);
+                    const x = h.target.checked ? [...A, c.email] : A.filter((F) => F !== c.email);
                     a.setFieldValue(
                       `${C}.values`,
                       x
@@ -1011,7 +1011,7 @@ const _r = {
           ] }) : /* @__PURE__ */ e("div", { className: "text-center py-4 text-gray-500 text-sm", children: "No users loaded." }) })
         ] });
       case "date":
-        const G = B.values || [], [v, p] = G, f = v && p, w = {
+        const G = P.values || [], [v, p] = G, f = v && p, w = {
           startDate: v instanceof Date ? v : /* @__PURE__ */ new Date(),
           // Fallback to today
           endDate: p instanceof Date ? p : /* @__PURE__ */ new Date(),
@@ -1024,7 +1024,7 @@ const _r = {
             /* @__PURE__ */ e(
               "select",
               {
-                value: B.operator,
+                value: P.operator,
                 onChange: (c) => a.setFieldValue(`${C}.operator`, c.target.value),
                 className: "filter-select",
                 children: I.operators.map((c) => /* @__PURE__ */ e("option", { value: c, children: c === "in" ? "Is" : "Is not" }, c))
@@ -1110,7 +1110,7 @@ const _r = {
               lr,
               {
                 vertical: !0,
-                onChange: T,
+                onChange: $,
                 style: {
                   display: "flex",
                   flexGrow: 1
@@ -1235,16 +1235,20 @@ const _r = {
   title: s,
   children: o,
   // For the description/body content
-  primaryButtonText: n = "Confirm",
-  secondaryButtonText: u = "Cancel",
+  primaryButtonText: n,
+  // No default
+  secondaryButtonText: u,
+  // No default
   variant: i = "info",
   // 'info', 'warning', 'delete'
   loading: d = !1,
-  buttonProps: y = {}
+  buttonProps: y = {},
+  size: b
+  // Add size prop
 }) => {
-  const b = ma[i] || ma.info, N = b.icon, a = () => {
+  const N = ma[i] || ma.info, a = N.icon, k = () => {
     r({ primary: !0, secondary: !1 });
-  }, k = () => {
+  }, m = () => {
     r({ primary: !1, secondary: !0 });
   };
   return /* @__PURE__ */ e(oe, { appear: !0, show: t, as: Q, children: /* @__PURE__ */ l(me, { as: "div", className: "modal-dialog", onClose: () => r({}), children: [
@@ -1271,27 +1275,27 @@ const _r = {
         leave: "ease-in duration-200",
         leaveFrom: "opacity-100 scale-100",
         leaveTo: "opacity-0 scale-95",
-        children: /* @__PURE__ */ l(Se, { className: "modal-panel", children: [
+        children: /* @__PURE__ */ l(Se, { className: b === "large" ? "modal-panel modal-panel--large" : "modal-panel", children: [
           /* @__PURE__ */ l("div", { className: "modal-content-wrapper", children: [
-            /* @__PURE__ */ e("div", { className: `modal-icon-container ${b.iconClass}`, children: /* @__PURE__ */ e(N, { size: 24, "aria-hidden": "true" }) }),
+            /* @__PURE__ */ e("div", { className: `modal-icon-container ${N.iconClass}`, children: /* @__PURE__ */ e(a, { size: 24, "aria-hidden": "true" }) }),
             /* @__PURE__ */ l("div", { className: "modal-text-content", children: [
               /* @__PURE__ */ e(_e, { as: "h3", className: "modal-title", children: s }),
               /* @__PURE__ */ e("div", { className: "modal-description", children: o })
             ] })
           ] }),
-          /* @__PURE__ */ l("div", { className: "modal-footer", children: [
-            /* @__PURE__ */ e(
+          (n || u) && /* @__PURE__ */ l("div", { className: "modal-footer", children: [
+            u && /* @__PURE__ */ e(
               H,
               {
-                onClick: k,
+                onClick: m,
                 label: u,
                 category: "secondary"
               }
             ),
-            /* @__PURE__ */ e(
+            n && /* @__PURE__ */ e(
               H,
               {
-                onClick: a,
+                onClick: k,
                 label: n,
                 ...y
               }
@@ -1920,7 +1924,7 @@ const _r = {
                       onClick: u.onBack,
                       className: "wizard-back-button",
                       "aria-label": "Go back to previous step",
-                      children: /* @__PURE__ */ e(Tt, { size: 20 })
+                      children: /* @__PURE__ */ e($t, { size: 20 })
                     }
                   ),
                   /* @__PURE__ */ l("div", { className: "wizard-header-text", children: [
@@ -2052,9 +2056,9 @@ const _r = {
 ] }), an = ({
   options: t = [],
   onSelect: r,
-  triggerIcon: s = $t
+  triggerIcon: s = Ft
 }) => {
-  const { refs: o, floatingStyles: n } = Fa({
+  const { refs: o, floatingStyles: n } = Ta({
     whileElementsMounted: Ia,
     middleware: [Aa(5), Ea(), Ra({ padding: 5 })]
   });
@@ -2282,7 +2286,7 @@ function dn({
   enableAuthRedirect: t = !0,
   defaultOpenHeaders: r = {}
 } = {}) {
-  const s = Ft.create({
+  const s = Tt.create({
     baseURL: We()
     // ✅ base URL here
     // You can set general timeouts/etc. here
@@ -2493,7 +2497,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
   },
   isChanged: d = !1
 }) => {
-  const [y, b] = O(ga[0]), [N, a] = O(""), k = oa(N, 400), [m, g] = O([]), [T, L] = O(/* @__PURE__ */ new Set()), [E, C] = O(!1), [I, B] = O(ya[0]), {
+  const [y, b] = O(ga[0]), [N, a] = O(""), k = oa(N, 400), [m, g] = O([]), [$, L] = O(/* @__PURE__ */ new Set()), [E, C] = O(!1), [I, P] = O(ya[0]), {
     control: A,
     handleSubmit: U,
     watch: q,
@@ -2501,7 +2505,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
   } = zt({
     defaultValues: { pendingInvites: [] },
     resolver: Lt(yn)
-  }), { fields: p, append: f, remove: w, update: c } = Bt({
+  }), { fields: p, append: f, remove: w, update: c } = Pt({
     control: A,
     name: "pendingInvites"
   }), h = q("pendingInvites");
@@ -2515,12 +2519,12 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
       const V = new Set(z);
       return V.has(D) ? V.delete(D) : V.add(D), V;
     });
-  }, $ = () => {
-    m.filter((D) => T.has(D.id)).forEach((D) => {
+  }, F = () => {
+    m.filter((D) => $.has(D.id)).forEach((D) => {
       p.find((z) => z.id === D.id) || f({ ...D, permission: I.name });
     }), L(/* @__PURE__ */ new Set()), a("");
   }, R = (D) => {
-    B(D), p.forEach(
+    P(D), p.forEach(
       (z, V) => c(V, { ...p[V], permission: D.name })
     );
   }, j = async (D) => {
@@ -2567,7 +2571,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
   }, S = (D) => {
     const z = o[y.code].find((V) => V.name === D.name) || h.find((V) => V.name === D.name);
     return z ? `${z.permission}` : "";
-  }, F = () => {
+  }, T = () => {
     switch (n) {
       case se.DRIVE:
         return "Share with others";
@@ -2578,13 +2582,13 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
       default:
         return "Add User, Groups or Roles test";
     }
-  }, M = ce(() => T.size === 0 && !d, [T, d]);
+  }, M = ce(() => $.size === 0 && !d, [$, d]);
   return /* @__PURE__ */ l("div", { className: "flex flex-col h-full bg-white", children: [
     /* @__PURE__ */ l("header", { className: "flex items-center justify-between p-4 border-b border-gray-300 flex-shrink-0", children: [
-      /* @__PURE__ */ e(me.Title, { className: " text-gray-900 !mb-0 text-lg font-semibold", children: F() }),
+      /* @__PURE__ */ e(me.Title, { className: " text-gray-900 !mb-0 text-lg font-semibold", children: T() }),
       /* @__PURE__ */ l("div", { className: "flex items-center gap-4", children: [
         n === se.DRIVE && /* @__PURE__ */ l("button", { className: "flex items-center gap-2 text-sm text-blue-600 hover:text-blue-800 font-semibold hover:cursor-pointer", children: [
-          /* @__PURE__ */ e(Pt, { className: "h-5 w-5" }),
+          /* @__PURE__ */ e(Bt, { className: "h-5 w-5" }),
           " Copy Link"
         ] }),
         /* @__PURE__ */ e(
@@ -2681,7 +2685,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
                         "input",
                         {
                           type: "checkbox",
-                          checked: T.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: !!z
@@ -2717,8 +2721,8 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
                 /* @__PURE__ */ e(
                   "button",
                   {
-                    onClick: $,
-                    disabled: T.size === 0,
+                    onClick: F,
+                    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"
                   }
@@ -2878,7 +2882,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
   { name: "Can manage", icon: Da, value: "edit" },
   { name: "Remove", icon: Ot, isDestructive: !0, value: "remove" }
 ], bn = ({ item: t, allowedPermissions: r, onPermissionChange: s }) => {
-  const [o, n] = O(!1), { refs: u, floatingStyles: i, context: d } = Fa({
+  const [o, n] = O(!1), { refs: u, floatingStyles: i, context: d } = Ta({
     open: o,
     onOpenChange: n,
     middleware: [Aa(8), Ea(), Ra({ padding: 8 })],
@@ -2929,24 +2933,24 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
                 Z.Option,
                 {
                   className: ({
-                    active: T
+                    active: $
                   }) => `relative select-none py-2 pl-10 pr-4 hover:cursor-pointer
-                                            ${T ? "bg-blue-100 text-blue-900" : "text-gray-900"}
-                                            ${g.isDestructive && T ? "bg-red-100 text-red-900" : ""}
-                                            ${g.isDestructive && !T ? "text-red-600" : ""}`,
+                                            ${$ ? "bg-blue-100 text-blue-900" : "text-gray-900"}
+                                            ${g.isDestructive && $ ? "bg-red-100 text-red-900" : ""}
+                                            ${g.isDestructive && !$ ? "text-red-600" : ""}`,
                   value: g,
-                  children: ({ selected: T }) => /* @__PURE__ */ l(ee, { children: [
+                  children: ({ selected: $ }) => /* @__PURE__ */ l(ee, { children: [
                     /* @__PURE__ */ l(
                       "span",
                       {
-                        className: `flex items-center gap-2 truncate ${T ? "font-medium" : "font-normal"}`,
+                        className: `flex items-center gap-2 truncate ${$ ? "font-medium" : "font-normal"}`,
                         children: [
                           /* @__PURE__ */ e(g.icon, { className: "h-5 w-5", "aria-hidden": "true" }),
                           g.name
                         ]
                       }
                     ),
-                    T && /* @__PURE__ */ e("span", { className: "absolute inset-y-0 left-0 flex items-center pl-3 text-blue-600", children: /* @__PURE__ */ e(ta, { 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(ta, { className: "h-5 w-5", "aria-hidden": "true" }) })
                   ] })
                 },
                 g.name
@@ -2976,7 +2980,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
     roles: i.roles.filter(
       (E) => E.name.toLowerCase().includes(k.toLowerCase())
     )
-  }, g = async (E, C, I, B) => {
+  }, g = async (E, C, I, P) => {
     const A = C.value;
     d(A === "Remove" ? (U) => ({
       ...U,
@@ -2987,7 +2991,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
         (q) => q.id === E.id ? { ...q, permission: A } : q
       )
     }));
-  }, T = ["users", "groups", "roles"], L = ["Users", "Groups", "Roles"];
+  }, $ = ["users", "groups", "roles"], L = ["Users", "Groups", "Roles"];
   return (
     // The main structure remains the same...
     /* @__PURE__ */ l("div", { className: "flex flex-col h-full bg-gray-50", children: [
@@ -2998,7 +3002,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
             onClick: () => r(i),
             className: "flex items-center gap-1 text-sm font-medium text-gray-600 hover:text-gray-900 hover:cursor-pointer p-2 rounded-md hover:bg-gray-100",
             children: [
-              /* @__PURE__ */ e(Ta, { className: "h-5 w-5" }),
+              /* @__PURE__ */ e($a, { className: "h-5 w-5" }),
               " Back"
             ]
           }
@@ -3043,7 +3047,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
             animate: { y: 0, opacity: 1 },
             exit: { y: -10, opacity: 0 },
             transition: { duration: 0.2 },
-            children: /* @__PURE__ */ e(re.Panels, { as: Q, children: T.map((E) => /* @__PURE__ */ e(
+            children: /* @__PURE__ */ e(re.Panels, { as: Q, children: $.map((E) => /* @__PURE__ */ e(
               re.Panel,
               {
                 className: "space-y-3 focus:outline-none",
@@ -3214,7 +3218,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
           onClick: r,
           className: "flex items-center gap-1 text-sm font-medium text-gray-600 hover:text-gray-900 p-2 rounded-md hover:bg-gray-100 hover:cursor-pointer",
           children: [
-            /* @__PURE__ */ e(Ta, { className: "h-5 w-5" }),
+            /* @__PURE__ */ e($a, { className: "h-5 w-5" }),
             " Back"
           ]
         }
@@ -3263,7 +3267,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
   allowedPermissions: d = [],
   ...y
 }) => {
-  const [b, N] = O(de.INVITE), [a, k] = O(t), [m, g] = O(null), [T, L] = O(!1), [E, C] = O([]), [I, B] = O(de.MANAGE), A = () => {
+  const [b, N] = O(de.INVITE), [a, k] = O(t), [m, g] = O(null), [$, L] = O(!1), [E, C] = O([]), [I, P] = O(de.MANAGE), A = () => {
     N(de.INVITE), g(null), u();
   }, U = () => {
     N(de.MANAGE);
@@ -3276,7 +3280,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
       }
       C(resp);
     }
-    g({ id: p, type: w, name: f }), B(b), N(de.MEMBERS);
+    g({ id: p, type: w, name: f }), P(b), N(de.MEMBERS);
   }, G = (p) => {
     k(p);
     const f = !He.isEqual(
@@ -3357,7 +3361,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
                   onFinalSubmit: (p) => {
                     s(p, a);
                   },
-                  isChanged: T
+                  isChanged: $
                 }
               )
             },
@@ -3367,7 +3371,7 @@ const De = dn(), Ee = De.axiosGet, un = De.axiosDelete, Re = De.axiosPost, mn =
     })() }) }) })
   ] }) });
 };
-function Be(...t) {
+function Pe(...t) {
   return t.filter(Boolean).join(" ");
 }
 function Ye({
@@ -3390,14 +3394,14 @@ function Ye({
   serverLoading: a = !1,
   minSearchChars: k = 2,
   // NEW: mappers (id/label keys)
-  getOptionId: m = (T) => String(T.id),
-  getOptionLabel: g = (T) => T.name
+  getOptionId: m = ($) => String($.id),
+  getOptionLabel: g = ($) => $.name
 }) {
-  const T = ea(), L = ea(), [E, C] = O(""), I = ue(""), B = ce(() => {
+  const $ = ea(), L = ea(), [E, C] = O(""), I = ue(""), P = ce(() => {
     const p = /* @__PURE__ */ new Map();
     for (const f of r) p.set(m(f), f);
     return p;
-  }, [r, m]), A = ce(() => Array.isArray(s) ? s.map((p) => p && typeof p == "object" ? B.get(m(p)) || null : B.get(String(p))).filter(Boolean) : [], [s, B, m]), U = ce(() => {
+  }, [r, m]), A = ce(() => Array.isArray(s) ? s.map((p) => p && typeof p == "object" ? P.get(m(p)) || null : P.get(String(p))).filter(Boolean) : [], [s, P, m]), U = ce(() => {
     if (!E) return r;
     const p = E.toLowerCase();
     return r.filter((f) => g(f).toLowerCase().includes(p));
@@ -3432,7 +3436,7 @@ function Ye({
     /* @__PURE__ */ e(
       Z.Label,
       {
-        id: T,
+        id: $,
         className: "block text-sm font-medium leading-6 text-gray-900",
         children: t
       }
@@ -3441,11 +3445,11 @@ function Ye({
       /* @__PURE__ */ l(
         Z.Button,
         {
-          "aria-labelledby": T,
+          "aria-labelledby": $,
           "aria-invalid": !!i,
           "aria-describedby": i ? L : void 0,
           onBlur: n,
-          className: Be(
+          className: Pe(
             "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",
             i ? "ring-red-500" : "ring-gray-300"
           ),
@@ -3474,31 +3478,31 @@ function Ye({
             ) }),
             b === "server" && a && /* @__PURE__ */ e("div", { className: "py-2 px-3 text-gray-500", children: "Loading…" }),
             q.length === 0 && !a ? /* @__PURE__ */ e("div", { className: "py-2 px-3 text-gray-500", children: b === "server" ? E.length < k ? `Type at least ${k} characters to search.` : "No results." : "No options found." }) : q.map((f) => {
-              const w = m(f), c = g(f), h = A.some(($) => m($) === w), x = y !== -1 && A.length >= y && !h;
+              const w = m(f), c = g(f), h = A.some((F) => m(F) === w), x = y !== -1 && A.length >= y && !h;
               return /* @__PURE__ */ e(
                 Z.Option,
                 {
                   value: f,
                   disabled: x,
-                  className: ({ active: $ }) => Be(
-                    x ? " text-gray-400  bg-white  cursor-not-allowed" : $ ? " bg-gray-200  text-gray-900" : " text-gray-900",
+                  className: ({ active: F }) => Pe(
+                    x ? " 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: $, active: R }) => /* @__PURE__ */ l(ee, { children: [
+                  children: ({ selected: F, active: R }) => /* @__PURE__ */ l(ee, { children: [
                     /* @__PURE__ */ e(
                       "span",
                       {
-                        className: Be(
-                          $ ? "font-semibold" : "font-normal",
+                        className: Pe(
+                          F ? "font-semibold" : "font-normal",
                           "block truncate"
                         ),
                         children: c
                       }
                     ),
-                    $ && /* @__PURE__ */ e(
+                    F && /* @__PURE__ */ e(
                       "span",
                       {
-                        className: Be(
+                        className: Pe(
                           R ? " text-gray-900" : " text-gray-600",
                           " absolute  inset-y-0  right-0  flex  items-center  pr-4"
                         ),
@@ -3671,7 +3675,7 @@ function Cn({
   dropId: N,
   indent: a = 24
 }) {
-  const { setNodeRef: k, isOver: m } = Vt({ id: N }), { attributes: g, listeners: T, setNodeRef: L, transform: E, isDragging: C } = Ut({ id: b }), I = E ? { transform: `translate3d(${Math.round(E.x)}px, ${Math.round(E.y)}px, 0)` } : void 0, [B, A] = O(!1), [U, q] = O(t.name), G = () => {
+  const { setNodeRef: k, isOver: m } = Vt({ id: N }), { attributes: g, listeners: $, setNodeRef: L, transform: E, isDragging: C } = Ut({ id: b }), I = E ? { transform: `translate3d(${Math.round(E.x)}px, ${Math.round(E.y)}px, 0)` } : void 0, [P, A] = O(!1), [U, q] = O(t.name), G = () => {
     const p = U.trim();
     A(!1), p && p !== t.name ? i?.(t, p) : q(t.name);
   }, v = ce(() => /* @__PURE__ */ e(
@@ -3698,8 +3702,8 @@ function Cn({
       },
       children: [
         /* @__PURE__ */ e("button", { className: "tv-toggle", onClick: o, "aria-label": "toggle", children: t.children?.length ? s ? /* @__PURE__ */ e(wa, { size: 16 }) : /* @__PURE__ */ e(je, { size: 16 }) : /* @__PURE__ */ e("span", { className: "tv-spacer" }) }),
-        /* @__PURE__ */ e($a, { size: 16, className: "tv-folder-ic" }),
-        /* @__PURE__ */ e("div", { className: "tv-name", ref: L, children: B ? /* @__PURE__ */ e(
+        /* @__PURE__ */ e(Fa, { size: 16, className: "tv-folder-ic" }),
+        /* @__PURE__ */ e("div", { className: "tv-name", ref: L, children: P ? /* @__PURE__ */ e(
           "input",
           {
             className: "tv-input",
@@ -3712,7 +3716,7 @@ function Cn({
             autoFocus: !0
           }
         ) : /* @__PURE__ */ e("span", { onDoubleClick: () => A(!0), children: t.name }) }),
-        /* @__PURE__ */ e(wn, { listeners: T, attributes: g }),
+        /* @__PURE__ */ e(wn, { listeners: $, attributes: g }),
         /* @__PURE__ */ e("div", { className: "tv-actions", children: y ? y(t, {
           onCreateChild: () => u?.(t),
           onRename: () => A(!0),
@@ -3722,8 +3726,8 @@ function Cn({
     }
   );
 }
-const Sn = (t) => String(t.id ?? t._id), Dn = (t) => t.parent !== void 0 ? String(t.parent) : t.parentId != null ? String(t.parentId) : "root", Tn = (t) => t.name ?? t.label ?? "", $n = (t) => Array.isArray(t) && t.some((r) => Array.isArray(r.children));
-function Fn(t, { rootId: r, getId: s, getParent: o, getName: n }) {
+const Sn = (t) => String(t.id ?? t._id), Dn = (t) => t.parent !== void 0 ? String(t.parent) : t.parentId != null ? String(t.parentId) : "root", $n = (t) => t.name ?? t.label ?? "", Fn = (t) => Array.isArray(t) && t.some((r) => Array.isArray(r.children));
+function Tn(t, { rootId: r, getId: s, getParent: o, getName: n }) {
   const u = /* @__PURE__ */ new Map();
   t.forEach((d) => {
     const y = s(d);
@@ -3801,7 +3805,7 @@ function ps({
   title: s = "Folders",
   getId: o = Sn,
   getParent: n = Dn,
-  getName: u = Tn,
+  getName: u = $n,
   onSelect: i,
   onCreateRoot: d,
   onCreateChild: y,
@@ -3813,67 +3817,67 @@ function ps({
   // ← allow root moves by default now
   indentUnit: g = 24
 }) {
-  const { roots: T } = ce(() => $n(t) ? An(t, { rootId: r, getId: o, getName: u }) : Fn(
+  const { roots: $ } = ce(() => Fn(t) ? An(t, { rootId: r, getId: o, getName: u }) : Tn(
     t.map((x) => ({ ...x })),
     { rootId: r, getId: o, getParent: n, getName: u }
   ), [t, r, o, n, u]), [L, E] = O({}), C = K((x) => {
-    const $ = {};
+    const F = {};
     return (function R(j) {
       j.forEach((S) => {
-        $[S.id] = !0, S.children?.length && R(S.children);
+        F[S.id] = !0, S.children?.length && R(S.children);
       });
-    })(x), $;
+    })(x), F;
   }, []);
   ae.useEffect(() => {
-    E(C(T));
-  }, [T, C]);
+    E(C($));
+  }, [$, C]);
   const I = K(
-    (x) => E(($) => ({ ...$, [x]: !$[x] })),
+    (x) => E((F) => ({ ...F, [x]: !F[x] })),
     []
-  ), [B, A] = O(() => Ae(T));
-  ae.useEffect(() => A(Ae(T)), [T]);
+  ), [P, A] = O(() => Ae($));
+  ae.useEffect(() => A(Ae($)), [$]);
   const U = qt(
     jt(Yt, { activationConstraint: { delay: 250, tolerance: 5 } })
   ), q = ue(null), [G, v] = O(null), p = ue(0), f = () => {
   }, w = ({ delta: x }) => {
     p.current = x?.x ?? 0;
   }, c = K(
-    ({ active: x, over: $ }) => {
+    ({ active: x, over: F }) => {
       const R = p.current;
-      if (p.current = 0, v(null), !x || !$) return;
-      const j = String(x.id).replace(/^drag-/, ""), S = String($.id).replace(/^drop-/, "");
+      if (p.current = 0, v(null), !x || !F) return;
+      const j = String(x.id).replace(/^drag-/, ""), S = String(F.id).replace(/^drop-/, "");
       if (!j || !S || j === S) return;
-      let F = S;
+      let T = S;
       const M = Math.max(0, Math.floor(-R / g));
       if (M > 0) {
         let ie = S;
         for (let xe = 0; xe < M; xe++) {
-          const P = Ka(B, ie, null);
-          if (!P) break;
-          if (!P.parentId) {
-            F = r;
+          const B = Ka(P, ie, null);
+          if (!B) break;
+          if (!B.parentId) {
+            T = r;
             break;
           }
-          F = P.parentId, ie = P.parentId;
+          T = B.parentId, ie = B.parentId;
         }
       }
-      if (m && F === r) {
-        A(Ae(T));
+      if (m && T === r) {
+        A(Ae($));
         return;
       }
-      const D = Ae(B), { newRoots: z, removed: V } = En(D, j);
+      const D = Ae(P), { newRoots: z, removed: V } = En(D, j);
       if (!V) return;
-      const Ne = Rn(z, F, V);
-      A(Ne), a?.({ sourceId: j, destParentId: F, newTree: Ne });
+      const Ne = Rn(z, T, V);
+      A(Ne), a?.({ sourceId: j, destParentId: T, newTree: Ne });
     },
-    [B, T, r, m, g, a]
+    [P, $, r, m, g, a]
   ), h = K(
-    (x, $ = 0) => x.map((R) => /* @__PURE__ */ l(ae.Fragment, { children: [
+    (x, F = 0) => x.map((R) => /* @__PURE__ */ l(ae.Fragment, { children: [
       /* @__PURE__ */ e(
         Cn,
         {
           node: R,
-          depth: $,
+          depth: F,
           expanded: !!L[R.id],
           onToggle: () => I(R.id),
           onSelect: i,
@@ -3886,29 +3890,29 @@ function ps({
           indent: g
         }
       ),
-      L[R.id] && R.children?.length > 0 ? h(R.children, $ + 1) : null
+      L[R.id] && R.children?.length > 0 ? h(R.children, F + 1) : null
     ] }, R.id)),
     [L, g, y, N, b, i, k, I]
   );
   return ae.useMemo(() => {
     if (!G) return null;
     const x = String(G).replace(/^drag-/, "");
-    function $(R) {
+    function F(R) {
       for (const j of R) {
         if (j.id === x) return j;
-        const S = j.children?.length ? $(j.children) : null;
+        const S = j.children?.length ? F(j.children) : null;
         if (S) return S;
       }
       return null;
     }
-    return $(B);
-  }, [G, B]), /* @__PURE__ */ l("div", { className: "tv", children: [
+    return F(P);
+  }, [G, P]), /* @__PURE__ */ l("div", { className: "tv", children: [
     s !== !1 && /* @__PURE__ */ l("div", { className: "tv-header", children: [
       /* @__PURE__ */ e("div", { className: "tv-title", children: s }),
       /* @__PURE__ */ e("button", { className: "tv-btn", onClick: d, children: "+ New folder" })
     ] }),
     /* @__PURE__ */ l("div", { className: "tv-root-row", children: [
-      /* @__PURE__ */ e($a, { size: 16, className: "tv-folder-ic" }),
+      /* @__PURE__ */ e(Fa, { size: 16, className: "tv-folder-ic" }),
       /* @__PURE__ */ e("strong", { children: "ROOT" }),
       /* @__PURE__ */ e("button", { className: "tv-icon", title: "Create top-level", onClick: d, children: "+" })
     ] }),
@@ -3921,7 +3925,7 @@ function ps({
         onDragMove: w,
         onDragEnd: c,
         modifiers: [_t],
-        children: /* @__PURE__ */ e("div", { ref: q, className: "tv-list", children: h(B, 0) })
+        children: /* @__PURE__ */ e("div", { ref: q, className: "tv-list", children: h(P, 0) })
       }
     )
   ] });
@@ -3974,24 +3978,24 @@ function In({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
   }, [n.key, i, s]);
   const N = (a) => {
     if (!a.dependsOn) return !0;
-    const { field: k, value: m, operator: g = "equals" } = a.dependsOn, T = i[k];
+    const { field: k, value: m, operator: g = "equals" } = a.dependsOn, $ = i[k];
     switch (g) {
       case "equals":
-        return T === m;
+        return $ === m;
       case "notEquals":
-        return T !== m;
+        return $ !== m;
       case "contains":
-        return Array.isArray(T) && T.includes(m);
+        return Array.isArray($) && $.includes(m);
       case "notContains":
-        return !Array.isArray(T) || !T.includes(m);
+        return !Array.isArray($) || !$.includes(m);
       case "greaterThan":
-        return Number(T) > Number(m);
+        return Number($) > Number(m);
       case "lessThan":
-        return Number(T) < Number(m);
+        return Number($) < Number(m);
       case "isEmpty":
-        return !T || Array.isArray(T) && T.length === 0;
+        return !$ || Array.isArray($) && $.length === 0;
       case "isNotEmpty":
-        return T && (!Array.isArray(T) || T.length > 0);
+        return $ && (!Array.isArray($) || $.length > 0);
       default:
         return !0;
     }
@@ -4087,7 +4091,7 @@ function In({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
       ] }),
       a.fieldtype === "checkbox" && /* @__PURE__ */ l("div", { children: [
         /* @__PURE__ */ e(
-          Ba,
+          Pa,
           {
             name: a.key,
             checked: !!(i[a.key] || a.default),
@@ -4272,8 +4276,8 @@ function In({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
               value: m.value,
               checked: i[a.key] === m.value,
               onChange: (g) => {
-                const T = { ...i, [a.key]: g.target.value };
-                d(T), s && s(n.key, T);
+                const $ = { ...i, [a.key]: g.target.value };
+                d($), s && s(n.key, $);
               },
               disabled: a.disabled
             }
@@ -4390,8 +4394,8 @@ function In({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
             type: "file",
             name: a.key,
             onChange: (m) => {
-              const g = m.target.files[0], T = { ...i, [a.key]: g ? g.name : "" };
-              d(T), s && s(n.key, T);
+              const g = m.target.files[0], $ = { ...i, [a.key]: g ? g.name : "" };
+              d($), s && s(n.key, $);
             },
             accept: a.accept,
             className: `w-full ${o[n.key]?.[a.key] ? "border-red-500" : ""}`
@@ -4434,7 +4438,7 @@ function In({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
   ] }) });
 }
 const zn = ({ children: t }) => /* @__PURE__ */ e("div", { className: "flex -space-x-2", children: t });
-function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
+function Pn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
   console.log(`[DynamicConfig/DataTableRenderer] Component loaded for section: ${t.key}`);
   const [n, u] = O(t), [i, d] = O(null), [y, b] = O(null);
   console.log(`[DataTableRenderer] ${n.key} - Received props:`, { item: t, initialData: r });
@@ -4457,11 +4461,11 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
   }, [n.key, N, s]), X(() => () => {
     g.current && clearTimeout(g.current);
   }, []);
-  const T = (v) => {
+  const $ = (v) => {
     const p = (c, h) => {
       console.log("[DataTableRenderer] updateFieldValue called with:", { rowIndex: c, value: h, type: typeof h }), a((x) => {
-        const $ = [...x];
-        return $[c][v.key] = h, $;
+        const F = [...x];
+        return F[c][v.key] = h, F;
       });
     }, f = (c) => o[n.key]?.[c]?.[v.key], w = (c) => {
       const h = f(c);
@@ -4577,12 +4581,12 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
         return (c, h) => {
           const x = () => {
             if (v.optionsFrom && r) {
-              const { config: $, valueField: R, labelField: j } = v.optionsFrom, S = r[$] || [];
+              const { config: F, valueField: R, labelField: j } = v.optionsFrom, S = r[F] || [];
               if (Array.isArray(S))
-                return S.map((F) => ({
-                  id: F[R] || "",
-                  value: F[R] || "",
-                  label: F[j] || ""
+                return S.map((T) => ({
+                  id: T[R] || "",
+                  value: T[R] || "",
+                  label: T[j] || ""
                 }));
             }
             return v.options || [];
@@ -4593,7 +4597,7 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
               {
                 index: h,
                 value: c[v.key] || "",
-                onChange: ($) => p(h, $),
+                onChange: (F) => p(h, F),
                 options: x(),
                 placeholder: v.placeholder || `Select ${v.label}`,
                 required: v.required,
@@ -4611,7 +4615,7 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
             Ye,
             {
               selectedItems: x,
-              onSelectionChange: ($) => p(h, $),
+              onSelectionChange: (F) => p(h, F),
               options: v.options || [],
               placeholder: v.placeholder || `Select ${v.label}`,
               className: "w-full"
@@ -4621,7 +4625,7 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
       case "checkbox":
       case "boolean":
         return (c, h) => /* @__PURE__ */ e(
-          Ba,
+          Pa,
           {
             checked: !!c[v.key],
             onChange: (x) => p(h, x),
@@ -4696,13 +4700,13 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
         );
       case "audience":
         return (c, h) => {
-          const x = c[v.key] || { users: [], groups: [], roles: [] }, $ = [
+          const x = c[v.key] || { users: [], groups: [], roles: [] }, F = [
             ...x.users || [],
             ...x.groups || [],
             ...x.roles || []
           ];
           return /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ e(zn, { children: $.length > 0 ? $.slice(0, 3).map((R, j) => /* @__PURE__ */ e(
+            /* @__PURE__ */ e(zn, { children: F.length > 0 ? F.slice(0, 3).map((R, j) => /* @__PURE__ */ e(
               za,
               {
                 size: "small",
@@ -4718,7 +4722,7 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
                 onClick: () => {
                   b(v.key), d(h);
                 },
-                children: $.length > 0 ? "Edit" : "Assign"
+                children: F.length > 0 ? "Edit" : "Assign"
               }
             )
           ] });
@@ -4755,8 +4759,8 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
           {
             type: "file",
             onChange: (x) => {
-              const $ = x.target.files[0];
-              p(h, $ ? $.name : "");
+              const F = x.target.files[0];
+              p(h, F ? F.name : "");
             },
             accept: v.accept,
             className: "w-full"
@@ -4807,7 +4811,7 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
       const f = [...p];
       return f.splice(v, 1), f;
     });
-  }, []), [C, I] = O(null), B = K((v, p) => {
+  }, []), [C, I] = O(null), P = K((v, p) => {
     I(p), v.dataTransfer.effectAllowed = "move", v.dataTransfer.setData("text/html", "");
   }, []), A = K((v) => {
     v.preventDefault(), v.dataTransfer.dropEffect = "move";
@@ -4822,7 +4826,7 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
     console.log("[DataTableRenderer] handleAddAudience called with:", v), a((p) => {
       const f = [...p];
       if (i !== null && y && f[i]) {
-        const w = v.pendingInvites || [], c = w.filter(($) => $.type === "User"), h = w.filter(($) => $.type === "Group"), x = w.filter(($) => $.type === "Role");
+        const w = v.pendingInvites || [], c = w.filter((F) => F.type === "User"), h = w.filter((F) => F.type === "Group"), x = w.filter((F) => F.type === "Role");
         f[i][y] = {
           users: [...f[i][y]?.users || [], ...c],
           groups: [...f[i][y]?.groups || [], ...h],
@@ -4865,13 +4869,13 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
         {
           className: `hover:bg-gray-50 ${C === p ? "opacity-50" : ""}`,
           draggable: !0,
-          onDragStart: (f) => B(f, p),
+          onDragStart: (f) => P(f, p),
           onDragOver: A,
           onDrop: (f) => U(f, p),
           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(sa, { size: 16 }) }) }),
-            n.fields.map((f, w) => /* @__PURE__ */ e("td", { className: "px-4 py-2 ", children: T(f)(v, p) }, w)),
+            n.fields.map((f, w) => /* @__PURE__ */ e("td", { className: "px-4 py-2 ", children: $(f)(v, p) }, w)),
             /* @__PURE__ */ e("td", { className: "px-4 py-2 ", children: /* @__PURE__ */ e(
               "button",
               {
@@ -4907,7 +4911,7 @@ function Bn({ item: t, data: r, updateHandler: s, validationErrors: o = {} }) {
     })()
   ] });
 }
-const Fe = {
+const Te = {
   containerId: "ui-toast",
   position: "bottom-right",
   autoClose: 3500,
@@ -4921,12 +4925,12 @@ const fa = () => {
 }, ba = () => {
   typeof document > "u" || (Me = Math.max(0, Me - 1), Me === 0 && document.body.classList.remove("toast-backdrop"));
 }, ke = {
-  success: (t, r) => le.success(t, { ...Fe, ...r }),
-  info: (t, r) => le.info(t, { ...Fe, ...r }),
-  warn: (t, r) => le.warn(t, { ...Fe, ...r }),
+  success: (t, r) => le.success(t, { ...Te, ...r }),
+  info: (t, r) => le.info(t, { ...Te, ...r }),
+  warn: (t, r) => le.warn(t, { ...Te, ...r }),
   // Error: no autoClose + modal-like behavior via backdrop
   error: (t, r) => le.error(t, {
-    ...Fe,
+    ...Te,
     autoClose: !1,
     closeOnClick: !1,
     draggable: !1,
@@ -4949,21 +4953,21 @@ const fa = () => {
         onClose: ba
       }
     },
-    { ...Fe, ...s }
+    { ...Te, ...s }
   )
-}, Pe = (t) => {
+}, Be = (t) => {
   try {
     return `${We()}${Ya()}${t}`;
   } catch {
     return t;
   }
-}, Pn = {
-  collectionList: Pe("/unifyedxmanagedquicklinks/config/collection/list"),
-  collectionCreate: Pe("/unifyedxmanagedquicklinks/config/collection/create"),
-  collectionUpdate: Pe("/unifyedxmanagedquicklinks/config/collection"),
-  updateCollection: Pe("/unifyedxmanagedquicklinks/config/collection/updateOrder")
+}, Bn = {
+  collectionList: Be("/unifyedxmanagedquicklinks/config/collection/list"),
+  collectionCreate: Be("/unifyedxmanagedquicklinks/config/collection/create"),
+  collectionUpdate: Be("/unifyedxmanagedquicklinks/config/collection"),
+  updateCollection: Be("/unifyedxmanagedquicklinks/config/collection/updateOrder")
 }, et = ({
-  endpoints: t = Pn,
+  endpoints: t = Bn,
   className: r = "",
   onCollectionChange: s,
   showSearch: o = !0,
@@ -4974,15 +4978,15 @@ const fa = () => {
   initialData: y = null
   // Add prop for initial demo data
 }) => {
-  const [b, N] = O(null), [a, k] = O(""), [m, g] = O(() => Array.isArray(y) ? y : []), [T, L] = O(null), [E, C] = O(null), [I, B] = O(""), A = async () => {
+  const [b, N] = O(null), [a, k] = O(""), [m, g] = O(() => Array.isArray(y) ? y : []), [$, L] = O(null), [E, C] = O(null), [I, P] = O(""), A = async () => {
     try {
       const S = await Ee(t.collectionList);
       if (S) {
-        const F = S.map((M, D) => ({
+        const T = S.map((M, D) => ({
           ...M,
           order: typeof M.order == "number" ? M.order : D + 1
         }));
-        F.sort((M, D) => (M.order ?? 0) - (D.order ?? 0)), g(F), s?.(F);
+        T.sort((M, D) => (M.order ?? 0) - (D.order ?? 0)), g(T), s?.(T);
       }
     } catch (S) {
       console.log("Error loading collections:", S), typeof window < "u" && !window.location.pathname.includes("iframe.html") && le.error("Failed to load collections");
@@ -4998,19 +5002,19 @@ const fa = () => {
   }, q = () => {
     if (!n || b !== null) return;
     const S = `temp-${Date.now()}`;
-    g((F) => [
-      ...F,
+    g((T) => [
+      ...T,
       {
         id: S,
         categoryName: "",
         links: [],
-        order: (F.at(-1)?.order ?? 0) + 1,
+        order: (T.at(-1)?.order ?? 0) + 1,
         _temp: !0
       }
     ]), N(S), k("");
   }, G = () => {
     b != null && (g((S) => {
-      const F = S.find((D) => D.id === b), M = F && F._temp ? S.filter((D) => D.id !== b) : S;
+      const T = S.find((D) => D.id === b), M = T && T._temp ? S.filter((D) => D.id !== b) : S;
       return s?.(M), M;
     }), N(null), k(""));
   }, v = async () => {
@@ -5018,64 +5022,64 @@ const fa = () => {
     const S = typeof b == "string" && b.startsWith("temp-");
     try {
       if (S) {
-        const F = await Re(t.collectionCreate, {
+        const T = await Re(t.collectionCreate, {
           categoryName: a.trim(),
           order: (Array.isArray(m) && m.length > 0 ? m.at(-1)?.order ?? 0 : 0) + 1
         });
-        F && (g((M) => {
-          const D = M.map((z) => z.id === b ? F : z);
+        T && (g((M) => {
+          const D = M.map((z) => z.id === b ? T : z);
           return s?.(D), D;
         }), ke.success("Collection created successfully"));
       } else {
-        const F = await mn(
+        const T = await mn(
           `${t.collectionUpdate}/${b}?newName=${a.trim()}`
         );
         g((M) => {
           const D = M.map(
-            (z) => z.id === b ? F && F.id ? { ...z, ...F } : { ...z, categoryName: a.trim() } : z
+            (z) => z.id === b ? T && T.id ? { ...z, ...T } : { ...z, categoryName: a.trim() } : z
           );
           return s?.(D), D;
         }), le.success("Collection updated successfully");
       }
       N(null), k("");
-    } catch (F) {
-      console.log(F), le.error("Failed to save collection");
+    } catch (T) {
+      console.log(T), le.error("Failed to save collection");
     }
   }, p = async (S) => {
     if (i)
       try {
         await un(`${t.collectionUpdate}/${S.id}`) && (le.success("Deleted successfully", { autoClose: 3e3 }), A());
-      } catch (F) {
-        console.log(F), le.error("Failed to delete collection");
+      } catch (T) {
+        console.log(T), le.error("Failed to delete collection");
       }
-  }, f = (S, F, M) => {
-    if (!d || !F || !M || F === M) return S;
-    const D = S.findIndex((ie) => ie.id === F), z = S.findIndex((ie) => ie.id === M);
+  }, f = (S, T, M) => {
+    if (!d || !T || !M || T === M) return S;
+    const D = S.findIndex((ie) => ie.id === T), z = S.findIndex((ie) => ie.id === M);
     if (D === -1 || z === -1) return S;
     const V = [...S], [Ne] = V.splice(D, 1);
     return V.splice(z, 0, Ne), V.map((ie, xe) => ({ ...ie, order: xe + 1 }));
   }, w = async (S) => {
-    const F = S.map((M) => ({
+    const T = S.map((M) => ({
       id: M.id,
       order: M.order,
       categoryName: M.categoryName
     }));
     try {
-      await Re(t.updateCollection, F);
+      await Re(t.updateCollection, T);
     } catch (M) {
       console.log(M), le.error("Failed to save order", { autoClose: 2500 });
     }
-  }, c = (S, F) => {
-    d && (S.dataTransfer.effectAllowed = "move", S.dataTransfer.setData("text/plain", String(F)), L(F));
+  }, c = (S, T) => {
+    d && (S.dataTransfer.effectAllowed = "move", S.dataTransfer.setData("text/plain", String(T)), L(T));
   }, h = (S) => {
-    T && S !== E && C(S);
+    $ && S !== E && C(S);
   }, x = (S) => {
     S.preventDefault();
-  }, $ = async (S, F) => {
+  }, F = async (S, T) => {
     S.preventDefault();
     const M = S.dataTransfer.getData("text/plain");
     M && (g((D) => {
-      const z = f(D, M, F);
+      const z = f(D, M, T);
       return console.log("Reordered", z), w(z), s?.(z), z;
     }), L(null), C(null));
   }, R = () => {
@@ -5089,7 +5093,7 @@ const fa = () => {
         he,
         {
           value: I,
-          onDebouncedChange: B,
+          onDebouncedChange: P,
           placeholder: "Search Collection",
           customClass: "mr-4 searchmanagecollection"
         }
@@ -5108,13 +5112,13 @@ const fa = () => {
       )
     ] }) }),
     /* @__PURE__ */ e("div", { className: "mt-5 flex flex-col", children: j.map((S) => {
-      const F = b === S.id, M = S?.links?.length ?? 0, D = T === S.id, z = E === S.id && T !== S.id;
+      const T = b === S.id, M = S?.links?.length ?? 0, D = $ === S.id, z = E === S.id && $ !== S.id;
       return /* @__PURE__ */ e(
         "div",
         {
           onDragEnter: () => h(S.id),
           onDragOver: x,
-          onDrop: (V) => $(V, S.id),
+          onDrop: (V) => F(V, S.id),
           onDragEnd: R,
           className: [
             "flex items-center justify-between p-3 border rounded-2xl mb-3",
@@ -5122,7 +5126,7 @@ const fa = () => {
             z ? "ring-2 ring-gray-800/20" : "",
             D ? "opacity-60" : ""
           ].join(" "),
-          children: F ? /* @__PURE__ */ l(ee, { children: [
+          children: T ? /* @__PURE__ */ l(ee, { children: [
             /* @__PURE__ */ e("div", { className: "flex items-center gap-2 flex-1", children: /* @__PURE__ */ e(
               "input",
               {
@@ -5245,7 +5249,7 @@ const fa = () => {
   /* @__PURE__ */ e("span", { className: "font-mono", children: String(t?.type ?? "N/A") })
 ] }), Ce = /* @__PURE__ */ Object.create(null);
 Ce.section = In;
-Ce.datatable = Bn;
+Ce.datatable = Pn;
 Ce.managecollectionlist = at;
 Ce["manage-collection-list"] = at;
 function On(t) {
@@ -5262,36 +5266,36 @@ function Vn({
   onCancel: o,
   onSave: n
 }) {
-  const [u, i] = ae.useState(r), [d, y] = ae.useState(null), [b, N] = O(!1), [a, k] = O(!1), [m, g] = O({}), T = `${ve()}/unifyedxappmodulemanagement/api/v1/appmanager/${t}/configuration`, L = T, [E, C] = O(1), I = (f) => {
+  const [u, i] = ae.useState(r), [d, y] = ae.useState(null), [b, N] = O(!1), [a, k] = O(!1), [m, g] = O({}), $ = `${ve()}/unifyedxappmodulemanagement/api/v1/appmanager/${t}/configuration`, L = $, [E, C] = O(1), I = (f) => {
     if (!r || !r.configuration)
       return f;
     const w = {}, c = f?.configuration || {};
     return r.configuration.forEach((h) => {
       if (h.key && h.type === "datatable") {
-        const $ = (c[h.key] || []).map((R, j) => {
+        const F = (c[h.key] || []).map((R, j) => {
           const S = { id: R.id || 0 };
-          return h.fields && h.fields.forEach((F) => {
-            if (F.fieldtype === "audience") {
+          return h.fields && h.fields.forEach((T) => {
+            if (T.fieldtype === "audience") {
               let M = { users: [], groups: [], roles: [] };
-              R[F.key] && (Array.isArray(R[F.key]) ? M = { users: [], groups: [], roles: [] } : typeof R[F.key] == "object" && (M = {
-                users: R[F.key].users || [],
-                groups: R[F.key].groups || [],
-                roles: R[F.key].roles || []
-              })), S[F.key] = M;
+              R[T.key] && (Array.isArray(R[T.key]) ? M = { users: [], groups: [], roles: [] } : typeof R[T.key] == "object" && (M = {
+                users: R[T.key].users || [],
+                groups: R[T.key].groups || [],
+                roles: R[T.key].roles || []
+              })), S[T.key] = M;
             } else
-              S[F.key] = R[F.key] || F.default || "";
+              S[T.key] = R[T.key] || T.default || "";
           }), S;
         });
-        if ($.length === 0) {
+        if (F.length === 0) {
           const R = { id: 0 };
           h.fields && h.fields.forEach((j) => {
             j.fieldtype === "audience" ? R[j.key] = { users: [], groups: [], roles: [] } : R[j.key] = j.default || "";
-          }), $.push(R);
+          }), F.push(R);
         }
-        w[h.key] = $;
+        w[h.key] = F;
       } else h.key && (w[h.key] = c[h.key] || {});
     }), w;
-  }, B = () => {
+  }, P = () => {
     if (r && r.configuration) {
       const f = {};
       r.configuration.forEach((w) => {
@@ -5319,12 +5323,12 @@ function Vn({
     const f = async () => {
       try {
         N(!0);
-        let w = await Ee(T);
+        let w = await Ee($);
         if (w) {
           const c = I(w);
           y(c);
         } else
-          B();
+          P();
       } catch (w) {
         console.error("Error fetching configuration:", w);
         let c = "Failed to load configuration";
@@ -5332,12 +5336,12 @@ function Vn({
           const h = w.response.status, x = w.response.data?.message || w.response.data?.error;
           h === 400 ? c = x || "Invalid request. Please check the application ID." : h === 401 ? c = "You are not authorized to access this configuration." : h === 403 ? c = "Access denied. You don't have permission to view this configuration." : h === 404 ? c = "Configuration not found. It may not exist yet or the application ID is incorrect." : h >= 500 ? c = x || "Server error. Please try again later." : c = x || `Failed to load configuration (Error ${h})`;
         } else w.request ? c = "Network error. Please check your connection and try again." : c = w.message || "An unexpected error occurred while loading configuration.";
-        ke.error(c), B();
+        ke.error(c), P();
       } finally {
         N(!1);
       }
     };
-    r && (i(r), t ? f() : B());
+    r && (i(r), t ? f() : P());
   }, [r, E, t, s]);
   const A = (f, w) => {
     y((c) => ({
@@ -5360,10 +5364,10 @@ function Vn({
       else if (w.type === "datatable") {
         const c = d[w.key];
         Array.isArray(c) && c.forEach((h, x) => {
-          w.fields.forEach(($) => {
-            if ($.required) {
-              const R = h[$.key];
-              (!R || typeof R == "string" && R.trim() === "") && (f[w.key] || (f[w.key] = {}), f[w.key][x] || (f[w.key][x] = {}), f[w.key][x][$.key] = `${$.label} is required`);
+          w.fields.forEach((F) => {
+            if (F.required) {
+              const R = h[F.key];
+              (!R || typeof R == "string" && R.trim() === "") && (f[w.key] || (f[w.key] = {}), f[w.key][x] || (f[w.key][x] = {}), f[w.key][x][F.key] = `${F.label} is required`);
             }
           });
         });
@@ -5375,8 +5379,8 @@ function Vn({
       let c = [];
       Object.keys(f).forEach((h) => {
         typeof f[h] == "object" && Object.keys(f[h]).forEach((x) => {
-          typeof f[h][x] == "object" ? Object.keys(f[h][x]).forEach(($) => {
-            c.push(`${h} row ${parseInt(x) + 1}: ${f[h][x][$]}`);
+          typeof f[h][x] == "object" ? Object.keys(f[h][x]).forEach((F) => {
+            c.push(`${h} row ${parseInt(x) + 1}: ${f[h][x][F]}`);
           }) : c.push(`${h}: ${f[h][x]}`);
         });
       });
@@ -5387,19 +5391,19 @@ function Vn({
         k(!0);
         const c = {};
         d && Object.keys(d).forEach((x) => {
-          const $ = r?.configuration?.find(
+          const F = r?.configuration?.find(
             (R) => R.key === x && R.type === "datatable"
           );
-          $ && Array.isArray(d[x]) ? c[x] = d[x].map((R) => {
+          F && Array.isArray(d[x]) ? c[x] = d[x].map((R) => {
             const j = { id: R.id || 0 };
-            return $.fields && $.fields.forEach((S) => {
+            return F.fields && F.fields.forEach((S) => {
               if (S.fieldtype === "audience") {
-                let F = { users: [], groups: [], roles: [] };
-                R[S.key] && typeof R[S.key] == "object" && !Array.isArray(R[S.key]) && (F = {
+                let T = { users: [], groups: [], roles: [] };
+                R[S.key] && typeof R[S.key] == "object" && !Array.isArray(R[S.key]) && (T = {
                   users: R[S.key].users || [],
                   groups: R[S.key].groups || [],
                   roles: R[S.key].roles || []
-                }), j[S.key] = F;
+                }), j[S.key] = T;
               } else
                 j[S.key] = R[S.key] || "";
             }), j;
@@ -5431,7 +5435,7 @@ function Vn({
     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 p = r?.configuration || u?.configuration;
   return X(() => {
-    s && r ? (!d || Object.keys(d).length === 0) && B() : s && !r && B();
+    s && r ? (!d || Object.keys(d).length === 0) && P() : s && !r && P();
   }, [s, r]), /* @__PURE__ */ l("div", { children: [
     /* @__PURE__ */ l(
       "div",
@@ -5503,7 +5507,7 @@ const ys = ({
           disabled: !0,
           placeholder: r
         }, f.some((x) => x.key === "displayname")) {
-          const x = f.findIndex(($) => $.key === "displayname");
+          const x = f.findIndex((F) => F.key === "displayname");
           f[x] = {
             ...f[x],
             default: r,
@@ -5528,7 +5532,7 @@ const ys = ({
       };
     }
     return p;
-  }), T = {
+  }), $ = {
     heading: "App Details",
     subHeading: "View app details and customize configurations to align with institutional requirements.",
     isLeftArrow: !0,
@@ -5553,7 +5557,7 @@ const ys = ({
   ae.useEffect(() => {
     y(I());
   }, [g]);
-  const B = K((p) => {
+  const P = K((p) => {
     console.log("Config saved with data:", p), Object.keys(p).forEach((f) => {
       const w = p[f];
       console.log(`Checking section ${f}:`, w), w && w.displayname && (console.log("Found displayname:", w.displayname), y(w.displayname));
@@ -5584,7 +5588,7 @@ const ys = ({
     ...k
   }, q = [
     { label: "Overview", content: v(U) },
-    { label: "Configuration", content: /* @__PURE__ */ e(Vn, { appid: r, configdata: { configuration: g }, disableApi: s, onCancel: E, onSave: B }) }
+    { label: "Configuration", content: /* @__PURE__ */ e(Vn, { appid: r, configdata: { configuration: g }, disableApi: s, onCancel: E, onSave: P }) }
   ];
   function G(p) {
     return p ? p.includes("<svg") ? /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: p } }) : p : "📱";
@@ -5635,11 +5639,11 @@ const ys = ({
     /* @__PURE__ */ e(
       en,
       {
-        heading: T.heading,
-        subHeading: L.length > 0 ? void 0 : T.subHeading,
+        heading: $.heading,
+        subHeading: L.length > 0 ? void 0 : $.subHeading,
         breadcrumbItems: L,
-        isLeftArrow: T.isLeftArrow,
-        onBackClick: T.onBackClick
+        isLeftArrow: $.isLeftArrow,
+        onBackClick: $.onBackClick
       }
     ),
     /* @__PURE__ */ l("div", { className: "bg-[#ffffff] border border-[#eef2f6] rounded-[12px] px-6 py-5 flex gap-4 items-start mb-4 shadow-sm", children: [
@@ -5728,7 +5732,7 @@ const bs = ({
   showExcel: k = !1,
   showPdf: m = !1,
   showRefresh: g = !1,
-  showAdd: T = !1,
+  showAdd: $ = !1,
   // Additional props
   searchPlaceholder: L = "Search...",
   handleRefreshClick: E = () => {
@@ -5737,9 +5741,9 @@ const bs = ({
   },
   // Optional: override export file names
   excelFileName: I,
-  pdfFileName: B
+  pdfFileName: P
 }) => {
-  const A = () => n?.current || o?.current, [U, q] = ae.useState(""), G = (t || "export").toString().trim() || "export", v = `${I || G}.xlsx`, p = `${B || G}.pdf`, f = (h, x, $) => Math.max(x, Math.min(h, $)), w = K(
+  const A = () => n?.current || o?.current, [U, q] = ae.useState(""), G = (t || "export").toString().trim() || "export", v = `${I || G}.xlsx`, p = `${P || G}.pdf`, f = (h, x, F) => Math.max(x, Math.min(h, F)), w = K(
     (h) => {
       const x = A();
       if (console.log("openColumnChooserNear", x), !!x?.openColumnChooser) {
@@ -5748,12 +5752,12 @@ const bs = ({
           return;
         }
         try {
-          const $ = h.currentTarget.getBoundingClientRect(), R = $.left + window.scrollX, j = $.bottom + window.scrollY;
-          let S = R - 120, F = j - 120;
+          const F = h.currentTarget.getBoundingClientRect(), R = F.left + window.scrollX, j = F.bottom + window.scrollY;
+          let S = R - 120, T = j - 120;
           const M = window.innerWidth, D = window.innerHeight;
-          S = f(S, window.scrollX + 8, window.scrollX + M - 340), F = f(F, window.scrollY, window.scrollY + D - 120), console.log("openColumnChooserNear", S, F), x.openColumnChooser(S, F);
-        } catch ($) {
-          console.log("coloumn choose error", $);
+          S = f(S, window.scrollX + 8, window.scrollX + M - 340), T = f(T, window.scrollY, window.scrollY + D - 120), console.log("openColumnChooserNear", S, T), x.openColumnChooser(S, T);
+        } catch (F) {
+          console.log("coloumn choose error", F);
         }
       }
     },
@@ -5761,20 +5765,20 @@ const bs = ({
     // no external deps; reads ref at call time
   ), c = K(
     (h, x) => {
-      const $ = A();
-      if ($)
+      const F = A();
+      if (F)
         switch (h) {
           case "ColumnChooser":
-            b && (console.log("openColumnChooser", x), x ? w(x) : $.openColumnChooser?.()), console.log("openColumnChooser out", x);
+            b && (console.log("openColumnChooser", x), x ? w(x) : F.openColumnChooser?.()), console.log("openColumnChooser out", x);
             break;
           case "Print":
-            a && $.print?.();
+            a && F.print?.();
             break;
           case "Excel":
-            k && $.excelExport?.({ fileName: v });
+            k && F.excelExport?.({ fileName: v });
             break;
           case "Pdf":
-            m && $.pdfExport?.({ fileName: p });
+            m && F.pdfExport?.({ fileName: p });
             break;
           case "Refresh":
             g && E();
@@ -5872,7 +5876,7 @@ const bs = ({
             }
           )
         ] }),
-        T && u && /* @__PURE__ */ e(
+        $ && u && /* @__PURE__ */ e(
           H,
           {
             label: d,
@@ -5905,12 +5909,12 @@ function vs(t) {
     allowPdfExport: k = !1,
     showColumnChooser: m = !1,
     enableSearchApi: g = !1,
-    height: T = "600",
+    height: $ = "600",
     selectionSettings: L = { type: "Multiple", mode: "Row" },
     enableCheckbox: E = !1,
     columns: C = [],
     onGridStateChange: I,
-    onRowSelected: B,
+    onRowSelected: P,
     onRowDeselected: A,
     onRowDoubleClick: U,
     apiRef: q,
@@ -5919,32 +5923,32 @@ function vs(t) {
     pageSettings: p,
     sortSettings: f,
     ...w
-  } = G || {}, [c, h] = ae.useState(p?.page || 1), [x, $] = ae.useState(f?.pageSize || 20), [R, j] = ae.useState(f?.sortKey || "updatedDate"), [S, F] = ae.useState(f?.direction || "Descending"), M = ce(() => {
-    const P = [Tr];
-    return i && P.push($r), d && P.push(Fr), y && P.push(Ar), g && P.push(Er), a && P.push(Rr), k && P.push(Ir), m && P.push(zr), N && P.push(Br), b && P.push(Pr), P.push(Lr), P;
+  } = G || {}, [c, h] = ae.useState(p?.page || 1), [x, F] = ae.useState(f?.pageSize || 20), [R, j] = ae.useState(f?.sortKey || "updatedDate"), [S, T] = ae.useState(f?.direction || "Descending"), M = ce(() => {
+    const B = [$r];
+    return i && B.push(Fr), d && B.push(Tr), y && B.push(Ar), g && B.push(Er), a && B.push(Rr), k && B.push(Ir), m && B.push(zr), N && B.push(Pr), b && B.push(Br), B.push(Lr), B;
   }, [i, d, y, g, a, k, m, N, b]), D = ce(() => {
-    const P = () => v.current, te = (W, pe) => {
+    const B = () => v.current, te = (W, pe) => {
       !pe && process.env.NODE_ENV !== "production" && console.warn(`[CustomDataGrid] ${W} requested but related service/feature is disabled.`);
     };
     return {
-      getInstance: () => P(),
-      refresh: () => P()?.refresh?.(),
-      getSelectedRecords: () => P()?.getSelectedRecords?.() ?? [],
-      clearSelection: () => P()?.clearSelection?.(),
-      selectRow: (W) => P()?.selectRow?.(W),
-      selectRows: (W) => P()?.selectRows?.(W),
+      getInstance: () => B(),
+      refresh: () => B()?.refresh?.(),
+      getSelectedRecords: () => B()?.getSelectedRecords?.() ?? [],
+      clearSelection: () => B()?.clearSelection?.(),
+      selectRow: (W) => B()?.selectRow?.(W),
+      selectRows: (W) => B()?.selectRows?.(W),
       search: (W) => {
-        te("search()", g), P()?.search?.(W);
+        te("search()", g), B()?.search?.(W);
       },
-      print: () => P()?.print?.(),
+      print: () => B()?.print?.(),
       excelExport: (W) => {
-        te("excelExport()", a), P()?.excelExport?.(W);
+        te("excelExport()", a), B()?.excelExport?.(W);
       },
       pdfExport: (W) => {
-        te("pdfExport()", k), P()?.pdfExport?.(W);
+        te("pdfExport()", k), B()?.pdfExport?.(W);
       },
       openColumnChooser: (W, pe) => {
-        te("openColumnChooser()", m), P()?.columnChooserModule?.openColumnChooser?.(W, pe);
+        te("openColumnChooser()", m), B()?.columnChooserModule?.openColumnChooser?.(W, pe);
       }
     };
   }, []);
@@ -5953,40 +5957,40 @@ function vs(t) {
   }, [q, D]), X(() => () => {
     q && (q.current = null);
   }, []);
-  const z = (P) => {
-    const te = String(P || "");
+  const z = (B) => {
+    const te = String(B || "");
     return te === "Ascending" || te === "Descending" ? te : te.toLowerCase() === "ascending" ? "Ascending" : "Descending";
-  }, V = (P) => {
-    const te = v.current, W = P?.requestType, pe = W === "paging" ? "paging" : W === "sorting" ? "sorting" : W === "searching" ? "searching" : W === "filtering" ? "filtering" : W === "grouping" ? "grouping" : W === "reorder" ? "reorder" : W === "columnstate" ? "columnstate" : "other", Te = P?.pageSize ?? te?.pageSettings?.pageSize ?? x, Ie = P?.currentPage ?? te?.pageSettings?.currentPage ?? n, Je = P?.columnName && P?.direction ? [{ field: P.columnName, dir: z(P.direction) }] : (te?.sortSettings?.columns || []).map(($e) => ({
-      field: $e.field,
-      dir: z($e.direction ?? $e.dir)
-    })), Qe = P?.searchString ?? "", Xe = P?.columns ?? te?.filterSettings?.columns ?? [];
+  }, V = (B) => {
+    const te = v.current, W = B?.requestType, pe = W === "paging" ? "paging" : W === "sorting" ? "sorting" : W === "searching" ? "searching" : W === "filtering" ? "filtering" : W === "grouping" ? "grouping" : W === "reorder" ? "reorder" : W === "columnstate" ? "columnstate" : "other", $e = B?.pageSize ?? te?.pageSettings?.pageSize ?? x, Ie = B?.currentPage ?? te?.pageSettings?.currentPage ?? n, Je = B?.columnName && B?.direction ? [{ field: B.columnName, dir: z(B.direction) }] : (te?.sortSettings?.columns || []).map((Fe) => ({
+      field: Fe.field,
+      dir: z(Fe.direction ?? Fe.dir)
+    })), Qe = B?.searchString ?? "", Xe = B?.columns ?? te?.filterSettings?.columns ?? [];
     return {
       reason: pe,
-      page: { index: Ie, size: Te, skip: (Ie - 1) * Te, take: Te },
+      page: { index: Ie, size: $e, skip: (Ie - 1) * $e, take: $e },
       sort: Je,
       // [{ field, dir: 'Ascending'|'Descending' }]
       search: Qe,
       filters: Xe,
-      rawEvent: P
+      rawEvent: B
     };
-  }, Ne = (P) => {
+  }, Ne = (B) => {
     setTimeout(() => {
       v?.current?.hideSpinner();
-    }, 1e3), P.requestType === "paging" && (h(P.currentPage), $(P.pageSize)), P.requestType === "sorting" && (j(P.columnName || "updatedDate"), F(P.direction === "Ascending" ? "ASC" : "DESC")), I && I(V(P), P);
-  }, ie = (P) => {
-    typeof U == "function" && U(P?.rowData, P);
+    }, 1e3), B.requestType === "paging" && (h(B.currentPage), F(B.pageSize)), B.requestType === "sorting" && (j(B.columnName || "updatedDate"), T(B.direction === "Ascending" ? "ASC" : "DESC")), I && I(V(B), B);
+  }, ie = (B) => {
+    typeof U == "function" && U(B?.rowData, B);
   }, xe = () => {
-    const P = [];
-    return E && P.push(/* @__PURE__ */ e(ia, { type: "checkbox", width: "50" }, "__checkbox__")), C.forEach((te, W) => {
+    const B = [];
+    return E && B.push(/* @__PURE__ */ e(ia, { type: "checkbox", width: "50" }, "__checkbox__")), C.forEach((te, W) => {
       const {
         field: pe,
-        headerText: Te,
+        headerText: $e,
         width: Ie,
         textAlign: Je = "Left",
         template: Qe,
         isPrimaryKey: Xe,
-        showInColumnChooser: $e = !0,
+        showInColumnChooser: Fe = !0,
         allowFiltering: tt = !0,
         allowSorting: rt = !0,
         type: nt,
@@ -5997,17 +6001,17 @@ function vs(t) {
         customAttributes: ct,
         ...dt
       } = te || {};
-      P.push(
+      B.push(
         /* @__PURE__ */ e(
           ia,
           {
             field: pe,
-            headerText: Te,
+            headerText: $e,
             width: Ie,
             textAlign: Je,
             template: Qe,
             isPrimaryKey: Xe,
-            showInColumnChooser: $e,
+            showInColumnChooser: Fe,
             allowFiltering: tt,
             allowSorting: rt,
             type: nt,
@@ -6021,7 +6025,7 @@ function vs(t) {
           pe || `col-${W}`
         )
       );
-    }), P;
+    }), B;
   };
   return /* @__PURE__ */ l(
     Or,
@@ -6032,7 +6036,7 @@ function vs(t) {
         result: r,
         count: s
       },
-      height: T,
+      height: $,
       allowPaging: u,
       allowSorting: i,
       allowFiltering: d,
@@ -6047,7 +6051,7 @@ function vs(t) {
         allowUnsort: !1
       },
       actionBegin: Ne,
-      rowSelected: B,
+      rowSelected: P,
       rowDeselected: A,
       recordDoubleClick: ie,
       ...w,
@@ -6065,7 +6069,7 @@ export {
   Kn as Badge,
   Yr as Breadcrumbs,
   Gr as Button,
-  Ba as Checkbox,
+  Pa as Checkbox,
   vs as CustomDataGrid,
   hs as CustomDialog,
   bs as CustomGridToolbar,