@trackunit/react-table 0.0.73 → 0.0.74
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/index.cjs.js +727 -481
- package/index.esm.js +730 -481
- package/package.json +10 -10
- package/src/Table.d.ts +2 -1
- package/src/useInfiniteScroll.d.ts +3 -4
package/index.cjs.js
CHANGED
|
@@ -9,11 +9,10 @@ var React = require('react');
|
|
|
9
9
|
var reactRouterDom = require('react-router-dom');
|
|
10
10
|
var cssClassVarianceUtilities = require('@trackunit/css-class-variance-utilities');
|
|
11
11
|
var reactTableBaseComponents = require('@trackunit/react-table-base-components');
|
|
12
|
+
var reactDom = require('react-dom');
|
|
12
13
|
var reactFormComponents = require('@trackunit/react-form-components');
|
|
13
14
|
var reactCoreContextsApi = require('@trackunit/react-core-contexts-api');
|
|
14
15
|
|
|
15
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
|
-
|
|
17
16
|
function _interopNamespace(e) {
|
|
18
17
|
if (e && e.__esModule) return e;
|
|
19
18
|
var n = Object.create(null);
|
|
@@ -33,7 +32,6 @@ function _interopNamespace(e) {
|
|
|
33
32
|
}
|
|
34
33
|
|
|
35
34
|
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
36
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
37
35
|
|
|
38
36
|
var defaultTranslations = {
|
|
39
37
|
"table.actionsheet.selected": "selected",
|
|
@@ -230,7 +228,7 @@ function flattenBy(arr, getChildren) {
|
|
|
230
228
|
recurse(arr);
|
|
231
229
|
return flat;
|
|
232
230
|
}
|
|
233
|
-
function memo(getDeps, fn, opts) {
|
|
231
|
+
function memo$1(getDeps, fn, opts) {
|
|
234
232
|
let deps = [];
|
|
235
233
|
let result;
|
|
236
234
|
return () => {
|
|
@@ -311,7 +309,7 @@ function createColumn(table, columnDef, depth, parent) {
|
|
|
311
309
|
depth,
|
|
312
310
|
columnDef: resolvedColumnDef,
|
|
313
311
|
columns: [],
|
|
314
|
-
getFlatColumns: memo(() => [true], () => {
|
|
312
|
+
getFlatColumns: memo$1(() => [true], () => {
|
|
315
313
|
var _column$columns;
|
|
316
314
|
return [column, ...((_column$columns = column.columns) == null ? void 0 : _column$columns.flatMap(d => d.getFlatColumns()))];
|
|
317
315
|
}, {
|
|
@@ -321,7 +319,7 @@ function createColumn(table, columnDef, depth, parent) {
|
|
|
321
319
|
return (_table$options$debugA = table.options.debugAll) != null ? _table$options$debugA : table.options.debugColumns;
|
|
322
320
|
}
|
|
323
321
|
}),
|
|
324
|
-
getLeafColumns: memo(() => [table._getOrderColumnsFn()], orderColumns => {
|
|
322
|
+
getLeafColumns: memo$1(() => [table._getOrderColumnsFn()], orderColumns => {
|
|
325
323
|
var _column$columns2;
|
|
326
324
|
if ((_column$columns2 = column.columns) != null && _column$columns2.length) {
|
|
327
325
|
let leafColumns = column.columns.flatMap(column => column.getLeafColumns());
|
|
@@ -387,7 +385,7 @@ const Headers = {
|
|
|
387
385
|
return {
|
|
388
386
|
// Header Groups
|
|
389
387
|
|
|
390
|
-
getHeaderGroups: memo(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allColumns, leafColumns, left, right) => {
|
|
388
|
+
getHeaderGroups: memo$1(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allColumns, leafColumns, left, right) => {
|
|
391
389
|
var _left$map$filter, _right$map$filter;
|
|
392
390
|
const leftColumns = (_left$map$filter = left == null ? void 0 : left.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _left$map$filter : [];
|
|
393
391
|
const rightColumns = (_right$map$filter = right == null ? void 0 : right.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _right$map$filter : [];
|
|
@@ -401,7 +399,7 @@ const Headers = {
|
|
|
401
399
|
return (_table$options$debugA = table.options.debugAll) != null ? _table$options$debugA : table.options.debugHeaders;
|
|
402
400
|
}
|
|
403
401
|
}),
|
|
404
|
-
getCenterHeaderGroups: memo(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allColumns, leafColumns, left, right) => {
|
|
402
|
+
getCenterHeaderGroups: memo$1(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allColumns, leafColumns, left, right) => {
|
|
405
403
|
leafColumns = leafColumns.filter(column => !(left != null && left.includes(column.id)) && !(right != null && right.includes(column.id)));
|
|
406
404
|
return buildHeaderGroups(allColumns, leafColumns, table, 'center');
|
|
407
405
|
}, {
|
|
@@ -411,7 +409,7 @@ const Headers = {
|
|
|
411
409
|
return (_table$options$debugA2 = table.options.debugAll) != null ? _table$options$debugA2 : table.options.debugHeaders;
|
|
412
410
|
}
|
|
413
411
|
}),
|
|
414
|
-
getLeftHeaderGroups: memo(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.left], (allColumns, leafColumns, left) => {
|
|
412
|
+
getLeftHeaderGroups: memo$1(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.left], (allColumns, leafColumns, left) => {
|
|
415
413
|
var _left$map$filter2;
|
|
416
414
|
const orderedLeafColumns = (_left$map$filter2 = left == null ? void 0 : left.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _left$map$filter2 : [];
|
|
417
415
|
return buildHeaderGroups(allColumns, orderedLeafColumns, table, 'left');
|
|
@@ -422,7 +420,7 @@ const Headers = {
|
|
|
422
420
|
return (_table$options$debugA3 = table.options.debugAll) != null ? _table$options$debugA3 : table.options.debugHeaders;
|
|
423
421
|
}
|
|
424
422
|
}),
|
|
425
|
-
getRightHeaderGroups: memo(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.right], (allColumns, leafColumns, right) => {
|
|
423
|
+
getRightHeaderGroups: memo$1(() => [table.getAllColumns(), table.getVisibleLeafColumns(), table.getState().columnPinning.right], (allColumns, leafColumns, right) => {
|
|
426
424
|
var _right$map$filter2;
|
|
427
425
|
const orderedLeafColumns = (_right$map$filter2 = right == null ? void 0 : right.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _right$map$filter2 : [];
|
|
428
426
|
return buildHeaderGroups(allColumns, orderedLeafColumns, table, 'right');
|
|
@@ -435,7 +433,7 @@ const Headers = {
|
|
|
435
433
|
}),
|
|
436
434
|
// Footer Groups
|
|
437
435
|
|
|
438
|
-
getFooterGroups: memo(() => [table.getHeaderGroups()], headerGroups => {
|
|
436
|
+
getFooterGroups: memo$1(() => [table.getHeaderGroups()], headerGroups => {
|
|
439
437
|
return [...headerGroups].reverse();
|
|
440
438
|
}, {
|
|
441
439
|
key: process.env.NODE_ENV === 'development' && 'getFooterGroups',
|
|
@@ -444,7 +442,7 @@ const Headers = {
|
|
|
444
442
|
return (_table$options$debugA5 = table.options.debugAll) != null ? _table$options$debugA5 : table.options.debugHeaders;
|
|
445
443
|
}
|
|
446
444
|
}),
|
|
447
|
-
getLeftFooterGroups: memo(() => [table.getLeftHeaderGroups()], headerGroups => {
|
|
445
|
+
getLeftFooterGroups: memo$1(() => [table.getLeftHeaderGroups()], headerGroups => {
|
|
448
446
|
return [...headerGroups].reverse();
|
|
449
447
|
}, {
|
|
450
448
|
key: process.env.NODE_ENV === 'development' && 'getLeftFooterGroups',
|
|
@@ -453,7 +451,7 @@ const Headers = {
|
|
|
453
451
|
return (_table$options$debugA6 = table.options.debugAll) != null ? _table$options$debugA6 : table.options.debugHeaders;
|
|
454
452
|
}
|
|
455
453
|
}),
|
|
456
|
-
getCenterFooterGroups: memo(() => [table.getCenterHeaderGroups()], headerGroups => {
|
|
454
|
+
getCenterFooterGroups: memo$1(() => [table.getCenterHeaderGroups()], headerGroups => {
|
|
457
455
|
return [...headerGroups].reverse();
|
|
458
456
|
}, {
|
|
459
457
|
key: process.env.NODE_ENV === 'development' && 'getCenterFooterGroups',
|
|
@@ -462,7 +460,7 @@ const Headers = {
|
|
|
462
460
|
return (_table$options$debugA7 = table.options.debugAll) != null ? _table$options$debugA7 : table.options.debugHeaders;
|
|
463
461
|
}
|
|
464
462
|
}),
|
|
465
|
-
getRightFooterGroups: memo(() => [table.getRightHeaderGroups()], headerGroups => {
|
|
463
|
+
getRightFooterGroups: memo$1(() => [table.getRightHeaderGroups()], headerGroups => {
|
|
466
464
|
return [...headerGroups].reverse();
|
|
467
465
|
}, {
|
|
468
466
|
key: process.env.NODE_ENV === 'development' && 'getRightFooterGroups',
|
|
@@ -473,7 +471,7 @@ const Headers = {
|
|
|
473
471
|
}),
|
|
474
472
|
// Flat Headers
|
|
475
473
|
|
|
476
|
-
getFlatHeaders: memo(() => [table.getHeaderGroups()], headerGroups => {
|
|
474
|
+
getFlatHeaders: memo$1(() => [table.getHeaderGroups()], headerGroups => {
|
|
477
475
|
return headerGroups.map(headerGroup => {
|
|
478
476
|
return headerGroup.headers;
|
|
479
477
|
}).flat();
|
|
@@ -484,7 +482,7 @@ const Headers = {
|
|
|
484
482
|
return (_table$options$debugA9 = table.options.debugAll) != null ? _table$options$debugA9 : table.options.debugHeaders;
|
|
485
483
|
}
|
|
486
484
|
}),
|
|
487
|
-
getLeftFlatHeaders: memo(() => [table.getLeftHeaderGroups()], left => {
|
|
485
|
+
getLeftFlatHeaders: memo$1(() => [table.getLeftHeaderGroups()], left => {
|
|
488
486
|
return left.map(headerGroup => {
|
|
489
487
|
return headerGroup.headers;
|
|
490
488
|
}).flat();
|
|
@@ -495,7 +493,7 @@ const Headers = {
|
|
|
495
493
|
return (_table$options$debugA10 = table.options.debugAll) != null ? _table$options$debugA10 : table.options.debugHeaders;
|
|
496
494
|
}
|
|
497
495
|
}),
|
|
498
|
-
getCenterFlatHeaders: memo(() => [table.getCenterHeaderGroups()], left => {
|
|
496
|
+
getCenterFlatHeaders: memo$1(() => [table.getCenterHeaderGroups()], left => {
|
|
499
497
|
return left.map(headerGroup => {
|
|
500
498
|
return headerGroup.headers;
|
|
501
499
|
}).flat();
|
|
@@ -506,7 +504,7 @@ const Headers = {
|
|
|
506
504
|
return (_table$options$debugA11 = table.options.debugAll) != null ? _table$options$debugA11 : table.options.debugHeaders;
|
|
507
505
|
}
|
|
508
506
|
}),
|
|
509
|
-
getRightFlatHeaders: memo(() => [table.getRightHeaderGroups()], left => {
|
|
507
|
+
getRightFlatHeaders: memo$1(() => [table.getRightHeaderGroups()], left => {
|
|
510
508
|
return left.map(headerGroup => {
|
|
511
509
|
return headerGroup.headers;
|
|
512
510
|
}).flat();
|
|
@@ -519,7 +517,7 @@ const Headers = {
|
|
|
519
517
|
}),
|
|
520
518
|
// Leaf Headers
|
|
521
519
|
|
|
522
|
-
getCenterLeafHeaders: memo(() => [table.getCenterFlatHeaders()], flatHeaders => {
|
|
520
|
+
getCenterLeafHeaders: memo$1(() => [table.getCenterFlatHeaders()], flatHeaders => {
|
|
523
521
|
return flatHeaders.filter(header => {
|
|
524
522
|
var _header$subHeaders;
|
|
525
523
|
return !((_header$subHeaders = header.subHeaders) != null && _header$subHeaders.length);
|
|
@@ -531,7 +529,7 @@ const Headers = {
|
|
|
531
529
|
return (_table$options$debugA13 = table.options.debugAll) != null ? _table$options$debugA13 : table.options.debugHeaders;
|
|
532
530
|
}
|
|
533
531
|
}),
|
|
534
|
-
getLeftLeafHeaders: memo(() => [table.getLeftFlatHeaders()], flatHeaders => {
|
|
532
|
+
getLeftLeafHeaders: memo$1(() => [table.getLeftFlatHeaders()], flatHeaders => {
|
|
535
533
|
return flatHeaders.filter(header => {
|
|
536
534
|
var _header$subHeaders2;
|
|
537
535
|
return !((_header$subHeaders2 = header.subHeaders) != null && _header$subHeaders2.length);
|
|
@@ -543,7 +541,7 @@ const Headers = {
|
|
|
543
541
|
return (_table$options$debugA14 = table.options.debugAll) != null ? _table$options$debugA14 : table.options.debugHeaders;
|
|
544
542
|
}
|
|
545
543
|
}),
|
|
546
|
-
getRightLeafHeaders: memo(() => [table.getRightFlatHeaders()], flatHeaders => {
|
|
544
|
+
getRightLeafHeaders: memo$1(() => [table.getRightFlatHeaders()], flatHeaders => {
|
|
547
545
|
return flatHeaders.filter(header => {
|
|
548
546
|
var _header$subHeaders3;
|
|
549
547
|
return !((_header$subHeaders3 = header.subHeaders) != null && _header$subHeaders3.length);
|
|
@@ -555,7 +553,7 @@ const Headers = {
|
|
|
555
553
|
return (_table$options$debugA15 = table.options.debugAll) != null ? _table$options$debugA15 : table.options.debugHeaders;
|
|
556
554
|
}
|
|
557
555
|
}),
|
|
558
|
-
getLeafHeaders: memo(() => [table.getLeftHeaderGroups(), table.getCenterHeaderGroups(), table.getRightHeaderGroups()], (left, center, right) => {
|
|
556
|
+
getLeafHeaders: memo$1(() => [table.getLeftHeaderGroups(), table.getCenterHeaderGroups(), table.getRightHeaderGroups()], (left, center, right) => {
|
|
559
557
|
var _left$0$headers, _left$, _center$0$headers, _center$, _right$0$headers, _right$;
|
|
560
558
|
return [...((_left$0$headers = (_left$ = left[0]) == null ? void 0 : _left$.headers) != null ? _left$0$headers : []), ...((_center$0$headers = (_center$ = center[0]) == null ? void 0 : _center$.headers) != null ? _center$0$headers : []), ...((_right$0$headers = (_right$ = right[0]) == null ? void 0 : _right$.headers) != null ? _right$0$headers : [])].map(header => {
|
|
561
559
|
return header.getLeafHeaders();
|
|
@@ -1648,7 +1646,7 @@ const Ordering = {
|
|
|
1648
1646
|
var _table$initialState$c;
|
|
1649
1647
|
table.setColumnOrder(defaultState ? [] : (_table$initialState$c = table.initialState.columnOrder) != null ? _table$initialState$c : []);
|
|
1650
1648
|
},
|
|
1651
|
-
_getOrderColumnsFn: memo(() => [table.getState().columnOrder, table.getState().grouping, table.options.groupedColumnMode], (columnOrder, grouping, groupedColumnMode) => columns => {
|
|
1649
|
+
_getOrderColumnsFn: memo$1(() => [table.getState().columnOrder, table.getState().grouping, table.options.groupedColumnMode], (columnOrder, grouping, groupedColumnMode) => columns => {
|
|
1652
1650
|
// Sort grouped columns to the start of the column list
|
|
1653
1651
|
// before the headers are built
|
|
1654
1652
|
let orderedColumns = [];
|
|
@@ -1782,7 +1780,7 @@ const Pagination = {
|
|
|
1782
1780
|
pageCount: newPageCount
|
|
1783
1781
|
};
|
|
1784
1782
|
}),
|
|
1785
|
-
getPageOptions: memo(() => [table.getPageCount()], pageCount => {
|
|
1783
|
+
getPageOptions: memo$1(() => [table.getPageCount()], pageCount => {
|
|
1786
1784
|
let pageOptions = [];
|
|
1787
1785
|
if (pageCount && pageCount > 0) {
|
|
1788
1786
|
pageOptions = [...new Array(pageCount)].fill(null).map((_, i) => i);
|
|
@@ -1905,7 +1903,7 @@ const Pinning = {
|
|
|
1905
1903
|
},
|
|
1906
1904
|
createRow: (row, table) => {
|
|
1907
1905
|
return {
|
|
1908
|
-
getCenterVisibleCells: memo(() => [row._getAllVisibleCells(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allCells, left, right) => {
|
|
1906
|
+
getCenterVisibleCells: memo$1(() => [row._getAllVisibleCells(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allCells, left, right) => {
|
|
1909
1907
|
const leftAndRight = [...(left != null ? left : []), ...(right != null ? right : [])];
|
|
1910
1908
|
return allCells.filter(d => !leftAndRight.includes(d.column.id));
|
|
1911
1909
|
}, {
|
|
@@ -1915,7 +1913,7 @@ const Pinning = {
|
|
|
1915
1913
|
return (_table$options$debugA = table.options.debugAll) != null ? _table$options$debugA : table.options.debugRows;
|
|
1916
1914
|
}
|
|
1917
1915
|
}),
|
|
1918
|
-
getLeftVisibleCells: memo(() => [row._getAllVisibleCells(), table.getState().columnPinning.left,,], (allCells, left) => {
|
|
1916
|
+
getLeftVisibleCells: memo$1(() => [row._getAllVisibleCells(), table.getState().columnPinning.left,,], (allCells, left) => {
|
|
1919
1917
|
const cells = (left != null ? left : []).map(columnId => allCells.find(cell => cell.column.id === columnId)).filter(Boolean).map(d => ({
|
|
1920
1918
|
...d,
|
|
1921
1919
|
position: 'left'
|
|
@@ -1928,7 +1926,7 @@ const Pinning = {
|
|
|
1928
1926
|
return (_table$options$debugA2 = table.options.debugAll) != null ? _table$options$debugA2 : table.options.debugRows;
|
|
1929
1927
|
}
|
|
1930
1928
|
}),
|
|
1931
|
-
getRightVisibleCells: memo(() => [row._getAllVisibleCells(), table.getState().columnPinning.right], (allCells, right) => {
|
|
1929
|
+
getRightVisibleCells: memo$1(() => [row._getAllVisibleCells(), table.getState().columnPinning.right], (allCells, right) => {
|
|
1932
1930
|
const cells = (right != null ? right : []).map(columnId => allCells.find(cell => cell.column.id === columnId)).filter(Boolean).map(d => ({
|
|
1933
1931
|
...d,
|
|
1934
1932
|
position: 'right'
|
|
@@ -1959,7 +1957,7 @@ const Pinning = {
|
|
|
1959
1957
|
}
|
|
1960
1958
|
return Boolean((_pinningState$positio = pinningState[position]) == null ? void 0 : _pinningState$positio.length);
|
|
1961
1959
|
},
|
|
1962
|
-
getLeftLeafColumns: memo(() => [table.getAllLeafColumns(), table.getState().columnPinning.left], (allColumns, left) => {
|
|
1960
|
+
getLeftLeafColumns: memo$1(() => [table.getAllLeafColumns(), table.getState().columnPinning.left], (allColumns, left) => {
|
|
1963
1961
|
return (left != null ? left : []).map(columnId => allColumns.find(column => column.id === columnId)).filter(Boolean);
|
|
1964
1962
|
}, {
|
|
1965
1963
|
key: process.env.NODE_ENV === 'development' && 'getLeftLeafColumns',
|
|
@@ -1968,7 +1966,7 @@ const Pinning = {
|
|
|
1968
1966
|
return (_table$options$debugA4 = table.options.debugAll) != null ? _table$options$debugA4 : table.options.debugColumns;
|
|
1969
1967
|
}
|
|
1970
1968
|
}),
|
|
1971
|
-
getRightLeafColumns: memo(() => [table.getAllLeafColumns(), table.getState().columnPinning.right], (allColumns, right) => {
|
|
1969
|
+
getRightLeafColumns: memo$1(() => [table.getAllLeafColumns(), table.getState().columnPinning.right], (allColumns, right) => {
|
|
1972
1970
|
return (right != null ? right : []).map(columnId => allColumns.find(column => column.id === columnId)).filter(Boolean);
|
|
1973
1971
|
}, {
|
|
1974
1972
|
key: process.env.NODE_ENV === 'development' && 'getRightLeafColumns',
|
|
@@ -1977,7 +1975,7 @@ const Pinning = {
|
|
|
1977
1975
|
return (_table$options$debugA5 = table.options.debugAll) != null ? _table$options$debugA5 : table.options.debugColumns;
|
|
1978
1976
|
}
|
|
1979
1977
|
}),
|
|
1980
|
-
getCenterLeafColumns: memo(() => [table.getAllLeafColumns(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allColumns, left, right) => {
|
|
1978
|
+
getCenterLeafColumns: memo$1(() => [table.getAllLeafColumns(), table.getState().columnPinning.left, table.getState().columnPinning.right], (allColumns, left, right) => {
|
|
1981
1979
|
const leftAndRight = [...(left != null ? left : []), ...(right != null ? right : [])];
|
|
1982
1980
|
return allColumns.filter(d => !leftAndRight.includes(d.id));
|
|
1983
1981
|
}, {
|
|
@@ -2113,7 +2111,7 @@ const RowSelection = {
|
|
|
2113
2111
|
// table.setRowSelection(selectedRowIds)
|
|
2114
2112
|
// },
|
|
2115
2113
|
getPreSelectedRowModel: () => table.getCoreRowModel(),
|
|
2116
|
-
getSelectedRowModel: memo(() => [table.getState().rowSelection, table.getCoreRowModel()], (rowSelection, rowModel) => {
|
|
2114
|
+
getSelectedRowModel: memo$1(() => [table.getState().rowSelection, table.getCoreRowModel()], (rowSelection, rowModel) => {
|
|
2117
2115
|
if (!Object.keys(rowSelection).length) {
|
|
2118
2116
|
return {
|
|
2119
2117
|
rows: [],
|
|
@@ -2129,7 +2127,7 @@ const RowSelection = {
|
|
|
2129
2127
|
return (_table$options$debugA = table.options.debugAll) != null ? _table$options$debugA : table.options.debugTable;
|
|
2130
2128
|
}
|
|
2131
2129
|
}),
|
|
2132
|
-
getFilteredSelectedRowModel: memo(() => [table.getState().rowSelection, table.getFilteredRowModel()], (rowSelection, rowModel) => {
|
|
2130
|
+
getFilteredSelectedRowModel: memo$1(() => [table.getState().rowSelection, table.getFilteredRowModel()], (rowSelection, rowModel) => {
|
|
2133
2131
|
if (!Object.keys(rowSelection).length) {
|
|
2134
2132
|
return {
|
|
2135
2133
|
rows: [],
|
|
@@ -2145,7 +2143,7 @@ const RowSelection = {
|
|
|
2145
2143
|
return (_table$options$debugA2 = table.options.debugAll) != null ? _table$options$debugA2 : table.options.debugTable;
|
|
2146
2144
|
}
|
|
2147
2145
|
}),
|
|
2148
|
-
getGroupedSelectedRowModel: memo(() => [table.getState().rowSelection, table.getSortedRowModel()], (rowSelection, rowModel) => {
|
|
2146
|
+
getGroupedSelectedRowModel: memo$1(() => [table.getState().rowSelection, table.getSortedRowModel()], (rowSelection, rowModel) => {
|
|
2149
2147
|
if (!Object.keys(rowSelection).length) {
|
|
2150
2148
|
return {
|
|
2151
2149
|
rows: [],
|
|
@@ -2728,7 +2726,7 @@ const Visibility = {
|
|
|
2728
2726
|
},
|
|
2729
2727
|
createRow: (row, table) => {
|
|
2730
2728
|
return {
|
|
2731
|
-
_getAllVisibleCells: memo(() => [row.getAllCells(), table.getState().columnVisibility], cells => {
|
|
2729
|
+
_getAllVisibleCells: memo$1(() => [row.getAllCells(), table.getState().columnVisibility], cells => {
|
|
2732
2730
|
return cells.filter(cell => cell.column.getIsVisible());
|
|
2733
2731
|
}, {
|
|
2734
2732
|
key: process.env.NODE_ENV === 'production' && 'row._getAllVisibleCells',
|
|
@@ -2737,7 +2735,7 @@ const Visibility = {
|
|
|
2737
2735
|
return (_table$options$debugA = table.options.debugAll) != null ? _table$options$debugA : table.options.debugRows;
|
|
2738
2736
|
}
|
|
2739
2737
|
}),
|
|
2740
|
-
getVisibleCells: memo(() => [row.getLeftVisibleCells(), row.getCenterVisibleCells(), row.getRightVisibleCells()], (left, center, right) => [...left, ...center, ...right], {
|
|
2738
|
+
getVisibleCells: memo$1(() => [row.getLeftVisibleCells(), row.getCenterVisibleCells(), row.getRightVisibleCells()], (left, center, right) => [...left, ...center, ...right], {
|
|
2741
2739
|
key: process.env.NODE_ENV === 'development' && 'row.getVisibleCells',
|
|
2742
2740
|
debug: () => {
|
|
2743
2741
|
var _table$options$debugA2;
|
|
@@ -2748,7 +2746,7 @@ const Visibility = {
|
|
|
2748
2746
|
},
|
|
2749
2747
|
createTable: table => {
|
|
2750
2748
|
const makeVisibleColumnsMethod = (key, getColumns) => {
|
|
2751
|
-
return memo(() => [getColumns(), getColumns().filter(d => d.getIsVisible()).map(d => d.id).join('_')], columns => {
|
|
2749
|
+
return memo$1(() => [getColumns(), getColumns().filter(d => d.getIsVisible()).map(d => d.id).join('_')], columns => {
|
|
2752
2750
|
return columns.filter(d => d.getIsVisible == null ? void 0 : d.getIsVisible());
|
|
2753
2751
|
}, {
|
|
2754
2752
|
key,
|
|
@@ -2887,7 +2885,7 @@ function createTable(options) {
|
|
|
2887
2885
|
}
|
|
2888
2886
|
return row;
|
|
2889
2887
|
},
|
|
2890
|
-
_getDefaultColumnDef: memo(() => [table.options.defaultColumn], defaultColumn => {
|
|
2888
|
+
_getDefaultColumnDef: memo$1(() => [table.options.defaultColumn], defaultColumn => {
|
|
2891
2889
|
var _defaultColumn;
|
|
2892
2890
|
defaultColumn = (_defaultColumn = defaultColumn) != null ? _defaultColumn : {};
|
|
2893
2891
|
return {
|
|
@@ -2919,7 +2917,7 @@ function createTable(options) {
|
|
|
2919
2917
|
key: process.env.NODE_ENV === 'development' && 'getDefaultColumnDef'
|
|
2920
2918
|
}),
|
|
2921
2919
|
_getColumnDefs: () => table.options.columns,
|
|
2922
|
-
getAllColumns: memo(() => [table._getColumnDefs()], columnDefs => {
|
|
2920
|
+
getAllColumns: memo$1(() => [table._getColumnDefs()], columnDefs => {
|
|
2923
2921
|
const recurseColumns = function (columnDefs, parent, depth) {
|
|
2924
2922
|
if (depth === void 0) {
|
|
2925
2923
|
depth = 0;
|
|
@@ -2939,7 +2937,7 @@ function createTable(options) {
|
|
|
2939
2937
|
return (_table$options$debugA2 = table.options.debugAll) != null ? _table$options$debugA2 : table.options.debugColumns;
|
|
2940
2938
|
}
|
|
2941
2939
|
}),
|
|
2942
|
-
getAllFlatColumns: memo(() => [table.getAllColumns()], allColumns => {
|
|
2940
|
+
getAllFlatColumns: memo$1(() => [table.getAllColumns()], allColumns => {
|
|
2943
2941
|
return allColumns.flatMap(column => {
|
|
2944
2942
|
return column.getFlatColumns();
|
|
2945
2943
|
});
|
|
@@ -2950,7 +2948,7 @@ function createTable(options) {
|
|
|
2950
2948
|
return (_table$options$debugA3 = table.options.debugAll) != null ? _table$options$debugA3 : table.options.debugColumns;
|
|
2951
2949
|
}
|
|
2952
2950
|
}),
|
|
2953
|
-
_getAllFlatColumnsById: memo(() => [table.getAllFlatColumns()], flatColumns => {
|
|
2951
|
+
_getAllFlatColumnsById: memo$1(() => [table.getAllFlatColumns()], flatColumns => {
|
|
2954
2952
|
return flatColumns.reduce((acc, column) => {
|
|
2955
2953
|
acc[column.id] = column;
|
|
2956
2954
|
return acc;
|
|
@@ -2962,7 +2960,7 @@ function createTable(options) {
|
|
|
2962
2960
|
return (_table$options$debugA4 = table.options.debugAll) != null ? _table$options$debugA4 : table.options.debugColumns;
|
|
2963
2961
|
}
|
|
2964
2962
|
}),
|
|
2965
|
-
getAllLeafColumns: memo(() => [table.getAllColumns(), table._getOrderColumnsFn()], (allColumns, orderColumns) => {
|
|
2963
|
+
getAllLeafColumns: memo$1(() => [table.getAllColumns(), table._getOrderColumnsFn()], (allColumns, orderColumns) => {
|
|
2966
2964
|
let leafColumns = allColumns.flatMap(column => column.getLeafColumns());
|
|
2967
2965
|
return orderColumns(leafColumns);
|
|
2968
2966
|
}, {
|
|
@@ -2998,7 +2996,7 @@ function createCell(table, row, column, columnId) {
|
|
|
2998
2996
|
column,
|
|
2999
2997
|
getValue: () => row.getValue(columnId),
|
|
3000
2998
|
renderValue: getRenderValue,
|
|
3001
|
-
getContext: memo(() => [table, column, row, cell], (table, column, row, cell) => ({
|
|
2999
|
+
getContext: memo$1(() => [table, column, row, cell], (table, column, row, cell) => ({
|
|
3002
3000
|
table,
|
|
3003
3001
|
column,
|
|
3004
3002
|
row,
|
|
@@ -3069,7 +3067,7 @@ const createRow = (table, id, original, rowIndex, depth, subRows, parentId) => {
|
|
|
3069
3067
|
}
|
|
3070
3068
|
return parentRows.reverse();
|
|
3071
3069
|
},
|
|
3072
|
-
getAllCells: memo(() => [table.getAllLeafColumns()], leafColumns => {
|
|
3070
|
+
getAllCells: memo$1(() => [table.getAllLeafColumns()], leafColumns => {
|
|
3073
3071
|
return leafColumns.map(column => {
|
|
3074
3072
|
return createCell(table, row, column, column.id);
|
|
3075
3073
|
});
|
|
@@ -3080,7 +3078,7 @@ const createRow = (table, id, original, rowIndex, depth, subRows, parentId) => {
|
|
|
3080
3078
|
return (_table$options$debugA = table.options.debugAll) != null ? _table$options$debugA : table.options.debugRows;
|
|
3081
3079
|
}
|
|
3082
3080
|
}),
|
|
3083
|
-
_getAllCellsByColumnId: memo(() => [row.getAllCells()], allCells => {
|
|
3081
|
+
_getAllCellsByColumnId: memo$1(() => [row.getAllCells()], allCells => {
|
|
3084
3082
|
return allCells.reduce((acc, cell) => {
|
|
3085
3083
|
acc[cell.column.id] = cell;
|
|
3086
3084
|
return acc;
|
|
@@ -3157,7 +3155,7 @@ function createColumnHelper() {
|
|
|
3157
3155
|
}
|
|
3158
3156
|
|
|
3159
3157
|
function getCoreRowModel() {
|
|
3160
|
-
return table => memo(() => [table.options.data], data => {
|
|
3158
|
+
return table => memo$1(() => [table.options.data], data => {
|
|
3161
3159
|
const rowModel = {
|
|
3162
3160
|
rows: [],
|
|
3163
3161
|
flatRows: [],
|
|
@@ -3214,7 +3212,7 @@ function getCoreRowModel() {
|
|
|
3214
3212
|
}
|
|
3215
3213
|
|
|
3216
3214
|
function getSortedRowModel() {
|
|
3217
|
-
return table => memo(() => [table.getState().sorting, table.getPreSortedRowModel()], (sorting, rowModel) => {
|
|
3215
|
+
return table => memo$1(() => [table.getState().sorting, table.getPreSortedRowModel()], (sorting, rowModel) => {
|
|
3218
3216
|
if (!rowModel.rows.length || !(sorting != null && sorting.length)) {
|
|
3219
3217
|
return rowModel;
|
|
3220
3218
|
}
|
|
@@ -3379,463 +3377,660 @@ function useReactTable(options) {
|
|
|
3379
3377
|
*
|
|
3380
3378
|
* @license MIT
|
|
3381
3379
|
*/
|
|
3380
|
+
function _extends$1() {
|
|
3381
|
+
_extends$1 = Object.assign ? Object.assign.bind() : function (target) {
|
|
3382
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
3383
|
+
var source = arguments[i];
|
|
3384
|
+
for (var key in source) {
|
|
3385
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
3386
|
+
target[key] = source[key];
|
|
3387
|
+
}
|
|
3388
|
+
}
|
|
3389
|
+
}
|
|
3390
|
+
return target;
|
|
3391
|
+
};
|
|
3392
|
+
return _extends$1.apply(this, arguments);
|
|
3393
|
+
}
|
|
3382
3394
|
|
|
3395
|
+
/**
|
|
3396
|
+
* virtual-core
|
|
3397
|
+
*
|
|
3398
|
+
* Copyright (c) TanStack
|
|
3399
|
+
*
|
|
3400
|
+
* This source code is licensed under the MIT license found in the
|
|
3401
|
+
* LICENSE.md file in the root directory of this source tree.
|
|
3402
|
+
*
|
|
3403
|
+
* @license MIT
|
|
3404
|
+
*/
|
|
3383
3405
|
function _extends() {
|
|
3384
|
-
_extends = Object.assign
|
|
3406
|
+
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
3385
3407
|
for (var i = 1; i < arguments.length; i++) {
|
|
3386
3408
|
var source = arguments[i];
|
|
3387
|
-
|
|
3388
3409
|
for (var key in source) {
|
|
3389
3410
|
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
3390
3411
|
target[key] = source[key];
|
|
3391
3412
|
}
|
|
3392
3413
|
}
|
|
3393
3414
|
}
|
|
3394
|
-
|
|
3395
3415
|
return target;
|
|
3396
3416
|
};
|
|
3397
|
-
|
|
3398
3417
|
return _extends.apply(this, arguments);
|
|
3399
3418
|
}
|
|
3400
3419
|
|
|
3401
|
-
|
|
3402
|
-
|
|
3403
|
-
|
|
3404
|
-
|
|
3405
|
-
|
|
3406
|
-
|
|
3407
|
-
|
|
3408
|
-
|
|
3409
|
-
|
|
3410
|
-
|
|
3411
|
-
|
|
3412
|
-
|
|
3413
|
-
|
|
3414
|
-
|
|
3415
|
-
|
|
3416
|
-
var
|
|
3417
|
-
|
|
3418
|
-
var
|
|
3419
|
-
|
|
3420
|
-
|
|
3421
|
-
}
|
|
3422
|
-
|
|
3423
|
-
if (b === void 0) {
|
|
3424
|
-
b = {};
|
|
3425
|
-
}
|
|
3426
|
-
|
|
3427
|
-
return props.some(function (prop) {
|
|
3428
|
-
return a[prop] !== b[prop];
|
|
3429
|
-
});
|
|
3430
|
-
};
|
|
3431
|
-
|
|
3432
|
-
var observedNodes = /*#__PURE__*/new Map();
|
|
3433
|
-
var rafId;
|
|
3434
|
-
|
|
3435
|
-
var run = function run() {
|
|
3436
|
-
var changedStates = [];
|
|
3437
|
-
observedNodes.forEach(function (state, node) {
|
|
3438
|
-
var newRect = node.getBoundingClientRect();
|
|
3439
|
-
|
|
3440
|
-
if (rectChanged(newRect, state.rect)) {
|
|
3441
|
-
state.rect = newRect;
|
|
3442
|
-
changedStates.push(state);
|
|
3443
|
-
}
|
|
3444
|
-
});
|
|
3445
|
-
changedStates.forEach(function (state) {
|
|
3446
|
-
state.callbacks.forEach(function (cb) {
|
|
3447
|
-
return cb(state.rect);
|
|
3420
|
+
/**
|
|
3421
|
+
* virtual-core
|
|
3422
|
+
*
|
|
3423
|
+
* Copyright (c) TanStack
|
|
3424
|
+
*
|
|
3425
|
+
* This source code is licensed under the MIT license found in the
|
|
3426
|
+
* LICENSE.md file in the root directory of this source tree.
|
|
3427
|
+
*
|
|
3428
|
+
* @license MIT
|
|
3429
|
+
*/
|
|
3430
|
+
function memo(getDeps, fn, opts) {
|
|
3431
|
+
var _opts$initialDeps;
|
|
3432
|
+
var deps = (_opts$initialDeps = opts.initialDeps) != null ? _opts$initialDeps : [];
|
|
3433
|
+
var result;
|
|
3434
|
+
return function () {
|
|
3435
|
+
var depTime;
|
|
3436
|
+
if (opts.key && opts.debug != null && opts.debug()) depTime = Date.now();
|
|
3437
|
+
var newDeps = getDeps();
|
|
3438
|
+
var depsChanged = newDeps.length !== deps.length || newDeps.some(function (dep, index) {
|
|
3439
|
+
return deps[index] !== dep;
|
|
3448
3440
|
});
|
|
3449
|
-
|
|
3450
|
-
|
|
3451
|
-
};
|
|
3452
|
-
|
|
3453
|
-
function observeRect(node, cb) {
|
|
3454
|
-
return {
|
|
3455
|
-
observe: function observe() {
|
|
3456
|
-
var wasEmpty = observedNodes.size === 0;
|
|
3457
|
-
|
|
3458
|
-
if (observedNodes.has(node)) {
|
|
3459
|
-
observedNodes.get(node).callbacks.push(cb);
|
|
3460
|
-
} else {
|
|
3461
|
-
observedNodes.set(node, {
|
|
3462
|
-
rect: undefined,
|
|
3463
|
-
hasRectChanged: false,
|
|
3464
|
-
callbacks: [cb]
|
|
3465
|
-
});
|
|
3466
|
-
}
|
|
3467
|
-
|
|
3468
|
-
if (wasEmpty) run();
|
|
3469
|
-
},
|
|
3470
|
-
unobserve: function unobserve() {
|
|
3471
|
-
var state = observedNodes.get(node);
|
|
3472
|
-
|
|
3473
|
-
if (state) {
|
|
3474
|
-
// Remove the callback
|
|
3475
|
-
var index = state.callbacks.indexOf(cb);
|
|
3476
|
-
if (index >= 0) state.callbacks.splice(index, 1); // Remove the node reference
|
|
3477
|
-
|
|
3478
|
-
if (!state.callbacks.length) observedNodes["delete"](node); // Stop the loop
|
|
3479
|
-
|
|
3480
|
-
if (!observedNodes.size) cancelAnimationFrame(rafId);
|
|
3481
|
-
}
|
|
3441
|
+
if (!depsChanged) {
|
|
3442
|
+
return result;
|
|
3482
3443
|
}
|
|
3444
|
+
deps = newDeps;
|
|
3445
|
+
var resultTime;
|
|
3446
|
+
if (opts.key && opts.debug != null && opts.debug()) resultTime = Date.now();
|
|
3447
|
+
result = fn.apply(void 0, newDeps);
|
|
3448
|
+
if (opts.key && opts.debug != null && opts.debug()) {
|
|
3449
|
+
var depEndTime = Math.round((Date.now() - depTime) * 100) / 100;
|
|
3450
|
+
var resultEndTime = Math.round((Date.now() - resultTime) * 100) / 100;
|
|
3451
|
+
var resultFpsPercentage = resultEndTime / 16;
|
|
3452
|
+
var pad = function pad(str, num) {
|
|
3453
|
+
str = String(str);
|
|
3454
|
+
while (str.length < num) {
|
|
3455
|
+
str = ' ' + str;
|
|
3456
|
+
}
|
|
3457
|
+
return str;
|
|
3458
|
+
};
|
|
3459
|
+
console.info("%c\u23F1 " + pad(resultEndTime, 5) + " /" + pad(depEndTime, 5) + " ms", "\n font-size: .6rem;\n font-weight: bold;\n color: hsl(" + Math.max(0, Math.min(120 - 120 * resultFpsPercentage, 120)) + "deg 100% 31%);", opts == null ? void 0 : opts.key);
|
|
3460
|
+
}
|
|
3461
|
+
opts == null ? void 0 : opts.onChange == null ? void 0 : opts.onChange(result);
|
|
3462
|
+
return result;
|
|
3483
3463
|
};
|
|
3484
3464
|
}
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
|
|
3491
|
-
if (state.height !== rect.height || state.width !== rect.width) {
|
|
3492
|
-
return rect;
|
|
3465
|
+
function notUndefined(value, msg) {
|
|
3466
|
+
if (value === undefined) {
|
|
3467
|
+
throw new Error("Unexpected undefined" + (msg ? ": " + msg : ''));
|
|
3468
|
+
} else {
|
|
3469
|
+
return value;
|
|
3493
3470
|
}
|
|
3494
|
-
|
|
3495
|
-
return state;
|
|
3496
3471
|
}
|
|
3497
|
-
|
|
3498
|
-
|
|
3499
|
-
if (initialRect === void 0) {
|
|
3500
|
-
initialRect = {
|
|
3501
|
-
width: 0,
|
|
3502
|
-
height: 0
|
|
3503
|
-
};
|
|
3504
|
-
}
|
|
3505
|
-
|
|
3506
|
-
var _React$useState = React__default["default"].useState(nodeRef.current),
|
|
3507
|
-
element = _React$useState[0],
|
|
3508
|
-
setElement = _React$useState[1];
|
|
3509
|
-
|
|
3510
|
-
var _React$useReducer = React__default["default"].useReducer(rectReducer, initialRect),
|
|
3511
|
-
rect = _React$useReducer[0],
|
|
3512
|
-
dispatch = _React$useReducer[1];
|
|
3513
|
-
|
|
3514
|
-
var initialRectSet = React__default["default"].useRef(false);
|
|
3515
|
-
useIsomorphicLayoutEffect$1(function () {
|
|
3516
|
-
if (nodeRef.current !== element) {
|
|
3517
|
-
setElement(nodeRef.current);
|
|
3518
|
-
}
|
|
3519
|
-
});
|
|
3520
|
-
useIsomorphicLayoutEffect$1(function () {
|
|
3521
|
-
if (element && !initialRectSet.current) {
|
|
3522
|
-
initialRectSet.current = true;
|
|
3523
|
-
|
|
3524
|
-
var _rect = element.getBoundingClientRect();
|
|
3525
|
-
|
|
3526
|
-
dispatch({
|
|
3527
|
-
rect: _rect
|
|
3528
|
-
});
|
|
3529
|
-
}
|
|
3530
|
-
}, [element]);
|
|
3531
|
-
React__default["default"].useEffect(function () {
|
|
3532
|
-
if (!element) {
|
|
3533
|
-
return;
|
|
3534
|
-
}
|
|
3535
|
-
|
|
3536
|
-
var observer = observeRect(element, function (rect) {
|
|
3537
|
-
dispatch({
|
|
3538
|
-
rect: rect
|
|
3539
|
-
});
|
|
3540
|
-
});
|
|
3541
|
-
observer.observe();
|
|
3542
|
-
return function () {
|
|
3543
|
-
observer.unobserve();
|
|
3544
|
-
};
|
|
3545
|
-
}, [element]);
|
|
3546
|
-
return rect;
|
|
3472
|
+
var approxEqual = function approxEqual(a, b) {
|
|
3473
|
+
return Math.abs(a - b) < 1;
|
|
3547
3474
|
};
|
|
3548
3475
|
|
|
3549
|
-
|
|
3476
|
+
/**
|
|
3477
|
+
* virtual-core
|
|
3478
|
+
*
|
|
3479
|
+
* Copyright (c) TanStack
|
|
3480
|
+
*
|
|
3481
|
+
* This source code is licensed under the MIT license found in the
|
|
3482
|
+
* LICENSE.md file in the root directory of this source tree.
|
|
3483
|
+
*
|
|
3484
|
+
* @license MIT
|
|
3485
|
+
*/
|
|
3550
3486
|
|
|
3551
|
-
|
|
3552
|
-
|
|
3553
|
-
|
|
3487
|
+
//
|
|
3488
|
+
|
|
3489
|
+
//
|
|
3554
3490
|
|
|
3555
3491
|
var defaultKeyExtractor = function defaultKeyExtractor(index) {
|
|
3556
3492
|
return index;
|
|
3557
3493
|
};
|
|
3558
|
-
|
|
3559
|
-
var defaultMeasureSize = function defaultMeasureSize(el, horizontal) {
|
|
3560
|
-
var key = horizontal ? 'offsetWidth' : 'offsetHeight';
|
|
3561
|
-
return el[key];
|
|
3562
|
-
};
|
|
3563
|
-
|
|
3564
3494
|
var defaultRangeExtractor = function defaultRangeExtractor(range) {
|
|
3565
|
-
var start = Math.max(range.
|
|
3566
|
-
var end = Math.min(range.
|
|
3495
|
+
var start = Math.max(range.startIndex - range.overscan, 0);
|
|
3496
|
+
var end = Math.min(range.endIndex + range.overscan, range.count - 1);
|
|
3567
3497
|
var arr = [];
|
|
3568
|
-
|
|
3569
3498
|
for (var _i = start; _i <= end; _i++) {
|
|
3570
3499
|
arr.push(_i);
|
|
3571
3500
|
}
|
|
3572
|
-
|
|
3573
3501
|
return arr;
|
|
3574
3502
|
};
|
|
3575
|
-
var
|
|
3576
|
-
var
|
|
3577
|
-
|
|
3578
|
-
|
|
3579
|
-
|
|
3580
|
-
|
|
3581
|
-
|
|
3582
|
-
|
|
3583
|
-
|
|
3584
|
-
|
|
3585
|
-
|
|
3586
|
-
|
|
3587
|
-
|
|
3588
|
-
|
|
3589
|
-
|
|
3590
|
-
|
|
3591
|
-
|
|
3592
|
-
|
|
3593
|
-
|
|
3594
|
-
|
|
3595
|
-
|
|
3596
|
-
|
|
3597
|
-
|
|
3598
|
-
|
|
3599
|
-
|
|
3600
|
-
|
|
3601
|
-
|
|
3602
|
-
var sizeKey = horizontal ? 'width' : 'height';
|
|
3603
|
-
var scrollKey = horizontal ? 'scrollLeft' : 'scrollTop';
|
|
3604
|
-
var latestRef = React__namespace.useRef({
|
|
3605
|
-
outerSize: 0,
|
|
3606
|
-
scrollOffset: 0,
|
|
3607
|
-
measurements: [],
|
|
3608
|
-
totalSize: 0
|
|
3503
|
+
var observeElementRect = function observeElementRect(instance, cb) {
|
|
3504
|
+
var element = instance.scrollElement;
|
|
3505
|
+
if (!element) {
|
|
3506
|
+
return;
|
|
3507
|
+
}
|
|
3508
|
+
var handler = function handler(rect) {
|
|
3509
|
+
var width = rect.width,
|
|
3510
|
+
height = rect.height;
|
|
3511
|
+
cb({
|
|
3512
|
+
width: Math.round(width),
|
|
3513
|
+
height: Math.round(height)
|
|
3514
|
+
});
|
|
3515
|
+
};
|
|
3516
|
+
handler(element.getBoundingClientRect());
|
|
3517
|
+
var observer = new ResizeObserver(function (entries) {
|
|
3518
|
+
var entry = entries[0];
|
|
3519
|
+
if (entry != null && entry.borderBoxSize) {
|
|
3520
|
+
var box = entry.borderBoxSize[0];
|
|
3521
|
+
if (box) {
|
|
3522
|
+
handler({
|
|
3523
|
+
width: box.inlineSize,
|
|
3524
|
+
height: box.blockSize
|
|
3525
|
+
});
|
|
3526
|
+
return;
|
|
3527
|
+
}
|
|
3528
|
+
}
|
|
3529
|
+
handler(element.getBoundingClientRect());
|
|
3609
3530
|
});
|
|
3610
|
-
|
|
3611
|
-
|
|
3612
|
-
|
|
3613
|
-
|
|
3614
|
-
|
|
3615
|
-
|
|
3616
|
-
|
|
3617
|
-
|
|
3618
|
-
var
|
|
3619
|
-
|
|
3620
|
-
|
|
3621
|
-
|
|
3622
|
-
var
|
|
3623
|
-
|
|
3624
|
-
|
|
3531
|
+
observer.observe(element, {
|
|
3532
|
+
box: 'border-box'
|
|
3533
|
+
});
|
|
3534
|
+
return function () {
|
|
3535
|
+
observer.unobserve(element);
|
|
3536
|
+
};
|
|
3537
|
+
};
|
|
3538
|
+
var observeElementOffset = function observeElementOffset(instance, cb) {
|
|
3539
|
+
var element = instance.scrollElement;
|
|
3540
|
+
if (!element) {
|
|
3541
|
+
return;
|
|
3542
|
+
}
|
|
3543
|
+
var handler = function handler() {
|
|
3544
|
+
cb(element[instance.options.horizontal ? 'scrollLeft' : 'scrollTop']);
|
|
3545
|
+
};
|
|
3546
|
+
handler();
|
|
3547
|
+
element.addEventListener('scroll', handler, {
|
|
3548
|
+
passive: true
|
|
3549
|
+
});
|
|
3550
|
+
return function () {
|
|
3551
|
+
element.removeEventListener('scroll', handler);
|
|
3552
|
+
};
|
|
3553
|
+
};
|
|
3554
|
+
var measureElement = function measureElement(element, entry, instance) {
|
|
3555
|
+
if (entry != null && entry.borderBoxSize) {
|
|
3556
|
+
var box = entry.borderBoxSize[0];
|
|
3557
|
+
if (box) {
|
|
3558
|
+
var size = Math.round(box[instance.options.horizontal ? 'inlineSize' : 'blockSize']);
|
|
3559
|
+
return size;
|
|
3625
3560
|
}
|
|
3626
|
-
}
|
|
3627
|
-
|
|
3628
|
-
|
|
3629
|
-
|
|
3630
|
-
|
|
3631
|
-
|
|
3632
|
-
|
|
3633
|
-
|
|
3634
|
-
|
|
3635
|
-
|
|
3636
|
-
|
|
3637
|
-
|
|
3638
|
-
|
|
3639
|
-
|
|
3640
|
-
|
|
3641
|
-
|
|
3642
|
-
|
|
3643
|
-
|
|
3644
|
-
|
|
3645
|
-
|
|
3646
|
-
|
|
3647
|
-
|
|
3648
|
-
|
|
3649
|
-
|
|
3650
|
-
|
|
3651
|
-
|
|
3652
|
-
|
|
3653
|
-
|
|
3654
|
-
|
|
3561
|
+
}
|
|
3562
|
+
return Math.round(element.getBoundingClientRect()[instance.options.horizontal ? 'width' : 'height']);
|
|
3563
|
+
};
|
|
3564
|
+
var elementScroll = function elementScroll(offset, _ref2, instance) {
|
|
3565
|
+
var _instance$scrollEleme3, _instance$scrollEleme4;
|
|
3566
|
+
var _ref2$adjustments = _ref2.adjustments,
|
|
3567
|
+
adjustments = _ref2$adjustments === void 0 ? 0 : _ref2$adjustments,
|
|
3568
|
+
behavior = _ref2.behavior;
|
|
3569
|
+
var toOffset = offset + adjustments;
|
|
3570
|
+
(_instance$scrollEleme3 = instance.scrollElement) == null ? void 0 : _instance$scrollEleme3.scrollTo == null ? void 0 : _instance$scrollEleme3.scrollTo((_instance$scrollEleme4 = {}, _instance$scrollEleme4[instance.options.horizontal ? 'left' : 'top'] = toOffset, _instance$scrollEleme4.behavior = behavior, _instance$scrollEleme4));
|
|
3571
|
+
};
|
|
3572
|
+
var Virtualizer = function Virtualizer(_opts) {
|
|
3573
|
+
var _this = this;
|
|
3574
|
+
this.unsubs = [];
|
|
3575
|
+
this.scrollElement = null;
|
|
3576
|
+
this.isScrolling = false;
|
|
3577
|
+
this.isScrollingTimeoutId = null;
|
|
3578
|
+
this.scrollToIndexTimeoutId = null;
|
|
3579
|
+
this.measurementsCache = [];
|
|
3580
|
+
this.itemSizeCache = new Map();
|
|
3581
|
+
this.pendingMeasuredCacheIndexes = [];
|
|
3582
|
+
this.scrollDirection = null;
|
|
3583
|
+
this.scrollAdjustments = 0;
|
|
3584
|
+
this.measureElementCache = new Map();
|
|
3585
|
+
this.observer = function () {
|
|
3586
|
+
var _ro = null;
|
|
3587
|
+
var get = function get() {
|
|
3588
|
+
if (_ro) {
|
|
3589
|
+
return _ro;
|
|
3590
|
+
} else if (typeof ResizeObserver !== 'undefined') {
|
|
3591
|
+
return _ro = new ResizeObserver(function (entries) {
|
|
3592
|
+
entries.forEach(function (entry) {
|
|
3593
|
+
_this._measureElement(entry.target, entry);
|
|
3594
|
+
});
|
|
3595
|
+
});
|
|
3596
|
+
} else {
|
|
3597
|
+
return null;
|
|
3598
|
+
}
|
|
3599
|
+
};
|
|
3600
|
+
return {
|
|
3601
|
+
disconnect: function disconnect() {
|
|
3602
|
+
var _get;
|
|
3603
|
+
return (_get = get()) == null ? void 0 : _get.disconnect();
|
|
3604
|
+
},
|
|
3605
|
+
observe: function observe(target) {
|
|
3606
|
+
var _get2;
|
|
3607
|
+
return (_get2 = get()) == null ? void 0 : _get2.observe(target, {
|
|
3608
|
+
box: 'border-box'
|
|
3609
|
+
});
|
|
3610
|
+
},
|
|
3611
|
+
unobserve: function unobserve(target) {
|
|
3612
|
+
var _get3;
|
|
3613
|
+
return (_get3 = get()) == null ? void 0 : _get3.unobserve(target);
|
|
3614
|
+
}
|
|
3615
|
+
};
|
|
3616
|
+
}();
|
|
3617
|
+
this.range = null;
|
|
3618
|
+
this.setOptions = function (opts) {
|
|
3619
|
+
Object.entries(opts).forEach(function (_ref3) {
|
|
3620
|
+
var key = _ref3[0],
|
|
3621
|
+
value = _ref3[1];
|
|
3622
|
+
if (typeof value === 'undefined') delete opts[key];
|
|
3623
|
+
});
|
|
3624
|
+
_this.options = _extends({
|
|
3625
|
+
debug: false,
|
|
3626
|
+
initialOffset: 0,
|
|
3627
|
+
overscan: 1,
|
|
3628
|
+
paddingStart: 0,
|
|
3629
|
+
paddingEnd: 0,
|
|
3630
|
+
scrollPaddingStart: 0,
|
|
3631
|
+
scrollPaddingEnd: 0,
|
|
3632
|
+
horizontal: false,
|
|
3633
|
+
getItemKey: defaultKeyExtractor,
|
|
3634
|
+
rangeExtractor: defaultRangeExtractor,
|
|
3635
|
+
onChange: function onChange() {},
|
|
3636
|
+
measureElement: measureElement,
|
|
3637
|
+
initialRect: {
|
|
3638
|
+
width: 0,
|
|
3639
|
+
height: 0
|
|
3640
|
+
},
|
|
3641
|
+
scrollMargin: 0,
|
|
3642
|
+
scrollingDelay: 150,
|
|
3643
|
+
indexAttribute: 'data-index',
|
|
3644
|
+
initialMeasurementsCache: [],
|
|
3645
|
+
lanes: 1
|
|
3646
|
+
}, opts);
|
|
3647
|
+
};
|
|
3648
|
+
this.notify = function (sync) {
|
|
3649
|
+
_this.options.onChange == null ? void 0 : _this.options.onChange(_this, sync);
|
|
3650
|
+
};
|
|
3651
|
+
this.maybeNotify = memo(function () {
|
|
3652
|
+
_this.calculateRange();
|
|
3653
|
+
return [_this.isScrolling, _this.range ? _this.range.startIndex : null, _this.range ? _this.range.endIndex : null];
|
|
3654
|
+
}, function (isScrolling) {
|
|
3655
|
+
_this.notify(isScrolling);
|
|
3656
|
+
}, {
|
|
3657
|
+
key: process.env.NODE_ENV !== 'production' && 'maybeNotify',
|
|
3658
|
+
debug: function debug() {
|
|
3659
|
+
return _this.options.debug;
|
|
3660
|
+
},
|
|
3661
|
+
initialDeps: [this.isScrolling, this.range ? this.range.startIndex : null, this.range ? this.range.endIndex : null]
|
|
3662
|
+
});
|
|
3663
|
+
this.cleanup = function () {
|
|
3664
|
+
_this.unsubs.filter(Boolean).forEach(function (d) {
|
|
3665
|
+
return d();
|
|
3666
|
+
});
|
|
3667
|
+
_this.unsubs = [];
|
|
3668
|
+
_this.scrollElement = null;
|
|
3669
|
+
};
|
|
3670
|
+
this._didMount = function () {
|
|
3671
|
+
_this.measureElementCache.forEach(_this.observer.observe);
|
|
3672
|
+
return function () {
|
|
3673
|
+
_this.observer.disconnect();
|
|
3674
|
+
_this.cleanup();
|
|
3675
|
+
};
|
|
3676
|
+
};
|
|
3677
|
+
this._willUpdate = function () {
|
|
3678
|
+
var scrollElement = _this.options.getScrollElement();
|
|
3679
|
+
if (_this.scrollElement !== scrollElement) {
|
|
3680
|
+
_this.cleanup();
|
|
3681
|
+
_this.scrollElement = scrollElement;
|
|
3682
|
+
_this._scrollToOffset(_this.scrollOffset, {
|
|
3683
|
+
adjustments: undefined,
|
|
3684
|
+
behavior: undefined
|
|
3685
|
+
});
|
|
3686
|
+
_this.unsubs.push(_this.options.observeElementRect(_this, function (rect) {
|
|
3687
|
+
_this.scrollRect = rect;
|
|
3688
|
+
_this.maybeNotify();
|
|
3689
|
+
}));
|
|
3690
|
+
_this.unsubs.push(_this.options.observeElementOffset(_this, function (offset) {
|
|
3691
|
+
_this.scrollAdjustments = 0;
|
|
3692
|
+
if (_this.scrollOffset === offset) {
|
|
3693
|
+
return;
|
|
3694
|
+
}
|
|
3695
|
+
if (_this.isScrollingTimeoutId !== null) {
|
|
3696
|
+
clearTimeout(_this.isScrollingTimeoutId);
|
|
3697
|
+
_this.isScrollingTimeoutId = null;
|
|
3698
|
+
}
|
|
3699
|
+
_this.isScrolling = true;
|
|
3700
|
+
_this.scrollDirection = _this.scrollOffset < offset ? 'forward' : 'backward';
|
|
3701
|
+
_this.scrollOffset = offset;
|
|
3702
|
+
_this.maybeNotify();
|
|
3703
|
+
_this.isScrollingTimeoutId = setTimeout(function () {
|
|
3704
|
+
_this.isScrollingTimeoutId = null;
|
|
3705
|
+
_this.isScrolling = false;
|
|
3706
|
+
_this.scrollDirection = null;
|
|
3707
|
+
_this.maybeNotify();
|
|
3708
|
+
}, _this.options.scrollingDelay);
|
|
3709
|
+
}));
|
|
3710
|
+
}
|
|
3711
|
+
};
|
|
3712
|
+
this.getSize = function () {
|
|
3713
|
+
return _this.scrollRect[_this.options.horizontal ? 'width' : 'height'];
|
|
3714
|
+
};
|
|
3715
|
+
this.memoOptions = memo(function () {
|
|
3716
|
+
return [_this.options.count, _this.options.paddingStart, _this.options.scrollMargin, _this.options.getItemKey];
|
|
3717
|
+
}, function (count, paddingStart, scrollMargin, getItemKey) {
|
|
3718
|
+
_this.pendingMeasuredCacheIndexes = [];
|
|
3719
|
+
return {
|
|
3720
|
+
count: count,
|
|
3721
|
+
paddingStart: paddingStart,
|
|
3722
|
+
scrollMargin: scrollMargin,
|
|
3723
|
+
getItemKey: getItemKey
|
|
3724
|
+
};
|
|
3725
|
+
}, {
|
|
3726
|
+
key: false
|
|
3727
|
+
});
|
|
3728
|
+
this.getFurthestMeasurement = function (measurements, index) {
|
|
3729
|
+
var furthestMeasurementsFound = new Map();
|
|
3730
|
+
var furthestMeasurements = new Map();
|
|
3731
|
+
for (var m = index - 1; m >= 0; m--) {
|
|
3732
|
+
var measurement = measurements[m];
|
|
3733
|
+
if (furthestMeasurementsFound.has(measurement.lane)) {
|
|
3734
|
+
continue;
|
|
3735
|
+
}
|
|
3736
|
+
var previousFurthestMeasurement = furthestMeasurements.get(measurement.lane);
|
|
3737
|
+
if (previousFurthestMeasurement == null || measurement.end > previousFurthestMeasurement.end) {
|
|
3738
|
+
furthestMeasurements.set(measurement.lane, measurement);
|
|
3739
|
+
} else if (measurement.end < previousFurthestMeasurement.end) {
|
|
3740
|
+
furthestMeasurementsFound.set(measurement.lane, true);
|
|
3741
|
+
}
|
|
3742
|
+
if (furthestMeasurementsFound.size === _this.options.lanes) {
|
|
3743
|
+
break;
|
|
3744
|
+
}
|
|
3745
|
+
}
|
|
3746
|
+
return furthestMeasurements.size === _this.options.lanes ? Array.from(furthestMeasurements.values()).sort(function (a, b) {
|
|
3747
|
+
return a.end - b.end;
|
|
3748
|
+
})[0] : undefined;
|
|
3749
|
+
};
|
|
3750
|
+
this.getMeasurements = memo(function () {
|
|
3751
|
+
return [_this.memoOptions(), _this.itemSizeCache];
|
|
3752
|
+
}, function (_ref4, itemSizeCache) {
|
|
3753
|
+
var count = _ref4.count,
|
|
3754
|
+
paddingStart = _ref4.paddingStart,
|
|
3755
|
+
scrollMargin = _ref4.scrollMargin,
|
|
3756
|
+
getItemKey = _ref4.getItemKey;
|
|
3757
|
+
var min = _this.pendingMeasuredCacheIndexes.length > 0 ? Math.min.apply(Math, _this.pendingMeasuredCacheIndexes) : 0;
|
|
3758
|
+
_this.pendingMeasuredCacheIndexes = [];
|
|
3759
|
+
var measurements = _this.measurementsCache.slice(0, min);
|
|
3760
|
+
for (var _i2 = min; _i2 < count; _i2++) {
|
|
3761
|
+
var key = getItemKey(_i2);
|
|
3762
|
+
var furthestMeasurement = _this.options.lanes === 1 ? measurements[_i2 - 1] : _this.getFurthestMeasurement(measurements, _i2);
|
|
3763
|
+
var start = furthestMeasurement ? furthestMeasurement.end : paddingStart + scrollMargin;
|
|
3764
|
+
var measuredSize = itemSizeCache.get(key);
|
|
3765
|
+
var size = typeof measuredSize === 'number' ? measuredSize : _this.options.estimateSize(_i2);
|
|
3766
|
+
var end = start + size;
|
|
3767
|
+
var lane = furthestMeasurement ? furthestMeasurement.lane : _i2 % _this.options.lanes;
|
|
3655
3768
|
measurements[_i2] = {
|
|
3656
3769
|
index: _i2,
|
|
3657
|
-
start:
|
|
3658
|
-
size:
|
|
3659
|
-
end:
|
|
3660
|
-
key: key
|
|
3770
|
+
start: start,
|
|
3771
|
+
size: size,
|
|
3772
|
+
end: end,
|
|
3773
|
+
key: key,
|
|
3774
|
+
lane: lane
|
|
3661
3775
|
};
|
|
3662
3776
|
}
|
|
3663
|
-
|
|
3777
|
+
_this.measurementsCache = measurements;
|
|
3664
3778
|
return measurements;
|
|
3665
|
-
},
|
|
3666
|
-
|
|
3667
|
-
|
|
3668
|
-
|
|
3669
|
-
var element = onScrollElement ? onScrollElement.current : parentRef.current;
|
|
3670
|
-
var scrollOffsetFnRef = React__namespace.useRef(scrollOffsetFn);
|
|
3671
|
-
scrollOffsetFnRef.current = scrollOffsetFn;
|
|
3672
|
-
useIsomorphicLayoutEffect$1(function () {
|
|
3673
|
-
if (!element) {
|
|
3674
|
-
setScrollOffset(0);
|
|
3675
|
-
return;
|
|
3779
|
+
}, {
|
|
3780
|
+
key: process.env.NODE_ENV !== 'production' && 'getMeasurements',
|
|
3781
|
+
debug: function debug() {
|
|
3782
|
+
return _this.options.debug;
|
|
3676
3783
|
}
|
|
3677
|
-
|
|
3678
|
-
|
|
3679
|
-
|
|
3680
|
-
|
|
3681
|
-
|
|
3682
|
-
|
|
3683
|
-
|
|
3684
|
-
|
|
3685
|
-
|
|
3686
|
-
|
|
3687
|
-
|
|
3688
|
-
|
|
3689
|
-
|
|
3690
|
-
}
|
|
3691
|
-
}
|
|
3692
|
-
|
|
3693
|
-
|
|
3694
|
-
|
|
3695
|
-
|
|
3696
|
-
|
|
3697
|
-
var indexes = React__namespace.useMemo(function () {
|
|
3698
|
-
return rangeExtractor({
|
|
3699
|
-
start: start,
|
|
3700
|
-
end: end,
|
|
3784
|
+
});
|
|
3785
|
+
this.calculateRange = memo(function () {
|
|
3786
|
+
return [_this.getMeasurements(), _this.getSize(), _this.scrollOffset];
|
|
3787
|
+
}, function (measurements, outerSize, scrollOffset) {
|
|
3788
|
+
return _this.range = measurements.length > 0 && outerSize > 0 ? calculateRange({
|
|
3789
|
+
measurements: measurements,
|
|
3790
|
+
outerSize: outerSize,
|
|
3791
|
+
scrollOffset: scrollOffset
|
|
3792
|
+
}) : null;
|
|
3793
|
+
}, {
|
|
3794
|
+
key: process.env.NODE_ENV !== 'production' && 'calculateRange',
|
|
3795
|
+
debug: function debug() {
|
|
3796
|
+
return _this.options.debug;
|
|
3797
|
+
}
|
|
3798
|
+
});
|
|
3799
|
+
this.getIndexes = memo(function () {
|
|
3800
|
+
return [_this.options.rangeExtractor, _this.calculateRange(), _this.options.overscan, _this.options.count];
|
|
3801
|
+
}, function (rangeExtractor, range, overscan, count) {
|
|
3802
|
+
return range === null ? [] : rangeExtractor(_extends({}, range, {
|
|
3701
3803
|
overscan: overscan,
|
|
3702
|
-
|
|
3703
|
-
});
|
|
3704
|
-
},
|
|
3705
|
-
|
|
3706
|
-
|
|
3707
|
-
|
|
3708
|
-
|
|
3709
|
-
|
|
3710
|
-
|
|
3711
|
-
|
|
3712
|
-
|
|
3713
|
-
|
|
3714
|
-
|
|
3715
|
-
|
|
3716
|
-
|
|
3717
|
-
|
|
3718
|
-
|
|
3719
|
-
|
|
3720
|
-
|
|
3721
|
-
|
|
3722
|
-
|
|
3723
|
-
|
|
3724
|
-
|
|
3725
|
-
|
|
3726
|
-
pendingMeasuredCacheIndexesRef.current.push(i);
|
|
3727
|
-
setMeasuredCache(function (old) {
|
|
3728
|
-
var _extends2;
|
|
3729
|
-
|
|
3730
|
-
return _extends({}, old, (_extends2 = {}, _extends2[item.key] = measuredSize, _extends2));
|
|
3731
|
-
});
|
|
3732
|
-
}
|
|
3733
|
-
}
|
|
3804
|
+
count: count
|
|
3805
|
+
}));
|
|
3806
|
+
}, {
|
|
3807
|
+
key: process.env.NODE_ENV !== 'production' && 'getIndexes',
|
|
3808
|
+
debug: function debug() {
|
|
3809
|
+
return _this.options.debug;
|
|
3810
|
+
}
|
|
3811
|
+
});
|
|
3812
|
+
this.indexFromElement = function (node) {
|
|
3813
|
+
var attributeName = _this.options.indexAttribute;
|
|
3814
|
+
var indexStr = node.getAttribute(attributeName);
|
|
3815
|
+
if (!indexStr) {
|
|
3816
|
+
console.warn("Missing attribute name '" + attributeName + "={index}' on measured element.");
|
|
3817
|
+
return -1;
|
|
3818
|
+
}
|
|
3819
|
+
return parseInt(indexStr, 10);
|
|
3820
|
+
};
|
|
3821
|
+
this._measureElement = function (node, entry) {
|
|
3822
|
+
var item = _this.measurementsCache[_this.indexFromElement(node)];
|
|
3823
|
+
if (!item || !node.isConnected) {
|
|
3824
|
+
_this.measureElementCache.forEach(function (cached, key) {
|
|
3825
|
+
if (cached === node) {
|
|
3826
|
+
_this.observer.unobserve(node);
|
|
3827
|
+
_this.measureElementCache["delete"](key);
|
|
3734
3828
|
}
|
|
3735
3829
|
});
|
|
3736
|
-
|
|
3737
|
-
|
|
3738
|
-
|
|
3739
|
-
|
|
3830
|
+
return;
|
|
3831
|
+
}
|
|
3832
|
+
var prevNode = _this.measureElementCache.get(item.key);
|
|
3833
|
+
if (prevNode !== node) {
|
|
3834
|
+
if (prevNode) {
|
|
3835
|
+
_this.observer.unobserve(prevNode);
|
|
3836
|
+
}
|
|
3837
|
+
_this.observer.observe(node);
|
|
3838
|
+
_this.measureElementCache.set(item.key, node);
|
|
3839
|
+
}
|
|
3840
|
+
var measuredItemSize = _this.options.measureElement(node, entry, _this);
|
|
3841
|
+
_this.resizeItem(item, measuredItemSize);
|
|
3842
|
+
};
|
|
3843
|
+
this.resizeItem = function (item, size) {
|
|
3844
|
+
var _this$itemSizeCache$g;
|
|
3845
|
+
var itemSize = (_this$itemSizeCache$g = _this.itemSizeCache.get(item.key)) != null ? _this$itemSizeCache$g : item.size;
|
|
3846
|
+
var delta = size - itemSize;
|
|
3847
|
+
if (delta !== 0) {
|
|
3848
|
+
if (item.start < _this.scrollOffset) {
|
|
3849
|
+
if (process.env.NODE_ENV !== 'production' && _this.options.debug) {
|
|
3850
|
+
console.info('correction', delta);
|
|
3851
|
+
}
|
|
3852
|
+
_this._scrollToOffset(_this.scrollOffset, {
|
|
3853
|
+
adjustments: _this.scrollAdjustments += delta,
|
|
3854
|
+
behavior: undefined
|
|
3855
|
+
});
|
|
3856
|
+
}
|
|
3857
|
+
_this.pendingMeasuredCacheIndexes.push(item.index);
|
|
3858
|
+
_this.itemSizeCache = new Map(_this.itemSizeCache.set(item.key, size));
|
|
3859
|
+
_this.notify(false);
|
|
3860
|
+
}
|
|
3861
|
+
};
|
|
3862
|
+
this.measureElement = function (node) {
|
|
3863
|
+
if (!node) {
|
|
3864
|
+
return;
|
|
3865
|
+
}
|
|
3866
|
+
_this._measureElement(node, undefined);
|
|
3867
|
+
};
|
|
3868
|
+
this.getVirtualItems = memo(function () {
|
|
3869
|
+
return [_this.getIndexes(), _this.getMeasurements()];
|
|
3870
|
+
}, function (indexes, measurements) {
|
|
3871
|
+
var virtualItems = [];
|
|
3740
3872
|
for (var k = 0, len = indexes.length; k < len; k++) {
|
|
3741
|
-
|
|
3873
|
+
var _i3 = indexes[k];
|
|
3874
|
+
var measurement = measurements[_i3];
|
|
3875
|
+
virtualItems.push(measurement);
|
|
3742
3876
|
}
|
|
3743
|
-
|
|
3744
3877
|
return virtualItems;
|
|
3745
|
-
},
|
|
3746
|
-
|
|
3747
|
-
|
|
3748
|
-
|
|
3749
|
-
setMeasuredCache({});
|
|
3878
|
+
}, {
|
|
3879
|
+
key: process.env.NODE_ENV !== 'production' && 'getIndexes',
|
|
3880
|
+
debug: function debug() {
|
|
3881
|
+
return _this.options.debug;
|
|
3750
3882
|
}
|
|
3751
|
-
|
|
3752
|
-
|
|
3753
|
-
|
|
3754
|
-
|
|
3755
|
-
|
|
3756
|
-
|
|
3757
|
-
|
|
3758
|
-
|
|
3759
|
-
|
|
3760
|
-
var _latestRef$current = latestRef.current,
|
|
3761
|
-
scrollOffset = _latestRef$current.scrollOffset,
|
|
3762
|
-
outerSize = _latestRef$current.outerSize;
|
|
3763
|
-
|
|
3883
|
+
});
|
|
3884
|
+
this.getVirtualItemForOffset = function (offset) {
|
|
3885
|
+
var measurements = _this.getMeasurements();
|
|
3886
|
+
return notUndefined(measurements[findNearestBinarySearch(0, measurements.length - 1, function (index) {
|
|
3887
|
+
return notUndefined(measurements[index]).start;
|
|
3888
|
+
}, offset)]);
|
|
3889
|
+
};
|
|
3890
|
+
this.getOffsetForAlignment = function (toOffset, align) {
|
|
3891
|
+
var size = _this.getSize();
|
|
3764
3892
|
if (align === 'auto') {
|
|
3765
|
-
if (toOffset <= scrollOffset) {
|
|
3893
|
+
if (toOffset <= _this.scrollOffset) {
|
|
3766
3894
|
align = 'start';
|
|
3767
|
-
} else if (toOffset >= scrollOffset +
|
|
3895
|
+
} else if (toOffset >= _this.scrollOffset + size) {
|
|
3768
3896
|
align = 'end';
|
|
3769
3897
|
} else {
|
|
3770
3898
|
align = 'start';
|
|
3771
3899
|
}
|
|
3772
3900
|
}
|
|
3773
|
-
|
|
3774
3901
|
if (align === 'start') {
|
|
3775
|
-
|
|
3902
|
+
toOffset = toOffset;
|
|
3776
3903
|
} else if (align === 'end') {
|
|
3777
|
-
|
|
3904
|
+
toOffset = toOffset - size;
|
|
3778
3905
|
} else if (align === 'center') {
|
|
3779
|
-
|
|
3780
|
-
}
|
|
3781
|
-
}, [scrollTo]);
|
|
3782
|
-
var tryScrollToIndex = React__namespace.useCallback(function (index, _temp2) {
|
|
3783
|
-
var _ref3 = _temp2 === void 0 ? {
|
|
3784
|
-
align: 'auto'
|
|
3785
|
-
} : _temp2,
|
|
3786
|
-
align = _ref3.align,
|
|
3787
|
-
rest = _objectWithoutPropertiesLoose$1(_ref3, _excluded$1);
|
|
3788
|
-
|
|
3789
|
-
var _latestRef$current2 = latestRef.current,
|
|
3790
|
-
measurements = _latestRef$current2.measurements,
|
|
3791
|
-
scrollOffset = _latestRef$current2.scrollOffset,
|
|
3792
|
-
outerSize = _latestRef$current2.outerSize;
|
|
3793
|
-
var measurement = measurements[Math.max(0, Math.min(index, size - 1))];
|
|
3794
|
-
|
|
3795
|
-
if (!measurement) {
|
|
3796
|
-
return;
|
|
3906
|
+
toOffset = toOffset - size / 2;
|
|
3797
3907
|
}
|
|
3798
|
-
|
|
3908
|
+
var scrollSizeProp = _this.options.horizontal ? 'scrollWidth' : 'scrollHeight';
|
|
3909
|
+
var scrollSize = _this.scrollElement ? 'document' in _this.scrollElement ? _this.scrollElement.document.documentElement[scrollSizeProp] : _this.scrollElement[scrollSizeProp] : 0;
|
|
3910
|
+
var maxOffset = scrollSize - _this.getSize();
|
|
3911
|
+
return Math.max(Math.min(maxOffset, toOffset), 0);
|
|
3912
|
+
};
|
|
3913
|
+
this.getOffsetForIndex = function (index, align) {
|
|
3914
|
+
if (align === void 0) {
|
|
3915
|
+
align = 'auto';
|
|
3916
|
+
}
|
|
3917
|
+
index = Math.max(0, Math.min(index, _this.options.count - 1));
|
|
3918
|
+
var measurement = notUndefined(_this.getMeasurements()[index]);
|
|
3799
3919
|
if (align === 'auto') {
|
|
3800
|
-
if (measurement.end >= scrollOffset +
|
|
3920
|
+
if (measurement.end >= _this.scrollOffset + _this.getSize() - _this.options.scrollPaddingEnd) {
|
|
3801
3921
|
align = 'end';
|
|
3802
|
-
} else if (measurement.start <= scrollOffset) {
|
|
3922
|
+
} else if (measurement.start <= _this.scrollOffset + _this.options.scrollPaddingStart) {
|
|
3803
3923
|
align = 'start';
|
|
3804
3924
|
} else {
|
|
3805
|
-
return;
|
|
3925
|
+
return [_this.scrollOffset, align];
|
|
3806
3926
|
}
|
|
3807
3927
|
}
|
|
3808
|
-
|
|
3809
|
-
|
|
3810
|
-
|
|
3811
|
-
|
|
3812
|
-
|
|
3813
|
-
}
|
|
3814
|
-
|
|
3815
|
-
|
|
3816
|
-
|
|
3817
|
-
|
|
3818
|
-
|
|
3819
|
-
|
|
3820
|
-
|
|
3821
|
-
|
|
3822
|
-
|
|
3928
|
+
var toOffset = align === 'end' ? measurement.end + _this.options.scrollPaddingEnd : measurement.start - _this.options.scrollPaddingStart;
|
|
3929
|
+
return [_this.getOffsetForAlignment(toOffset, align), align];
|
|
3930
|
+
};
|
|
3931
|
+
this.isDynamicMode = function () {
|
|
3932
|
+
return _this.measureElementCache.size > 0;
|
|
3933
|
+
};
|
|
3934
|
+
this.cancelScrollToIndex = function () {
|
|
3935
|
+
if (_this.scrollToIndexTimeoutId !== null) {
|
|
3936
|
+
clearTimeout(_this.scrollToIndexTimeoutId);
|
|
3937
|
+
_this.scrollToIndexTimeoutId = null;
|
|
3938
|
+
}
|
|
3939
|
+
};
|
|
3940
|
+
this.scrollToOffset = function (toOffset, _temp) {
|
|
3941
|
+
var _ref5 = _temp === void 0 ? {} : _temp,
|
|
3942
|
+
_ref5$align = _ref5.align,
|
|
3943
|
+
align = _ref5$align === void 0 ? 'start' : _ref5$align,
|
|
3944
|
+
behavior = _ref5.behavior;
|
|
3945
|
+
_this.cancelScrollToIndex();
|
|
3946
|
+
if (behavior === 'smooth' && _this.isDynamicMode()) {
|
|
3947
|
+
console.warn('The `smooth` scroll behavior is not fully supported with dynamic size.');
|
|
3948
|
+
}
|
|
3949
|
+
_this._scrollToOffset(_this.getOffsetForAlignment(toOffset, align), {
|
|
3950
|
+
adjustments: undefined,
|
|
3951
|
+
behavior: behavior
|
|
3823
3952
|
});
|
|
3824
|
-
}, [tryScrollToIndex]);
|
|
3825
|
-
return {
|
|
3826
|
-
virtualItems: virtualItems,
|
|
3827
|
-
totalSize: totalSize,
|
|
3828
|
-
scrollToOffset: scrollToOffset,
|
|
3829
|
-
scrollToIndex: scrollToIndex,
|
|
3830
|
-
measure: measure
|
|
3831
3953
|
};
|
|
3954
|
+
this.scrollToIndex = function (index, _temp2) {
|
|
3955
|
+
var _ref6 = _temp2 === void 0 ? {} : _temp2,
|
|
3956
|
+
_ref6$align = _ref6.align,
|
|
3957
|
+
initialAlign = _ref6$align === void 0 ? 'auto' : _ref6$align,
|
|
3958
|
+
behavior = _ref6.behavior;
|
|
3959
|
+
index = Math.max(0, Math.min(index, _this.options.count - 1));
|
|
3960
|
+
_this.cancelScrollToIndex();
|
|
3961
|
+
if (behavior === 'smooth' && _this.isDynamicMode()) {
|
|
3962
|
+
console.warn('The `smooth` scroll behavior is not fully supported with dynamic size.');
|
|
3963
|
+
}
|
|
3964
|
+
var _this$getOffsetForInd = _this.getOffsetForIndex(index, initialAlign),
|
|
3965
|
+
toOffset = _this$getOffsetForInd[0],
|
|
3966
|
+
align = _this$getOffsetForInd[1];
|
|
3967
|
+
_this._scrollToOffset(toOffset, {
|
|
3968
|
+
adjustments: undefined,
|
|
3969
|
+
behavior: behavior
|
|
3970
|
+
});
|
|
3971
|
+
if (behavior !== 'smooth' && _this.isDynamicMode()) {
|
|
3972
|
+
_this.scrollToIndexTimeoutId = setTimeout(function () {
|
|
3973
|
+
_this.scrollToIndexTimeoutId = null;
|
|
3974
|
+
var elementInDOM = _this.measureElementCache.has(_this.options.getItemKey(index));
|
|
3975
|
+
if (elementInDOM) {
|
|
3976
|
+
var _this$getOffsetForInd2 = _this.getOffsetForIndex(index, align),
|
|
3977
|
+
_toOffset = _this$getOffsetForInd2[0];
|
|
3978
|
+
if (!approxEqual(_toOffset, _this.scrollOffset)) {
|
|
3979
|
+
_this.scrollToIndex(index, {
|
|
3980
|
+
align: align,
|
|
3981
|
+
behavior: behavior
|
|
3982
|
+
});
|
|
3983
|
+
}
|
|
3984
|
+
} else {
|
|
3985
|
+
_this.scrollToIndex(index, {
|
|
3986
|
+
align: align,
|
|
3987
|
+
behavior: behavior
|
|
3988
|
+
});
|
|
3989
|
+
}
|
|
3990
|
+
});
|
|
3991
|
+
}
|
|
3992
|
+
};
|
|
3993
|
+
this.scrollBy = function (delta, _temp3) {
|
|
3994
|
+
var _ref7 = _temp3 === void 0 ? {} : _temp3,
|
|
3995
|
+
behavior = _ref7.behavior;
|
|
3996
|
+
_this.cancelScrollToIndex();
|
|
3997
|
+
if (behavior === 'smooth' && _this.isDynamicMode()) {
|
|
3998
|
+
console.warn('The `smooth` scroll behavior is not fully supported with dynamic size.');
|
|
3999
|
+
}
|
|
4000
|
+
_this._scrollToOffset(_this.scrollOffset + delta, {
|
|
4001
|
+
adjustments: undefined,
|
|
4002
|
+
behavior: behavior
|
|
4003
|
+
});
|
|
4004
|
+
};
|
|
4005
|
+
this.getTotalSize = function () {
|
|
4006
|
+
var _this$getMeasurements;
|
|
4007
|
+
return (((_this$getMeasurements = _this.getMeasurements()[_this.options.count - 1]) == null ? void 0 : _this$getMeasurements.end) || _this.options.paddingStart) - _this.options.scrollMargin + _this.options.paddingEnd;
|
|
4008
|
+
};
|
|
4009
|
+
this._scrollToOffset = function (offset, _ref8) {
|
|
4010
|
+
var adjustments = _ref8.adjustments,
|
|
4011
|
+
behavior = _ref8.behavior;
|
|
4012
|
+
_this.options.scrollToFn(offset, {
|
|
4013
|
+
behavior: behavior,
|
|
4014
|
+
adjustments: adjustments
|
|
4015
|
+
}, _this);
|
|
4016
|
+
};
|
|
4017
|
+
this.measure = function () {
|
|
4018
|
+
_this.itemSizeCache = new Map();
|
|
4019
|
+
_this.notify(false);
|
|
4020
|
+
};
|
|
4021
|
+
this.setOptions(_opts);
|
|
4022
|
+
this.scrollRect = this.options.initialRect;
|
|
4023
|
+
this.scrollOffset = this.options.initialOffset;
|
|
4024
|
+
this.measurementsCache = this.options.initialMeasurementsCache;
|
|
4025
|
+
this.measurementsCache.forEach(function (item) {
|
|
4026
|
+
_this.itemSizeCache.set(item.key, item.size);
|
|
4027
|
+
});
|
|
4028
|
+
this.maybeNotify();
|
|
3832
4029
|
};
|
|
3833
|
-
|
|
3834
4030
|
var findNearestBinarySearch = function findNearestBinarySearch(low, high, getCurrentValue, value) {
|
|
3835
4031
|
while (low <= high) {
|
|
3836
4032
|
var middle = (low + high) / 2 | 0;
|
|
3837
4033
|
var currentValue = getCurrentValue(middle);
|
|
3838
|
-
|
|
3839
4034
|
if (currentValue < value) {
|
|
3840
4035
|
low = middle + 1;
|
|
3841
4036
|
} else if (currentValue > value) {
|
|
@@ -3844,37 +4039,80 @@ var findNearestBinarySearch = function findNearestBinarySearch(low, high, getCur
|
|
|
3844
4039
|
return middle;
|
|
3845
4040
|
}
|
|
3846
4041
|
}
|
|
3847
|
-
|
|
3848
4042
|
if (low > 0) {
|
|
3849
4043
|
return low - 1;
|
|
3850
4044
|
} else {
|
|
3851
4045
|
return 0;
|
|
3852
4046
|
}
|
|
3853
4047
|
};
|
|
3854
|
-
|
|
3855
|
-
|
|
3856
|
-
|
|
3857
|
-
|
|
3858
|
-
|
|
3859
|
-
var size = measurements.length - 1;
|
|
3860
|
-
|
|
4048
|
+
function calculateRange(_ref9) {
|
|
4049
|
+
var measurements = _ref9.measurements,
|
|
4050
|
+
outerSize = _ref9.outerSize,
|
|
4051
|
+
scrollOffset = _ref9.scrollOffset;
|
|
4052
|
+
var count = measurements.length - 1;
|
|
3861
4053
|
var getOffset = function getOffset(index) {
|
|
3862
4054
|
return measurements[index].start;
|
|
3863
4055
|
};
|
|
3864
|
-
|
|
3865
|
-
var
|
|
3866
|
-
|
|
3867
|
-
|
|
3868
|
-
while (end < size && measurements[end].end < scrollOffset + outerSize) {
|
|
3869
|
-
end++;
|
|
4056
|
+
var startIndex = findNearestBinarySearch(0, count, getOffset, scrollOffset);
|
|
4057
|
+
var endIndex = startIndex;
|
|
4058
|
+
while (endIndex < count && measurements[endIndex].end < scrollOffset + outerSize) {
|
|
4059
|
+
endIndex++;
|
|
3870
4060
|
}
|
|
3871
|
-
|
|
3872
4061
|
return {
|
|
3873
|
-
|
|
3874
|
-
|
|
4062
|
+
startIndex: startIndex,
|
|
4063
|
+
endIndex: endIndex
|
|
3875
4064
|
};
|
|
3876
4065
|
}
|
|
3877
4066
|
|
|
4067
|
+
/**
|
|
4068
|
+
* react-virtual
|
|
4069
|
+
*
|
|
4070
|
+
* Copyright (c) TanStack
|
|
4071
|
+
*
|
|
4072
|
+
* This source code is licensed under the MIT license found in the
|
|
4073
|
+
* LICENSE.md file in the root directory of this source tree.
|
|
4074
|
+
*
|
|
4075
|
+
* @license MIT
|
|
4076
|
+
*/
|
|
4077
|
+
|
|
4078
|
+
//
|
|
4079
|
+
|
|
4080
|
+
var useIsomorphicLayoutEffect$1 = typeof document !== 'undefined' ? React__namespace.useLayoutEffect : React__namespace.useEffect;
|
|
4081
|
+
function useVirtualizerBase(options) {
|
|
4082
|
+
var rerender = React__namespace.useReducer(function () {
|
|
4083
|
+
return {};
|
|
4084
|
+
}, {})[1];
|
|
4085
|
+
var resolvedOptions = _extends$1({}, options, {
|
|
4086
|
+
onChange: function onChange(instance, sync) {
|
|
4087
|
+
if (sync) {
|
|
4088
|
+
reactDom.flushSync(rerender);
|
|
4089
|
+
} else {
|
|
4090
|
+
rerender();
|
|
4091
|
+
}
|
|
4092
|
+
options.onChange == null ? void 0 : options.onChange(instance, sync);
|
|
4093
|
+
}
|
|
4094
|
+
});
|
|
4095
|
+
var _React$useState = React__namespace.useState(function () {
|
|
4096
|
+
return new Virtualizer(resolvedOptions);
|
|
4097
|
+
}),
|
|
4098
|
+
instance = _React$useState[0];
|
|
4099
|
+
instance.setOptions(resolvedOptions);
|
|
4100
|
+
React__namespace.useEffect(function () {
|
|
4101
|
+
return instance._didMount();
|
|
4102
|
+
}, []);
|
|
4103
|
+
useIsomorphicLayoutEffect$1(function () {
|
|
4104
|
+
return instance._willUpdate();
|
|
4105
|
+
});
|
|
4106
|
+
return instance;
|
|
4107
|
+
}
|
|
4108
|
+
function useVirtualizer(options) {
|
|
4109
|
+
return useVirtualizerBase(_extends$1({
|
|
4110
|
+
observeElementRect: observeElementRect,
|
|
4111
|
+
observeElementOffset: observeElementOffset,
|
|
4112
|
+
scrollToFn: elementScroll
|
|
4113
|
+
}, options));
|
|
4114
|
+
}
|
|
4115
|
+
|
|
3878
4116
|
/**
|
|
3879
4117
|
* Custom hook for implementing infinite scrolling in a table.
|
|
3880
4118
|
*
|
|
@@ -3892,7 +4130,6 @@ function calculateRange(_ref4) {
|
|
|
3892
4130
|
* });
|
|
3893
4131
|
*/
|
|
3894
4132
|
const useInfiniteScroll = (props) => {
|
|
3895
|
-
var _a, _b;
|
|
3896
4133
|
//called on scroll and possibly on mount to fetch more data as the user scrolls and reaches bottom of table
|
|
3897
4134
|
const fetchMoreOnBottomReached = React.useCallback((containerRefElement) => {
|
|
3898
4135
|
var _a;
|
|
@@ -3906,21 +4143,23 @@ const useInfiniteScroll = (props) => {
|
|
|
3906
4143
|
}
|
|
3907
4144
|
}
|
|
3908
4145
|
}, [props.pagination]);
|
|
3909
|
-
|
|
3910
|
-
|
|
3911
|
-
|
|
3912
|
-
|
|
4146
|
+
const rowVirtualizer = useVirtualizer({
|
|
4147
|
+
count: props.rowSize,
|
|
4148
|
+
getScrollElement: () => props.containerRef.current,
|
|
4149
|
+
estimateSize: React.useCallback((i) => props.rowHeight, [props.rowHeight]),
|
|
3913
4150
|
overscan: 10,
|
|
3914
4151
|
});
|
|
3915
|
-
|
|
3916
|
-
|
|
3917
|
-
|
|
4152
|
+
React.useEffect(() => {
|
|
4153
|
+
// this ensures the cache is cleared if the rowHeight changes
|
|
4154
|
+
if (props.rowHeight) {
|
|
4155
|
+
rowVirtualizer.measure();
|
|
4156
|
+
}
|
|
4157
|
+
}, [props.rowHeight, rowVirtualizer]);
|
|
4158
|
+
const { getVirtualItems, getTotalSize } = rowVirtualizer;
|
|
3918
4159
|
return {
|
|
3919
|
-
paddingTop,
|
|
3920
|
-
paddingBottom,
|
|
3921
4160
|
fetchMoreOnBottomReached,
|
|
3922
|
-
|
|
3923
|
-
|
|
4161
|
+
getTotalSize,
|
|
4162
|
+
getVirtualItems,
|
|
3924
4163
|
};
|
|
3925
4164
|
};
|
|
3926
4165
|
|
|
@@ -3931,19 +4170,23 @@ const useInfiniteScroll = (props) => {
|
|
|
3931
4170
|
* @returns {JSX.Element} Table component
|
|
3932
4171
|
*/
|
|
3933
4172
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
3934
|
-
const Table = (
|
|
3935
|
-
var
|
|
4173
|
+
const Table = (_a) => {
|
|
4174
|
+
var _b, _c;
|
|
4175
|
+
var { rowHeight = 75 } = _a, props = __rest(_a, ["rowHeight"]);
|
|
3936
4176
|
//we need a reference to the scrolling element for logic down below
|
|
3937
4177
|
const tableContainerRef = React.useRef(null);
|
|
3938
4178
|
const [t] = useTranslation();
|
|
3939
|
-
const { fetchMoreOnBottomReached,
|
|
4179
|
+
const { fetchMoreOnBottomReached, getVirtualItems, getTotalSize } = useInfiniteScroll({
|
|
3940
4180
|
pagination: props.pagination,
|
|
3941
4181
|
containerRef: tableContainerRef,
|
|
3942
4182
|
rowSize: props.getRowModel().rows.length || 0,
|
|
4183
|
+
rowHeight,
|
|
3943
4184
|
});
|
|
3944
4185
|
const hasResults = props.getRowModel().rows.length > 0;
|
|
3945
|
-
return (jsxRuntime.jsxs(reactComponents.Card, { className: `flex flex-col overflow-hidden ${props.className || ""}`, dataTestId: props.dataTestId, children: [(props.headerLeftActions || props.headerRightActions) && (jsxRuntime.jsxs("div", { className: "z-default flex justify-between gap-2 p-2", children: [jsxRuntime.jsx("div", { className: "flex", children: props.headerLeftActions }), jsxRuntime.jsx("div", { className: "flex", children: props.headerRightActions })] })), jsxRuntime.jsx("div", { className: "min-h[500px] h-full overflow-x-auto overflow-y-scroll border-b border-t border-gray-300", onScroll: e => fetchMoreOnBottomReached(e.target),
|
|
3946
|
-
|
|
4186
|
+
return (jsxRuntime.jsxs(reactComponents.Card, { className: `flex flex-col overflow-hidden ${props.className || ""}`, dataTestId: props.dataTestId, children: [(props.headerLeftActions || props.headerRightActions) && (jsxRuntime.jsxs("div", { className: "z-default flex justify-between gap-2 p-2", children: [jsxRuntime.jsx("div", { className: "flex", children: props.headerLeftActions }), jsxRuntime.jsx("div", { className: "flex", children: props.headerRightActions })] })), jsxRuntime.jsx("div", { className: "min-h[500px] h-full overflow-x-auto overflow-y-scroll border-b border-t border-gray-300", ref: tableContainerRef, onScroll: e => fetchMoreOnBottomReached(e.target), children: jsxRuntime.jsxs(reactTableBaseComponents.TableRoot, { style: {
|
|
4187
|
+
height: getTotalSize(),
|
|
4188
|
+
width: "100%",
|
|
4189
|
+
position: "relative",
|
|
3947
4190
|
}, children: [jsxRuntime.jsx(reactTableBaseComponents.Thead, { className: "z-default", children: props.getHeaderGroups().map(headerGroup => (jsxRuntime.jsx(reactTableBaseComponents.Tr, { className: "flex", children: headerGroup.headers.map(header => {
|
|
3948
4191
|
var _a, _b, _c, _d;
|
|
3949
4192
|
return (jsxRuntime.jsxs(reactTableBaseComponents.Th, { style: {
|
|
@@ -3952,25 +4195,28 @@ const Table = (props) => {
|
|
|
3952
4195
|
maxWidth: header.column.columnDef.maxSize,
|
|
3953
4196
|
}, className: "relative", children: [header.isPlaceholder ? null : (jsxRuntime.jsxs("div", { className: `${header.column.getCanSort() ? "cursor-pointer select-none" : ""} flex items-center gap-2 py-2 overflow-hidden pr-3`,
|
|
3954
4197
|
onClick: header.column.getToggleSortingHandler(), children: [jsxRuntime.jsxs("span", { className: "overflow-hidden text-ellipsis whitespace-nowrap", children: [flexRender(header.column.columnDef.header, header.getContext()), ((_b = (_a = header.column.columnDef) === null || _a === void 0 ? void 0 : _a.meta) === null || _b === void 0 ? void 0 : _b.subHeader) ? (jsxRuntime.jsx(reactComponents.Text, { size: "small", subtle: true, children: (_d = (_c = header.column.columnDef) === null || _c === void 0 ? void 0 : _c.meta) === null || _d === void 0 ? void 0 : _d.subHeader })) : null] }), header.column.getCanSort() ? (jsxRuntime.jsx(reactTableBaseComponents.SortIndicator, { sortingState: header.column.getIsSorted() })) : null] })), header.column.getCanResize() ? (jsxRuntime.jsx(reactTableBaseComponents.ResizeHandle, { isResizing: header.column.getIsResizing(), onMouseDown: header.getResizeHandler(), onTouchStart: header.getResizeHandler() })) : null] }, header.id));
|
|
3955
|
-
}) }, headerGroup.id))) }), hasResults ? (jsxRuntime.
|
|
3956
|
-
|
|
3957
|
-
|
|
3958
|
-
|
|
3959
|
-
|
|
3960
|
-
|
|
3961
|
-
|
|
3962
|
-
|
|
3963
|
-
|
|
3964
|
-
|
|
3965
|
-
|
|
3966
|
-
|
|
3967
|
-
|
|
3968
|
-
|
|
3969
|
-
|
|
3970
|
-
|
|
4198
|
+
}) }, headerGroup.id))) }), hasResults ? (jsxRuntime.jsx(reactTableBaseComponents.Tbody, { className: "text-sm font-normal", children: getVirtualItems().map((virtualRow, index) => {
|
|
4199
|
+
const row = props.getRowModel().rows[virtualRow.index];
|
|
4200
|
+
if (!row) {
|
|
4201
|
+
return null;
|
|
4202
|
+
}
|
|
4203
|
+
else {
|
|
4204
|
+
return (jsxRuntime.jsx(reactTableBaseComponents.Tr, { layout: "flex", style: {
|
|
4205
|
+
height: `${virtualRow.size}px`,
|
|
4206
|
+
transform: `translateY(${virtualRow.start - index * virtualRow.size}px)`,
|
|
4207
|
+
}, onClick: () => (props.onRowClick ? props.onRowClick(row) : row.getToggleSelectedHandler()), className: `${(props.onRowClick || row.getCanSelect()) && "cursor-pointer"} hover:bg-neutral-100`, dataTestId: `table-body-row-${virtualRow.index}`, children: row === null || row === void 0 ? void 0 : row.getVisibleCells().map(cell => {
|
|
4208
|
+
return (jsxRuntime.jsx(reactTableBaseComponents.Td, { key: cell.id,
|
|
4209
|
+
style: {
|
|
4210
|
+
width: cell.column.getSize(),
|
|
4211
|
+
minWidth: cell.column.columnDef.minSize,
|
|
4212
|
+
maxWidth: cell.column.columnDef.maxSize,
|
|
4213
|
+
}, children: jsxRuntime.jsx("div", { className: "grid h-full items-center", children: flexRender(cell.column.columnDef.cell, cell.getContext()) }) }));
|
|
4214
|
+
}) }, row.id));
|
|
4215
|
+
}
|
|
4216
|
+
}) })) : (jsxRuntime.jsx("tbody", { children: jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { className: "b-0", children: (props === null || props === void 0 ? void 0 : props.noDataMessage) ? (props.noDataMessage) : (jsxRuntime.jsx(reactComponents.EmptyState, { image: "ROAD_BLOCK", description: t("table.noResults"), className: "absolute inset-0", loading: props === null || props === void 0 ? void 0 : props.loading })) }) }) }))] }) }), jsxRuntime.jsxs("div", { className: "flex items-center p-2", children: [jsxRuntime.jsx("div", { className: "whitespace-nowrap text-xs font-medium text-neutral-600", children: t("table.pagination.full", {
|
|
3971
4217
|
count: props.getRowModel().rows.length,
|
|
3972
|
-
total: ((
|
|
3973
|
-
}) }), props.footerRightActions && jsxRuntime.jsx("div", { className: "flex flex-1 justify-end", children: props.footerRightActions })] })] }));
|
|
4218
|
+
total: ((_c = (_b = props.pagination) === null || _b === void 0 ? void 0 : _b.pageInfo) === null || _c === void 0 ? void 0 : _c.count) || 0,
|
|
4219
|
+
}) }), props.pagination.isLoading ? (jsxRuntime.jsx("span", { className: "ml-2", children: jsxRuntime.jsx(reactComponents.Spinner, { size: "small" }) })) : null, props.footerRightActions && jsxRuntime.jsx("div", { className: "flex flex-1 justify-end", children: props.footerRightActions })] })] }));
|
|
3974
4220
|
};
|
|
3975
4221
|
|
|
3976
4222
|
function getDefaultExportFromCjs (x) {
|