material-react-table 2.0.0-beta.5 → 2.0.0-beta.7
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.js +533 -538
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/material-react-table.esm.js +534 -539
- package/dist/esm/material-react-table.esm.js.map +1 -1
- package/dist/index.d.ts +18 -17
- package/locales/ar/index.d.ts +1 -1
- package/locales/ar/index.esm.d.ts +1 -1
- package/locales/ar/package.json +9 -1
- package/locales/az/index.d.ts +1 -1
- package/locales/az/index.esm.d.ts +1 -1
- package/locales/az/package.json +9 -1
- package/locales/bg/index.d.ts +1 -1
- package/locales/bg/index.esm.d.ts +1 -1
- package/locales/bg/package.json +9 -1
- package/locales/cs/index.d.ts +1 -1
- package/locales/cs/index.esm.d.ts +1 -1
- package/locales/cs/package.json +9 -1
- package/locales/da/index.d.ts +1 -1
- package/locales/da/index.esm.d.ts +1 -1
- package/locales/da/package.json +9 -1
- package/locales/de/index.d.ts +1 -1
- package/locales/de/index.esm.d.ts +1 -1
- package/locales/de/package.json +9 -1
- package/locales/en/index.d.ts +1 -1
- package/locales/en/index.esm.d.ts +1 -1
- package/locales/en/package.json +9 -1
- package/locales/es/index.d.ts +1 -1
- package/locales/es/index.esm.d.ts +1 -1
- package/locales/es/package.json +9 -1
- package/locales/et/index.d.ts +1 -1
- package/locales/et/index.esm.d.ts +1 -1
- package/locales/et/package.json +9 -1
- package/locales/fa/index.d.ts +1 -1
- package/locales/fa/index.esm.d.ts +1 -1
- package/locales/fa/package.json +9 -1
- package/locales/fi/index.d.ts +1 -1
- package/locales/fi/index.esm.d.ts +1 -1
- package/locales/fi/package.json +9 -1
- package/locales/fr/index.d.ts +1 -1
- package/locales/fr/index.esm.d.ts +1 -1
- package/locales/fr/package.json +9 -1
- package/locales/hu/index.d.ts +1 -1
- package/locales/hu/index.esm.d.ts +1 -1
- package/locales/hu/package.json +9 -1
- package/locales/hy/index.d.ts +1 -1
- package/locales/hy/index.esm.d.ts +1 -1
- package/locales/hy/package.json +9 -1
- package/locales/id/index.d.ts +1 -1
- package/locales/id/index.esm.d.ts +1 -1
- package/locales/id/package.json +9 -1
- package/locales/it/index.d.ts +1 -1
- package/locales/it/index.esm.d.ts +1 -1
- package/locales/it/package.json +9 -1
- package/locales/ja/index.d.ts +1 -1
- package/locales/ja/index.esm.d.ts +1 -1
- package/locales/ja/package.json +9 -1
- package/locales/ko/index.d.ts +1 -1
- package/locales/ko/index.esm.d.ts +1 -1
- package/locales/ko/package.json +9 -1
- package/locales/nl/index.d.ts +1 -1
- package/locales/nl/index.esm.d.ts +1 -1
- package/locales/nl/package.json +9 -1
- package/locales/no/index.d.ts +1 -1
- package/locales/no/index.esm.d.ts +1 -1
- package/locales/no/package.json +9 -1
- package/locales/np/index.d.ts +1 -1
- package/locales/np/index.esm.d.ts +1 -1
- package/locales/np/package.json +9 -1
- package/locales/pl/index.d.ts +1 -1
- package/locales/pl/index.esm.d.ts +1 -1
- package/locales/pl/package.json +9 -1
- package/locales/pt/index.d.ts +1 -1
- package/locales/pt/index.esm.d.ts +1 -1
- package/locales/pt/package.json +9 -1
- package/locales/pt-BR/index.d.ts +1 -1
- package/locales/pt-BR/index.esm.d.ts +1 -1
- package/locales/pt-BR/package.json +9 -1
- package/locales/ro/index.d.ts +1 -1
- package/locales/ro/index.esm.d.ts +1 -1
- package/locales/ro/package.json +9 -1
- package/locales/ru/index.d.ts +1 -1
- package/locales/ru/index.esm.d.ts +1 -1
- package/locales/ru/package.json +9 -1
- package/locales/sk/index.d.ts +1 -1
- package/locales/sk/index.esm.d.ts +1 -1
- package/locales/sk/package.json +9 -1
- package/locales/sr-Cyrl-RS/index.d.ts +1 -1
- package/locales/sr-Cyrl-RS/index.esm.d.ts +1 -1
- package/locales/sr-Cyrl-RS/package.json +9 -1
- package/locales/sr-Latn-RS/index.d.ts +1 -1
- package/locales/sr-Latn-RS/index.esm.d.ts +1 -1
- package/locales/sr-Latn-RS/package.json +9 -1
- package/locales/sv/index.d.ts +1 -1
- package/locales/sv/index.esm.d.ts +1 -1
- package/locales/sv/package.json +9 -1
- package/locales/tr/index.d.ts +1 -1
- package/locales/tr/index.esm.d.ts +1 -1
- package/locales/tr/package.json +9 -1
- package/locales/uk/index.d.ts +1 -1
- package/locales/uk/index.esm.d.ts +1 -1
- package/locales/uk/package.json +9 -1
- package/locales/vi/index.d.ts +1 -1
- package/locales/vi/index.esm.d.ts +1 -1
- package/locales/vi/package.json +9 -1
- package/locales/zh-Hans/index.d.ts +1 -1
- package/locales/zh-Hans/index.esm.d.ts +1 -1
- package/locales/zh-Hans/package.json +9 -1
- package/locales/zh-Hant/index.d.ts +1 -1
- package/locales/zh-Hant/index.esm.d.ts +1 -1
- package/locales/zh-Hant/package.json +9 -1
- package/package.json +1 -1
- package/src/body/MRT_TableBodyCell.tsx +2 -2
- package/src/body/MRT_TableBodyRow.tsx +3 -1
- package/src/column.utils.ts +4 -4
- package/src/head/MRT_TableHeadCellResizeHandle.tsx +1 -1
- package/src/hooks/useMRT_DisplayColumns.tsx +9 -7
- package/src/hooks/useMRT_TableOptions.ts +2 -2
- package/src/inputs/MRT_EditCellTextField.tsx +0 -4
- package/src/menus/MRT_ShowHideColumnsMenuItems.tsx +2 -0
- package/src/modals/MRT_EditRowModal.tsx +6 -6
- package/src/style.utils.ts +1 -1
- package/src/table/MRT_TablePaper.tsx +2 -0
- package/src/types.ts +17 -13
package/dist/cjs/index.js
CHANGED
@@ -293,15 +293,15 @@ const createRow = (table, originalRow) => reactTable.createRow(table, 'mrt-row-c
|
|
293
293
|
[getColumnId(col)]: '',
|
294
294
|
}))), -1, 0);
|
295
295
|
const extraIndexRangeExtractor = (range, draggingIndex) => {
|
296
|
-
const
|
296
|
+
const newIndexes = reactVirtual.defaultRangeExtractor(range);
|
297
297
|
if (draggingIndex >= 0 &&
|
298
298
|
draggingIndex < Math.max(range.startIndex - range.overscan, 0)) {
|
299
|
-
|
299
|
+
newIndexes.unshift(draggingIndex);
|
300
300
|
}
|
301
301
|
if (draggingIndex >= 0 && draggingIndex > range.endIndex + range.overscan) {
|
302
|
-
|
302
|
+
newIndexes.push(draggingIndex);
|
303
303
|
}
|
304
|
-
return
|
304
|
+
return newIndexes;
|
305
305
|
};
|
306
306
|
function createMRTColumnHelper() {
|
307
307
|
return {
|
@@ -320,7 +320,7 @@ const getMRTTheme = (table, theme) => (Object.assign({ baseBackgroundColor: them
|
|
320
320
|
? styles.lighten(theme.palette.background.default, 0.05)
|
321
321
|
: theme.palette.background.default, draggingBorderColor: theme.palette.primary.main, matchHighlightColor: theme.palette.mode === 'dark'
|
322
322
|
? styles.darken(theme.palette.warning.dark, 0.25)
|
323
|
-
: styles.lighten(theme.palette.warning.light, 0.5), pinnedRowBackgroundColor: styles.alpha(theme.palette.primary.main, 0.1), selectedRowBackgroundColor: styles.alpha(theme.palette.primary.main, 0.2) }, table.options.mrtTheme));
|
323
|
+
: styles.lighten(theme.palette.warning.light, 0.5), pinnedRowBackgroundColor: styles.alpha(theme.palette.primary.main, 0.1), selectedRowBackgroundColor: styles.alpha(theme.palette.primary.main, 0.2) }, parseFromValuesOrFunc(table.options.mrtTheme, theme)));
|
324
324
|
const getCommonMRTCellStyles = ({ column, header, table, tableCellProps, theme, }) => {
|
325
325
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
326
326
|
const { options: { layoutMode }, } = table;
|
@@ -512,7 +512,7 @@ const MRT_CopyButton = (_a) => {
|
|
512
512
|
};
|
513
513
|
|
514
514
|
const MRT_EditCellTextField = (_a) => {
|
515
|
-
var _b, _c, _d
|
515
|
+
var _b, _c, _d;
|
516
516
|
var { cell, table } = _a, rest = __rest(_a, ["cell", "table"]);
|
517
517
|
const { getState, options: { createDisplayMode, editDisplayMode, muiEditTextFieldProps }, refs: { editInputRefs }, setCreatingRow, setEditingCell, setEditingRow, } = table;
|
518
518
|
const { column, row } = cell;
|
@@ -581,11 +581,11 @@ const MRT_EditCellTextField = (_a) => {
|
|
581
581
|
: undefined, select: isSelectEdit, size: "small", value: value, variant: "standard" }, textFieldProps, { InputProps: Object.assign(Object.assign({ disableUnderline: editDisplayMode === 'table' }, textFieldProps.InputProps), { sx: (theme) => {
|
582
582
|
var _a;
|
583
583
|
return (Object.assign({ mb: 0 }, parseFromValuesOrFunc((_a = textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.InputProps) === null || _a === void 0 ? void 0 : _a.sx, theme)));
|
584
|
-
} }), inputProps: Object.assign({ autoComplete: 'new-password'
|
584
|
+
} }), inputProps: Object.assign({ autoComplete: 'new-password' }, textFieldProps.inputProps), onBlur: handleBlur, onChange: handleChange, onClick: (e) => {
|
585
585
|
var _a;
|
586
586
|
e.stopPropagation();
|
587
587
|
(_a = textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.onClick) === null || _a === void 0 ? void 0 : _a.call(textFieldProps, e);
|
588
|
-
}, onKeyDown: handleEnterKeyDown, children: (
|
588
|
+
}, onKeyDown: handleEnterKeyDown, children: (_c = textFieldProps.children) !== null && _c !== void 0 ? _c : (_d = columnDef === null || columnDef === void 0 ? void 0 : columnDef.editSelectOptions) === null || _d === void 0 ? void 0 : _d.map((option) => {
|
589
589
|
let value;
|
590
590
|
let text;
|
591
591
|
if (typeof option !== 'object') {
|
@@ -734,14 +734,14 @@ const MRT_TableBodyCell = (_a) => {
|
|
734
734
|
: '1rem'
|
735
735
|
: columnDefType === 'display'
|
736
736
|
? '1rem 1.25rem'
|
737
|
-
: '1.5rem', pl: column.id === 'mrt-row-expand'
|
737
|
+
: '1.5rem', textOverflow: columnDefType !== 'display' ? 'ellipsis' : undefined, [theme.direction === 'rtl' ? 'pr' : 'pl']: column.id === 'mrt-row-expand'
|
738
738
|
? `${row.depth +
|
739
739
|
(density === 'compact'
|
740
740
|
? 0.5
|
741
741
|
: density === 'comfortable'
|
742
742
|
? 0.75
|
743
743
|
: 1.25)}rem`
|
744
|
-
: undefined,
|
744
|
+
: undefined, whiteSpace: row.getIsPinned() || density === 'compact' ? 'nowrap' : 'normal', zIndex: (draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.id) === column.id ? 2 : column.getIsPinned() ? 1 : 0 }, getCommonMRTCellStyles({
|
745
745
|
column,
|
746
746
|
table,
|
747
747
|
tableCellProps,
|
@@ -826,7 +826,7 @@ const MRT_TableBodyRow = ({ columnVirtualizer, measureElement, numRows, pinnedRo
|
|
826
826
|
};
|
827
827
|
const rowRef = react.useRef(null);
|
828
828
|
const { baseBackgroundColor, pinnedRowBackgroundColor, selectedRowBackgroundColor, } = getMRTTheme(table, theme);
|
829
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(TableRow, Object.assign({ "data-index": virtualRow === null || virtualRow === void 0 ? void 0 : virtualRow.index, onDragEnter: handleDragEnter, ref: (node) => {
|
829
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(TableRow, Object.assign({ "data-index": virtualRow === null || virtualRow === void 0 ? void 0 : virtualRow.index, "data-pinned": !!isPinned || undefined, "data-selected": row.getIsSelected() || undefined, onDragEnter: handleDragEnter, ref: (node) => {
|
830
830
|
if (node) {
|
831
831
|
rowRef.current = node;
|
832
832
|
measureElement === null || measureElement === void 0 ? void 0 : measureElement(node);
|
@@ -1934,7 +1934,7 @@ const MRT_TableHeadCellResizeHandle = (_a) => {
|
|
1934
1934
|
: '-28px',
|
1935
1935
|
position: 'absolute',
|
1936
1936
|
px: '4px',
|
1937
|
-
right: '0',
|
1937
|
+
right: column.columnDef.columnDefType === 'display' ? '4px' : '0',
|
1938
1938
|
}), children: jsxRuntime.jsx(Divider, { className: "Mui-TableHeadCell-ResizeHandle-Divider", flexItem: true, orientation: "vertical", sx: (theme) => (Object.assign({ borderRadius: '2px', borderWidth: '2px', height: '24px', touchAction: 'none', transition: column.getIsResizing()
|
1939
1939
|
? undefined
|
1940
1940
|
: 'all 150ms ease-in-out', userSelect: 'none', zIndex: 4 }, parseFromValuesOrFunc(rest === null || rest === void 0 ? void 0 : rest.sx, theme))) }) }));
|
@@ -2423,6 +2423,8 @@ const MRT_ShowHideColumnsMenuItems = (_a) => {
|
|
2423
2423
|
setHoveredColumn(column);
|
2424
2424
|
}
|
2425
2425
|
};
|
2426
|
+
if (!columnDef.header)
|
2427
|
+
return null;
|
2426
2428
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(MenuItem, Object.assign({ disableRipple: true, onDragEnter: handleDragEnter, ref: menuItemRef }, rest, { sx: (theme) => (Object.assign({ alignItems: 'center', justifyContent: 'flex-start', my: 0, opacity: isDragging ? 0.5 : 1, outline: isDragging
|
2427
2429
|
? `2px dashed ${theme.palette.grey[500]}`
|
2428
2430
|
: (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === column.id
|
@@ -2760,10 +2762,10 @@ const MRT_EditActionButtons = (_a) => {
|
|
2760
2762
|
const MRT_EditRowModal = (_a) => {
|
2761
2763
|
var _b;
|
2762
2764
|
var { open, table } = _a, rest = __rest(_a, ["open", "table"]);
|
2763
|
-
const { getState, options: { localization, muiCreateRowModalProps,
|
2765
|
+
const { getState, options: { localization, muiCreateRowModalProps, muiEditRowDialogProps, onCreatingRowCancel, onEditingRowCancel, renderCreateRowDialogContent, renderEditRowDialogContent, }, setCreatingRow, setEditingRow, } = table;
|
2764
2766
|
const { creatingRow, editingRow } = getState();
|
2765
2767
|
const row = (creatingRow !== null && creatingRow !== void 0 ? creatingRow : editingRow);
|
2766
|
-
const dialogProps = Object.assign(Object.assign(Object.assign({}, parseFromValuesOrFunc(
|
2768
|
+
const dialogProps = Object.assign(Object.assign(Object.assign({}, parseFromValuesOrFunc(muiEditRowDialogProps, { row, table })), (creatingRow &&
|
2767
2769
|
parseFromValuesOrFunc(muiCreateRowModalProps, { row, table }))), rest);
|
2768
2770
|
const internalEditComponents = row
|
2769
2771
|
.getAllCells()
|
@@ -2782,12 +2784,12 @@ const MRT_EditRowModal = (_a) => {
|
|
2782
2784
|
row._valuesCache = {}; //reset values cache
|
2783
2785
|
(_a = dialogProps.onClose) === null || _a === void 0 ? void 0 : _a.call(dialogProps, event, reason);
|
2784
2786
|
}, open: open }, dialogProps, { children: (_b = ((creatingRow &&
|
2785
|
-
(
|
2787
|
+
(renderCreateRowDialogContent === null || renderCreateRowDialogContent === void 0 ? void 0 : renderCreateRowDialogContent({
|
2786
2788
|
internalEditComponents,
|
2787
2789
|
row,
|
2788
2790
|
table,
|
2789
2791
|
}))) ||
|
2790
|
-
(
|
2792
|
+
(renderEditRowDialogContent === null || renderEditRowDialogContent === void 0 ? void 0 : renderEditRowDialogContent({
|
2791
2793
|
internalEditComponents,
|
2792
2794
|
row,
|
2793
2795
|
table,
|
@@ -2862,7 +2864,7 @@ const MRT_TablePaper = (_a) => {
|
|
2862
2864
|
width: '100vw',
|
2863
2865
|
zIndex: 999,
|
2864
2866
|
}
|
2865
|
-
: {})), tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.style), sx: (theme) => (Object.assign({ overflow: 'hidden', transition: 'all 100ms ease-in-out' }, parseFromValuesOrFunc(tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.sx, theme))), children: [enableTopToolbar &&
|
2867
|
+
: {})), tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.style), sx: (theme) => (Object.assign({ backgroundColor: getMRTTheme(table, theme).baseBackgroundColor, overflow: 'hidden', transition: 'all 100ms ease-in-out' }, parseFromValuesOrFunc(tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.sx, theme))), children: [enableTopToolbar &&
|
2866
2868
|
((_b = parseFromValuesOrFunc(renderTopToolbar, { table })) !== null && _b !== void 0 ? _b : (jsxRuntime.jsx(MRT_TopToolbar, { table: table }))), jsxRuntime.jsx(MRT_TableContainer, { table: table }), enableBottomToolbar &&
|
2867
2869
|
((_c = parseFromValuesOrFunc(renderBottomToolbar, { table })) !== null && _c !== void 0 ? _c : (jsxRuntime.jsx(MRT_BottomToolbar, { table: table })))] })));
|
2868
2870
|
};
|
@@ -2988,533 +2990,225 @@ const MRT_ToggleRowActionMenuButton = (_a) => {
|
|
2988
2990
|
['modal', 'row'].includes(editDisplayMode) ? (jsxRuntime.jsx(Tooltip, { arrow: true, placement: "right", title: localization.edit, children: jsxRuntime.jsx(IconButton, Object.assign({ "aria-label": localization.edit, onClick: handleStartEditMode, sx: commonIconButtonStyles }, rest, { children: jsxRuntime.jsx(EditIcon, {}) })) })) : renderRowActionMenuItems ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Tooltip, { arrow: true, enterDelay: 1000, enterNextDelay: 1000, title: localization.rowActions, children: jsxRuntime.jsx(IconButton, Object.assign({ "aria-label": localization.rowActions, onClick: handleOpenRowActionMenu, size: "small", sx: commonIconButtonStyles }, rest, { children: jsxRuntime.jsx(MoreHorizIcon, {}) })) }), jsxRuntime.jsx(MRT_RowActionMenu, { anchorEl: anchorEl, handleEdit: handleStartEditMode, row: row, setAnchorEl: setAnchorEl, table: table })] })) : null }));
|
2989
2991
|
};
|
2990
2992
|
|
2991
|
-
const
|
2992
|
-
|
2993
|
-
|
2994
|
-
|
2995
|
-
|
2996
|
-
|
2997
|
-
|
2998
|
-
|
2999
|
-
};
|
3000
|
-
const useMRT_DisplayColumns = ({ columnOrder, creatingRow, grouping, tableOptions, }) => {
|
3001
|
-
var _a, _b;
|
3002
|
-
return react.useMemo(() => {
|
3003
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
3004
|
-
return [
|
3005
|
-
((_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnOrder) !== null && _b !== void 0 ? _b : columnOrder).includes('mrt-row-pin') && Object.assign(Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_TableBodyRowPinButton, { row: row, table: table })), header: tableOptions.localization.pin, size: 60 }, tableOptions.defaultDisplayColumn), (_c = tableOptions.displayColumnDefOptions) === null || _c === void 0 ? void 0 : _c['mrt-row-pin']), { id: 'mrt-row-pin' }),
|
3006
|
-
((_e = (_d = tableOptions.state) === null || _d === void 0 ? void 0 : _d.columnOrder) !== null && _e !== void 0 ? _e : columnOrder).includes('mrt-row-drag') && Object.assign(Object.assign(Object.assign({ Cell: ({ row, rowRef, table }) => (jsxRuntime.jsx(MRT_TableBodyRowGrabHandle, { row: row, rowRef: rowRef, table: table })), header: tableOptions.localization.move, size: 60 }, tableOptions.defaultDisplayColumn), (_f = tableOptions.displayColumnDefOptions) === null || _f === void 0 ? void 0 : _f['mrt-row-drag']), { id: 'mrt-row-drag' }),
|
3007
|
-
(((_h = (_g = tableOptions.state) === null || _g === void 0 ? void 0 : _g.columnOrder) !== null && _h !== void 0 ? _h : columnOrder).includes('mrt-row-actions') ||
|
3008
|
-
(creatingRow && tableOptions.createDisplayMode === 'row')) && Object.assign(Object.assign(Object.assign({ Cell: ({ cell, row, table }) => (jsxRuntime.jsx(MRT_ToggleRowActionMenuButton, { cell: cell, row: row, table: table })), header: tableOptions.localization.actions, size: 70 }, tableOptions.defaultDisplayColumn), (_j = tableOptions.displayColumnDefOptions) === null || _j === void 0 ? void 0 : _j['mrt-row-actions']), { id: 'mrt-row-actions' }),
|
3009
|
-
((_l = (_k = tableOptions.state) === null || _k === void 0 ? void 0 : _k.columnOrder) !== null && _l !== void 0 ? _l : columnOrder).includes('mrt-row-expand') &&
|
3010
|
-
showExpandColumn(tableOptions, (_o = (_m = tableOptions.state) === null || _m === void 0 ? void 0 : _m.grouping) !== null && _o !== void 0 ? _o : grouping) && Object.assign(Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_ExpandButton, { row: row, table: table })), Header: tableOptions.enableExpandAll
|
3011
|
-
? ({ table }) => jsxRuntime.jsx(MRT_ExpandAllButton, { table: table })
|
3012
|
-
: null, header: tableOptions.localization.expand, size: 60 }, tableOptions.defaultDisplayColumn), (_p = tableOptions.displayColumnDefOptions) === null || _p === void 0 ? void 0 : _p['mrt-row-expand']), { id: 'mrt-row-expand' }),
|
3013
|
-
((_r = (_q = tableOptions.state) === null || _q === void 0 ? void 0 : _q.columnOrder) !== null && _r !== void 0 ? _r : columnOrder).includes('mrt-row-select') && Object.assign(Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_SelectCheckbox, { row: row, table: table })), Header: tableOptions.enableSelectAll &&
|
3014
|
-
tableOptions.enableMultiRowSelection
|
3015
|
-
? ({ table }) => jsxRuntime.jsx(MRT_SelectCheckbox, { selectAll: true, table: table })
|
3016
|
-
: null, header: tableOptions.localization.select, size: 60 }, tableOptions.defaultDisplayColumn), (_s = tableOptions.displayColumnDefOptions) === null || _s === void 0 ? void 0 : _s['mrt-row-select']), { id: 'mrt-row-select' }),
|
3017
|
-
((_u = (_t = tableOptions.state) === null || _t === void 0 ? void 0 : _t.columnOrder) !== null && _u !== void 0 ? _u : columnOrder).includes('mrt-row-numbers') && Object.assign(Object.assign(Object.assign({ Cell: ({ row }) => row.index + 1, Header: () => tableOptions.localization.rowNumber, header: tableOptions.localization.rowNumbers, size: 60 }, tableOptions.defaultDisplayColumn), (_v = tableOptions.displayColumnDefOptions) === null || _v === void 0 ? void 0 : _v['mrt-row-numbers']), { id: 'mrt-row-numbers' }),
|
3018
|
-
((_x = (_w = tableOptions.state) === null || _w === void 0 ? void 0 : _w.columnOrder) !== null && _x !== void 0 ? _x : columnOrder).includes('mrt-row-spacer') && {
|
3019
|
-
columnDefType: 'display',
|
3020
|
-
header: '',
|
3021
|
-
id: 'mrt-row-spacer',
|
3022
|
-
muiTableBodyCellProps: blankColProps,
|
3023
|
-
muiTableFooterCellProps: blankColProps,
|
3024
|
-
muiTableHeadCellProps: blankColProps,
|
3025
|
-
},
|
3026
|
-
].filter(Boolean);
|
3027
|
-
}, [
|
3028
|
-
columnOrder,
|
3029
|
-
grouping,
|
3030
|
-
tableOptions.displayColumnDefOptions,
|
3031
|
-
tableOptions.editDisplayMode,
|
3032
|
-
tableOptions.enableColumnDragging,
|
3033
|
-
tableOptions.enableColumnFilterModes,
|
3034
|
-
tableOptions.enableColumnOrdering,
|
3035
|
-
tableOptions.enableEditing,
|
3036
|
-
tableOptions.enableExpandAll,
|
3037
|
-
tableOptions.enableExpanding,
|
3038
|
-
tableOptions.enableGrouping,
|
3039
|
-
tableOptions.enableRowActions,
|
3040
|
-
tableOptions.enableRowDragging,
|
3041
|
-
tableOptions.enableRowNumbers,
|
3042
|
-
tableOptions.enableRowOrdering,
|
3043
|
-
tableOptions.enableRowSelection,
|
3044
|
-
tableOptions.enableSelectAll,
|
3045
|
-
tableOptions.localization,
|
3046
|
-
tableOptions.positionActionsColumn,
|
3047
|
-
tableOptions.renderDetailPanel,
|
3048
|
-
tableOptions.renderRowActionMenuItems,
|
3049
|
-
tableOptions.renderRowActions,
|
3050
|
-
(_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnOrder,
|
3051
|
-
(_b = tableOptions.state) === null || _b === void 0 ? void 0 : _b.grouping,
|
3052
|
-
]);
|
2993
|
+
const MRT_AggregationFns = Object.assign({}, reactTable.aggregationFns);
|
2994
|
+
|
2995
|
+
const fuzzy = (row, columnId, filterValue, addMeta) => {
|
2996
|
+
const itemRank = matchSorterUtils.rankItem(row.getValue(columnId), filterValue, {
|
2997
|
+
threshold: matchSorterUtils.rankings.MATCHES,
|
2998
|
+
});
|
2999
|
+
addMeta(itemRank);
|
3000
|
+
return itemRank.passed;
|
3053
3001
|
};
|
3002
|
+
fuzzy.autoRemove = (val) => !val;
|
3003
|
+
const contains = (row, id, filterValue) => row
|
3004
|
+
.getValue(id)
|
3005
|
+
.toString()
|
3006
|
+
.toLowerCase()
|
3007
|
+
.trim()
|
3008
|
+
.includes(filterValue.toString().toLowerCase().trim());
|
3009
|
+
contains.autoRemove = (val) => !val;
|
3010
|
+
const startsWith = (row, id, filterValue) => row
|
3011
|
+
.getValue(id)
|
3012
|
+
.toString()
|
3013
|
+
.toLowerCase()
|
3014
|
+
.trim()
|
3015
|
+
.startsWith(filterValue.toString().toLowerCase().trim());
|
3016
|
+
startsWith.autoRemove = (val) => !val;
|
3017
|
+
const endsWith = (row, id, filterValue) => row
|
3018
|
+
.getValue(id)
|
3019
|
+
.toString()
|
3020
|
+
.toLowerCase()
|
3021
|
+
.trim()
|
3022
|
+
.endsWith(filterValue.toString().toLowerCase().trim());
|
3023
|
+
endsWith.autoRemove = (val) => !val;
|
3024
|
+
const equals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() ===
|
3025
|
+
(filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
|
3026
|
+
equals.autoRemove = (val) => !val;
|
3027
|
+
const notEquals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() !==
|
3028
|
+
filterValue.toString().toLowerCase().trim();
|
3029
|
+
notEquals.autoRemove = (val) => !val;
|
3030
|
+
const greaterThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
|
3031
|
+
? +row.getValue(id) > +filterValue
|
3032
|
+
: row.getValue(id).toString().toLowerCase().trim() >
|
3033
|
+
(filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
|
3034
|
+
greaterThan.autoRemove = (val) => !val;
|
3035
|
+
const greaterThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || greaterThan(row, id, filterValue);
|
3036
|
+
greaterThanOrEqualTo.autoRemove = (val) => !val;
|
3037
|
+
const lessThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
|
3038
|
+
? +row.getValue(id) < +filterValue
|
3039
|
+
: row.getValue(id).toString().toLowerCase().trim() <
|
3040
|
+
(filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
|
3041
|
+
lessThan.autoRemove = (val) => !val;
|
3042
|
+
const lessThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || lessThan(row, id, filterValue);
|
3043
|
+
lessThanOrEqualTo.autoRemove = (val) => !val;
|
3044
|
+
const between = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
|
3045
|
+
greaterThan(row, id, filterValues[0])) &&
|
3046
|
+
((!isNaN(+filterValues[0]) &&
|
3047
|
+
!isNaN(+filterValues[1]) &&
|
3048
|
+
+filterValues[0] > +filterValues[1]) ||
|
3049
|
+
['', undefined].includes(filterValues[1]) ||
|
3050
|
+
lessThan(row, id, filterValues[1]));
|
3051
|
+
between.autoRemove = (val) => !val;
|
3052
|
+
const betweenInclusive = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
|
3053
|
+
greaterThanOrEqualTo(row, id, filterValues[0])) &&
|
3054
|
+
((!isNaN(+filterValues[0]) &&
|
3055
|
+
!isNaN(+filterValues[1]) &&
|
3056
|
+
+filterValues[0] > +filterValues[1]) ||
|
3057
|
+
['', undefined].includes(filterValues[1]) ||
|
3058
|
+
lessThanOrEqualTo(row, id, filterValues[1]));
|
3059
|
+
betweenInclusive.autoRemove = (val) => !val;
|
3060
|
+
const empty = (row, id, _filterValue) => !row.getValue(id).toString().trim();
|
3061
|
+
empty.autoRemove = (val) => !val;
|
3062
|
+
const notEmpty = (row, id, _filterValue) => !!row.getValue(id).toString().trim();
|
3063
|
+
notEmpty.autoRemove = (val) => !val;
|
3064
|
+
const MRT_FilterFns = Object.assign(Object.assign({}, reactTable.filterFns), { between,
|
3065
|
+
betweenInclusive,
|
3066
|
+
contains,
|
3067
|
+
empty,
|
3068
|
+
endsWith,
|
3069
|
+
equals,
|
3070
|
+
fuzzy,
|
3071
|
+
greaterThan,
|
3072
|
+
greaterThanOrEqualTo,
|
3073
|
+
lessThan,
|
3074
|
+
lessThanOrEqualTo,
|
3075
|
+
notEmpty,
|
3076
|
+
notEquals,
|
3077
|
+
startsWith });
|
3054
3078
|
|
3055
|
-
const
|
3056
|
-
|
3057
|
-
|
3058
|
-
|
3059
|
-
|
3060
|
-
|
3061
|
-
|
3062
|
-
|
3063
|
-
|
3064
|
-
|
3065
|
-
|
3066
|
-
|
3067
|
-
|
3068
|
-
|
3069
|
-
|
3070
|
-
|
3071
|
-
|
3072
|
-
|
3073
|
-
|
3074
|
-
|
3075
|
-
|
3076
|
-
|
3077
|
-
|
3078
|
-
|
3079
|
-
|
3080
|
-
|
3081
|
-
|
3082
|
-
|
3083
|
-
|
3084
|
-
|
3085
|
-
|
3086
|
-
|
3087
|
-
|
3088
|
-
|
3089
|
-
return;
|
3090
|
-
const { pageIndex, pageSize } = pagination;
|
3091
|
-
const totalRowCount = rowCount !== null && rowCount !== void 0 ? rowCount : table.getPrePaginationRowModel().rows.length;
|
3092
|
-
const firstVisibleRowIndex = pageIndex * pageSize;
|
3093
|
-
if (firstVisibleRowIndex > totalRowCount) {
|
3094
|
-
table.setPageIndex(Math.floor(totalRowCount / pageSize));
|
3095
|
-
}
|
3096
|
-
}, [rowCount, table.getPrePaginationRowModel().rows.length]);
|
3097
|
-
//turn off sort when global filter is looking for ranked results
|
3098
|
-
const appliedSort = react.useRef(sorting);
|
3099
|
-
react.useEffect(() => {
|
3100
|
-
if (sorting.length) {
|
3101
|
-
appliedSort.current = sorting;
|
3102
|
-
}
|
3103
|
-
}, [sorting]);
|
3104
|
-
react.useEffect(() => {
|
3105
|
-
if (!getCanRankRows(table))
|
3106
|
-
return;
|
3107
|
-
if (globalFilter) {
|
3108
|
-
table.setSorting([]);
|
3109
|
-
}
|
3110
|
-
else {
|
3111
|
-
table.setSorting(() => appliedSort.current || []);
|
3112
|
-
}
|
3113
|
-
}, [globalFilter]);
|
3114
|
-
react.useEffect(() => {
|
3115
|
-
if (enableRowPinning && getIsSomeRowsPinned()) {
|
3116
|
-
setTimeout(() => {
|
3117
|
-
rerender();
|
3118
|
-
}, 150);
|
3119
|
-
}
|
3120
|
-
}, [density]);
|
3079
|
+
const MRT_Default_Icons = {
|
3080
|
+
ArrowDownwardIcon,
|
3081
|
+
ArrowRightIcon,
|
3082
|
+
CancelIcon,
|
3083
|
+
ChevronLeftIcon,
|
3084
|
+
ChevronRightIcon,
|
3085
|
+
ClearAllIcon,
|
3086
|
+
CloseIcon,
|
3087
|
+
DensityLargeIcon,
|
3088
|
+
DensityMediumIcon,
|
3089
|
+
DensitySmallIcon,
|
3090
|
+
DragHandleIcon,
|
3091
|
+
DynamicFeedIcon,
|
3092
|
+
EditIcon,
|
3093
|
+
ExpandMoreIcon,
|
3094
|
+
FilterAltIcon,
|
3095
|
+
FilterListIcon,
|
3096
|
+
FilterListOffIcon,
|
3097
|
+
FirstPageIcon,
|
3098
|
+
FullscreenExitIcon,
|
3099
|
+
FullscreenIcon,
|
3100
|
+
KeyboardDoubleArrowDownIcon,
|
3101
|
+
LastPageIcon,
|
3102
|
+
MoreHorizIcon,
|
3103
|
+
MoreVertIcon,
|
3104
|
+
PushPinIcon,
|
3105
|
+
RestartAltIcon,
|
3106
|
+
SaveIcon,
|
3107
|
+
SearchIcon,
|
3108
|
+
SearchOffIcon,
|
3109
|
+
SortIcon,
|
3110
|
+
SyncAltIcon,
|
3111
|
+
ViewColumnIcon,
|
3112
|
+
VisibilityOffIcon,
|
3121
3113
|
};
|
3122
3114
|
|
3123
|
-
const
|
3124
|
-
|
3125
|
-
|
3126
|
-
|
3127
|
-
|
3128
|
-
|
3129
|
-
|
3130
|
-
|
3131
|
-
|
3132
|
-
|
3133
|
-
|
3134
|
-
|
3135
|
-
|
3136
|
-
|
3137
|
-
|
3138
|
-
|
3139
|
-
|
3140
|
-
|
3141
|
-
|
3142
|
-
|
3143
|
-
|
3144
|
-
|
3145
|
-
|
3146
|
-
|
3147
|
-
|
3148
|
-
|
3149
|
-
|
3150
|
-
|
3151
|
-
|
3152
|
-
|
3153
|
-
|
3154
|
-
|
3155
|
-
|
3156
|
-
|
3157
|
-
|
3158
|
-
|
3159
|
-
|
3160
|
-
|
3161
|
-
|
3162
|
-
|
3163
|
-
|
3164
|
-
|
3165
|
-
|
3166
|
-
|
3167
|
-
|
3168
|
-
|
3169
|
-
|
3170
|
-
|
3171
|
-
|
3172
|
-
|
3173
|
-
|
3174
|
-
|
3175
|
-
|
3176
|
-
|
3177
|
-
|
3178
|
-
|
3179
|
-
|
3180
|
-
|
3181
|
-
|
3182
|
-
|
3183
|
-
|
3184
|
-
|
3185
|
-
|
3186
|
-
|
3187
|
-
|
3188
|
-
|
3189
|
-
|
3190
|
-
|
3191
|
-
|
3192
|
-
|
3193
|
-
|
3194
|
-
|
3195
|
-
|
3196
|
-
|
3197
|
-
|
3198
|
-
|
3199
|
-
|
3200
|
-
|
3201
|
-
},
|
3202
|
-
|
3203
|
-
|
3204
|
-
|
3205
|
-
|
3206
|
-
|
3207
|
-
|
3208
|
-
|
3209
|
-
|
3210
|
-
|
3211
|
-
|
3212
|
-
|
3213
|
-
: undefined, getFacetedUniqueValues: tableOptions.enableFacetedValues
|
3214
|
-
? reactTable.getFacetedUniqueValues()
|
3215
|
-
: undefined, getFilteredRowModel: tableOptions.enableColumnFilters ||
|
3216
|
-
tableOptions.enableGlobalFilter ||
|
3217
|
-
tableOptions.enableFilters
|
3218
|
-
? reactTable.getFilteredRowModel()
|
3219
|
-
: undefined, getGroupedRowModel: tableOptions.enableGrouping
|
3220
|
-
? reactTable.getGroupedRowModel()
|
3221
|
-
: undefined, getPaginationRowModel: tableOptions.enablePagination
|
3222
|
-
? reactTable.getPaginationRowModel()
|
3223
|
-
: undefined, getSortedRowModel: tableOptions.enableSorting
|
3224
|
-
? reactTable.getSortedRowModel()
|
3225
|
-
: undefined, getSubRows: (row) => row === null || row === void 0 ? void 0 : row.subRows, onColumnOrderChange: setColumnOrder, onGroupingChange: setGrouping }, tableOptions), {
|
3226
|
-
//@ts-ignore
|
3227
|
-
columns: columnDefs, data, globalFilterFn: (_w = tableOptions.filterFns) === null || _w === void 0 ? void 0 : _w[globalFilterFn !== null && globalFilterFn !== void 0 ? globalFilterFn : 'fuzzy'], initialState, state: Object.assign({ columnFilterFns,
|
3228
|
-
columnOrder,
|
3229
|
-
creatingRow,
|
3230
|
-
density,
|
3231
|
-
draggingColumn,
|
3232
|
-
draggingRow,
|
3233
|
-
editingCell,
|
3234
|
-
editingRow,
|
3235
|
-
globalFilterFn,
|
3236
|
-
grouping,
|
3237
|
-
hoveredColumn,
|
3238
|
-
hoveredRow,
|
3239
|
-
isFullScreen,
|
3240
|
-
showAlertBanner,
|
3241
|
-
showColumnFilters,
|
3242
|
-
showGlobalFilter,
|
3243
|
-
showToolbarDropZone }, tableOptions.state) }));
|
3244
|
-
// @ts-ignore
|
3245
|
-
table.refs = {
|
3246
|
-
// @ts-ignore
|
3247
|
-
bottomToolbarRef,
|
3248
|
-
editInputRefs,
|
3249
|
-
filterInputRefs,
|
3250
|
-
// @ts-ignore
|
3251
|
-
searchInputRef,
|
3252
|
-
// @ts-ignore
|
3253
|
-
tableContainerRef,
|
3254
|
-
// @ts-ignore
|
3255
|
-
tableFooterRef,
|
3256
|
-
tableHeadCellRefs,
|
3257
|
-
// @ts-ignore
|
3258
|
-
tableHeadRef,
|
3259
|
-
// @ts-ignore
|
3260
|
-
tablePaperRef,
|
3261
|
-
// @ts-ignore
|
3262
|
-
topToolbarRef,
|
3263
|
-
};
|
3264
|
-
const setCreatingRow = (row) => {
|
3265
|
-
var _a, _b;
|
3266
|
-
let _row = row;
|
3267
|
-
if (row === true) {
|
3268
|
-
_row = createRow(table);
|
3269
|
-
}
|
3270
|
-
(_b = (_a = tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.onCreatingRowChange) === null || _a === void 0 ? void 0 : _a.call(tableOptions, _row)) !== null && _b !== void 0 ? _b : _setCreatingRow(_row);
|
3271
|
-
};
|
3272
|
-
table.setCreatingRow = setCreatingRow;
|
3273
|
-
table.setColumnFilterFns =
|
3274
|
-
(_x = tableOptions.onColumnFilterFnsChange) !== null && _x !== void 0 ? _x : setColumnFilterFns;
|
3275
|
-
table.setDensity = (_y = tableOptions.onDensityChange) !== null && _y !== void 0 ? _y : setDensity;
|
3276
|
-
table.setDraggingColumn =
|
3277
|
-
(_z = tableOptions.onDraggingColumnChange) !== null && _z !== void 0 ? _z : setDraggingColumn;
|
3278
|
-
table.setDraggingRow = (_0 = tableOptions.onDraggingRowChange) !== null && _0 !== void 0 ? _0 : setDraggingRow;
|
3279
|
-
table.setEditingCell = (_1 = tableOptions.onEditingCellChange) !== null && _1 !== void 0 ? _1 : setEditingCell;
|
3280
|
-
table.setEditingRow = (_2 = tableOptions.onEditingRowChange) !== null && _2 !== void 0 ? _2 : setEditingRow;
|
3281
|
-
table.setGlobalFilterFn =
|
3282
|
-
(_3 = tableOptions.onGlobalFilterFnChange) !== null && _3 !== void 0 ? _3 : setGlobalFilterFn;
|
3283
|
-
table.setHoveredColumn =
|
3284
|
-
(_4 = tableOptions.onHoveredColumnChange) !== null && _4 !== void 0 ? _4 : setHoveredColumn;
|
3285
|
-
table.setHoveredRow = (_5 = tableOptions.onHoveredRowChange) !== null && _5 !== void 0 ? _5 : setHoveredRow;
|
3286
|
-
table.setIsFullScreen = (_6 = tableOptions.onIsFullScreenChange) !== null && _6 !== void 0 ? _6 : setIsFullScreen;
|
3287
|
-
table.setShowAlertBanner =
|
3288
|
-
(_7 = tableOptions.onShowAlertBannerChange) !== null && _7 !== void 0 ? _7 : setShowAlertBanner;
|
3289
|
-
table.setShowColumnFilters =
|
3290
|
-
(_8 = tableOptions.onShowColumnFiltersChange) !== null && _8 !== void 0 ? _8 : setShowColumnFilters;
|
3291
|
-
table.setShowGlobalFilter =
|
3292
|
-
(_9 = tableOptions.onShowGlobalFilterChange) !== null && _9 !== void 0 ? _9 : setShowGlobalFilter;
|
3293
|
-
table.setShowToolbarDropZone =
|
3294
|
-
(_10 = tableOptions.onShowToolbarDropZoneChange) !== null && _10 !== void 0 ? _10 : setShowToolbarDropZone;
|
3295
|
-
useMRT_Effects(table);
|
3296
|
-
return table;
|
3115
|
+
const MRT_Localization_EN = {
|
3116
|
+
actions: 'Actions',
|
3117
|
+
and: 'and',
|
3118
|
+
cancel: 'Cancel',
|
3119
|
+
changeFilterMode: 'Change filter mode',
|
3120
|
+
changeSearchMode: 'Change search mode',
|
3121
|
+
clearFilter: 'Clear filter',
|
3122
|
+
clearSearch: 'Clear search',
|
3123
|
+
clearSort: 'Clear sort',
|
3124
|
+
clickToCopy: 'Click to copy',
|
3125
|
+
collapse: 'Collapse',
|
3126
|
+
collapseAll: 'Collapse all',
|
3127
|
+
columnActions: 'Column Actions',
|
3128
|
+
copiedToClipboard: 'Copied to clipboard',
|
3129
|
+
dropToGroupBy: 'Drop to group by {column}',
|
3130
|
+
edit: 'Edit',
|
3131
|
+
expand: 'Expand',
|
3132
|
+
expandAll: 'Expand all',
|
3133
|
+
filterArrIncludes: 'Includes',
|
3134
|
+
filterArrIncludesAll: 'Includes all',
|
3135
|
+
filterArrIncludesSome: 'Includes',
|
3136
|
+
filterBetween: 'Between',
|
3137
|
+
filterBetweenInclusive: 'Between Inclusive',
|
3138
|
+
filterByColumn: 'Filter by {column}',
|
3139
|
+
filterContains: 'Contains',
|
3140
|
+
filterEmpty: 'Empty',
|
3141
|
+
filterEndsWith: 'Ends With',
|
3142
|
+
filterEquals: 'Equals',
|
3143
|
+
filterEqualsString: 'Equals',
|
3144
|
+
filterFuzzy: 'Fuzzy',
|
3145
|
+
filterGreaterThan: 'Greater Than',
|
3146
|
+
filterGreaterThanOrEqualTo: 'Greater Than Or Equal To',
|
3147
|
+
filterInNumberRange: 'Between',
|
3148
|
+
filterIncludesString: 'Contains',
|
3149
|
+
filterIncludesStringSensitive: 'Contains',
|
3150
|
+
filterLessThan: 'Less Than',
|
3151
|
+
filterLessThanOrEqualTo: 'Less Than Or Equal To',
|
3152
|
+
filterMode: 'Filter Mode: {filterType}',
|
3153
|
+
filterNotEmpty: 'Not Empty',
|
3154
|
+
filterNotEquals: 'Not Equals',
|
3155
|
+
filterStartsWith: 'Starts With',
|
3156
|
+
filterWeakEquals: 'Equals',
|
3157
|
+
filteringByColumn: 'Filtering by {column} - {filterType} {filterValue}',
|
3158
|
+
goToFirstPage: 'Go to first page',
|
3159
|
+
goToLastPage: 'Go to last page',
|
3160
|
+
goToNextPage: 'Go to next page',
|
3161
|
+
goToPreviousPage: 'Go to previous page',
|
3162
|
+
grab: 'Grab',
|
3163
|
+
groupByColumn: 'Group by {column}',
|
3164
|
+
groupedBy: 'Grouped by ',
|
3165
|
+
hideAll: 'Hide all',
|
3166
|
+
hideColumn: 'Hide {column} column',
|
3167
|
+
max: 'Max',
|
3168
|
+
min: 'Min',
|
3169
|
+
move: 'Move',
|
3170
|
+
noRecordsToDisplay: 'No records to display',
|
3171
|
+
noResultsFound: 'No results found',
|
3172
|
+
of: 'of',
|
3173
|
+
or: 'or',
|
3174
|
+
pin: 'Pin',
|
3175
|
+
pinToLeft: 'Pin to left',
|
3176
|
+
pinToRight: 'Pin to right',
|
3177
|
+
resetColumnSize: 'Reset column size',
|
3178
|
+
resetOrder: 'Reset order',
|
3179
|
+
rowActions: 'Row Actions',
|
3180
|
+
rowNumber: '#',
|
3181
|
+
rowNumbers: 'Row Numbers',
|
3182
|
+
rowsPerPage: 'Rows per page',
|
3183
|
+
save: 'Save',
|
3184
|
+
search: 'Search',
|
3185
|
+
selectedCountOfRowCountRowsSelected: '{selectedCount} of {rowCount} row(s) selected',
|
3186
|
+
select: 'Select',
|
3187
|
+
showAll: 'Show all',
|
3188
|
+
showAllColumns: 'Show all columns',
|
3189
|
+
showHideColumns: 'Show/Hide columns',
|
3190
|
+
showHideFilters: 'Show/Hide filters',
|
3191
|
+
showHideSearch: 'Show/Hide search',
|
3192
|
+
sortByColumnAsc: 'Sort by {column} ascending',
|
3193
|
+
sortByColumnDesc: 'Sort by {column} descending',
|
3194
|
+
sortedByColumnAsc: 'Sorted by {column} ascending',
|
3195
|
+
sortedByColumnDesc: 'Sorted by {column} descending',
|
3196
|
+
thenBy: ', then by ',
|
3197
|
+
toggleDensity: 'Toggle density',
|
3198
|
+
toggleFullScreen: 'Toggle full screen',
|
3199
|
+
toggleSelectAll: 'Toggle select all',
|
3200
|
+
toggleSelectRow: 'Toggle select row',
|
3201
|
+
toggleVisibility: 'Toggle visibility',
|
3202
|
+
ungroupByColumn: 'Ungroup by {column}',
|
3203
|
+
unpin: 'Unpin',
|
3204
|
+
unpinAll: 'Unpin all',
|
3297
3205
|
};
|
3298
3206
|
|
3299
|
-
const
|
3300
|
-
|
3301
|
-
|
3302
|
-
|
3303
|
-
|
3304
|
-
});
|
3305
|
-
addMeta(itemRank);
|
3306
|
-
return itemRank.passed;
|
3307
|
-
};
|
3308
|
-
fuzzy.autoRemove = (val) => !val;
|
3309
|
-
const contains = (row, id, filterValue) => row
|
3310
|
-
.getValue(id)
|
3311
|
-
.toString()
|
3312
|
-
.toLowerCase()
|
3313
|
-
.trim()
|
3314
|
-
.includes(filterValue.toString().toLowerCase().trim());
|
3315
|
-
contains.autoRemove = (val) => !val;
|
3316
|
-
const startsWith = (row, id, filterValue) => row
|
3317
|
-
.getValue(id)
|
3318
|
-
.toString()
|
3319
|
-
.toLowerCase()
|
3320
|
-
.trim()
|
3321
|
-
.startsWith(filterValue.toString().toLowerCase().trim());
|
3322
|
-
startsWith.autoRemove = (val) => !val;
|
3323
|
-
const endsWith = (row, id, filterValue) => row
|
3324
|
-
.getValue(id)
|
3325
|
-
.toString()
|
3326
|
-
.toLowerCase()
|
3327
|
-
.trim()
|
3328
|
-
.endsWith(filterValue.toString().toLowerCase().trim());
|
3329
|
-
endsWith.autoRemove = (val) => !val;
|
3330
|
-
const equals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() ===
|
3331
|
-
(filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
|
3332
|
-
equals.autoRemove = (val) => !val;
|
3333
|
-
const notEquals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() !==
|
3334
|
-
filterValue.toString().toLowerCase().trim();
|
3335
|
-
notEquals.autoRemove = (val) => !val;
|
3336
|
-
const greaterThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
|
3337
|
-
? +row.getValue(id) > +filterValue
|
3338
|
-
: row.getValue(id).toString().toLowerCase().trim() >
|
3339
|
-
(filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
|
3340
|
-
greaterThan.autoRemove = (val) => !val;
|
3341
|
-
const greaterThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || greaterThan(row, id, filterValue);
|
3342
|
-
greaterThanOrEqualTo.autoRemove = (val) => !val;
|
3343
|
-
const lessThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id))
|
3344
|
-
? +row.getValue(id) < +filterValue
|
3345
|
-
: row.getValue(id).toString().toLowerCase().trim() <
|
3346
|
-
(filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString().toLowerCase().trim());
|
3347
|
-
lessThan.autoRemove = (val) => !val;
|
3348
|
-
const lessThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || lessThan(row, id, filterValue);
|
3349
|
-
lessThanOrEqualTo.autoRemove = (val) => !val;
|
3350
|
-
const between = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
|
3351
|
-
greaterThan(row, id, filterValues[0])) &&
|
3352
|
-
((!isNaN(+filterValues[0]) &&
|
3353
|
-
!isNaN(+filterValues[1]) &&
|
3354
|
-
+filterValues[0] > +filterValues[1]) ||
|
3355
|
-
['', undefined].includes(filterValues[1]) ||
|
3356
|
-
lessThan(row, id, filterValues[1]));
|
3357
|
-
between.autoRemove = (val) => !val;
|
3358
|
-
const betweenInclusive = (row, id, filterValues) => (['', undefined].includes(filterValues[0]) ||
|
3359
|
-
greaterThanOrEqualTo(row, id, filterValues[0])) &&
|
3360
|
-
((!isNaN(+filterValues[0]) &&
|
3361
|
-
!isNaN(+filterValues[1]) &&
|
3362
|
-
+filterValues[0] > +filterValues[1]) ||
|
3363
|
-
['', undefined].includes(filterValues[1]) ||
|
3364
|
-
lessThanOrEqualTo(row, id, filterValues[1]));
|
3365
|
-
betweenInclusive.autoRemove = (val) => !val;
|
3366
|
-
const empty = (row, id, _filterValue) => !row.getValue(id).toString().trim();
|
3367
|
-
empty.autoRemove = (val) => !val;
|
3368
|
-
const notEmpty = (row, id, _filterValue) => !!row.getValue(id).toString().trim();
|
3369
|
-
notEmpty.autoRemove = (val) => !val;
|
3370
|
-
const MRT_FilterFns = Object.assign(Object.assign({}, reactTable.filterFns), { between,
|
3371
|
-
betweenInclusive,
|
3372
|
-
contains,
|
3373
|
-
empty,
|
3374
|
-
endsWith,
|
3375
|
-
equals,
|
3376
|
-
fuzzy,
|
3377
|
-
greaterThan,
|
3378
|
-
greaterThanOrEqualTo,
|
3379
|
-
lessThan,
|
3380
|
-
lessThanOrEqualTo,
|
3381
|
-
notEmpty,
|
3382
|
-
notEquals,
|
3383
|
-
startsWith });
|
3384
|
-
|
3385
|
-
const MRT_Default_Icons = {
|
3386
|
-
ArrowDownwardIcon,
|
3387
|
-
ArrowRightIcon,
|
3388
|
-
CancelIcon,
|
3389
|
-
ChevronLeftIcon,
|
3390
|
-
ChevronRightIcon,
|
3391
|
-
ClearAllIcon,
|
3392
|
-
CloseIcon,
|
3393
|
-
DensityLargeIcon,
|
3394
|
-
DensityMediumIcon,
|
3395
|
-
DensitySmallIcon,
|
3396
|
-
DragHandleIcon,
|
3397
|
-
DynamicFeedIcon,
|
3398
|
-
EditIcon,
|
3399
|
-
ExpandMoreIcon,
|
3400
|
-
FilterAltIcon,
|
3401
|
-
FilterListIcon,
|
3402
|
-
FilterListOffIcon,
|
3403
|
-
FirstPageIcon,
|
3404
|
-
FullscreenExitIcon,
|
3405
|
-
FullscreenIcon,
|
3406
|
-
KeyboardDoubleArrowDownIcon,
|
3407
|
-
LastPageIcon,
|
3408
|
-
MoreHorizIcon,
|
3409
|
-
MoreVertIcon,
|
3410
|
-
PushPinIcon,
|
3411
|
-
RestartAltIcon,
|
3412
|
-
SaveIcon,
|
3413
|
-
SearchIcon,
|
3414
|
-
SearchOffIcon,
|
3415
|
-
SortIcon,
|
3416
|
-
SyncAltIcon,
|
3417
|
-
ViewColumnIcon,
|
3418
|
-
VisibilityOffIcon,
|
3419
|
-
};
|
3420
|
-
|
3421
|
-
const MRT_Localization_EN = {
|
3422
|
-
actions: 'Actions',
|
3423
|
-
and: 'and',
|
3424
|
-
cancel: 'Cancel',
|
3425
|
-
changeFilterMode: 'Change filter mode',
|
3426
|
-
changeSearchMode: 'Change search mode',
|
3427
|
-
clearFilter: 'Clear filter',
|
3428
|
-
clearSearch: 'Clear search',
|
3429
|
-
clearSort: 'Clear sort',
|
3430
|
-
clickToCopy: 'Click to copy',
|
3431
|
-
collapse: 'Collapse',
|
3432
|
-
collapseAll: 'Collapse all',
|
3433
|
-
columnActions: 'Column Actions',
|
3434
|
-
copiedToClipboard: 'Copied to clipboard',
|
3435
|
-
dropToGroupBy: 'Drop to group by {column}',
|
3436
|
-
edit: 'Edit',
|
3437
|
-
expand: 'Expand',
|
3438
|
-
expandAll: 'Expand all',
|
3439
|
-
filterArrIncludes: 'Includes',
|
3440
|
-
filterArrIncludesAll: 'Includes all',
|
3441
|
-
filterArrIncludesSome: 'Includes',
|
3442
|
-
filterBetween: 'Between',
|
3443
|
-
filterBetweenInclusive: 'Between Inclusive',
|
3444
|
-
filterByColumn: 'Filter by {column}',
|
3445
|
-
filterContains: 'Contains',
|
3446
|
-
filterEmpty: 'Empty',
|
3447
|
-
filterEndsWith: 'Ends With',
|
3448
|
-
filterEquals: 'Equals',
|
3449
|
-
filterEqualsString: 'Equals',
|
3450
|
-
filterFuzzy: 'Fuzzy',
|
3451
|
-
filterGreaterThan: 'Greater Than',
|
3452
|
-
filterGreaterThanOrEqualTo: 'Greater Than Or Equal To',
|
3453
|
-
filterInNumberRange: 'Between',
|
3454
|
-
filterIncludesString: 'Contains',
|
3455
|
-
filterIncludesStringSensitive: 'Contains',
|
3456
|
-
filterLessThan: 'Less Than',
|
3457
|
-
filterLessThanOrEqualTo: 'Less Than Or Equal To',
|
3458
|
-
filterMode: 'Filter Mode: {filterType}',
|
3459
|
-
filterNotEmpty: 'Not Empty',
|
3460
|
-
filterNotEquals: 'Not Equals',
|
3461
|
-
filterStartsWith: 'Starts With',
|
3462
|
-
filterWeakEquals: 'Equals',
|
3463
|
-
filteringByColumn: 'Filtering by {column} - {filterType} {filterValue}',
|
3464
|
-
goToFirstPage: 'Go to first page',
|
3465
|
-
goToLastPage: 'Go to last page',
|
3466
|
-
goToNextPage: 'Go to next page',
|
3467
|
-
goToPreviousPage: 'Go to previous page',
|
3468
|
-
grab: 'Grab',
|
3469
|
-
groupByColumn: 'Group by {column}',
|
3470
|
-
groupedBy: 'Grouped by ',
|
3471
|
-
hideAll: 'Hide all',
|
3472
|
-
hideColumn: 'Hide {column} column',
|
3473
|
-
max: 'Max',
|
3474
|
-
min: 'Min',
|
3475
|
-
move: 'Move',
|
3476
|
-
noRecordsToDisplay: 'No records to display',
|
3477
|
-
noResultsFound: 'No results found',
|
3478
|
-
of: 'of',
|
3479
|
-
or: 'or',
|
3480
|
-
pin: 'Pin',
|
3481
|
-
pinToLeft: 'Pin to left',
|
3482
|
-
pinToRight: 'Pin to right',
|
3483
|
-
resetColumnSize: 'Reset column size',
|
3484
|
-
resetOrder: 'Reset order',
|
3485
|
-
rowActions: 'Row Actions',
|
3486
|
-
rowNumber: '#',
|
3487
|
-
rowNumbers: 'Row Numbers',
|
3488
|
-
rowsPerPage: 'Rows per page',
|
3489
|
-
save: 'Save',
|
3490
|
-
search: 'Search',
|
3491
|
-
selectedCountOfRowCountRowsSelected: '{selectedCount} of {rowCount} row(s) selected',
|
3492
|
-
select: 'Select',
|
3493
|
-
showAll: 'Show all',
|
3494
|
-
showAllColumns: 'Show all columns',
|
3495
|
-
showHideColumns: 'Show/Hide columns',
|
3496
|
-
showHideFilters: 'Show/Hide filters',
|
3497
|
-
showHideSearch: 'Show/Hide search',
|
3498
|
-
sortByColumnAsc: 'Sort by {column} ascending',
|
3499
|
-
sortByColumnDesc: 'Sort by {column} descending',
|
3500
|
-
sortedByColumnAsc: 'Sorted by {column} ascending',
|
3501
|
-
sortedByColumnDesc: 'Sorted by {column} descending',
|
3502
|
-
thenBy: ', then by ',
|
3503
|
-
toggleDensity: 'Toggle density',
|
3504
|
-
toggleFullScreen: 'Toggle full screen',
|
3505
|
-
toggleSelectAll: 'Toggle select all',
|
3506
|
-
toggleSelectRow: 'Toggle select row',
|
3507
|
-
toggleVisibility: 'Toggle visibility',
|
3508
|
-
ungroupByColumn: 'Ungroup by {column}',
|
3509
|
-
unpin: 'Unpin',
|
3510
|
-
unpinAll: 'Unpin all',
|
3511
|
-
};
|
3512
|
-
|
3513
|
-
const MRT_DefaultColumn = {
|
3514
|
-
filterVariant: 'text',
|
3515
|
-
maxSize: 1000,
|
3516
|
-
minSize: 40,
|
3517
|
-
size: 180,
|
3207
|
+
const MRT_DefaultColumn = {
|
3208
|
+
filterVariant: 'text',
|
3209
|
+
maxSize: 1000,
|
3210
|
+
minSize: 40,
|
3211
|
+
size: 180,
|
3518
3212
|
};
|
3519
3213
|
const MRT_DefaultDisplayColumn = {
|
3520
3214
|
columnDefType: 'display',
|
@@ -3607,6 +3301,307 @@ const useMRT_TableOptions = (_a) => {
|
|
3607
3301
|
selectAllMode, sortingFns: _sortingFns }, rest);
|
3608
3302
|
};
|
3609
3303
|
|
3304
|
+
const blankColProps = {
|
3305
|
+
children: null,
|
3306
|
+
sx: {
|
3307
|
+
flex: '1 0 auto',
|
3308
|
+
minWidth: 0,
|
3309
|
+
p: 0,
|
3310
|
+
width: 0,
|
3311
|
+
},
|
3312
|
+
};
|
3313
|
+
const useMRT_DisplayColumns = ({ columnOrder, creatingRow, grouping, tableOptions, }) => {
|
3314
|
+
var _a, _b;
|
3315
|
+
return react.useMemo(() => {
|
3316
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
|
3317
|
+
return [
|
3318
|
+
((_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnOrder) !== null && _b !== void 0 ? _b : columnOrder).includes('mrt-row-pin') && Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_TableBodyRowPinButton, { row: row, table: table })), header: tableOptions.localization.pin, size: 60 }, (_c = tableOptions.displayColumnDefOptions) === null || _c === void 0 ? void 0 : _c['mrt-row-pin']), { columnDefType: 'display', id: 'mrt-row-pin' }),
|
3319
|
+
((_e = (_d = tableOptions.state) === null || _d === void 0 ? void 0 : _d.columnOrder) !== null && _e !== void 0 ? _e : columnOrder).includes('mrt-row-drag') && Object.assign(Object.assign({ Cell: ({ row, rowRef, table }) => (jsxRuntime.jsx(MRT_TableBodyRowGrabHandle, { row: row, rowRef: rowRef, table: table })), header: tableOptions.localization.move, size: 60 }, (_f = tableOptions.displayColumnDefOptions) === null || _f === void 0 ? void 0 : _f['mrt-row-drag']), { columnDefType: 'display', id: 'mrt-row-drag' }),
|
3320
|
+
(((_h = (_g = tableOptions.state) === null || _g === void 0 ? void 0 : _g.columnOrder) !== null && _h !== void 0 ? _h : columnOrder).includes('mrt-row-actions') ||
|
3321
|
+
(creatingRow && tableOptions.createDisplayMode === 'row')) && Object.assign(Object.assign({ Cell: ({ cell, row, table }) => (jsxRuntime.jsx(MRT_ToggleRowActionMenuButton, { cell: cell, row: row, table: table })), header: tableOptions.localization.actions, size: 70 }, (_j = tableOptions.displayColumnDefOptions) === null || _j === void 0 ? void 0 : _j['mrt-row-actions']), { columnDefType: 'display', id: 'mrt-row-actions' }),
|
3322
|
+
((_l = (_k = tableOptions.state) === null || _k === void 0 ? void 0 : _k.columnOrder) !== null && _l !== void 0 ? _l : columnOrder).includes('mrt-row-expand') &&
|
3323
|
+
showExpandColumn(tableOptions, (_o = (_m = tableOptions.state) === null || _m === void 0 ? void 0 : _m.grouping) !== null && _o !== void 0 ? _o : grouping) && Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_ExpandButton, { row: row, table: table })), Header: tableOptions.enableExpandAll
|
3324
|
+
? ({ table }) => jsxRuntime.jsx(MRT_ExpandAllButton, { table: table })
|
3325
|
+
: null, header: tableOptions.localization.expand, size: 60 }, (_p = tableOptions.displayColumnDefOptions) === null || _p === void 0 ? void 0 : _p['mrt-row-expand']), { columnDefType: 'display', id: 'mrt-row-expand' }),
|
3326
|
+
((_r = (_q = tableOptions.state) === null || _q === void 0 ? void 0 : _q.columnOrder) !== null && _r !== void 0 ? _r : columnOrder).includes('mrt-row-select') && Object.assign(Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_SelectCheckbox, { row: row, table: table })), Header: tableOptions.enableSelectAll &&
|
3327
|
+
tableOptions.enableMultiRowSelection
|
3328
|
+
? ({ table }) => jsxRuntime.jsx(MRT_SelectCheckbox, { selectAll: true, table: table })
|
3329
|
+
: null, header: tableOptions.localization.select, size: 60 }, (_s = tableOptions.displayColumnDefOptions) === null || _s === void 0 ? void 0 : _s['mrt-row-select']), { columnDefType: 'display', id: 'mrt-row-select' }),
|
3330
|
+
((_u = (_t = tableOptions.state) === null || _t === void 0 ? void 0 : _t.columnOrder) !== null && _u !== void 0 ? _u : columnOrder).includes('mrt-row-numbers') && Object.assign(Object.assign({ Cell: ({ row }) => row.index + 1, Header: () => tableOptions.localization.rowNumber, header: tableOptions.localization.rowNumbers, size: 60 }, (_v = tableOptions.displayColumnDefOptions) === null || _v === void 0 ? void 0 : _v['mrt-row-numbers']), { columnDefType: 'display', id: 'mrt-row-numbers' }),
|
3331
|
+
((_x = (_w = tableOptions.state) === null || _w === void 0 ? void 0 : _w.columnOrder) !== null && _x !== void 0 ? _x : columnOrder).includes('mrt-row-spacer') && Object.assign(Object.assign(Object.assign({}, (_y = tableOptions.displayColumnDefOptions) === null || _y === void 0 ? void 0 : _y['mrt-row-spacer']), MRT_DefaultDisplayColumn), { columnDefType: 'display', header: '', id: 'mrt-row-spacer', muiTableBodyCellProps: blankColProps, muiTableFooterCellProps: blankColProps, muiTableHeadCellProps: blankColProps }),
|
3332
|
+
].filter(Boolean);
|
3333
|
+
}, [
|
3334
|
+
columnOrder,
|
3335
|
+
grouping,
|
3336
|
+
tableOptions.displayColumnDefOptions,
|
3337
|
+
tableOptions.editDisplayMode,
|
3338
|
+
tableOptions.enableColumnDragging,
|
3339
|
+
tableOptions.enableColumnFilterModes,
|
3340
|
+
tableOptions.enableColumnOrdering,
|
3341
|
+
tableOptions.enableEditing,
|
3342
|
+
tableOptions.enableExpandAll,
|
3343
|
+
tableOptions.enableExpanding,
|
3344
|
+
tableOptions.enableGrouping,
|
3345
|
+
tableOptions.enableRowActions,
|
3346
|
+
tableOptions.enableRowDragging,
|
3347
|
+
tableOptions.enableRowNumbers,
|
3348
|
+
tableOptions.enableRowOrdering,
|
3349
|
+
tableOptions.enableRowSelection,
|
3350
|
+
tableOptions.enableSelectAll,
|
3351
|
+
tableOptions.localization,
|
3352
|
+
tableOptions.positionActionsColumn,
|
3353
|
+
tableOptions.renderDetailPanel,
|
3354
|
+
tableOptions.renderRowActionMenuItems,
|
3355
|
+
tableOptions.renderRowActions,
|
3356
|
+
(_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnOrder,
|
3357
|
+
(_b = tableOptions.state) === null || _b === void 0 ? void 0 : _b.grouping,
|
3358
|
+
]);
|
3359
|
+
};
|
3360
|
+
|
3361
|
+
const useMRT_Effects = (table) => {
|
3362
|
+
const { getIsSomeRowsPinned, getState, options: { enablePagination, enableRowPinning, rowCount }, } = table;
|
3363
|
+
const { density, globalFilter, isFullScreen, isLoading, pagination, showSkeletons, sorting, } = getState();
|
3364
|
+
const rerender = react.useReducer(() => ({}), {})[1];
|
3365
|
+
const isMounted = react.useRef(false);
|
3366
|
+
const initialBodyHeight = react.useRef();
|
3367
|
+
const previousTop = react.useRef();
|
3368
|
+
react.useEffect(() => {
|
3369
|
+
if (typeof window !== 'undefined') {
|
3370
|
+
initialBodyHeight.current = document.body.style.height;
|
3371
|
+
}
|
3372
|
+
}, []);
|
3373
|
+
react.useEffect(() => {
|
3374
|
+
if (isMounted && typeof window !== 'undefined') {
|
3375
|
+
if (isFullScreen) {
|
3376
|
+
previousTop.current = document.body.getBoundingClientRect().top; //save scroll position
|
3377
|
+
document.body.style.height = '100vh'; //hide page scrollbars when table is in full screen mode
|
3378
|
+
}
|
3379
|
+
else {
|
3380
|
+
document.body.style.height = initialBodyHeight.current;
|
3381
|
+
if (!previousTop.current)
|
3382
|
+
return;
|
3383
|
+
//restore scroll position
|
3384
|
+
window.scrollTo({
|
3385
|
+
behavior: 'instant',
|
3386
|
+
top: -1 * previousTop.current,
|
3387
|
+
});
|
3388
|
+
}
|
3389
|
+
}
|
3390
|
+
isMounted.current = true;
|
3391
|
+
}, [isFullScreen]);
|
3392
|
+
//if page index is out of bounds, set it to the last page
|
3393
|
+
react.useEffect(() => {
|
3394
|
+
if (!enablePagination || isLoading || showSkeletons)
|
3395
|
+
return;
|
3396
|
+
const { pageIndex, pageSize } = pagination;
|
3397
|
+
const totalRowCount = rowCount !== null && rowCount !== void 0 ? rowCount : table.getPrePaginationRowModel().rows.length;
|
3398
|
+
const firstVisibleRowIndex = pageIndex * pageSize;
|
3399
|
+
if (firstVisibleRowIndex > totalRowCount) {
|
3400
|
+
table.setPageIndex(Math.floor(totalRowCount / pageSize));
|
3401
|
+
}
|
3402
|
+
}, [rowCount, table.getPrePaginationRowModel().rows.length]);
|
3403
|
+
//turn off sort when global filter is looking for ranked results
|
3404
|
+
const appliedSort = react.useRef(sorting);
|
3405
|
+
react.useEffect(() => {
|
3406
|
+
if (sorting.length) {
|
3407
|
+
appliedSort.current = sorting;
|
3408
|
+
}
|
3409
|
+
}, [sorting]);
|
3410
|
+
react.useEffect(() => {
|
3411
|
+
if (!getCanRankRows(table))
|
3412
|
+
return;
|
3413
|
+
if (globalFilter) {
|
3414
|
+
table.setSorting([]);
|
3415
|
+
}
|
3416
|
+
else {
|
3417
|
+
table.setSorting(() => appliedSort.current || []);
|
3418
|
+
}
|
3419
|
+
}, [globalFilter]);
|
3420
|
+
react.useEffect(() => {
|
3421
|
+
if (enableRowPinning && getIsSomeRowsPinned()) {
|
3422
|
+
setTimeout(() => {
|
3423
|
+
rerender();
|
3424
|
+
}, 150);
|
3425
|
+
}
|
3426
|
+
}, [density]);
|
3427
|
+
};
|
3428
|
+
|
3429
|
+
const useMRT_TableInstance = (tableOptions) => {
|
3430
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10;
|
3431
|
+
const bottomToolbarRef = react.useRef(null);
|
3432
|
+
const editInputRefs = react.useRef({});
|
3433
|
+
const filterInputRefs = react.useRef({});
|
3434
|
+
const searchInputRef = react.useRef(null);
|
3435
|
+
const tableContainerRef = react.useRef(null);
|
3436
|
+
const tableHeadCellRefs = react.useRef({});
|
3437
|
+
const tablePaperRef = react.useRef(null);
|
3438
|
+
const topToolbarRef = react.useRef(null);
|
3439
|
+
const tableHeadRef = react.useRef(null);
|
3440
|
+
const tableFooterRef = react.useRef(null);
|
3441
|
+
const initialState = react.useMemo(() => {
|
3442
|
+
var _a, _b, _c;
|
3443
|
+
const initState = (_a = tableOptions.initialState) !== null && _a !== void 0 ? _a : {};
|
3444
|
+
initState.columnOrder =
|
3445
|
+
(_b = initState.columnOrder) !== null && _b !== void 0 ? _b : getDefaultColumnOrderIds(tableOptions);
|
3446
|
+
initState.globalFilterFn = (_c = tableOptions.globalFilterFn) !== null && _c !== void 0 ? _c : 'fuzzy';
|
3447
|
+
return initState;
|
3448
|
+
}, []);
|
3449
|
+
const [creatingRow, _setCreatingRow] = react.useState((_a = initialState.creatingRow) !== null && _a !== void 0 ? _a : null);
|
3450
|
+
const [columnFilterFns, setColumnFilterFns] = react.useState(() => Object.assign({}, ...getAllLeafColumnDefs(tableOptions.columns).map((col) => {
|
3451
|
+
var _a, _b, _c, _d;
|
3452
|
+
return ({
|
3453
|
+
[getColumnId(col)]: col.filterFn instanceof Function
|
3454
|
+
? (_a = col.filterFn.name) !== null && _a !== void 0 ? _a : 'custom'
|
3455
|
+
: (_d = (_b = col.filterFn) !== null && _b !== void 0 ? _b : (_c = initialState === null || initialState === void 0 ? void 0 : initialState.columnFilterFns) === null || _c === void 0 ? void 0 : _c[getColumnId(col)]) !== null && _d !== void 0 ? _d : getDefaultColumnFilterFn(col),
|
3456
|
+
});
|
3457
|
+
})));
|
3458
|
+
const [columnOrder, setColumnOrder] = react.useState((_b = initialState.columnOrder) !== null && _b !== void 0 ? _b : []);
|
3459
|
+
const [density, setDensity] = react.useState((_c = initialState === null || initialState === void 0 ? void 0 : initialState.density) !== null && _c !== void 0 ? _c : 'comfortable');
|
3460
|
+
const [draggingColumn, setDraggingColumn] = react.useState((_d = initialState.draggingColumn) !== null && _d !== void 0 ? _d : null);
|
3461
|
+
const [draggingRow, setDraggingRow] = react.useState((_e = initialState.draggingRow) !== null && _e !== void 0 ? _e : null);
|
3462
|
+
const [editingCell, setEditingCell] = react.useState((_f = initialState.editingCell) !== null && _f !== void 0 ? _f : null);
|
3463
|
+
const [editingRow, setEditingRow] = react.useState((_g = initialState.editingRow) !== null && _g !== void 0 ? _g : null);
|
3464
|
+
const [globalFilterFn, setGlobalFilterFn] = react.useState((_h = initialState.globalFilterFn) !== null && _h !== void 0 ? _h : 'fuzzy');
|
3465
|
+
const [grouping, setGrouping] = react.useState((_j = initialState.grouping) !== null && _j !== void 0 ? _j : []);
|
3466
|
+
const [hoveredColumn, setHoveredColumn] = react.useState((_k = initialState.hoveredColumn) !== null && _k !== void 0 ? _k : null);
|
3467
|
+
const [hoveredRow, setHoveredRow] = react.useState((_l = initialState.hoveredRow) !== null && _l !== void 0 ? _l : null);
|
3468
|
+
const [isFullScreen, setIsFullScreen] = react.useState((_m = initialState === null || initialState === void 0 ? void 0 : initialState.isFullScreen) !== null && _m !== void 0 ? _m : false);
|
3469
|
+
const [showAlertBanner, setShowAlertBanner] = react.useState((_p = (_o = tableOptions.initialState) === null || _o === void 0 ? void 0 : _o.showAlertBanner) !== null && _p !== void 0 ? _p : false);
|
3470
|
+
const [showColumnFilters, setShowColumnFilters] = react.useState((_q = initialState === null || initialState === void 0 ? void 0 : initialState.showColumnFilters) !== null && _q !== void 0 ? _q : false);
|
3471
|
+
const [showGlobalFilter, setShowGlobalFilter] = react.useState((_r = initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) !== null && _r !== void 0 ? _r : false);
|
3472
|
+
const [showToolbarDropZone, setShowToolbarDropZone] = react.useState((_s = initialState === null || initialState === void 0 ? void 0 : initialState.showToolbarDropZone) !== null && _s !== void 0 ? _s : false);
|
3473
|
+
const displayColumns = useMRT_DisplayColumns({
|
3474
|
+
columnOrder,
|
3475
|
+
creatingRow,
|
3476
|
+
grouping,
|
3477
|
+
tableOptions,
|
3478
|
+
});
|
3479
|
+
const columnDefs = react.useMemo(() => {
|
3480
|
+
var _a, _b, _c;
|
3481
|
+
return prepareColumns({
|
3482
|
+
aggregationFns: tableOptions.aggregationFns,
|
3483
|
+
columnDefs: [...displayColumns, ...tableOptions.columns],
|
3484
|
+
columnFilterFns: (_b = (_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.columnFilterFns) !== null && _b !== void 0 ? _b : columnFilterFns,
|
3485
|
+
defaultDisplayColumn: (_c = tableOptions.defaultDisplayColumn) !== null && _c !== void 0 ? _c : {},
|
3486
|
+
filterFns: tableOptions.filterFns,
|
3487
|
+
sortingFns: tableOptions.sortingFns,
|
3488
|
+
});
|
3489
|
+
}, [
|
3490
|
+
columnFilterFns,
|
3491
|
+
displayColumns,
|
3492
|
+
tableOptions.columns,
|
3493
|
+
(_t = tableOptions.state) === null || _t === void 0 ? void 0 : _t.columnFilterFns,
|
3494
|
+
]);
|
3495
|
+
const data = react.useMemo(() => {
|
3496
|
+
var _a, _b, _c, _d, _e;
|
3497
|
+
return (((_a = tableOptions.state) === null || _a === void 0 ? void 0 : _a.isLoading) || ((_b = tableOptions.state) === null || _b === void 0 ? void 0 : _b.showSkeletons)) &&
|
3498
|
+
!tableOptions.data.length
|
3499
|
+
? [
|
3500
|
+
...Array(((_d = (_c = tableOptions.state) === null || _c === void 0 ? void 0 : _c.pagination) === null || _d === void 0 ? void 0 : _d.pageSize) ||
|
3501
|
+
((_e = initialState === null || initialState === void 0 ? void 0 : initialState.pagination) === null || _e === void 0 ? void 0 : _e.pageSize) ||
|
3502
|
+
10).fill(null),
|
3503
|
+
].map(() => Object.assign({}, ...getAllLeafColumnDefs(tableOptions.columns).map((col) => ({
|
3504
|
+
[getColumnId(col)]: null,
|
3505
|
+
}))))
|
3506
|
+
: tableOptions.data;
|
3507
|
+
}, [
|
3508
|
+
tableOptions.data,
|
3509
|
+
(_u = tableOptions.state) === null || _u === void 0 ? void 0 : _u.isLoading,
|
3510
|
+
(_v = tableOptions.state) === null || _v === void 0 ? void 0 : _v.showSkeletons,
|
3511
|
+
]);
|
3512
|
+
//@ts-ignore
|
3513
|
+
const table = reactTable.useReactTable(Object.assign(Object.assign({ getCoreRowModel: reactTable.getCoreRowModel(), getExpandedRowModel: tableOptions.enableExpanding || tableOptions.enableGrouping
|
3514
|
+
? reactTable.getExpandedRowModel()
|
3515
|
+
: undefined, getFacetedMinMaxValues: tableOptions.enableFacetedValues
|
3516
|
+
? reactTable.getFacetedMinMaxValues()
|
3517
|
+
: undefined, getFacetedRowModel: tableOptions.enableFacetedValues
|
3518
|
+
? reactTable.getFacetedRowModel()
|
3519
|
+
: undefined, getFacetedUniqueValues: tableOptions.enableFacetedValues
|
3520
|
+
? reactTable.getFacetedUniqueValues()
|
3521
|
+
: undefined, getFilteredRowModel: tableOptions.enableColumnFilters ||
|
3522
|
+
tableOptions.enableGlobalFilter ||
|
3523
|
+
tableOptions.enableFilters
|
3524
|
+
? reactTable.getFilteredRowModel()
|
3525
|
+
: undefined, getGroupedRowModel: tableOptions.enableGrouping
|
3526
|
+
? reactTable.getGroupedRowModel()
|
3527
|
+
: undefined, getPaginationRowModel: tableOptions.enablePagination
|
3528
|
+
? reactTable.getPaginationRowModel()
|
3529
|
+
: undefined, getSortedRowModel: tableOptions.enableSorting
|
3530
|
+
? reactTable.getSortedRowModel()
|
3531
|
+
: undefined, getSubRows: (row) => row === null || row === void 0 ? void 0 : row.subRows, onColumnOrderChange: setColumnOrder, onGroupingChange: setGrouping }, tableOptions), {
|
3532
|
+
//@ts-ignore
|
3533
|
+
columns: columnDefs, data, globalFilterFn: (_w = tableOptions.filterFns) === null || _w === void 0 ? void 0 : _w[globalFilterFn !== null && globalFilterFn !== void 0 ? globalFilterFn : 'fuzzy'], initialState, state: Object.assign({ columnFilterFns,
|
3534
|
+
columnOrder,
|
3535
|
+
creatingRow,
|
3536
|
+
density,
|
3537
|
+
draggingColumn,
|
3538
|
+
draggingRow,
|
3539
|
+
editingCell,
|
3540
|
+
editingRow,
|
3541
|
+
globalFilterFn,
|
3542
|
+
grouping,
|
3543
|
+
hoveredColumn,
|
3544
|
+
hoveredRow,
|
3545
|
+
isFullScreen,
|
3546
|
+
showAlertBanner,
|
3547
|
+
showColumnFilters,
|
3548
|
+
showGlobalFilter,
|
3549
|
+
showToolbarDropZone }, tableOptions.state) }));
|
3550
|
+
// @ts-ignore
|
3551
|
+
table.refs = {
|
3552
|
+
// @ts-ignore
|
3553
|
+
bottomToolbarRef,
|
3554
|
+
editInputRefs,
|
3555
|
+
filterInputRefs,
|
3556
|
+
// @ts-ignore
|
3557
|
+
searchInputRef,
|
3558
|
+
// @ts-ignore
|
3559
|
+
tableContainerRef,
|
3560
|
+
// @ts-ignore
|
3561
|
+
tableFooterRef,
|
3562
|
+
tableHeadCellRefs,
|
3563
|
+
// @ts-ignore
|
3564
|
+
tableHeadRef,
|
3565
|
+
// @ts-ignore
|
3566
|
+
tablePaperRef,
|
3567
|
+
// @ts-ignore
|
3568
|
+
topToolbarRef,
|
3569
|
+
};
|
3570
|
+
const setCreatingRow = (row) => {
|
3571
|
+
var _a, _b;
|
3572
|
+
let _row = row;
|
3573
|
+
if (row === true) {
|
3574
|
+
_row = createRow(table);
|
3575
|
+
}
|
3576
|
+
(_b = (_a = tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.onCreatingRowChange) === null || _a === void 0 ? void 0 : _a.call(tableOptions, _row)) !== null && _b !== void 0 ? _b : _setCreatingRow(_row);
|
3577
|
+
};
|
3578
|
+
table.setCreatingRow = setCreatingRow;
|
3579
|
+
table.setColumnFilterFns =
|
3580
|
+
(_x = tableOptions.onColumnFilterFnsChange) !== null && _x !== void 0 ? _x : setColumnFilterFns;
|
3581
|
+
table.setDensity = (_y = tableOptions.onDensityChange) !== null && _y !== void 0 ? _y : setDensity;
|
3582
|
+
table.setDraggingColumn =
|
3583
|
+
(_z = tableOptions.onDraggingColumnChange) !== null && _z !== void 0 ? _z : setDraggingColumn;
|
3584
|
+
table.setDraggingRow = (_0 = tableOptions.onDraggingRowChange) !== null && _0 !== void 0 ? _0 : setDraggingRow;
|
3585
|
+
table.setEditingCell = (_1 = tableOptions.onEditingCellChange) !== null && _1 !== void 0 ? _1 : setEditingCell;
|
3586
|
+
table.setEditingRow = (_2 = tableOptions.onEditingRowChange) !== null && _2 !== void 0 ? _2 : setEditingRow;
|
3587
|
+
table.setGlobalFilterFn =
|
3588
|
+
(_3 = tableOptions.onGlobalFilterFnChange) !== null && _3 !== void 0 ? _3 : setGlobalFilterFn;
|
3589
|
+
table.setHoveredColumn =
|
3590
|
+
(_4 = tableOptions.onHoveredColumnChange) !== null && _4 !== void 0 ? _4 : setHoveredColumn;
|
3591
|
+
table.setHoveredRow = (_5 = tableOptions.onHoveredRowChange) !== null && _5 !== void 0 ? _5 : setHoveredRow;
|
3592
|
+
table.setIsFullScreen = (_6 = tableOptions.onIsFullScreenChange) !== null && _6 !== void 0 ? _6 : setIsFullScreen;
|
3593
|
+
table.setShowAlertBanner =
|
3594
|
+
(_7 = tableOptions.onShowAlertBannerChange) !== null && _7 !== void 0 ? _7 : setShowAlertBanner;
|
3595
|
+
table.setShowColumnFilters =
|
3596
|
+
(_8 = tableOptions.onShowColumnFiltersChange) !== null && _8 !== void 0 ? _8 : setShowColumnFilters;
|
3597
|
+
table.setShowGlobalFilter =
|
3598
|
+
(_9 = tableOptions.onShowGlobalFilterChange) !== null && _9 !== void 0 ? _9 : setShowGlobalFilter;
|
3599
|
+
table.setShowToolbarDropZone =
|
3600
|
+
(_10 = tableOptions.onShowToolbarDropZoneChange) !== null && _10 !== void 0 ? _10 : setShowToolbarDropZone;
|
3601
|
+
useMRT_Effects(table);
|
3602
|
+
return table;
|
3603
|
+
};
|
3604
|
+
|
3610
3605
|
const useMaterialReactTable = (tableOptions) => useMRT_TableInstance(useMRT_TableOptions(tableOptions));
|
3611
3606
|
|
3612
3607
|
const isTableInstanceProp = (props) => props.table !== undefined;
|