@toolbox-web/grid 1.11.0 → 1.12.1

package/lib/plugins/grouping-rows/GroupingRowsPlugin.d.ts

@@ -120,6 +120,20 @@ export declare class GroupingRowsPlugin extends BaseGridPlugin<GroupingRowsConfi
     private get animationStyle();
     /** @internal */
     detach(): void;
+    /**
+     * Provide row height for group header rows.
+     *
+     * If `groupRowHeight` is configured, returns that value for group rows.
+     * This allows the variable row height system to use known heights for
+     * group headers without needing to measure them from the DOM.
+     *
+     * @param row - The row object (may be a group row)
+     * @param _index - Index in the processed rows array (unused)
+     * @returns Height in pixels for group rows, undefined for data rows
+     *
+     * @internal Plugin hook for variable row height support
+     */
+    getRowHeight(row: unknown, _index: number): number | undefined;
     /**
      * Handle plugin queries.
      * @internal

package/lib/plugins/grouping-rows/GroupingRowsPlugin.d.ts.map

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

package/lib/plugins/grouping-rows/index.js

@@ -384,15 +384,15 @@ function A(n) {
 const y = {
   sum: (n, e) => n.reduce((t, r) => t + (Number(r[e]) || 0), 0),
   avg: (n, e) => {
-    const t = n.reduce((r, s) => r + (Number(s[e]) || 0), 0);
+    const t = n.reduce((r, i) => r + (Number(i[e]) || 0), 0);
     return n.length ? t / n.length : 0;
   },
   count: (n) => n.length,
-  min: (n, e) => Math.min(...n.map((t) => Number(t[e]) || 1 / 0)),
-  max: (n, e) => Math.max(...n.map((t) => Number(t[e]) || -1 / 0)),
+  min: (n, e) => n.length ? Math.min(...n.map((t) => Number(t[e]) || 1 / 0)) : 0,
+  max: (n, e) => n.length ? Math.max(...n.map((t) => Number(t[e]) || -1 / 0)) : 0,
   first: (n, e) => n[0]?.[e],
   last: (n, e) => n[n.length - 1]?.[e]
-}, b = /* @__PURE__ */ new Map(), m = {
+}, b = /* @__PURE__ */ new Map(), w = {
   /**
    * Register a custom aggregator function.
    */
@@ -416,8 +416,8 @@ const y = {
    * Run an aggregator on a set of rows.
    */
   run(n, e, t, r) {
-    const s = this.get(n);
-    return s ? s(e, t, r) : void 0;
+    const i = this.get(n);
+    return i ? i(e, t, r) : void 0;
   },
   /**
    * Check if an aggregator exists.
@@ -432,43 +432,43 @@ const y = {
     return [...Object.keys(y), ...b.keys()];
   }
 };
-m.register.bind(m);
-m.unregister.bind(m);
-m.get.bind(m);
-const _ = m.run.bind(m);
-m.list.bind(m);
+w.register.bind(w);
+w.unregister.bind(w);
+w.get.bind(w);
+const _ = w.run.bind(w);
+w.list.bind(w);
 function v({ rows: n, config: e, expanded: t, initialExpanded: r }) {
-  const s = e.groupOn;
-  if (typeof s != "function")
+  const i = e.groupOn;
+  if (typeof i != "function")
     return [];
   const o = { key: "__root__", value: null, depth: -1, rows: [], children: /* @__PURE__ */ new Map() };
   if (n.forEach((d) => {
-    let u = s(d);
+    let u = i(d);
     u == null || u === !1 ? u = ["__ungrouped__"] : Array.isArray(u) || (u = [u]);
     let a = o;
-    u.forEach((w, p) => {
-      const c = w == null ? "∅" : String(w), h = a.key === "__root__" ? c : a.key + "||" + c;
+    u.forEach((m, p) => {
+      const c = m == null ? "∅" : String(m), h = a.key === "__root__" ? c : a.key + "||" + c;
       let f = a.children.get(c);
-      f || (f = { key: h, value: w, depth: p, rows: [], children: /* @__PURE__ */ new Map(), parent: a }, a.children.set(c, f)), a = f;
+      f || (f = { key: h, value: m, depth: p, rows: [], children: /* @__PURE__ */ new Map(), parent: a }, a.children.set(c, f)), a = f;
     }), a.rows.push(d);
   }), o.children.size === 1 && o.children.has("__ungrouped__") && o.children.get("__ungrouped__").rows.length === n.length)
     return [];
-  const g = /* @__PURE__ */ new Set([...t, ...r ?? []]), i = [], l = (d) => {
+  const g = /* @__PURE__ */ new Set([...t, ...r ?? []]), s = [], l = (d) => {
     if (d === o) {
       d.children.forEach((a) => l(a));
       return;
     }
     const u = g.has(d.key);
-    i.push({
+    s.push({
       kind: "group",
       key: d.key,
       value: d.value,
       depth: d.depth,
       rows: d.rows,
       expanded: u
-    }), u && (d.children.size ? d.children.forEach((a) => l(a)) : d.rows.forEach((a) => i.push({ kind: "data", row: a, rowIndex: n.indexOf(a) })));
+    }), u && (d.children.size ? d.children.forEach((a) => l(a)) : d.rows.forEach((a) => s.push({ kind: "data", row: a, rowIndex: n.indexOf(a) })));
   };
-  return l(o), i;
+  return l(o), s;
 }
 function K(n, e) {
   const t = new Set(n);
@@ -570,6 +570,23 @@ class D extends C {
   detach() {
     this.expandedKeys.clear(), this.flattenedRows = [], this.isActive = !1, this.previousVisibleKeys.clear(), this.keysToAnimate.clear(), this.hasAppliedDefaultExpanded = !1;
   }
+  /**
+   * Provide row height for group header rows.
+   *
+   * If `groupRowHeight` is configured, returns that value for group rows.
+   * This allows the variable row height system to use known heights for
+   * group headers without needing to measure them from the DOM.
+   *
+   * @param row - The row object (may be a group row)
+   * @param _index - Index in the processed rows array (unused)
+   * @returns Height in pixels for group rows, undefined for data rows
+   *
+   * @internal Plugin hook for variable row height support
+   */
+  getRowHeight(e, t) {
+    if (this.config.groupRowHeight != null && e.__isGroupRow === !0)
+      return this.config.groupRowHeight;
+  }
   /**
    * Handle plugin queries.
    * @internal
@@ -600,33 +617,35 @@ class D extends C {
     });
     if (r.length === 0)
       return this.isActive = !1, this.flattenedRows = [], [...e];
-    let s;
+    let i;
     if (!this.hasAppliedDefaultExpanded && this.expandedKeys.size === 0 && t.defaultExpanded !== !1) {
-      const i = T(r);
-      s = G(t.defaultExpanded ?? !1, i), s.size > 0 && (this.expandedKeys = new Set(s), this.hasAppliedDefaultExpanded = !0);
+      const s = T(r);
+      i = G(t.defaultExpanded ?? !1, s), i.size > 0 && (this.expandedKeys = new Set(i), this.hasAppliedDefaultExpanded = !0);
     }
     const o = v({
       rows: [...e],
       config: t,
       expanded: this.expandedKeys,
-      initialExpanded: s
+      initialExpanded: i
     });
     this.isActive = !0, this.flattenedRows = o, this.keysToAnimate.clear();
     const g = /* @__PURE__ */ new Set();
-    return o.forEach((i, l) => {
-      if (i.kind === "data") {
+    return o.forEach((s, l) => {
+      if (s.kind === "data") {
         const d = `data-${l}`;
         g.add(d), this.previousVisibleKeys.has(d) || this.keysToAnimate.add(d);
       }
-    }), this.previousVisibleKeys = g, o.map((i) => i.kind === "group" ? {
+    }), this.previousVisibleKeys = g, o.map((s) => s.kind === "group" ? {
       __isGroupRow: !0,
-      __groupKey: i.key,
-      __groupValue: i.value,
-      __groupDepth: i.depth,
-      __groupRows: i.rows,
-      __groupExpanded: i.expanded,
-      __groupRowCount: I(i)
-    } : i.row);
+      __groupKey: s.key,
+      __groupValue: s.value,
+      __groupDepth: s.depth,
+      __groupRows: s.rows,
+      __groupExpanded: s.expanded,
+      __groupRowCount: I(s),
+      // Cache key for variable row height support - survives expand/collapse
+      __rowCacheKey: `group:${s.key}`
+    } : s.row);
   }
   /** @internal */
   onCellClick(e) {
@@ -648,17 +667,17 @@ class D extends C {
   renderRow(e, t, r) {
     if (!e?.__isGroupRow)
       return !1;
-    const s = this.config;
-    if (s.groupRowRenderer) {
-      const i = () => {
+    const i = this.config;
+    if (i.groupRowRenderer) {
+      const s = () => {
         this.toggle(e.__groupKey);
-      }, l = s.groupRowRenderer({
+      }, l = i.groupRowRenderer({
         key: e.__groupKey,
         value: e.__groupValue,
         depth: e.__groupDepth,
         rows: e.__groupRows,
         expanded: e.__groupExpanded,
-        toggleExpand: i
+        toggleExpand: s
       });
       if (l)
         return t.className = "data-grid-row group-row", t.__isCustomRow = !0, t.setAttribute("data-group-depth", String(e.__groupDepth)), typeof l == "string" ? t.innerHTML = l : (t.innerHTML = "", t.appendChild(l)), !0;
@@ -666,7 +685,7 @@ class D extends C {
     const o = () => {
       this.toggle(e.__groupKey);
     };
-    return t.className = "data-grid-row group-row", t.__isCustomRow = !0, t.setAttribute("data-group-depth", String(e.__groupDepth)), t.setAttribute("role", "row"), t.setAttribute("aria-expanded", String(e.__groupExpanded)), t.style.setProperty("--tbw-group-depth", String(e.__groupDepth || 0)), s.indentWidth !== void 0 && t.style.setProperty("--tbw-group-indent-width", `${s.indentWidth}px`), t.style.height = "", t.innerHTML = "", s.fullWidth !== !1 ? this.renderFullWidthGroupRow(e, t, o) : this.renderPerColumnGroupRow(e, t, o), !0;
+    return t.className = "data-grid-row group-row", t.__isCustomRow = !0, t.setAttribute("data-group-depth", String(e.__groupDepth)), t.setAttribute("role", "row"), t.setAttribute("aria-expanded", String(e.__groupExpanded)), t.style.setProperty("--tbw-group-depth", String(e.__groupDepth || 0)), i.indentWidth !== void 0 && t.style.setProperty("--tbw-group-indent-width", `${i.indentWidth}px`), t.style.height = "", t.innerHTML = "", i.fullWidth !== !1 ? this.renderFullWidthGroupRow(e, t, o) : this.renderPerColumnGroupRow(e, t, o), !0;
   }
   /** @internal */
   afterRender() {
@@ -675,9 +694,9 @@ class D extends C {
     const t = this.gridElement?.querySelector(".rows");
     if (!t) return;
     const r = e === "fade" ? "tbw-group-fade-in" : "tbw-group-slide-in";
-    for (const s of t.querySelectorAll(".data-grid-row:not(.group-row)")) {
-      const o = s.querySelector(".cell[data-row]"), g = o ? parseInt(o.getAttribute("data-row") ?? "-1", 10) : -1, l = this.flattenedRows[g]?.kind === "data" ? `data-${g}` : void 0;
-      l && this.keysToAnimate.has(l) && (s.classList.add(r), s.addEventListener("animationend", () => s.classList.remove(r), { once: !0 }));
+    for (const i of t.querySelectorAll(".data-grid-row:not(.group-row)")) {
+      const o = i.querySelector(".cell[data-row]"), g = o ? parseInt(o.getAttribute("data-row") ?? "-1", 10) : -1, l = this.flattenedRows[g]?.kind === "data" ? `data-${g}` : void 0;
+      l && this.keysToAnimate.has(l) && (i.classList.add(r), i.addEventListener("animationend", () => i.classList.remove(r), { once: !0 }));
     }
     this.keysToAnimate.clear();
   }
@@ -688,31 +707,31 @@ class D extends C {
    */
   createToggleButton(e, t) {
     const r = document.createElement("button");
-    return r.type = "button", r.className = `group-toggle${e ? " expanded" : ""}`, r.setAttribute("aria-label", e ? "Collapse group" : "Expand group"), this.setIcon(r, this.resolveIcon(e ? "collapse" : "expand")), r.addEventListener("click", (s) => {
-      s.stopPropagation(), t();
+    return r.type = "button", r.className = `group-toggle${e ? " expanded" : ""}`, r.setAttribute("aria-label", e ? "Collapse group" : "Expand group"), this.setIcon(r, this.resolveIcon(e ? "collapse" : "expand")), r.addEventListener("click", (i) => {
+      i.stopPropagation(), t();
     }), r;
   }
   /**
    * Get the formatted label text for a group.
    */
   getGroupLabelText(e, t, r) {
-    const s = this.config;
-    return s.formatLabel ? s.formatLabel(e, t, r) : String(e);
+    const i = this.config;
+    return i.formatLabel ? i.formatLabel(e, t, r) : String(e);
   }
   renderFullWidthGroupRow(e, t, r) {
-    const s = this.config, o = s.aggregators ?? {}, g = e.__groupRows ?? [], i = document.createElement("div");
-    i.className = "cell group-full", i.style.gridColumn = "1 / -1", i.setAttribute("role", "gridcell"), i.setAttribute("data-col", "0"), i.appendChild(this.createToggleButton(e.__groupExpanded, r));
+    const i = this.config, o = i.aggregators ?? {}, g = e.__groupRows ?? [], s = document.createElement("div");
+    s.className = "cell group-full", s.style.gridColumn = "1 / -1", s.setAttribute("role", "gridcell"), s.setAttribute("data-col", "0"), s.appendChild(this.createToggleButton(e.__groupExpanded, r));
     const l = document.createElement("span");
-    if (l.className = "group-label", l.textContent = this.getGroupLabelText(e.__groupValue, e.__groupDepth || 0, e.__groupKey), i.appendChild(l), s.showRowCount !== !1) {
+    if (l.className = "group-label", l.textContent = this.getGroupLabelText(e.__groupValue, e.__groupDepth || 0, e.__groupKey), s.appendChild(l), i.showRowCount !== !1) {
       const u = document.createElement("span");
-      u.className = "group-count", u.textContent = `(${e.__groupRowCount ?? e.__groupRows?.length ?? 0})`, i.appendChild(u);
+      u.className = "group-count", u.textContent = `(${e.__groupRowCount ?? e.__groupRows?.length ?? 0})`, s.appendChild(u);
     }
     const d = Object.entries(o);
     if (d.length > 0) {
       const u = document.createElement("span");
       u.className = "group-aggregates";
-      for (const [a, w] of d) {
-        const p = this.columns.find((h) => h.field === a), c = _(w, g, a, p);
+      for (const [a, m] of d) {
+        const p = this.columns.find((h) => h.field === a), c = _(m, g, a, p);
         if (c != null) {
           const h = document.createElement("span");
           h.className = "group-aggregate", h.setAttribute("data-field", a);
@@ -720,24 +739,24 @@ class D extends C {
           h.textContent = `${f}: ${c}`, u.appendChild(h);
         }
       }
-      u.children.length > 0 && i.appendChild(u);
+      u.children.length > 0 && s.appendChild(u);
     }
-    t.appendChild(i);
+    t.appendChild(s);
   }
   renderPerColumnGroupRow(e, t, r) {
-    const s = this.config, o = s.aggregators ?? {}, g = this.columns, i = e.__groupRows ?? [], d = this.gridElement?.querySelector(".body")?.style.gridTemplateColumns || "";
+    const i = this.config, o = i.aggregators ?? {}, g = this.columns, s = e.__groupRows ?? [], d = this.gridElement?.querySelector(".body")?.style.gridTemplateColumns || "";
     d && (t.style.display = "grid", t.style.gridTemplateColumns = d);
     let u = !1;
-    g.forEach((a, w) => {
+    g.forEach((a, m) => {
       const p = document.createElement("div");
-      if (p.className = "cell group-cell", p.setAttribute("data-col", String(w)), p.setAttribute("role", "gridcell"), A(a)) {
+      if (p.className = "cell group-cell", p.setAttribute("data-col", String(m)), p.setAttribute("role", "gridcell"), A(a)) {
         p.setAttribute("data-field", a.field), t.appendChild(p);
         return;
       }
       if (u) {
         const c = o[a.field];
         if (c) {
-          const h = _(c, i, a.field, a);
+          const h = _(c, s, a.field, a);
           p.textContent = h != null ? String(h) : "";
         } else
           p.textContent = "";
@@ -745,13 +764,13 @@ class D extends C {
         u = !0, p.appendChild(this.createToggleButton(e.__groupExpanded, r));
         const c = document.createElement("span"), h = o[a.field];
         if (h) {
-          const f = _(h, i, a.field, a);
+          const f = _(h, s, a.field, a);
           c.textContent = f != null ? String(f) : String(e.__groupValue);
         } else
           c.textContent = this.getGroupLabelText(e.__groupValue, e.__groupDepth || 0, e.__groupKey);
-        if (p.appendChild(c), s.showRowCount !== !1) {
+        if (p.appendChild(c), i.showRowCount !== !1) {
           const f = document.createElement("span");
-          f.className = "group-count", f.textContent = ` (${i.length})`, p.appendChild(f);
+          f.className = "group-count", f.textContent = ` (${s.length})`, p.appendChild(f);
         }
       }
       t.appendChild(p);
@@ -777,15 +796,15 @@ class D extends C {
    * @param key - The group key to toggle
    */
   toggle(e) {
-    const t = !this.expandedKeys.has(e), r = this.config, s = this.flattenedRows.find((o) => o.kind === "group" && o.key === e);
-    if (r.accordion && t && s) {
+    const t = !this.expandedKeys.has(e), r = this.config, i = this.flattenedRows.find((o) => o.kind === "group" && o.key === e);
+    if (r.accordion && t && i) {
       const o = /* @__PURE__ */ new Set();
       for (const g of this.expandedKeys)
         if (e.startsWith(g + "||") || g.startsWith(e + "||"))
           e.startsWith(g + "||") && o.add(g);
         else {
-          const i = this.flattenedRows.find((l) => l.kind === "group" && l.key === g);
-          i && i.depth !== s.depth && o.add(g);
+          const s = this.flattenedRows.find((l) => l.kind === "group" && l.key === g);
+          s && s.depth !== i.depth && o.add(g);
         }
       o.add(e), this.expandedKeys = o;
     } else
@@ -793,8 +812,8 @@ class D extends C {
     this.emit("group-toggle", {
       key: e,
       expanded: this.expandedKeys.has(e),
-      value: s?.value,
-      depth: s?.depth ?? 0
+      value: i?.value,
+      depth: i?.depth ?? 0
     }), this.emitPluginEvent("grouping-state-change", {
       expandedKeys: [...this.expandedKeys]
     }), this.requestRender();