@toolbox-web/grid 0.5.0 → 0.6.0

package/README.md

@@ -27,7 +27,7 @@ document.body.appendChild(grid);
 ```
 
 > [!TIP]
-> For complete examples, see the [Storybook documentation](https://oysteinamundsen.github.io/toolbox/).
+> For complete examples, see the [Storybook documentation](https://toolboxjs.com/).
 
 ---
 

package/all.js

@@ -1,5 +1,5 @@
 import { BaseGridPlugin as x, DEFAULT_GRID_ICONS as $e, runAggregator as ae, e as je, s as Ue, PLUGIN_QUERIES as He, getAggregator as de, getValueAggregator as Ye, a as Xe, c as ce, g as Ze } from "./index.js";
-import { DEFAULT_ANIMATION_CONFIG as oi, DGEvents as si, DataGridElement as li, FitModeEnum as ai, GridCSSVars as di, GridClasses as ci, GridDataAttrs as ui, DataGridElement as hi, GridSelectors as fi, PluginEvents as gi, PluginManager as pi, RenderPhase as mi, builtInSort as wi, defaultComparator as bi } from "./index.js";
+import { DEFAULT_ANIMATION_CONFIG as oi, DGEvents as si, DataGridElement as li, FitModeEnum as ai, GridCSSVars as di, GridClasses as ci, GridDataAttrs as ui, DataGridElement as hi, GridSelectors as fi, PluginEvents as gi, PluginManager as pi, RenderPhase as mi, builtInSort as wi, createGrid as bi, defaultComparator as vi, queryGrid as yi } from "./index.js";
 const ze = "__tbw_expander", Je = 32;
 function ne(s) {
   return s.field === ze;
@@ -710,7 +710,7 @@ const j = 'input,select,textarea,[contenteditable="true"],[contenteditable=""],[
 function P(s) {
   return !(typeof s != "string" || s === "__proto__" || s === "constructor" || s === "prototype");
 }
-function On(s) {
+function Gn(s) {
   return (s.__editingCellCount ?? 0) > 0;
 }
 function dt(s) {
@@ -729,7 +729,7 @@ function ut(s, e, t) {
     t(K(n, e));
   }), n instanceof HTMLInputElement && n.type === "checkbox" ? n.addEventListener("change", () => t(n.checked)) : n instanceof HTMLSelectElement && n.addEventListener("change", () => t(K(n, e))));
 }
-class Gn extends x {
+class On extends x {
   name = "editing";
   styles = lt;
   get defaultConfig() {
@@ -2427,7 +2427,7 @@ function Kt(s, e, t, n) {
   return typeof o == "string" ? r.innerHTML = o : o instanceof HTMLElement && r.appendChild(o), i.appendChild(r), i;
 }
 const qt = "@layer tbw-plugins{tbw-grid{.cell[data-field=__tbw_expander]{border-right:none!important;padding:0;display:flex;align-items:center;justify-content:center}.header-row .cell[data-field=__tbw_expander]{display:none}.header-row .cell[data-field=__tbw_expander]+.cell{grid-column:1 / 3}.master-detail-expander{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.master-detail-toggle{cursor:pointer;opacity:.7;user-select:none;display:inline-flex;align-items:center;justify-content:center}.master-detail-toggle:hover{opacity:1}.master-detail-row{grid-column:1 / -1;display:grid;background:var(--tbw-master-detail-bg, var(--tbw-color-row-alt));border-bottom:1px solid var(--tbw-master-detail-border, var(--tbw-color-border));overflow:hidden}.master-detail-cell{padding:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem));overflow:auto}.master-detail-row.tbw-expanding{animation:tbw-detail-expand var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}.master-detail-row.tbw-collapsing{animation:tbw-detail-collapse var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}}@keyframes tbw-detail-expand{0%{opacity:0;max-height:0;padding-top:0;padding-bottom:0}to{opacity:1;max-height:var(--tbw-detail-max-height, 31.25rem);padding-top:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem));padding-bottom:var(--tbw-detail-padding, var(--tbw-spacing-xl, 1rem))}}@keyframes tbw-detail-collapse{0%{opacity:1;max-height:var(--tbw-detail-max-height, 31.25rem)}to{opacity:0;max-height:0}}}";
-class Oe extends x {
+class Ge extends x {
   name = "masterDetail";
   styles = qt;
   get defaultConfig() {
@@ -2537,7 +2537,7 @@ class Oe extends x {
    */
   getDetailHeight(e) {
     const t = this.detailElements.get(e);
-    return t ? t.offsetHeight : typeof this.config?.detailHeight == "number" ? this.config.detailHeight : Oe.DEFAULT_DETAIL_HEIGHT;
+    return t ? t.offsetHeight : typeof this.config?.detailHeight == "number" ? this.config.detailHeight : Ge.DEFAULT_DETAIL_HEIGHT;
   }
   /**
    * Toggle a row's detail and emit event.
@@ -2778,10 +2778,10 @@ function xe(s, e) {
 function Re(s, e) {
   return s.find((t) => t.field === e)?.direction;
 }
-const Ot = '@layer tbw-plugins{.header-cell[data-sort=asc]:after{content:"↑";margin-left:4px;opacity:.8}.header-cell[data-sort=desc]:after{content:"↓";margin-left:4px;opacity:.8}.sort-indicator{margin-left:4px;opacity:.8}.sort-index{font-size:10px;background:var(--tbw-multi-sort-badge-bg, var(--tbw-color-panel-bg));color:var(--tbw-multi-sort-badge-color, var(--tbw-color-fg));border-radius:50%;width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;margin-left:2px;font-weight:600}}';
+const Gt = '@layer tbw-plugins{.header-cell[data-sort=asc]:after{content:"↑";margin-left:4px;opacity:.8}.header-cell[data-sort=desc]:after{content:"↓";margin-left:4px;opacity:.8}.sort-indicator{margin-left:4px;opacity:.8}.sort-index{font-size:10px;background:var(--tbw-multi-sort-badge-bg, var(--tbw-color-panel-bg));color:var(--tbw-multi-sort-badge-color, var(--tbw-color-fg));border-radius:50%;width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;margin-left:2px;font-weight:600}}';
 class $n extends x {
   name = "multiSort";
-  styles = Ot;
+  styles = Gt;
   get defaultConfig() {
     return {
       maxSortColumns: 3,
@@ -2895,7 +2895,7 @@ class $n extends x {
   }
   // #endregion
 }
-function Gt(s) {
+function Ot(s) {
   return s.filter((e) => e.sticky === "left");
 }
 function Bt(s) {
@@ -3003,7 +3003,7 @@ class jn extends x {
    */
   getLeftPinnedColumns() {
     const e = [...this.columns];
-    return Gt(e);
+    return Ot(e);
   }
   /**
    * Get columns pinned to the right.
@@ -3281,7 +3281,7 @@ function oe(s, e) {
   return [...s, e].join("|");
 }
 function Yt(s, e) {
-  const t = e.rowGroupFields ?? [], n = e.columnGroupFields ?? [], i = e.valueFields ?? [], r = Xt(s, n), o = Ge(
+  const t = e.rowGroupFields ?? [], n = e.columnGroupFields ?? [], i = e.valueFields ?? [], r = Xt(s, n), o = Oe(
     s,
     t,
     n,
@@ -3316,7 +3316,7 @@ function Zt(s, e) {
   }
   return t;
 }
-function Ge(s, e, t, n, i, r, o) {
+function Oe(s, e, t, n, i, r, o) {
   const l = [];
   if (e.length === 0) {
     const h = Le(s, t, n, i), f = Te(h);
@@ -3334,7 +3334,7 @@ function Ge(s, e, t, n, i, r, o) {
   for (const [h, f] of u) {
     const g = o ? `${o}|${h}` : h, p = Le(f, t, n, i), w = Te(p);
     let m;
-    c && (m = Ge(
+    c && (m = Oe(
       f,
       d,
       t,
@@ -4295,7 +4295,7 @@ function Jn(s, e) {
     e.has(i) || n.push(i);
   return { added: t, removed: n };
 }
-function G(s) {
+function O(s) {
   return {
     startRow: Math.min(s.startRow, s.endRow),
     startCol: Math.min(s.startCol, s.endCol),
@@ -4304,7 +4304,7 @@ function G(s) {
   };
 }
 function pn(s) {
-  const e = G(s);
+  const e = O(s);
   return {
     from: { row: e.startRow, col: e.startCol },
     to: { row: e.endRow, col: e.endCol }
@@ -4314,14 +4314,14 @@ function Be(s) {
   return s.map(pn);
 }
 function mn(s, e, t) {
-  const n = G(t);
+  const n = O(t);
   return s >= n.startRow && s <= n.endRow && e >= n.startCol && e <= n.endCol;
 }
 function Me(s, e, t) {
   return t.some((n) => mn(s, e, n));
 }
 function wn(s) {
-  const e = [], t = G(s);
+  const e = [], t = O(s);
   for (let n = t.startRow; n <= t.endRow; n++)
     for (let i = t.startCol; i <= t.endCol; i++)
       e.push({ row: n, col: i });
@@ -4506,7 +4506,7 @@ class Qn extends x {
       l >= 0 && this.selected.has(l) && r.classList.add("selected", "row-focus");
     })), t === "range" && this.ranges.length > 0) {
       ce(e);
-      const r = this.activeRange ? G(this.activeRange) : null, o = this.columns.findIndex((a) => !_(a));
+      const r = this.activeRange ? O(this.activeRange) : null, o = this.columns.findIndex((a) => !_(a));
       this.columns.length - 1, e.querySelectorAll(".cell[data-row][data-col]").forEach((a) => {
         const d = parseInt(a.getAttribute("data-row") ?? "-1", 10), c = parseInt(a.getAttribute("data-col") ?? "-1", 10);
         if (d >= 0 && c >= 0) {
@@ -4639,7 +4639,7 @@ class Qn extends x {
   }
   // #endregion
 }
-function O(s, e) {
+function G(s, e) {
   return Math.floor(s / e);
 }
 function Cn(s, e) {
@@ -4649,7 +4649,7 @@ function Cn(s, e) {
   };
 }
 function xn(s, e, t) {
-  const n = O(s, t), i = O(e - 1, t), r = [];
+  const n = G(s, t), i = G(e - 1, t), r = [];
   for (let o = n; o <= i; o++)
     r.push(o);
   return r;
@@ -4664,7 +4664,7 @@ async function Pe(s, e, t, n) {
   });
 }
 function Rn(s, e, t) {
-  const n = O(s, e), i = t.get(n);
+  const n = G(s, e), i = t.get(n);
   if (!i) return;
   const r = s % e;
   return i[r];
@@ -4762,7 +4762,7 @@ class ei extends x {
    * @param rowIndex - Row index to check
    */
   isRowLoaded(e) {
-    const t = this.config.cacheBlockSize ?? 100, n = O(e, t);
+    const t = this.config.cacheBlockSize ?? 100, n = G(e, t);
     return this.loadedBlocks.has(n);
   }
   /**
@@ -5504,7 +5504,7 @@ export {
   $e as DEFAULT_GRID_ICONS,
   si as DGEvents,
   li as DataGridElement,
-  Gn as EditingPlugin,
+  On as EditingPlugin,
   Bn as ExportPlugin,
   j as FOCUSABLE_EDITOR_SELECTOR,
   S as FilteringPlugin,
@@ -5516,7 +5516,7 @@ export {
   fi as GridSelectors,
   Vn as GroupingColumnsPlugin,
   Wn as GroupingRowsPlugin,
-  Oe as MasterDetailPlugin,
+  Ge as MasterDetailPlugin,
   $n as MultiSortPlugin,
   He as PLUGIN_QUERIES,
   jn as PinnedColumnsPlugin,
@@ -5535,14 +5535,16 @@ export {
   ct as clearEditingState,
   Jn as computeSelectionDiff,
   Ln as countNodes,
-  bi as defaultComparator,
+  bi as createGrid,
+  vi as defaultComparator,
   at as defaultEditorFor,
   nt as defaultPasteHandler,
   De as detectTreeStructure,
   _n as getMaxDepth,
   Xn as handleRowClick,
-  On as hasEditingCells,
+  Gn as hasEditingCells,
   An as inferChildrenField,
+  yi as queryGrid,
   Zn as selectAll
 };
 //# sourceMappingURL=all.js.map