@reportportal/ui-kit 0.0.1-alpha.160 → 0.0.1-alpha.162

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.
@@ -1,1059 +0,0 @@
1
- import { jsx as h, jsxs as F, Fragment as zt } from "react/jsx-runtime";
2
- import { useMemo as de, useState as B, useCallback as x, useEffect as P, useRef as H, useLayoutEffect as et, forwardRef as xt } from "react";
3
- import { Resizable as At } from "react-resizable";
4
- import { c as me } from "./bind-06a7ff84.js";
5
- import { b as $t, a as Ye, S as Mt } from "./resizeColumn-46b5b30f.js";
6
- import { S as Je } from "./chevronDownDropdown-0260bb66.js";
7
- import { C as ie } from "./checkbox-493fdc63.js";
8
- import { Tooltip as Ht } from "./tooltip.js";
9
- import { createPortal as Wt } from "react-dom";
10
- import { i as Pt } from "./isEmpty-ccacb5ff.js";
11
- const tt = (t) => typeof t == "string", Bt = "_table_1rtld_1", St = "_resizable_1rtld_67", Gt = "_selectable_1rtld_84", Ft = "_expanded_1rtld_80", qt = "_label_1rtld_353", Ut = {
12
- table: Bt,
13
- "fixed-header": "_fixed-header_1rtld_10",
14
- "external-scroll-container": "_external-scroll-container_1rtld_14",
15
- "horizontally-scrollable-container": "_horizontally-scrollable-container_1rtld_21",
16
- "table-header": "_table-header_1rtld_26",
17
- "sticky-header": "_sticky-header_1rtld_34",
18
- "pinned-header": "_pinned-header_1rtld_44",
19
- "horizontally-scrollable": "_horizontally-scrollable_1rtld_21",
20
- resizable: St,
21
- "resizable-column": "_resizable-column_1rtld_67",
22
- "table-row": "_table-row_1rtld_75",
23
- "expanded-cell": "_expanded-cell_1rtld_80",
24
- selectable: Gt,
25
- "row-content-wrapper": "_row-content-wrapper_1rtld_88",
26
- "pinned-column": "_pinned-column_1rtld_96",
27
- "has-scroll": "_has-scroll_1rtld_96",
28
- "table-row-content": "_table-row-content_1rtld_99",
29
- "expand-cell": "_expand-cell_1rtld_116",
30
- "left-border-accent": "_left-border-accent_1rtld_119",
31
- "size-small": "_size-small_1rtld_129",
32
- "size-large": "_size-large_1rtld_140",
33
- "table-body": "_table-body_1rtld_152",
34
- "scrollable-body": "_scrollable-body_1rtld_158",
35
- "table-header-cell": "_table-header-cell_1rtld_222",
36
- "table-cell": "_table-cell_1rtld_223",
37
- "action-menu-cell": "_action-menu-cell_1rtld_229",
38
- "checkbox-cell": "_checkbox-cell_1rtld_257",
39
- "expand-all-tooltip-wrapper": "_expand-all-tooltip-wrapper_1rtld_302",
40
- "expand-all-tooltip-content": "_expand-all-tooltip-content_1rtld_311",
41
- "expand-icon": "_expand-icon_1rtld_320",
42
- expanded: Ft,
43
- "primary-cell": "_primary-cell_1rtld_329",
44
- label: qt,
45
- "sortable-cell": "_sortable-cell_1rtld_367",
46
- "align-right": "_align-right_1rtld_370",
47
- "align-center": "_align-center_1rtld_376",
48
- "table-wrapper": "_table-wrapper_1rtld_430",
49
- "checkbox-column": "_checkbox-column_1rtld_442",
50
- "checkbox-header": "_checkbox-header_1rtld_454",
51
- "checkbox-body": "_checkbox-body_1rtld_478",
52
- "checkbox-row": "_checkbox-row_1rtld_485"
53
- }, nt = "asc", C = 32, rt = 100, Dt = 48, we = 48, Xt = (t) => t.toLowerCase() === nt, jt = (t) => t.map((l) => l.key), V = (t) => "primary" in t && t.primary === !0, Qe = (t) => {
54
- var o;
55
- return `size-${((o = t.rowConfigs) == null ? void 0 : o.size) ?? "default"}`;
56
- }, ye = (t) => tt(t) ? t : `${t}px`, It = (t, l, o, i, d, u = !1) => {
57
- let p = 0;
58
- i && (p += C), d && !u && (p += C);
59
- for (let b = 0; b < t; b++) {
60
- const a = l[b];
61
- if (V(a)) {
62
- const n = o.current.get(a.key) || rt;
63
- p += n;
64
- } else {
65
- const n = a, c = tt(n.width) ? parseInt(n.width, 10) || 0 : n.width;
66
- p += c;
67
- }
68
- }
69
- return p;
70
- }, ae = (t, l, o, i, d, u, p, b = !1) => {
71
- const a = {};
72
- if (!V(t)) {
73
- const n = t;
74
- a.textAlign = n.align;
75
- }
76
- if (l && o !== void 0) {
77
- const n = It(
78
- o,
79
- i,
80
- d,
81
- u,
82
- p,
83
- b
84
- );
85
- a.left = `${n}px`;
86
- }
87
- return a;
88
- }, Ze = (t, l, o, i, d, u = !1, p, b = !1, a = !1) => {
89
- const n = [];
90
- o && n.push(`${C}px`), u && i && !a && n.push(`${C}px`);
91
- const c = (_) => {
92
- if ((p == null ? void 0 : p[_.key]) !== void 0) {
93
- n.push(`${p[_.key]}px`);
94
- return;
95
- }
96
- if (V(_)) {
97
- const v = _;
98
- if (b && v.width) {
99
- n.push(ye(v.width));
100
- return;
101
- }
102
- const k = v.width ? ye(v.width) : `${rt}px`;
103
- n.push(`minmax(${k}, 1fr)`);
104
- } else {
105
- const k = ye(_.width);
106
- n.push(k);
107
- }
108
- };
109
- return t.forEach(c), l.forEach(c), d && n.push(`${Dt}px`), n.join(" ");
110
- }, Rt = ({
111
- primaryColumns: t,
112
- fixedColumns: l,
113
- pinnedColumnKeys: o
114
- }) => de(() => {
115
- const i = [], d = [];
116
- return t.forEach((u) => {
117
- const p = { ...u, primary: !0 };
118
- o.includes(u.key) ? i.push(p) : d.push(p);
119
- }), l.forEach((u) => {
120
- o.includes(u.key) ? i.push(u) : d.push(u);
121
- }), {
122
- pinnedColumns: i,
123
- scrollableColumns: d
124
- };
125
- }, [t, l, o]), Vt = () => {
126
- const [t, l] = B(null), [o, i] = B(null), d = x((a) => {
127
- l(a);
128
- }, []), u = x(() => {
129
- l(null);
130
- }, []), p = x((a) => {
131
- i(a);
132
- }, []), b = x(() => {
133
- i(null);
134
- }, []);
135
- return {
136
- hoveredColumn: t,
137
- hoveredRow: o,
138
- handleColumnMouseEnter: d,
139
- handleColumnMouseLeave: u,
140
- handleRowMouseEnter: p,
141
- handleRowMouseLeave: b
142
- };
143
- }, Ct = ({
144
- primaryColumns: t,
145
- fixedColumns: l,
146
- expandedRowIds: o,
147
- onToggleRowExpansion: i
148
- }) => {
149
- const [d, u] = B(/* @__PURE__ */ new Set());
150
- P(() => {
151
- const a = [
152
- ...t.map((c) => c.key),
153
- ...l.map((c) => c.key)
154
- ], n = /* @__PURE__ */ new Set();
155
- o.forEach((c) => {
156
- a.forEach((_) => {
157
- n.add(`${c}-${_}`);
158
- });
159
- }), u((c) => {
160
- if (c.size === n.size) {
161
- let _ = !0;
162
- if (c.forEach((v) => {
163
- n.has(v) || (_ = !1);
164
- }), _)
165
- return c;
166
- }
167
- return n;
168
- });
169
- }, [o, t, l]);
170
- const p = x(
171
- (a) => {
172
- const n = new Set(d), c = o.includes(a), _ = [
173
- ...t.map((v) => v.key),
174
- ...l.map((v) => v.key)
175
- ];
176
- c ? _.forEach((v) => {
177
- const k = `${a}-${v}`;
178
- n.delete(k);
179
- }) : _.forEach((v) => {
180
- const k = `${a}-${v}`;
181
- n.add(k);
182
- }), u(n), i(a);
183
- },
184
- [d, o, t, l, i]
185
- ), b = x(
186
- (a, n) => {
187
- const c = `${a}-${n}`;
188
- return d.has(c);
189
- },
190
- [d]
191
- );
192
- return {
193
- expandedCells: d,
194
- handleToggleRowExpansion: p,
195
- isCellExpanded: b
196
- };
197
- }, Yt = () => {
198
- const t = H(/* @__PURE__ */ new Map()), l = x(
199
- (o) => (i) => {
200
- if (!i)
201
- return;
202
- const d = i.getBoundingClientRect().width;
203
- d > 0 && t.current.set(o, d);
204
- },
205
- []
206
- );
207
- return {
208
- columnWidthsRef: t,
209
- setCellRef: l
210
- };
211
- }, Jt = ({
212
- enabled: t = !1,
213
- minWidth: l = 50,
214
- maxWidth: o = 500,
215
- columnWidthsRef: i,
216
- onColumnResize: d
217
- }) => {
218
- const [u, p] = B({}), b = x(() => {
219
- if (!t || Object.keys(u).length > 0 || !i)
220
- return;
221
- const c = {};
222
- i.current.forEach((_, v) => {
223
- c[v] = _;
224
- }), p(c);
225
- }, [t, u, i]), a = x(
226
- (c) => (_, { size: v }) => {
227
- if (!t)
228
- return;
229
- const k = Math.min(o, Math.max(l, v.width));
230
- p((z) => ({ ...z, [c]: k }));
231
- },
232
- [t, l, o]
233
- ), n = x(
234
- (c) => () => {
235
- !t || !u[c] || d == null || d(c, u[c]);
236
- },
237
- [t, u, d]
238
- );
239
- return {
240
- columnWidths: u,
241
- handleResize: a,
242
- handleResizeStop: n,
243
- handleResizeStart: b
244
- };
245
- }, Qt = (t, l, o, i, d, u, p, b) => de(() => {
246
- if (!t)
247
- return {
248
- visible: !1,
249
- position: { top: 0, left: 0 },
250
- size: { width: 0, height: 0 }
251
- };
252
- if (!(d + t.clientWidth < p))
253
- return {
254
- visible: !1,
255
- position: { top: 0, left: 0 },
256
- size: { width: 0, height: 0 }
257
- };
258
- const n = t.getBoundingClientRect(), c = (l == null ? void 0 : l.offsetHeight) || 0, _ = o == null ? void 0 : o.getBoundingClientRect(), v = Math.min(
259
- n.bottom,
260
- (_ == null ? void 0 : _.bottom) || Number.MAX_SAFE_INTEGER
261
- );
262
- let k;
263
- i && o && _ ? k = _.top - n.top + c : k = c;
264
- const z = n.top + k, S = t.scrollWidth > t.clientWidth ? t.offsetHeight - t.clientHeight : 0, N = v - z - S, q = t.scrollHeight > t.clientHeight ? t.offsetWidth - t.clientWidth : 0, j = n.right - we - q;
265
- return {
266
- visible: !0,
267
- position: {
268
- top: z,
269
- left: j
270
- },
271
- size: {
272
- width: we,
273
- height: N
274
- }
275
- };
276
- }, [
277
- t,
278
- l,
279
- o,
280
- i,
281
- d,
282
- u,
283
- p,
284
- b
285
- ]), Zt = (t, l, o, i, d, u, p, b) => de(() => {
286
- if (!t)
287
- return {
288
- visible: !1,
289
- position: { top: 0, left: 0 },
290
- size: { width: 0, height: 0 }
291
- };
292
- if (!(l > 0))
293
- return {
294
- visible: !1,
295
- position: { top: 0, left: 0 },
296
- size: { width: 0, height: 0 }
297
- };
298
- const n = t.querySelector('[data-row-index="0"]');
299
- if (!n)
300
- return {
301
- visible: !1,
302
- position: { top: 0, left: 0 },
303
- size: { width: 0, height: 0 }
304
- };
305
- const c = Array.from(n.querySelectorAll("[data-pinned-index]"));
306
- if (c.length === 0)
307
- return {
308
- visible: !1,
309
- position: { top: 0, left: 0 },
310
- size: { width: 0, height: 0 }
311
- };
312
- const _ = Math.max(
313
- ...c.map(
314
- (J) => parseInt(J.getAttribute("data-pinned-index") || "-1", 10)
315
- )
316
- );
317
- if (_ < 0)
318
- return {
319
- visible: !1,
320
- position: { top: 0, left: 0 },
321
- size: { width: 0, height: 0 }
322
- };
323
- const v = c.find(
324
- (J) => parseInt(J.getAttribute("data-pinned-index") || "-1", 10) === _
325
- );
326
- if (!v)
327
- return {
328
- visible: !1,
329
- position: { top: 0, left: 0 },
330
- size: { width: 0, height: 0 }
331
- };
332
- const k = v.getBoundingClientRect(), z = t.getBoundingClientRect(), E = (o == null ? void 0 : o.offsetHeight) || 0, S = i == null ? void 0 : i.getBoundingClientRect(), N = k.right, M = Math.min(
333
- z.bottom,
334
- (S == null ? void 0 : S.bottom) || Number.MAX_SAFE_INTEGER
335
- );
336
- let q;
337
- d && i && S ? q = S.top - z.top + E : q = E;
338
- const j = z.top + q, Y = t.scrollWidth > t.clientWidth ? t.offsetHeight - t.clientHeight : 0, O = M - j - Y;
339
- return {
340
- visible: !0,
341
- position: {
342
- top: j,
343
- left: N
344
- },
345
- size: {
346
- width: we,
347
- height: O
348
- }
349
- };
350
- }, [
351
- t,
352
- l,
353
- o,
354
- i,
355
- d,
356
- u,
357
- p,
358
- b
359
- ]), Kt = ({ enabled: t, rowCount: l }) => {
360
- const o = H(/* @__PURE__ */ new Map()), i = H(/* @__PURE__ */ new Map()), d = x(
361
- (a) => (n) => {
362
- n ? o.current.set(a, n) : o.current.delete(a);
363
- },
364
- []
365
- ), u = x(
366
- (a) => (n) => {
367
- n ? i.current.set(a, n) : i.current.delete(a);
368
- },
369
- []
370
- ), p = x((a, n) => {
371
- const c = `${a.offsetHeight}px`;
372
- n.style.height !== c && (n.style.height = c);
373
- }, []), b = x(() => {
374
- o.current.forEach((a, n) => {
375
- const c = i.current.get(n);
376
- c && p(a, c);
377
- });
378
- }, [p]);
379
- return P(() => {
380
- if (!t)
381
- return;
382
- const a = new ResizeObserver((n) => {
383
- requestAnimationFrame(() => {
384
- n.forEach((c) => {
385
- const _ = c.target, v = parseInt(_.dataset.rowIndex || "-1", 10), k = i.current.get(v);
386
- k && v >= 0 && p(_, k);
387
- });
388
- });
389
- });
390
- return o.current.forEach((n) => a.observe(n)), () => a.disconnect();
391
- }, [t, l, p]), et(() => {
392
- t && b();
393
- }, [t, l, b]), { setTableRowRef: d, setCheckboxRowRef: u, syncAllHeights: b };
394
- }, Ot = {
395
- "resize-handle": "_resize-handle_15uk3_1"
396
- }, en = me.bind(Ot), tn = xt(
397
- (t, l) => /* @__PURE__ */ h("div", { ref: l, className: en("resize-handle"), ...t, children: /* @__PURE__ */ h($t, {}) })
398
- ), nn = {
399
- "gradient-overlay": "_gradient-overlay_hx7m8_1",
400
- "direction-right": "_direction-right_hx7m8_5",
401
- "direction-left": "_direction-left_hx7m8_13"
402
- }, rn = me.bind(nn), Ke = ({
403
- portalContainer: t,
404
- visible: l,
405
- position: o,
406
- size: i,
407
- direction: d,
408
- className: u,
409
- dataTestId: p
410
- }) => {
411
- if (!l || !t)
412
- return null;
413
- const b = {
414
- position: "fixed",
415
- top: `${o.top}px`,
416
- width: `${i.width}px`,
417
- height: `${i.height}px`
418
- };
419
- return o.left !== void 0 && (b.left = `${o.left}px`), o.right !== void 0 && (b.right = `${o.right}px`), Wt(
420
- /* @__PURE__ */ h(
421
- "div",
422
- {
423
- className: rn("gradient-overlay", `direction-${d}`, u),
424
- style: b,
425
- "data-gradient-type": p
426
- }
427
- ),
428
- t
429
- );
430
- }, f = me.bind(Ut), Oe = ({ column: t }) => {
431
- const l = H(null), [o, i] = B(!1);
432
- return P(() => {
433
- if (l.current) {
434
- const d = l.current.offsetWidth, u = l.current.scrollWidth;
435
- i(u > d);
436
- }
437
- }, [t.header]), /* @__PURE__ */ h("span", { ref: l, title: o ? t.header : void 0, children: t.header });
438
- }, gn = ({
439
- data: t,
440
- primaryColumn: l,
441
- fixedColumns: o,
442
- renderRowActions: i,
443
- className: d = "",
444
- wrapperClassName: u = "",
445
- rowClassName: p = "",
446
- headerClassName: b = "",
447
- bodyClassName: a = "",
448
- selectable: n = !1,
449
- selectedRowIds: c = [],
450
- sortingDirection: _ = nt,
451
- sortingColumn: v,
452
- sortableColumns: k,
453
- isHeaderFixed: z = !1,
454
- isHorizontallyScrollable: E = !1,
455
- pinnedColumnKeys: S = [],
456
- isRowsExpandable: N = !1,
457
- expandedRowIds: M = [],
458
- isAllExpandedByDefault: q,
459
- expandAllTooltip: j,
460
- isResizable: $ = !1,
461
- minColumnWidth: Y = 50,
462
- maxColumnWidth: O = 500,
463
- isSelectAllCheckboxAlwaysVisible: J = !1,
464
- isCheckboxOutside: L = !1,
465
- onChangeSorting: st = () => {
466
- },
467
- onToggleRowSelection: ot = () => {
468
- },
469
- onToggleAllRowsSelection: ct = () => {
470
- },
471
- onToggleRowExpansion: lt = () => {
472
- },
473
- onToggleAllRowsExpansion: it = () => {
474
- },
475
- onColumnResize: at = () => {
476
- },
477
- externalScrollContainerRef: y,
478
- portalContainer: ke = typeof document < "u" ? document.body : null,
479
- rightGradientClassName: dt,
480
- pinnedGradientClassName: ht
481
- }) => {
482
- const ee = de(
483
- () => Array.isArray(l) ? l : [l],
484
- [l]
485
- ), G = v ?? ee[0], te = k ?? jt([...ee, ...o]), { pinnedColumns: U, scrollableColumns: ne } = Rt({
486
- primaryColumns: ee,
487
- fixedColumns: o,
488
- pinnedColumnKeys: S
489
- }), {
490
- hoveredColumn: Ee,
491
- hoveredRow: Te,
492
- handleColumnMouseEnter: Le,
493
- handleColumnMouseLeave: Ne,
494
- handleRowMouseEnter: ze,
495
- handleRowMouseLeave: xe
496
- } = Vt(), { columnWidthsRef: Q, setCellRef: Ae } = Yt(), { handleToggleRowExpansion: pt, isCellExpanded: $e } = Ct({
497
- primaryColumns: ee,
498
- fixedColumns: o,
499
- expandedRowIds: M,
500
- onToggleRowExpansion: lt
501
- }), { columnWidths: re, handleResize: ut, handleResizeStop: ft, handleResizeStart: _t } = Jt({
502
- enabled: $,
503
- minWidth: Y,
504
- maxWidth: O,
505
- columnWidthsRef: Q,
506
- onColumnResize: at
507
- }), { setTableRowRef: gt, setCheckboxRowRef: vt } = Kt({
508
- enabled: n && L,
509
- rowCount: t.length
510
- }), Me = (e, s) => /* @__PURE__ */ h(
511
- At,
512
- {
513
- width: re[e.key] ?? (typeof e.width == "number" ? e.width : Y),
514
- height: 0,
515
- axis: "x",
516
- handle: /* @__PURE__ */ h(tn, {}),
517
- onResizeStart: _t,
518
- onResize: ut(e.key),
519
- onResizeStop: ft(e.key),
520
- minConstraints: [Y, 0],
521
- maxConstraints: [O, 0],
522
- className: f("resizable-column"),
523
- children: s
524
- },
525
- e.key
526
- ), T = H(null), D = H(null), bt = H(null), Z = H(null), he = H(null), [I, yt] = B(!1), se = x((e) => {
527
- const s = D.current;
528
- if (s && s.contains(e))
529
- return;
530
- const r = e.parentElement;
531
- if (!r)
532
- return;
533
- const g = window.getComputedStyle(r), w = parseFloat(g.paddingTop) || 0, m = parseFloat(g.paddingBottom) || 0, W = e.offsetHeight + w + m;
534
- e.style.setProperty("--expand-cell-top", `${w}px`), e.style.setProperty("--expand-cell-height", `${W}px`);
535
- }, []), [He, pe] = B(0), [We, ue] = B(0), [Pe, fe] = B(0), [Be, Se] = B(0), oe = H(!1), _e = H(/* @__PURE__ */ new Set()), K = H(null), ge = Qt(
536
- T.current,
537
- D.current,
538
- (y == null ? void 0 : y.current) instanceof HTMLElement ? y.current : null,
539
- I,
540
- He,
541
- We,
542
- Pe,
543
- Be
544
- ), ve = Zt(
545
- T.current,
546
- He,
547
- D.current,
548
- (y == null ? void 0 : y.current) instanceof HTMLElement ? y.current : null,
549
- I,
550
- We,
551
- Pe,
552
- Be
553
- ), Ge = (e) => {
554
- te.includes(e) && st({ key: e, direction: _ });
555
- }, Fe = (e) => {
556
- ot(e);
557
- }, qe = () => {
558
- ct();
559
- }, wt = () => {
560
- it();
561
- }, Ue = (e) => te.includes(e) ? (G == null ? void 0 : G.key) === e ? Xt(_) ? /* @__PURE__ */ h(Ye, {}) : /* @__PURE__ */ h(Mt, {}) : /* @__PURE__ */ h(Ye, {}) : null, De = t.every((e) => c.includes(e.id)), Xe = t.some((e) => c.includes(e.id)), be = (c == null ? void 0 : c.length) > 0, mt = !Pt(t), je = J && mt || be, kt = t.every((e) => M.includes(e.id)), Et = q !== void 0 ? q : kt, Tt = Ze(
562
- U,
563
- ne,
564
- N,
565
- n,
566
- !!i,
567
- !1,
568
- $ ? re : void 0,
569
- $,
570
- L
571
- ), Lt = Ze(
572
- U,
573
- ne,
574
- N,
575
- n,
576
- !!i,
577
- !0,
578
- $ ? re : void 0,
579
- $,
580
- L
581
- ), Ie = /* @__PURE__ */ h("button", { onClick: wt, "aria-label": "Toggle all rows expansion", children: /* @__PURE__ */ h("span", { className: f("expand-icon", { expanded: Et }), children: /* @__PURE__ */ h(Je, {}) }) });
582
- P(() => {
583
- if (!(y != null && y.current) || !T.current || !D.current)
584
- return;
585
- const e = y.current, s = T.current, r = D.current, g = he.current, w = () => {
586
- const A = s.getBoundingClientRect(), W = e.getBoundingClientRect(), R = r.offsetHeight, X = A.top - W.top, ce = A.bottom - W.top, Ve = e.scrollTop > 0 && X <= 0 && ce > R;
587
- if (yt(Ve), Ve) {
588
- const le = A.left, Ce = W.top;
589
- r.classList.add(f("pinned-header")), E && (r.style.overflow = "hidden", r.style.overflowX = "hidden"), r.style.left = `${le}px`, r.style.top = `${Ce}px`, r.style.width = `${A.width}px`, g && L && (g.style.top = `${Ce}px`);
590
- } else {
591
- const le = s.scrollLeft;
592
- oe.current = !0, r.classList.remove(f("pinned-header")), E && (r.scrollLeft = 0), r.style.left = "", r.style.top = "", r.style.width = "", E && (r.style.overflow = "", r.style.overflowX = ""), g && L && (g.style.top = "", g.classList.remove(f("pinned-header"))), E && le > 0 ? requestAnimationFrame(() => {
593
- s.scrollLeft = le, setTimeout(() => {
594
- oe.current = !1;
595
- }, 0);
596
- }) : oe.current = !1;
597
- }
598
- }, m = requestAnimationFrame(() => {
599
- w();
600
- });
601
- return e.addEventListener("scroll", w), window.addEventListener("resize", w), () => {
602
- cancelAnimationFrame(m), e.removeEventListener("scroll", w), window.removeEventListener("resize", w);
603
- };
604
- }, [y, E, L]), P(() => {
605
- if (!(y != null && y.current) || !T.current || !D.current || !I)
606
- return;
607
- const e = y.current, s = T.current, r = D.current, g = he.current, w = () => {
608
- const X = s.getBoundingClientRect(), ce = e.getBoundingClientRect();
609
- r.style.left = `${X.left}px`, r.style.top = `${ce.top}px`, r.style.width = `${X.width}px`, g && L && (g.style.top = `${ce.top}px`);
610
- }, m = (X) => {
611
- oe.current || (X === r ? s.scrollLeft = r.scrollLeft : r.scrollLeft = s.scrollLeft, K.current && K.current());
612
- }, A = () => {
613
- m(s), w();
614
- }, W = () => {
615
- m(r);
616
- }, R = () => {
617
- w();
618
- };
619
- return s.addEventListener("scroll", A), E && r.addEventListener("scroll", W), e.addEventListener("scroll", R), window.addEventListener("resize", w), m(s), w(), () => {
620
- s.removeEventListener("scroll", A), E && r.removeEventListener("scroll", W), e.removeEventListener("scroll", R), window.removeEventListener("resize", w);
621
- };
622
- }, [I, y, E, L]), P(() => {
623
- if (!T.current || !E)
624
- return;
625
- const e = T.current, s = y == null ? void 0 : y.current;
626
- pe(e.scrollLeft), ue((s == null ? void 0 : s.scrollTop) || e.scrollTop || 0), fe(e.scrollWidth);
627
- const r = () => {
628
- e && (pe(e.scrollLeft), ue((s == null ? void 0 : s.scrollTop) || e.scrollTop || 0), fe(e.scrollWidth));
629
- };
630
- let g = null;
631
- const w = () => {
632
- g === null && (g = requestAnimationFrame(() => {
633
- r(), g = null;
634
- }));
635
- }, m = () => {
636
- w();
637
- }, A = () => {
638
- w();
639
- };
640
- e.addEventListener("scroll", m, { passive: !0 }), s && s.addEventListener("scroll", A, {
641
- passive: !0
642
- });
643
- const W = () => {
644
- r(), Se((X) => X + 1);
645
- };
646
- window.addEventListener("resize", W), K.current = r, r();
647
- const R = new ResizeObserver(() => {
648
- r();
649
- });
650
- return e && R.observe(e), () => {
651
- e.removeEventListener("scroll", m), s && s.removeEventListener("scroll", A), window.removeEventListener("resize", W), R.disconnect(), g !== null && (cancelAnimationFrame(g), g = null);
652
- };
653
- }, [E, y, I, M]), P(() => {
654
- if (!T.current || !E)
655
- return;
656
- const e = T.current, s = y == null ? void 0 : y.current;
657
- requestAnimationFrame(() => {
658
- e && (pe(e.scrollLeft), ue((s == null ? void 0 : s.scrollTop) || e.scrollTop || 0), fe(e.scrollWidth), K.current && K.current());
659
- });
660
- }, [re, E, y]), P(() => {
661
- if (!T.current)
662
- return;
663
- const e = T.current, s = () => {
664
- Array.from(e.querySelectorAll('[data-base-left="0"]')).forEach(se);
665
- };
666
- requestAnimationFrame(() => {
667
- s();
668
- });
669
- }, [N, t, se]), P(() => {
670
- if (!T.current)
671
- return;
672
- const e = T.current, s = new Set(M), r = _e.current, g = /* @__PURE__ */ new Set();
673
- if (M.forEach((m) => {
674
- r.has(m) || g.add(m);
675
- }), r.forEach((m) => {
676
- s.has(m) || g.add(m);
677
- }), g.size === 0) {
678
- _e.current = s;
679
- return;
680
- }
681
- const w = setTimeout(() => {
682
- g.forEach((m) => {
683
- const A = e.querySelector(
684
- `[data-base-left="0"][data-row-id="${m}"]`
685
- );
686
- A && se(A);
687
- }), Se((m) => m + 1);
688
- }, 0);
689
- return _e.current = s, () => clearTimeout(w);
690
- }, [N, M, se]), P(() => {
691
- if (!Z.current || !T.current || !L)
692
- return;
693
- const e = Z.current, s = T.current, r = () => {
694
- requestAnimationFrame(() => {
695
- e.scrollTop = s.scrollTop;
696
- });
697
- };
698
- return s.addEventListener("scroll", r), () => {
699
- s.removeEventListener("scroll", r);
700
- };
701
- }, [t, L]), et(() => {
702
- if (!T.current || !Z.current)
703
- return;
704
- const e = T.current, s = Z.current, r = () => {
705
- const w = `${e.clientHeight}px`;
706
- s.style.height !== w && (s.style.height = w);
707
- };
708
- r();
709
- const g = new ResizeObserver(() => {
710
- requestAnimationFrame(r);
711
- });
712
- return g.observe(e), () => g.disconnect();
713
- }, []);
714
- const Nt = () => /* @__PURE__ */ F("div", { className: f("checkbox-column"), ref: Z, children: [
715
- /* @__PURE__ */ h(
716
- "div",
717
- {
718
- ref: he,
719
- className: f(
720
- "table-header",
721
- "checkbox-header",
722
- { "pinned-header": I },
723
- b
724
- ),
725
- children: je && /* @__PURE__ */ h(
726
- ie,
727
- {
728
- value: De,
729
- partiallyChecked: Xe,
730
- onChange: qe,
731
- className: f("checkbox-cell")
732
- }
733
- )
734
- }
735
- ),
736
- /* @__PURE__ */ h("div", { className: f("checkbox-body", a), children: t.map((e, s) => /* @__PURE__ */ h(
737
- "div",
738
- {
739
- ref: vt(s),
740
- className: f("checkbox-row", "table-row", Qe(e), p),
741
- onMouseEnter: () => ze(s),
742
- onMouseLeave: xe,
743
- children: (be || Te === s) && /* @__PURE__ */ h(
744
- ie,
745
- {
746
- value: c.includes(e.id),
747
- onChange: () => Fe(e.id),
748
- className: f("checkbox-cell")
749
- }
750
- )
751
- },
752
- e.id
753
- )) })
754
- ] }), Re = () => /* @__PURE__ */ F(
755
- "div",
756
- {
757
- ref: T,
758
- className: f(
759
- "table",
760
- {
761
- "fixed-header": z,
762
- "horizontally-scrollable-container": z && (E || $),
763
- "external-scroll-container": z && !!y
764
- },
765
- d
766
- ),
767
- children: [
768
- /* @__PURE__ */ F(
769
- "div",
770
- {
771
- ref: D,
772
- className: f(
773
- "table-header",
774
- {
775
- "sticky-header": z && !I,
776
- "horizontally-scrollable": E,
777
- resizable: $
778
- },
779
- b
780
- ),
781
- style: { gridTemplateColumns: Lt },
782
- children: [
783
- n && !L && /* @__PURE__ */ h(
784
- "div",
785
- {
786
- className: f("table-header-cell", "checkbox-cell"),
787
- "data-base-left": N ? C : 0,
788
- children: je && /* @__PURE__ */ h(
789
- ie,
790
- {
791
- value: De,
792
- partiallyChecked: Xe,
793
- onChange: qe,
794
- className: f("checkbox-cell")
795
- }
796
- )
797
- }
798
- ),
799
- N && /* @__PURE__ */ h(
800
- "div",
801
- {
802
- className: f("table-header-cell", "expand-cell", "left-border-accent"),
803
- "data-base-left": "0",
804
- children: j ? /* @__PURE__ */ h(
805
- Ht,
806
- {
807
- content: j,
808
- placement: "top",
809
- wrapperClassName: f("expand-all-tooltip-wrapper"),
810
- contentClassName: f("expand-all-tooltip-content"),
811
- children: Ie
812
- }
813
- ) : Ie
814
- }
815
- ),
816
- U.map((e, s) => {
817
- const r = /* @__PURE__ */ h(
818
- "button",
819
- {
820
- "data-column-key": e.key,
821
- "data-pinned-index": s,
822
- className: f("table-header-cell", "pinned-column", {
823
- [`align-${e.align}`]: "align" in e,
824
- "primary-cell": V(e),
825
- "sortable-cell": te.includes(e.key),
826
- resizable: $
827
- }),
828
- style: ae(
829
- e,
830
- !0,
831
- s,
832
- U,
833
- Q,
834
- N,
835
- n,
836
- L
837
- ),
838
- children: /* @__PURE__ */ F(
839
- "div",
840
- {
841
- className: f("label"),
842
- onClick: () => Ge(e.key),
843
- onMouseEnter: () => Le(e.key),
844
- onMouseLeave: Ne,
845
- children: [
846
- /* @__PURE__ */ h(Oe, { column: e }),
847
- (Ee === e.key || (G == null ? void 0 : G.key) === e.key) && Ue(e.key)
848
- ]
849
- }
850
- )
851
- },
852
- e.key
853
- );
854
- return $ ? Me(e, r) : r;
855
- }),
856
- ne.map((e) => {
857
- const s = /* @__PURE__ */ h(
858
- "button",
859
- {
860
- className: f("table-header-cell", {
861
- [`align-${e.align}`]: "align" in e,
862
- "primary-cell": V(e),
863
- "sortable-cell": te.includes(e.key),
864
- resizable: $
865
- }),
866
- style: ae(
867
- e,
868
- !1,
869
- void 0,
870
- U,
871
- Q,
872
- N,
873
- n,
874
- L
875
- ),
876
- children: /* @__PURE__ */ F(
877
- "div",
878
- {
879
- className: f("label"),
880
- onClick: () => Ge(e.key),
881
- onMouseEnter: () => Le(e.key),
882
- onMouseLeave: Ne,
883
- children: [
884
- /* @__PURE__ */ h(Oe, { column: e }),
885
- (Ee === e.key || (G == null ? void 0 : G.key) === e.key) && Ue(e.key)
886
- ]
887
- }
888
- )
889
- },
890
- e.key
891
- );
892
- return $ ? Me(e, s) : s;
893
- }),
894
- i && /* @__PURE__ */ h("div", { className: f("table-header-cell", "action-menu-cell") })
895
- ]
896
- }
897
- ),
898
- /* @__PURE__ */ h(
899
- "div",
900
- {
901
- ref: bt,
902
- className: f(
903
- "table-body",
904
- {
905
- "scrollable-body": z,
906
- "horizontally-scrollable": E,
907
- resizable: $
908
- },
909
- a
910
- ),
911
- children: t.map((e, s) => /* @__PURE__ */ F(
912
- "div",
913
- {
914
- "data-row-index": s,
915
- ref: gt(s),
916
- className: f("table-row", Qe(e), p, {
917
- selectable: n && !L
918
- }),
919
- onMouseEnter: () => ze(s),
920
- onMouseLeave: xe,
921
- children: [
922
- n && !L && /* @__PURE__ */ h(
923
- "div",
924
- {
925
- className: f("table-cell", "checkbox-cell"),
926
- "data-base-left": N ? C : 0,
927
- children: (be || Te === s) && /* @__PURE__ */ h(
928
- ie,
929
- {
930
- value: c.includes(e.id),
931
- onChange: () => Fe(e.id),
932
- className: f("checkbox-cell")
933
- }
934
- )
935
- }
936
- ),
937
- /* @__PURE__ */ h("div", { className: f("row-content-wrapper"), children: /* @__PURE__ */ F("div", { className: f("table-row-content"), style: { gridTemplateColumns: Tt }, children: [
938
- N && /* @__PURE__ */ h(
939
- "div",
940
- {
941
- className: f("table-cell", "expand-cell", "left-border-accent"),
942
- "data-base-left": "0",
943
- "data-row-id": e.id,
944
- children: /* @__PURE__ */ h(
945
- "button",
946
- {
947
- onClick: () => pt(e.id),
948
- "aria-label": M.includes(e.id) ? "Collapse row" : "Expand row",
949
- "aria-expanded": M.includes(e.id),
950
- children: /* @__PURE__ */ h(
951
- "span",
952
- {
953
- className: f("expand-icon", {
954
- expanded: M.includes(e.id)
955
- }),
956
- children: /* @__PURE__ */ h(Je, {})
957
- }
958
- )
959
- }
960
- )
961
- }
962
- ),
963
- U.map((r, g) => {
964
- const w = $e(e.id, r.key), m = V(r);
965
- return /* @__PURE__ */ h(
966
- "div",
967
- {
968
- "data-column-key": r.key,
969
- "data-pinned-index": g,
970
- ref: m ? Ae(r.key) : void 0,
971
- className: f("table-cell", "pinned-column", {
972
- "primary-cell": m,
973
- "expanded-cell": w
974
- }),
975
- style: ae(
976
- r,
977
- !0,
978
- g,
979
- U,
980
- Q,
981
- N,
982
- n,
983
- L
984
- ),
985
- children: e[r.key].component || e[r.key].content || e[r.key]
986
- },
987
- r.key
988
- );
989
- }),
990
- ne.map((r) => {
991
- const g = $e(e.id, r.key), w = V(r);
992
- return /* @__PURE__ */ h(
993
- "div",
994
- {
995
- ref: w ? Ae(r.key) : void 0,
996
- className: f("table-cell", {
997
- "primary-cell": w,
998
- "expanded-cell": g
999
- }),
1000
- style: ae(
1001
- r,
1002
- !1,
1003
- void 0,
1004
- U,
1005
- Q,
1006
- N,
1007
- n,
1008
- L
1009
- ),
1010
- children: e[r.key].component || e[r.key].content || e[r.key]
1011
- },
1012
- r.key
1013
- );
1014
- }),
1015
- i && /* @__PURE__ */ h("div", { className: f("table-cell", "action-menu-cell"), children: i(e.metaData) })
1016
- ] }) })
1017
- ]
1018
- },
1019
- e.id
1020
- ))
1021
- }
1022
- ),
1023
- E && /* @__PURE__ */ F(zt, { children: [
1024
- /* @__PURE__ */ h(
1025
- Ke,
1026
- {
1027
- portalContainer: ke,
1028
- visible: ge.visible,
1029
- position: ge.position,
1030
- size: ge.size,
1031
- direction: "right",
1032
- className: dt,
1033
- dataTestId: "right-gradient"
1034
- }
1035
- ),
1036
- /* @__PURE__ */ h(
1037
- Ke,
1038
- {
1039
- portalContainer: ke,
1040
- visible: ve.visible,
1041
- position: ve.position,
1042
- size: ve.size,
1043
- direction: "left",
1044
- className: ht,
1045
- dataTestId: "pinned-gradient"
1046
- }
1047
- )
1048
- ] })
1049
- ]
1050
- }
1051
- );
1052
- return L ? /* @__PURE__ */ F("div", { className: f("table-wrapper", { "fixed-header": z }, u), children: [
1053
- Nt(),
1054
- Re()
1055
- ] }) : Re();
1056
- };
1057
- export {
1058
- gn as T
1059
- };