@toolbox-web/grid-react 0.4.0 → 0.5.0

package/index.js

@@ -1,33 +1,45 @@
 import { jsx as x } from "react/jsx-runtime";
 import { DataGridElement as J } from "@toolbox-web/grid";
-import { useRef as S, useCallback as E, createContext as K, useContext as N, forwardRef as Q, useMemo as U, useEffect as R, useImperativeHandle as X, useState as F } from "react";
+import { useRef as S, useCallback as E, useEffect as w, createContext as K, useContext as z, forwardRef as Q, useMemo as U, useImperativeHandle as X, useState as O } from "react";
 import { flushSync as v } from "react-dom";
 import { createRoot as b } from "react-dom/client";
-const W = /* @__PURE__ */ new WeakMap(), q = /* @__PURE__ */ new Map();
-function B(n) {
+const L = /* @__PURE__ */ new WeakMap(), N = /* @__PURE__ */ new Map();
+function j(n) {
   const t = n.querySelector("tbw-grid-detail");
   if (t) {
-    const r = W.get(t);
+    const r = L.get(t);
     if (r) return r;
   }
   const e = n.id || n.getAttribute("data-grid-id");
   if (e)
-    return q.get(e);
+    return N.get(e);
 }
 function me(n) {
   const { children: t, showExpandColumn: e = !0, animation: r = "slide" } = n, i = S(null), s = E(
     (c) => {
       if (i.current = c, !c) return;
-      W.set(c, t);
+      L.set(c, t);
       const d = c.closest("tbw-grid");
       if (d) {
-        const l = d.id || d.getAttribute("data-grid-id");
-        l && q.set(l, t);
+        const u = d.id || d.getAttribute("data-grid-id");
+        u && N.set(u, t);
       }
     },
     [t]
   );
-  return /* @__PURE__ */ x(
+  return w(() => () => {
+    const c = i.current;
+    if (c) {
+      L.delete(c);
+      const d = c.closest("tbw-grid");
+      if (d) {
+        const h = d.id || d.getAttribute("data-grid-id");
+        h && N.delete(h);
+      }
+      const u = c.parentNode;
+      u && u.contains(c);
+    }
+  }, []), /* @__PURE__ */ x(
     "tbw-grid-detail",
     {
       ref: s,
@@ -36,40 +48,52 @@ function me(n) {
     }
   );
 }
-const z = /* @__PURE__ */ new WeakMap(), O = /* @__PURE__ */ new Map();
-function _(n) {
+const F = /* @__PURE__ */ new WeakMap(), H = /* @__PURE__ */ new Map();
+function $(n) {
   const t = n.querySelector("tbw-grid-responsive-card");
   if (t) {
-    const r = z.get(t);
+    const r = F.get(t);
     if (r) return r;
   }
   const e = n.id || n.getAttribute("data-grid-id");
   if (e)
-    return O.get(e);
+    return H.get(e);
 }
 function ye(n) {
   const { children: t, cardRowHeight: e = "auto" } = n, r = S(null), i = E(
     (o) => {
       if (r.current = o, !o) return;
-      z.set(o, t);
+      F.set(o, t);
       const c = o.closest("tbw-grid");
       if (c) {
         const d = c.id || c.getAttribute("data-grid-id");
-        d && O.set(d, t);
+        d && H.set(d, t);
       }
     },
     [t]
-  ), s = e === "auto" ? "auto" : String(e);
+  );
+  w(() => () => {
+    const o = r.current;
+    if (o) {
+      F.delete(o);
+      const c = o.closest("tbw-grid");
+      if (c) {
+        const d = c.id || c.getAttribute("data-grid-id");
+        d && H.delete(d);
+      }
+    }
+  }, []);
+  const s = e === "auto" ? "auto" : String(e);
   return /* @__PURE__ */ x("tbw-grid-responsive-card", { ref: i, cardRowHeight: s });
 }
-const I = K(null), he = ({ defaults: n, children: t }) => /* @__PURE__ */ x(I.Provider, { value: n, children: t });
+const T = K(null), he = ({ defaults: n, children: t }) => /* @__PURE__ */ x(T.Provider, { value: n, children: t });
 function we() {
-  return N(I);
+  return z(T);
 }
 function Re(n) {
-  return N(I)?.[n];
+  return z(T)?.[n];
 }
-const Y = I;
+const Y = T;
 function Z(n) {
   const t = /* @__PURE__ */ new WeakMap();
   return (e) => {
@@ -111,22 +135,25 @@ function te(n) {
     columns: t
   };
 }
-const j = /* @__PURE__ */ new WeakMap(), $ = /* @__PURE__ */ new Map();
+const W = /* @__PURE__ */ new WeakMap(), q = /* @__PURE__ */ new Map();
 function re(n) {
-  const t = j.get(n);
+  const t = W.get(n);
   if (t) return t;
   const e = n.id;
   if (e)
-    return $.get(e);
+    return q.get(e);
 }
 function ve(n) {
   const { id: t, title: e, icon: r, tooltip: i, order: s = 100, children: o } = n, c = S(null), d = E(
-    (l) => {
-      c.current = l, l && (j.set(l, o), t && $.set(t, o));
+    (u) => {
+      c.current = u, u && (W.set(u, o), t && q.set(t, o));
     },
     [o, t]
   );
-  return /* @__PURE__ */ x(
+  return w(() => () => {
+    const u = c.current;
+    u && (W.delete(u), t && q.delete(t));
+  }, [t]), /* @__PURE__ */ x(
     "tbw-grid-tool-panel",
     {
       ref: d,
@@ -222,12 +249,12 @@ class ce {
           return v(() => {
             d.root.render(e(i));
           }), d.container;
-        const l = document.createElement("div");
-        l.className = "react-cell-renderer", l.style.display = "contents";
-        const w = b(l);
+        const u = document.createElement("div");
+        u.className = "react-cell-renderer", u.style.display = "contents";
+        const h = b(u);
         return v(() => {
-          w.render(e(i));
-        }), r.set(s, { root: w, container: l, lastRowIndex: i.rowIndex ?? -1 }), this.mountedViews.push({ root: w, container: l }), l;
+          h.render(e(i));
+        }), r.set(s, { root: h, container: u, lastRowIndex: i.rowIndex ?? -1 }), this.mountedViews.push({ root: h, container: u }), u;
       }
       const o = document.createElement("div");
       o.className = "react-cell-renderer", o.style.display = "contents";
@@ -257,7 +284,7 @@ class ce {
    * Renders React components for expandable detail rows.
    */
   createDetailRenderer(t) {
-    const e = B(t);
+    const e = j(t);
     if (e)
       return (r, i) => {
         const s = document.createElement("div");
@@ -282,7 +309,7 @@ class ce {
    * Renders React components for card layout in responsive mode.
    */
   createResponsiveCardRenderer(t) {
-    const e = _(t);
+    const e = $(t);
     if (e)
       return (r, i) => {
         const s = document.createElement("div");
@@ -411,11 +438,11 @@ class ce {
     }
   }
 }
-let H = !1, M = null;
-function L() {
-  return H || (M = new ce(), J.registerAdapter(M), H = !0), M;
+let _ = !1, M = null;
+function B() {
+  return _ || (M = new ce(), J.registerAdapter(M), _ = !0), M;
 }
-L();
+B();
 function de(n, t) {
   const e = n, r = e.getPluginByName?.("masterDetail");
   if (r && typeof r.refreshDetailRenderer == "function") {
@@ -423,27 +450,27 @@ function de(n, t) {
     return;
   }
   const i = n.querySelector("tbw-grid-detail");
-  !i || !B(n) || import("@toolbox-web/grid/all").then(({ MasterDetailPlugin: o }) => {
+  !i || !j(n) || import("@toolbox-web/grid/all").then(({ MasterDetailPlugin: o }) => {
     const c = t.createDetailRenderer(n);
     if (!c) return;
     const d = i.getAttribute("animation");
-    let l = "slide";
-    d === "false" ? l = !1 : d === "fade" && (l = "fade");
-    const w = i.getAttribute("showExpandColumn") !== "false", u = new o({
+    let u = "slide";
+    d === "false" ? u = !1 : d === "fade" && (u = "fade");
+    const h = i.getAttribute("showExpandColumn") !== "false", l = new o({
       detailRenderer: c,
-      showExpandColumn: w,
-      animation: l
-    }), p = e.gridConfig || {}, A = p.plugins || [];
+      showExpandColumn: h,
+      animation: u
+    }), p = e.gridConfig || {}, D = p.plugins || [];
     e.gridConfig = {
       ...p,
-      plugins: [...A, u]
+      plugins: [...D, l]
     };
   }).catch(() => {
   });
 }
 function ae(n, t) {
   const e = n;
-  if (!n.querySelector("tbw-grid-responsive-card") || !_(n)) return;
+  if (!n.querySelector("tbw-grid-responsive-card") || !$(n)) return;
   const s = e.getPluginByName?.("responsive");
   if (s && typeof s.setCardRenderer == "function") {
     const o = t.createResponsiveCardRenderer(n);
@@ -468,40 +495,40 @@ const be = Q(function(t, e) {
     fitMode: o,
     editOn: c,
     customStyles: d,
-    className: l,
-    style: w,
-    children: u,
+    className: u,
+    style: h,
+    children: l,
     onRowsChange: p,
-    onCellEdit: A,
-    onRowClick: D,
+    onCellEdit: D,
+    onRowClick: A,
     onColumnStateChange: P,
-    onSortChange: T
-  } = t, f = S(null), V = S(null), y = N(Y), C = U(() => te(i), [i]);
-  return R(() => {
-    L().setTypeDefaults(y);
-  }, [y]), R(() => {
+    onSortChange: I
+  } = t, f = S(null), V = S(null), y = z(Y), C = U(() => te(i), [i]);
+  return w(() => {
+    B().setTypeDefaults(y);
+  }, [y]), w(() => {
     f.current && (f.current.rows = r);
-  }, [r]), R(() => {
+  }, [r]), w(() => {
     f.current && C && (f.current.gridConfig = C);
-  }, [C]), R(() => {
+  }, [C]), w(() => {
     f.current && s && (f.current.columns = s);
-  }, [s]), R(() => {
+  }, [s]), w(() => {
     f.current && o !== void 0 && (f.current.fitMode = o);
-  }, [o]), R(() => {
+  }, [o]), w(() => {
     f.current && c !== void 0 && (f.current.editOn = c);
-  }, [c]), R(() => {
+  }, [c]), w(() => {
     const a = f.current;
     if (!a) return;
-    const m = L();
+    const m = B();
     a.__frameworkAdapter = m, de(a, m), ae(a, m);
     let g = !1;
-    const h = requestAnimationFrame(() => {
+    const R = requestAnimationFrame(() => {
       g || (typeof a.refreshColumns == "function" && a.refreshColumns(), typeof a.refreshShellHeader == "function" && a.refreshShellHeader());
     });
     return () => {
-      g = !0, cancelAnimationFrame(h);
+      g = !0, cancelAnimationFrame(R);
     };
-  }, []), R(() => {
+  }, []), w(() => {
     if (!f.current || !d) return;
     const a = f.current, m = "react-custom-styles";
     let g = !0;
@@ -510,36 +537,36 @@ const be = Q(function(t, e) {
     }), () => {
       g = !1, V.current && (a.unregisterStyles?.(V.current), V.current = null);
     };
-  }, [d]), R(() => {
+  }, [d]), w(() => {
     const a = f.current;
     if (!a) return;
     const m = [];
     if (p) {
-      const g = ((h) => p(h.detail.rows));
+      const g = ((R) => p(R.detail.rows));
       a.addEventListener("rows-change", g), m.push(["rows-change", g]);
     }
-    if (A) {
-      const g = ((h) => A(h));
+    if (D) {
+      const g = ((R) => D(R));
       a.addEventListener("cell-edit", g), m.push(["cell-edit", g]);
     }
-    if (D) {
-      const g = ((h) => D(h));
+    if (A) {
+      const g = ((R) => A(R));
       a.addEventListener("row-click", g), m.push(["row-click", g]);
     }
     if (P) {
-      const g = ((h) => P(h));
+      const g = ((R) => P(R));
       a.addEventListener("column-state-change", g), m.push(["column-state-change", g]);
     }
-    if (T) {
-      const g = ((h) => T(h));
+    if (I) {
+      const g = ((R) => I(R));
       a.addEventListener("sort-change", g), m.push(["sort-change", g]);
     }
     return () => {
-      m.forEach(([g, h]) => {
-        a.removeEventListener(g, h);
+      m.forEach(([g, R]) => {
+        a.removeEventListener(g, R);
       });
     };
-  }, [p, A, D, P, T]), X(
+  }, [p, D, A, P, I]), X(
     e,
     () => ({
       get element() {
@@ -574,9 +601,9 @@ const be = Q(function(t, e) {
           C && (m.gridConfig = C), r && (m.rows = r), s && (m.columns = s);
         }
       },
-      class: l,
-      style: w,
-      children: u
+      class: u,
+      style: h,
+      children: l
     }
   );
 });
@@ -590,39 +617,39 @@ function Ee(n) {
     resizable: o,
     width: c,
     minWidth: d,
-    hidden: l,
-    lockVisible: w,
-    children: u,
+    hidden: u,
+    lockVisible: h,
+    children: l,
     editor: p,
-    options: A,
-    multi: D,
+    options: D,
+    multi: A,
     format: P
-  } = n, T = S(null), f = E(
+  } = n, I = S(null), f = E(
     (C) => {
-      T.current = C, C && (u && ne(C, u), p && ie(C, p));
+      I.current = C, C && (l && ne(C, l), p && ie(C, p));
     },
-    [u, p, t]
+    [l, p, t]
   ), V = typeof c == "number" ? `${c}px` : c, y = {
     field: t,
     ref: f
   };
-  return e !== void 0 && (y.header = e), r !== void 0 && (y.type = r), i !== void 0 && (y.editable = i), s !== void 0 && (y.sortable = s), o !== void 0 && (y.resizable = o), V !== void 0 && (y.width = V), d !== void 0 && (y["min-width"] = d), l !== void 0 && (y.hidden = l), w !== void 0 && (y["lock-visible"] = w), D !== void 0 && (y.multi = D), P && (y["data-has-format"] = "true"), A && (y["data-has-options"] = "true"), /* @__PURE__ */ x("tbw-grid-column", { ...y });
+  return e !== void 0 && (y.header = e), r !== void 0 && (y.type = r), i !== void 0 && (y.editable = i), s !== void 0 && (y.sortable = s), o !== void 0 && (y.resizable = o), V !== void 0 && (y.width = V), d !== void 0 && (y["min-width"] = d), u !== void 0 && (y.hidden = u), h !== void 0 && (y["lock-visible"] = h), A !== void 0 && (y.multi = A), P && (y["data-has-format"] = "true"), D && (y["data-has-options"] = "true"), /* @__PURE__ */ x("tbw-grid-column", { ...y });
 }
-function De({ children: n }) {
+function Ae({ children: n }) {
   return /* @__PURE__ */ x("tbw-grid-tool-buttons", { children: n });
 }
-function Ae() {
-  const n = S(null), [t, e] = F(!1), [r, i] = F(null);
-  R(() => {
-    const u = n.current;
-    if (!u) return;
+function De() {
+  const n = S(null), [t, e] = O(!1), [r, i] = O(null);
+  w(() => {
+    const l = n.current;
+    if (!l) return;
     let p = !0;
     return (async () => {
       try {
-        if (await u.ready?.(), p) {
+        if (await l.ready?.(), p) {
           e(!0);
-          const D = await u.getConfig?.();
-          p && D && i(D);
+          const A = await l.getConfig?.();
+          p && A && i(A);
         }
       } catch {
       }
@@ -631,36 +658,37 @@ function Ae() {
     };
   }, []);
   const s = E(async () => {
-    const u = n.current;
-    return u ? await u.getConfig?.() ?? null : null;
+    const l = n.current;
+    return l ? await l.getConfig?.() ?? null : null;
   }, []), o = E(async () => {
-    const u = n.current;
-    u && await u.forceLayout?.();
-  }, []), c = E(async (u) => {
+    const l = n.current;
+    l && await l.forceLayout?.();
+  }, []), c = E(async (l) => {
     const p = n.current;
-    p && await p.toggleGroup?.(u);
-  }, []), d = E((u, p) => {
-    n.current?.registerStyles?.(u, p);
-  }, []), l = E((u) => {
-    n.current?.unregisterStyles?.(u);
-  }, []), w = E(() => r?.columns ? r.columns.filter((u) => !u.hidden) : [], [r]);
+    p && await p.toggleGroup?.(l);
+  }, []), d = E((l, p) => {
+    n.current?.registerStyles?.(l, p);
+  }, []), u = E((l) => {
+    n.current?.unregisterStyles?.(l);
+  }, []), h = E(() => r?.columns ? r.columns.filter((l) => !l.hidden) : [], [r]);
   return {
     ref: n,
+    element: n.current?.element ?? null,
     isReady: t,
     config: r,
     getConfig: s,
     forceLayout: o,
     toggleGroup: c,
     registerStyles: d,
-    unregisterStyles: l,
-    getVisibleColumns: w
+    unregisterStyles: u,
+    getVisibleColumns: h
   };
 }
 function Se(n, t, e, r = []) {
   const i = S(e);
-  R(() => {
+  w(() => {
     i.current = e;
-  }, [e, ...r]), R(() => {
+  }, [e, ...r]), w(() => {
     const s = n.current, o = s && "element" in s ? s.element : s;
     if (!o) return;
     const c = ((d) => {
@@ -676,12 +704,12 @@ export {
   Ee as GridColumn,
   me as GridDetailPanel,
   ye as GridResponsiveCard,
-  De as GridToolButtons,
+  Ae as GridToolButtons,
   ve as GridToolPanel,
   he as GridTypeProvider,
   ce as ReactGridAdapter,
   Ce as getRegisteredFields,
-  Ae as useGrid,
+  De as useGrid,
   Se as useGridEvent,
   we as useGridTypeDefaults,
   Re as useTypeDefault

package/lib/data-grid.d.ts

@@ -65,8 +65,8 @@ export interface DataGridProps<TRow = unknown> {
  * Ref handle for the DataGrid component.
  */
 export interface DataGridRef<TRow = unknown> {
-    /** The underlying grid DOM element */
-    element: DataGridElement | null;
+    /** The underlying grid DOM element with proper typing */
+    element: DataGridElement<TRow> | null;
     /** Get the effective configuration */
     getConfig: () => Promise<Readonly<GridConfig<TRow>>>;
     /** Wait for the grid to be ready */

package/lib/data-grid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-grid.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/data-grid.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"data-grid.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/data-grid.tsx"],"names":[],"mappings":"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"}

package/lib/grid-detail-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grid-detail-panel.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/grid-detail-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAuB,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,aAAa,CAAC;AAErB;;GAEG;AACH,MAAM,WAAW,kBAAkB,CAAC,IAAI,GAAG,OAAO;IAChD,yCAAyC;IACzC,GAAG,EAAE,IAAI,CAAC;IACV,oBAAoB;IACpB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAUD;;;GAGG;AACH,wBAAgB,iBAAiB,CAC/B,WAAW,EAAE,WAAW,GACvB,CAAC,CAAC,GAAG,EAAE,kBAAkB,CAAC,OAAO,CAAC,KAAK,SAAS,CAAC,GAAG,SAAS,CAe/D;AAED;;GAEG;AACH,MAAM,WAAW,oBAAoB,CAAC,IAAI,GAAG,OAAO;IAClD;;;;;;;;;;OAUG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,SAAS,CAAC;IAEvD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,eAAe,CAAC,IAAI,GAAG,OAAO,EAAE,KAAK,EAAE,oBAAoB,CAAC,IAAI,CAAC,GAAG,YAAY,CAqC/F"}
+{"version":3,"file":"grid-detail-panel.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/grid-detail-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAkC,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,aAAa,CAAC;AAErB;;GAEG;AACH,MAAM,WAAW,kBAAkB,CAAC,IAAI,GAAG,OAAO;IAChD,yCAAyC;IACzC,GAAG,EAAE,IAAI,CAAC;IACV,oBAAoB;IACpB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAUD;;;GAGG;AACH,wBAAgB,iBAAiB,CAC/B,WAAW,EAAE,WAAW,GACvB,CAAC,CAAC,GAAG,EAAE,kBAAkB,CAAC,OAAO,CAAC,KAAK,SAAS,CAAC,GAAG,SAAS,CAe/D;AAED;;GAEG;AACH,MAAM,WAAW,oBAAoB,CAAC,IAAI,GAAG,OAAO;IAClD;;;;;;;;;;OAUG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,SAAS,CAAC;IAEvD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,eAAe,CAAC,IAAI,GAAG,OAAO,EAAE,KAAK,EAAE,oBAAoB,CAAC,IAAI,CAAC,GAAG,YAAY,CAqE/F"}

package/lib/grid-responsive-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grid-responsive-card.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/grid-responsive-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAuB,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,aAAa,CAAC;AAErB;;GAEG;AACH,MAAM,WAAW,qBAAqB,CAAC,IAAI,GAAG,OAAO;IACnD,iCAAiC;IACjC,GAAG,EAAE,IAAI,CAAC;IACV,iCAAiC;IACjC,KAAK,EAAE,MAAM,CAAC;CACf;AAUD;;;GAGG;AACH,wBAAgB,yBAAyB,CACvC,WAAW,EAAE,WAAW,GACvB,CAAC,CAAC,GAAG,EAAE,qBAAqB,CAAC,OAAO,CAAC,KAAK,SAAS,CAAC,GAAG,SAAS,CAelE;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB,CAAC,IAAI,GAAG,OAAO;IACrD;;;;;;;;;;;;;;;OAeG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,qBAAqB,CAAC,IAAI,CAAC,KAAK,SAAS,CAAC;IAE1D;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,GAAG,OAAO,EAAE,KAAK,EAAE,uBAAuB,CAAC,IAAI,CAAC,GAAG,YAAY,CA+BrG"}
+{"version":3,"file":"grid-responsive-card.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/grid-responsive-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAkC,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,aAAa,CAAC;AAErB;;GAEG;AACH,MAAM,WAAW,qBAAqB,CAAC,IAAI,GAAG,OAAO;IACnD,iCAAiC;IACjC,GAAG,EAAE,IAAI,CAAC;IACV,iCAAiC;IACjC,KAAK,EAAE,MAAM,CAAC;CACf;AAUD;;;GAGG;AACH,wBAAgB,yBAAyB,CACvC,WAAW,EAAE,WAAW,GACvB,CAAC,CAAC,GAAG,EAAE,qBAAqB,CAAC,OAAO,CAAC,KAAK,SAAS,CAAC,GAAG,SAAS,CAelE;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB,CAAC,IAAI,GAAG,OAAO;IACrD;;;;;;;;;;;;;;;OAeG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,qBAAqB,CAAC,IAAI,CAAC,KAAK,SAAS,CAAC;IAE1D;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,GAAG,OAAO,EAAE,KAAK,EAAE,uBAAuB,CAAC,IAAI,CAAC,GAAG,YAAY,CAmDrG"}

package/lib/grid-tool-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grid-tool-panel.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/grid-tool-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAuB,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,aAAa,CAAC;AAErB;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,oCAAoC;IACpC,IAAI,EAAE,WAAW,CAAC;CACnB;AAUD;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,YAAY,EAAE,WAAW,GAAG,CAAC,CAAC,GAAG,EAAE,gBAAgB,KAAK,SAAS,CAAC,GAAG,SAAS,CAYlH;AAED;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,WAAW,EAAE,WAAW,GAAG,WAAW,EAAE,CAO5E;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;;;;;OAUG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,gBAAgB,KAAK,SAAS,CAAC;CAChD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAiCrE"}
+{"version":3,"file":"grid-tool-panel.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/grid-tool-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAkC,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,aAAa,CAAC;AAErB;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,oCAAoC;IACpC,IAAI,EAAE,WAAW,CAAC;CACnB;AAUD;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,YAAY,EAAE,WAAW,GAAG,CAAC,CAAC,GAAG,EAAE,gBAAgB,KAAK,SAAS,CAAC,GAAG,SAAS,CAYlH;AAED;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,WAAW,EAAE,WAAW,GAAG,WAAW,EAAE,CAO5E;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;;;;;OAUG;IACH,QAAQ,EAAE,CAAC,GAAG,EAAE,gBAAgB,KAAK,SAAS,CAAC;CAChD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAiDrE"}

package/lib/use-grid.d.ts

@@ -1,16 +1,13 @@
 import { ColumnConfig, DataGridElement, GridConfig } from '../../../../dist/libs/grid/index.d.ts';
-/**
- * Extended interface for DataGridElement with all methods we need.
- */
-interface ExtendedGridElement extends DataGridElement {
-    toggleGroup?: (key: string) => Promise<void>;
-}
+import { DataGridRef } from './data-grid';
 /**
  * Return type for useGrid hook.
  */
 export interface UseGridReturn<TRow = unknown> {
-    /** Ref to attach to the DataGrid component */
-    ref: React.RefObject<ExtendedGridElement | null>;
+    /** Ref to attach to the DataGrid component (returns DataGridRef handle) */
+    ref: React.RefObject<DataGridRef<TRow> | null>;
+    /** Direct access to the typed grid element (convenience for ref.current?.element) */
+    element: DataGridElement<TRow> | null;
     /** Whether the grid is ready */
     isReady: boolean;
     /** Current grid configuration */
@@ -59,5 +56,4 @@ export interface UseGridReturn<TRow = unknown> {
  * ```
  */
 export declare function useGrid<TRow = unknown>(): UseGridReturn<TRow>;
-export {};
 //# sourceMappingURL=use-grid.d.ts.map

package/lib/use-grid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-grid.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/use-grid.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGnF;;GAEG;AACH,UAAU,mBAAoB,SAAQ,eAAe;IACnD,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9C;AAED;;GAEG;AACH,MAAM,WAAW,aAAa,CAAC,IAAI,GAAG,OAAO;IAC3C,8CAA8C;IAC9C,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACjD,gCAAgC;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,iCAAiC;IACjC,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAChC,sCAAsC;IACtC,SAAS,EAAE,MAAM,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC;IAClD,mCAAmC;IACnC,WAAW,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACjC,yBAAyB;IACzB,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C,6BAA6B;IAC7B,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,+BAA+B;IAC/B,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,kCAAkC;IAClC,iBAAiB,EAAE,MAAM,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;CAC/C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,OAAO,CAAC,IAAI,GAAG,OAAO,KAAK,aAAa,CAAC,IAAI,CAAC,CA6E7D"}
+{"version":3,"file":"use-grid.d.ts","sourceRoot":"","sources":["../../../../libs/grid-react/src/lib/use-grid.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C;;GAEG;AACH,MAAM,WAAW,aAAa,CAAC,IAAI,GAAG,OAAO;IAC3C,2EAA2E;IAC3E,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC;IAC/C,qFAAqF;IACrF,OAAO,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IACtC,gCAAgC;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,iCAAiC;IACjC,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAChC,sCAAsC;IACtC,SAAS,EAAE,MAAM,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC;IAClD,mCAAmC;IACnC,WAAW,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACjC,yBAAyB;IACzB,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C,6BAA6B;IAC7B,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,+BAA+B;IAC/B,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,kCAAkC;IAClC,iBAAiB,EAAE,MAAM,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;CAC/C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,OAAO,CAAC,IAAI,GAAG,OAAO,KAAK,aAAa,CAAC,IAAI,CAAC,CA8E7D"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toolbox-web/grid-react",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "React adapter for @toolbox-web/grid data grid component",
   "type": "module",
   "main": "./index.js",