@toolbox-web/grid-react 0.18.4 → 1.0.0-rc.1

package/index.js

@@ -1,22 +1,22 @@
-import { jsx as E, Fragment as Re } from "react/jsx-runtime";
-import { DataGridElement as ve } from "@toolbox-web/grid";
-import { createContext as pe, useContext as z, useRef as P, useCallback as h, useEffect as w, forwardRef as Ce, useMemo as G, useImperativeHandle as be, Children as Ee, isValidElement as Se, useState as de } from "react";
+import { jsx as b, Fragment as ye } from "react/jsx-runtime";
+import { DataGridElement as he } from "@toolbox-web/grid";
+import { createContext as fe, useContext as O, useRef as x, useCallback as P, useEffect as C, forwardRef as Re, useMemo as G, useImperativeHandle as we, Children as Ce, isValidElement as ve, useState as de } from "react";
 import { flushSync as R } from "react-dom";
-import { createRoot as C } from "react-dom/client";
-import { createPluginsFromFeatures as Pe } from "@toolbox-web/grid/features/registry";
-import { G as xe } from "./chunks/grid-element-context-BU3WvNtM.js";
-function De(n) {
+import { createRoot as v } from "react-dom/client";
+import { createPluginsFromFeatures as be } from "@toolbox-web/grid/features/registry";
+import { G as Ee } from "./chunks/grid-element-context-BU3WvNtM.js";
+function Pe(n) {
   return n.charAt(0).toUpperCase() + n.slice(1);
 }
 function ue(n) {
-  return n.toLowerCase() === "id" ? "ID" : n.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/[_-]/g, " ").split(" ").filter(Boolean).map(De).join(" ");
+  return n.toLowerCase() === "id" ? "ID" : n.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/[_-]/g, " ").split(" ").filter(Boolean).map(Pe).join(" ");
 }
