@toolbox-web/grid 1.9.0 → 1.9.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/all.js +712 -692
- package/all.js.map +1 -1
- package/index.js +321 -300
- package/index.js.map +1 -1
- package/lib/core/grid.d.ts +9 -0
- package/lib/core/grid.d.ts.map +1 -1
- package/lib/core/plugin/base-plugin.d.ts +11 -0
- package/lib/core/plugin/base-plugin.d.ts.map +1 -1
- package/lib/plugins/clipboard/index.js +9 -0
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/ColumnVirtualizationPlugin.d.ts +3 -0
- package/lib/plugins/column-virtualization/ColumnVirtualizationPlugin.d.ts.map +1 -1
- package/lib/plugins/column-virtualization/index.js +90 -57
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/index.js +9 -0
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/editing/index.js +9 -0
- package/lib/plugins/editing/index.js.map +1 -1
- package/lib/plugins/export/index.js +38 -29
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.js +14 -5
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/index.js +9 -0
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js +63 -54
- package/lib/plugins/grouping-rows/index.js.map +1 -1
- package/lib/plugins/master-detail/index.js +25 -16
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/multi-sort/index.js +13 -4
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js +13 -4
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js +9 -0
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js +13 -4
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/print/index.js +9 -0
- package/lib/plugins/print/index.js.map +1 -1
- package/lib/plugins/reorder/index.js +13 -4
- package/lib/plugins/reorder/index.js.map +1 -1
- package/lib/plugins/responsive/index.js +42 -33
- package/lib/plugins/responsive/index.js.map +1 -1
- package/lib/plugins/row-reorder/index.js +10 -1
- package/lib/plugins/row-reorder/index.js.map +1 -1
- package/lib/plugins/selection/index.js +10 -1
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js +29 -20
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/index.js +20 -11
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/index.js +15 -6
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/index.js +9 -0
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/umd/grid.all.umd.js +14 -14
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +14 -14
- package/umd/grid.umd.js.map +1 -1
- package/umd/plugins/column-virtualization.umd.js +1 -1
- package/umd/plugins/column-virtualization.umd.js.map +1 -1
- package/umd/plugins/row-reorder.umd.js +1 -1
- package/umd/plugins/row-reorder.umd.js.map +1 -1
- package/umd/plugins/selection.umd.js +1 -1
- package/umd/plugins/selection.umd.js.map +1 -1
package/all.js
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { BaseGridPlugin as A, DEFAULT_GRID_ICONS as ht, a as gt, runAggregator as ee, e as Je, s as et, g as ue, r as ft, getAggregator as ye, getValueAggregator as pt, b as D, c as xe, d as mt } from "./index.js";
|
|
2
2
|
import { DEFAULT_ANIMATION_CONFIG as Mn, DGEvents as Nn, DataGridElement as qn, FitModeEnum as Hn, GridCSSVars as Kn, GridClasses as zn, GridDataAttrs as On, DataGridElement as Gn, GridSelectors as Bn, PLUGIN_QUERIES as Vn, PluginEvents as Wn, PluginManager as $n, RenderPhase as jn, builtInSort as Un, createGrid as Yn, defaultComparator as Xn, queryGrid as Zn } from "./index.js";
|
|
3
3
|
const tt = "__tbw_expander", wt = 32;
|
|
4
|
-
function pe(
|
|
5
|
-
return
|
|
4
|
+
function pe(a) {
|
|
5
|
+
return a.field === tt;
|
|
6
6
|
}
|
|
7
|
-
function q(
|
|
8
|
-
return
|
|
7
|
+
function q(a) {
|
|
8
|
+
return a.meta?.utility === !0;
|
|
9
9
|
}
|
|
10
|
-
function bt(
|
|
11
|
-
return
|
|
10
|
+
function bt(a) {
|
|
11
|
+
return a.find(pe);
|
|
12
12
|
}
|
|
13
|
-
function vt(
|
|
13
|
+
function vt(a) {
|
|
14
14
|
return {
|
|
15
15
|
field: tt,
|
|
16
16
|
header: "",
|
|
@@ -22,32 +22,32 @@ function vt(s) {
|
|
|
22
22
|
lockPosition: !0,
|
|
23
23
|
suppressMovable: !0,
|
|
24
24
|
expanderColumn: !0,
|
|
25
|
-
expanderPlugin:
|
|
25
|
+
expanderPlugin: a,
|
|
26
26
|
utility: !0
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
29
|
}
|
|
30
|
-
async function te(
|
|
30
|
+
async function te(a) {
|
|
31
31
|
try {
|
|
32
|
-
return await navigator.clipboard.writeText(
|
|
32
|
+
return await navigator.clipboard.writeText(a), !0;
|
|
33
33
|
} catch {
|
|
34
34
|
const e = document.createElement("textarea");
|
|
35
|
-
e.value =
|
|
35
|
+
e.value = a, e.style.position = "fixed", e.style.opacity = "0", e.style.pointerEvents = "none", document.body.appendChild(e), e.select();
|
|
36
36
|
const t = document.execCommand("copy");
|
|
37
37
|
return document.body.removeChild(e), t;
|
|
38
38
|
}
|
|
39
39
|
}
|
|
40
|
-
function Ce(
|
|
40
|
+
function Ce(a, e) {
|
|
41
41
|
const t = e.delimiter ?? " ", i = e.newline ?? `
|
|
42
|
-
`, n =
|
|
42
|
+
`, n = a.replace(/\r\n/g, `
|
|
43
43
|
`).replace(/\r/g, `
|
|
44
44
|
`), r = [];
|
|
45
|
-
let o = [],
|
|
45
|
+
let o = [], s = "", l = !1;
|
|
46
46
|
for (let d = 0; d < n.length; d++) {
|
|
47
47
|
const c = n[d];
|
|
48
|
-
c === '"' && !l ? l = !0 : c === '"' && l ? n[d + 1] === '"' ? (
|
|
48
|
+
c === '"' && !l ? l = !0 : c === '"' && l ? n[d + 1] === '"' ? (s += '"', d++) : l = !1 : c === t && !l ? (o.push(s), s = "") : c === i && !l ? (o.push(s), s = "", (o.length > 1 || o.some((u) => u.trim() !== "")) && r.push(o), o = []) : s += c;
|
|
49
49
|
}
|
|
50
|
-
return o.push(
|
|
50
|
+
return o.push(s), (o.length > 1 || o.some((d) => d.trim() !== "")) && r.push(o), r;
|
|
51
51
|
}
|
|
52
52
|
async function yt() {
|
|
53
53
|
try {
|
|
@@ -56,10 +56,10 @@ async function yt() {
|
|
|
56
56
|
return "";
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
|
-
function xt(
|
|
60
|
-
const { rows: t, target: i, fields: n } =
|
|
59
|
+
function xt(a, e) {
|
|
60
|
+
const { rows: t, target: i, fields: n } = a;
|
|
61
61
|
if (!i) return;
|
|
62
|
-
const r = e.rows, o = e.effectiveConfig.columns ?? [],
|
|
62
|
+
const r = e.rows, o = e.effectiveConfig.columns ?? [], s = o.map((u) => u.field), l = /* @__PURE__ */ new Map();
|
|
63
63
|
o.forEach((u) => {
|
|
64
64
|
l.set(u.field, u.editable === !0);
|
|
65
65
|
});
|
|
@@ -72,7 +72,7 @@ function xt(s, e) {
|
|
|
72
72
|
return;
|
|
73
73
|
} else for (; g >= d.length; ) {
|
|
74
74
|
const f = {};
|
|
75
|
-
|
|
75
|
+
s.forEach((p) => f[p] = ""), d.push(f);
|
|
76
76
|
}
|
|
77
77
|
d[g] = { ...d[g] }, u.forEach((f, p) => {
|
|
78
78
|
const w = n[p];
|
|
@@ -113,8 +113,8 @@ class mn extends A {
|
|
|
113
113
|
const t = this.#n(), i = this.columns.length - 1, n = this.rows.length - 1;
|
|
114
114
|
let r;
|
|
115
115
|
if (t && t.ranges.length > 0) {
|
|
116
|
-
const { mode:
|
|
117
|
-
|
|
116
|
+
const { mode: s, ranges: l } = t, d = l[l.length - 1];
|
|
117
|
+
s === "row" ? r = {
|
|
118
118
|
startRow: d.from.row,
|
|
119
119
|
startCol: 0,
|
|
120
120
|
endRow: d.to.row,
|
|
@@ -128,9 +128,9 @@ class mn extends A {
|
|
|
128
128
|
} else if (!t)
|
|
129
129
|
r = { startRow: 0, startCol: 0, endRow: n, endCol: i };
|
|
130
130
|
else {
|
|
131
|
-
const
|
|
132
|
-
if (!
|
|
133
|
-
r = { startRow:
|
|
131
|
+
const s = this.#r(e);
|
|
132
|
+
if (!s) return;
|
|
133
|
+
r = { startRow: s.row, startCol: s.col, endRow: s.row, endCol: s.col };
|
|
134
134
|
}
|
|
135
135
|
const o = this.#i(r);
|
|
136
136
|
te(o.text).then(() => {
|
|
@@ -145,9 +145,9 @@ class mn extends A {
|
|
|
145
145
|
const t = e.clipboardData?.getData("text/plain");
|
|
146
146
|
if (!t) return;
|
|
147
147
|
e.preventDefault();
|
|
148
|
-
const i = Ce(t, this.config), n = this.#n(), r = n?.ranges?.[0], o = r?.from.row ?? 0,
|
|
149
|
-
for (let w = 0; w < f &&
|
|
150
|
-
const b = this.columns[
|
|
148
|
+
const i = Ce(t, this.config), n = this.#n(), r = n?.ranges?.[0], o = r?.from.row ?? 0, s = r?.from.col ?? 0, d = r && (n?.mode === "range" || n?.mode === "row") && (r.from.row !== r.to.row || r.from.col !== r.to.col) ? { endRow: r.to.row, endCol: r.to.col } : null, c = d?.endCol ?? this.columns.length - 1, u = this.columns[s], h = u ? { row: o, col: s, field: u.field, bounds: d } : null, g = [], f = i[0]?.length ?? 0;
|
|
149
|
+
for (let w = 0; w < f && s + w <= c; w++) {
|
|
150
|
+
const b = this.columns[s + w];
|
|
151
151
|
b && !b.hidden && g.push(b.field);
|
|
152
152
|
}
|
|
153
153
|
const p = { rows: i, text: t, target: h, fields: g };
|
|
@@ -163,13 +163,13 @@ class mn extends A {
|
|
|
163
163
|
return this.grid?.query("getSelection", void 0)?.[0];
|
|
164
164
|
}
|
|
165
165
|
#i(e) {
|
|
166
|
-
const { startRow: t, startCol: i, endRow: n, endCol: r } = e, o = Math.min(t, n),
|
|
166
|
+
const { startRow: t, startCol: i, endRow: n, endCol: r } = e, o = Math.min(t, n), s = Math.max(t, n), l = Math.min(i, r), d = Math.max(i, r), c = this.config.delimiter ?? " ", u = this.config.newline ?? `
|
|
167
167
|
`, h = [], g = this.columns.slice(l, d + 1).filter((f) => !q(f));
|
|
168
168
|
if (this.config.includeHeaders) {
|
|
169
169
|
const f = g.map((p) => p.header || p.field);
|
|
170
170
|
h.push(f.join(c));
|
|
171
171
|
}
|
|
172
|
-
for (let f = o; f <=
|
|
172
|
+
for (let f = o; f <= s; f++) {
|
|
173
173
|
const p = this.rows[f];
|
|
174
174
|
if (!p) continue;
|
|
175
175
|
const w = g.map((b) => {
|
|
@@ -180,7 +180,7 @@ class mn extends A {
|
|
|
180
180
|
}
|
|
181
181
|
return {
|
|
182
182
|
text: h.join(u),
|
|
183
|
-
rowCount:
|
|
183
|
+
rowCount: s - o + 1,
|
|
184
184
|
columnCount: d - l + 1
|
|
185
185
|
};
|
|
186
186
|
}
|
|
@@ -191,7 +191,7 @@ class mn extends A {
|
|
|
191
191
|
if (!i || !n) return null;
|
|
192
192
|
const r = parseInt(n, 10);
|
|
193
193
|
if (isNaN(r)) return null;
|
|
194
|
-
const o = this.columns.findIndex((
|
|
194
|
+
const o = this.columns.findIndex((s) => s.field === i);
|
|
195
195
|
return o === -1 ? null : { row: r, col: o };
|
|
196
196
|
}
|
|
197
197
|
async copy() {
|
|
@@ -211,7 +211,7 @@ class mn extends A {
|
|
|
211
211
|
}
|
|
212
212
|
async copyRows(e) {
|
|
213
213
|
if (e.length === 0) return "";
|
|
214
|
-
const t = [...e].sort((o,
|
|
214
|
+
const t = [...e].sort((o, s) => o - s), i = this.columns.length - 1, n = {
|
|
215
215
|
startRow: t[0],
|
|
216
216
|
startCol: 0,
|
|
217
217
|
endRow: t[t.length - 1],
|
|
@@ -228,37 +228,37 @@ class mn extends A {
|
|
|
228
228
|
}
|
|
229
229
|
}
|
|
230
230
|
const Ee = 100;
|
|
231
|
-
function me(
|
|
232
|
-
if (
|
|
231
|
+
function me(a) {
|
|
232
|
+
if (a == null)
|
|
233
233
|
return Ee;
|
|
234
|
-
if (typeof
|
|
235
|
-
return
|
|
236
|
-
const e = parseFloat(
|
|
234
|
+
if (typeof a == "number")
|
|
235
|
+
return a;
|
|
236
|
+
const e = parseFloat(a);
|
|
237
237
|
return isNaN(e) ? Ee : e;
|
|
238
238
|
}
|
|
239
|
-
function Re(
|
|
240
|
-
return
|
|
239
|
+
function Re(a) {
|
|
240
|
+
return a.map((e) => me(e.width));
|
|
241
241
|
}
|
|
242
|
-
function Se(
|
|
242
|
+
function Se(a) {
|
|
243
243
|
const e = [];
|
|
244
244
|
let t = 0;
|
|
245
|
-
for (const i of
|
|
245
|
+
for (const i of a)
|
|
246
246
|
e.push(t), t += me(i.width);
|
|
247
247
|
return e;
|
|
248
248
|
}
|
|
249
|
-
function ke(
|
|
250
|
-
return
|
|
249
|
+
function ke(a) {
|
|
250
|
+
return a.reduce((e, t) => e + me(t.width), 0);
|
|
251
251
|
}
|
|
252
|
-
function Ct(
|
|
252
|
+
function Ct(a, e, t, i, n) {
|
|
253
253
|
const r = t.length;
|
|
254
254
|
if (r === 0)
|
|
255
255
|
return { startCol: 0, endCol: 0, visibleColumns: [] };
|
|
256
|
-
let o = Et(
|
|
256
|
+
let o = Et(a, t, i);
|
|
257
257
|
o = Math.max(0, o - n);
|
|
258
|
-
const
|
|
258
|
+
const s = a + e;
|
|
259
259
|
let l = o;
|
|
260
260
|
for (let c = o; c < r; c++) {
|
|
261
|
-
if (t[c] >=
|
|
261
|
+
if (t[c] >= s) {
|
|
262
262
|
l = c - 1;
|
|
263
263
|
break;
|
|
264
264
|
}
|
|
@@ -270,16 +270,16 @@ function Ct(s, e, t, i, n) {
|
|
|
270
270
|
d.push(c);
|
|
271
271
|
return { startCol: o, endCol: l, visibleColumns: d };
|
|
272
272
|
}
|
|
273
|
-
function Et(
|
|
273
|
+
function Et(a, e, t) {
|
|
274
274
|
let i = 0, n = e.length - 1;
|
|
275
275
|
for (; i < n; ) {
|
|
276
276
|
const r = Math.floor((i + n) / 2);
|
|
277
|
-
e[r] + t[r] <=
|
|
277
|
+
e[r] + t[r] <= a ? i = r + 1 : n = r;
|
|
278
278
|
}
|
|
279
279
|
return i;
|
|
280
280
|
}
|
|
281
|
-
function Rt(
|
|
282
|
-
return t ?
|
|
281
|
+
function Rt(a, e, t) {
|
|
282
|
+
return t ? a > e : !1;
|
|
283
283
|
}
|
|
284
284
|
class wn extends A {
|
|
285
285
|
name = "columnVirtualization";
|
|
@@ -297,40 +297,60 @@ class wn extends A {
|
|
|
297
297
|
totalWidth = 0;
|
|
298
298
|
columnWidths = [];
|
|
299
299
|
columnOffsets = [];
|
|
300
|
+
originalColumns = [];
|
|
300
301
|
attach(e) {
|
|
301
302
|
super.attach(e);
|
|
302
303
|
const t = this.columns;
|
|
303
304
|
this.columnWidths = Re(t), this.columnOffsets = Se(t), this.totalWidth = ke(t), this.endCol = t.length - 1;
|
|
304
305
|
}
|
|
305
306
|
detach() {
|
|
306
|
-
this.columnWidths = [], this.columnOffsets = [], this.isVirtualized = !1, this.startCol = 0, this.endCol = 0, this.scrollLeft = 0, this.totalWidth = 0;
|
|
307
|
+
this.#e(), this.columnWidths = [], this.columnOffsets = [], this.originalColumns = [], this.isVirtualized = !1, this.startCol = 0, this.endCol = 0, this.scrollLeft = 0, this.totalWidth = 0;
|
|
308
|
+
}
|
|
309
|
+
#e() {
|
|
310
|
+
const e = this.gridElement;
|
|
311
|
+
if (!e) return;
|
|
312
|
+
const t = e.querySelector(".header-row");
|
|
313
|
+
t && (t.style.paddingLeft = "", t.style.minWidth = ""), e.querySelectorAll(".data-grid-row").forEach((o) => {
|
|
314
|
+
o.style.paddingLeft = "";
|
|
315
|
+
});
|
|
316
|
+
const n = e.querySelector(".rows-viewport .rows");
|
|
317
|
+
n && (n.style.width = "");
|
|
318
|
+
const r = e.querySelector(".rows-body");
|
|
319
|
+
r && (r.style.minWidth = "");
|
|
307
320
|
}
|
|
308
321
|
processColumns(e) {
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
322
|
+
(this.originalColumns.length === 0 || e.length > this.originalColumns.length) && (this.originalColumns = e, this.columnWidths = Re(e), this.columnOffsets = Se(e), this.totalWidth = ke(e));
|
|
323
|
+
const i = this.originalColumns, n = Rt(
|
|
324
|
+
i.length,
|
|
325
|
+
this.config.threshold ?? 30,
|
|
326
|
+
this.config.autoEnable ?? !0
|
|
327
|
+
);
|
|
328
|
+
if (this.isVirtualized = n ?? !1, !n)
|
|
329
|
+
return this.startCol = 0, this.endCol = i.length - 1, [...i];
|
|
330
|
+
const r = this.grid.clientWidth || 800, o = Ct(
|
|
313
331
|
this.scrollLeft,
|
|
314
|
-
|
|
332
|
+
r,
|
|
315
333
|
this.columnOffsets,
|
|
316
334
|
this.columnWidths,
|
|
317
335
|
this.config.overscan ?? 3
|
|
318
336
|
);
|
|
319
|
-
return this.startCol =
|
|
337
|
+
return this.startCol = o.startCol, this.endCol = o.endCol, o.visibleColumns.map((s) => i[s]);
|
|
320
338
|
}
|
|
321
339
|
afterRender() {
|
|
322
340
|
if (!this.isVirtualized) return;
|
|
323
341
|
const e = this.gridElement;
|
|
324
342
|
if (!e) return;
|
|
325
343
|
const t = this.columnOffsets[this.startCol] ?? 0, i = e.querySelector(".header-row"), n = e.querySelectorAll(".data-grid-row");
|
|
326
|
-
i && (i.style.paddingLeft = `${t}px`), n.forEach((
|
|
327
|
-
|
|
344
|
+
i && (i.style.paddingLeft = `${t}px`, i.style.minWidth = `${this.totalWidth}px`), n.forEach((s) => {
|
|
345
|
+
s.style.paddingLeft = `${t}px`;
|
|
328
346
|
});
|
|
329
347
|
const r = e.querySelector(".rows-viewport .rows");
|
|
330
348
|
r && (r.style.width = `${this.totalWidth}px`);
|
|
349
|
+
const o = e.querySelector(".rows-body");
|
|
350
|
+
o && (o.style.minWidth = `${this.totalWidth}px`);
|
|
331
351
|
}
|
|
332
352
|
onScroll(e) {
|
|
333
|
-
!this.isVirtualized || Math.abs(e.scrollLeft - this.scrollLeft) < 1 || (this.scrollLeft = e.scrollLeft, this.
|
|
353
|
+
!this.isVirtualized || Math.abs(e.scrollLeft - this.scrollLeft) < 1 || (this.scrollLeft = e.scrollLeft, this.requestColumnsRender());
|
|
334
354
|
}
|
|
335
355
|
getIsVirtualized() {
|
|
336
356
|
return this.isVirtualized;
|
|
@@ -350,16 +370,16 @@ class wn extends A {
|
|
|
350
370
|
}
|
|
351
371
|
}
|
|
352
372
|
const ie = "@layer tbw-plugins{.tbw-context-menu{position:fixed;background:var(--tbw-context-menu-bg, var(--tbw-color-panel-bg));color:var(--tbw-context-menu-fg, var(--tbw-color-fg));border:1px solid var(--tbw-context-menu-border, var(--tbw-color-border));border-radius:var(--tbw-context-menu-radius, var(--tbw-border-radius));box-shadow:var(--tbw-context-menu-shadow, 0 2px 10px var(--tbw-color-shadow));min-width:var(--tbw-context-menu-min-width, var(--tbw-menu-min-width));padding:var(--tbw-spacing-xs) 0;z-index:10000;font-size:var(--tbw-context-menu-font-size, var(--tbw-font-size-sm));font-family:var(--tbw-context-menu-font-family, var(--tbw-font-family))}.tbw-context-menu-item{display:flex;align-items:center;padding:var(--tbw-context-menu-item-padding, var(--tbw-menu-item-padding));cursor:pointer;gap:var(--tbw-context-menu-item-gap, var(--tbw-menu-item-gap))}.tbw-context-menu-item:hover:not(.disabled){background:var(--tbw-context-menu-hover, var(--tbw-color-row-hover))}.tbw-context-menu-item.disabled{opacity:.5;cursor:default}.tbw-context-menu-item.danger{color:var(--tbw-context-menu-danger, var(--tbw-color-danger))}.tbw-context-menu-icon{width:var(--tbw-context-menu-icon-size, var(--tbw-icon-size));text-align:center}.tbw-context-menu-label{flex:1}.tbw-context-menu-shortcut{color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted));font-size:var(--tbw-context-menu-shortcut-size, var(--tbw-font-size-xs))}.tbw-context-menu-arrow{font-size:var(--tbw-context-menu-arrow-size, var(--tbw-font-size-2xs));color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted))}.tbw-context-menu-separator{height:1px;background:var(--tbw-context-menu-border, var(--tbw-color-border));margin:var(--tbw-spacing-xs) 0}}";
|
|
353
|
-
function he(
|
|
354
|
-
return (typeof
|
|
373
|
+
function he(a, e) {
|
|
374
|
+
return (typeof a == "function" ? a(e) : a).filter((i) => !(i.hidden === !0 || typeof i.hidden == "function" && i.hidden(e)));
|
|
355
375
|
}
|
|
356
|
-
function St(
|
|
357
|
-
return
|
|
376
|
+
function St(a, e) {
|
|
377
|
+
return a.disabled === !0 ? !0 : typeof a.disabled == "function" ? a.disabled(e) : !1;
|
|
358
378
|
}
|
|
359
|
-
function ge(
|
|
379
|
+
function ge(a, e, t, i = ht.submenuArrow) {
|
|
360
380
|
const n = document.createElement("div");
|
|
361
381
|
n.className = "tbw-context-menu", n.setAttribute("role", "menu");
|
|
362
|
-
for (const r of
|
|
382
|
+
for (const r of a) {
|
|
363
383
|
if (r.separator) {
|
|
364
384
|
const d = document.createElement("div");
|
|
365
385
|
d.className = "tbw-context-menu-separator", d.setAttribute("role", "separator"), n.appendChild(d);
|
|
@@ -367,8 +387,8 @@ function ge(s, e, t, i = ht.submenuArrow) {
|
|
|
367
387
|
}
|
|
368
388
|
const o = document.createElement("div");
|
|
369
389
|
o.className = "tbw-context-menu-item", r.cssClass && o.classList.add(r.cssClass), o.setAttribute("role", "menuitem"), o.setAttribute("data-id", r.id);
|
|
370
|
-
const
|
|
371
|
-
if (
|
|
390
|
+
const s = St(r, e);
|
|
391
|
+
if (s && (o.classList.add("disabled"), o.setAttribute("aria-disabled", "true")), r.icon) {
|
|
372
392
|
const d = document.createElement("span");
|
|
373
393
|
d.className = "tbw-context-menu-icon", d.innerHTML = r.icon, o.appendChild(d);
|
|
374
394
|
}
|
|
@@ -388,17 +408,17 @@ function ge(s, e, t, i = ht.submenuArrow) {
|
|
|
388
408
|
c && c.remove();
|
|
389
409
|
});
|
|
390
410
|
}
|
|
391
|
-
!
|
|
411
|
+
!s && r.action && !r.subMenu && o.addEventListener("click", (d) => {
|
|
392
412
|
d.stopPropagation(), t(r);
|
|
393
413
|
}), n.appendChild(o);
|
|
394
414
|
}
|
|
395
415
|
return n;
|
|
396
416
|
}
|
|
397
|
-
function Ae(
|
|
398
|
-
|
|
399
|
-
const i =
|
|
400
|
-
let o = e,
|
|
401
|
-
e + i.width > n && (o = e - i.width), t + i.height > r && (
|
|
417
|
+
function Ae(a, e, t) {
|
|
418
|
+
a.style.position = "fixed", a.style.left = `${e}px`, a.style.top = `${t}px`, a.style.visibility = "hidden", a.style.zIndex = "10000";
|
|
419
|
+
const i = a.getBoundingClientRect(), n = window.innerWidth, r = window.innerHeight;
|
|
420
|
+
let o = e, s = t;
|
|
421
|
+
e + i.width > n && (o = e - i.width), t + i.height > r && (s = t - i.height), o = Math.max(0, o), s = Math.max(0, s), a.style.left = `${o}px`, a.style.top = `${s}px`, a.style.visibility = "visible";
|
|
402
422
|
}
|
|
403
423
|
let z = null, O = null, M = null, ne = 0;
|
|
404
424
|
const re = [
|
|
@@ -406,16 +426,16 @@ const re = [
|
|
|
406
426
|
id: "copy",
|
|
407
427
|
name: "Copy",
|
|
408
428
|
shortcut: "Ctrl+C",
|
|
409
|
-
action: (
|
|
410
|
-
|
|
429
|
+
action: (a) => {
|
|
430
|
+
a.grid?.plugins?.clipboard?.copy?.();
|
|
411
431
|
}
|
|
412
432
|
},
|
|
413
433
|
{ separator: !0, id: "sep1", name: "" },
|
|
414
434
|
{
|
|
415
435
|
id: "export-csv",
|
|
416
436
|
name: "Export CSV",
|
|
417
|
-
action: (
|
|
418
|
-
|
|
437
|
+
action: (a) => {
|
|
438
|
+
a.grid?.plugins?.export?.exportCsv?.();
|
|
419
439
|
}
|
|
420
440
|
}
|
|
421
441
|
];
|
|
@@ -477,8 +497,8 @@ class it extends A {
|
|
|
477
497
|
const i = getComputedStyle(t), n = [], r = i.getPropertyValue("color-scheme").trim();
|
|
478
498
|
r && n.push(`color-scheme: ${r}`);
|
|
479
499
|
for (const o of it.CSS_VARS_TO_COPY) {
|
|
480
|
-
const
|
|
481
|
-
|
|
500
|
+
const s = i.getPropertyValue(o).trim();
|
|
501
|
+
s && n.push(`${o}: ${s}`);
|
|
482
502
|
}
|
|
483
503
|
if (n.length > 0) {
|
|
484
504
|
const o = e.getAttribute("style") || "";
|
|
@@ -502,7 +522,7 @@ class it extends A {
|
|
|
502
522
|
t && t.getAttribute("data-context-menu-bound") !== "true" && (t.setAttribute("data-context-menu-bound", "true"), t.addEventListener("contextmenu", (i) => {
|
|
503
523
|
const n = i;
|
|
504
524
|
n.preventDefault();
|
|
505
|
-
const r = n.target, o = r.closest("[data-row][data-col]"),
|
|
525
|
+
const r = n.target, o = r.closest("[data-row][data-col]"), s = r.closest(".header-cell");
|
|
506
526
|
let l;
|
|
507
527
|
if (o) {
|
|
508
528
|
const c = parseInt(o.getAttribute("data-row") ?? "-1", 10), u = parseInt(o.getAttribute("data-col") ?? "-1", 10), h = this.columns[u], g = this.rows[c];
|
|
@@ -516,8 +536,8 @@ class it extends A {
|
|
|
516
536
|
isHeader: !1,
|
|
517
537
|
event: n
|
|
518
538
|
};
|
|
519
|
-
} else if (
|
|
520
|
-
const c = parseInt(
|
|
539
|
+
} else if (s) {
|
|
540
|
+
const c = parseInt(s.getAttribute("data-col") ?? "-1", 10), u = this.columns[c];
|
|
521
541
|
l = {
|
|
522
542
|
row: null,
|
|
523
543
|
rowIndex: -1,
|
|
@@ -570,13 +590,13 @@ class it extends A {
|
|
|
570
590
|
}
|
|
571
591
|
}
|
|
572
592
|
const kt = "@layer tbw-plugins{tbw-grid{--tbw-editing-bg: var(--tbw-color-selection);--tbw-editing-row-bg: var(--tbw-editing-bg);--tbw-editing-border: var(--tbw-border-input, 1px solid var(--tbw-color-border-strong));--tbw-padding-editing-input: var(--tbw-cell-padding-input, 2px 6px);--tbw-font-size-editor: inherit;--tbw-editing-row-outline-color: var(--tbw-color-accent);--tbw-editing-row-outline-width: 1px;.data-grid-row:has(.editing){background:var(--tbw-editing-row-bg);outline:var(--tbw-editing-row-outline-width) solid var(--tbw-editing-row-outline-color);outline-offset:calc(-1 * var(--tbw-editing-row-outline-width))}.data-grid-row>.cell.editing{overflow:hidden;padding:0;display:flex;min-height:calc(var(--tbw-row-height) + 2px);align-items:center;justify-content:center}.data-grid-row>.cell.editing input:not([type=checkbox]),.data-grid-row>.cell.editing select,.data-grid-row>.cell.editing textarea{width:100%;height:100%;flex:1 1 auto;min-width:0;border:var(--tbw-editing-border);padding:var(--tbw-padding-editing-input);font-size:var(--tbw-font-size-editor)}.tbw-editor-host{display:contents}}}";
|
|
573
|
-
function At(
|
|
574
|
-
const e =
|
|
593
|
+
function At(a) {
|
|
594
|
+
const e = a.options;
|
|
575
595
|
return e ? typeof e == "function" ? e() : e : [];
|
|
576
596
|
}
|
|
577
|
-
function _t(
|
|
597
|
+
function _t(a) {
|
|
578
598
|
return (e) => {
|
|
579
|
-
const t =
|
|
599
|
+
const t = a.editorParams, i = document.createElement("input");
|
|
580
600
|
i.type = "number", i.value = e.value != null ? String(e.value) : "", t?.min !== void 0 && (i.min = String(t.min)), t?.max !== void 0 && (i.max = String(t.max)), t?.step !== void 0 && (i.step = String(t.step)), t?.placeholder && (i.placeholder = t.placeholder);
|
|
581
601
|
const n = () => e.commit(i.value === "" ? null : Number(i.value));
|
|
582
602
|
return i.addEventListener("blur", n), i.addEventListener("keydown", (r) => {
|
|
@@ -585,33 +605,33 @@ function _t(s) {
|
|
|
585
605
|
};
|
|
586
606
|
}
|
|
587
607
|
function Tt() {
|
|
588
|
-
return (
|
|
608
|
+
return (a) => {
|
|
589
609
|
const e = document.createElement("input");
|
|
590
|
-
return e.type = "checkbox", e.checked = !!
|
|
610
|
+
return e.type = "checkbox", e.checked = !!a.value, e.addEventListener("change", () => a.commit(e.checked)), e;
|
|
591
611
|
};
|
|
592
612
|
}
|
|
593
|
-
function Lt(
|
|
613
|
+
function Lt(a) {
|
|
594
614
|
return (e) => {
|
|
595
|
-
const t =
|
|
615
|
+
const t = a.editorParams, i = document.createElement("input");
|
|
596
616
|
return i.type = "date", e.value instanceof Date && (i.valueAsDate = e.value), t?.min && (i.min = t.min), t?.max && (i.max = t.max), t?.placeholder && (i.placeholder = t.placeholder), i.addEventListener("change", () => e.commit(i.valueAsDate)), i.addEventListener("keydown", (n) => {
|
|
597
617
|
n.key === "Escape" && e.cancel();
|
|
598
618
|
}), i;
|
|
599
619
|
};
|
|
600
620
|
}
|
|
601
|
-
function Ft(
|
|
621
|
+
function Ft(a) {
|
|
602
622
|
return (e) => {
|
|
603
|
-
const t =
|
|
604
|
-
if (
|
|
623
|
+
const t = a.editorParams, i = document.createElement("select");
|
|
624
|
+
if (a.multi && (i.multiple = !0), t?.includeEmpty) {
|
|
605
625
|
const o = document.createElement("option");
|
|
606
626
|
o.value = "", o.textContent = t.emptyLabel ?? "", i.appendChild(o);
|
|
607
627
|
}
|
|
608
|
-
At(
|
|
609
|
-
const
|
|
610
|
-
|
|
628
|
+
At(a).forEach((o) => {
|
|
629
|
+
const s = document.createElement("option");
|
|
630
|
+
s.value = String(o.value), s.textContent = o.label, (a.multi && Array.isArray(e.value) && e.value.includes(o.value) || !a.multi && e.value === o.value) && (s.selected = !0), i.appendChild(s);
|
|
611
631
|
});
|
|
612
632
|
const r = () => {
|
|
613
|
-
if (
|
|
614
|
-
const o = Array.from(i.selectedOptions).map((
|
|
633
|
+
if (a.multi) {
|
|
634
|
+
const o = Array.from(i.selectedOptions).map((s) => s.value);
|
|
615
635
|
e.commit(o);
|
|
616
636
|
} else
|
|
617
637
|
e.commit(i.value);
|
|
@@ -621,60 +641,60 @@ function Ft(s) {
|
|
|
621
641
|
}), i;
|
|
622
642
|
};
|
|
623
643
|
}
|
|
624
|
-
function It(
|
|
644
|
+
function It(a) {
|
|
625
645
|
return (e) => {
|
|
626
|
-
const t =
|
|
646
|
+
const t = a.editorParams, i = document.createElement("input");
|
|
627
647
|
return i.type = "text", i.value = e.value != null ? String(e.value) : "", t?.maxLength !== void 0 && (i.maxLength = t.maxLength), t?.pattern && (i.pattern = t.pattern), t?.placeholder && (i.placeholder = t.placeholder), i.addEventListener("blur", () => e.commit(i.value)), i.addEventListener("keydown", (n) => {
|
|
628
648
|
n.key === "Enter" && e.commit(i.value), n.key === "Escape" && e.cancel();
|
|
629
649
|
}), i;
|
|
630
650
|
};
|
|
631
651
|
}
|
|
632
|
-
function Pt(
|
|
633
|
-
switch (
|
|
652
|
+
function Pt(a) {
|
|
653
|
+
switch (a.type) {
|
|
634
654
|
case "number":
|
|
635
|
-
return _t(
|
|
655
|
+
return _t(a);
|
|
636
656
|
case "boolean":
|
|
637
657
|
return Tt();
|
|
638
658
|
case "date":
|
|
639
|
-
return Lt(
|
|
659
|
+
return Lt(a);
|
|
640
660
|
case "select":
|
|
641
|
-
return Ft(
|
|
661
|
+
return Ft(a);
|
|
642
662
|
default:
|
|
643
|
-
return It(
|
|
663
|
+
return It(a);
|
|
644
664
|
}
|
|
645
665
|
}
|
|
646
666
|
const oe = 'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])';
|
|
647
|
-
function Dt(
|
|
667
|
+
function Dt(a, e) {
|
|
648
668
|
if (e.editor) return e.editor;
|
|
649
669
|
if (e.__editorTemplate) return "template";
|
|
650
670
|
if (!e.type) return;
|
|
651
|
-
const i =
|
|
671
|
+
const i = a.effectiveConfig?.typeDefaults;
|
|
652
672
|
if (i?.[e.type]?.editor)
|
|
653
673
|
return i[e.type].editor;
|
|
654
|
-
const n =
|
|
674
|
+
const n = a.__frameworkAdapter;
|
|
655
675
|
if (n?.getTypeDefault) {
|
|
656
676
|
const r = n.getTypeDefault(e.type);
|
|
657
677
|
if (r?.editor)
|
|
658
678
|
return r.editor;
|
|
659
679
|
}
|
|
660
680
|
}
|
|
661
|
-
function $(
|
|
662
|
-
return !(typeof
|
|
681
|
+
function $(a) {
|
|
682
|
+
return !(typeof a != "string" || a === "__proto__" || a === "constructor" || a === "prototype");
|
|
663
683
|
}
|
|
664
|
-
function Mt(
|
|
665
|
-
const e = (
|
|
666
|
-
|
|
684
|
+
function Mt(a) {
|
|
685
|
+
const e = (a.__editingCellCount ?? 0) + 1;
|
|
686
|
+
a.__editingCellCount = e, a.setAttribute("data-has-editing", "");
|
|
667
687
|
}
|
|
668
|
-
function Nt(
|
|
669
|
-
|
|
688
|
+
function Nt(a) {
|
|
689
|
+
a.__editingCellCount = 0, a.removeAttribute("data-has-editing");
|
|
670
690
|
}
|
|
671
|
-
function U(
|
|
672
|
-
return
|
|
691
|
+
function U(a, e) {
|
|
692
|
+
return a instanceof HTMLInputElement ? a.type === "checkbox" ? a.checked : a.type === "number" ? a.value === "" ? null : Number(a.value) : a.type === "date" ? a.valueAsDate : a.value : e?.type === "number" && a.value !== "" ? Number(a.value) : a.value;
|
|
673
693
|
}
|
|
674
|
-
function _e(
|
|
694
|
+
function _e(a) {
|
|
675
695
|
}
|
|
676
|
-
function qt(
|
|
677
|
-
const i =
|
|
696
|
+
function qt(a, e, t) {
|
|
697
|
+
const i = a.querySelector("input,textarea,select");
|
|
678
698
|
i && (i.addEventListener("blur", () => {
|
|
679
699
|
t(U(i, e));
|
|
680
700
|
}), i instanceof HTMLInputElement && i.type === "checkbox" ? i.addEventListener("change", () => t(i.checked)) : i instanceof HTMLSelectElement && i.addEventListener("change", () => t(U(i, e))));
|
|
@@ -767,7 +787,7 @@ class bn extends A {
|
|
|
767
787
|
const n = e.originalEvent.type === "dblclick";
|
|
768
788
|
if (i === "click" && n || i === "dblclick" && !n) return !1;
|
|
769
789
|
const { rowIndex: r } = e;
|
|
770
|
-
return t._columns?.some((
|
|
790
|
+
return t._columns?.some((s) => s.editable) ? (e.originalEvent.stopPropagation(), this.beginBulkEdit(r), !0) : !1;
|
|
771
791
|
}
|
|
772
792
|
onKeyDown(e) {
|
|
773
793
|
const t = this.grid;
|
|
@@ -778,9 +798,9 @@ class bn extends A {
|
|
|
778
798
|
if (i >= 0 && n >= 0) {
|
|
779
799
|
const r = t._visibleColumns[n], o = t._rows[i];
|
|
780
800
|
if (r?.editable && r.type === "boolean" && o) {
|
|
781
|
-
const
|
|
782
|
-
if ($(
|
|
783
|
-
const d = !o[
|
|
801
|
+
const s = r.field;
|
|
802
|
+
if ($(s)) {
|
|
803
|
+
const d = !o[s];
|
|
784
804
|
return this.#u(i, r, d, o), e.preventDefault(), this.requestRender(), !0;
|
|
785
805
|
}
|
|
786
806
|
}
|
|
@@ -793,8 +813,8 @@ class bn extends A {
|
|
|
793
813
|
const i = this.config.editOn ?? t.effectiveConfig?.editOn;
|
|
794
814
|
if (i === !1 || i === "manual") return !1;
|
|
795
815
|
const n = t._focusRow, r = t._focusCol;
|
|
796
|
-
if (n >= 0 && t._columns?.some((
|
|
797
|
-
const
|
|
816
|
+
if (n >= 0 && t._columns?.some((s) => s.editable)) {
|
|
817
|
+
const s = t._visibleColumns[r], l = t._rows[n], d = s?.field ?? "", c = d && l ? l[d] : void 0, u = this.gridElement.querySelector(`[data-row="${n}"][data-col="${r}"]`), h = new CustomEvent("cell-activate", {
|
|
798
818
|
cancelable: !0,
|
|
799
819
|
bubbles: !0,
|
|
800
820
|
detail: {
|
|
@@ -826,8 +846,8 @@ class bn extends A {
|
|
|
826
846
|
if (!r.type) return r;
|
|
827
847
|
let o;
|
|
828
848
|
if (i?.[r.type]?.editorParams && (o = i[r.type].editorParams), !o && n?.getTypeDefault) {
|
|
829
|
-
const
|
|
830
|
-
|
|
849
|
+
const s = n.getTypeDefault(r.type);
|
|
850
|
+
s?.editorParams && (o = s.editorParams);
|
|
831
851
|
}
|
|
832
852
|
return o ? {
|
|
833
853
|
...r,
|
|
@@ -839,9 +859,9 @@ class bn extends A {
|
|
|
839
859
|
const e = this.grid;
|
|
840
860
|
if (this.#r && (this.#r = !1, this.#l(e)), this.#i.size !== 0)
|
|
841
861
|
for (const t of this.#i) {
|
|
842
|
-
const [i, n] = t.split(":"), r = parseInt(i, 10), o = parseInt(n, 10),
|
|
843
|
-
if (!
|
|
844
|
-
const l =
|
|
862
|
+
const [i, n] = t.split(":"), r = parseInt(i, 10), o = parseInt(n, 10), s = e.findRenderedRowElement?.(r);
|
|
863
|
+
if (!s) continue;
|
|
864
|
+
const l = s.querySelector(`.cell[data-col="${o}"]`);
|
|
845
865
|
if (!l || l.classList.contains("editing")) continue;
|
|
846
866
|
const d = e._rows[r], c = e._visibleColumns[o];
|
|
847
867
|
d && c && this.#g(d, r, c, o, l, !0);
|
|
@@ -893,25 +913,25 @@ class bn extends A {
|
|
|
893
913
|
beginCellEdit(e, t) {
|
|
894
914
|
const i = this.grid, n = i._visibleColumns.findIndex((l) => l.field === t);
|
|
895
915
|
if (n === -1 || !i._visibleColumns[n]?.editable) return;
|
|
896
|
-
const
|
|
897
|
-
|
|
916
|
+
const s = i.findRenderedRowElement?.(e)?.querySelector(`.cell[data-col="${n}"]`);
|
|
917
|
+
s && this.#d(e, n, s);
|
|
898
918
|
}
|
|
899
919
|
beginBulkEdit(e) {
|
|
900
920
|
const t = this.grid;
|
|
901
|
-
if ((this.config.editOn ?? t.effectiveConfig?.editOn) === !1 || !t._columns?.some((
|
|
921
|
+
if ((this.config.editOn ?? t.effectiveConfig?.editOn) === !1 || !t._columns?.some((s) => s.editable)) return;
|
|
902
922
|
const r = t.findRenderedRowElement?.(e);
|
|
903
923
|
if (!r) return;
|
|
904
924
|
const o = t._rows[e];
|
|
905
|
-
this.#c(e, o), Array.from(r.children).forEach((
|
|
925
|
+
this.#c(e, o), Array.from(r.children).forEach((s, l) => {
|
|
906
926
|
const d = t._visibleColumns[l];
|
|
907
927
|
if (d?.editable) {
|
|
908
|
-
const c =
|
|
928
|
+
const c = s;
|
|
909
929
|
c.classList.contains("editing") || this.#g(o, e, d, l, c, !0);
|
|
910
930
|
}
|
|
911
931
|
}), setTimeout(() => {
|
|
912
|
-
let
|
|
913
|
-
if (
|
|
914
|
-
const l =
|
|
932
|
+
let s = r.querySelector(`.cell[data-col="${t._focusCol}"]`);
|
|
933
|
+
if (s?.classList.contains("editing") || (s = r.querySelector(".cell.editing")), s?.classList.contains("editing")) {
|
|
934
|
+
const l = s.querySelector(oe);
|
|
915
935
|
try {
|
|
916
936
|
l?.focus({ preventScroll: !0 });
|
|
917
937
|
} catch {
|
|
@@ -939,10 +959,10 @@ class bn extends A {
|
|
|
939
959
|
#a(e, t) {
|
|
940
960
|
if (this.#e !== e) return;
|
|
941
961
|
const i = this.grid, n = this.#o.get(e), r = i._rows[e], o = i.findRenderedRowElement?.(e);
|
|
942
|
-
let
|
|
962
|
+
let s;
|
|
943
963
|
if (r)
|
|
944
964
|
try {
|
|
945
|
-
|
|
965
|
+
s = i.getRowId?.(r);
|
|
946
966
|
} catch {
|
|
947
967
|
}
|
|
948
968
|
if (!t && o && r && o.querySelectorAll(".cell.editing").forEach((d) => {
|
|
@@ -958,12 +978,12 @@ class bn extends A {
|
|
|
958
978
|
}), t && n && r)
|
|
959
979
|
Object.keys(n).forEach((l) => {
|
|
960
980
|
r[l] = n[l];
|
|
961
|
-
}),
|
|
981
|
+
}), s && this.#n.delete(s);
|
|
962
982
|
else if (!t && r) {
|
|
963
|
-
const l =
|
|
983
|
+
const l = s ? this.#n.has(s) : !1;
|
|
964
984
|
this.emit("row-commit", {
|
|
965
985
|
rowIndex: e,
|
|
966
|
-
rowId:
|
|
986
|
+
rowId: s ?? "",
|
|
967
987
|
row: r,
|
|
968
988
|
changed: l,
|
|
969
989
|
changedRows: this.changedRows,
|
|
@@ -982,7 +1002,7 @@ class bn extends A {
|
|
|
982
1002
|
if (!$(r)) return;
|
|
983
1003
|
const o = n[r];
|
|
984
1004
|
if (o === i) return;
|
|
985
|
-
const
|
|
1005
|
+
const s = this.grid;
|
|
986
1006
|
let l;
|
|
987
1007
|
try {
|
|
988
1008
|
l = this.grid.getRowId(n);
|
|
@@ -1007,17 +1027,17 @@ class bn extends A {
|
|
|
1007
1027
|
oldValue: o,
|
|
1008
1028
|
newValue: i
|
|
1009
1029
|
});
|
|
1010
|
-
const h =
|
|
1030
|
+
const h = s.findRenderedRowElement?.(e);
|
|
1011
1031
|
h && (h.classList.add("changed"), gt(h, "change"));
|
|
1012
1032
|
}
|
|
1013
1033
|
#g(e, t, i, n, r, o) {
|
|
1014
1034
|
if (!i.editable || r.classList.contains("editing")) return;
|
|
1015
|
-
let
|
|
1035
|
+
let s;
|
|
1016
1036
|
try {
|
|
1017
|
-
|
|
1037
|
+
s = this.grid.getRowId(e);
|
|
1018
1038
|
} catch {
|
|
1019
1039
|
}
|
|
1020
|
-
const l =
|
|
1040
|
+
const l = s ? (C) => this.grid.updateRow(s, C, "cascade") : _e, d = $(i.field) ? e[i.field] : void 0;
|
|
1021
1041
|
r.classList.add("editing"), this.#i.add(`${t}:${n}`);
|
|
1022
1042
|
const c = r.parentElement;
|
|
1023
1043
|
c && Mt(c);
|
|
@@ -1041,7 +1061,7 @@ class bn extends A {
|
|
|
1041
1061
|
} else if (typeof b == "function") {
|
|
1042
1062
|
const C = {
|
|
1043
1063
|
row: e,
|
|
1044
|
-
rowId:
|
|
1064
|
+
rowId: s ?? "",
|
|
1045
1065
|
value: v,
|
|
1046
1066
|
field: i.field,
|
|
1047
1067
|
column: i,
|
|
@@ -1057,7 +1077,7 @@ class bn extends A {
|
|
|
1057
1077
|
C.setAttribute("data-external-editor", ""), C.setAttribute("data-field", i.field), f.appendChild(C);
|
|
1058
1078
|
const _ = {
|
|
1059
1079
|
row: e,
|
|
1060
|
-
rowId:
|
|
1080
|
+
rowId: s ?? "",
|
|
1061
1081
|
value: v,
|
|
1062
1082
|
field: i.field,
|
|
1063
1083
|
column: i,
|
|
@@ -1077,7 +1097,7 @@ class bn extends A {
|
|
|
1077
1097
|
);
|
|
1078
1098
|
}
|
|
1079
1099
|
}
|
|
1080
|
-
#p(e, t, i, n, r, o,
|
|
1100
|
+
#p(e, t, i, n, r, o, s, l) {
|
|
1081
1101
|
const d = t.__editorTemplate;
|
|
1082
1102
|
if (!d) return;
|
|
1083
1103
|
const c = d.cloneNode(!0), u = t.__compiledEditor;
|
|
@@ -1106,7 +1126,7 @@ class bn extends A {
|
|
|
1106
1126
|
}), h.addEventListener("keydown", (f) => {
|
|
1107
1127
|
const p = f;
|
|
1108
1128
|
p.key === "Enter" && (p.stopPropagation(), p.preventDefault(), g = !0, r(U(h, t)), this.#a(l, !1)), p.key === "Escape" && (p.stopPropagation(), p.preventDefault(), o(), this.#a(l, !0));
|
|
1109
|
-
}), h instanceof HTMLInputElement && h.type === "checkbox" && h.addEventListener("change", () => r(h.checked)),
|
|
1129
|
+
}), h instanceof HTMLInputElement && h.type === "checkbox" && h.addEventListener("change", () => r(h.checked)), s || setTimeout(() => h.focus({ preventScroll: !0 }), 0);
|
|
1110
1130
|
}
|
|
1111
1131
|
e.appendChild(c);
|
|
1112
1132
|
}
|
|
@@ -1126,17 +1146,17 @@ class bn extends A {
|
|
|
1126
1146
|
});
|
|
1127
1147
|
}
|
|
1128
1148
|
}
|
|
1129
|
-
function Te(
|
|
1130
|
-
if (
|
|
1131
|
-
if (
|
|
1132
|
-
if (typeof
|
|
1133
|
-
const t = String(
|
|
1149
|
+
function Te(a, e = !0) {
|
|
1150
|
+
if (a == null) return "";
|
|
1151
|
+
if (a instanceof Date) return a.toISOString();
|
|
1152
|
+
if (typeof a == "object") return JSON.stringify(a);
|
|
1153
|
+
const t = String(a);
|
|
1134
1154
|
return e && (t.includes(",") || t.includes('"') || t.includes(`
|
|
1135
1155
|
`) || t.includes("\r")) ? `"${t.replace(/"/g, '""')}"` : t;
|
|
1136
1156
|
}
|
|
1137
|
-
function Ht(
|
|
1157
|
+
function Ht(a, e, t, i = {}) {
|
|
1138
1158
|
const n = i.delimiter ?? ",", r = i.newline ?? `
|
|
1139
|
-
`, o = [],
|
|
1159
|
+
`, o = [], s = i.bom ? "\uFEFF" : "";
|
|
1140
1160
|
if (t.includeHeaders !== !1) {
|
|
1141
1161
|
const l = e.map((d) => {
|
|
1142
1162
|
const c = d.header || d.field, u = t.processHeader ? t.processHeader(c, d.field) : c;
|
|
@@ -1144,27 +1164,27 @@ function Ht(s, e, t, i = {}) {
|
|
|
1144
1164
|
});
|
|
1145
1165
|
o.push(l.join(n));
|
|
1146
1166
|
}
|
|
1147
|
-
for (const l of
|
|
1167
|
+
for (const l of a) {
|
|
1148
1168
|
const d = e.map((c) => {
|
|
1149
1169
|
let u = l[c.field];
|
|
1150
1170
|
return t.processCell && (u = t.processCell(u, c.field, l)), Te(u);
|
|
1151
1171
|
});
|
|
1152
1172
|
o.push(d.join(n));
|
|
1153
1173
|
}
|
|
1154
|
-
return
|
|
1174
|
+
return s + o.join(r);
|
|
1155
1175
|
}
|
|
1156
|
-
function we(
|
|
1157
|
-
const t = URL.createObjectURL(
|
|
1176
|
+
function we(a, e) {
|
|
1177
|
+
const t = URL.createObjectURL(a), i = document.createElement("a");
|
|
1158
1178
|
i.href = t, i.download = e, i.style.display = "none", document.body.appendChild(i), i.click(), document.body.removeChild(i), URL.revokeObjectURL(t);
|
|
1159
1179
|
}
|
|
1160
|
-
function Kt(
|
|
1161
|
-
const t = new Blob([
|
|
1180
|
+
function Kt(a, e) {
|
|
1181
|
+
const t = new Blob([a], { type: "text/csv;charset=utf-8;" });
|
|
1162
1182
|
we(t, e);
|
|
1163
1183
|
}
|
|
1164
|
-
function Le(
|
|
1165
|
-
return
|
|
1184
|
+
function Le(a) {
|
|
1185
|
+
return a.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
1166
1186
|
}
|
|
1167
|
-
function zt(
|
|
1187
|
+
function zt(a, e, t) {
|
|
1168
1188
|
let i = `<?xml version="1.0" encoding="UTF-8"?>
|
|
1169
1189
|
<?mso-application progid="Excel.Sheet"?>
|
|
1170
1190
|
<Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet"
|
|
@@ -1180,14 +1200,14 @@ function zt(s, e, t) {
|
|
|
1180
1200
|
}
|
|
1181
1201
|
i += "</Row>";
|
|
1182
1202
|
}
|
|
1183
|
-
for (const n of
|
|
1203
|
+
for (const n of a) {
|
|
1184
1204
|
i += `
|
|
1185
1205
|
<Row>`;
|
|
1186
1206
|
for (const r of e) {
|
|
1187
1207
|
let o = n[r.field];
|
|
1188
1208
|
t.processCell && (o = t.processCell(o, r.field, n));
|
|
1189
|
-
let
|
|
1190
|
-
o == null ? l = "" : typeof o == "number" && !isNaN(o) ? (
|
|
1209
|
+
let s = "String", l = "";
|
|
1210
|
+
o == null ? l = "" : typeof o == "number" && !isNaN(o) ? (s = "Number", l = String(o)) : o instanceof Date ? (s = "DateTime", l = o.toISOString()) : l = Le(String(o)), i += `<Cell><Data ss:Type="${s}">${l}</Data></Cell>`;
|
|
1191
1211
|
}
|
|
1192
1212
|
i += "</Row>";
|
|
1193
1213
|
}
|
|
@@ -1196,8 +1216,8 @@ function zt(s, e, t) {
|
|
|
1196
1216
|
</Worksheet>
|
|
1197
1217
|
</Workbook>`, i;
|
|
1198
1218
|
}
|
|
1199
|
-
function Ot(
|
|
1200
|
-
const t = e.endsWith(".xls") ? e : `${e}.xls`, i = new Blob([
|
|
1219
|
+
function Ot(a, e) {
|
|
1220
|
+
const t = e.endsWith(".xls") ? e : `${e}.xls`, i = new Blob([a], {
|
|
1201
1221
|
type: "application/vnd.ms-excel;charset=utf-8;"
|
|
1202
1222
|
});
|
|
1203
1223
|
we(i, t);
|
|
@@ -1235,17 +1255,17 @@ class vn extends A {
|
|
|
1235
1255
|
l?.selected?.size && (o = [...l.selected].sort((c, u) => c - u).map((c) => this.rows[c]).filter(Boolean));
|
|
1236
1256
|
}
|
|
1237
1257
|
t?.rowIndices && (o = t.rowIndices.map((l) => this.rows[l]).filter(Boolean)), this.isExportingFlag = !0;
|
|
1238
|
-
let
|
|
1258
|
+
let s = n.fileName;
|
|
1239
1259
|
try {
|
|
1240
1260
|
switch (e) {
|
|
1241
1261
|
case "csv": {
|
|
1242
1262
|
const l = Ht(o, r, n, { bom: !0 });
|
|
1243
|
-
|
|
1263
|
+
s = s.endsWith(".csv") ? s : `${s}.csv`, Kt(l, s);
|
|
1244
1264
|
break;
|
|
1245
1265
|
}
|
|
1246
1266
|
case "excel": {
|
|
1247
1267
|
const l = zt(o, r, n);
|
|
1248
|
-
|
|
1268
|
+
s = s.endsWith(".xls") ? s : `${s}.xls`, Ot(l, s);
|
|
1249
1269
|
break;
|
|
1250
1270
|
}
|
|
1251
1271
|
case "json": {
|
|
@@ -1257,15 +1277,15 @@ class vn extends A {
|
|
|
1257
1277
|
}
|
|
1258
1278
|
return h;
|
|
1259
1279
|
}), d = JSON.stringify(l, null, 2);
|
|
1260
|
-
|
|
1280
|
+
s = s.endsWith(".json") ? s : `${s}.json`;
|
|
1261
1281
|
const c = new Blob([d], { type: "application/json" });
|
|
1262
|
-
we(c,
|
|
1282
|
+
we(c, s);
|
|
1263
1283
|
break;
|
|
1264
1284
|
}
|
|
1265
1285
|
}
|
|
1266
1286
|
this.lastExportInfo = { format: e, timestamp: /* @__PURE__ */ new Date() }, this.emit("export-complete", {
|
|
1267
1287
|
format: e,
|
|
1268
|
-
fileName:
|
|
1288
|
+
fileName: s,
|
|
1269
1289
|
rowCount: o.length,
|
|
1270
1290
|
columnCount: r.length
|
|
1271
1291
|
});
|
|
@@ -1296,23 +1316,23 @@ class vn extends A {
|
|
|
1296
1316
|
return this.lastExportInfo;
|
|
1297
1317
|
}
|
|
1298
1318
|
}
|
|
1299
|
-
function Gt(
|
|
1300
|
-
const { totalRows: e, viewportHeight: t, scrollTop: i, rowHeight: n, overscan: r } =
|
|
1301
|
-
let
|
|
1302
|
-
|
|
1303
|
-
let l =
|
|
1304
|
-
return l > e && (l = e), l === e &&
|
|
1305
|
-
start:
|
|
1319
|
+
function Gt(a) {
|
|
1320
|
+
const { totalRows: e, viewportHeight: t, scrollTop: i, rowHeight: n, overscan: r } = a, o = Math.ceil(t / n);
|
|
1321
|
+
let s = Math.floor(i / n) - r;
|
|
1322
|
+
s < 0 && (s = 0);
|
|
1323
|
+
let l = s + o + r * 2;
|
|
1324
|
+
return l > e && (l = e), l === e && s > 0 && (s = Math.max(0, l - o - r * 2)), {
|
|
1325
|
+
start: s,
|
|
1306
1326
|
end: l,
|
|
1307
|
-
offsetY:
|
|
1327
|
+
offsetY: s * n,
|
|
1308
1328
|
totalHeight: e * n
|
|
1309
1329
|
};
|
|
1310
1330
|
}
|
|
1311
|
-
function Bt(
|
|
1312
|
-
return
|
|
1331
|
+
function Bt(a, e) {
|
|
1332
|
+
return a <= e;
|
|
1313
1333
|
}
|
|
1314
|
-
function Vt(
|
|
1315
|
-
const i =
|
|
1334
|
+
function Vt(a, e, t = !1) {
|
|
1335
|
+
const i = a[e.field];
|
|
1316
1336
|
if (e.operator === "blank")
|
|
1317
1337
|
return i == null || i === "";
|
|
1318
1338
|
if (e.operator === "notBlank")
|
|
@@ -1350,12 +1370,12 @@ function Vt(s, e, t = !1) {
|
|
|
1350
1370
|
return !0;
|
|
1351
1371
|
}
|
|
1352
1372
|
}
|
|
1353
|
-
function Wt(
|
|
1354
|
-
return e.length ?
|
|
1373
|
+
function Wt(a, e, t = !1) {
|
|
1374
|
+
return e.length ? a.filter((i) => e.every((n) => Vt(i, n, t))) : a;
|
|
1355
1375
|
}
|
|
1356
|
-
function $t(
|
|
1376
|
+
function $t(a) {
|
|
1357
1377
|
return JSON.stringify(
|
|
1358
|
-
|
|
1378
|
+
a.map((e) => ({
|
|
1359
1379
|
field: e.field,
|
|
1360
1380
|
operator: e.operator,
|
|
1361
1381
|
value: e.value,
|
|
@@ -1363,9 +1383,9 @@ function $t(s) {
|
|
|
1363
1383
|
}))
|
|
1364
1384
|
);
|
|
1365
1385
|
}
|
|
1366
|
-
function Fe(
|
|
1386
|
+
function Fe(a, e) {
|
|
1367
1387
|
const t = /* @__PURE__ */ new Set();
|
|
1368
|
-
for (const i of
|
|
1388
|
+
for (const i of a) {
|
|
1369
1389
|
const n = i[e];
|
|
1370
1390
|
n != null && t.add(n);
|
|
1371
1391
|
}
|
|
@@ -1451,19 +1471,19 @@ class N extends A {
|
|
|
1451
1471
|
if (!r || !this.isColumnFilterable(r) || q(r)) return;
|
|
1452
1472
|
const o = r.field;
|
|
1453
1473
|
if (!o) return;
|
|
1454
|
-
const
|
|
1474
|
+
const s = this.filters.has(o);
|
|
1455
1475
|
let l = i.querySelector(".tbw-filter-btn");
|
|
1456
1476
|
if (l) {
|
|
1457
1477
|
const u = l.classList.contains("active");
|
|
1458
|
-
if (l.classList.toggle("active",
|
|
1459
|
-
const h =
|
|
1478
|
+
if (l.classList.toggle("active", s), i.classList.toggle("filtered", s), u !== s) {
|
|
1479
|
+
const h = s ? "filterActive" : "filter";
|
|
1460
1480
|
this.setIcon(l, this.resolveIcon(h));
|
|
1461
1481
|
}
|
|
1462
1482
|
return;
|
|
1463
1483
|
}
|
|
1464
1484
|
l = document.createElement("button"), l.className = "tbw-filter-btn", l.setAttribute("aria-label", `Filter ${r.header ?? o}`);
|
|
1465
|
-
const d =
|
|
1466
|
-
this.setIcon(l, this.resolveIcon(d)),
|
|
1485
|
+
const d = s ? "filterActive" : "filter";
|
|
1486
|
+
this.setIcon(l, this.resolveIcon(d)), s && (l.classList.add("active"), i.classList.add("filtered")), l.addEventListener("click", (u) => {
|
|
1467
1487
|
u.stopPropagation(), this.toggleFilterPanel(o, r, l);
|
|
1468
1488
|
});
|
|
1469
1489
|
const c = i.querySelector(".resize-handle");
|
|
@@ -1554,7 +1574,7 @@ class N extends A {
|
|
|
1554
1574
|
renderPanelContent(e, t, i, n) {
|
|
1555
1575
|
let r = this.excludedValues.get(e);
|
|
1556
1576
|
r || (r = /* @__PURE__ */ new Set(), this.excludedValues.set(e, r));
|
|
1557
|
-
const o = this.searchText.get(e) ?? "",
|
|
1577
|
+
const o = this.searchText.get(e) ?? "", s = {
|
|
1558
1578
|
field: e,
|
|
1559
1579
|
column: t,
|
|
1560
1580
|
uniqueValues: n,
|
|
@@ -1572,13 +1592,13 @@ class N extends A {
|
|
|
1572
1592
|
closePanel: () => this.closeFilterPanel()
|
|
1573
1593
|
};
|
|
1574
1594
|
let l = !1;
|
|
1575
|
-
if (this.config.filterPanelRenderer && (this.config.filterPanelRenderer(i,
|
|
1595
|
+
if (this.config.filterPanelRenderer && (this.config.filterPanelRenderer(i, s), l = i.children.length > 0), !l && t.type) {
|
|
1576
1596
|
const d = this.grid.effectiveConfig.typeDefaults?.[t.type];
|
|
1577
|
-
d?.filterPanelRenderer && (d.filterPanelRenderer(i,
|
|
1597
|
+
d?.filterPanelRenderer && (d.filterPanelRenderer(i, s), l = i.children.length > 0);
|
|
1578
1598
|
}
|
|
1579
1599
|
if (!l) {
|
|
1580
1600
|
const d = t.type;
|
|
1581
|
-
d === "number" ? this.renderNumberFilterPanel(i,
|
|
1601
|
+
d === "number" ? this.renderNumberFilterPanel(i, s, n) : d === "date" ? this.renderDateFilterPanel(i, s, n) : this.renderDefaultFilterPanel(i, s, n, r);
|
|
1582
1602
|
}
|
|
1583
1603
|
}
|
|
1584
1604
|
setupPanelCloseHandler(e, t) {
|
|
@@ -1604,8 +1624,8 @@ class N extends A {
|
|
|
1604
1624
|
const n = t.closest(".cell") ?? t;
|
|
1605
1625
|
if (n.style.anchorName = "--tbw-filter-anchor", this.panelAnchorElement = n, N.checkAnchorPositioningSupport()) {
|
|
1606
1626
|
requestAnimationFrame(() => {
|
|
1607
|
-
const o = e.getBoundingClientRect(),
|
|
1608
|
-
o.top <
|
|
1627
|
+
const o = e.getBoundingClientRect(), s = n.getBoundingClientRect();
|
|
1628
|
+
o.top < s.top && e.classList.add("tbw-filter-panel-above");
|
|
1609
1629
|
});
|
|
1610
1630
|
return;
|
|
1611
1631
|
}
|
|
@@ -1616,10 +1636,10 @@ class N extends A {
|
|
|
1616
1636
|
});
|
|
1617
1637
|
}
|
|
1618
1638
|
renderDefaultFilterPanel(e, t, i, n) {
|
|
1619
|
-
const { field: r } = t, o = this.getListItemHeight(),
|
|
1620
|
-
|
|
1639
|
+
const { field: r } = t, o = this.getListItemHeight(), s = document.createElement("div");
|
|
1640
|
+
s.className = "tbw-filter-search";
|
|
1621
1641
|
const l = document.createElement("input");
|
|
1622
|
-
l.type = "text", l.placeholder = "Search...", l.className = "tbw-filter-search-input", l.value = this.searchText.get(r) ?? "",
|
|
1642
|
+
l.type = "text", l.placeholder = "Search...", l.className = "tbw-filter-search-input", l.value = this.searchText.get(r) ?? "", s.appendChild(l), e.appendChild(s);
|
|
1623
1643
|
const d = document.createElement("div");
|
|
1624
1644
|
d.className = "tbw-filter-actions";
|
|
1625
1645
|
const c = document.createElement("label");
|
|
@@ -1724,14 +1744,14 @@ class N extends A {
|
|
|
1724
1744
|
}), F.appendChild(R), e.appendChild(F);
|
|
1725
1745
|
}
|
|
1726
1746
|
renderNumberFilterPanel(e, t, i) {
|
|
1727
|
-
const { field: n, column: r } = t, o = r.filterParams,
|
|
1747
|
+
const { field: n, column: r } = t, o = r.filterParams, s = r.editorParams, l = (k, K) => {
|
|
1728
1748
|
if (typeof k == "number") return k;
|
|
1729
1749
|
if (typeof k == "string") {
|
|
1730
1750
|
const W = parseFloat(k);
|
|
1731
1751
|
return isNaN(W) ? K : W;
|
|
1732
1752
|
}
|
|
1733
1753
|
return K;
|
|
1734
|
-
}, d = i.filter((k) => typeof k == "number" && !isNaN(k)), c = d.length > 0 ? Math.min(...d) : 0, u = d.length > 0 ? Math.max(...d) : 100, h = l(o?.min ??
|
|
1754
|
+
}, d = i.filter((k) => typeof k == "number" && !isNaN(k)), c = d.length > 0 ? Math.min(...d) : 0, u = d.length > 0 ? Math.max(...d) : 100, h = l(o?.min ?? s?.min, c), g = l(o?.max ?? s?.max, u), f = o?.step ?? s?.step ?? 1, p = this.filters.get(n);
|
|
1735
1755
|
let w = h, b = g;
|
|
1736
1756
|
p?.operator === "between" ? (w = l(p.value, h), b = l(p.valueTo, g)) : p?.operator === "greaterThanOrEqual" ? w = l(p.value, h) : p?.operator === "lessThanOrEqual" && (b = l(p.value, g));
|
|
1737
1757
|
const v = document.createElement("div");
|
|
@@ -1790,7 +1810,7 @@ class N extends A {
|
|
|
1790
1810
|
}), H.appendChild(X), e.appendChild(H);
|
|
1791
1811
|
}
|
|
1792
1812
|
renderDateFilterPanel(e, t, i) {
|
|
1793
|
-
const { field: n, column: r } = t, o = r.filterParams,
|
|
1813
|
+
const { field: n, column: r } = t, o = r.filterParams, s = r.editorParams, l = i.filter((m) => m instanceof Date || typeof m == "string" && !isNaN(Date.parse(m))).map((m) => m instanceof Date ? m : new Date(m)).filter((m) => !isNaN(m.getTime())), d = l.length > 0 ? new Date(Math.min(...l.map((m) => m.getTime()))) : null, c = l.length > 0 ? new Date(Math.max(...l.map((m) => m.getTime()))) : null, u = (m) => m ? m.toISOString().split("T")[0] : "", h = (m) => m ? typeof m == "string" ? m : typeof m == "number" ? u(new Date(m)) : "" : "", g = h(o?.min) || h(s?.min) || u(d), f = h(o?.max) || h(s?.max) || u(c), p = this.filters.get(n);
|
|
1794
1814
|
let w = "", b = "";
|
|
1795
1815
|
p?.operator === "between" ? (w = h(p.value) || "", b = h(p.valueTo) || "") : p?.operator === "greaterThanOrEqual" ? w = h(p.value) || "" : p?.operator === "lessThanOrEqual" && (b = h(p.value) || "");
|
|
1796
1816
|
const v = document.createElement("div");
|
|
@@ -1885,28 +1905,28 @@ class N extends A {
|
|
|
1885
1905
|
this.filters.set(e, i), this.cachedResult = null, this.cacheKey = null;
|
|
1886
1906
|
}
|
|
1887
1907
|
}
|
|
1888
|
-
function Ie(
|
|
1889
|
-
if (!
|
|
1890
|
-
const e = /* @__PURE__ */ new Map(), t = [], i = (o,
|
|
1891
|
-
if (!
|
|
1908
|
+
function Ie(a) {
|
|
1909
|
+
if (!a.length) return [];
|
|
1910
|
+
const e = /* @__PURE__ */ new Map(), t = [], i = (o, s) => {
|
|
1911
|
+
if (!s.length) return;
|
|
1892
1912
|
const l = t[t.length - 1];
|
|
1893
1913
|
if (l && l.implicit && l.firstIndex + l.columns.length === o) {
|
|
1894
|
-
l.columns.push(...
|
|
1914
|
+
l.columns.push(...s);
|
|
1895
1915
|
return;
|
|
1896
1916
|
}
|
|
1897
1917
|
t.push({
|
|
1898
1918
|
id: "__implicit__" + o,
|
|
1899
1919
|
label: void 0,
|
|
1900
|
-
columns:
|
|
1920
|
+
columns: s,
|
|
1901
1921
|
firstIndex: o,
|
|
1902
1922
|
implicit: !0
|
|
1903
1923
|
});
|
|
1904
1924
|
};
|
|
1905
1925
|
let n = [], r = 0;
|
|
1906
|
-
return
|
|
1926
|
+
return a.forEach((o, s) => {
|
|
1907
1927
|
const l = o.group;
|
|
1908
1928
|
if (!l) {
|
|
1909
|
-
n.length === 0 && (r =
|
|
1929
|
+
n.length === 0 && (r = s), n.push(o);
|
|
1910
1930
|
return;
|
|
1911
1931
|
}
|
|
1912
1932
|
n.length && (i(r, n.slice()), n = []);
|
|
@@ -1916,40 +1936,40 @@ function Ie(s) {
|
|
|
1916
1936
|
id: d,
|
|
1917
1937
|
label: typeof l == "string" ? void 0 : l.label,
|
|
1918
1938
|
columns: [],
|
|
1919
|
-
firstIndex:
|
|
1939
|
+
firstIndex: s
|
|
1920
1940
|
}, e.set(d, c), t.push(c)), c.columns.push(o);
|
|
1921
|
-
}), n.length && i(r, n), t.length === 1 && t[0].implicit && t[0].columns.length ===
|
|
1941
|
+
}), n.length && i(r, n), t.length === 1 && t[0].implicit && t[0].columns.length === a.length ? [] : t;
|
|
1922
1942
|
}
|
|
1923
|
-
function Yt(
|
|
1924
|
-
if (!e.length || !
|
|
1943
|
+
function Yt(a, e, t) {
|
|
1944
|
+
if (!e.length || !a) return;
|
|
1925
1945
|
const i = /* @__PURE__ */ new Map();
|
|
1926
1946
|
for (const r of e)
|
|
1927
1947
|
for (const o of r.columns)
|
|
1928
1948
|
o.field && i.set(o.field, r.id);
|
|
1929
|
-
const n = Array.from(
|
|
1949
|
+
const n = Array.from(a.querySelectorAll(".cell[data-field]"));
|
|
1930
1950
|
n.forEach((r) => {
|
|
1931
|
-
const o = r.getAttribute("data-field") || "",
|
|
1932
|
-
|
|
1951
|
+
const o = r.getAttribute("data-field") || "", s = i.get(o);
|
|
1952
|
+
s && (r.classList.add("grouped"), r.getAttribute("data-group") || r.setAttribute("data-group", s));
|
|
1933
1953
|
});
|
|
1934
1954
|
for (const r of e) {
|
|
1935
|
-
const o = r.columns[r.columns.length - 1],
|
|
1936
|
-
|
|
1955
|
+
const o = r.columns[r.columns.length - 1], s = n.find((l) => l.getAttribute("data-field") === o.field);
|
|
1956
|
+
s && s.classList.add("group-end");
|
|
1937
1957
|
}
|
|
1938
1958
|
}
|
|
1939
|
-
function Xt(
|
|
1940
|
-
if (
|
|
1959
|
+
function Xt(a, e) {
|
|
1960
|
+
if (a.length === 0) return null;
|
|
1941
1961
|
const t = document.createElement("div");
|
|
1942
1962
|
t.className = "header-group-row", t.setAttribute("role", "row");
|
|
1943
|
-
for (const i of
|
|
1963
|
+
for (const i of a) {
|
|
1944
1964
|
const n = i.columns[0], r = n ? e.findIndex((d) => d.field === n.field) : -1;
|
|
1945
1965
|
if (r === -1) continue;
|
|
1946
|
-
const o = String(i.id).startsWith("__implicit__"),
|
|
1947
|
-
l.className = "cell header-group-cell", o && l.classList.add("implicit-group"), l.setAttribute("data-group", String(i.id)), l.style.gridColumn = `${r + 1} / span ${i.columns.length}`, l.textContent =
|
|
1966
|
+
const o = String(i.id).startsWith("__implicit__"), s = o ? "" : i.label || i.id, l = document.createElement("div");
|
|
1967
|
+
l.className = "cell header-group-cell", o && l.classList.add("implicit-group"), l.setAttribute("data-group", String(i.id)), l.style.gridColumn = `${r + 1} / span ${i.columns.length}`, l.textContent = s, t.appendChild(l);
|
|
1948
1968
|
}
|
|
1949
1969
|
return t;
|
|
1950
1970
|
}
|
|
1951
|
-
function Zt(
|
|
1952
|
-
return
|
|
1971
|
+
function Zt(a) {
|
|
1972
|
+
return a.some((e) => e.group != null);
|
|
1953
1973
|
}
|
|
1954
1974
|
const Qt = "@layer tbw-plugins{.header-group-row{display:grid;grid-auto-flow:column;background:var(--tbw-grouping-columns-header-bg, var(--tbw-color-header-bg));border-bottom:1px solid var(--tbw-grouping-columns-border, var(--tbw-color-border))}.header-group-cell{display:flex;align-items:center;justify-content:center;padding:var(--tbw-button-padding-sm, .25rem .5rem);font-weight:600;font-size:var(--tbw-font-size-sm, .9em);text-transform:uppercase;letter-spacing:.5px;border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-group-cell:last-child{border-right:none}.header-row .cell.grouped{border-top:none}.header-row .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-row .cell.group-end:last-child{border-right:none}.rows .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.rows .cell.group-end:last-child{border-right:none}.header-group-row.no-borders{border-bottom:none}.header-group-row.no-borders .header-group-cell{border-right:none}.header-row.no-group-borders .cell.group-end{border-right:1px solid var(--tbw-color-border)}}";
|
|
1955
1975
|
class yn extends A {
|
|
@@ -1992,11 +2012,11 @@ class yn extends A {
|
|
|
1992
2012
|
if (t && Array.isArray(t) && t.length > 0) {
|
|
1993
2013
|
const r = /* @__PURE__ */ new Map();
|
|
1994
2014
|
for (const o of t)
|
|
1995
|
-
for (const
|
|
1996
|
-
r.set(
|
|
2015
|
+
for (const s of o.children)
|
|
2016
|
+
r.set(s, { id: o.id, label: o.header });
|
|
1997
2017
|
i = e.map((o) => {
|
|
1998
|
-
const
|
|
1999
|
-
return
|
|
2018
|
+
const s = r.get(o.field);
|
|
2019
|
+
return s && !o.group ? { ...o, group: s } : o;
|
|
2000
2020
|
});
|
|
2001
2021
|
} else
|
|
2002
2022
|
i = [...e];
|
|
@@ -2018,8 +2038,8 @@ class yn extends A {
|
|
|
2018
2038
|
const r = Xt(n, i);
|
|
2019
2039
|
if (r) {
|
|
2020
2040
|
r.classList.toggle("no-borders", !this.config.showGroupBorders);
|
|
2021
|
-
const
|
|
2022
|
-
|
|
2041
|
+
const s = e.querySelector(".header-row");
|
|
2042
|
+
s ? e.insertBefore(r, s) : e.appendChild(r);
|
|
2023
2043
|
}
|
|
2024
2044
|
const o = e.querySelector(".header-row");
|
|
2025
2045
|
o && (o.classList.toggle("no-group-borders", !this.config.showGroupBorders), Yt(o, n)), this.#e(n);
|
|
@@ -2053,12 +2073,12 @@ class yn extends A {
|
|
|
2053
2073
|
this.requestRender();
|
|
2054
2074
|
}
|
|
2055
2075
|
}
|
|
2056
|
-
function Pe({ rows:
|
|
2076
|
+
function Pe({ rows: a, config: e, expanded: t, initialExpanded: i }) {
|
|
2057
2077
|
const n = e.groupOn;
|
|
2058
2078
|
if (typeof n != "function")
|
|
2059
2079
|
return [];
|
|
2060
2080
|
const r = { key: "__root__", value: null, depth: -1, rows: [], children: /* @__PURE__ */ new Map() };
|
|
2061
|
-
if (
|
|
2081
|
+
if (a.forEach((d) => {
|
|
2062
2082
|
let c = n(d);
|
|
2063
2083
|
c == null || c === !1 ? c = ["__ungrouped__"] : Array.isArray(c) || (c = [c]);
|
|
2064
2084
|
let u = r;
|
|
@@ -2067,54 +2087,54 @@ function Pe({ rows: s, config: e, expanded: t, initialExpanded: i }) {
|
|
|
2067
2087
|
let w = u.children.get(f);
|
|
2068
2088
|
w || (w = { key: p, value: h, depth: g, rows: [], children: /* @__PURE__ */ new Map(), parent: u }, u.children.set(f, w)), u = w;
|
|
2069
2089
|
}), u.rows.push(d);
|
|
2070
|
-
}), r.children.size === 1 && r.children.has("__ungrouped__") && r.children.get("__ungrouped__").rows.length ===
|
|
2090
|
+
}), r.children.size === 1 && r.children.has("__ungrouped__") && r.children.get("__ungrouped__").rows.length === a.length)
|
|
2071
2091
|
return [];
|
|
2072
|
-
const o = /* @__PURE__ */ new Set([...t, ...i ?? []]),
|
|
2092
|
+
const o = /* @__PURE__ */ new Set([...t, ...i ?? []]), s = [], l = (d) => {
|
|
2073
2093
|
if (d === r) {
|
|
2074
2094
|
d.children.forEach((u) => l(u));
|
|
2075
2095
|
return;
|
|
2076
2096
|
}
|
|
2077
2097
|
const c = o.has(d.key);
|
|
2078
|
-
|
|
2098
|
+
s.push({
|
|
2079
2099
|
kind: "group",
|
|
2080
2100
|
key: d.key,
|
|
2081
2101
|
value: d.value,
|
|
2082
2102
|
depth: d.depth,
|
|
2083
2103
|
rows: d.rows,
|
|
2084
2104
|
expanded: c
|
|
2085
|
-
}), c && (d.children.size ? d.children.forEach((u) => l(u)) : d.rows.forEach((u) =>
|
|
2105
|
+
}), c && (d.children.size ? d.children.forEach((u) => l(u)) : d.rows.forEach((u) => s.push({ kind: "data", row: u, rowIndex: a.indexOf(u) })));
|
|
2086
2106
|
};
|
|
2087
|
-
return l(r),
|
|
2107
|
+
return l(r), s;
|
|
2088
2108
|
}
|
|
2089
|
-
function Jt(
|
|
2090
|
-
const t = new Set(
|
|
2109
|
+
function Jt(a, e) {
|
|
2110
|
+
const t = new Set(a);
|
|
2091
2111
|
return t.has(e) ? t.delete(e) : t.add(e), t;
|
|
2092
2112
|
}
|
|
2093
|
-
function ei(
|
|
2113
|
+
function ei(a) {
|
|
2094
2114
|
const e = /* @__PURE__ */ new Set();
|
|
2095
|
-
for (const t of
|
|
2115
|
+
for (const t of a)
|
|
2096
2116
|
t.kind === "group" && e.add(t.key);
|
|
2097
2117
|
return e;
|
|
2098
2118
|
}
|
|
2099
2119
|
function ti() {
|
|
2100
2120
|
return /* @__PURE__ */ new Set();
|
|
2101
2121
|
}
|
|
2102
|
-
function ii(
|
|
2103
|
-
if (
|
|
2122
|
+
function ii(a, e) {
|
|
2123
|
+
if (a === !0)
|
|
2104
2124
|
return new Set(e);
|
|
2105
|
-
if (
|
|
2125
|
+
if (a === !1 || a == null)
|
|
2106
2126
|
return /* @__PURE__ */ new Set();
|
|
2107
|
-
if (typeof
|
|
2108
|
-
const t = e[
|
|
2127
|
+
if (typeof a == "number") {
|
|
2128
|
+
const t = e[a];
|
|
2109
2129
|
return t ? /* @__PURE__ */ new Set([t]) : /* @__PURE__ */ new Set();
|
|
2110
2130
|
}
|
|
2111
|
-
return typeof
|
|
2131
|
+
return typeof a == "string" ? /* @__PURE__ */ new Set([a]) : Array.isArray(a) ? new Set(a) : /* @__PURE__ */ new Set();
|
|
2112
2132
|
}
|
|
2113
|
-
function ni(
|
|
2114
|
-
return
|
|
2133
|
+
function ni(a) {
|
|
2134
|
+
return a.filter((e) => e.kind === "group").map((e) => e.key);
|
|
2115
2135
|
}
|
|
2116
|
-
function ri(
|
|
2117
|
-
return
|
|
2136
|
+
function ri(a) {
|
|
2137
|
+
return a.kind !== "group" ? 0 : a.rows.length;
|
|
2118
2138
|
}
|
|
2119
2139
|
const oi = "@layer tbw-plugins{.group-row{display:grid;grid-template-columns:var(--tbw-column-template);background:var(--tbw-grouping-rows-bg, var(--tbw-color-panel-bg));font-weight:500;border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height)}.group-row .cell{display:flex;align-items:center;padding:var(--tbw-cell-padding, .125rem .5rem)}.group-row:hover{background:var(--tbw-grouping-rows-bg-hover, var(--tbw-color-row-hover))}.group-toggle{cursor:pointer;user-select:none;display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-toggle-size, 1.25rem);height:var(--tbw-toggle-size, 1.25rem);margin-right:.25rem;background:none;border:0;font:inherit}.group-toggle:hover{background:var(--tbw-grouping-rows-toggle-hover, var(--tbw-color-row-hover));border-radius:var(--tbw-border-radius, .125rem)}.group-label{display:inline-flex;align-items:center;gap:var(--tbw-panel-gap, var(--tbw-spacing-md, .5rem))}.group-count{color:var(--tbw-grouping-rows-count-color, var(--tbw-color-fg-muted));font-size:var(--tbw-font-size-xs, .85em);font-weight:400}.group-aggregates{display:inline-flex;align-items:center;gap:var(--tbw-spacing-lg, 1rem);margin-left:var(--tbw-spacing-lg, 1rem);font-weight:400;font-size:var(--tbw-font-size-sm, .875em);color:var(--tbw-grouping-rows-aggregate-color, var(--tbw-color-fg-muted))}.group-aggregate{white-space:nowrap}.group-row{padding-left:calc(var(--tbw-group-depth, 0) * var(--tbw-group-indent-width, 1.25em))}.data-grid-row.tbw-group-slide-in{animation:tbw-group-slide-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-group-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.data-grid-row.tbw-group-fade-in{animation:tbw-group-fade-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-group-fade-in{0%{opacity:0}to{opacity:1}}}";
|
|
2120
2140
|
class xn extends A {
|
|
@@ -2187,8 +2207,8 @@ class xn extends A {
|
|
|
2187
2207
|
return this.isActive = !1, this.flattenedRows = [], [...e];
|
|
2188
2208
|
let n;
|
|
2189
2209
|
if (!this.hasAppliedDefaultExpanded && this.expandedKeys.size === 0 && t.defaultExpanded !== !1) {
|
|
2190
|
-
const
|
|
2191
|
-
n = ii(t.defaultExpanded ?? !1,
|
|
2210
|
+
const s = ni(i);
|
|
2211
|
+
n = ii(t.defaultExpanded ?? !1, s), n.size > 0 && (this.expandedKeys = new Set(n), this.hasAppliedDefaultExpanded = !0);
|
|
2192
2212
|
}
|
|
2193
2213
|
const r = Pe({
|
|
2194
2214
|
rows: [...e],
|
|
@@ -2198,20 +2218,20 @@ class xn extends A {
|
|
|
2198
2218
|
});
|
|
2199
2219
|
this.isActive = !0, this.flattenedRows = r, this.keysToAnimate.clear();
|
|
2200
2220
|
const o = /* @__PURE__ */ new Set();
|
|
2201
|
-
return r.forEach((
|
|
2202
|
-
if (
|
|
2221
|
+
return r.forEach((s, l) => {
|
|
2222
|
+
if (s.kind === "data") {
|
|
2203
2223
|
const d = `data-${l}`;
|
|
2204
2224
|
o.add(d), this.previousVisibleKeys.has(d) || this.keysToAnimate.add(d);
|
|
2205
2225
|
}
|
|
2206
|
-
}), this.previousVisibleKeys = o, r.map((
|
|
2226
|
+
}), this.previousVisibleKeys = o, r.map((s) => s.kind === "group" ? {
|
|
2207
2227
|
__isGroupRow: !0,
|
|
2208
|
-
__groupKey:
|
|
2209
|
-
__groupValue:
|
|
2210
|
-
__groupDepth:
|
|
2211
|
-
__groupRows:
|
|
2212
|
-
__groupExpanded:
|
|
2213
|
-
__groupRowCount: ri(
|
|
2214
|
-
} :
|
|
2228
|
+
__groupKey: s.key,
|
|
2229
|
+
__groupValue: s.value,
|
|
2230
|
+
__groupDepth: s.depth,
|
|
2231
|
+
__groupRows: s.rows,
|
|
2232
|
+
__groupExpanded: s.expanded,
|
|
2233
|
+
__groupRowCount: ri(s)
|
|
2234
|
+
} : s.row);
|
|
2215
2235
|
}
|
|
2216
2236
|
onCellClick(e) {
|
|
2217
2237
|
const t = e.row;
|
|
@@ -2229,7 +2249,7 @@ class xn extends A {
|
|
|
2229
2249
|
return !1;
|
|
2230
2250
|
const n = this.config;
|
|
2231
2251
|
if (n.groupRowRenderer) {
|
|
2232
|
-
const
|
|
2252
|
+
const s = () => {
|
|
2233
2253
|
this.toggle(e.__groupKey);
|
|
2234
2254
|
}, l = n.groupRowRenderer({
|
|
2235
2255
|
key: e.__groupKey,
|
|
@@ -2237,7 +2257,7 @@ class xn extends A {
|
|
|
2237
2257
|
depth: e.__groupDepth,
|
|
2238
2258
|
rows: e.__groupRows,
|
|
2239
2259
|
expanded: e.__groupExpanded,
|
|
2240
|
-
toggleExpand:
|
|
2260
|
+
toggleExpand: s
|
|
2241
2261
|
});
|
|
2242
2262
|
if (l)
|
|
2243
2263
|
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;
|
|
@@ -2270,12 +2290,12 @@ class xn extends A {
|
|
|
2270
2290
|
return n.formatLabel ? n.formatLabel(e, t, i) : String(e);
|
|
2271
2291
|
}
|
|
2272
2292
|
renderFullWidthGroupRow(e, t, i) {
|
|
2273
|
-
const n = this.config, r = n.aggregators ?? {}, o = e.__groupRows ?? [],
|
|
2274
|
-
|
|
2293
|
+
const n = this.config, r = n.aggregators ?? {}, o = e.__groupRows ?? [], s = document.createElement("div");
|
|
2294
|
+
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, i));
|
|
2275
2295
|
const l = document.createElement("span");
|
|
2276
|
-
if (l.className = "group-label", l.textContent = this.getGroupLabelText(e.__groupValue, e.__groupDepth || 0, e.__groupKey),
|
|
2296
|
+
if (l.className = "group-label", l.textContent = this.getGroupLabelText(e.__groupValue, e.__groupDepth || 0, e.__groupKey), s.appendChild(l), n.showRowCount !== !1) {
|
|
2277
2297
|
const c = document.createElement("span");
|
|
2278
|
-
c.className = "group-count", c.textContent = `(${e.__groupRowCount ?? e.__groupRows?.length ?? 0})`,
|
|
2298
|
+
c.className = "group-count", c.textContent = `(${e.__groupRowCount ?? e.__groupRows?.length ?? 0})`, s.appendChild(c);
|
|
2279
2299
|
}
|
|
2280
2300
|
const d = Object.entries(r);
|
|
2281
2301
|
if (d.length > 0) {
|
|
@@ -2290,12 +2310,12 @@ class xn extends A {
|
|
|
2290
2310
|
p.textContent = `${w}: ${f}`, c.appendChild(p);
|
|
2291
2311
|
}
|
|
2292
2312
|
}
|
|
2293
|
-
c.children.length > 0 &&
|
|
2313
|
+
c.children.length > 0 && s.appendChild(c);
|
|
2294
2314
|
}
|
|
2295
|
-
t.appendChild(
|
|
2315
|
+
t.appendChild(s);
|
|
2296
2316
|
}
|
|
2297
2317
|
renderPerColumnGroupRow(e, t, i) {
|
|
2298
|
-
const n = this.config, r = n.aggregators ?? {}, o = this.columns,
|
|
2318
|
+
const n = this.config, r = n.aggregators ?? {}, o = this.columns, s = e.__groupRows ?? [], d = this.gridElement?.querySelector(".body")?.style.gridTemplateColumns || "";
|
|
2299
2319
|
d && (t.style.display = "grid", t.style.gridTemplateColumns = d);
|
|
2300
2320
|
let c = !1;
|
|
2301
2321
|
o.forEach((u, h) => {
|
|
@@ -2307,7 +2327,7 @@ class xn extends A {
|
|
|
2307
2327
|
if (c) {
|
|
2308
2328
|
const f = r[u.field];
|
|
2309
2329
|
if (f) {
|
|
2310
|
-
const p = ee(f,
|
|
2330
|
+
const p = ee(f, s, u.field, u);
|
|
2311
2331
|
g.textContent = p != null ? String(p) : "";
|
|
2312
2332
|
} else
|
|
2313
2333
|
g.textContent = "";
|
|
@@ -2315,13 +2335,13 @@ class xn extends A {
|
|
|
2315
2335
|
c = !0, g.appendChild(this.createToggleButton(e.__groupExpanded, i));
|
|
2316
2336
|
const f = document.createElement("span"), p = r[u.field];
|
|
2317
2337
|
if (p) {
|
|
2318
|
-
const w = ee(p,
|
|
2338
|
+
const w = ee(p, s, u.field, u);
|
|
2319
2339
|
f.textContent = w != null ? String(w) : String(e.__groupValue);
|
|
2320
2340
|
} else
|
|
2321
2341
|
f.textContent = this.getGroupLabelText(e.__groupValue, e.__groupDepth || 0, e.__groupKey);
|
|
2322
2342
|
if (g.appendChild(f), n.showRowCount !== !1) {
|
|
2323
2343
|
const w = document.createElement("span");
|
|
2324
|
-
w.className = "group-count", w.textContent = ` (${
|
|
2344
|
+
w.className = "group-count", w.textContent = ` (${s.length})`, g.appendChild(w);
|
|
2325
2345
|
}
|
|
2326
2346
|
}
|
|
2327
2347
|
t.appendChild(g);
|
|
@@ -2341,8 +2361,8 @@ class xn extends A {
|
|
|
2341
2361
|
if (e.startsWith(o + "||") || o.startsWith(e + "||"))
|
|
2342
2362
|
e.startsWith(o + "||") && r.add(o);
|
|
2343
2363
|
else {
|
|
2344
|
-
const
|
|
2345
|
-
|
|
2364
|
+
const s = this.flattenedRows.find((l) => l.kind === "group" && l.key === o);
|
|
2365
|
+
s && s.depth !== n.depth && r.add(o);
|
|
2346
2366
|
}
|
|
2347
2367
|
r.add(e), this.expandedKeys = r;
|
|
2348
2368
|
} else
|
|
@@ -2396,27 +2416,27 @@ class xn extends A {
|
|
|
2396
2416
|
this.config.groupOn = e, this.requestRender();
|
|
2397
2417
|
}
|
|
2398
2418
|
}
|
|
2399
|
-
function De(
|
|
2400
|
-
const t = new Set(
|
|
2419
|
+
function De(a, e) {
|
|
2420
|
+
const t = new Set(a);
|
|
2401
2421
|
return t.has(e) ? t.delete(e) : t.add(e), t;
|
|
2402
2422
|
}
|
|
2403
|
-
function si(
|
|
2404
|
-
const t = new Set(
|
|
2423
|
+
function si(a, e) {
|
|
2424
|
+
const t = new Set(a);
|
|
2405
2425
|
return t.add(e), t;
|
|
2406
2426
|
}
|
|
2407
|
-
function ai(
|
|
2408
|
-
const t = new Set(
|
|
2427
|
+
function ai(a, e) {
|
|
2428
|
+
const t = new Set(a);
|
|
2409
2429
|
return t.delete(e), t;
|
|
2410
2430
|
}
|
|
2411
|
-
function li(
|
|
2412
|
-
return
|
|
2431
|
+
function li(a, e) {
|
|
2432
|
+
return a.has(e);
|
|
2413
2433
|
}
|
|
2414
|
-
function di(
|
|
2434
|
+
function di(a, e, t, i) {
|
|
2415
2435
|
const n = document.createElement("div");
|
|
2416
2436
|
n.className = "master-detail-row", n.setAttribute("data-detail-for", String(e)), n.setAttribute("role", "row");
|
|
2417
2437
|
const r = document.createElement("div");
|
|
2418
2438
|
r.className = "master-detail-cell", r.setAttribute("role", "cell"), r.style.gridColumn = `1 / ${i + 1}`;
|
|
2419
|
-
const o = t(
|
|
2439
|
+
const o = t(a, e);
|
|
2420
2440
|
return typeof o == "string" ? r.innerHTML = o : o instanceof HTMLElement && r.appendChild(o), n.appendChild(r), n;
|
|
2421
2441
|
}
|
|
2422
2442
|
const ci = "@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}}}";
|
|
@@ -2447,8 +2467,8 @@ class nt extends A {
|
|
|
2447
2467
|
return;
|
|
2448
2468
|
}
|
|
2449
2469
|
}
|
|
2450
|
-
const n = t.getAttribute("animation"), r = t.getAttribute("show-expand-column"), o = t.getAttribute("expand-on-row-click"),
|
|
2451
|
-
n !== null && (d.animation = n === "false" ? !1 : n), r !== null && (d.showExpandColumn = r !== "false"), o !== null && (d.expandOnRowClick = o === "true"),
|
|
2470
|
+
const n = t.getAttribute("animation"), r = t.getAttribute("show-expand-column"), o = t.getAttribute("expand-on-row-click"), s = t.getAttribute("collapse-on-click-outside"), l = t.getAttribute("height"), d = {};
|
|
2471
|
+
n !== null && (d.animation = n === "false" ? !1 : n), r !== null && (d.showExpandColumn = r !== "false"), o !== null && (d.expandOnRowClick = o === "true"), s !== null && (d.collapseOnClickOutside = s === "true"), l !== null && (d.detailHeight = l === "auto" ? "auto" : parseInt(l, 10));
|
|
2452
2472
|
const c = t.innerHTML.trim();
|
|
2453
2473
|
c && !this.config.detailRenderer && (d.detailRenderer = (u, h) => {
|
|
2454
2474
|
const g = Je(c, { value: u, row: u });
|
|
@@ -2503,7 +2523,7 @@ class nt extends A {
|
|
|
2503
2523
|
return i;
|
|
2504
2524
|
const r = vt(this.name);
|
|
2505
2525
|
return r.viewRenderer = (o) => {
|
|
2506
|
-
const { row:
|
|
2526
|
+
const { row: s } = o, l = this.expandedRows.has(s), d = document.createElement("span");
|
|
2507
2527
|
d.className = "master-detail-expander expander-cell";
|
|
2508
2528
|
const c = document.createElement("span");
|
|
2509
2529
|
return c.className = `master-detail-toggle${l ? " expanded" : ""}`, this.setIcon(c, this.resolveIcon(l ? "collapse" : "expand")), c.setAttribute("role", "button"), c.setAttribute("tabindex", "0"), c.setAttribute("aria-expanded", String(l)), c.setAttribute("aria-label", l ? "Collapse details" : "Expand details"), d.appendChild(c), d;
|
|
@@ -2538,24 +2558,24 @@ class nt extends A {
|
|
|
2538
2558
|
if (!e) return;
|
|
2539
2559
|
const t = /* @__PURE__ */ new Map(), i = e.querySelectorAll(".data-grid-row"), n = this.columns.length;
|
|
2540
2560
|
for (const o of i) {
|
|
2541
|
-
const
|
|
2561
|
+
const s = o.querySelector(".cell[data-row]"), l = s ? parseInt(s.getAttribute("data-row") ?? "-1", 10) : -1;
|
|
2542
2562
|
l >= 0 && t.set(l, o);
|
|
2543
2563
|
}
|
|
2544
2564
|
const r = e.querySelectorAll(".master-detail-row");
|
|
2545
2565
|
for (const o of r) {
|
|
2546
|
-
const
|
|
2566
|
+
const s = parseInt(o.getAttribute("data-detail-for") ?? "-1", 10), l = s >= 0 ? this.rows[s] : void 0, d = l && this.expandedRows.has(l), c = t.has(s);
|
|
2547
2567
|
(!d || !c) && (o.remove(), l && this.detailElements.delete(l));
|
|
2548
2568
|
}
|
|
2549
|
-
for (const [o,
|
|
2569
|
+
for (const [o, s] of t) {
|
|
2550
2570
|
const l = this.rows[o];
|
|
2551
2571
|
if (!l || !this.expandedRows.has(l)) continue;
|
|
2552
2572
|
const d = this.detailElements.get(l);
|
|
2553
2573
|
if (d) {
|
|
2554
|
-
d.previousElementSibling !==
|
|
2574
|
+
d.previousElementSibling !== s && s.after(d);
|
|
2555
2575
|
continue;
|
|
2556
2576
|
}
|
|
2557
2577
|
const c = di(l, o, this.config.detailRenderer, n);
|
|
2558
|
-
typeof this.config.detailHeight == "number" && (c.style.height = `${this.config.detailHeight}px`),
|
|
2578
|
+
typeof this.config.detailHeight == "number" && (c.style.height = `${this.config.detailHeight}px`), s.after(c), this.detailElements.set(l, c), this.animateExpand(c);
|
|
2559
2579
|
}
|
|
2560
2580
|
}
|
|
2561
2581
|
getExtraHeight() {
|
|
@@ -2575,15 +2595,15 @@ class nt extends A {
|
|
|
2575
2595
|
adjustVirtualStart(e, t, i) {
|
|
2576
2596
|
if (this.expandedRows.size === 0) return e;
|
|
2577
2597
|
const n = [];
|
|
2578
|
-
for (const
|
|
2579
|
-
const l = this.rows.indexOf(
|
|
2580
|
-
l >= 0 && n.push({ index: l, row:
|
|
2598
|
+
for (const s of this.expandedRows) {
|
|
2599
|
+
const l = this.rows.indexOf(s);
|
|
2600
|
+
l >= 0 && n.push({ index: l, row: s });
|
|
2581
2601
|
}
|
|
2582
|
-
n.sort((
|
|
2602
|
+
n.sort((s, l) => s.index - l.index);
|
|
2583
2603
|
let r = e, o = 0;
|
|
2584
|
-
for (const { index:
|
|
2585
|
-
const d =
|
|
2586
|
-
o += c, !(
|
|
2604
|
+
for (const { index: s, row: l } of n) {
|
|
2605
|
+
const d = s * i + o, c = this.getDetailHeight(l), u = d + i + c;
|
|
2606
|
+
o += c, !(s >= e) && u > t && s < r && (r = s);
|
|
2587
2607
|
}
|
|
2588
2608
|
return r;
|
|
2589
2609
|
}
|
|
@@ -2631,29 +2651,29 @@ class nt extends A {
|
|
|
2631
2651
|
}
|
|
2632
2652
|
}
|
|
2633
2653
|
}
|
|
2634
|
-
function ui(
|
|
2635
|
-
return e.length ? [...
|
|
2654
|
+
function ui(a, e, t) {
|
|
2655
|
+
return e.length ? [...a].sort((i, n) => {
|
|
2636
2656
|
for (const r of e) {
|
|
2637
|
-
const
|
|
2657
|
+
const s = t.find((u) => u.field === r.field)?.sortComparator ?? hi, l = i[r.field], d = n[r.field], c = s(l, d, i, n);
|
|
2638
2658
|
if (c !== 0)
|
|
2639
2659
|
return r.direction === "asc" ? c : -c;
|
|
2640
2660
|
}
|
|
2641
2661
|
return 0;
|
|
2642
|
-
}) : [...
|
|
2662
|
+
}) : [...a];
|
|
2643
2663
|
}
|
|
2644
|
-
function hi(
|
|
2645
|
-
return
|
|
2664
|
+
function hi(a, e) {
|
|
2665
|
+
return a == null && e == null ? 0 : a == null ? 1 : e == null ? -1 : typeof a == "number" && typeof e == "number" ? a - e : a instanceof Date && e instanceof Date ? a.getTime() - e.getTime() : typeof a == "boolean" && typeof e == "boolean" ? a === e ? 0 : a ? -1 : 1 : String(a).localeCompare(String(e));
|
|
2646
2666
|
}
|
|
2647
|
-
function gi(
|
|
2648
|
-
const n =
|
|
2649
|
-
return t ? n ? n.direction === "asc" ?
|
|
2667
|
+
function gi(a, e, t, i) {
|
|
2668
|
+
const n = a.find((r) => r.field === e);
|
|
2669
|
+
return t ? n ? n.direction === "asc" ? a.map((r) => r.field === e ? { ...r, direction: "desc" } : r) : a.filter((r) => r.field !== e) : a.length < i ? [...a, { field: e, direction: "asc" }] : a : n?.direction === "asc" ? [{ field: e, direction: "desc" }] : n?.direction === "desc" ? [] : [{ field: e, direction: "asc" }];
|
|
2650
2670
|
}
|
|
2651
|
-
function Me(
|
|
2652
|
-
const t =
|
|
2671
|
+
function Me(a, e) {
|
|
2672
|
+
const t = a.findIndex((i) => i.field === e);
|
|
2653
2673
|
return t >= 0 ? t + 1 : void 0;
|
|
2654
2674
|
}
|
|
2655
|
-
function Ne(
|
|
2656
|
-
return
|
|
2675
|
+
function Ne(a, e) {
|
|
2676
|
+
return a.find((t) => t.field === e)?.direction;
|
|
2657
2677
|
}
|
|
2658
2678
|
const fi = '@layer tbw-plugins{.header-cell[data-sort=asc]:after{content:"↑";margin-left:var(--tbw-spacing-xs, .25em);opacity:.8}.header-cell[data-sort=desc]:after{content:"↓";margin-left:var(--tbw-spacing-xs, .25em);opacity:.8}.sort-indicator{margin-left:var(--tbw-spacing-xs, .25em);opacity:.8}.sort-index{font-size:var(--tbw-font-size-2xs, .7em);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:var(--tbw-multi-sort-badge-size, 1em);height:var(--tbw-multi-sort-badge-size, 1em);display:inline-flex;align-items:center;justify-content:center;margin-left:var(--tbw-spacing-xs, .125em);font-weight:600}}';
|
|
2659
2679
|
class Cn extends A {
|
|
@@ -2684,11 +2704,11 @@ class Cn extends A {
|
|
|
2684
2704
|
e.querySelectorAll(".header-row .cell[data-field]").forEach((n) => {
|
|
2685
2705
|
const r = n.getAttribute("data-field");
|
|
2686
2706
|
if (!r) return;
|
|
2687
|
-
const o = Me(this.sortModel, r),
|
|
2688
|
-
if (n.querySelector(".sort-index")?.remove(),
|
|
2689
|
-
n.querySelector('[part~="sort-indicator"], .sort-indicator')?.remove(), n.setAttribute("data-sort",
|
|
2707
|
+
const o = Me(this.sortModel, r), s = Ne(this.sortModel, r);
|
|
2708
|
+
if (n.querySelector(".sort-index")?.remove(), s) {
|
|
2709
|
+
n.querySelector('[part~="sort-indicator"], .sort-indicator')?.remove(), n.setAttribute("data-sort", s);
|
|
2690
2710
|
const c = document.createElement("span");
|
|
2691
|
-
c.className = "sort-indicator", this.setIcon(c, this.resolveIcon(
|
|
2711
|
+
c.className = "sort-indicator", this.setIcon(c, this.resolveIcon(s === "asc" ? "sortAsc" : "sortDesc"));
|
|
2692
2712
|
const u = n.querySelector(".tbw-filter-btn"), h = n.querySelector(".resize-handle"), g = u ?? h;
|
|
2693
2713
|
if (g ? n.insertBefore(c, g) : n.appendChild(c), t && this.sortModel.length > 1 && o !== void 0) {
|
|
2694
2714
|
const f = document.createElement("span");
|
|
@@ -2734,54 +2754,54 @@ class Cn extends A {
|
|
|
2734
2754
|
i !== -1 ? this.sortModel[i] = n : this.sortModel.splice(t.sort.priority, 0, n);
|
|
2735
2755
|
}
|
|
2736
2756
|
}
|
|
2737
|
-
function rt(
|
|
2738
|
-
return ft(
|
|
2757
|
+
function rt(a, e) {
|
|
2758
|
+
return ft(a, e);
|
|
2739
2759
|
}
|
|
2740
|
-
function ot(
|
|
2741
|
-
const t =
|
|
2760
|
+
function ot(a, e) {
|
|
2761
|
+
const t = a.sticky;
|
|
2742
2762
|
return t ? rt(t, e) === "left" : !1;
|
|
2743
2763
|
}
|
|
2744
|
-
function st(
|
|
2745
|
-
const t =
|
|
2764
|
+
function st(a, e) {
|
|
2765
|
+
const t = a.sticky;
|
|
2746
2766
|
return t ? rt(t, e) === "right" : !1;
|
|
2747
2767
|
}
|
|
2748
|
-
function pi(
|
|
2749
|
-
return
|
|
2768
|
+
function pi(a, e = "ltr") {
|
|
2769
|
+
return a.filter((t) => ot(t, e));
|
|
2750
2770
|
}
|
|
2751
|
-
function mi(
|
|
2752
|
-
return
|
|
2771
|
+
function mi(a, e = "ltr") {
|
|
2772
|
+
return a.filter((t) => st(t, e));
|
|
2753
2773
|
}
|
|
2754
|
-
function se(
|
|
2755
|
-
return
|
|
2774
|
+
function se(a) {
|
|
2775
|
+
return a.some(
|
|
2756
2776
|
(e) => e.sticky === "left" || e.sticky === "right" || e.sticky === "start" || e.sticky === "end"
|
|
2757
2777
|
);
|
|
2758
2778
|
}
|
|
2759
|
-
function qe(
|
|
2760
|
-
const t = Array.from(
|
|
2779
|
+
function qe(a, e) {
|
|
2780
|
+
const t = Array.from(a.querySelectorAll(".header-row .cell"));
|
|
2761
2781
|
if (!t.length) return;
|
|
2762
|
-
const i = ue(
|
|
2763
|
-
e.forEach((
|
|
2764
|
-
|
|
2782
|
+
const i = ue(a), n = /* @__PURE__ */ new Map();
|
|
2783
|
+
e.forEach((s, l) => {
|
|
2784
|
+
s.field && n.set(s.field, l);
|
|
2765
2785
|
});
|
|
2766
2786
|
let r = 0;
|
|
2767
|
-
for (const
|
|
2768
|
-
if (ot(
|
|
2769
|
-
const l = n.get(
|
|
2770
|
-
d && (d.classList.add("sticky-left"), d.style.position = "sticky", d.style.left = r + "px", l !== void 0 &&
|
|
2787
|
+
for (const s of e)
|
|
2788
|
+
if (ot(s, i)) {
|
|
2789
|
+
const l = n.get(s.field), d = t.find((c) => c.getAttribute("data-field") === s.field);
|
|
2790
|
+
d && (d.classList.add("sticky-left"), d.style.position = "sticky", d.style.left = r + "px", l !== void 0 && a.querySelectorAll(`.data-grid-row .cell[data-col="${l}"]`).forEach((c) => {
|
|
2771
2791
|
c.classList.add("sticky-left"), c.style.position = "sticky", c.style.left = r + "px";
|
|
2772
2792
|
}), r += d.offsetWidth);
|
|
2773
2793
|
}
|
|
2774
2794
|
let o = 0;
|
|
2775
|
-
for (const
|
|
2776
|
-
if (st(
|
|
2777
|
-
const l = n.get(
|
|
2778
|
-
d && (d.classList.add("sticky-right"), d.style.position = "sticky", d.style.right = o + "px", l !== void 0 &&
|
|
2795
|
+
for (const s of [...e].reverse())
|
|
2796
|
+
if (st(s, i)) {
|
|
2797
|
+
const l = n.get(s.field), d = t.find((c) => c.getAttribute("data-field") === s.field);
|
|
2798
|
+
d && (d.classList.add("sticky-right"), d.style.position = "sticky", d.style.right = o + "px", l !== void 0 && a.querySelectorAll(`.data-grid-row .cell[data-col="${l}"]`).forEach((c) => {
|
|
2779
2799
|
c.classList.add("sticky-right"), c.style.position = "sticky", c.style.right = o + "px";
|
|
2780
2800
|
}), o += d.offsetWidth);
|
|
2781
2801
|
}
|
|
2782
2802
|
}
|
|
2783
|
-
function He(
|
|
2784
|
-
|
|
2803
|
+
function He(a) {
|
|
2804
|
+
a.querySelectorAll(".sticky-left, .sticky-right").forEach((t) => {
|
|
2785
2805
|
t.classList.remove("sticky-left", "sticky-right"), t.style.position = "", t.style.left = "", t.style.right = "";
|
|
2786
2806
|
});
|
|
2787
2807
|
}
|
|
@@ -2874,10 +2894,10 @@ class En extends A {
|
|
|
2874
2894
|
return;
|
|
2875
2895
|
let i = 0, n = 0;
|
|
2876
2896
|
if (e) {
|
|
2877
|
-
const o = e.querySelectorAll(".sticky-left"),
|
|
2897
|
+
const o = e.querySelectorAll(".sticky-left"), s = e.querySelectorAll(".sticky-right");
|
|
2878
2898
|
o.forEach((l) => {
|
|
2879
2899
|
i += l.offsetWidth;
|
|
2880
|
-
}),
|
|
2900
|
+
}), s.forEach((l) => {
|
|
2881
2901
|
n += l.offsetWidth;
|
|
2882
2902
|
});
|
|
2883
2903
|
} else
|
|
@@ -2888,10 +2908,10 @@ class En extends A {
|
|
|
2888
2908
|
return { left: i, right: n, skipScroll: r };
|
|
2889
2909
|
}
|
|
2890
2910
|
}
|
|
2891
|
-
function wi(
|
|
2892
|
-
return typeof
|
|
2911
|
+
function wi(a) {
|
|
2912
|
+
return typeof a == "object" && a !== null && "aggFunc" in a;
|
|
2893
2913
|
}
|
|
2894
|
-
function ae(
|
|
2914
|
+
function ae(a, e) {
|
|
2895
2915
|
const t = document.createElement("div");
|
|
2896
2916
|
t.className = "tbw-pinned-rows", t.setAttribute("role", "presentation"), t.setAttribute("aria-live", "polite");
|
|
2897
2917
|
const i = document.createElement("div");
|
|
@@ -2899,41 +2919,41 @@ function ae(s, e) {
|
|
|
2899
2919
|
const n = document.createElement("div");
|
|
2900
2920
|
n.className = "tbw-pinned-rows-center";
|
|
2901
2921
|
const r = document.createElement("div");
|
|
2902
|
-
if (r.className = "tbw-pinned-rows-right",
|
|
2922
|
+
if (r.className = "tbw-pinned-rows-right", a.showRowCount !== !1) {
|
|
2903
2923
|
const o = document.createElement("span");
|
|
2904
2924
|
o.className = "tbw-status-panel tbw-status-panel-row-count", o.textContent = `Total: ${e.totalRows} rows`, i.appendChild(o);
|
|
2905
2925
|
}
|
|
2906
|
-
if (
|
|
2926
|
+
if (a.showFilteredCount && e.filteredRows !== e.totalRows) {
|
|
2907
2927
|
const o = document.createElement("span");
|
|
2908
2928
|
o.className = "tbw-status-panel tbw-status-panel-filtered-count", o.textContent = `Filtered: ${e.filteredRows}`, i.appendChild(o);
|
|
2909
2929
|
}
|
|
2910
|
-
if (
|
|
2930
|
+
if (a.showSelectedCount && e.selectedRows > 0) {
|
|
2911
2931
|
const o = document.createElement("span");
|
|
2912
2932
|
o.className = "tbw-status-panel tbw-status-panel-selected-count", o.textContent = `Selected: ${e.selectedRows}`, r.appendChild(o);
|
|
2913
2933
|
}
|
|
2914
|
-
if (
|
|
2915
|
-
for (const o of
|
|
2916
|
-
const
|
|
2934
|
+
if (a.customPanels)
|
|
2935
|
+
for (const o of a.customPanels) {
|
|
2936
|
+
const s = bi(o, e);
|
|
2917
2937
|
switch (o.position) {
|
|
2918
2938
|
case "left":
|
|
2919
|
-
i.appendChild(
|
|
2939
|
+
i.appendChild(s);
|
|
2920
2940
|
break;
|
|
2921
2941
|
case "center":
|
|
2922
|
-
n.appendChild(
|
|
2942
|
+
n.appendChild(s);
|
|
2923
2943
|
break;
|
|
2924
2944
|
case "right":
|
|
2925
|
-
r.appendChild(
|
|
2945
|
+
r.appendChild(s);
|
|
2926
2946
|
break;
|
|
2927
2947
|
}
|
|
2928
2948
|
}
|
|
2929
2949
|
return t.appendChild(i), t.appendChild(n), t.appendChild(r), t;
|
|
2930
2950
|
}
|
|
2931
|
-
function ze(
|
|
2951
|
+
function ze(a) {
|
|
2932
2952
|
const e = document.createElement("div");
|
|
2933
|
-
return e.className = `tbw-aggregation-rows tbw-aggregation-rows-${
|
|
2953
|
+
return e.className = `tbw-aggregation-rows tbw-aggregation-rows-${a}`, e.setAttribute("role", "presentation"), e;
|
|
2934
2954
|
}
|
|
2935
|
-
function Oe(
|
|
2936
|
-
|
|
2955
|
+
function Oe(a, e, t, i) {
|
|
2956
|
+
a.innerHTML = "";
|
|
2937
2957
|
for (const n of e) {
|
|
2938
2958
|
const r = document.createElement("div");
|
|
2939
2959
|
if (r.className = "tbw-aggregation-row", r.setAttribute("role", "presentation"), n.id && r.setAttribute("data-aggregation-id", n.id), n.fullWidth) {
|
|
@@ -2941,8 +2961,8 @@ function Oe(s, e, t, i) {
|
|
|
2941
2961
|
o.className = "tbw-aggregation-cell tbw-aggregation-cell-full", o.style.gridColumn = "1 / -1", o.textContent = n.label || "", r.appendChild(o);
|
|
2942
2962
|
} else
|
|
2943
2963
|
for (const o of t) {
|
|
2944
|
-
const
|
|
2945
|
-
|
|
2964
|
+
const s = document.createElement("div");
|
|
2965
|
+
s.className = "tbw-aggregation-cell", s.setAttribute("data-field", o.field);
|
|
2946
2966
|
let l, d;
|
|
2947
2967
|
const c = n.aggregators?.[o.field];
|
|
2948
2968
|
if (c)
|
|
@@ -2957,24 +2977,24 @@ function Oe(s, e, t, i) {
|
|
|
2957
2977
|
const u = n.cells[o.field];
|
|
2958
2978
|
typeof u == "function" ? l = u(i, o.field, o) : l = u;
|
|
2959
2979
|
}
|
|
2960
|
-
l != null ?
|
|
2980
|
+
l != null ? s.textContent = d ? d(l, o.field, o) : String(l) : s.textContent = "", r.appendChild(s);
|
|
2961
2981
|
}
|
|
2962
|
-
|
|
2982
|
+
a.appendChild(r);
|
|
2963
2983
|
}
|
|
2964
2984
|
}
|
|
2965
|
-
function bi(
|
|
2985
|
+
function bi(a, e) {
|
|
2966
2986
|
const t = document.createElement("div");
|
|
2967
|
-
t.className = "tbw-status-panel tbw-status-panel-custom", t.id = `status-panel-${
|
|
2968
|
-
const i =
|
|
2987
|
+
t.className = "tbw-status-panel tbw-status-panel-custom", t.id = `status-panel-${a.id}`;
|
|
2988
|
+
const i = a.render(e);
|
|
2969
2989
|
return typeof i == "string" ? t.innerHTML = i : t.appendChild(i), t;
|
|
2970
2990
|
}
|
|
2971
|
-
function Ge(
|
|
2991
|
+
function Ge(a, e, t, i, n) {
|
|
2972
2992
|
return {
|
|
2973
|
-
totalRows:
|
|
2974
|
-
filteredRows: n?.cachedResult?.length ??
|
|
2993
|
+
totalRows: a.length,
|
|
2994
|
+
filteredRows: n?.cachedResult?.length ?? a.length,
|
|
2975
2995
|
selectedRows: i?.selected?.size ?? 0,
|
|
2976
2996
|
columns: e,
|
|
2977
|
-
rows:
|
|
2997
|
+
rows: a,
|
|
2978
2998
|
grid: t
|
|
2979
2999
|
};
|
|
2980
3000
|
}
|
|
@@ -3009,8 +3029,8 @@ class Rn extends A {
|
|
|
3009
3029
|
this.grid,
|
|
3010
3030
|
i,
|
|
3011
3031
|
n
|
|
3012
|
-
), o = this.config.aggregationRows || [],
|
|
3013
|
-
if (
|
|
3032
|
+
), o = this.config.aggregationRows || [], s = o.filter((h) => h.position === "top"), l = o.filter((h) => h.position !== "top");
|
|
3033
|
+
if (s.length > 0) {
|
|
3014
3034
|
if (!this.topAggregationContainer) {
|
|
3015
3035
|
this.topAggregationContainer = ze("top");
|
|
3016
3036
|
const h = e.querySelector(".header");
|
|
@@ -3018,7 +3038,7 @@ class Rn extends A {
|
|
|
3018
3038
|
}
|
|
3019
3039
|
Oe(
|
|
3020
3040
|
this.topAggregationContainer,
|
|
3021
|
-
|
|
3041
|
+
s,
|
|
3022
3042
|
this.visibleColumns,
|
|
3023
3043
|
this.rows
|
|
3024
3044
|
);
|
|
@@ -3086,62 +3106,62 @@ class Rn extends A {
|
|
|
3086
3106
|
}
|
|
3087
3107
|
}
|
|
3088
3108
|
const yi = pt;
|
|
3089
|
-
function xi(
|
|
3109
|
+
function xi(a) {
|
|
3090
3110
|
const e = [];
|
|
3091
|
-
return !
|
|
3111
|
+
return !a.rowGroupFields?.length && !a.columnGroupFields?.length && e.push("At least one row or column group field is required"), a.valueFields?.length || e.push("At least one value field is required"), e;
|
|
3092
3112
|
}
|
|
3093
|
-
function be(
|
|
3094
|
-
return [...
|
|
3113
|
+
function be(a, e) {
|
|
3114
|
+
return [...a, e].join("|");
|
|
3095
3115
|
}
|
|
3096
|
-
function Ci(
|
|
3097
|
-
const t = e.rowGroupFields ?? [], i = e.columnGroupFields ?? [], n = e.valueFields ?? [], r = Ei(
|
|
3098
|
-
|
|
3116
|
+
function Ci(a, e) {
|
|
3117
|
+
const t = e.rowGroupFields ?? [], i = e.columnGroupFields ?? [], n = e.valueFields ?? [], r = Ei(a, i), o = at(
|
|
3118
|
+
a,
|
|
3099
3119
|
t,
|
|
3100
3120
|
i,
|
|
3101
3121
|
r,
|
|
3102
3122
|
n,
|
|
3103
3123
|
0,
|
|
3104
3124
|
""
|
|
3105
|
-
),
|
|
3125
|
+
), s = Si(o, r, n), l = Object.values(s).reduce((d, c) => d + c, 0);
|
|
3106
3126
|
return {
|
|
3107
3127
|
rows: o,
|
|
3108
3128
|
columnKeys: r,
|
|
3109
|
-
totals:
|
|
3129
|
+
totals: s,
|
|
3110
3130
|
grandTotal: l
|
|
3111
3131
|
};
|
|
3112
3132
|
}
|
|
3113
|
-
function Ei(
|
|
3133
|
+
function Ei(a, e) {
|
|
3114
3134
|
if (e.length === 0) return ["value"];
|
|
3115
3135
|
const t = /* @__PURE__ */ new Set();
|
|
3116
|
-
for (const i of
|
|
3136
|
+
for (const i of a) {
|
|
3117
3137
|
const n = e.map((r) => String(i[r] ?? "")).join("|");
|
|
3118
3138
|
t.add(n);
|
|
3119
3139
|
}
|
|
3120
3140
|
return [...t].sort();
|
|
3121
3141
|
}
|
|
3122
|
-
function Ri(
|
|
3142
|
+
function Ri(a, e) {
|
|
3123
3143
|
const t = /* @__PURE__ */ new Map();
|
|
3124
|
-
for (const i of
|
|
3144
|
+
for (const i of a) {
|
|
3125
3145
|
const n = String(i[e] ?? ""), r = t.get(n);
|
|
3126
3146
|
r ? r.push(i) : t.set(n, [i]);
|
|
3127
3147
|
}
|
|
3128
3148
|
return t;
|
|
3129
3149
|
}
|
|
3130
|
-
function at(
|
|
3131
|
-
const
|
|
3150
|
+
function at(a, e, t, i, n, r, o) {
|
|
3151
|
+
const s = [];
|
|
3132
3152
|
if (e.length === 0) {
|
|
3133
|
-
const h = Be(
|
|
3134
|
-
return
|
|
3153
|
+
const h = Be(a, t, i, n), g = Ve(h);
|
|
3154
|
+
return s.push({
|
|
3135
3155
|
rowKey: o || "all",
|
|
3136
3156
|
rowLabel: o || "All",
|
|
3137
3157
|
depth: r,
|
|
3138
3158
|
values: h,
|
|
3139
3159
|
total: g,
|
|
3140
3160
|
isGroup: !1,
|
|
3141
|
-
rowCount:
|
|
3142
|
-
}),
|
|
3161
|
+
rowCount: a.length
|
|
3162
|
+
}), s;
|
|
3143
3163
|
}
|
|
3144
|
-
const l = e[0], d = e.slice(1), c = d.length > 0, u = Ri(
|
|
3164
|
+
const l = e[0], d = e.slice(1), c = d.length > 0, u = Ri(a, l);
|
|
3145
3165
|
for (const [h, g] of u) {
|
|
3146
3166
|
const f = o ? `${o}|${h}` : h, p = Be(g, t, i, n), w = Ve(p);
|
|
3147
3167
|
let b;
|
|
@@ -3153,7 +3173,7 @@ function at(s, e, t, i, n, r, o) {
|
|
|
3153
3173
|
n,
|
|
3154
3174
|
r + 1,
|
|
3155
3175
|
f
|
|
3156
|
-
)),
|
|
3176
|
+
)), s.push({
|
|
3157
3177
|
rowKey: f,
|
|
3158
3178
|
rowLabel: h || "(blank)",
|
|
3159
3179
|
depth: r,
|
|
@@ -3164,90 +3184,90 @@ function at(s, e, t, i, n, r, o) {
|
|
|
3164
3184
|
rowCount: g.length
|
|
3165
3185
|
});
|
|
3166
3186
|
}
|
|
3167
|
-
return
|
|
3187
|
+
return s;
|
|
3168
3188
|
}
|
|
3169
|
-
function Be(
|
|
3189
|
+
function Be(a, e, t, i) {
|
|
3170
3190
|
const n = {};
|
|
3171
3191
|
for (const r of t)
|
|
3172
3192
|
for (const o of i) {
|
|
3173
|
-
const l = (e.length > 0 ?
|
|
3193
|
+
const l = (e.length > 0 ? a.filter((h) => e.map((g) => String(h[g] ?? "")).join("|") === r) : a).map((h) => Number(h[o.field]) || 0), d = yi(o.aggFunc), c = l.length > 0 ? d(l) : null, u = be([r], o.field);
|
|
3174
3194
|
n[u] = c;
|
|
3175
3195
|
}
|
|
3176
3196
|
return n;
|
|
3177
3197
|
}
|
|
3178
|
-
function Ve(
|
|
3198
|
+
function Ve(a) {
|
|
3179
3199
|
let e = 0;
|
|
3180
|
-
for (const t of Object.values(
|
|
3200
|
+
for (const t of Object.values(a))
|
|
3181
3201
|
e += t ?? 0;
|
|
3182
3202
|
return e;
|
|
3183
3203
|
}
|
|
3184
|
-
function Si(
|
|
3204
|
+
function Si(a, e, t) {
|
|
3185
3205
|
const i = {};
|
|
3186
3206
|
function n(r) {
|
|
3187
3207
|
for (const o of r)
|
|
3188
3208
|
if (!o.isGroup || !o.children?.length)
|
|
3189
|
-
for (const
|
|
3209
|
+
for (const s of e)
|
|
3190
3210
|
for (const l of t) {
|
|
3191
|
-
const d = be([
|
|
3211
|
+
const d = be([s], l.field);
|
|
3192
3212
|
i[d] = (i[d] ?? 0) + (o.values[d] ?? 0);
|
|
3193
3213
|
}
|
|
3194
3214
|
else o.children && n(o.children);
|
|
3195
3215
|
}
|
|
3196
|
-
return n(
|
|
3216
|
+
return n(a), i;
|
|
3197
3217
|
}
|
|
3198
|
-
function ki(
|
|
3218
|
+
function ki(a, e, t = !0) {
|
|
3199
3219
|
const i = [];
|
|
3200
3220
|
function n(r) {
|
|
3201
3221
|
i.push(r);
|
|
3202
3222
|
const o = e ? e.has(r.rowKey) : t;
|
|
3203
3223
|
if (r.children && o)
|
|
3204
|
-
for (const
|
|
3205
|
-
n(
|
|
3224
|
+
for (const s of r.children)
|
|
3225
|
+
n(s);
|
|
3206
3226
|
}
|
|
3207
|
-
for (const r of
|
|
3227
|
+
for (const r of a)
|
|
3208
3228
|
n(r);
|
|
3209
3229
|
return i;
|
|
3210
3230
|
}
|
|
3211
|
-
function Ai(
|
|
3231
|
+
function Ai(a) {
|
|
3212
3232
|
const e = [];
|
|
3213
3233
|
function t(i) {
|
|
3214
3234
|
if (i.isGroup && e.push(i.rowKey), i.children)
|
|
3215
3235
|
for (const n of i.children)
|
|
3216
3236
|
t(n);
|
|
3217
3237
|
}
|
|
3218
|
-
for (const i of
|
|
3238
|
+
for (const i of a)
|
|
3219
3239
|
t(i);
|
|
3220
3240
|
return e;
|
|
3221
3241
|
}
|
|
3222
3242
|
const _i = ["sum", "avg", "count", "min", "max", "first", "last"];
|
|
3223
|
-
function Ti(
|
|
3243
|
+
function Ti(a, e, t, i) {
|
|
3224
3244
|
const n = new AbortController(), r = { config: e, callbacks: i, signal: n.signal }, o = document.createElement("div");
|
|
3225
|
-
return o.className = "tbw-pivot-panel", o.appendChild(j("Options", () => Di(t, r))), o.appendChild(j("Row Groups", () => We("rowGroups", r))), o.appendChild(j("Column Groups", () => We("columnGroups", r))), o.appendChild(j("Values", () => Fi(r))), o.appendChild(j("Available Fields", () => Pi(r))),
|
|
3245
|
+
return o.className = "tbw-pivot-panel", o.appendChild(j("Options", () => Di(t, r))), o.appendChild(j("Row Groups", () => We("rowGroups", r))), o.appendChild(j("Column Groups", () => We("columnGroups", r))), o.appendChild(j("Values", () => Fi(r))), o.appendChild(j("Available Fields", () => Pi(r))), a.appendChild(o), () => {
|
|
3226
3246
|
n.abort(), o.remove();
|
|
3227
3247
|
};
|
|
3228
3248
|
}
|
|
3229
|
-
function j(
|
|
3249
|
+
function j(a, e) {
|
|
3230
3250
|
const t = document.createElement("div");
|
|
3231
3251
|
t.className = "tbw-pivot-section";
|
|
3232
3252
|
const i = document.createElement("div");
|
|
3233
|
-
i.className = "tbw-pivot-section-header", i.textContent =
|
|
3253
|
+
i.className = "tbw-pivot-section-header", i.textContent = a;
|
|
3234
3254
|
const n = document.createElement("div");
|
|
3235
3255
|
return n.className = "tbw-pivot-section-content", n.appendChild(e()), t.appendChild(i), t.appendChild(n), t;
|
|
3236
3256
|
}
|
|
3237
|
-
function We(
|
|
3257
|
+
function We(a, e) {
|
|
3238
3258
|
const { config: t, callbacks: i, signal: n } = e, r = document.createElement("div");
|
|
3239
|
-
r.className = "tbw-pivot-drop-zone", r.setAttribute("data-zone",
|
|
3240
|
-
const o =
|
|
3259
|
+
r.className = "tbw-pivot-drop-zone", r.setAttribute("data-zone", a);
|
|
3260
|
+
const o = a === "rowGroups" ? t.rowGroupFields ?? [] : t.columnGroupFields ?? [];
|
|
3241
3261
|
if (o.length === 0) {
|
|
3242
|
-
const
|
|
3243
|
-
|
|
3262
|
+
const s = document.createElement("div");
|
|
3263
|
+
s.className = "tbw-pivot-placeholder", s.textContent = "Drag fields here or click to add", r.appendChild(s);
|
|
3244
3264
|
} else
|
|
3245
|
-
for (const
|
|
3246
|
-
r.appendChild(Li(
|
|
3265
|
+
for (const s of o)
|
|
3266
|
+
r.appendChild(Li(s, a, e));
|
|
3247
3267
|
return r.addEventListener(
|
|
3248
3268
|
"dragover",
|
|
3249
|
-
(
|
|
3250
|
-
|
|
3269
|
+
(s) => {
|
|
3270
|
+
s.preventDefault(), r.classList.add("drag-over");
|
|
3251
3271
|
},
|
|
3252
3272
|
{ signal: n }
|
|
3253
3273
|
), r.addEventListener(
|
|
@@ -3258,30 +3278,30 @@ function We(s, e) {
|
|
|
3258
3278
|
{ signal: n }
|
|
3259
3279
|
), r.addEventListener(
|
|
3260
3280
|
"drop",
|
|
3261
|
-
(
|
|
3262
|
-
|
|
3263
|
-
const l =
|
|
3264
|
-
l && i.onAddFieldToZone(l,
|
|
3281
|
+
(s) => {
|
|
3282
|
+
s.preventDefault(), r.classList.remove("drag-over");
|
|
3283
|
+
const l = s.dataTransfer?.getData("text/plain");
|
|
3284
|
+
l && i.onAddFieldToZone(l, a);
|
|
3265
3285
|
},
|
|
3266
3286
|
{ signal: n }
|
|
3267
3287
|
), r;
|
|
3268
3288
|
}
|
|
3269
|
-
function Li(
|
|
3289
|
+
function Li(a, e, t) {
|
|
3270
3290
|
const { callbacks: i, signal: n } = t, r = document.createElement("div");
|
|
3271
3291
|
r.className = "tbw-pivot-field-chip", r.draggable = !0;
|
|
3272
|
-
const o = i.getAvailableFields().find((d) => d.field ===
|
|
3273
|
-
|
|
3292
|
+
const o = i.getAvailableFields().find((d) => d.field === a), s = document.createElement("span");
|
|
3293
|
+
s.className = "tbw-pivot-chip-label", s.textContent = o?.header ?? a;
|
|
3274
3294
|
const l = document.createElement("button");
|
|
3275
3295
|
return l.className = "tbw-pivot-chip-remove", l.innerHTML = "×", l.title = "Remove field", l.addEventListener(
|
|
3276
3296
|
"click",
|
|
3277
3297
|
(d) => {
|
|
3278
|
-
d.stopPropagation(), i.onRemoveFieldFromZone(
|
|
3298
|
+
d.stopPropagation(), i.onRemoveFieldFromZone(a, e);
|
|
3279
3299
|
},
|
|
3280
3300
|
{ signal: n }
|
|
3281
|
-
), r.appendChild(
|
|
3301
|
+
), r.appendChild(s), r.appendChild(l), r.addEventListener(
|
|
3282
3302
|
"dragstart",
|
|
3283
3303
|
(d) => {
|
|
3284
|
-
d.dataTransfer?.setData("text/plain",
|
|
3304
|
+
d.dataTransfer?.setData("text/plain", a), d.dataTransfer?.setData("source-zone", e), r.classList.add("dragging");
|
|
3285
3305
|
},
|
|
3286
3306
|
{ signal: n }
|
|
3287
3307
|
), r.addEventListener(
|
|
@@ -3292,8 +3312,8 @@ function Li(s, e, t) {
|
|
|
3292
3312
|
{ signal: n }
|
|
3293
3313
|
), r;
|
|
3294
3314
|
}
|
|
3295
|
-
function Fi(
|
|
3296
|
-
const { config: e, callbacks: t, signal: i } =
|
|
3315
|
+
function Fi(a) {
|
|
3316
|
+
const { config: e, callbacks: t, signal: i } = a, n = document.createElement("div");
|
|
3297
3317
|
n.className = "tbw-pivot-drop-zone tbw-pivot-values-zone", n.setAttribute("data-zone", "values");
|
|
3298
3318
|
const r = e.valueFields ?? [];
|
|
3299
3319
|
if (r.length === 0) {
|
|
@@ -3301,7 +3321,7 @@ function Fi(s) {
|
|
|
3301
3321
|
o.className = "tbw-pivot-placeholder", o.textContent = "Drag numeric fields here for aggregation", n.appendChild(o);
|
|
3302
3322
|
} else
|
|
3303
3323
|
for (const o of r)
|
|
3304
|
-
n.appendChild(Ii(o,
|
|
3324
|
+
n.appendChild(Ii(o, a));
|
|
3305
3325
|
return n.addEventListener(
|
|
3306
3326
|
"dragover",
|
|
3307
3327
|
(o) => {
|
|
@@ -3318,29 +3338,29 @@ function Fi(s) {
|
|
|
3318
3338
|
"drop",
|
|
3319
3339
|
(o) => {
|
|
3320
3340
|
o.preventDefault(), n.classList.remove("drag-over");
|
|
3321
|
-
const
|
|
3322
|
-
|
|
3341
|
+
const s = o.dataTransfer?.getData("text/plain");
|
|
3342
|
+
s && t.onAddValueField(s, "sum");
|
|
3323
3343
|
},
|
|
3324
3344
|
{ signal: i }
|
|
3325
3345
|
), n;
|
|
3326
3346
|
}
|
|
3327
|
-
function Ii(
|
|
3347
|
+
function Ii(a, e) {
|
|
3328
3348
|
const { callbacks: t, signal: i } = e, n = document.createElement("div");
|
|
3329
3349
|
n.className = "tbw-pivot-field-chip tbw-pivot-value-chip";
|
|
3330
|
-
const r = t.getAvailableFields().find((c) => c.field ===
|
|
3350
|
+
const r = t.getAvailableFields().find((c) => c.field === a.field), o = document.createElement("div");
|
|
3331
3351
|
o.className = "tbw-pivot-value-label-wrapper";
|
|
3332
|
-
const
|
|
3333
|
-
|
|
3352
|
+
const s = document.createElement("span");
|
|
3353
|
+
s.className = "tbw-pivot-chip-label", s.textContent = r?.header ?? a.field;
|
|
3334
3354
|
const l = document.createElement("select");
|
|
3335
3355
|
l.className = "tbw-pivot-agg-select", l.title = "Aggregation function";
|
|
3336
3356
|
for (const c of _i) {
|
|
3337
3357
|
const u = document.createElement("option");
|
|
3338
|
-
u.value = c, u.textContent = c.toUpperCase(), u.selected = c ===
|
|
3358
|
+
u.value = c, u.textContent = c.toUpperCase(), u.selected = c === a.aggFunc, l.appendChild(u);
|
|
3339
3359
|
}
|
|
3340
3360
|
l.addEventListener(
|
|
3341
3361
|
"change",
|
|
3342
3362
|
() => {
|
|
3343
|
-
t.onUpdateValueAggFunc(
|
|
3363
|
+
t.onUpdateValueAggFunc(a.field, l.value);
|
|
3344
3364
|
},
|
|
3345
3365
|
{ signal: i }
|
|
3346
3366
|
);
|
|
@@ -3348,24 +3368,24 @@ function Ii(s, e) {
|
|
|
3348
3368
|
return d.className = "tbw-pivot-chip-remove", d.innerHTML = "×", d.title = "Remove value field", d.addEventListener(
|
|
3349
3369
|
"click",
|
|
3350
3370
|
(c) => {
|
|
3351
|
-
c.stopPropagation(), t.onRemoveValueField(
|
|
3371
|
+
c.stopPropagation(), t.onRemoveValueField(a.field);
|
|
3352
3372
|
},
|
|
3353
3373
|
{ signal: i }
|
|
3354
|
-
), o.appendChild(
|
|
3374
|
+
), o.appendChild(s), o.appendChild(l), n.appendChild(o), n.appendChild(d), n;
|
|
3355
3375
|
}
|
|
3356
|
-
function Pi(
|
|
3357
|
-
const { config: e, callbacks: t, signal: i } =
|
|
3376
|
+
function Pi(a) {
|
|
3377
|
+
const { config: e, callbacks: t, signal: i } = a, n = document.createElement("div");
|
|
3358
3378
|
n.className = "tbw-pivot-available-fields";
|
|
3359
3379
|
const r = t.getAvailableFields(), o = /* @__PURE__ */ new Set([
|
|
3360
3380
|
...e.rowGroupFields ?? [],
|
|
3361
3381
|
...e.columnGroupFields ?? [],
|
|
3362
3382
|
...e.valueFields?.map((l) => l.field) ?? []
|
|
3363
|
-
]),
|
|
3364
|
-
if (
|
|
3383
|
+
]), s = r.filter((l) => !o.has(l.field));
|
|
3384
|
+
if (s.length === 0) {
|
|
3365
3385
|
const l = document.createElement("div");
|
|
3366
3386
|
l.className = "tbw-pivot-placeholder", l.textContent = "All fields are in use", n.appendChild(l);
|
|
3367
3387
|
} else
|
|
3368
|
-
for (const l of
|
|
3388
|
+
for (const l of s) {
|
|
3369
3389
|
const d = document.createElement("div");
|
|
3370
3390
|
d.className = "tbw-pivot-field-chip available", d.textContent = l.header, d.draggable = !0, d.title = `Drag to add "${l.field}" to a zone`, d.addEventListener(
|
|
3371
3391
|
"dragstart",
|
|
@@ -3383,12 +3403,12 @@ function Pi(s) {
|
|
|
3383
3403
|
}
|
|
3384
3404
|
return n;
|
|
3385
3405
|
}
|
|
3386
|
-
function Di(
|
|
3406
|
+
function Di(a, e) {
|
|
3387
3407
|
const { config: t, callbacks: i, signal: n } = e, r = document.createElement("div");
|
|
3388
3408
|
return r.className = "tbw-pivot-options", r.appendChild(
|
|
3389
3409
|
le(
|
|
3390
3410
|
"Enable Pivot View",
|
|
3391
|
-
|
|
3411
|
+
a,
|
|
3392
3412
|
(o) => {
|
|
3393
3413
|
i.onTogglePivot(o);
|
|
3394
3414
|
},
|
|
@@ -3414,58 +3434,58 @@ function Di(s, e) {
|
|
|
3414
3434
|
)
|
|
3415
3435
|
), r;
|
|
3416
3436
|
}
|
|
3417
|
-
function le(
|
|
3437
|
+
function le(a, e, t, i) {
|
|
3418
3438
|
const n = document.createElement("label");
|
|
3419
3439
|
n.className = "tbw-pivot-checkbox";
|
|
3420
3440
|
const r = document.createElement("input");
|
|
3421
3441
|
r.type = "checkbox", r.checked = e, r.addEventListener("change", () => t(r.checked), { signal: i });
|
|
3422
3442
|
const o = document.createElement("span");
|
|
3423
|
-
return o.textContent =
|
|
3443
|
+
return o.textContent = a, n.appendChild(r), n.appendChild(o), n;
|
|
3424
3444
|
}
|
|
3425
|
-
function Mi(
|
|
3426
|
-
return e.className = "data-grid-row pivot-group-row", e.setAttribute("data-pivot-depth", String(
|
|
3445
|
+
function Mi(a, e, t) {
|
|
3446
|
+
return e.className = "data-grid-row pivot-group-row", e.setAttribute("data-pivot-depth", String(a.__pivotDepth ?? 0)), e.setAttribute("data-pivot-key", String(a.__pivotRowKey ?? "")), e.setAttribute("role", "row"), e.innerHTML = "", t.columns.forEach((i, n) => {
|
|
3427
3447
|
const r = document.createElement("div");
|
|
3428
3448
|
if (r.className = "cell", r.setAttribute("data-col", String(n)), r.setAttribute("data-row", String(t.rowIndex)), r.setAttribute("role", "gridcell"), n === 0) {
|
|
3429
|
-
const o = Number(
|
|
3449
|
+
const o = Number(a.__pivotIndent) || 0;
|
|
3430
3450
|
r.style.paddingLeft = `${o}px`;
|
|
3431
|
-
const
|
|
3432
|
-
l.type = "button", l.className = "pivot-toggle", l.setAttribute("aria-label",
|
|
3433
|
-
u.stopPropagation(), t.onToggle(
|
|
3451
|
+
const s = String(a.__pivotRowKey), l = document.createElement("button");
|
|
3452
|
+
l.type = "button", l.className = "pivot-toggle", l.setAttribute("aria-label", a.__pivotExpanded ? "Collapse group" : "Expand group"), t.setIcon(l, t.resolveIcon(a.__pivotExpanded ? "collapse" : "expand")), l.addEventListener("click", (u) => {
|
|
3453
|
+
u.stopPropagation(), t.onToggle(s);
|
|
3434
3454
|
}), r.appendChild(l);
|
|
3435
3455
|
const d = document.createElement("span");
|
|
3436
|
-
d.className = "pivot-label", d.textContent = String(
|
|
3456
|
+
d.className = "pivot-label", d.textContent = String(a.__pivotLabel ?? ""), r.appendChild(d);
|
|
3437
3457
|
const c = document.createElement("span");
|
|
3438
|
-
c.className = "pivot-count", c.textContent = ` (${Number(
|
|
3458
|
+
c.className = "pivot-count", c.textContent = ` (${Number(a.__pivotRowCount) || 0})`, r.appendChild(c);
|
|
3439
3459
|
} else {
|
|
3440
|
-
const o =
|
|
3460
|
+
const o = a[i.field];
|
|
3441
3461
|
r.textContent = o != null ? String(o) : "";
|
|
3442
3462
|
}
|
|
3443
3463
|
e.appendChild(r);
|
|
3444
3464
|
}), !0;
|
|
3445
3465
|
}
|
|
3446
|
-
function Ni(
|
|
3447
|
-
return e.className = "data-grid-row pivot-leaf-row", e.setAttribute("data-pivot-depth", String(
|
|
3466
|
+
function Ni(a, e, t, i) {
|
|
3467
|
+
return e.className = "data-grid-row pivot-leaf-row", e.setAttribute("data-pivot-depth", String(a.__pivotDepth ?? 0)), e.setAttribute("data-pivot-key", String(a.__pivotRowKey ?? "")), e.innerHTML = "", t.forEach((n, r) => {
|
|
3448
3468
|
const o = document.createElement("div");
|
|
3449
3469
|
if (o.className = "cell", o.setAttribute("data-col", String(r)), o.setAttribute("data-row", String(i)), o.setAttribute("role", "gridcell"), r === 0) {
|
|
3450
|
-
const
|
|
3451
|
-
o.style.paddingLeft = `${
|
|
3470
|
+
const s = Number(a.__pivotIndent) || 0;
|
|
3471
|
+
o.style.paddingLeft = `${s + 20}px`;
|
|
3452
3472
|
const l = document.createElement("span");
|
|
3453
|
-
l.className = "pivot-label", l.textContent = String(
|
|
3473
|
+
l.className = "pivot-label", l.textContent = String(a.__pivotLabel ?? ""), o.appendChild(l);
|
|
3454
3474
|
} else {
|
|
3455
|
-
const
|
|
3456
|
-
o.textContent =
|
|
3475
|
+
const s = a[n.field];
|
|
3476
|
+
o.textContent = s != null ? String(s) : "";
|
|
3457
3477
|
}
|
|
3458
3478
|
e.appendChild(o);
|
|
3459
3479
|
}), !0;
|
|
3460
3480
|
}
|
|
3461
|
-
function qi(
|
|
3481
|
+
function qi(a, e, t) {
|
|
3462
3482
|
return e.className = "pivot-grand-total-row", e.setAttribute("role", "presentation"), e.innerHTML = "", t.forEach((i, n) => {
|
|
3463
3483
|
const r = document.createElement("div");
|
|
3464
3484
|
if (r.className = "cell", r.setAttribute("data-col", String(n)), n === 0) {
|
|
3465
3485
|
const o = document.createElement("span");
|
|
3466
3486
|
o.className = "pivot-label", o.textContent = "Grand Total", r.appendChild(o);
|
|
3467
3487
|
} else {
|
|
3468
|
-
const o =
|
|
3488
|
+
const o = a[i.field];
|
|
3469
3489
|
r.textContent = o != null ? String(o) : "";
|
|
3470
3490
|
}
|
|
3471
3491
|
e.appendChild(r);
|
|
@@ -3543,8 +3563,8 @@ class G extends A {
|
|
|
3543
3563
|
this.keysToAnimate.clear();
|
|
3544
3564
|
const r = /* @__PURE__ */ new Set();
|
|
3545
3565
|
for (const o of n) {
|
|
3546
|
-
const
|
|
3547
|
-
r.add(
|
|
3566
|
+
const s = o.__pivotRowKey;
|
|
3567
|
+
r.add(s), !this.previousVisibleKeys.has(s) && o.__pivotDepth > 0 && this.keysToAnimate.add(s);
|
|
3548
3568
|
}
|
|
3549
3569
|
return this.previousVisibleKeys = r, n;
|
|
3550
3570
|
}
|
|
@@ -3559,10 +3579,10 @@ class G extends A {
|
|
|
3559
3579
|
});
|
|
3560
3580
|
for (const n of this.pivotResult.columnKeys)
|
|
3561
3581
|
for (const r of this.config.valueFields ?? []) {
|
|
3562
|
-
const o = be([n], r.field),
|
|
3582
|
+
const o = be([n], r.field), s = r.header || this.fieldHeaderMap.get(r.field) || r.field;
|
|
3563
3583
|
t.push({
|
|
3564
3584
|
field: o,
|
|
3565
|
-
header: `${n} - ${
|
|
3585
|
+
header: `${n} - ${s} (${r.aggFunc})`,
|
|
3566
3586
|
width: 120,
|
|
3567
3587
|
type: "number"
|
|
3568
3588
|
});
|
|
@@ -3761,18 +3781,18 @@ class G extends A {
|
|
|
3761
3781
|
}
|
|
3762
3782
|
}
|
|
3763
3783
|
const Q = "tbw-print-isolation-style";
|
|
3764
|
-
function Ki(
|
|
3784
|
+
function Ki(a, e) {
|
|
3765
3785
|
const t = document.createElement("style");
|
|
3766
3786
|
return t.id = Q, t.textContent = `
|
|
3767
3787
|
/* Print isolation: hide everything except the target grid */
|
|
3768
3788
|
@media print {
|
|
3769
3789
|
/* Hide all body children by default */
|
|
3770
|
-
body > *:not(#${
|
|
3790
|
+
body > *:not(#${a}) {
|
|
3771
3791
|
display: none !important;
|
|
3772
3792
|
}
|
|
3773
3793
|
|
|
3774
3794
|
/* But show the grid and ensure it's not hidden by ancestor rules */
|
|
3775
|
-
#${
|
|
3795
|
+
#${a} {
|
|
3776
3796
|
display: block !important;
|
|
3777
3797
|
position: static !important;
|
|
3778
3798
|
visibility: visible !important;
|
|
@@ -3787,14 +3807,14 @@ function Ki(s, e) {
|
|
|
3787
3807
|
}
|
|
3788
3808
|
|
|
3789
3809
|
/* If grid is nested, we need to show its ancestors too */
|
|
3790
|
-
#${
|
|
3791
|
-
#${
|
|
3810
|
+
#${a},
|
|
3811
|
+
#${a} * {
|
|
3792
3812
|
visibility: visible !important;
|
|
3793
3813
|
}
|
|
3794
3814
|
|
|
3795
3815
|
/* Walk up the DOM and show all ancestors of the grid */
|
|
3796
|
-
body *:has(> #${
|
|
3797
|
-
body *:has(#${
|
|
3816
|
+
body *:has(> #${a}),
|
|
3817
|
+
body *:has(#${a}) {
|
|
3798
3818
|
display: block !important;
|
|
3799
3819
|
visibility: visible !important;
|
|
3800
3820
|
opacity: 1 !important;
|
|
@@ -3809,7 +3829,7 @@ function Ki(s, e) {
|
|
|
3809
3829
|
}
|
|
3810
3830
|
|
|
3811
3831
|
/* Hide siblings of ancestors (everything that's not in the path to the grid) */
|
|
3812
|
-
body *:has(#${
|
|
3832
|
+
body *:has(#${a}) > *:not(:has(#${a})):not(#${a}) {
|
|
3813
3833
|
display: none !important;
|
|
3814
3834
|
}
|
|
3815
3835
|
|
|
@@ -3835,18 +3855,18 @@ function Ki(s, e) {
|
|
|
3835
3855
|
}
|
|
3836
3856
|
`, t;
|
|
3837
3857
|
}
|
|
3838
|
-
async function zi(
|
|
3839
|
-
const { orientation: t = "landscape" } = e, i =
|
|
3858
|
+
async function zi(a, e = {}) {
|
|
3859
|
+
const { orientation: t = "landscape" } = e, i = a.id;
|
|
3840
3860
|
document.querySelectorAll(`#${CSS.escape(i)}`).length > 1 && console.warn(
|
|
3841
3861
|
`[tbw-grid:print] Multiple elements found with id="${i}". Print isolation may not work correctly. Ensure each grid has a unique ID.`
|
|
3842
3862
|
), document.getElementById(Q)?.remove();
|
|
3843
3863
|
const r = Ki(i, t);
|
|
3844
3864
|
return document.head.appendChild(r), new Promise((o) => {
|
|
3845
|
-
const
|
|
3846
|
-
window.removeEventListener("afterprint",
|
|
3865
|
+
const s = () => {
|
|
3866
|
+
window.removeEventListener("afterprint", s), document.getElementById(Q)?.remove(), o();
|
|
3847
3867
|
};
|
|
3848
|
-
window.addEventListener("afterprint",
|
|
3849
|
-
window.removeEventListener("afterprint",
|
|
3868
|
+
window.addEventListener("afterprint", s), window.print(), setTimeout(() => {
|
|
3869
|
+
window.removeEventListener("afterprint", s), document.getElementById(Q)?.remove(), o();
|
|
3850
3870
|
}, 5e3);
|
|
3851
3871
|
});
|
|
3852
3872
|
}
|
|
@@ -3888,7 +3908,7 @@ class Sn extends A {
|
|
|
3888
3908
|
return;
|
|
3889
3909
|
}
|
|
3890
3910
|
const i = { ...Gi, ...this.config, ...e }, r = this.rows.length;
|
|
3891
|
-
let o = r,
|
|
3911
|
+
let o = r, s = !1;
|
|
3892
3912
|
if (i.warnThreshold > 0 && r > i.warnThreshold) {
|
|
3893
3913
|
const d = i.maxRows > 0 ? `
|
|
3894
3914
|
|
|
@@ -3900,18 +3920,18 @@ Click OK to continue, or Cancel to abort.`
|
|
|
3900
3920
|
))
|
|
3901
3921
|
return;
|
|
3902
3922
|
}
|
|
3903
|
-
i.maxRows > 0 && r > i.maxRows && (o = i.maxRows,
|
|
3923
|
+
i.maxRows > 0 && r > i.maxRows && (o = i.maxRows, s = !0), this.#e = !0;
|
|
3904
3924
|
const l = performance.now();
|
|
3905
3925
|
this.emit("print-start", {
|
|
3906
3926
|
rowCount: o,
|
|
3907
|
-
limitApplied:
|
|
3927
|
+
limitApplied: s,
|
|
3908
3928
|
originalRowCount: r
|
|
3909
3929
|
});
|
|
3910
3930
|
try {
|
|
3911
3931
|
const d = this.#s;
|
|
3912
3932
|
this.#o = {
|
|
3913
3933
|
bypassThreshold: d._virtualization?.bypassThreshold ?? 24
|
|
3914
|
-
}, this.#p(),
|
|
3934
|
+
}, this.#p(), s && (this.#n = this.sourceRows, this.grid.rows = this.sourceRows.slice(0, o), await new Promise((c) => setTimeout(c, 50))), (i.includeTitle || i.includeTimestamp) && this.#c(i), await this.#a(), await new Promise((c) => requestAnimationFrame(c)), await new Promise((c) => requestAnimationFrame(c)), t.classList.add(`print-${i.orientation}`), await new Promise((c) => requestAnimationFrame(c)), await new Promise((c) => requestAnimationFrame(c)), i.isolate ? await this.#g(i) : await this.#u(), this.emit("print-complete", {
|
|
3915
3935
|
success: !0,
|
|
3916
3936
|
rowCount: o,
|
|
3917
3937
|
duration: Math.round(performance.now() - l)
|
|
@@ -4007,13 +4027,13 @@ Click OK to continue, or Cancel to abort.`
|
|
|
4007
4027
|
});
|
|
4008
4028
|
}
|
|
4009
4029
|
}
|
|
4010
|
-
function Bi(
|
|
4011
|
-
const e =
|
|
4030
|
+
function Bi(a) {
|
|
4031
|
+
const e = a.meta ?? {};
|
|
4012
4032
|
return e.lockPosition !== !0 && e.suppressMovable !== !0;
|
|
4013
4033
|
}
|
|
4014
|
-
function $e(
|
|
4015
|
-
if (e === t || e < 0 || e >=
|
|
4016
|
-
const i = [...
|
|
4034
|
+
function $e(a, e, t) {
|
|
4035
|
+
if (e === t || e < 0 || e >= a.length || t < 0 || t > a.length) return a;
|
|
4036
|
+
const i = [...a], [n] = i.splice(e, 1);
|
|
4017
4037
|
return i.splice(t, 0, n), i;
|
|
4018
4038
|
}
|
|
4019
4039
|
const Vi = '@layer tbw-plugins{.header-row>.cell[draggable=true]{cursor:grab;position:relative}.header-row>.cell.dragging{opacity:.5;cursor:grabbing}.header-row>.cell.drop-before:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--tbw-reorder-indicator, var(--tbw-color-accent));z-index:1}.header-row>.cell.drop-after:after{content:"";position:absolute;right:0;top:0;bottom:0;width:2px;background:var(--tbw-reorder-indicator, var(--tbw-color-accent));z-index:1}.cell.flip-animating{transition:transform var(--tbw-animation-duration, .2s) ease-out;will-change:transform;z-index:1}@keyframes reorder-fade-in{0%{opacity:0}to{opacity:1}}.cell.fade-animating{animation:reorder-fade-in var(--tbw-animation-duration, .2s) ease-out backwards}}';
|
|
@@ -4062,24 +4082,24 @@ class kn extends A {
|
|
|
4062
4082
|
e.querySelectorAll(".header-row > .cell").forEach((i) => {
|
|
4063
4083
|
const n = i, r = n.getAttribute("data-field");
|
|
4064
4084
|
if (!r) return;
|
|
4065
|
-
const o = this.columns.find((
|
|
4085
|
+
const o = this.columns.find((s) => s.field === r);
|
|
4066
4086
|
if (!this.canMoveColumnWithPlugins(o)) {
|
|
4067
4087
|
n.draggable = !1;
|
|
4068
4088
|
return;
|
|
4069
4089
|
}
|
|
4070
|
-
n.draggable = !0, !n.getAttribute("data-dragstart-bound") && (n.setAttribute("data-dragstart-bound", "true"), n.addEventListener("dragstart", (
|
|
4090
|
+
n.draggable = !0, !n.getAttribute("data-dragstart-bound") && (n.setAttribute("data-dragstart-bound", "true"), n.addEventListener("dragstart", (s) => {
|
|
4071
4091
|
const d = this.getColumnOrder().indexOf(r);
|
|
4072
|
-
this.isDragging = !0, this.draggedField = r, this.draggedIndex = d,
|
|
4092
|
+
this.isDragging = !0, this.draggedField = r, this.draggedIndex = d, s.dataTransfer && (s.dataTransfer.effectAllowed = "move", s.dataTransfer.setData("text/plain", r)), n.classList.add("dragging");
|
|
4073
4093
|
}), n.addEventListener("dragend", () => {
|
|
4074
4094
|
this.isDragging = !1, this.draggedField = null, this.draggedIndex = null, this.dropIndex = null, this.clearDragClasses();
|
|
4075
|
-
}), n.addEventListener("dragover", (
|
|
4076
|
-
if (
|
|
4095
|
+
}), n.addEventListener("dragover", (s) => {
|
|
4096
|
+
if (s.preventDefault(), !this.isDragging || this.draggedField === r) return;
|
|
4077
4097
|
const l = n.getBoundingClientRect(), d = l.left + l.width / 2, u = this.getColumnOrder().indexOf(r);
|
|
4078
|
-
this.dropIndex =
|
|
4098
|
+
this.dropIndex = s.clientX < d ? u : u + 1, n.classList.add("drop-target"), n.classList.toggle("drop-before", s.clientX < d), n.classList.toggle("drop-after", s.clientX >= d);
|
|
4079
4099
|
}), n.addEventListener("dragleave", () => {
|
|
4080
4100
|
n.classList.remove("drop-target", "drop-before", "drop-after");
|
|
4081
|
-
}), n.addEventListener("drop", (
|
|
4082
|
-
|
|
4101
|
+
}), n.addEventListener("drop", (s) => {
|
|
4102
|
+
s.preventDefault();
|
|
4083
4103
|
const l = this.draggedField, d = this.draggedIndex, c = this.dropIndex;
|
|
4084
4104
|
if (!this.isDragging || l === null || d === null || c === null)
|
|
4085
4105
|
return;
|
|
@@ -4100,9 +4120,9 @@ class kn extends A {
|
|
|
4100
4120
|
if (i < 0 || i >= n.length) return;
|
|
4101
4121
|
const r = n[i];
|
|
4102
4122
|
if (!this.canMoveColumnWithPlugins(r)) return;
|
|
4103
|
-
const o = this.getColumnOrder(),
|
|
4104
|
-
if (
|
|
4105
|
-
const l = e.key === "ArrowLeft" ?
|
|
4123
|
+
const o = this.getColumnOrder(), s = o.indexOf(r.field);
|
|
4124
|
+
if (s === -1) return;
|
|
4125
|
+
const l = e.key === "ArrowLeft" ? s - 1 : s + 1;
|
|
4106
4126
|
if (l < 0 || l >= o.length) return;
|
|
4107
4127
|
const d = n.find((c) => c.field === o[l]);
|
|
4108
4128
|
if (this.canMoveColumnWithPlugins(d))
|
|
@@ -4141,19 +4161,19 @@ class kn extends A {
|
|
|
4141
4161
|
if (!t || e.size === 0) return;
|
|
4142
4162
|
const i = /* @__PURE__ */ new Map();
|
|
4143
4163
|
if (t.querySelectorAll(".header-row > .cell[data-field]").forEach((o) => {
|
|
4144
|
-
const
|
|
4145
|
-
if (!
|
|
4146
|
-
const l = e.get(
|
|
4164
|
+
const s = o.getAttribute("data-field");
|
|
4165
|
+
if (!s) return;
|
|
4166
|
+
const l = e.get(s);
|
|
4147
4167
|
if (l === void 0) return;
|
|
4148
4168
|
const d = l - o.getBoundingClientRect().left;
|
|
4149
|
-
Math.abs(d) > 1 && i.set(
|
|
4169
|
+
Math.abs(d) > 1 && i.set(s, d);
|
|
4150
4170
|
}), i.size === 0) return;
|
|
4151
4171
|
const n = [];
|
|
4152
4172
|
if (t.querySelectorAll(".cell[data-field]").forEach((o) => {
|
|
4153
|
-
const
|
|
4154
|
-
if (
|
|
4173
|
+
const s = i.get(o.getAttribute("data-field") ?? "");
|
|
4174
|
+
if (s !== void 0) {
|
|
4155
4175
|
const l = o;
|
|
4156
|
-
l.style.transform = `translateX(${
|
|
4176
|
+
l.style.transform = `translateX(${s}px)`, n.push(l);
|
|
4157
4177
|
}
|
|
4158
4178
|
}), n.length === 0) return;
|
|
4159
4179
|
this.gridElement.offsetHeight;
|
|
@@ -4177,25 +4197,25 @@ class kn extends A {
|
|
|
4177
4197
|
const i = this.captureHeaderPositions();
|
|
4178
4198
|
e();
|
|
4179
4199
|
const n = /* @__PURE__ */ new Set();
|
|
4180
|
-
if (t.querySelectorAll(".header-row > .cell[data-field]").forEach((
|
|
4181
|
-
const l =
|
|
4200
|
+
if (t.querySelectorAll(".header-row > .cell[data-field]").forEach((s) => {
|
|
4201
|
+
const l = s.getAttribute("data-field");
|
|
4182
4202
|
if (!l) return;
|
|
4183
4203
|
const d = i.get(l);
|
|
4184
4204
|
if (d === void 0) return;
|
|
4185
|
-
const c =
|
|
4205
|
+
const c = s.getBoundingClientRect().left;
|
|
4186
4206
|
Math.abs(d - c) > 1 && n.add(l);
|
|
4187
4207
|
}), n.size === 0) return;
|
|
4188
4208
|
const r = [];
|
|
4189
|
-
if (t.querySelectorAll(".cell[data-field]").forEach((
|
|
4190
|
-
const l =
|
|
4209
|
+
if (t.querySelectorAll(".cell[data-field]").forEach((s) => {
|
|
4210
|
+
const l = s.getAttribute("data-field");
|
|
4191
4211
|
if (l && n.has(l)) {
|
|
4192
|
-
const d =
|
|
4212
|
+
const d = s;
|
|
4193
4213
|
d.classList.add("fade-animating"), r.push(d);
|
|
4194
4214
|
}
|
|
4195
4215
|
}), r.length === 0) return;
|
|
4196
4216
|
const o = this.animationDuration;
|
|
4197
4217
|
setTimeout(() => {
|
|
4198
|
-
r.forEach((
|
|
4218
|
+
r.forEach((s) => s.classList.remove("fade-animating"));
|
|
4199
4219
|
}, o + 50);
|
|
4200
4220
|
}
|
|
4201
4221
|
updateColumnOrder(e) {
|
|
@@ -4277,12 +4297,12 @@ class An extends A {
|
|
|
4277
4297
|
const u = i.__frameworkAdapter.parseResponsiveCardElement(t);
|
|
4278
4298
|
u && (this.config = { ...this.config, cardRenderer: u });
|
|
4279
4299
|
}
|
|
4280
|
-
const n = t.getAttribute("breakpoint"), r = t.getAttribute("card-row-height"), o = t.getAttribute("hidden-columns"),
|
|
4300
|
+
const n = t.getAttribute("breakpoint"), r = t.getAttribute("card-row-height"), o = t.getAttribute("hidden-columns"), s = t.getAttribute("hide-header"), l = t.getAttribute("debounce-ms"), d = {};
|
|
4281
4301
|
if (n !== null) {
|
|
4282
4302
|
const u = parseInt(n, 10);
|
|
4283
4303
|
isNaN(u) || (d.breakpoint = u);
|
|
4284
4304
|
}
|
|
4285
|
-
if (r !== null && (d.cardRowHeight = r === "auto" ? "auto" : parseInt(r, 10)), o !== null && (d.hiddenColumns = o.split(",").map((u) => u.trim()).filter((u) => u.length > 0)),
|
|
4305
|
+
if (r !== null && (d.cardRowHeight = r === "auto" ? "auto" : parseInt(r, 10)), o !== null && (d.hiddenColumns = o.split(",").map((u) => u.trim()).filter((u) => u.length > 0)), s !== null && (d.hideHeader = s !== "false"), l !== null) {
|
|
4286
4306
|
const u = parseInt(l, 10);
|
|
4287
4307
|
isNaN(u) || (d.debounceMs = u);
|
|
4288
4308
|
}
|
|
@@ -4427,18 +4447,18 @@ class An extends A {
|
|
|
4427
4447
|
getExtraHeight() {
|
|
4428
4448
|
if (!this.#t || !this.config.cardRenderer || !this.#b())
|
|
4429
4449
|
return 0;
|
|
4430
|
-
const e = this.#l ?? 28, t = this.#x(), i = this.#y(), { groupCount: n, cardCount: r } = this.#C(), o = n * Math.max(0, t - e),
|
|
4431
|
-
return o +
|
|
4450
|
+
const e = this.#l ?? 28, t = this.#x(), i = this.#y(), { groupCount: n, cardCount: r } = this.#C(), o = n * Math.max(0, t - e), s = r * Math.max(0, i - e);
|
|
4451
|
+
return o + s;
|
|
4432
4452
|
}
|
|
4433
4453
|
getExtraHeightBefore(e) {
|
|
4434
4454
|
if (!this.#t || !this.config.cardRenderer || !this.#b())
|
|
4435
4455
|
return 0;
|
|
4436
4456
|
const t = this.#l ?? 28, i = this.#x(), n = this.#y(), r = Math.max(0, i - t), o = Math.max(0, n - t);
|
|
4437
|
-
let
|
|
4457
|
+
let s = 0, l = 0;
|
|
4438
4458
|
const d = this.rows, c = Math.min(e, d.length);
|
|
4439
4459
|
for (let u = 0; u < c; u++)
|
|
4440
|
-
d[u].__isGroupRow ?
|
|
4441
|
-
return
|
|
4460
|
+
d[u].__isGroupRow ? s++ : l++;
|
|
4461
|
+
return s * r + l * o;
|
|
4442
4462
|
}
|
|
4443
4463
|
#E() {
|
|
4444
4464
|
let e = 0;
|
|
@@ -4455,8 +4475,8 @@ class An extends A {
|
|
|
4455
4475
|
if (n !== this.#w && (this.#w = n, e = !0), i) {
|
|
4456
4476
|
const o = this.gridElement.querySelector(".data-grid-row.group-row");
|
|
4457
4477
|
if (o) {
|
|
4458
|
-
const
|
|
4459
|
-
|
|
4478
|
+
const s = o.getBoundingClientRect().height;
|
|
4479
|
+
s > 0 && s !== this.#f && (this.#f = s, e = !0);
|
|
4460
4480
|
}
|
|
4461
4481
|
}
|
|
4462
4482
|
const r = this.gridElement.querySelector(".data-grid-row.responsive-card");
|
|
@@ -4469,7 +4489,7 @@ class An extends A {
|
|
|
4469
4489
|
}));
|
|
4470
4490
|
}
|
|
4471
4491
|
}
|
|
4472
|
-
const $i = '@layer tbw-plugins{.dg-row-drag-handle{display:flex;align-items:center;justify-content:center;cursor:grab;user-select:none;color:var(--tbw-row-reorder-handle-color, var(--tbw-color-fg-muted));transition:color var(--tbw-transition-duration, .12s) var(--tbw-transition-ease, ease);font-size:var(--tbw-font-size, 1em);letter-spacing:-2px;&:hover{color:var(--tbw-row-reorder-handle-hover, var(--tbw-color-fg))}&:active{cursor:grabbing}}.data-grid-row.dragging{opacity:.6}.data-grid-row.drop-target{position:relative;&.drop-before:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background-color:var(--tbw-row-reorder-indicator, var(--tbw-color-accent));z-index:10}&.drop-after:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background-color:var(--tbw-row-reorder-indicator, var(--tbw-color-accent));z-index:10}}.data-grid-row.keyboard-moving{background-color:var(--tbw-row-reorder-moving-bg, var(--tbw-focus-background));box-shadow:0 0 0 1px var(--tbw-row-reorder-moving-border, var(--tbw-color-accent)) inset}.data-grid-row.flip-animating{transition:transform var(--tbw-animation-duration, .2s) ease-out;will-change:transform;z-index:1}}', ji = "__tbw_row_drag";
|
|
4492
|
+
const $i = '@layer tbw-plugins{[data-field=__tbw_row_drag]{display:flex;align-items:center;justify-content:center}.dg-row-drag-handle{display:flex;align-items:center;justify-content:center;min-width:1em;min-height:1em;cursor:grab;user-select:none;color:var(--tbw-row-reorder-handle-color, var(--tbw-color-fg-muted));transition:color var(--tbw-transition-duration, .12s) var(--tbw-transition-ease, ease);font-size:var(--tbw-font-size, 1em);letter-spacing:-2px;&:hover{color:var(--tbw-row-reorder-handle-hover, var(--tbw-color-fg))}&:active{cursor:grabbing}}.data-grid-row.dragging{opacity:.6}.data-grid-row.drop-target{position:relative;&.drop-before:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background-color:var(--tbw-row-reorder-indicator, var(--tbw-color-accent));z-index:10}&.drop-after:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background-color:var(--tbw-row-reorder-indicator, var(--tbw-color-accent));z-index:10}}.data-grid-row.keyboard-moving{background-color:var(--tbw-row-reorder-moving-bg, var(--tbw-focus-background));box-shadow:0 0 0 1px var(--tbw-row-reorder-moving-border, var(--tbw-color-accent)) inset}.data-grid-row.flip-animating{transition:transform var(--tbw-animation-duration, .2s) ease-out;will-change:transform;z-index:1}}', ji = "__tbw_row_drag";
|
|
4473
4493
|
class _n extends A {
|
|
4474
4494
|
name = "rowReorder";
|
|
4475
4495
|
styles = $i;
|
|
@@ -4539,9 +4559,9 @@ class _n extends A {
|
|
|
4539
4559
|
if (i < 0 || i >= n.length) return;
|
|
4540
4560
|
const r = e.key === "ArrowUp" ? "up" : "down", o = r === "up" ? i - 1 : i + 1;
|
|
4541
4561
|
if (o < 0 || o >= n.length) return;
|
|
4542
|
-
const
|
|
4543
|
-
if (!(this.config.canMove && !this.config.canMove(
|
|
4544
|
-
return this.handleKeyboardMove(
|
|
4562
|
+
const s = n[i];
|
|
4563
|
+
if (!(this.config.canMove && !this.config.canMove(s, i, o, r)))
|
|
4564
|
+
return this.handleKeyboardMove(s, i, o, r, t._focusCol), e.preventDefault(), e.stopPropagation(), !0;
|
|
4545
4565
|
}
|
|
4546
4566
|
onCellClick() {
|
|
4547
4567
|
this.flushPendingMove();
|
|
@@ -4581,8 +4601,8 @@ class _n extends A {
|
|
|
4581
4601
|
const i = this.draggedRowIndex;
|
|
4582
4602
|
let n = this.dropRowIndex;
|
|
4583
4603
|
if (!(!this.isDragging || i === null || n === null) && (n > i && n--, i !== n)) {
|
|
4584
|
-
const o = this.sourceRows[i],
|
|
4585
|
-
(!this.config.canMove || this.config.canMove(o, i, n,
|
|
4604
|
+
const o = this.sourceRows[i], s = n < i ? "up" : "down";
|
|
4605
|
+
(!this.config.canMove || this.config.canMove(o, i, n, s)) && this.executeMove(o, i, n, "drag");
|
|
4586
4606
|
}
|
|
4587
4607
|
});
|
|
4588
4608
|
}
|
|
@@ -4592,8 +4612,8 @@ class _n extends A {
|
|
|
4592
4612
|
currentIndex: i,
|
|
4593
4613
|
row: e
|
|
4594
4614
|
}, this.lastFocusCol = r;
|
|
4595
|
-
const o = this.grid,
|
|
4596
|
-
|
|
4615
|
+
const o = this.grid, s = [...o._rows ?? this.sourceRows], [l] = s.splice(t, 1);
|
|
4616
|
+
s.splice(i, 0, l), o._rows = s, o._focusRow = i, o._focusCol = r, o.refreshVirtualWindow(!0), D(o), this.clearDebounceTimer(), this.debounceTimer = setTimeout(() => {
|
|
4597
4617
|
this.flushPendingMove();
|
|
4598
4618
|
}, this.config.debounceMs ?? 300);
|
|
4599
4619
|
}
|
|
@@ -4609,8 +4629,8 @@ class _n extends A {
|
|
|
4609
4629
|
source: "keyboard"
|
|
4610
4630
|
};
|
|
4611
4631
|
if (this.emitCancelable("row-move", n)) {
|
|
4612
|
-
const o = [...this.sourceRows], [
|
|
4613
|
-
o.splice(e, 0,
|
|
4632
|
+
const o = [...this.sourceRows], [s] = o.splice(t, 1);
|
|
4633
|
+
o.splice(e, 0, s);
|
|
4614
4634
|
const l = this.grid;
|
|
4615
4635
|
l._rows = o, l._focusRow = e, l._focusCol = this.lastFocusCol, l.refreshVirtualWindow(!0), D(l);
|
|
4616
4636
|
}
|
|
@@ -4618,14 +4638,14 @@ class _n extends A {
|
|
|
4618
4638
|
executeMove(e, t, i, n) {
|
|
4619
4639
|
const r = [...this.sourceRows], [o] = r.splice(t, 1);
|
|
4620
4640
|
r.splice(i, 0, o);
|
|
4621
|
-
const
|
|
4641
|
+
const s = {
|
|
4622
4642
|
row: e,
|
|
4623
4643
|
fromIndex: t,
|
|
4624
4644
|
toIndex: i,
|
|
4625
4645
|
rows: r,
|
|
4626
4646
|
source: n
|
|
4627
4647
|
};
|
|
4628
|
-
if (!this.emitCancelable("row-move",
|
|
4648
|
+
if (!this.emitCancelable("row-move", s))
|
|
4629
4649
|
if (this.animationType === "flip" && this.gridElement) {
|
|
4630
4650
|
const d = this.captureRowPositions();
|
|
4631
4651
|
this.grid.rows = r, requestAnimationFrame(() => {
|
|
@@ -4644,7 +4664,7 @@ class _n extends A {
|
|
|
4644
4664
|
animateFLIP(e, t, i) {
|
|
4645
4665
|
const n = this.gridElement;
|
|
4646
4666
|
if (!n || e.size === 0) return;
|
|
4647
|
-
const r = Math.min(t, i), o = Math.max(t, i),
|
|
4667
|
+
const r = Math.min(t, i), o = Math.max(t, i), s = [];
|
|
4648
4668
|
if (n.querySelectorAll(".data-grid-row").forEach((d) => {
|
|
4649
4669
|
const c = d, u = this.getRowIndex(c);
|
|
4650
4670
|
if (u < 0 || u < r || u > o) return;
|
|
@@ -4653,17 +4673,17 @@ class _n extends A {
|
|
|
4653
4673
|
const g = e.get(h);
|
|
4654
4674
|
if (g === void 0) return;
|
|
4655
4675
|
const f = c.getBoundingClientRect().top, p = g - f;
|
|
4656
|
-
Math.abs(p) > 1 &&
|
|
4657
|
-
}),
|
|
4658
|
-
|
|
4676
|
+
Math.abs(p) > 1 && s.push({ el: c, deltaY: p });
|
|
4677
|
+
}), s.length === 0) return;
|
|
4678
|
+
s.forEach(({ el: d, deltaY: c }) => {
|
|
4659
4679
|
d.style.transform = `translateY(${c}px)`;
|
|
4660
4680
|
}), n.offsetHeight;
|
|
4661
4681
|
const l = this.animationDuration;
|
|
4662
4682
|
requestAnimationFrame(() => {
|
|
4663
|
-
|
|
4683
|
+
s.forEach(({ el: d }) => {
|
|
4664
4684
|
d.classList.add("flip-animating"), d.style.transform = "";
|
|
4665
4685
|
}), setTimeout(() => {
|
|
4666
|
-
|
|
4686
|
+
s.forEach(({ el: d }) => {
|
|
4667
4687
|
d.style.transform = "", d.classList.remove("flip-animating");
|
|
4668
4688
|
});
|
|
4669
4689
|
}, l + 50);
|
|
@@ -4682,62 +4702,62 @@ class _n extends A {
|
|
|
4682
4702
|
this.debounceTimer && (clearTimeout(this.debounceTimer), this.debounceTimer = null);
|
|
4683
4703
|
}
|
|
4684
4704
|
}
|
|
4685
|
-
function V(
|
|
4705
|
+
function V(a) {
|
|
4686
4706
|
return {
|
|
4687
|
-
startRow: Math.min(
|
|
4688
|
-
startCol: Math.min(
|
|
4689
|
-
endRow: Math.max(
|
|
4690
|
-
endCol: Math.max(
|
|
4707
|
+
startRow: Math.min(a.startRow, a.endRow),
|
|
4708
|
+
startCol: Math.min(a.startCol, a.endCol),
|
|
4709
|
+
endRow: Math.max(a.startRow, a.endRow),
|
|
4710
|
+
endCol: Math.max(a.startCol, a.endCol)
|
|
4691
4711
|
};
|
|
4692
4712
|
}
|
|
4693
|
-
function Ui(
|
|
4694
|
-
const e = V(
|
|
4713
|
+
function Ui(a) {
|
|
4714
|
+
const e = V(a);
|
|
4695
4715
|
return {
|
|
4696
4716
|
from: { row: e.startRow, col: e.startCol },
|
|
4697
4717
|
to: { row: e.endRow, col: e.endCol }
|
|
4698
4718
|
};
|
|
4699
4719
|
}
|
|
4700
|
-
function lt(
|
|
4701
|
-
return
|
|
4720
|
+
function lt(a) {
|
|
4721
|
+
return a.map(Ui);
|
|
4702
4722
|
}
|
|
4703
|
-
function Yi(
|
|
4723
|
+
function Yi(a, e, t) {
|
|
4704
4724
|
const i = V(t);
|
|
4705
|
-
return
|
|
4725
|
+
return a >= i.startRow && a <= i.endRow && e >= i.startCol && e <= i.endCol;
|
|
4706
4726
|
}
|
|
4707
|
-
function je(
|
|
4708
|
-
return t.some((i) => Yi(
|
|
4727
|
+
function je(a, e, t) {
|
|
4728
|
+
return t.some((i) => Yi(a, e, i));
|
|
4709
4729
|
}
|
|
4710
|
-
function Xi(
|
|
4711
|
-
const e = [], t = V(
|
|
4730
|
+
function Xi(a) {
|
|
4731
|
+
const e = [], t = V(a);
|
|
4712
4732
|
for (let i = t.startRow; i <= t.endRow; i++)
|
|
4713
4733
|
for (let n = t.startCol; n <= t.endCol; n++)
|
|
4714
4734
|
e.push({ row: i, col: n });
|
|
4715
4735
|
return e;
|
|
4716
4736
|
}
|
|
4717
|
-
function Zi(
|
|
4737
|
+
function Zi(a) {
|
|
4718
4738
|
const e = /* @__PURE__ */ new Map();
|
|
4719
|
-
for (const t of
|
|
4739
|
+
for (const t of a)
|
|
4720
4740
|
for (const i of Xi(t))
|
|
4721
4741
|
e.set(`${i.row},${i.col}`, i);
|
|
4722
4742
|
return [...e.values()];
|
|
4723
4743
|
}
|
|
4724
|
-
function de(
|
|
4744
|
+
function de(a, e) {
|
|
4725
4745
|
return {
|
|
4726
|
-
startRow:
|
|
4727
|
-
startCol:
|
|
4746
|
+
startRow: a.row,
|
|
4747
|
+
startCol: a.col,
|
|
4728
4748
|
endRow: e.row,
|
|
4729
4749
|
endCol: e.col
|
|
4730
4750
|
};
|
|
4731
4751
|
}
|
|
4732
|
-
function Z(
|
|
4733
|
-
const t = V(
|
|
4752
|
+
function Z(a, e) {
|
|
4753
|
+
const t = V(a), i = V(e);
|
|
4734
4754
|
return t.startRow === i.startRow && t.startCol === i.startCol && t.endRow === i.endRow && t.endCol === i.endCol;
|
|
4735
4755
|
}
|
|
4736
|
-
const Qi = "@layer tbw-plugins{tbw-grid{&.selecting .data-grid-row>.cell{user-select:none}&[data-has-focus] .data-grid-row.row-focus{background-color:var(--tbw-focus-background, rgba(from var(--tbw-color-accent) r g b / 12%))}&[data-selection-mode=row] .cell-focus{outline:none}.data-grid-row>.cell.selected{background-color:var(--tbw-range-selection-bg);&.top{border-top:2px solid var(--tbw-range-border-color)}&.bottom{border-bottom:2px solid var(--tbw-range-border-color)}&.first{border-left:2px solid var(--tbw-range-border-color)}&.last{border-right:2px solid var(--tbw-range-border-color)}}.data-grid-row[data-selectable=false]{cursor:not-allowed;opacity:.6;&.row-focus{background-color:var(--tbw-color-row-alt)}}.data-grid-row>.cell[data-selectable=false]{cursor:not-allowed;opacity:.6;&.selected{background-color:var(--tbw-selection-warning-bg, rgba(from var(--tbw-color-error) r g b / 50%))}}.tbw-selection-summary{font-size:var(--tbw-font-size-sm, .8125rem);color:var(--tbw-color-fg-muted);white-space:nowrap}}}";
|
|
4737
|
-
function Ji(
|
|
4738
|
-
if (
|
|
4756
|
+
const Qi = "@layer tbw-plugins{tbw-grid{&.selecting .data-grid-row>.cell{user-select:none}&:has(.selection){user-select:none}&[data-has-focus] .data-grid-row.row-focus{background-color:var(--tbw-focus-background, rgba(from var(--tbw-color-accent) r g b / 12%))}&[data-selection-mode=row] .cell-focus{outline:none}.data-grid-row>.cell.selected{background-color:var(--tbw-range-selection-bg);&.top{border-top:2px solid var(--tbw-range-border-color)}&.bottom{border-bottom:2px solid var(--tbw-range-border-color)}&.first{border-left:2px solid var(--tbw-range-border-color)}&.last{border-right:2px solid var(--tbw-range-border-color)}}.data-grid-row[data-selectable=false]{cursor:not-allowed;opacity:.6;&.row-focus{background-color:var(--tbw-color-row-alt)}}.data-grid-row>.cell[data-selectable=false]{cursor:not-allowed;opacity:.6;&.selected{background-color:var(--tbw-selection-warning-bg, rgba(from var(--tbw-color-error) r g b / 50%))}}.tbw-selection-summary{font-size:var(--tbw-font-size-sm, .8125rem);color:var(--tbw-color-fg-muted);white-space:nowrap}}}";
|
|
4757
|
+
function Ji(a, e, t) {
|
|
4758
|
+
if (a === "cell" && e.selectedCell)
|
|
4739
4759
|
return {
|
|
4740
|
-
mode:
|
|
4760
|
+
mode: a,
|
|
4741
4761
|
ranges: [
|
|
4742
4762
|
{
|
|
4743
4763
|
from: { row: e.selectedCell.row, col: e.selectedCell.col },
|
|
@@ -4745,14 +4765,14 @@ function Ji(s, e, t) {
|
|
|
4745
4765
|
}
|
|
4746
4766
|
]
|
|
4747
4767
|
};
|
|
4748
|
-
if (
|
|
4768
|
+
if (a === "row" && e.selected.size > 0) {
|
|
4749
4769
|
const i = [...e.selected].map((n) => ({
|
|
4750
4770
|
from: { row: n, col: 0 },
|
|
4751
4771
|
to: { row: n, col: t - 1 }
|
|
4752
4772
|
}));
|
|
4753
|
-
return { mode:
|
|
4773
|
+
return { mode: a, ranges: i };
|
|
4754
4774
|
}
|
|
4755
|
-
return
|
|
4775
|
+
return a === "range" && e.ranges.length > 0 ? { mode: a, ranges: lt(e.ranges) } : { mode: a, ranges: [] };
|
|
4756
4776
|
}
|
|
4757
4777
|
class Tn extends A {
|
|
4758
4778
|
static manifest = {
|
|
@@ -4821,7 +4841,7 @@ class Tn extends A {
|
|
|
4821
4841
|
const { rowIndex: t, colIndex: i, originalEvent: n } = e, { mode: r, triggerOn: o = "click" } = this.config;
|
|
4822
4842
|
if (n.type !== o)
|
|
4823
4843
|
return !1;
|
|
4824
|
-
const
|
|
4844
|
+
const s = this.columns[i], l = s && q(s);
|
|
4825
4845
|
if (r === "cell") {
|
|
4826
4846
|
if (l || !this.isCellSelectable(t, i))
|
|
4827
4847
|
return !1;
|
|
@@ -4885,13 +4905,13 @@ class Tn extends A {
|
|
|
4885
4905
|
const r = this.rows.length, o = this.columns.length;
|
|
4886
4906
|
if (r > 0 && o > 0) {
|
|
4887
4907
|
e.preventDefault(), e.stopPropagation();
|
|
4888
|
-
const
|
|
4908
|
+
const s = {
|
|
4889
4909
|
startRow: 0,
|
|
4890
4910
|
startCol: 0,
|
|
4891
4911
|
endRow: r - 1,
|
|
4892
4912
|
endCol: o - 1
|
|
4893
4913
|
};
|
|
4894
|
-
return this.ranges = [
|
|
4914
|
+
return this.ranges = [s], this.activeRange = s, this.emit("selection-change", this.#t()), this.requestAfterRender(), !0;
|
|
4895
4915
|
}
|
|
4896
4916
|
}
|
|
4897
4917
|
return !1;
|
|
@@ -4915,7 +4935,7 @@ class Tn extends A {
|
|
|
4915
4935
|
let t = e.colIndex;
|
|
4916
4936
|
const i = this.columns[t];
|
|
4917
4937
|
if (i && q(i)) {
|
|
4918
|
-
const o = this.columns.findIndex((
|
|
4938
|
+
const o = this.columns.findIndex((s) => !q(s));
|
|
4919
4939
|
o >= 0 && (t = o);
|
|
4920
4940
|
}
|
|
4921
4941
|
const n = de(this.cellAnchor, { row: e.rowIndex, col: t }), r = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null;
|
|
@@ -4936,14 +4956,14 @@ class Tn extends A {
|
|
|
4936
4956
|
if (r.forEach((o) => {
|
|
4937
4957
|
o.classList.remove("selected", "row-focus"), i && o.removeAttribute("data-selectable");
|
|
4938
4958
|
}), t === "row" && (xe(e), r.forEach((o) => {
|
|
4939
|
-
const
|
|
4959
|
+
const s = o.querySelector(".cell[data-row]"), l = mt(s);
|
|
4940
4960
|
l >= 0 && (i && !this.isRowSelectable(l) && o.setAttribute("data-selectable", "false"), this.selected.has(l) && o.classList.add("selected", "row-focus"));
|
|
4941
|
-
})), (t === "cell" || t === "range") && i && e.querySelectorAll(".cell[data-row][data-col]").forEach((
|
|
4942
|
-
const l = parseInt(
|
|
4943
|
-
l >= 0 && d >= 0 && (this.isCellSelectable(l, d) ||
|
|
4961
|
+
})), (t === "cell" || t === "range") && i && e.querySelectorAll(".cell[data-row][data-col]").forEach((s) => {
|
|
4962
|
+
const l = parseInt(s.getAttribute("data-row") ?? "-1", 10), d = parseInt(s.getAttribute("data-col") ?? "-1", 10);
|
|
4963
|
+
l >= 0 && d >= 0 && (this.isCellSelectable(l, d) || s.setAttribute("data-selectable", "false"));
|
|
4944
4964
|
}), t === "range" && this.ranges.length > 0) {
|
|
4945
4965
|
xe(e);
|
|
4946
|
-
const o = this.activeRange ? V(this.activeRange) : null,
|
|
4966
|
+
const o = this.activeRange ? V(this.activeRange) : null, s = this.columns.findIndex((d) => !q(d));
|
|
4947
4967
|
this.columns.length - 1, e.querySelectorAll(".cell[data-row][data-col]").forEach((d) => {
|
|
4948
4968
|
const c = parseInt(d.getAttribute("data-row") ?? "-1", 10), u = parseInt(d.getAttribute("data-col") ?? "-1", 10);
|
|
4949
4969
|
if (c >= 0 && u >= 0) {
|
|
@@ -4952,7 +4972,7 @@ class Tn extends A {
|
|
|
4952
4972
|
return;
|
|
4953
4973
|
if (je(c, u, this.ranges) && (d.classList.add("selected"), o)) {
|
|
4954
4974
|
c === o.startRow && d.classList.add("top"), c === o.endRow && d.classList.add("bottom");
|
|
4955
|
-
const f = Math.max(o.startCol,
|
|
4975
|
+
const f = Math.max(o.startCol, s);
|
|
4956
4976
|
u === f && d.classList.add("first"), u === o.endCol && d.classList.add("last");
|
|
4957
4977
|
}
|
|
4958
4978
|
}
|
|
@@ -4969,8 +4989,8 @@ class Tn extends A {
|
|
|
4969
4989
|
this.pendingKeyboardUpdate = null;
|
|
4970
4990
|
const r = this.grid._focusRow, o = this.grid._focusCol;
|
|
4971
4991
|
if (n && this.cellAnchor) {
|
|
4972
|
-
const
|
|
4973
|
-
this.ranges = [
|
|
4992
|
+
const s = de(this.cellAnchor, { row: r, col: o });
|
|
4993
|
+
this.ranges = [s], this.activeRange = s;
|
|
4974
4994
|
} else n || (this.ranges = [], this.activeRange = null, this.cellAnchor = { row: r, col: o });
|
|
4975
4995
|
this.emit("selection-change", this.#t());
|
|
4976
4996
|
}
|
|
@@ -5018,34 +5038,34 @@ class Tn extends A {
|
|
|
5018
5038
|
);
|
|
5019
5039
|
}
|
|
5020
5040
|
}
|
|
5021
|
-
function J(
|
|
5022
|
-
return Math.floor(
|
|
5041
|
+
function J(a, e) {
|
|
5042
|
+
return Math.floor(a / e);
|
|
5023
5043
|
}
|
|
5024
|
-
function en(
|
|
5044
|
+
function en(a, e) {
|
|
5025
5045
|
return {
|
|
5026
|
-
start:
|
|
5027
|
-
end: (
|
|
5046
|
+
start: a * e,
|
|
5047
|
+
end: (a + 1) * e
|
|
5028
5048
|
};
|
|
5029
5049
|
}
|
|
5030
|
-
function tn(
|
|
5031
|
-
const i = J(
|
|
5050
|
+
function tn(a, e, t) {
|
|
5051
|
+
const i = J(a, t), n = J(e - 1, t), r = [];
|
|
5032
5052
|
for (let o = i; o <= n; o++)
|
|
5033
5053
|
r.push(o);
|
|
5034
5054
|
return r;
|
|
5035
5055
|
}
|
|
5036
|
-
async function Ue(
|
|
5056
|
+
async function Ue(a, e, t, i) {
|
|
5037
5057
|
const n = en(e, t);
|
|
5038
|
-
return
|
|
5058
|
+
return a.getRows({
|
|
5039
5059
|
startRow: n.start,
|
|
5040
5060
|
endRow: n.end,
|
|
5041
5061
|
sortModel: i.sortModel,
|
|
5042
5062
|
filterModel: i.filterModel
|
|
5043
5063
|
});
|
|
5044
5064
|
}
|
|
5045
|
-
function nn(
|
|
5046
|
-
const i = J(
|
|
5065
|
+
function nn(a, e, t) {
|
|
5066
|
+
const i = J(a, e), n = t.get(i);
|
|
5047
5067
|
if (!n) return;
|
|
5048
|
-
const r =
|
|
5068
|
+
const r = a % e;
|
|
5049
5069
|
return n[r];
|
|
5050
5070
|
}
|
|
5051
5071
|
const rn = 100;
|
|
@@ -5119,17 +5139,17 @@ class Ln extends A {
|
|
|
5119
5139
|
return this.loadedBlocks.size;
|
|
5120
5140
|
}
|
|
5121
5141
|
}
|
|
5122
|
-
function dt(
|
|
5123
|
-
return
|
|
5142
|
+
function dt(a, e, t) {
|
|
5143
|
+
return a.id !== void 0 ? String(a.id) : t ? `${t}-${e}` : String(e);
|
|
5124
5144
|
}
|
|
5125
|
-
function ce(
|
|
5126
|
-
const t = new Set(
|
|
5145
|
+
function ce(a, e) {
|
|
5146
|
+
const t = new Set(a);
|
|
5127
5147
|
return t.has(e) ? t.delete(e) : t.add(e), t;
|
|
5128
5148
|
}
|
|
5129
|
-
function fe(
|
|
5149
|
+
function fe(a, e, t = null, i = 0) {
|
|
5130
5150
|
const n = e.childrenField ?? "children", r = /* @__PURE__ */ new Set();
|
|
5131
|
-
for (let o = 0; o <
|
|
5132
|
-
const
|
|
5151
|
+
for (let o = 0; o < a.length; o++) {
|
|
5152
|
+
const s = a[o], l = dt(s, o, t), d = s[n];
|
|
5133
5153
|
if (Array.isArray(d) && d.length > 0) {
|
|
5134
5154
|
r.add(l);
|
|
5135
5155
|
const c = fe(d, e, l, i + 1);
|
|
@@ -5141,13 +5161,13 @@ function fe(s, e, t = null, i = 0) {
|
|
|
5141
5161
|
function on() {
|
|
5142
5162
|
return /* @__PURE__ */ new Set();
|
|
5143
5163
|
}
|
|
5144
|
-
function ct(
|
|
5164
|
+
function ct(a, e, t, i = null, n = 0) {
|
|
5145
5165
|
const r = t.childrenField ?? "children";
|
|
5146
|
-
for (let o = 0; o <
|
|
5147
|
-
const
|
|
5166
|
+
for (let o = 0; o < a.length; o++) {
|
|
5167
|
+
const s = a[o], l = dt(s, o, i);
|
|
5148
5168
|
if (l === e)
|
|
5149
5169
|
return [l];
|
|
5150
|
-
const d =
|
|
5170
|
+
const d = s[r];
|
|
5151
5171
|
if (Array.isArray(d) && d.length > 0) {
|
|
5152
5172
|
const c = ct(d, e, t, l, n + 1);
|
|
5153
5173
|
if (c)
|
|
@@ -5156,17 +5176,17 @@ function ct(s, e, t, i = null, n = 0) {
|
|
|
5156
5176
|
}
|
|
5157
5177
|
return null;
|
|
5158
5178
|
}
|
|
5159
|
-
function sn(
|
|
5160
|
-
const n = ct(
|
|
5179
|
+
function sn(a, e, t, i) {
|
|
5180
|
+
const n = ct(a, e, t);
|
|
5161
5181
|
if (!n) return i;
|
|
5162
5182
|
const r = new Set(i);
|
|
5163
5183
|
for (let o = 0; o < n.length - 1; o++)
|
|
5164
5184
|
r.add(n[o]);
|
|
5165
5185
|
return r;
|
|
5166
5186
|
}
|
|
5167
|
-
function Ye(
|
|
5168
|
-
if (!Array.isArray(
|
|
5169
|
-
for (const t of
|
|
5187
|
+
function Ye(a, e = "children") {
|
|
5188
|
+
if (!Array.isArray(a) || a.length === 0) return !1;
|
|
5189
|
+
for (const t of a) {
|
|
5170
5190
|
if (!t) continue;
|
|
5171
5191
|
const i = t[e];
|
|
5172
5192
|
if (Array.isArray(i) && i.length > 0)
|
|
@@ -5174,10 +5194,10 @@ function Ye(s, e = "children") {
|
|
|
5174
5194
|
}
|
|
5175
5195
|
return !1;
|
|
5176
5196
|
}
|
|
5177
|
-
function an(
|
|
5178
|
-
if (!Array.isArray(
|
|
5197
|
+
function an(a) {
|
|
5198
|
+
if (!Array.isArray(a) || a.length === 0) return null;
|
|
5179
5199
|
const e = ["children", "items", "nodes", "subRows", "nested"];
|
|
5180
|
-
for (const t of
|
|
5200
|
+
for (const t of a)
|
|
5181
5201
|
if (!(!t || typeof t != "object"))
|
|
5182
5202
|
for (const i of e) {
|
|
5183
5203
|
const n = t[i];
|
|
@@ -5259,11 +5279,11 @@ class Fn extends A {
|
|
|
5259
5279
|
withStableKeys(e, t = null) {
|
|
5260
5280
|
const i = this.config.childrenField ?? "children";
|
|
5261
5281
|
return e.map((n, r) => {
|
|
5262
|
-
const o = n.__stableKey,
|
|
5282
|
+
const o = n.__stableKey, s = n.id !== void 0 ? String(n.id) : o ?? (t ? `${t}-${r}` : String(r)), l = n[i], d = Array.isArray(l) && l.length > 0;
|
|
5263
5283
|
return {
|
|
5264
5284
|
...n,
|
|
5265
|
-
__stableKey:
|
|
5266
|
-
...d ? { [i]: this.withStableKeys(l,
|
|
5285
|
+
__stableKey: s,
|
|
5286
|
+
...d ? { [i]: this.withStableKeys(l, s) } : {}
|
|
5267
5287
|
};
|
|
5268
5288
|
});
|
|
5269
5289
|
}
|
|
@@ -5284,24 +5304,24 @@ class Fn extends A {
|
|
|
5284
5304
|
}
|
|
5285
5305
|
sortTree(e, t, i) {
|
|
5286
5306
|
const n = this.config.childrenField ?? "children";
|
|
5287
|
-
return [...e].sort((o,
|
|
5288
|
-
const l = o[t], d =
|
|
5307
|
+
return [...e].sort((o, s) => {
|
|
5308
|
+
const l = o[t], d = s[t];
|
|
5289
5309
|
return l == null && d == null ? 0 : l == null ? -1 : d == null ? 1 : l > d ? i : l < d ? -i : 0;
|
|
5290
5310
|
}).map((o) => {
|
|
5291
|
-
const
|
|
5292
|
-
return Array.isArray(
|
|
5311
|
+
const s = o[n];
|
|
5312
|
+
return Array.isArray(s) && s.length > 0 ? { ...o, [n]: this.sortTree(s, t, i) } : o;
|
|
5293
5313
|
});
|
|
5294
5314
|
}
|
|
5295
5315
|
processColumns(e) {
|
|
5296
5316
|
if (this.flattenedRows.length === 0) return [...e];
|
|
5297
5317
|
const t = [...e];
|
|
5298
5318
|
if (t.length === 0) return t;
|
|
5299
|
-
const i = t[0], n = i.viewRenderer, r = () => this.config, o = this.setIcon.bind(this),
|
|
5319
|
+
const i = t[0], n = i.viewRenderer, r = () => this.config, o = this.setIcon.bind(this), s = this.resolveIcon.bind(this), l = (d) => {
|
|
5300
5320
|
const { row: c, value: u } = d, { showExpandIcons: h = !0, indentWidth: g } = r(), f = c, p = f.__treeDepth ?? 0, w = document.createElement("span");
|
|
5301
5321
|
if (w.className = "tree-cell-wrapper", w.style.setProperty("--tbw-tree-depth", String(p)), g !== void 0 && w.style.setProperty("--tbw-tree-indent-width", `${g}px`), h)
|
|
5302
5322
|
if (f.__treeHasChildren) {
|
|
5303
5323
|
const v = document.createElement("span");
|
|
5304
|
-
v.className = `tree-toggle${f.__treeExpanded ? " expanded" : ""}`, o(v,
|
|
5324
|
+
v.className = `tree-toggle${f.__treeExpanded ? " expanded" : ""}`, o(v, s(f.__treeExpanded ? "collapse" : "expand")), v.setAttribute("data-tree-key", String(f.__treeKey ?? "")), w.appendChild(v);
|
|
5305
5325
|
} else {
|
|
5306
5326
|
const v = document.createElement("span");
|
|
5307
5327
|
v.className = "tree-spacer", w.appendChild(v);
|
|
@@ -5354,8 +5374,8 @@ class Fn extends A {
|
|
|
5354
5374
|
if (!t) return;
|
|
5355
5375
|
const i = e === "fade" ? "tbw-tree-fade-in" : "tbw-tree-slide-in";
|
|
5356
5376
|
for (const n of t.querySelectorAll(".data-grid-row")) {
|
|
5357
|
-
const r = n.querySelector(".cell[data-row]"), o = r ? parseInt(r.getAttribute("data-row") ?? "-1", 10) : -1,
|
|
5358
|
-
|
|
5377
|
+
const r = n.querySelector(".cell[data-row]"), o = r ? parseInt(r.getAttribute("data-row") ?? "-1", 10) : -1, s = this.flattenedRows[o]?.key;
|
|
5378
|
+
s && this.keysToAnimate.has(s) && (n.classList.add(i), n.addEventListener("animationend", () => n.classList.remove(i), { once: !0 }));
|
|
5359
5379
|
}
|
|
5360
5380
|
this.keysToAnimate.clear();
|
|
5361
5381
|
}
|
|
@@ -5390,8 +5410,8 @@ class Fn extends A {
|
|
|
5390
5410
|
this.expandedKeys = sn(this.rows, e, this.config, this.expandedKeys), this.requestRender();
|
|
5391
5411
|
}
|
|
5392
5412
|
}
|
|
5393
|
-
function dn(
|
|
5394
|
-
const i = [...
|
|
5413
|
+
function dn(a, e, t) {
|
|
5414
|
+
const i = [...a.undoStack, e];
|
|
5395
5415
|
for (; i.length > t; )
|
|
5396
5416
|
i.shift();
|
|
5397
5417
|
return {
|
|
@@ -5399,43 +5419,43 @@ function dn(s, e, t) {
|
|
|
5399
5419
|
redoStack: []
|
|
5400
5420
|
};
|
|
5401
5421
|
}
|
|
5402
|
-
function Xe(
|
|
5403
|
-
if (
|
|
5404
|
-
return { newState:
|
|
5405
|
-
const e = [...
|
|
5422
|
+
function Xe(a) {
|
|
5423
|
+
if (a.undoStack.length === 0)
|
|
5424
|
+
return { newState: a, action: null };
|
|
5425
|
+
const e = [...a.undoStack], t = e.pop();
|
|
5406
5426
|
return t ? {
|
|
5407
5427
|
newState: {
|
|
5408
5428
|
undoStack: e,
|
|
5409
|
-
redoStack: [...
|
|
5429
|
+
redoStack: [...a.redoStack, t]
|
|
5410
5430
|
},
|
|
5411
5431
|
action: t
|
|
5412
|
-
} : { newState:
|
|
5432
|
+
} : { newState: a, action: null };
|
|
5413
5433
|
}
|
|
5414
|
-
function Ze(
|
|
5415
|
-
if (
|
|
5416
|
-
return { newState:
|
|
5417
|
-
const e = [...
|
|
5434
|
+
function Ze(a) {
|
|
5435
|
+
if (a.redoStack.length === 0)
|
|
5436
|
+
return { newState: a, action: null };
|
|
5437
|
+
const e = [...a.redoStack], t = e.pop();
|
|
5418
5438
|
return t ? {
|
|
5419
5439
|
newState: {
|
|
5420
|
-
undoStack: [...
|
|
5440
|
+
undoStack: [...a.undoStack, t],
|
|
5421
5441
|
redoStack: e
|
|
5422
5442
|
},
|
|
5423
5443
|
action: t
|
|
5424
|
-
} : { newState:
|
|
5444
|
+
} : { newState: a, action: null };
|
|
5425
5445
|
}
|
|
5426
|
-
function cn(
|
|
5427
|
-
return
|
|
5446
|
+
function cn(a) {
|
|
5447
|
+
return a.undoStack.length > 0;
|
|
5428
5448
|
}
|
|
5429
|
-
function un(
|
|
5430
|
-
return
|
|
5449
|
+
function un(a) {
|
|
5450
|
+
return a.redoStack.length > 0;
|
|
5431
5451
|
}
|
|
5432
5452
|
function hn() {
|
|
5433
5453
|
return { undoStack: [], redoStack: [] };
|
|
5434
5454
|
}
|
|
5435
|
-
function gn(
|
|
5455
|
+
function gn(a, e, t, i) {
|
|
5436
5456
|
return {
|
|
5437
5457
|
type: "cell-edit",
|
|
5438
|
-
rowIndex:
|
|
5458
|
+
rowIndex: a,
|
|
5439
5459
|
field: e,
|
|
5440
5460
|
oldValue: t,
|
|
5441
5461
|
newValue: i,
|
|
@@ -5533,8 +5553,8 @@ class In extends A {
|
|
|
5533
5553
|
}
|
|
5534
5554
|
}
|
|
5535
5555
|
const fn = '@layer tbw-plugins{.tbw-visibility-content{display:flex;flex-direction:column;height:100%}.tbw-visibility-list{flex:1;overflow-y:auto;padding:var(--tbw-panel-padding, var(--tbw-spacing-md, .5rem))}.tbw-visibility-row{display:flex;align-items:center;gap:var(--tbw-panel-gap, var(--tbw-spacing-md, .5rem));padding:var(--tbw-menu-item-padding, .375rem .25rem);cursor:pointer;font-size:var(--tbw-font-size-sm, .8125rem);border-radius:var(--tbw-border-radius, .25rem);position:relative}.tbw-visibility-row:hover{background:var(--tbw-visibility-hover, var(--tbw-color-row-hover))}.tbw-visibility-row input[type=checkbox]{cursor:pointer}.tbw-visibility-row.locked span{color:var(--tbw-color-fg-muted)}.tbw-visibility-handle{cursor:grab;color:var(--tbw-color-fg-muted);font-size:var(--tbw-font-size-2xs, .625rem);letter-spacing:-2px;user-select:none;flex-shrink:0}.tbw-visibility-row.reorderable:hover .tbw-visibility-handle{color:var(--tbw-color-fg)}.tbw-visibility-label{display:flex;align-items:center;gap:var(--tbw-panel-gap, var(--tbw-spacing-md, .5rem));flex:1;cursor:pointer}.tbw-visibility-row.dragging{opacity:.5;cursor:grabbing}.tbw-visibility-row.drop-before:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--tbw-visibility-indicator, var(--tbw-color-accent))}.tbw-visibility-row.drop-after:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--tbw-visibility-indicator, var(--tbw-color-accent))}.tbw-visibility-show-all{margin:var(--tbw-panel-padding, var(--tbw-spacing-md, .5rem));padding:var(--tbw-button-padding, .5rem .75rem);border:1px solid var(--tbw-visibility-border, var(--tbw-color-border));border-radius:var(--tbw-border-radius, .25rem);background:var(--tbw-visibility-btn-bg, var(--tbw-color-header-bg));color:var(--tbw-color-fg);cursor:pointer;font-size:var(--tbw-font-size-sm, .8125rem)}.tbw-visibility-show-all:hover{background:var(--tbw-visibility-hover, var(--tbw-color-row-hover))}}';
|
|
5536
|
-
function Qe(
|
|
5537
|
-
const e =
|
|
5556
|
+
function Qe(a) {
|
|
5557
|
+
const e = a.meta ?? {};
|
|
5538
5558
|
return e.lockPosition !== !0 && e.suppressMovable !== !0;
|
|
5539
5559
|
}
|
|
5540
5560
|
class B extends A {
|
|
@@ -5632,8 +5652,8 @@ class B extends A {
|
|
|
5632
5652
|
e.innerHTML = "";
|
|
5633
5653
|
const i = this.grid.getAllColumns().filter((n) => !n.utility);
|
|
5634
5654
|
for (let n = 0; n < i.length; n++) {
|
|
5635
|
-
const r = i[n], o = r.header || r.field,
|
|
5636
|
-
|
|
5655
|
+
const r = i[n], o = r.header || r.field, s = document.createElement("div");
|
|
5656
|
+
s.className = r.lockVisible ? "tbw-visibility-row locked" : "tbw-visibility-row", s.setAttribute("data-field", r.field), s.setAttribute("data-index", String(n)), t && Qe(r) && (s.draggable = !0, s.classList.add("reorderable"), this.setupDragListeners(s, r.field, n, e));
|
|
5637
5657
|
const l = document.createElement("label");
|
|
5638
5658
|
l.className = "tbw-visibility-label";
|
|
5639
5659
|
const d = document.createElement("input");
|
|
@@ -5643,9 +5663,9 @@ class B extends A {
|
|
|
5643
5663
|
const c = document.createElement("span");
|
|
5644
5664
|
if (c.textContent = o, l.appendChild(d), l.appendChild(c), t && Qe(r)) {
|
|
5645
5665
|
const u = document.createElement("span");
|
|
5646
|
-
u.className = "tbw-visibility-handle", this.setIcon(u, this.resolveIcon("dragHandle")), u.title = "Drag to reorder",
|
|
5666
|
+
u.className = "tbw-visibility-handle", this.setIcon(u, this.resolveIcon("dragHandle")), u.title = "Drag to reorder", s.appendChild(u);
|
|
5647
5667
|
}
|
|
5648
|
-
|
|
5668
|
+
s.appendChild(l), e.appendChild(s);
|
|
5649
5669
|
}
|
|
5650
5670
|
}
|
|
5651
5671
|
setupDragListeners(e, t, i, n) {
|
|
@@ -5655,22 +5675,22 @@ class B extends A {
|
|
|
5655
5675
|
this.isDragging = !1, this.draggedField = null, this.draggedIndex = null, this.dropIndex = null, this.clearDragClasses(n);
|
|
5656
5676
|
}), e.addEventListener("dragover", (r) => {
|
|
5657
5677
|
if (r.preventDefault(), !this.isDragging || this.draggedField === t) return;
|
|
5658
|
-
const o = e.getBoundingClientRect(),
|
|
5659
|
-
this.dropIndex = r.clientY <
|
|
5678
|
+
const o = e.getBoundingClientRect(), s = o.top + o.height / 2;
|
|
5679
|
+
this.dropIndex = r.clientY < s ? i : i + 1, n.querySelectorAll(".tbw-visibility-row").forEach((l) => {
|
|
5660
5680
|
l !== e && l.classList.remove("drop-target", "drop-before", "drop-after");
|
|
5661
|
-
}), e.classList.add("drop-target"), e.classList.toggle("drop-before", r.clientY <
|
|
5681
|
+
}), e.classList.add("drop-target"), e.classList.toggle("drop-before", r.clientY < s), e.classList.toggle("drop-after", r.clientY >= s);
|
|
5662
5682
|
}), e.addEventListener("dragleave", () => {
|
|
5663
5683
|
e.classList.remove("drop-target", "drop-before", "drop-after");
|
|
5664
5684
|
}), e.addEventListener("drop", (r) => {
|
|
5665
5685
|
r.preventDefault();
|
|
5666
|
-
const o = this.draggedField,
|
|
5667
|
-
if (!this.isDragging || o === null ||
|
|
5686
|
+
const o = this.draggedField, s = this.draggedIndex, l = this.dropIndex;
|
|
5687
|
+
if (!this.isDragging || o === null || s === null || l === null)
|
|
5668
5688
|
return;
|
|
5669
|
-
const d = l >
|
|
5670
|
-
if (d !==
|
|
5689
|
+
const d = l > s ? l - 1 : l;
|
|
5690
|
+
if (d !== s) {
|
|
5671
5691
|
const c = this.grid.getAllColumns(), h = c.filter((p) => !p.utility)[d]?.field, g = h ? c.findIndex((p) => p.field === h) : c.length, f = {
|
|
5672
5692
|
field: o,
|
|
5673
|
-
fromIndex:
|
|
5693
|
+
fromIndex: s,
|
|
5674
5694
|
toIndex: g
|
|
5675
5695
|
};
|
|
5676
5696
|
this.emit("column-reorder-request", f), setTimeout(() => {
|