@reportportal/ui-kit 0.0.1-alpha.157 → 0.0.1-alpha.159

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