-const Ge = /* @__PURE__ */ new Set(["string", "number", "boolean", "date", "datetime", "currency"]);
-function Ae(n) {
+const Se = /* @__PURE__ */ new Set(["string", "number", "boolean", "date", "datetime", "currency"]);
+function De(n) {
   const t = n.lastIndexOf(":");
   if (t > 0) {
     const e = n.slice(t + 1).toLowerCase();
-    if (Ge.has(e)) {
+    if (Se.has(e)) {
       const r = n.slice(0, t);
       return {
         field: r,
@@ -30,10 +30,10 @@ function Ae(n) {
     header: ue(n)
   };
 }
-function Ie(n) {
-  return n.map((t) => typeof t == "string" ? Ae(t) : t);
+function Ge(n) {
+  return n.map((t) => typeof t == "string" ? De(t) : t);
 }
-const U = {
+const W = {
   onCellClick: "cell-click",
   onRowClick: "row-click",
   onCellActivate: "cell-activate",
@@ -59,191 +59,191 @@ const U = {
   onExportComplete: "export-complete",
   onPrintStart: "print-start",
   onPrintComplete: "print-complete"
-}, oe = pe(null), Ve = ({ icons: n, children: t }) => /* @__PURE__ */ E(oe.Provider, { value: n, children: t });
-function at() {
-  return z(oe);
+}, te = fe(null), xe = ({ icons: n, children: t }) => /* @__PURE__ */ b(te.Provider, { value: n, children: t });
+function st() {
+  return O(te);
 }
-const Ne = oe, Z = /* @__PURE__ */ new WeakMap(), Q = /* @__PURE__ */ new Map();
-function me(n) {
+const Ae = te, U = /* @__PURE__ */ new WeakMap(), J = /* @__PURE__ */ new Map();
+function ge(n) {
   const t = n.querySelector("tbw-grid-responsive-card");
   if (t) {
-    const r = Z.get(t);
+    const r = U.get(t);
     if (r) return r;
   }
   const e = n.id || n.getAttribute("data-grid-id");
   if (e)
-    return Q.get(e);
-}
-function Le(n) {
-  const { children: t, cardRowHeight: e = "auto" } = n, r = P(null), o = h(
-    (l) => {
-      if (r.current = l, !l) return;
-      Z.set(l, t);
-      const i = l.closest("tbw-grid");
-      if (i) {
-        const f = i.id || i.getAttribute("data-grid-id");
-        f && Q.set(f, t);
+    return J.get(e);
+}
+function Ve(n) {
+  const { children: t, cardRowHeight: e = "auto" } = n, r = x(null), o = P(
+    (c) => {
+      if (r.current = c, !c) return;
+      U.set(c, t);
+      const s = c.closest("tbw-grid");
+      if (s) {
+        const u = s.id || s.getAttribute("data-grid-id");
+        u && J.set(u, t);
       }
     },
     [t]
   );
-  w(() => () => {
-    const l = r.current;
-    if (l) {
-      Z.delete(l);
-      const i = l.closest("tbw-grid");
-      if (i) {
-        const f = i.id || i.getAttribute("data-grid-id");
-        f && Q.delete(f);
+  C(() => () => {
+    const c = r.current;
+    if (c) {
+      U.delete(c);
+      const s = c.closest("tbw-grid");
+      if (s) {
+        const u = s.id || s.getAttribute("data-grid-id");
+        u && J.delete(u);
       }
     }
   }, []);
   const a = e === "auto" ? "auto" : String(e);
-  return /* @__PURE__ */ E("tbw-grid-responsive-card", { ref: o, cardRowHeight: a });
+  return /* @__PURE__ */ b("tbw-grid-responsive-card", { ref: o, cardRowHeight: a });
 }
-Le.displayName = "GridResponsiveCard";
-const $ = pe(null), Te = ({ defaults: n, children: t }) => /* @__PURE__ */ E($.Provider, { value: n, children: t });
-function lt() {
-  return z($);
+Ve.displayName = "GridResponsiveCard";
+const z = fe(null), Ie = ({ defaults: n, children: t }) => /* @__PURE__ */ b(z.Provider, { value: n, children: t });
+function ct() {
+  return O(z);
 }
-function dt(n) {
-  return z($)?.[n];
+function at(n) {
+  return O(z)?.[n];
 }
-const ke = $, K = /* @__PURE__ */ Symbol("reactProcessed"), I = [];
-function Fe(n) {
-  for (let t = I.length - 1; t >= 0; t--) {
-    const e = I[t];
+const Ne = z, B = /* @__PURE__ */ Symbol("reactProcessed"), A = [];
+function Le(n) {
+  for (let t = A.length - 1; t >= 0; t--) {
+    const e = A[t];
     if (n.contains(e.container) && e.container.classList.contains("react-cell-editor")) {
       try {
         e.root.unmount();
       } catch {
       }
-      I.splice(t, 1);
+      A.splice(t, 1);
     }
   }
 }
-function Me(n) {
+function ke(n) {
   const t = /* @__PURE__ */ new WeakMap();
   return (e) => {
     const r = e.cellEl;
     if (r) {
-      const l = t.get(r);
-      if (l)
+      const c = t.get(r);
+      if (c)
         return R(() => {
-          l.root.render(n(e));
-        }), l.container;
+          c.root.render(n(e));
+        }), c.container;
     }
     const o = document.createElement("div");
     o.className = "react-cell-renderer", o.style.display = "contents";
-    const a = C(o);
+    const a = v(o);
     return R(() => {
       a.render(n(e));
-    }), r && t.set(r, { root: a, container: o }), I.push({ root: a, container: o }), o;
+    }), r && t.set(r, { root: a, container: o }), A.push({ root: a, container: o }), o;
   };
 }
-function He(n) {
+function Te(n) {
   return (t) => {
     const e = document.createElement("div");
     e.className = "react-cell-editor", e.style.display = "contents";
-    const r = C(e);
+    const r = v(e);
     return R(() => {
       r.render(n(t));
-    }), I.push({ root: r, container: e }), e;
+    }), A.push({ root: r, container: e }), e;
   };
 }
-function Oe(n) {
+function Fe(n) {
   return (t) => {
     const e = document.createElement("div");
     e.className = "react-header-renderer", e.style.display = "contents";
-    const r = C(e);
+    const r = v(e);
     return R(() => {
       r.render(n(t));
-    }), I.push({ root: r, container: e }), e;
+    }), A.push({ root: r, container: e }), e;
   };
 }
-function qe(n) {
+function Me(n) {
   return (t) => {
     const e = document.createElement("div");
     e.className = "react-header-label-renderer", e.style.display = "contents";
-    const r = C(e);
+    const r = v(e);
     return R(() => {
       r.render(n(t));
-    }), I.push({ root: r, container: e }), e;
+    }), A.push({ root: r, container: e }), e;
   };
 }
-function Be(n) {
+function He(n) {
   return (t) => {
     const e = n(t);
     if (e instanceof HTMLElement || typeof e == "string")
       return e;
     const r = document.createElement("div");
     r.className = "react-loading-renderer", r.style.display = "contents";
-    const o = C(r);
+    const o = v(r);
     return R(() => {
       o.render(e);
-    }), I.push({ root: o, container: r }), r;
+    }), A.push({ root: o, container: r }), r;
   };
 }
-function ye(n) {
+function pe(n) {
   if (!n) return;
-  if (n[K]) return n;
+  if (n[B]) return n;
   if (n.loadingRenderer && typeof n.loadingRenderer == "function") {
     const r = n.loadingRenderer;
     n = {
       ...n,
-      loadingRenderer: Be(r)
+      loadingRenderer: He(r)
     };
   }
   if (!n.columns) {
     const r = n;
-    return r[K] = !0, r;
+    return r[B] = !0, r;
   }
   const t = n.columns.map((r) => {
-    const { renderer: o, editor: a, headerRenderer: l, headerLabelRenderer: i, ...f } = r, g = { ...f };
-    return o && (g.renderer = Me(o)), a && (g.editor = He(a)), l && (g.headerRenderer = Oe(l)), i && (g.headerLabelRenderer = qe(i)), g;
+    const { renderer: o, editor: a, headerRenderer: c, headerLabelRenderer: s, ...u } = r, l = { ...u };
+    return o && (l.renderer = ke(o)), a && (l.editor = Te(a)), c && (l.headerRenderer = Fe(c)), s && (l.headerLabelRenderer = Me(s)), l;
   }), e = {
     ...n,
     columns: t
   };
-  return e[K] = !0, e;
+  return e[B] = !0, e;
 }
-const X = /* @__PURE__ */ new WeakMap(), ee = /* @__PURE__ */ new Map();
-function je(n) {
+const Y = /* @__PURE__ */ new WeakMap(), Z = /* @__PURE__ */ new Map();
+function Oe(n) {
   const t = n.querySelector("tbw-grid-detail");
   if (t) {
-    const r = X.get(t);
+    const r = Y.get(t);
     if (r) return r;
   }
   const e = n.id || n.getAttribute("data-grid-id");
   if (e)
-    return ee.get(e);
+    return Z.get(e);
 }
-function _e(n) {
-  const { children: t, showExpandColumn: e = !0, animation: r = "slide" } = n, o = P(null), a = h(
-    (i) => {
-      if (o.current = i, !i) return;
-      X.set(i, t);
-      const f = i.closest("tbw-grid");
-      if (f) {
-        const g = f.id || f.getAttribute("data-grid-id");
-        g && ee.set(g, t);
+function je(n) {
+  const { children: t, showExpandColumn: e = !0, animation: r = "slide" } = n, o = x(null), a = P(
+    (s) => {
+      if (o.current = s, !s) return;
+      Y.set(s, t);
+      const u = s.closest("tbw-grid");
+      if (u) {
+        const l = u.id || u.getAttribute("data-grid-id");
+        l && Z.set(l, t);
       }
     },
     [t]
   );
-  return w(() => () => {
-    const i = o.current;
-    if (i) {
-      X.delete(i);
-      const f = i.closest("tbw-grid");
-      if (f) {
-        const v = f.id || f.getAttribute("data-grid-id");
-        v && ee.delete(v);
+  return C(() => () => {
+    const s = o.current;
+    if (s) {
+      Y.delete(s);
+      const u = s.closest("tbw-grid");
+      if (u) {
+        const w = u.id || u.getAttribute("data-grid-id");
+        w && Z.delete(w);
       }
-      const g = i.parentNode;
-      g && g.contains(i);
+      const l = s.parentNode;
+      l && l.contains(s);
     }
-  }, []), /* @__PURE__ */ E(
+  }, []), /* @__PURE__ */ b(
     "tbw-grid-detail",
     {
       ref: a,
@@ -252,29 +252,29 @@ function _e(n) {
     }
   );
 }
-_e.displayName = "GridDetailPanel";
-const te = /* @__PURE__ */ new WeakMap(), re = /* @__PURE__ */ new Map();
+je.displayName = "GridDetailPanel";
+const Q = /* @__PURE__ */ new WeakMap(), X = /* @__PURE__ */ new Map();
 function ze(n) {
-  const t = te.get(n);
+  const t = Q.get(n);
   if (t) return t;
   const e = n.id;
   if (e)
-    return re.get(e);
+    return X.get(e);
 }
-function ut(n) {
-  const { id: t, title: e, icon: r, tooltip: o, order: a = 100, children: l } = n, i = P(null), f = h(
-    (g) => {
-      i.current = g, g && (te.set(g, l), t && re.set(t, l));
+function dt(n) {
+  const { id: t, title: e, icon: r, tooltip: o, order: a = 100, children: c } = n, s = x(null), u = P(
+    (l) => {
+      s.current = l, l && (Q.set(l, c), t && X.set(t, c));
     },
-    [l, t]
+    [c, t]
   );
-  return w(() => () => {
-    const g = i.current;
-    g && (te.delete(g), t && re.delete(t));
-  }, [t]), /* @__PURE__ */ E(
+  return C(() => () => {
+    const l = s.current;
+    l && (Q.delete(l), t && X.delete(t));
+  }, [t]), /* @__PURE__ */ b(
     "tbw-grid-tool-panel",
     {
-      ref: f,
+      ref: u,
       id: t,
       title: e,
       icon: r,
@@ -283,38 +283,38 @@ function ut(n) {
     }
   );
 }
-const V = /* @__PURE__ */ new WeakMap(), N = /* @__PURE__ */ new Map();
+const V = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new Map();
 function $e(n, t) {
   const e = n.getAttribute("field"), r = V.get(n) ?? {};
   if (r.renderer = t, V.set(n, r), e) {
-    const o = N.get(e) ?? {};
-    o.renderer = t, N.set(e, o);
+    const o = I.get(e) ?? {};
+    o.renderer = t, I.set(e, o);
   }
 }
-function We(n, t) {
+function _e(n, t) {
   const e = n.getAttribute("field"), r = V.get(n) ?? {};
   if (r.editor = t, V.set(n, r), e) {
-    const o = N.get(e) ?? {};
-    o.editor = t, N.set(e, o);
+    const o = I.get(e) ?? {};
+    o.editor = t, I.set(e, o);
   }
 }
-function Je(n) {
+function qe(n) {
   let t = V.get(n)?.renderer;
   if (!t) {
     const e = n.getAttribute("field");
-    e && (t = N.get(e)?.renderer);
+    e && (t = I.get(e)?.renderer);
   }
   return t;
 }
-function Ue(n) {
+function We(n) {
   let t = V.get(n)?.editor;
   if (!t) {
     const e = n.getAttribute("field");
-    e && (t = N.get(e)?.editor);
+    e && (t = I.get(e)?.editor);
   }
   return t;
 }
-class he {
+class Be {
   mountedViews = [];
   /** Editor-specific views tracked separately for per-cell cleanup via releaseCell. */
   editorViews = [];
@@ -334,7 +334,7 @@ class he {
    * Converts React renderer/editor functions to DOM-returning functions.
    */
   processConfig(t) {
-    return ye(t) ?? t;
+    return pe(t) ?? t;
   }
   /**
    * Determines if this adapter can handle the given element.
@@ -344,8 +344,8 @@ class he {
     const e = t.getAttribute("field");
     let r = V.get(t);
     if (!r && e) {
-      const l = N.get(e);
-      l && (l.renderer || l.editor) && (r = l, V.set(t, r));
+      const c = I.get(e);
+      c && (c.renderer || c.editor) && (r = c, V.set(t, r));
     }
     const o = r?.renderer !== void 0, a = r?.editor !== void 0;
     return r !== void 0 && (o || a);
@@ -362,31 +362,31 @@ class he {
    * allowing the grid to use its default rendering.
    */
   createRenderer(t) {
-    const e = Je(t);
+    const e = qe(t);
     if (!e)
       return;
     const r = /* @__PURE__ */ new WeakMap();
     return (o) => {
       const a = o.cellEl;
       if (a) {
-        const f = r.get(a);
-        if (f)
+        const u = r.get(a);
+        if (u)
           return R(() => {
-            f.root.render(e(o));
-          }), f.container;
-        const g = document.createElement("div");
-        g.className = "react-cell-renderer", g.style.display = "contents";
-        const v = C(g);
+            u.root.render(e(o));
+          }), u.container;
+        const l = document.createElement("div");
+        l.className = "react-cell-renderer", l.style.display = "contents";
+        const w = v(l);
         return R(() => {
-          v.render(e(o));
-        }), r.set(a, { root: v, container: g, lastRowIndex: o.rowIndex ?? -1 }), this.mountedViews.push({ root: v, container: g }), g;
+          w.render(e(o));
+        }), r.set(a, { root: w, container: l, lastRowIndex: o.rowIndex ?? -1 }), this.mountedViews.push({ root: w, container: l }), l;
       }
-      const l = document.createElement("div");
-      l.className = "react-cell-renderer", l.style.display = "contents";
-      const i = C(l);
+      const c = document.createElement("div");
+      c.className = "react-cell-renderer", c.style.display = "contents";
+      const s = v(c);
       return R(() => {
-        i.render(e(o));
-      }), this.mountedViews.push({ root: i, container: l }), l;
+        s.render(e(o));
+      }), this.mountedViews.push({ root: s, container: c }), c;
     };
   }
   /**
@@ -394,11 +394,11 @@ class he {
    * with commit/cancel callbacks passed as props.
    */
   createEditor(t) {
-    const e = Ue(t);
+    const e = We(t);
     return e ? (r) => {
       const o = document.createElement("div");
       o.className = "react-cell-editor", o.style.display = "contents";
-      const a = C(o);
+      const a = v(o);
       return R(() => {
         a.render(e(r));
       }), this.editorViews.push({ root: a, container: o }), o;
@@ -409,15 +409,15 @@ class he {
    * Renders React components for expandable detail rows.
    */
   createDetailRenderer(t) {
-    const e = je(t);
+    const e = Oe(t);
     if (e)
       return (r, o) => {
         const a = document.createElement("div");
         a.className = "react-detail-panel";
-        const l = { row: r, rowIndex: o }, i = C(a);
+        const c = { row: r, rowIndex: o }, s = v(a);
         return R(() => {
-          i.render(e(l));
-        }), this.mountedViews.push({ root: i, container: a }), a;
+          s.render(e(c));
+        }), this.mountedViews.push({ root: s, container: a }), a;
       };
   }
   /**
@@ -434,15 +434,15 @@ class he {
    * Renders React components for card layout in responsive mode.
    */
   createResponsiveCardRenderer(t) {
-    const e = me(t);
+    const e = ge(t);
     if (e)
       return (r, o) => {
         const a = document.createElement("div");
         a.className = "react-responsive-card";
-        const l = { row: r, index: o }, i = C(a);
+        const c = { row: r, index: o }, s = v(a);
         return R(() => {
-          i.render(e(l));
-        }), this.mountedViews.push({ root: i, container: a }), a;
+          s.render(e(c));
+        }), this.mountedViews.push({ root: s, container: a }), a;
       };
   }
   /**
@@ -457,18 +457,18 @@ class he {
     return (o) => {
       const a = {
         grid: r ?? o
-      }, l = C(o);
+      }, c = v(o);
       return R(() => {
-        l.render(e(a));
-      }), this.mountedViews.push({ root: l, container: o }), () => {
-        const i = this.mountedViews.findIndex((f) => f.container === o);
-        if (i !== -1) {
-          const { root: f } = this.mountedViews[i];
+        c.render(e(a));
+      }), this.mountedViews.push({ root: c, container: o }), () => {
+        const s = this.mountedViews.findIndex((u) => u.container === o);
+        if (s !== -1) {
+          const { root: u } = this.mountedViews[s];
           try {
-            f.unmount();
+            u.unmount();
           } catch {
           }
-          this.mountedViews.splice(i, 1);
+          this.mountedViews.splice(s, 1);
         }
       };
     };
@@ -516,7 +516,7 @@ class he {
     return (e) => {
       const r = document.createElement("span");
       r.style.display = "contents";
-      const o = C(r);
+      const o = v(r);
       return this.mountedViews.push({ root: o, container: r }), R(() => {
         o.render(t(e));
       }), r;
@@ -530,7 +530,7 @@ class he {
     return (e) => {
       const r = document.createElement("span");
       r.style.display = "contents";
-      const o = C(r);
+      const o = v(r);
       return this.editorViews.push({ root: o, container: r }), R(() => {
         o.render(t(e));
       }), r;
@@ -544,7 +544,7 @@ class he {
     return (e, r) => {
       const o = document.createElement("div");
       o.style.display = "contents";
-      const a = C(o);
+      const a = v(o);
       this.mountedViews.push({ root: a, container: o }), R(() => {
         a.render(t(r));
       }), e.appendChild(o);
@@ -565,7 +565,7 @@ class he {
         t.unmount();
       } catch {
       }
-    }), this.editorViews = [], N.clear();
+    }), this.editorViews = [], I.clear();
   }
   /**
    * Called when a cell's content is about to be wiped.
@@ -584,7 +584,7 @@ class he {
         this.editorViews.splice(e, 1);
       }
     }
-    Fe(t);
+    Le(t);
   }
   /**
    * Unmount a specific container (called when cell is recycled).
@@ -601,11 +601,11 @@ class he {
     }
   }
 }
-const ft = he, Ke = {
+const Ke = {
   undoRedo: ["editing"],
   clipboard: ["selection"]
 };
-function Ye(n) {
+function Ue(n) {
   const t = new Set(n);
   for (const e of n) {
     const r = Ke[e];
@@ -616,34 +616,34 @@ function Ye(n) {
         );
   }
 }
-function Ze(n) {
+function Je(n) {
   const t = [];
   for (const [e, r] of Object.entries(n))
     r === void 0 || r === !1 || t.push(e);
-  return Ye(t), Pe(n);
+  return Ue(t), be(n);
 }
-let fe = !1, Y = null;
-function ne() {
-  return fe || (Y = new he(), ve.registerAdapter(Y), fe = !0), Y;
+let le = !1, K = null;
+function ee() {
+  return le || (K = new Be(), he.registerAdapter(K), le = !0), K;
 }
-ne();
-function Qe(n) {
+ee();
+function Ye(n) {
   const e = n.getPluginByName?.("masterDetail");
   e && typeof e.refreshDetailRenderer == "function" && e.refreshDetailRenderer();
 }
-function Xe(n, t) {
+function Ze(n, t) {
   const e = n;
-  if (!n.querySelector("tbw-grid-responsive-card") || !me(n)) return;
+  if (!n.querySelector("tbw-grid-responsive-card") || !ge(n)) return;
   const a = e.getPluginByName?.("responsive");
   if (a && typeof a.setCardRenderer == "function") {
-    const l = t.createResponsiveCardRenderer(n);
-    l && a.setCardRenderer(l);
+    const c = t.createResponsiveCardRenderer(n);
+    c && a.setCardRenderer(c);
   }
 }
-function et(n) {
+function Qe(n) {
   const t = {};
-  return Ee.forEach(n, (e) => {
-    if (Se(e)) {
+  return Ce.forEach(n, (e) => {
+    if (ve(e)) {
       if (e.type && e.type.displayName === "GridDetailPanel") {
         const r = e.props;
         t.masterDetail = {
@@ -657,45 +657,38 @@ function et(n) {
     }
   }), t;
 }
-const gt = Ce(function(t, e) {
+const ut = Re(function(t, e) {
   const {
     // Core props
     rows: r,
     gridConfig: o,
     columns: a,
-    columnDefaults: l,
-    fitMode: i,
-    sortable: f,
-    filterable: g,
-    selectable: v,
-    loading: x,
-    editOn: D,
-    customStyles: A,
-    className: k,
-    style: M,
-    children: L,
+    columnDefaults: c,
+    fitMode: s,
+    sortable: u,
+    filterable: l,
+    selectable: w,
+    loading: D,
+    customStyles: S,
+    className: L,
+    style: g,
+    children: h,
     // Plugin props
-    plugins: S,
+    plugins: m,
     // SSR mode
-    ssr: T,
+    ssr: E,
     // Legacy event handlers
-    onRowsChange: y,
+    onRowsChange: N,
     // Feature props and event props are in ...rest
-    ...d
-  } = t, s = P(null), p = P(null), b = z(ke), H = z(Ne), F = [
+    ...y
+  } = t, f = x(null), j = x(null), re = O(Ne), $ = O(Ae), ne = [
     "selection",
     "editing",
     "filtering",
     "multiSort",
-    "sorting",
-    // deprecated alias for multiSort
     "clipboard",
     "contextMenu",
     "reorderColumns",
-    "reorder",
-    // deprecated alias for reorderColumns
-    "rowReorder",
-    // deprecated alias for reorderRows
     "reorderRows",
     "visibility",
     "undoRedo",
@@ -712,367 +705,293 @@ const gt = Ce(function(t, e) {
     "pivot",
     "serverSide",
     "tooltip"
-  ], we = G(() => F.map((c) => {
-    const u = d[c];
-    return u !== void 0 ? `${c}:${JSON.stringify(u)}` : "";
-  }).filter(Boolean).join("|"), [d]), ie = G(() => {
-    const c = {};
-    for (const u of F)
-      u in d && d[u] !== void 0 && (c[u] = d[u]);
-    return c;
-  }, [we]), se = G(() => et(L), [L]), ce = G(() => ({ ...se, ...ie }), [ie, se]), W = G(() => S || T ? [] : Ze(ce), [ce, S, T]), O = G(() => {
-    if (S) {
-      const c = new Set(S.map((m) => m.name)), u = W.filter((m) => !c.has(m.name));
-      return [...S, ...u];
+  ], me = G(() => ne.map((i) => {
+    const d = y[i];
+    return d !== void 0 ? `${i}:${JSON.stringify(d)}` : "";
+  }).filter(Boolean).join("|"), [y]), oe = G(() => {
+    const i = {};
+    for (const d of ne)
+      d in y && y[d] !== void 0 && (i[d] = y[d]);
+    return i;
+  }, [me]), ie = G(() => Qe(h), [h]), se = G(() => ({ ...ie, ...oe }), [oe, ie]), _ = G(() => m || E ? [] : Je(se), [se, m, E]), k = G(() => {
+    if (m) {
+      const i = new Set(m.map((p) => p.name)), d = _.filter((p) => !i.has(p.name));
+      return [...m, ...d];
     }
-    return W;
-  }, [S, W]), q = G(() => {
+    return _;
+  }, [m, _]), T = G(() => {
     if (!a) return a;
-    const c = Ie(a);
-    return l ? c.map((u) => ({
-      ...l,
-      ...u
+    const i = Ge(a);
+    return c ? i.map((d) => ({
+      ...c,
+      ...d
       // Individual column props override defaults
-    })) : c;
-  }, [a, l]), B = G(() => {
-    const c = ye(o), u = {};
-    if (f !== void 0 && (u.sortable = f), g !== void 0 && (u.filterable = g), v !== void 0 && (u.selectable = v), H) {
-      const m = c?.icons || o?.icons || {};
-      u.icons = { ...H, ...m };
+    })) : i;
+  }, [a, c]), F = G(() => {
+    const i = pe(o), d = {};
+    if (u !== void 0 && (d.sortable = u), l !== void 0 && (d.filterable = l), w !== void 0 && (d.selectable = w), $) {
+      const p = i?.icons || o?.icons || {};
+      d.icons = { ...$, ...p };
     }
-    if (O.length > 0 && c) {
-      const m = c.plugins || [], j = new Set(m.map((_) => _.name)), J = O.filter((_) => !j.has(_.name));
+    if (k.length > 0 && i) {
+      const p = i.plugins || [], M = new Set(p.map((H) => H.name)), q = k.filter((H) => !M.has(H.name));
       return {
-        ...c,
-        ...u,
-        plugins: [...m, ...J]
+        ...i,
+        ...d,
+        plugins: [...p, ...q]
       };
     }
-    return O.length > 0 && !c ? { ...u, plugins: O } : Object.keys(u).length > 0 ? { ...c, ...u } : c;
-  }, [o, O, f, g, v, H]);
-  w(() => {
-    ne().setTypeDefaults(b);
-  }, [b]), w(() => {
-    s.current && (s.current.rows = r);
-  }, [r]), w(() => {
-    s.current && B && (s.current.gridConfig = B);
-  }, [B]), w(() => {
-    s.current && q && (s.current.columns = q);
-  }, [q]), w(() => {
-    s.current && i !== void 0 && (s.current.fitMode = i);
-  }, [i]), w(() => {
-    s.current && D !== void 0 && (s.current.editOn = D);
-  }, [D]), w(() => {
-    s.current && x !== void 0 && (s.current.loading = x);
-  }, [x]), w(() => {
-    const c = s.current;
-    if (!c) return;
-    const u = ne();
-    c.__frameworkAdapter = u, Qe(c), Xe(c, u);
-    let m = !1;
-    const j = requestAnimationFrame(() => {
-      m || (typeof c.refreshColumns == "function" && c.refreshColumns(), typeof c.refreshShellHeader == "function" && c.refreshShellHeader());
+    return k.length > 0 && !i ? { ...d, plugins: k } : Object.keys(d).length > 0 ? { ...i, ...d } : i;
+  }, [o, k, u, l, w, $]);
+  C(() => {
+    ee().setTypeDefaults(re);
+  }, [re]), C(() => {
+    f.current && (f.current.rows = r);
+  }, [r]), C(() => {
+    f.current && F && (f.current.gridConfig = F);
+  }, [F]), C(() => {
+    f.current && T && (f.current.columns = T);
+  }, [T]), C(() => {
+    f.current && s !== void 0 && (f.current.fitMode = s);
+  }, [s]), C(() => {
+    f.current && D !== void 0 && (f.current.loading = D);
+  }, [D]), C(() => {
+    const i = f.current;
+    if (!i) return;
+    const d = ee();
+    i.__frameworkAdapter = d, Ye(i), Ze(i, d);
+    let p = !1;
+    const M = requestAnimationFrame(() => {
+      p || (typeof i.refreshColumns == "function" && i.refreshColumns(), typeof i.refreshShellHeader == "function" && i.refreshShellHeader());
     });
     return () => {
-      m = !0, cancelAnimationFrame(j);
+      p = !0, cancelAnimationFrame(M);
     };
-  }, []), w(() => {
-    if (!s.current || !A) return;
-    const c = s.current, u = "react-custom-styles";
-    let m = !0;
-    return c.ready?.().then(() => {
-      m && A && (c.registerStyles?.(u, A), p.current = u);
+  }, []), C(() => {
+    if (!f.current || !S) return;
+    const i = f.current, d = "react-custom-styles";
+    let p = !0;
+    return i.ready?.().then(() => {
+      p && S && (i.registerStyles?.(d, S), j.current = d);
     }), () => {
-      m = !1, p.current && (c.unregisterStyles?.(p.current), p.current = null);
+      p = !1, j.current && (i.unregisterStyles?.(j.current), j.current = null);
     };
-  }, [A]), w(() => {
-    const c = s.current;
-    if (!c) return;
-    const u = [];
-    return y && u.push(c.on("rows-change", (m) => y(m.rows))), () => {
-      u.forEach((m) => m());
+  }, [S]), C(() => {
+    const i = f.current;
+    if (!i) return;
+    const d = [];
+    return N && d.push(i.on("rows-change", (p) => N(p.rows))), () => {
+      d.forEach((p) => p());
     };
-  }, [y]);
-  const ae = G(() => Object.keys(U).filter((c) => typeof d[c] == "function").sort().join("|"), [d]), le = P({});
-  for (const c of Object.keys(U))
-    le.current[c] = d[c];
-  return w(() => {
-    const c = s.current;
-    if (!c) return;
-    const u = [];
-    for (const [m, j] of Object.entries(U))
-      ae.includes(m) && u.push(
-        c.on(j, (J, _) => {
-          le.current[m]?.(J, _);
+  }, [N]);
+  const ce = G(() => Object.keys(W).filter((i) => typeof y[i] == "function").sort().join("|"), [y]), ae = x({});
+  for (const i of Object.keys(W))
+    ae.current[i] = y[i];
+  return C(() => {
+    const i = f.current;
+    if (!i) return;
+    const d = [];
+    for (const [p, M] of Object.entries(W))
+      ce.includes(p) && d.push(
+        i.on(M, (q, H) => {
+          ae.current[p]?.(q, H);
         })
       );
     return () => {
-      u.forEach((m) => m());
+      d.forEach((p) => p());
     };
-  }, [ae]), be(
+  }, [ce]), we(
     e,
     () => ({
       get element() {
-        return s.current;
+        return f.current;
       },
       async getConfig() {
-        return s.current?.getConfig?.() ?? {};
+        return f.current?.getConfig?.() ?? {};
       },
       async ready() {
-        return s.current?.ready?.();
+        return f.current?.ready?.();
       },
       async forceLayout() {
-        return s.current?.forceLayout?.();
+        return f.current?.forceLayout?.();
       },
-      async toggleGroup(c) {
-        return s.current?.toggleGroup?.(c);
+      async toggleGroup(i) {
+        return f.current?.toggleGroup?.(i);
       },
-      registerStyles(c, u) {
-        s.current?.registerStyles?.(c, u);
+      registerStyles(i, d) {
+        f.current?.registerStyles?.(i, d);
       },
-      unregisterStyles(c) {
-        s.current?.unregisterStyles?.(c);
+      unregisterStyles(i) {
+        f.current?.unregisterStyles?.(i);
       },
-      setRowLoading(c, u) {
-        s.current?.setRowLoading?.(c, u);
+      setRowLoading(i, d) {
+        f.current?.setRowLoading?.(i, d);
       },
-      setCellLoading(c, u, m) {
-        s.current?.setCellLoading?.(c, u, m);
+      setCellLoading(i, d, p) {
+        f.current?.setCellLoading?.(i, d, p);
       },
-      isRowLoading(c) {
-        return s.current?.isRowLoading?.(c) ?? !1;
+      isRowLoading(i) {
+        return f.current?.isRowLoading?.(i) ?? !1;
       },
-      isCellLoading(c, u) {
-        return s.current?.isCellLoading?.(c, u) ?? !1;
+      isCellLoading(i, d) {
+        return f.current?.isCellLoading?.(i, d) ?? !1;
       },
       clearAllLoading() {
-        s.current?.clearAllLoading?.();
+        f.current?.clearAllLoading?.();
       }
     }),
     []
-  ), /* @__PURE__ */ E(
+  ), /* @__PURE__ */ b(
     "tbw-grid",
     {
-      ref: (c) => {
-        if (s.current = c, c) {
-          const u = c;
-          B && (u.gridConfig = B), r && (u.rows = r), q && (u.columns = q);
+      ref: (i) => {
+        if (f.current = i, i) {
+          const d = i;
+          F && (d.gridConfig = F), r && (d.rows = r), T && (d.columns = T);
         }
       },
-      class: k,
-      style: M,
-      children: /* @__PURE__ */ E(xe.Provider, { value: s, children: L })
+      class: L,
+      style: g,
+      children: /* @__PURE__ */ b(Ee.Provider, { value: f, children: h })
     }
   );
 });
-function pt(n) {
+function lt(n) {
   const {
     field: t,
     header: e,
     type: r,
     editable: o,
     sortable: a,
-    resizable: l,
-    width: i,
-    minWidth: f,
-    hidden: g,
-    lockVisible: v,
-    children: x,
-    editor: D,
-    options: A,
-    multi: k,
-    format: M
-  } = n, L = P(null), S = h(
-    (d) => {
-      L.current = d, d && (x && $e(d, x), D && We(d, D));
+    resizable: c,
+    width: s,
+    minWidth: u,
+    hidden: l,
+    lockVisible: w,
+    children: D,
+    editor: S,
+    options: L,
+    multi: g,
+    format: h
+  } = n, m = x(null), E = P(
+    (f) => {
+      m.current = f, f && (D && $e(f, D), S && _e(f, S));
     },
-    [x, D, t]
-  ), T = typeof i == "number" ? `${i}px` : i, y = {
+    [D, S, t]
+  ), N = typeof s == "number" ? `${s}px` : s, y = {
     field: t,
-    ref: S
+    ref: E
   };
-  return e !== void 0 && (y.header = e), r !== void 0 && (y.type = r), o !== void 0 && (y.editable = o), a !== void 0 && (y.sortable = a), l !== void 0 && (y.resizable = l), T !== void 0 && (y.width = T), f !== void 0 && (y["min-width"] = f), g !== void 0 && (y.hidden = g), v !== void 0 && (y["lock-visible"] = v), k !== void 0 && (y.multi = k), M && (y["data-has-format"] = "true"), A && (y["data-has-options"] = "true"), /* @__PURE__ */ E("tbw-grid-column", { ...y });
+  return e !== void 0 && (y.header = e), r !== void 0 && (y.type = r), o !== void 0 && (y.editable = o), a !== void 0 && (y.sortable = a), c !== void 0 && (y.resizable = c), N !== void 0 && (y.width = N), u !== void 0 && (y["min-width"] = u), l !== void 0 && (y.hidden = l), w !== void 0 && (y["lock-visible"] = w), g !== void 0 && (y.multi = g), h && (y["data-has-format"] = "true"), L && (y["data-has-options"] = "true"), /* @__PURE__ */ b("tbw-grid-column", { ...y });
 }
-function mt({ children: n }) {
-  return /* @__PURE__ */ E("tbw-grid-tool-buttons", { children: n });
+function ft({ children: n }) {
+  return /* @__PURE__ */ b("tbw-grid-tool-buttons", { children: n });
 }
-const yt = ({ icons: n, defaults: t, children: e }) => {
+const gt = ({ icons: n, defaults: t, children: e }) => {
   let r = e;
-  return t && (r = /* @__PURE__ */ E(Te, { defaults: t, children: r })), n && (r = /* @__PURE__ */ E(Ve, { icons: n, children: r })), /* @__PURE__ */ E(Re, { children: r });
+  return t && (r = /* @__PURE__ */ b(Ie, { defaults: t, children: r })), n && (r = /* @__PURE__ */ b(xe, { icons: n, children: r })), /* @__PURE__ */ b(ye, { children: r });
 };
-function ht(n) {
-  const t = P(null), [e, r] = de(!1), [o, a] = de(null), l = P(null), i = h(() => n ? (l.current ??= document.querySelector(n), l.current) : t.current?.element ?? null, [n]);
-  w(() => {
-    let d = !0;
+function pt(n) {
+  const t = x(null), [e, r] = de(!1), [o, a] = de(null), c = x(null), s = P(() => n ? (c.current ??= document.querySelector(n), c.current) : t.current?.element ?? null, [n]);
+  C(() => {
+    let g = !0;
     return (async () => {
       try {
         if (n) {
-          const p = document.querySelector(n);
-          if (!p) return;
-          if (l.current = p, await p.ready?.(), d) {
+          const m = document.querySelector(n);
+          if (!m) return;
+          if (c.current = m, await m.ready?.(), g) {
             r(!0);
-            const b = await p.getConfig?.();
-            d && b && a(b);
+            const E = await m.getConfig?.();
+            g && E && a(E);
           }
         } else {
-          const p = t.current;
-          if (!p) return;
-          if (await p.ready?.(), d) {
+          const m = t.current;
+          if (!m) return;
+          if (await m.ready?.(), g) {
             r(!0);
-            const b = await p.getConfig?.();
-            d && b && a(b);
+            const E = await m.getConfig?.();
+            g && E && a(E);
           }
         }
       } catch {
       }
     })(), () => {
-      d = !1;
+      g = !1;
     };
   }, [n]);
-  const f = h(async () => {
-    const d = i();
-    if (d)
-      return await d.getConfig?.() ?? null;
-    const s = t.current;
-    return s ? await s.getConfig?.() ?? null : null;
-  }, [i]), g = h(async () => {
-    const d = i();
-    if (d) {
-      await d.forceLayout?.();
+  const u = P(async () => {
+    const g = s();
+    if (g)
+      return await g.getConfig?.() ?? null;
+    const h = t.current;
+    return h ? await h.getConfig?.() ?? null : null;
+  }, [s]), l = P(async () => {
+    const g = s();
+    if (g) {
+      await g.forceLayout?.();
       return;
     }
-    const s = t.current;
-    s && await s.forceLayout?.();
-  }, [i]), v = h(
-    async (d) => {
-      const s = i();
-      if (s) {
-        await s.toggleGroup?.(d);
+    const h = t.current;
+    h && await h.forceLayout?.();
+  }, [s]), w = P(
+    async (g) => {
+      const h = s();
+      if (h) {
+        await h.toggleGroup?.(g);
         return;
       }
-      const p = t.current;
-      p && await p.toggleGroup?.(d);
+      const m = t.current;
+      m && await m.toggleGroup?.(g);
     },
-    [i]
-  ), x = h(
-    (d, s) => {
-      const p = i();
-      if (p) {
-        p.registerStyles?.(d, s);
+    [s]
+  ), D = P(
+    (g, h) => {
+      const m = s();
+      if (m) {
+        m.registerStyles?.(g, h);
         return;
       }
-      t.current?.registerStyles?.(d, s);
+      t.current?.registerStyles?.(g, h);
     },
-    [i]
-  ), D = h(
-    (d) => {
-      const s = i();
-      if (s) {
-        s.unregisterStyles?.(d);
-        return;
-      }
-      t.current?.unregisterStyles?.(d);
-    },
-    [i]
-  ), A = h(() => o?.columns ? o.columns.filter((d) => !d.hidden) : [], [o]), k = h(() => {
-    const d = i(), s = d?.getPluginByName?.("selection");
-    if (!s) {
-      console.warn("[useGrid] selectAll requires SelectionPlugin");
-      return;
-    }
-    if (s.config?.mode === "row") {
-      const p = d?.rows ?? [], b = new Set(p.map((H, F) => F));
-      s.selected = b, s.requestAfterRender?.();
-    }
-  }, [i]), M = h(() => {
-    const s = i()?.getPluginByName?.("selection");
-    s && s.clearSelection?.();
-  }, [i]), L = h(() => {
-    const s = i()?.getPluginByName?.("selection");
-    return s ? new Set(s.selected ?? []) : /* @__PURE__ */ new Set();
-  }, [i]), S = h(() => {
-    const d = i(), s = d?.getPluginByName?.("selection");
-    if (!s) return [];
-    const p = d?.rows ?? [], b = s.selected ?? /* @__PURE__ */ new Set();
-    return p.filter((H, F) => b.has(F));
-  }, [i]), T = h(
-    (d) => {
-      const p = i()?.getPluginByName?.("export");
-      if (!p) {
-        console.warn("[useGrid] exportToCsv requires ExportPlugin (use export prop)");
-        return;
-      }
-      p.exportCsv?.({ filename: d ?? "export.csv" });
-    },
-    [i]
-  ), y = h(
-    (d) => {
-      const p = i()?.getPluginByName?.("export");
-      if (!p) {
-        console.warn("[useGrid] exportToJson requires ExportPlugin (use export prop)");
+    [s]
+  ), S = P(
+    (g) => {
+      const h = s();
+      if (h) {
+        h.unregisterStyles?.(g);
         return;
       }
-      p.exportJson?.({ filename: d ?? "export.json" });
+      t.current?.unregisterStyles?.(g);
     },
-    [i]
-  );
+    [s]
+  ), L = P(() => o?.columns ? o.columns.filter((g) => !g.hidden) : [], [o]);
   return {
     ref: t,
-    element: i(),
+    element: s(),
     isReady: e,
     config: o,
-    getConfig: f,
-    forceLayout: g,
-    toggleGroup: v,
-    registerStyles: x,
-    unregisterStyles: D,
-    getVisibleColumns: A,
-    // Selection methods
-    selectAll: k,
-    clearSelection: M,
-    getSelectedIndices: L,
-    getSelectedRows: S,
-    // Export methods
-    exportToCsv: T,
-    exportToJson: y
+    getConfig: u,
+    forceLayout: l,
+    toggleGroup: w,
+    registerStyles: D,
+    unregisterStyles: S,
+    getVisibleColumns: L
   };
 }
-let ge = !1;
-function wt(n, t, e, r = []) {
-  !ge && typeof window < "u" && (window.location.hostname === "localhost" || window.location.hostname === "127.0.0.1" || window.location.hostname.includes(".local")) && (ge = !0, console.warn(
-    `[useGridEvent] Deprecated: Use event props directly on DataGrid instead.
-Example: <DataGrid onSelectionChange={(e) => ...} />
-See migration guide: https://toolbox-web.dev/grid-react/migration`
-  ));
-  const o = P(e);
-  w(() => {
-    o.current = e;
-  }, [e, ...r]), w(() => {
-    const a = n.current, l = a && "element" in a ? a.element : a;
-    if (!l) return;
-    const i = ((f) => {
-      o.current(f);
-    });
-    return l.addEventListener(t, i), () => {
-      l.removeEventListener(t, i);
-    };
-  }, [n, t]);
-}
 export {
-  gt as DataGrid,
-  he as GridAdapter,
-  pt as GridColumn,
-  _e as GridDetailPanel,
-  Ve as GridIconProvider,
-  yt as GridProvider,
-  Le as GridResponsiveCard,
-  mt as GridToolButtons,
-  ut as GridToolPanel,
-  Te as GridTypeProvider,
-  ft as ReactGridAdapter,
-  ht as useGrid,
-  wt as useGridEvent,
-  at as useGridIcons,
-  lt as useGridTypeDefaults,
-  dt as useTypeDefault
+  ut as DataGrid,
+  Be as GridAdapter,
+  lt as GridColumn,
+  je as GridDetailPanel,
+  xe as GridIconProvider,
+  gt as GridProvider,
+  Ve as GridResponsiveCard,
+  ft as GridToolButtons,
+  dt as GridToolPanel,
+  Ie as GridTypeProvider,
+  pt as useGrid,
+  st as useGridIcons,
+  ct as useGridTypeDefaults,
+  at as useTypeDefault
 };