@reportportal/ui-kit 0.0.1-alpha.146 → 0.0.1-alpha.148

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,586 +0,0 @@
1
- import { jsx as o, jsxs as S } from "react/jsx-runtime";
2
- import { useMemo as se, useState as T, useCallback as w, useEffect as re, useRef as oe, forwardRef as Pe } from "react";
3
- import { Resizable as De } from "react-resizable";
4
- import { c as ce } from "./bind-06a7ff84.js";
5
- import { c as We, b as ee, a as le, S as Oe } from "./resizeColumn-d4107941.js";
6
- import { C as te } from "./checkbox-ed6cc375.js";
7
- import { Tooltip as Ue } from "./tooltip.js";
8
- const j = (l) => typeof l == "string", je = "_table_aipph_1", He = "_resizable_aipph_46", Be = "_selectable_aipph_60", Ge = "_expanded_aipph_56", Xe = "_label_aipph_300", Ye = {
9
- table: je,
10
- "fixed-header": "_fixed-header_aipph_8",
11
- "horizontally-scrollable-container": "_horizontally-scrollable-container_aipph_14",
12
- "table-header": "_table-header_aipph_19",
13
- "sticky-header": "_sticky-header_aipph_26",
14
- "horizontally-scrollable": "_horizontally-scrollable_aipph_14",
15
- resizable: He,
16
- "table-row": "_table-row_aipph_51",
17
- "expanded-cell": "_expanded-cell_aipph_56",
18
- selectable: Be,
19
- "row-content-wrapper": "_row-content-wrapper_aipph_64",
20
- "table-row-content": "_table-row-content_aipph_72",
21
- "expand-cell": "_expand-cell_aipph_86",
22
- "size-small": "_size-small_aipph_89",
23
- "size-large": "_size-large_aipph_100",
24
- "table-body": "_table-body_aipph_112",
25
- "scrollable-body": "_scrollable-body_aipph_118",
26
- "table-header-cell": "_table-header-cell_aipph_178",
27
- "table-cell": "_table-cell_aipph_179",
28
- "action-menu-cell": "_action-menu-cell_aipph_185",
29
- "checkbox-cell": "_checkbox-cell_aipph_210",
30
- "expand-all-tooltip-wrapper": "_expand-all-tooltip-wrapper_aipph_252",
31
- "expand-all-tooltip-content": "_expand-all-tooltip-content_aipph_261",
32
- "expand-icon": "_expand-icon_aipph_270",
33
- expanded: Ge,
34
- "primary-cell": "_primary-cell_aipph_279",
35
- label: Xe,
36
- "sortable-cell": "_sortable-cell_aipph_314",
37
- "align-right": "_align-right_aipph_317",
38
- "align-center": "_align-center_aipph_323",
39
- "pinned-column": "_pinned-column_aipph_326"
40
- }, ie = "asc", z = 32, he = 100, qe = 48, Je = (l) => l.toLowerCase() === ie, Qe = (l) => l.map((a) => a.key), N = (l) => "primary" in l && l.primary === !0, Ve = (l) => {
41
- var r;
42
- return `size-${((r = l.rowConfigs) == null ? void 0 : r.size) ?? "default"}`;
43
- }, Ze = (l, a, r, c, i) => {
44
- let s = 0;
45
- c && (s += z), i && (s += z);
46
- for (let _ = 0; _ < l; _++) {
47
- const p = a[_];
48
- if (N(p)) {
49
- const t = r.current.get(p.key) || he;
50
- s += t;
51
- } else {
52
- const t = p, h = j(t.width) ? parseInt(t.width, 10) || 0 : t.width;
53
- s += h;
54
- }
55
- }
56
- return s;
57
- }, D = (l, a, r, c, i, s, _) => {
58
- const p = {};
59
- if (!N(l)) {
60
- const t = l;
61
- p.textAlign = t.align;
62
- }
63
- if (a && r !== void 0) {
64
- const t = Ze(
65
- r,
66
- c,
67
- i,
68
- s,
69
- _
70
- );
71
- p.left = `${t}px`;
72
- }
73
- return p;
74
- }, ae = (l, a, r, c, i, s = !1, _) => {
75
- const p = [];
76
- r && p.push(`${z}px`), s && c && p.push(`${z}px`);
77
- const t = (h) => {
78
- if ((_ == null ? void 0 : _[h.key]) !== void 0) {
79
- p.push(`${_[h.key]}px`);
80
- return;
81
- }
82
- if (N(h)) {
83
- const n = h, f = n.width ? j(n.width) ? n.width : `${n.width}px` : `${he}px`;
84
- p.push(`minmax(${f}, 1fr)`);
85
- } else {
86
- const n = h, f = j(n.width) ? n.width : `${n.width}px`;
87
- p.push(f);
88
- }
89
- };
90
- return l.forEach(t), a.forEach(t), i && p.push(`${qe}px`), p.join(" ");
91
- }, Ke = ({
92
- primaryColumns: l,
93
- fixedColumns: a,
94
- pinnedColumnKeys: r
95
- }) => se(() => {
96
- const c = [], i = [];
97
- return l.forEach((s) => {
98
- const _ = { ...s, primary: !0 };
99
- r.includes(s.key) ? c.push(_) : i.push(_);
100
- }), a.forEach((s) => {
101
- r.includes(s.key) ? c.push(s) : i.push(s);
102
- }), {
103
- pinnedColumns: c,
104
- scrollableColumns: i
105
- };
106
- }, [l, a, r]), Fe = () => {
107
- const [l, a] = T(null), [r, c] = T(null), i = w((t) => {
108
- a(t);
109
- }, []), s = w(() => {
110
- a(null);
111
- }, []), _ = w((t) => {
112
- c(t);
113
- }, []), p = w(() => {
114
- c(null);
115
- }, []);
116
- return {
117
- hoveredColumn: l,
118
- hoveredRow: r,
119
- handleColumnMouseEnter: i,
120
- handleColumnMouseLeave: s,
121
- handleRowMouseEnter: _,
122
- handleRowMouseLeave: p
123
- };
124
- }, Re = ({
125
- primaryColumns: l,
126
- fixedColumns: a,
127
- expandedRowIds: r,
128
- onToggleRowExpansion: c
129
- }) => {
130
- const [i, s] = T(/* @__PURE__ */ new Set());
131
- re(() => {
132
- const t = [
133
- ...l.map((n) => n.key),
134
- ...a.map((n) => n.key)
135
- ], h = /* @__PURE__ */ new Set();
136
- r.forEach((n) => {
137
- t.forEach((f) => {
138
- h.add(`${n}-${f}`);
139
- });
140
- }), s((n) => {
141
- if (n.size === h.size) {
142
- let f = !0;
143
- if (n.forEach((b) => {
144
- h.has(b) || (f = !1);
145
- }), f)
146
- return n;
147
- }
148
- return h;
149
- });
150
- }, [r, l, a]);
151
- const _ = w(
152
- (t) => {
153
- const h = new Set(i), n = r.includes(t), f = [
154
- ...l.map((b) => b.key),
155
- ...a.map((b) => b.key)
156
- ];
157
- n ? f.forEach((b) => {
158
- const u = `${t}-${b}`;
159
- h.delete(u);
160
- }) : f.forEach((b) => {
161
- const u = `${t}-${b}`;
162
- h.add(u);
163
- }), s(h), c(t);
164
- },
165
- [i, r, l, a, c]
166
- ), p = w(
167
- (t, h) => {
168
- const n = `${t}-${h}`;
169
- return i.has(n);
170
- },
171
- [i]
172
- );
173
- return {
174
- expandedCells: i,
175
- handleToggleRowExpansion: _,
176
- isCellExpanded: p
177
- };
178
- }, Ie = () => {
179
- const l = oe(/* @__PURE__ */ new Map()), a = w(
180
- (r) => (c) => {
181
- if (!c)
182
- return;
183
- const i = c.getBoundingClientRect().width;
184
- i > 0 && l.current.set(r, i);
185
- },
186
- []
187
- );
188
- return {
189
- columnWidthsRef: l,
190
- setCellRef: a
191
- };
192
- }, el = ({
193
- enabled: l = !1,
194
- minWidth: a = 50,
195
- maxWidth: r = 500,
196
- columnWidthsRef: c,
197
- onColumnResize: i
198
- }) => {
199
- const [s, _] = T({}), p = w(() => {
200
- if (!l || Object.keys(s).length > 0 || !c)
201
- return;
202
- const n = {};
203
- c.current.forEach((f, b) => {
204
- n[b] = f;
205
- }), _(n);
206
- }, [l, s, c]), t = w(
207
- (n) => (f, { size: b }) => {
208
- if (!l)
209
- return;
210
- const u = Math.min(r, Math.max(a, b.width));
211
- _((E) => ({ ...E, [n]: u }));
212
- },
213
- [l, a, r]
214
- ), h = w(
215
- (n) => () => {
216
- !l || !s[n] || i == null || i(n, s[n]);
217
- },
218
- [l, s, i]
219
- );
220
- return {
221
- columnWidths: s,
222
- handleResize: t,
223
- handleResizeStop: h,
224
- handleResizeStart: p
225
- };
226
- }, ll = {
227
- "resize-handle": "_resize-handle_15uk3_1"
228
- }, tl = ce.bind(ll), al = Pe(
229
- (l, a) => /* @__PURE__ */ o("div", { ref: a, className: tl("resize-handle"), ...l, children: /* @__PURE__ */ o(We, {}) })
230
- ), d = ce.bind(Ye), ne = ({ column: l }) => {
231
- const a = oe(null), [r, c] = T(!1);
232
- return re(() => {
233
- if (a.current) {
234
- const i = a.current.offsetWidth, s = a.current.scrollWidth;
235
- c(s > i);
236
- }
237
- }, [l.header]), /* @__PURE__ */ o("span", { ref: a, title: r ? l.header : void 0, children: l.header });
238
- }, dl = ({
239
- data: l,
240
- primaryColumn: a,
241
- fixedColumns: r,
242
- renderRowActions: c,
243
- className: i = "",
244
- rowClassName: s = "",
245
- headerClassName: _ = "",
246
- bodyClassName: p = "",
247
- selectable: t = !1,
248
- selectedRowIds: h = [],
249
- sortingDirection: n = ie,
250
- sortingColumn: f,
251
- sortableColumns: b,
252
- isHeaderFixed: u = !1,
253
- isHorizontallyScrollable: E = !1,
254
- pinnedColumnKeys: de = [],
255
- isRowsExpandable: k = !1,
256
- expandedRowIds: $ = [],
257
- isAllExpandedByDefault: H,
258
- expandAllTooltip: B,
259
- isResizable: v = !1,
260
- minColumnWidth: W = 50,
261
- maxColumnWidth: G = 500,
262
- onChangeSorting: pe = () => {
263
- },
264
- onToggleRowSelection: _e = () => {
265
- },
266
- onToggleAllRowsSelection: ye = () => {
267
- },
268
- onToggleRowExpansion: fe = () => {
269
- },
270
- onToggleAllRowsExpansion: be = () => {
271
- },
272
- onColumnResize: ue = () => {
273
- }
274
- }) => {
275
- const m = se(
276
- () => Array.isArray(a) ? a : [a],
277
- [a]
278
- ), x = f ?? m[0], A = b ?? Qe([...m, ...r]), { pinnedColumns: g, scrollableColumns: L } = Ke({
279
- primaryColumns: m,
280
- fixedColumns: r,
281
- pinnedColumnKeys: de
282
- }), {
283
- hoveredColumn: X,
284
- hoveredRow: ke,
285
- handleColumnMouseEnter: Y,
286
- handleColumnMouseLeave: q,
287
- handleRowMouseEnter: ve,
288
- handleRowMouseLeave: we
289
- } = Fe(), { columnWidthsRef: M, setCellRef: J } = Ie(), { handleToggleRowExpansion: xe, isCellExpanded: Q } = Re({
290
- primaryColumns: m,
291
- fixedColumns: r,
292
- expandedRowIds: $,
293
- onToggleRowExpansion: fe
294
- }), { columnWidths: O, handleResize: Ce, handleResizeStop: ge, handleResizeStart: Ne } = el({
295
- enabled: v,
296
- minWidth: W,
297
- maxWidth: G,
298
- columnWidthsRef: M,
299
- onColumnResize: ue
300
- }), V = (e, C) => /* @__PURE__ */ o(
301
- De,
302
- {
303
- width: O[e.key] ?? (typeof e.width == "number" ? e.width : W),
304
- height: 0,
305
- axis: "x",
306
- handle: /* @__PURE__ */ o(al, {}),
307
- onResizeStart: Ne,
308
- onResize: Ce(e.key),
309
- onResizeStop: ge(e.key),
310
- minConstraints: [W, 0],
311
- maxConstraints: [G, 0],
312
- children: C
313
- },
314
- e.key
315
- ), Z = (e) => {
316
- A.includes(e) && pe({ key: e, direction: n });
317
- }, Se = (e) => {
318
- _e(e);
319
- }, ze = () => {
320
- ye();
321
- }, Ee = () => {
322
- be();
323
- }, K = (e) => A.includes(e) ? (x == null ? void 0 : x.key) === e ? Je(n) ? /* @__PURE__ */ o(le, {}) : /* @__PURE__ */ o(Oe, {}) : /* @__PURE__ */ o(le, {}) : null, $e = l.every((e) => h.includes(e.id)), Me = l.some((e) => h.includes(e.id)), F = (h == null ? void 0 : h.length) > 0, Te = l.every((e) => $.includes(e.id)), me = H !== void 0 ? H : Te, Ae = ae(
324
- g,
325
- L,
326
- k,
327
- t,
328
- !!c,
329
- !1,
330
- v ? O : void 0
331
- ), Le = ae(
332
- g,
333
- L,
334
- k,
335
- t,
336
- !!c,
337
- !0,
338
- v ? O : void 0
339
- ), R = /* @__PURE__ */ o("button", { onClick: Ee, "aria-label": "Toggle all rows expansion", children: /* @__PURE__ */ o("span", { className: d("expand-icon", { expanded: me }), children: /* @__PURE__ */ o(ee, {}) }) });
340
- return /* @__PURE__ */ S(
341
- "div",
342
- {
343
- className: d(
344
- "table",
345
- {
346
- "fixed-header": u,
347
- "horizontally-scrollable-container": u && (E || v)
348
- },
349
- i
350
- ),
351
- children: [
352
- /* @__PURE__ */ S(
353
- "div",
354
- {
355
- className: d(
356
- "table-header",
357
- {
358
- "sticky-header": u,
359
- "horizontally-scrollable": E,
360
- resizable: v
361
- },
362
- _
363
- ),
364
- style: { gridTemplateColumns: Le },
365
- children: [
366
- t && /* @__PURE__ */ o(
367
- "div",
368
- {
369
- className: d("table-header-cell", "checkbox-cell"),
370
- style: { left: k ? `${z}px` : "0" },
371
- children: F && /* @__PURE__ */ o(
372
- te,
373
- {
374
- value: $e,
375
- partiallyChecked: Me,
376
- onChange: ze,
377
- className: d("checkbox-cell")
378
- }
379
- )
380
- }
381
- ),
382
- k && /* @__PURE__ */ o("div", { className: d("table-header-cell", "expand-cell"), style: { left: "0" }, children: B ? /* @__PURE__ */ o(
383
- Ue,
384
- {
385
- content: B,
386
- placement: "top",
387
- wrapperClassName: d("expand-all-tooltip-wrapper"),
388
- contentClassName: d("expand-all-tooltip-content"),
389
- children: R
390
- }
391
- ) : R }),
392
- g.map((e, C) => {
393
- const y = /* @__PURE__ */ o(
394
- "button",
395
- {
396
- className: d("table-header-cell", "pinned-column", {
397
- [`align-${e.align}`]: "align" in e,
398
- "primary-cell": N(e),
399
- "sortable-cell": A.includes(e.key),
400
- resizable: v
401
- }),
402
- style: D(
403
- e,
404
- !0,
405
- C,
406
- g,
407
- M,
408
- k,
409
- t
410
- ),
411
- children: /* @__PURE__ */ S(
412
- "div",
413
- {
414
- className: d("label"),
415
- onClick: () => Z(e.key),
416
- onMouseEnter: () => Y(e.key),
417
- onMouseLeave: q,
418
- children: [
419
- /* @__PURE__ */ o(ne, { column: e }),
420
- (X === e.key || (x == null ? void 0 : x.key) === e.key) && K(e.key)
421
- ]
422
- }
423
- )
424
- },
425
- e.key
426
- );
427
- return v ? V(e, y) : y;
428
- }),
429
- L.map((e) => {
430
- const C = /* @__PURE__ */ o(
431
- "button",
432
- {
433
- className: d("table-header-cell", {
434
- [`align-${e.align}`]: "align" in e,
435
- "primary-cell": N(e),
436
- "sortable-cell": A.includes(e.key),
437
- resizable: v
438
- }),
439
- style: D(
440
- e,
441
- !1,
442
- void 0,
443
- g,
444
- M,
445
- k,
446
- t
447
- ),
448
- children: /* @__PURE__ */ S(
449
- "div",
450
- {
451
- className: d("label"),
452
- onClick: () => Z(e.key),
453
- onMouseEnter: () => Y(e.key),
454
- onMouseLeave: q,
455
- children: [
456
- /* @__PURE__ */ o(ne, { column: e }),
457
- (X === e.key || (x == null ? void 0 : x.key) === e.key) && K(e.key)
458
- ]
459
- }
460
- )
461
- },
462
- e.key
463
- );
464
- return v ? V(e, C) : C;
465
- }),
466
- c && /* @__PURE__ */ o("div", { className: d("table-header-cell", "action-menu-cell") })
467
- ]
468
- }
469
- ),
470
- /* @__PURE__ */ o(
471
- "div",
472
- {
473
- className: d(
474
- "table-body",
475
- {
476
- "scrollable-body": u,
477
- "horizontally-scrollable": E,
478
- resizable: v
479
- },
480
- p
481
- ),
482
- children: l.map((e, C) => /* @__PURE__ */ S(
483
- "div",
484
- {
485
- className: d("table-row", Ve(e), s, {
486
- selectable: t
487
- }),
488
- onMouseEnter: () => ve(C),
489
- onMouseLeave: we,
490
- children: [
491
- t && /* @__PURE__ */ o(
492
- "div",
493
- {
494
- className: d("table-cell", "checkbox-cell"),
495
- style: { left: k ? `${z}px` : "0" },
496
- children: (F || ke === C) && /* @__PURE__ */ o(
497
- te,
498
- {
499
- value: h.includes(e.id),
500
- onChange: () => Se(e.id),
501
- className: d("checkbox-cell")
502
- }
503
- )
504
- }
505
- ),
506
- /* @__PURE__ */ o("div", { className: d("row-content-wrapper"), children: /* @__PURE__ */ S("div", { className: d("table-row-content"), style: { gridTemplateColumns: Ae }, children: [
507
- k && /* @__PURE__ */ o("div", { className: d("table-cell", "expand-cell"), style: { left: "0" }, children: /* @__PURE__ */ o(
508
- "button",
509
- {
510
- onClick: () => xe(e.id),
511
- "aria-label": $.includes(e.id) ? "Collapse row" : "Expand row",
512
- "aria-expanded": $.includes(e.id),
513
- children: /* @__PURE__ */ o(
514
- "span",
515
- {
516
- className: d("expand-icon", {
517
- expanded: $.includes(e.id)
518
- }),
519
- children: /* @__PURE__ */ o(ee, {})
520
- }
521
- )
522
- }
523
- ) }),
524
- g.map((y, U) => {
525
- const P = Q(e.id, y.key), I = N(y);
526
- return /* @__PURE__ */ o(
527
- "div",
528
- {
529
- ref: I ? J(y.key) : void 0,
530
- className: d("table-cell", "pinned-column", {
531
- "primary-cell": I,
532
- "expanded-cell": P
533
- }),
534
- style: D(
535
- y,
536
- !0,
537
- U,
538
- g,
539
- M,
540
- k,
541
- t
542
- ),
543
- children: e[y.key].component || e[y.key].content || e[y.key]
544
- },
545
- y.key
546
- );
547
- }),
548
- L.map((y) => {
549
- const U = Q(e.id, y.key), P = N(y);
550
- return /* @__PURE__ */ o(
551
- "div",
552
- {
553
- ref: P ? J(y.key) : void 0,
554
- className: d("table-cell", {
555
- "primary-cell": P,
556
- "expanded-cell": U
557
- }),
558
- style: D(
559
- y,
560
- !1,
561
- void 0,
562
- g,
563
- M,
564
- k,
565
- t
566
- ),
567
- children: e[y.key].component || e[y.key].content || e[y.key]
568
- },
569
- y.key
570
- );
571
- }),
572
- c && /* @__PURE__ */ o("div", { className: d("table-cell", "action-menu-cell"), children: c(e.metaData) })
573
- ] }) })
574
- ]
575
- },
576
- e.id
577
- ))
578
- }
579
- )
580
- ]
581
- }
582
- );
583
- };
584
- export {
585
- dl as T
586
- };