material-react-table 2.9.1 → 2.10.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.d.ts +162 -111
- package/dist/index.esm.js +739 -639
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +741 -639
- package/dist/index.js.map +1 -1
- package/locales/ar/index.esm.js +1 -0
- package/locales/ar/index.js +1 -0
- package/locales/az/index.esm.js +1 -0
- package/locales/az/index.js +1 -0
- package/locales/bg/index.esm.js +1 -0
- package/locales/bg/index.js +1 -0
- package/locales/cs/index.esm.js +1 -0
- package/locales/cs/index.js +1 -0
- package/locales/da/index.esm.js +1 -0
- package/locales/da/index.js +1 -0
- package/locales/de/index.esm.js +1 -0
- package/locales/de/index.js +1 -0
- package/locales/en/index.esm.js +1 -0
- package/locales/en/index.js +1 -0
- package/locales/es/index.esm.js +1 -0
- package/locales/es/index.js +1 -0
- package/locales/et/index.esm.js +1 -0
- package/locales/et/index.js +1 -0
- package/locales/fa/index.esm.js +1 -0
- package/locales/fa/index.js +1 -0
- package/locales/fi/index.esm.js +1 -0
- package/locales/fi/index.js +1 -0
- package/locales/fr/index.esm.js +1 -0
- package/locales/fr/index.js +1 -0
- package/locales/he/index.esm.js +1 -0
- package/locales/he/index.js +1 -0
- package/locales/hu/index.esm.js +1 -0
- package/locales/hu/index.js +1 -0
- package/locales/hy/index.esm.js +1 -0
- package/locales/hy/index.js +1 -0
- package/locales/id/index.esm.js +1 -0
- package/locales/id/index.js +1 -0
- package/locales/it/index.esm.js +1 -0
- package/locales/it/index.js +1 -0
- package/locales/ja/index.esm.js +1 -0
- package/locales/ja/index.js +1 -0
- package/locales/ko/index.esm.js +1 -0
- package/locales/ko/index.js +1 -0
- package/locales/nl/index.esm.js +1 -0
- package/locales/nl/index.js +1 -0
- package/locales/no/index.esm.js +1 -0
- package/locales/no/index.js +1 -0
- package/locales/np/index.esm.js +1 -0
- package/locales/np/index.js +1 -0
- package/locales/pl/index.esm.js +1 -0
- package/locales/pl/index.js +1 -0
- package/locales/pt/index.esm.js +1 -0
- package/locales/pt/index.js +1 -0
- package/locales/pt-BR/index.esm.js +1 -0
- package/locales/pt-BR/index.js +1 -0
- package/locales/ro/index.esm.js +1 -0
- package/locales/ro/index.js +1 -0
- package/locales/ru/index.esm.js +1 -0
- package/locales/ru/index.js +1 -0
- package/locales/sk/index.esm.js +1 -0
- package/locales/sk/index.js +1 -0
- package/locales/sr-Cyrl-RS/index.esm.js +1 -0
- package/locales/sr-Cyrl-RS/index.js +1 -0
- package/locales/sr-Latn-RS/index.esm.js +1 -0
- package/locales/sr-Latn-RS/index.js +1 -0
- package/locales/sv/index.esm.js +1 -0
- package/locales/sv/index.js +1 -0
- package/locales/tr/index.esm.js +1 -0
- package/locales/tr/index.js +1 -0
- package/locales/uk/index.esm.js +1 -0
- package/locales/uk/index.js +1 -0
- package/locales/vi/index.esm.js +1 -0
- package/locales/vi/index.js +1 -0
- package/locales/zh-Hans/index.esm.js +1 -0
- package/locales/zh-Hans/index.js +1 -0
- package/locales/zh-Hant/index.esm.js +1 -0
- package/locales/zh-Hant/index.js +1 -0
- package/package.json +11 -11
- package/src/components/body/MRT_TableBodyCell.tsx +41 -37
- package/src/components/body/MRT_TableBodyRow.tsx +15 -21
- package/src/components/buttons/MRT_CopyButton.tsx +1 -0
- package/src/components/footer/MRT_TableFooter.tsx +1 -1
- package/src/components/footer/MRT_TableFooterCell.tsx +2 -4
- package/src/components/footer/MRT_TableFooterRow.tsx +1 -0
- package/src/components/head/MRT_TableHeadCell.tsx +6 -6
- package/src/components/head/MRT_TableHeadCellFilterLabel.tsx +1 -0
- package/src/components/head/MRT_TableHeadRow.tsx +6 -1
- package/src/components/inputs/MRT_EditCellTextField.tsx +4 -1
- package/src/components/inputs/MRT_FilterTextField.tsx +1 -0
- package/src/components/menus/MRT_ActionMenuItem.tsx +60 -0
- package/src/components/menus/MRT_CellActionMenu.tsx +108 -0
- package/src/components/menus/MRT_ColumnActionMenu.tsx +90 -170
- package/src/components/menus/MRT_FilterOptionMenu.tsx +7 -14
- package/src/components/menus/MRT_RowActionMenu.tsx +8 -15
- package/src/components/menus/MRT_ShowHideColumnsMenu.tsx +4 -1
- package/src/components/table/MRT_Table.tsx +1 -0
- package/src/components/table/MRT_TableContainer.tsx +4 -0
- package/src/components/toolbar/MRT_TablePagination.tsx +14 -5
- package/src/hooks/display-columns/getMRT_RowActionsColumnDef.tsx +1 -8
- package/src/hooks/display-columns/getMRT_RowDragColumnDef.tsx +1 -8
- package/src/hooks/display-columns/getMRT_RowExpandColumnDef.tsx +1 -8
- package/src/hooks/display-columns/getMRT_RowNumbersColumnDef.tsx +1 -8
- package/src/hooks/display-columns/getMRT_RowPinningColumnDef.tsx +1 -8
- package/src/hooks/display-columns/getMRT_RowSelectColumnDef.tsx +1 -8
- package/src/hooks/display-columns/getMRT_RowSpacerColumnDef.tsx +1 -8
- package/src/hooks/useMRT_Effects.ts +10 -0
- package/src/hooks/useMRT_TableInstance.ts +112 -59
- package/src/icons.ts +2 -0
- package/src/index.ts +2 -0
- package/src/locales/ar.ts +1 -0
- package/src/locales/az.ts +1 -0
- package/src/locales/bg.ts +1 -0
- package/src/locales/cs.ts +1 -0
- package/src/locales/da.ts +1 -0
- package/src/locales/de.ts +1 -0
- package/src/locales/en.ts +1 -0
- package/src/locales/es.ts +1 -0
- package/src/locales/et.ts +1 -0
- package/src/locales/fa.ts +1 -0
- package/src/locales/fi.ts +1 -0
- package/src/locales/fr.ts +1 -0
- package/src/locales/he.ts +1 -0
- package/src/locales/hu.ts +1 -0
- package/src/locales/hy.ts +1 -0
- package/src/locales/id.ts +1 -0
- package/src/locales/it.ts +1 -0
- package/src/locales/ja.ts +1 -0
- package/src/locales/ko.ts +1 -0
- package/src/locales/nl.ts +1 -0
- package/src/locales/no.ts +1 -0
- package/src/locales/np.ts +1 -0
- package/src/locales/pl.ts +1 -0
- package/src/locales/pt-BR.ts +1 -0
- package/src/locales/pt.ts +1 -0
- package/src/locales/ro.ts +1 -0
- package/src/locales/ru.ts +1 -0
- package/src/locales/sk.ts +1 -0
- package/src/locales/sr-Cyrl-RS.ts +1 -0
- package/src/locales/sr-Latn-RS.ts +1 -0
- package/src/locales/sv.ts +1 -0
- package/src/locales/tr.ts +1 -0
- package/src/locales/uk.ts +1 -0
- package/src/locales/vi.ts +1 -0
- package/src/locales/zh-Hans.ts +1 -0
- package/src/locales/zh-Hant.ts +1 -0
- package/src/types.ts +41 -9
- package/src/utils/cell.utils.ts +50 -0
- package/src/utils/displayColumn.utils.ts +38 -20
- package/src/utils/style.utils.ts +17 -4
- package/src/hooks/display-columns/getMRT_DisplayColumns.tsx +0 -26
- package/src/locales/am.ts +0 -94
package/dist/index.js
CHANGED
@@ -12,8 +12,8 @@ var Box = require('@mui/material/Box');
|
|
12
12
|
var Button = require('@mui/material/Button');
|
13
13
|
var CircularProgress = require('@mui/material/CircularProgress');
|
14
14
|
var styles = require('@mui/material/styles');
|
15
|
-
var ListItemIcon = require('@mui/material/ListItemIcon');
|
16
15
|
var Menu = require('@mui/material/Menu');
|
16
|
+
var ListItemIcon = require('@mui/material/ListItemIcon');
|
17
17
|
var MenuItem = require('@mui/material/MenuItem');
|
18
18
|
var Stack = require('@mui/material/Stack');
|
19
19
|
var Checkbox = require('@mui/material/Checkbox');
|
@@ -25,6 +25,7 @@ var ChevronLeftIcon = require('@mui/icons-material/ChevronLeft');
|
|
25
25
|
var ChevronRightIcon = require('@mui/icons-material/ChevronRight');
|
26
26
|
var ClearAllIcon = require('@mui/icons-material/ClearAll');
|
27
27
|
var CloseIcon = require('@mui/icons-material/Close');
|
28
|
+
var ContentCopy = require('@mui/icons-material/ContentCopy');
|
28
29
|
var DensityLargeIcon = require('@mui/icons-material/DensityLarge');
|
29
30
|
var DensityMediumIcon = require('@mui/icons-material/DensityMedium');
|
30
31
|
var DensitySmallIcon = require('@mui/icons-material/DensitySmall');
|
@@ -102,8 +103,8 @@ var Tooltip__default = /*#__PURE__*/_interopDefaultLegacy(Tooltip);
|
|
102
103
|
var Box__default = /*#__PURE__*/_interopDefaultLegacy(Box);
|
103
104
|
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
|
104
105
|
var CircularProgress__default = /*#__PURE__*/_interopDefaultLegacy(CircularProgress);
|
105
|
-
var ListItemIcon__default = /*#__PURE__*/_interopDefaultLegacy(ListItemIcon);
|
106
106
|
var Menu__default = /*#__PURE__*/_interopDefaultLegacy(Menu);
|
107
|
+
var ListItemIcon__default = /*#__PURE__*/_interopDefaultLegacy(ListItemIcon);
|
107
108
|
var MenuItem__default = /*#__PURE__*/_interopDefaultLegacy(MenuItem);
|
108
109
|
var Stack__default = /*#__PURE__*/_interopDefaultLegacy(Stack);
|
109
110
|
var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox);
|
@@ -115,6 +116,7 @@ var ChevronLeftIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronLeftIco
|
|
115
116
|
var ChevronRightIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronRightIcon);
|
116
117
|
var ClearAllIcon__default = /*#__PURE__*/_interopDefaultLegacy(ClearAllIcon);
|
117
118
|
var CloseIcon__default = /*#__PURE__*/_interopDefaultLegacy(CloseIcon);
|
119
|
+
var ContentCopy__default = /*#__PURE__*/_interopDefaultLegacy(ContentCopy);
|
118
120
|
var DensityLargeIcon__default = /*#__PURE__*/_interopDefaultLegacy(DensityLargeIcon);
|
119
121
|
var DensityMediumIcon__default = /*#__PURE__*/_interopDefaultLegacy(DensityMediumIcon);
|
120
122
|
var DensitySmallIcon__default = /*#__PURE__*/_interopDefaultLegacy(DensitySmallIcon);
|
@@ -301,17 +303,58 @@ const createRow = (table, originalRow, rowIndex = -1, depth = 0, subRows, parent
|
|
301
303
|
[getColumnId(col)]: '',
|
302
304
|
}))), rowIndex, depth, subRows, parentId);
|
303
305
|
|
306
|
+
const parseFromValuesOrFunc = (fn, arg) => (fn instanceof Function ? fn(arg) : fn);
|
307
|
+
const getValueAndLabel = (option) => {
|
308
|
+
var _a, _b, _c;
|
309
|
+
let label = '';
|
310
|
+
let value = '';
|
311
|
+
if (option) {
|
312
|
+
if (typeof option !== 'object') {
|
313
|
+
label = option;
|
314
|
+
value = option;
|
315
|
+
}
|
316
|
+
else {
|
317
|
+
label = (_b = (_a = option.label) !== null && _a !== void 0 ? _a : option.text) !== null && _b !== void 0 ? _b : option.value;
|
318
|
+
value = (_c = option.value) !== null && _c !== void 0 ? _c : label;
|
319
|
+
}
|
320
|
+
}
|
321
|
+
return { label, value };
|
322
|
+
};
|
323
|
+
|
324
|
+
const isCellEditable = ({ cell, table, }) => {
|
325
|
+
const { enableEditing } = table.options;
|
326
|
+
const { column: { columnDef }, row, } = cell;
|
327
|
+
return (!cell.getIsPlaceholder() &&
|
328
|
+
parseFromValuesOrFunc(enableEditing, row) &&
|
329
|
+
parseFromValuesOrFunc(columnDef.enableEditing, row) !== false);
|
330
|
+
};
|
331
|
+
const openEditingCell = ({ cell, table, }) => {
|
332
|
+
const { options: { editDisplayMode }, refs: { editInputRefs }, } = table;
|
333
|
+
const { column } = cell;
|
334
|
+
if (isCellEditable({ cell, table }) && editDisplayMode === 'cell') {
|
335
|
+
table.setEditingCell(cell);
|
336
|
+
queueMicrotask(() => {
|
337
|
+
var _a;
|
338
|
+
const textField = editInputRefs.current[column.id];
|
339
|
+
if (textField) {
|
340
|
+
textField.focus();
|
341
|
+
(_a = textField.select) === null || _a === void 0 ? void 0 : _a.call(textField);
|
342
|
+
}
|
343
|
+
});
|
344
|
+
}
|
345
|
+
};
|
346
|
+
|
304
347
|
function defaultDisplayColumnProps({ header, id, size, tableOptions, }) {
|
305
348
|
const { defaultDisplayColumn, displayColumnDefOptions, localization } = tableOptions;
|
306
349
|
return Object.assign(Object.assign(Object.assign(Object.assign({}, defaultDisplayColumn), { header: header ? localization[header] : '', size }), displayColumnDefOptions === null || displayColumnDefOptions === void 0 ? void 0 : displayColumnDefOptions[id]), { id });
|
307
350
|
}
|
308
351
|
const showRowPinningColumn = (tableOptions) => {
|
309
352
|
const { enableRowPinning, rowPinningDisplayMode } = tableOptions;
|
310
|
-
return enableRowPinning && !(rowPinningDisplayMode === null || rowPinningDisplayMode === void 0 ? void 0 : rowPinningDisplayMode.startsWith('select'));
|
353
|
+
return !!(enableRowPinning && !(rowPinningDisplayMode === null || rowPinningDisplayMode === void 0 ? void 0 : rowPinningDisplayMode.startsWith('select')));
|
311
354
|
};
|
312
355
|
const showRowDragColumn = (tableOptions) => {
|
313
356
|
const { enableRowDragging, enableRowOrdering } = tableOptions;
|
314
|
-
return enableRowDragging || enableRowOrdering;
|
357
|
+
return !!(enableRowDragging || enableRowOrdering);
|
315
358
|
};
|
316
359
|
const showRowExpandColumn = (tableOptions) => {
|
317
360
|
const { enableExpanding, enableGrouping, renderDetailPanel, state: { grouping }, } = tableOptions;
|
@@ -321,12 +364,12 @@ const showRowExpandColumn = (tableOptions) => {
|
|
321
364
|
};
|
322
365
|
const showRowActionsColumn = (tableOptions) => {
|
323
366
|
const { createDisplayMode, editDisplayMode, enableEditing, enableRowActions, state: { creatingRow }, } = tableOptions;
|
324
|
-
return (enableRowActions ||
|
367
|
+
return !!(enableRowActions ||
|
325
368
|
(creatingRow && createDisplayMode === 'row') ||
|
326
369
|
(enableEditing && ['modal', 'row'].includes(editDisplayMode !== null && editDisplayMode !== void 0 ? editDisplayMode : '')));
|
327
370
|
};
|
328
|
-
const showRowSelectionColumn = (tableOptions) => tableOptions.enableRowSelection;
|
329
|
-
const showRowNumbersColumn = (tableOptions) => tableOptions.enableRowNumbers;
|
371
|
+
const showRowSelectionColumn = (tableOptions) => !!tableOptions.enableRowSelection;
|
372
|
+
const showRowNumbersColumn = (tableOptions) => !!tableOptions.enableRowNumbers;
|
330
373
|
const showRowSpacerColumn = (tableOptions) => tableOptions.layoutMode === 'grid-no-grow';
|
331
374
|
const getLeadingDisplayColumnIds = (tableOptions) => [
|
332
375
|
showRowPinningColumn(tableOptions) && 'mrt-row-pin',
|
@@ -349,32 +392,21 @@ const getTrailingDisplayColumnIds = (tableOptions) => [
|
|
349
392
|
'mrt-row-expand',
|
350
393
|
showRowSpacerColumn(tableOptions) && 'mrt-row-spacer',
|
351
394
|
].filter(Boolean);
|
352
|
-
const getDefaultColumnOrderIds = (tableOptions) => {
|
353
|
-
const
|
354
|
-
const
|
355
|
-
const
|
356
|
-
|
357
|
-
|
358
|
-
|
359
|
-
|
360
|
-
|
361
|
-
|
362
|
-
|
363
|
-
|
364
|
-
|
365
|
-
|
366
|
-
|
367
|
-
if (option) {
|
368
|
-
if (typeof option !== 'object') {
|
369
|
-
label = option;
|
370
|
-
value = option;
|
371
|
-
}
|
372
|
-
else {
|
373
|
-
label = (_b = (_a = option.label) !== null && _a !== void 0 ? _a : option.text) !== null && _b !== void 0 ? _b : option.value;
|
374
|
-
value = (_c = option.value) !== null && _c !== void 0 ? _c : label;
|
375
|
-
}
|
376
|
-
}
|
377
|
-
return { label, value };
|
395
|
+
const getDefaultColumnOrderIds = (tableOptions, reset = false) => {
|
396
|
+
const { state: { columnOrder: currentColumnOrderIds = [] }, } = tableOptions;
|
397
|
+
const leadingDisplayColIds = getLeadingDisplayColumnIds(tableOptions);
|
398
|
+
const trailingDisplayColIds = getTrailingDisplayColumnIds(tableOptions);
|
399
|
+
const defaultColumnDefIds = getAllLeafColumnDefs(tableOptions.columns).map((columnDef) => getColumnId(columnDef));
|
400
|
+
let allLeafColumnDefIds = reset
|
401
|
+
? defaultColumnDefIds
|
402
|
+
: Array.from(new Set([...currentColumnOrderIds, ...defaultColumnDefIds]));
|
403
|
+
allLeafColumnDefIds = allLeafColumnDefIds.filter((colId) => !leadingDisplayColIds.includes(colId) &&
|
404
|
+
!trailingDisplayColIds.includes(colId));
|
405
|
+
return [
|
406
|
+
...leadingDisplayColIds,
|
407
|
+
...allLeafColumnDefIds,
|
408
|
+
...trailingDisplayColIds,
|
409
|
+
];
|
378
410
|
};
|
379
411
|
|
380
412
|
const getIsRowSelected = ({ row, table, }) => {
|
@@ -589,7 +621,7 @@ const getMRTTheme = (table, theme) => {
|
|
589
621
|
? styles.darken(theme.palette.warning.dark, 0.25)
|
590
622
|
: styles.lighten(theme.palette.warning.light, 0.5), menuBackgroundColor: styles.lighten(baseBackgroundColor, 0.07), pinnedRowBackgroundColor: styles.alpha(theme.palette.primary.main, 0.1), selectedRowBackgroundColor: styles.alpha(theme.palette.primary.main, 0.2) }, themeOverrides);
|
591
623
|
};
|
592
|
-
const
|
624
|
+
const commonCellBeforeAfterStyles = {
|
593
625
|
content: '""',
|
594
626
|
height: '100%',
|
595
627
|
left: 0,
|
@@ -608,14 +640,16 @@ const getCommonPinnedCellStyles = ({ column, table, theme, }) => {
|
|
608
640
|
: getIsFirstRightPinnedColumn(column)
|
609
641
|
? `4px 0 4px -4px ${styles.alpha(theme.palette.grey[700], 0.5)} inset`
|
610
642
|
: undefined
|
611
|
-
: undefined },
|
643
|
+
: undefined }, commonCellBeforeAfterStyles),
|
612
644
|
},
|
613
645
|
};
|
614
646
|
};
|
615
647
|
const getCommonMRTCellStyles = ({ column, header, table, tableCellProps, theme, }) => {
|
616
648
|
var _a, _b, _c, _d, _e, _f;
|
617
|
-
const { options: { enableColumnVirtualization, layoutMode }, } = table;
|
649
|
+
const { getState, options: { enableColumnVirtualization, layoutMode }, } = table;
|
650
|
+
const { draggingColumn } = getState();
|
618
651
|
const { columnDef } = column;
|
652
|
+
const { columnDefType } = columnDef;
|
619
653
|
const isColumnPinned = columnDef.columnDefType !== 'group' && column.getIsPinned();
|
620
654
|
const widthStyles = {
|
621
655
|
minWidth: `max(calc(var(--${header ? 'header' : 'col'}-${parseCSSVarId((_a = header === null || header === void 0 ? void 0 : header.id) !== null && _a !== void 0 ? _a : column.id)}-size) * 1px), ${(_b = columnDef.minSize) !== null && _b !== void 0 ? _b : 30}px)`,
|
@@ -634,13 +668,21 @@ const getCommonMRTCellStyles = ({ column, header, table, tableCellProps, theme,
|
|
634
668
|
? `${column.getStart('left')}px`
|
635
669
|
: undefined, opacity: 0.97, position: 'sticky', right: isColumnPinned === 'right'
|
636
670
|
? `${getTotalRight(table, column)}px`
|
637
|
-
: undefined
|
638
|
-
return Object.assign(Object.assign(Object.assign({ backgroundColor: 'inherit', backgroundImage: 'inherit', display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'flex' : undefined,
|
671
|
+
: undefined }) : {};
|
672
|
+
return Object.assign(Object.assign(Object.assign({ backgroundColor: 'inherit', backgroundImage: 'inherit', display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'flex' : undefined, justifyContent: columnDefType === 'group'
|
673
|
+
? 'center'
|
674
|
+
: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid'))
|
675
|
+
? tableCellProps.align
|
676
|
+
: undefined, opacity: ((_e = table.getState().draggingColumn) === null || _e === void 0 ? void 0 : _e.id) === column.id ||
|
639
677
|
((_f = table.getState().hoveredColumn) === null || _f === void 0 ? void 0 : _f.id) === column.id
|
640
678
|
? 0.5
|
641
679
|
: 1, position: 'relative', transition: enableColumnVirtualization
|
642
680
|
? 'none'
|
643
|
-
: `padding 150ms ease-in-out`, zIndex:
|
681
|
+
: `padding 150ms ease-in-out`, zIndex: column.getIsResizing() || (draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.id) === column.id
|
682
|
+
? 2
|
683
|
+
: columnDefType !== 'group' && isColumnPinned
|
684
|
+
? 1
|
685
|
+
: 0 }, pinnedStyles), widthStyles), parseFromValuesOrFunc(tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.sx, theme));
|
644
686
|
};
|
645
687
|
const getCommonToolbarStyles = ({ table, theme, }) => ({
|
646
688
|
alignItems: 'flex-start',
|
@@ -663,355 +705,19 @@ const getCommonTooltipProps = (placement) => ({
|
|
663
705
|
placement,
|
664
706
|
});
|
665
707
|
|
666
|
-
const
|
667
|
-
{
|
668
|
-
|
669
|
-
|
670
|
-
|
671
|
-
|
672
|
-
|
673
|
-
|
674
|
-
|
675
|
-
|
676
|
-
|
677
|
-
|
678
|
-
|
679
|
-
{
|
680
|
-
divider: false,
|
681
|
-
label: localization.filterStartsWith,
|
682
|
-
option: 'startsWith',
|
683
|
-
symbol: 'a',
|
684
|
-
},
|
685
|
-
{
|
686
|
-
divider: true,
|
687
|
-
label: localization.filterEndsWith,
|
688
|
-
option: 'endsWith',
|
689
|
-
symbol: 'z',
|
690
|
-
},
|
691
|
-
{
|
692
|
-
divider: false,
|
693
|
-
label: localization.filterEquals,
|
694
|
-
option: 'equals',
|
695
|
-
symbol: '=',
|
696
|
-
},
|
697
|
-
{
|
698
|
-
divider: true,
|
699
|
-
label: localization.filterNotEquals,
|
700
|
-
option: 'notEquals',
|
701
|
-
symbol: '≠',
|
702
|
-
},
|
703
|
-
{
|
704
|
-
divider: false,
|
705
|
-
label: localization.filterBetween,
|
706
|
-
option: 'between',
|
707
|
-
symbol: '⇿',
|
708
|
-
},
|
709
|
-
{
|
710
|
-
divider: true,
|
711
|
-
label: localization.filterBetweenInclusive,
|
712
|
-
option: 'betweenInclusive',
|
713
|
-
symbol: '⬌',
|
714
|
-
},
|
715
|
-
{
|
716
|
-
divider: false,
|
717
|
-
label: localization.filterGreaterThan,
|
718
|
-
option: 'greaterThan',
|
719
|
-
symbol: '>',
|
720
|
-
},
|
721
|
-
{
|
722
|
-
divider: false,
|
723
|
-
label: localization.filterGreaterThanOrEqualTo,
|
724
|
-
option: 'greaterThanOrEqualTo',
|
725
|
-
symbol: '≥',
|
726
|
-
},
|
727
|
-
{
|
728
|
-
divider: false,
|
729
|
-
label: localization.filterLessThan,
|
730
|
-
option: 'lessThan',
|
731
|
-
symbol: '<',
|
732
|
-
},
|
733
|
-
{
|
734
|
-
divider: true,
|
735
|
-
label: localization.filterLessThanOrEqualTo,
|
736
|
-
option: 'lessThanOrEqualTo',
|
737
|
-
symbol: '≤',
|
738
|
-
},
|
739
|
-
{
|
740
|
-
divider: false,
|
741
|
-
label: localization.filterEmpty,
|
742
|
-
option: 'empty',
|
743
|
-
symbol: '∅',
|
744
|
-
},
|
745
|
-
{
|
746
|
-
divider: false,
|
747
|
-
label: localization.filterNotEmpty,
|
748
|
-
option: 'notEmpty',
|
749
|
-
symbol: '!∅',
|
750
|
-
},
|
751
|
-
];
|
752
|
-
const rangeModes = ['between', 'betweenInclusive', 'inNumberRange'];
|
753
|
-
const emptyModes = ['empty', 'notEmpty'];
|
754
|
-
const arrModes = ['arrIncludesSome', 'arrIncludesAll', 'arrIncludes'];
|
755
|
-
const rangeVariants = ['range-slider', 'date-range', 'datetime-range', 'range'];
|
756
|
-
const MRT_FilterOptionMenu = (_a) => {
|
757
|
-
var _b, _c, _d, _e;
|
758
|
-
var { anchorEl, header, onSelect, setAnchorEl, setFilterValue, table } = _a, rest = __rest(_a, ["anchorEl", "header", "onSelect", "setAnchorEl", "setFilterValue", "table"]);
|
759
|
-
const { getState, options: { columnFilterModeOptions, globalFilterModeOptions, localization, renderColumnFilterModeMenuItems, renderGlobalFilterModeMenuItems, }, setColumnFilterFns, setGlobalFilterFn, } = table;
|
760
|
-
const { density, globalFilterFn } = getState();
|
761
|
-
const { column } = header !== null && header !== void 0 ? header : {};
|
762
|
-
const { columnDef } = column !== null && column !== void 0 ? column : {};
|
763
|
-
const currentFilterValue = column === null || column === void 0 ? void 0 : column.getFilterValue();
|
764
|
-
let allowedColumnFilterOptions = (_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.columnFilterModeOptions) !== null && _b !== void 0 ? _b : columnFilterModeOptions;
|
765
|
-
if (rangeVariants.includes(columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant)) {
|
766
|
-
allowedColumnFilterOptions = [
|
767
|
-
...rangeModes,
|
768
|
-
...(allowedColumnFilterOptions !== null && allowedColumnFilterOptions !== void 0 ? allowedColumnFilterOptions : []),
|
769
|
-
].filter((option) => rangeModes.includes(option));
|
770
|
-
}
|
771
|
-
const internalFilterOptions = react.useMemo(() => mrtFilterOptions(localization).filter((filterOption) => columnDef
|
772
|
-
? allowedColumnFilterOptions === undefined ||
|
773
|
-
(allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions.includes(filterOption.option))
|
774
|
-
: (!globalFilterModeOptions ||
|
775
|
-
globalFilterModeOptions.includes(filterOption.option)) &&
|
776
|
-
['contains', 'fuzzy', 'startsWith'].includes(filterOption.option)), []);
|
777
|
-
const handleSelectFilterMode = (option) => {
|
778
|
-
var _a, _b;
|
779
|
-
const prevFilterMode = (_a = columnDef === null || columnDef === void 0 ? void 0 : columnDef._filterFn) !== null && _a !== void 0 ? _a : '';
|
780
|
-
if (!header || !column) {
|
781
|
-
// global filter mode
|
782
|
-
setGlobalFilterFn(option);
|
783
|
-
}
|
784
|
-
else if (option !== prevFilterMode) {
|
785
|
-
// column filter mode
|
786
|
-
setColumnFilterFns((prev) => (Object.assign(Object.assign({}, prev), { [header.id]: option })));
|
787
|
-
// reset filter value and/or perform new filter render
|
788
|
-
if (emptyModes.includes(option)) {
|
789
|
-
// will now be empty/notEmpty filter mode
|
790
|
-
if (currentFilterValue !== ' ' &&
|
791
|
-
!emptyModes.includes(prevFilterMode)) {
|
792
|
-
column.setFilterValue(' ');
|
793
|
-
}
|
794
|
-
else if (currentFilterValue) {
|
795
|
-
column.setFilterValue(currentFilterValue); // perform new filter render
|
796
|
-
}
|
797
|
-
}
|
798
|
-
else if ((columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === 'multi-select' ||
|
799
|
-
arrModes.includes(option)) {
|
800
|
-
// will now be array filter mode
|
801
|
-
if (currentFilterValue instanceof String ||
|
802
|
-
(currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.length)) {
|
803
|
-
column.setFilterValue([]);
|
804
|
-
setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue([]);
|
805
|
-
}
|
806
|
-
else if (currentFilterValue) {
|
807
|
-
column.setFilterValue(currentFilterValue); // perform new filter render
|
808
|
-
}
|
809
|
-
}
|
810
|
-
else if (((_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === null || _b === void 0 ? void 0 : _b.includes('range')) ||
|
811
|
-
rangeModes.includes(option)) {
|
812
|
-
// will now be range filter mode
|
813
|
-
if (!Array.isArray(currentFilterValue) ||
|
814
|
-
(!(currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.every((v) => v === '')) &&
|
815
|
-
!rangeModes.includes(prevFilterMode))) {
|
816
|
-
column.setFilterValue(['', '']);
|
817
|
-
setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue('');
|
818
|
-
}
|
819
|
-
else {
|
820
|
-
column.setFilterValue(currentFilterValue); // perform new filter render
|
821
|
-
}
|
822
|
-
}
|
823
|
-
else {
|
824
|
-
// will now be single value filter mode
|
825
|
-
if (Array.isArray(currentFilterValue)) {
|
826
|
-
column.setFilterValue('');
|
827
|
-
setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue('');
|
828
|
-
}
|
829
|
-
else if (currentFilterValue === ' ' &&
|
830
|
-
emptyModes.includes(prevFilterMode)) {
|
831
|
-
column.setFilterValue(undefined);
|
832
|
-
}
|
833
|
-
else {
|
834
|
-
column.setFilterValue(currentFilterValue); // perform new filter render
|
835
|
-
}
|
836
|
-
}
|
837
|
-
}
|
838
|
-
setAnchorEl(null);
|
839
|
-
onSelect === null || onSelect === void 0 ? void 0 : onSelect();
|
840
|
-
};
|
841
|
-
const filterOption = !!header && columnDef ? columnDef._filterFn : globalFilterFn;
|
842
|
-
const theme = styles.useTheme();
|
843
|
-
const { menuBackgroundColor } = getMRTTheme(table, theme);
|
844
|
-
return (jsxRuntime.jsx(Menu__default["default"], Object.assign({ MenuListProps: {
|
845
|
-
dense: density === 'compact',
|
846
|
-
sx: {
|
847
|
-
backgroundColor: menuBackgroundColor,
|
848
|
-
},
|
849
|
-
}, anchorEl: anchorEl, anchorOrigin: { horizontal: 'right', vertical: 'center' }, onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: (_e = (header && column && columnDef
|
850
|
-
? (_d = (_c = columnDef.renderColumnFilterModeMenuItems) === null || _c === void 0 ? void 0 : _c.call(columnDef, {
|
851
|
-
column: column,
|
852
|
-
internalFilterOptions,
|
853
|
-
onSelectFilterMode: handleSelectFilterMode,
|
854
|
-
table,
|
855
|
-
})) !== null && _d !== void 0 ? _d : renderColumnFilterModeMenuItems === null || renderColumnFilterModeMenuItems === void 0 ? void 0 : renderColumnFilterModeMenuItems({
|
856
|
-
column: column,
|
857
|
-
internalFilterOptions,
|
858
|
-
onSelectFilterMode: handleSelectFilterMode,
|
859
|
-
table,
|
860
|
-
})
|
861
|
-
: renderGlobalFilterModeMenuItems === null || renderGlobalFilterModeMenuItems === void 0 ? void 0 : renderGlobalFilterModeMenuItems({
|
862
|
-
internalFilterOptions,
|
863
|
-
onSelectFilterMode: handleSelectFilterMode,
|
864
|
-
table,
|
865
|
-
}))) !== null && _e !== void 0 ? _e : internalFilterOptions.map(({ divider, label, option, symbol }, index) => (jsxRuntime.jsxs(MenuItem__default["default"], { divider: divider, onClick: () => handleSelectFilterMode(option), selected: option === filterOption, sx: {
|
866
|
-
alignItems: 'center',
|
867
|
-
display: 'flex',
|
868
|
-
gap: '2ch',
|
869
|
-
my: 0,
|
870
|
-
py: '6px',
|
871
|
-
}, value: option, children: [jsxRuntime.jsx(Box__default["default"], { sx: { fontSize: '1.25rem', width: '2ch' }, children: symbol }), label] }, index))) })));
|
872
|
-
};
|
873
|
-
|
874
|
-
const commonMenuItemStyles = {
|
875
|
-
alignItems: 'center',
|
876
|
-
justifyContent: 'space-between',
|
877
|
-
my: 0,
|
878
|
-
py: '6px',
|
879
|
-
};
|
880
|
-
const commonListItemStyles = {
|
881
|
-
alignItems: 'center',
|
882
|
-
display: 'flex',
|
883
|
-
};
|
884
|
-
const MRT_ColumnActionMenu = (_a) => {
|
885
|
-
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
886
|
-
var { anchorEl, header, setAnchorEl, table } = _a, rest = __rest(_a, ["anchorEl", "header", "setAnchorEl", "table"]);
|
887
|
-
const { getState, options: { columnFilterDisplayMode, columnFilterModeOptions, enableColumnFilterModes, enableColumnFilters, enableColumnPinning, enableColumnResizing, enableGrouping, enableHiding, enableSorting, enableSortingRemoval, icons: { ArrowRightIcon, ClearAllIcon, DynamicFeedIcon, FilterListIcon, FilterListOffIcon, PushPinIcon, RestartAltIcon, SortIcon, ViewColumnIcon, VisibilityOffIcon, }, localization, renderColumnActionsMenuItems, }, refs: { filterInputRefs }, setColumnFilterFns, setColumnOrder, setColumnSizingInfo, setShowColumnFilters, toggleAllColumnsVisible, } = table;
|
888
|
-
const { column } = header;
|
889
|
-
const { columnDef } = column;
|
890
|
-
const { columnSizing, columnVisibility, density, showColumnFilters } = getState();
|
891
|
-
const columnFilterValue = column.getFilterValue();
|
892
|
-
const [filterMenuAnchorEl, setFilterMenuAnchorEl] = react.useState(null);
|
893
|
-
const handleClearSort = () => {
|
894
|
-
column.clearSorting();
|
895
|
-
setAnchorEl(null);
|
896
|
-
};
|
897
|
-
const handleSortAsc = () => {
|
898
|
-
column.toggleSorting(false);
|
899
|
-
setAnchorEl(null);
|
900
|
-
};
|
901
|
-
const handleSortDesc = () => {
|
902
|
-
column.toggleSorting(true);
|
903
|
-
setAnchorEl(null);
|
904
|
-
};
|
905
|
-
const handleResetColumnSize = () => {
|
906
|
-
setColumnSizingInfo((old) => (Object.assign(Object.assign({}, old), { isResizingColumn: false })));
|
907
|
-
column.resetSize();
|
908
|
-
setAnchorEl(null);
|
909
|
-
};
|
910
|
-
const handleHideColumn = () => {
|
911
|
-
column.toggleVisibility(false);
|
912
|
-
setAnchorEl(null);
|
913
|
-
};
|
914
|
-
const handlePinColumn = (pinDirection) => {
|
915
|
-
column.pin(pinDirection);
|
916
|
-
setAnchorEl(null);
|
917
|
-
};
|
918
|
-
const handleGroupByColumn = () => {
|
919
|
-
column.toggleGrouping();
|
920
|
-
setColumnOrder((old) => ['mrt-row-expand', ...old]);
|
921
|
-
setAnchorEl(null);
|
922
|
-
};
|
923
|
-
const handleClearFilter = () => {
|
924
|
-
column.setFilterValue(undefined);
|
925
|
-
setAnchorEl(null);
|
926
|
-
if (['empty', 'notEmpty'].includes(columnDef._filterFn)) {
|
927
|
-
setColumnFilterFns((prev) => {
|
928
|
-
var _a;
|
929
|
-
return (Object.assign(Object.assign({}, prev), { [header.id]: (_a = allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions[0]) !== null && _a !== void 0 ? _a : 'fuzzy' }));
|
930
|
-
});
|
931
|
-
}
|
932
|
-
};
|
933
|
-
const handleFilterByColumn = () => {
|
934
|
-
setShowColumnFilters(true);
|
935
|
-
queueMicrotask(() => { var _a; return (_a = filterInputRefs.current[`${column.id}-0`]) === null || _a === void 0 ? void 0 : _a.focus(); });
|
936
|
-
setAnchorEl(null);
|
937
|
-
};
|
938
|
-
const handleShowAllColumns = () => {
|
939
|
-
toggleAllColumnsVisible(true);
|
940
|
-
setAnchorEl(null);
|
941
|
-
};
|
942
|
-
const handleOpenFilterModeMenu = (event) => {
|
943
|
-
event.stopPropagation();
|
944
|
-
setFilterMenuAnchorEl(event.currentTarget);
|
945
|
-
};
|
946
|
-
const isSelectFilter = !!columnDef.filterSelectOptions;
|
947
|
-
const allowedColumnFilterOptions = (_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.columnFilterModeOptions) !== null && _b !== void 0 ? _b : columnFilterModeOptions;
|
948
|
-
const showFilterModeSubMenu = enableColumnFilterModes &&
|
949
|
-
columnDef.enableColumnFilterModes !== false &&
|
950
|
-
!isSelectFilter &&
|
951
|
-
(allowedColumnFilterOptions === undefined ||
|
952
|
-
!!(allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions.length));
|
953
|
-
const internalColumnMenuItems = [
|
954
|
-
...(enableSorting && column.getCanSort()
|
955
|
-
? [
|
956
|
-
enableSortingRemoval !== false && (jsxRuntime.jsx(MenuItem__default["default"], { disabled: !column.getIsSorted(), onClick: handleClearSort, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(ClearAllIcon, {}) }), localization.clearSort] }) }, 0)),
|
957
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: column.getIsSorted() === 'asc', onClick: handleSortAsc, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(SortIcon, { style: { transform: 'rotate(180deg) scaleX(-1)' } }) }), (_c = localization.sortByColumnAsc) === null || _c === void 0 ? void 0 : _c.replace('{column}', String(columnDef.header))] }) }, 1),
|
958
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: column.getIsSorted() === 'desc', divider: enableColumnFilters || enableGrouping || enableHiding, onClick: handleSortDesc, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(SortIcon, {}) }), (_d = localization.sortByColumnDesc) === null || _d === void 0 ? void 0 : _d.replace('{column}', String(columnDef.header))] }) }, 2),
|
959
|
-
]
|
960
|
-
: []),
|
961
|
-
...(enableColumnFilters && column.getCanFilter()
|
962
|
-
? [
|
963
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: !columnFilterValue ||
|
964
|
-
(Array.isArray(columnFilterValue) &&
|
965
|
-
!columnFilterValue.filter((value) => value).length), onClick: handleClearFilter, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(FilterListOffIcon, {}) }), localization.clearFilter] }) }, 3),
|
966
|
-
columnFilterDisplayMode === 'subheader' && (jsxRuntime.jsxs(MenuItem__default["default"], { disabled: showColumnFilters && !enableColumnFilterModes, divider: enableGrouping || enableHiding, onClick: showColumnFilters
|
967
|
-
? handleOpenFilterModeMenu
|
968
|
-
: handleFilterByColumn, sx: commonMenuItemStyles, children: [jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(FilterListIcon, {}) }), (_e = localization.filterByColumn) === null || _e === void 0 ? void 0 : _e.replace('{column}', String(columnDef.header))] }), showFilterModeSubMenu && (jsxRuntime.jsx(IconButton__default["default"], { onClick: handleOpenFilterModeMenu, onMouseEnter: handleOpenFilterModeMenu, size: "small", sx: { p: 0 }, children: jsxRuntime.jsx(ArrowRightIcon, {}) }))] }, 4)),
|
969
|
-
showFilterModeSubMenu && (jsxRuntime.jsx(MRT_FilterOptionMenu, { anchorEl: filterMenuAnchorEl, header: header, onSelect: handleFilterByColumn, setAnchorEl: setFilterMenuAnchorEl, table: table }, 5)),
|
970
|
-
].filter(Boolean)
|
971
|
-
: []),
|
972
|
-
...(enableGrouping && column.getCanGroup()
|
973
|
-
? [
|
974
|
-
jsxRuntime.jsx(MenuItem__default["default"], { divider: enableColumnPinning, onClick: handleGroupByColumn, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(DynamicFeedIcon, {}) }), (_f = localization[column.getIsGrouped() ? 'ungroupByColumn' : 'groupByColumn']) === null || _f === void 0 ? void 0 : _f.replace('{column}', String(columnDef.header))] }) }, 6),
|
975
|
-
]
|
976
|
-
: []),
|
977
|
-
...(enableColumnPinning && column.getCanPin()
|
978
|
-
? [
|
979
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: column.getIsPinned() === 'left' || !column.getCanPin(), onClick: () => handlePinColumn('left'), sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(PushPinIcon, { style: { transform: 'rotate(90deg)' } }) }), localization.pinToLeft] }) }, 7),
|
980
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: column.getIsPinned() === 'right' || !column.getCanPin(), onClick: () => handlePinColumn('right'), sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(PushPinIcon, { style: { transform: 'rotate(-90deg)' } }) }), localization.pinToRight] }) }, 8),
|
981
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: !column.getIsPinned(), divider: enableHiding, onClick: () => handlePinColumn(false), sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(PushPinIcon, {}) }), localization.unpin] }) }, 9),
|
982
|
-
]
|
983
|
-
: []),
|
984
|
-
...(enableColumnResizing && column.getCanResize()
|
985
|
-
? [
|
986
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: !columnSizing[column.id], onClick: handleResetColumnSize, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(RestartAltIcon, {}) }), localization.resetColumnSize] }) }, 10),
|
987
|
-
]
|
988
|
-
: []),
|
989
|
-
...(enableHiding
|
990
|
-
? [
|
991
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: !column.getCanHide(), onClick: handleHideColumn, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(VisibilityOffIcon, {}) }), (_g = localization.hideColumn) === null || _g === void 0 ? void 0 : _g.replace('{column}', String(columnDef.header))] }) }, 11),
|
992
|
-
jsxRuntime.jsx(MenuItem__default["default"], { disabled: !Object.values(columnVisibility).filter((visible) => !visible)
|
993
|
-
.length, onClick: handleShowAllColumns, sx: commonMenuItemStyles, children: jsxRuntime.jsxs(Box__default["default"], { sx: commonListItemStyles, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: jsxRuntime.jsx(ViewColumnIcon, {}) }), (_h = localization.showAllColumns) === null || _h === void 0 ? void 0 : _h.replace('{column}', String(columnDef.header))] }) }, 12),
|
994
|
-
]
|
995
|
-
: []),
|
996
|
-
].filter(Boolean);
|
997
|
-
const theme = styles.useTheme();
|
998
|
-
const { menuBackgroundColor } = getMRTTheme(table, theme);
|
999
|
-
return (jsxRuntime.jsx(Menu__default["default"], Object.assign({ MenuListProps: {
|
1000
|
-
dense: density === 'compact',
|
1001
|
-
sx: {
|
1002
|
-
backgroundColor: menuBackgroundColor,
|
1003
|
-
},
|
1004
|
-
}, anchorEl: anchorEl, onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: (_l = (_k = (_j = columnDef.renderColumnActionsMenuItems) === null || _j === void 0 ? void 0 : _j.call(columnDef, {
|
1005
|
-
closeMenu: () => setAnchorEl(null),
|
1006
|
-
column,
|
1007
|
-
internalColumnMenuItems,
|
1008
|
-
table,
|
1009
|
-
})) !== null && _k !== void 0 ? _k : renderColumnActionsMenuItems === null || renderColumnActionsMenuItems === void 0 ? void 0 : renderColumnActionsMenuItems({
|
1010
|
-
closeMenu: () => setAnchorEl(null),
|
1011
|
-
column,
|
1012
|
-
internalColumnMenuItems,
|
1013
|
-
table,
|
1014
|
-
})) !== null && _l !== void 0 ? _l : internalColumnMenuItems })));
|
708
|
+
const MRT_ActionMenuItem = (_a) => {
|
709
|
+
var { icon, label, onOpenSubMenu, table } = _a, rest = __rest(_a, ["icon", "label", "onOpenSubMenu", "table"]);
|
710
|
+
const { options: { icons: { ArrowRightIcon }, }, } = table;
|
711
|
+
return (jsxRuntime.jsxs(MenuItem__default["default"], Object.assign({ sx: {
|
712
|
+
alignItems: 'center',
|
713
|
+
justifyContent: 'space-between',
|
714
|
+
minWidth: '120px',
|
715
|
+
my: 0,
|
716
|
+
py: '6px',
|
717
|
+
} }, rest, { children: [jsxRuntime.jsxs(Box__default["default"], { sx: {
|
718
|
+
alignItems: 'center',
|
719
|
+
display: 'flex',
|
720
|
+
}, children: [jsxRuntime.jsx(ListItemIcon__default["default"], { children: icon }), label] }), onOpenSubMenu && (jsxRuntime.jsx(IconButton__default["default"], { onClick: onOpenSubMenu, onMouseEnter: onOpenSubMenu, size: "small", sx: { p: 0 }, children: jsxRuntime.jsx(ArrowRightIcon, {}) }))] })));
|
1015
721
|
};
|
1016
722
|
|
1017
723
|
const MRT_RowActionMenu = (_a) => {
|
@@ -1025,8 +731,8 @@ const MRT_RowActionMenu = (_a) => {
|
|
1025
731
|
sx: {
|
1026
732
|
backgroundColor: menuBackgroundColor,
|
1027
733
|
},
|
1028
|
-
}, anchorEl: anchorEl, onClick: (event) => event.stopPropagation(), onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: [parseFromValuesOrFunc(enableEditing, row) &&
|
1029
|
-
['modal', 'row'].includes(editDisplayMode) && (jsxRuntime.jsx(
|
734
|
+
}, anchorEl: anchorEl, disableScrollLock: true, onClick: (event) => event.stopPropagation(), onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: [parseFromValuesOrFunc(enableEditing, row) &&
|
735
|
+
['modal', 'row'].includes(editDisplayMode) && (jsxRuntime.jsx(MRT_ActionMenuItem, { icon: jsxRuntime.jsx(EditIcon, {}), label: localization.edit, onClick: handleEdit, table: table })), renderRowActionMenuItems === null || renderRowActionMenuItems === void 0 ? void 0 : renderRowActionMenuItems({
|
1030
736
|
closeMenu: () => setAnchorEl(null),
|
1031
737
|
row,
|
1032
738
|
staticRowIndex,
|
@@ -1069,9 +775,6 @@ const MRT_ToggleRowActionMenuButton = (_a) => {
|
|
1069
775
|
};
|
1070
776
|
|
1071
777
|
const getMRT_RowActionsColumnDef = (tableOptions) => {
|
1072
|
-
if (!showRowActionsColumn(tableOptions)) {
|
1073
|
-
return null;
|
1074
|
-
}
|
1075
778
|
return Object.assign({ Cell: ({ cell, row, staticRowIndex, table }) => (jsxRuntime.jsx(MRT_ToggleRowActionMenuButton, { cell: cell, row: row, staticRowIndex: staticRowIndex, table: table })) }, defaultDisplayColumnProps({
|
1076
779
|
header: 'actions',
|
1077
780
|
id: 'mrt-row-actions',
|
@@ -1125,9 +828,6 @@ const MRT_TableBodyRowGrabHandle = (_a) => {
|
|
1125
828
|
};
|
1126
829
|
|
1127
830
|
const getMRT_RowDragColumnDef = (tableOptions) => {
|
1128
|
-
if (!showRowDragColumn(tableOptions)) {
|
1129
|
-
return null;
|
1130
|
-
}
|
1131
831
|
return Object.assign({ Cell: ({ row, rowRef, table }) => (jsxRuntime.jsx(MRT_TableBodyRowGrabHandle, { row: row, rowRef: rowRef, table: table })), grow: false }, defaultDisplayColumnProps({
|
1132
832
|
header: 'move',
|
1133
833
|
id: 'mrt-row-drag',
|
@@ -1187,9 +887,6 @@ const MRT_ExpandButton = ({ row, staticRowIndex, table, }) => {
|
|
1187
887
|
|
1188
888
|
const getMRT_RowExpandColumnDef = (tableOptions) => {
|
1189
889
|
var _a;
|
1190
|
-
if (!showRowExpandColumn(tableOptions)) {
|
1191
|
-
return null;
|
1192
|
-
}
|
1193
890
|
const { defaultColumn, enableExpandAll, groupedColumnMode, positionExpandColumn, renderDetailPanel, state: { grouping }, } = tableOptions;
|
1194
891
|
const alignProps = positionExpandColumn === 'last'
|
1195
892
|
? {
|
@@ -1227,9 +924,6 @@ const getMRT_RowExpandColumnDef = (tableOptions) => {
|
|
1227
924
|
};
|
1228
925
|
|
1229
926
|
const getMRT_RowNumbersColumnDef = (tableOptions) => {
|
1230
|
-
if (!showRowNumbersColumn(tableOptions)) {
|
1231
|
-
return null;
|
1232
|
-
}
|
1233
927
|
const { localization, rowNumberDisplayMode } = tableOptions;
|
1234
928
|
const { pagination: { pageIndex, pageSize }, } = tableOptions.state;
|
1235
929
|
return Object.assign({ Cell: ({ row, staticRowIndex }) => {
|
@@ -1283,9 +977,6 @@ const MRT_TableBodyRowPinButton = (_a) => {
|
|
1283
977
|
};
|
1284
978
|
|
1285
979
|
const getMRT_RowPinningColumnDef = (tableOptions) => {
|
1286
|
-
if (!showRowPinningColumn(tableOptions)) {
|
1287
|
-
return null;
|
1288
|
-
}
|
1289
980
|
return Object.assign({ Cell: ({ row, table }) => (jsxRuntime.jsx(MRT_TableBodyRowPinButton, { row: row, table: table })), grow: false }, defaultDisplayColumnProps({
|
1290
981
|
header: 'pin',
|
1291
982
|
id: 'mrt-row-pin',
|
@@ -1357,9 +1048,6 @@ const MRT_SelectCheckbox = (_a) => {
|
|
1357
1048
|
};
|
1358
1049
|
|
1359
1050
|
const getMRT_RowSelectColumnDef = (tableOptions) => {
|
1360
|
-
if (!showRowSelectionColumn(tableOptions)) {
|
1361
|
-
return null;
|
1362
|
-
}
|
1363
1051
|
const { enableMultiRowSelection, enableSelectAll } = tableOptions;
|
1364
1052
|
return Object.assign({ Cell: ({ row, staticRowIndex, table }) => (jsxRuntime.jsx(MRT_SelectCheckbox, { row: row, staticRowIndex: staticRowIndex, table: table })), Header: enableSelectAll && enableMultiRowSelection
|
1365
1053
|
? ({ table }) => jsxRuntime.jsx(MRT_SelectCheckbox, { table: table })
|
@@ -1379,6 +1067,7 @@ const MRT_Default_Icons = {
|
|
1379
1067
|
ChevronRightIcon: ChevronRightIcon__default["default"],
|
1380
1068
|
ClearAllIcon: ClearAllIcon__default["default"],
|
1381
1069
|
CloseIcon: CloseIcon__default["default"],
|
1070
|
+
ContentCopy: ContentCopy__default["default"],
|
1382
1071
|
DensityLargeIcon: DensityLargeIcon__default["default"],
|
1383
1072
|
DensityMediumIcon: DensityMediumIcon__default["default"],
|
1384
1073
|
DensitySmallIcon: DensitySmallIcon__default["default"],
|
@@ -1417,6 +1106,7 @@ const MRT_Localization_EN = {
|
|
1417
1106
|
clearSearch: 'Clear search',
|
1418
1107
|
clearSort: 'Clear sort',
|
1419
1108
|
clickToCopy: 'Click to copy',
|
1109
|
+
copy: 'Copy',
|
1420
1110
|
collapse: 'Collapse',
|
1421
1111
|
collapseAll: 'Collapse all',
|
1422
1112
|
columnActions: 'Column Actions',
|
@@ -1631,9 +1321,6 @@ const blankColProps = {
|
|
1631
1321
|
},
|
1632
1322
|
};
|
1633
1323
|
const getMRT_RowSpacerColumnDef = (tableOptions) => {
|
1634
|
-
if (!showRowSpacerColumn(tableOptions)) {
|
1635
|
-
return null;
|
1636
|
-
}
|
1637
1324
|
return Object.assign(Object.assign(Object.assign(Object.assign({}, defaultDisplayColumnProps({
|
1638
1325
|
id: 'mrt-row-spacer',
|
1639
1326
|
size: 0,
|
@@ -1641,21 +1328,10 @@ const getMRT_RowSpacerColumnDef = (tableOptions) => {
|
|
1641
1328
|
})), { grow: true }), MRT_DefaultDisplayColumn), { muiTableBodyCellProps: blankColProps, muiTableFooterCellProps: blankColProps, muiTableHeadCellProps: blankColProps });
|
1642
1329
|
};
|
1643
1330
|
|
1644
|
-
const getMRT_DisplayColumns = (tableOptions) => {
|
1645
|
-
return [
|
1646
|
-
getMRT_RowNumbersColumnDef(tableOptions),
|
1647
|
-
getMRT_RowSelectColumnDef(tableOptions),
|
1648
|
-
getMRT_RowExpandColumnDef(tableOptions),
|
1649
|
-
getMRT_RowActionsColumnDef(tableOptions),
|
1650
|
-
getMRT_RowDragColumnDef(tableOptions),
|
1651
|
-
getMRT_RowPinningColumnDef(tableOptions),
|
1652
|
-
getMRT_RowSpacerColumnDef(tableOptions),
|
1653
|
-
].filter(Boolean);
|
1654
|
-
};
|
1655
|
-
|
1656
1331
|
const useMRT_Effects = (table) => {
|
1657
1332
|
const { getIsSomeRowsPinned, getPrePaginationRowModel, getState, options: { enablePagination, enableRowPinning, rowCount }, } = table;
|
1658
|
-
const { density, globalFilter, isFullScreen, isLoading, pagination, showSkeletons, sorting, } = getState();
|
1333
|
+
const { columnOrder, density, globalFilter, isFullScreen, isLoading, pagination, showSkeletons, sorting, } = getState();
|
1334
|
+
const totalColumnCount = table.options.columns.length;
|
1659
1335
|
const totalRowCount = rowCount !== null && rowCount !== void 0 ? rowCount : getPrePaginationRowModel().rows.length;
|
1660
1336
|
const rerender = react.useReducer(() => ({}), {})[1];
|
1661
1337
|
const isMounted = react.useRef(false);
|
@@ -1719,10 +1395,22 @@ const useMRT_Effects = (table) => {
|
|
1719
1395
|
}, 150);
|
1720
1396
|
}
|
1721
1397
|
}, [density]);
|
1398
|
+
//recalculate column order when columns change or features are toggled on/off
|
1399
|
+
react.useEffect(() => {
|
1400
|
+
if (totalColumnCount !== columnOrder.length) {
|
1401
|
+
table.setColumnOrder(getDefaultColumnOrderIds(table.options));
|
1402
|
+
}
|
1403
|
+
}, [totalColumnCount]);
|
1722
1404
|
};
|
1723
1405
|
|
1724
|
-
|
1725
|
-
|
1406
|
+
/**
|
1407
|
+
* The MRT hook that wraps the TanStack useReactTable hook and adds additional functionality
|
1408
|
+
* @param definedTableOptions - table options with proper defaults set
|
1409
|
+
* @returns the MRT table instance
|
1410
|
+
*/
|
1411
|
+
const useMRT_TableInstance = (definedTableOptions) => {
|
1412
|
+
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;
|
1413
|
+
const actionCellRef = react.useRef(null);
|
1726
1414
|
const bottomToolbarRef = react.useRef(null);
|
1727
1415
|
const editInputRefs = react.useRef({});
|
1728
1416
|
const filterInputRefs = react.useRef({});
|
@@ -1733,17 +1421,19 @@ const useMRT_TableInstance = (_tableOptions) => {
|
|
1733
1421
|
const topToolbarRef = react.useRef(null);
|
1734
1422
|
const tableHeadRef = react.useRef(null);
|
1735
1423
|
const tableFooterRef = react.useRef(null);
|
1424
|
+
//transform initial state with proper column order
|
1736
1425
|
const initialState = react.useMemo(() => {
|
1737
1426
|
var _a, _b, _c;
|
1738
|
-
const initState = (_a =
|
1427
|
+
const initState = (_a = definedTableOptions.initialState) !== null && _a !== void 0 ? _a : {};
|
1739
1428
|
initState.columnOrder =
|
1740
|
-
(_b = initState.columnOrder) !== null && _b !== void 0 ? _b : getDefaultColumnOrderIds(Object.assign(Object.assign({},
|
1741
|
-
initState.globalFilterFn = (_c =
|
1429
|
+
(_b = initState.columnOrder) !== null && _b !== void 0 ? _b : getDefaultColumnOrderIds(Object.assign(Object.assign({}, definedTableOptions), { state: Object.assign(Object.assign({}, definedTableOptions.initialState), definedTableOptions.state) }));
|
1430
|
+
initState.globalFilterFn = (_c = definedTableOptions.globalFilterFn) !== null && _c !== void 0 ? _c : 'fuzzy';
|
1742
1431
|
return initState;
|
1743
1432
|
}, []);
|
1744
|
-
|
1745
|
-
const [
|
1746
|
-
const [
|
1433
|
+
definedTableOptions.initialState = initialState;
|
1434
|
+
const [actionCell, setActionCell] = react.useState((_a = initialState.actionCell) !== null && _a !== void 0 ? _a : null);
|
1435
|
+
const [creatingRow, _setCreatingRow] = react.useState((_b = initialState.creatingRow) !== null && _b !== void 0 ? _b : null);
|
1436
|
+
const [columnFilterFns, setColumnFilterFns] = react.useState(() => Object.assign({}, ...getAllLeafColumnDefs(definedTableOptions.columns).map((col) => {
|
1747
1437
|
var _a, _b, _c, _d;
|
1748
1438
|
return ({
|
1749
1439
|
[getColumnId(col)]: col.filterFn instanceof Function
|
@@ -1751,24 +1441,25 @@ const useMRT_TableInstance = (_tableOptions) => {
|
|
1751
1441
|
: (_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),
|
1752
1442
|
});
|
1753
1443
|
})));
|
1754
|
-
const [columnOrder, onColumnOrderChange] = react.useState((
|
1755
|
-
const [columnSizingInfo, onColumnSizingInfoChange] = react.useState((
|
1756
|
-
const [density, setDensity] = react.useState((
|
1757
|
-
const [draggingColumn, setDraggingColumn] = react.useState((
|
1758
|
-
const [draggingRow, setDraggingRow] = react.useState((
|
1759
|
-
const [editingCell, setEditingCell] = react.useState((
|
1760
|
-
const [editingRow, setEditingRow] = react.useState((
|
1761
|
-
const [globalFilterFn, setGlobalFilterFn] = react.useState((
|
1762
|
-
const [grouping, onGroupingChange] = react.useState((
|
1763
|
-
const [hoveredColumn, setHoveredColumn] = react.useState((
|
1764
|
-
const [hoveredRow, setHoveredRow] = react.useState((
|
1765
|
-
const [isFullScreen, setIsFullScreen] = react.useState((
|
1766
|
-
const [pagination, onPaginationChange] = react.useState((
|
1767
|
-
const [showAlertBanner, setShowAlertBanner] = react.useState((
|
1768
|
-
const [showColumnFilters, setShowColumnFilters] = react.useState((
|
1769
|
-
const [showGlobalFilter, setShowGlobalFilter] = react.useState((
|
1770
|
-
const [showToolbarDropZone, setShowToolbarDropZone] = react.useState((
|
1771
|
-
|
1444
|
+
const [columnOrder, onColumnOrderChange] = react.useState((_c = initialState.columnOrder) !== null && _c !== void 0 ? _c : []);
|
1445
|
+
const [columnSizingInfo, onColumnSizingInfoChange] = react.useState((_d = initialState.columnSizingInfo) !== null && _d !== void 0 ? _d : {});
|
1446
|
+
const [density, setDensity] = react.useState((_e = initialState === null || initialState === void 0 ? void 0 : initialState.density) !== null && _e !== void 0 ? _e : 'comfortable');
|
1447
|
+
const [draggingColumn, setDraggingColumn] = react.useState((_f = initialState.draggingColumn) !== null && _f !== void 0 ? _f : null);
|
1448
|
+
const [draggingRow, setDraggingRow] = react.useState((_g = initialState.draggingRow) !== null && _g !== void 0 ? _g : null);
|
1449
|
+
const [editingCell, setEditingCell] = react.useState((_h = initialState.editingCell) !== null && _h !== void 0 ? _h : null);
|
1450
|
+
const [editingRow, setEditingRow] = react.useState((_j = initialState.editingRow) !== null && _j !== void 0 ? _j : null);
|
1451
|
+
const [globalFilterFn, setGlobalFilterFn] = react.useState((_k = initialState.globalFilterFn) !== null && _k !== void 0 ? _k : 'fuzzy');
|
1452
|
+
const [grouping, onGroupingChange] = react.useState((_l = initialState.grouping) !== null && _l !== void 0 ? _l : []);
|
1453
|
+
const [hoveredColumn, setHoveredColumn] = react.useState((_m = initialState.hoveredColumn) !== null && _m !== void 0 ? _m : null);
|
1454
|
+
const [hoveredRow, setHoveredRow] = react.useState((_o = initialState.hoveredRow) !== null && _o !== void 0 ? _o : null);
|
1455
|
+
const [isFullScreen, setIsFullScreen] = react.useState((_p = initialState === null || initialState === void 0 ? void 0 : initialState.isFullScreen) !== null && _p !== void 0 ? _p : false);
|
1456
|
+
const [pagination, onPaginationChange] = react.useState((_q = initialState === null || initialState === void 0 ? void 0 : initialState.pagination) !== null && _q !== void 0 ? _q : { pageIndex: 0, pageSize: 10 });
|
1457
|
+
const [showAlertBanner, setShowAlertBanner] = react.useState((_r = initialState === null || initialState === void 0 ? void 0 : initialState.showAlertBanner) !== null && _r !== void 0 ? _r : false);
|
1458
|
+
const [showColumnFilters, setShowColumnFilters] = react.useState((_s = initialState === null || initialState === void 0 ? void 0 : initialState.showColumnFilters) !== null && _s !== void 0 ? _s : false);
|
1459
|
+
const [showGlobalFilter, setShowGlobalFilter] = react.useState((_t = initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) !== null && _t !== void 0 ? _t : false);
|
1460
|
+
const [showToolbarDropZone, setShowToolbarDropZone] = react.useState((_u = initialState === null || initialState === void 0 ? void 0 : initialState.showToolbarDropZone) !== null && _u !== void 0 ? _u : false);
|
1461
|
+
definedTableOptions.state = Object.assign({ actionCell,
|
1462
|
+
columnFilterFns,
|
1772
1463
|
columnOrder,
|
1773
1464
|
columnSizingInfo,
|
1774
1465
|
creatingRow,
|
@@ -1786,90 +1477,110 @@ const useMRT_TableInstance = (_tableOptions) => {
|
|
1786
1477
|
showAlertBanner,
|
1787
1478
|
showColumnFilters,
|
1788
1479
|
showGlobalFilter,
|
1789
|
-
showToolbarDropZone },
|
1790
|
-
|
1480
|
+
showToolbarDropZone }, definedTableOptions.state);
|
1481
|
+
//The table options now include all state needed to help determine column visibility and order logic
|
1482
|
+
const statefulTableOptions = definedTableOptions;
|
1791
1483
|
//don't recompute columnDefs while resizing column or dragging column/row
|
1792
1484
|
const columnDefsRef = react.useRef([]);
|
1793
|
-
|
1794
|
-
|
1795
|
-
|
1796
|
-
|
1485
|
+
statefulTableOptions.columns =
|
1486
|
+
statefulTableOptions.state.columnSizingInfo.isResizingColumn ||
|
1487
|
+
statefulTableOptions.state.draggingColumn ||
|
1488
|
+
statefulTableOptions.state.draggingRow
|
1797
1489
|
? columnDefsRef.current
|
1798
1490
|
: prepareColumns({
|
1799
1491
|
columnDefs: [
|
1800
|
-
...
|
1801
|
-
|
1492
|
+
...[
|
1493
|
+
showRowPinningColumn(statefulTableOptions) &&
|
1494
|
+
getMRT_RowPinningColumnDef(statefulTableOptions),
|
1495
|
+
showRowDragColumn(statefulTableOptions) &&
|
1496
|
+
getMRT_RowDragColumnDef(statefulTableOptions),
|
1497
|
+
showRowActionsColumn(statefulTableOptions) &&
|
1498
|
+
getMRT_RowActionsColumnDef(statefulTableOptions),
|
1499
|
+
showRowExpandColumn(statefulTableOptions) &&
|
1500
|
+
getMRT_RowExpandColumnDef(statefulTableOptions),
|
1501
|
+
showRowSelectionColumn(statefulTableOptions) &&
|
1502
|
+
getMRT_RowSelectColumnDef(statefulTableOptions),
|
1503
|
+
showRowNumbersColumn(statefulTableOptions) &&
|
1504
|
+
getMRT_RowNumbersColumnDef(statefulTableOptions),
|
1505
|
+
].filter(Boolean),
|
1506
|
+
...statefulTableOptions.columns,
|
1507
|
+
...[
|
1508
|
+
showRowSpacerColumn(statefulTableOptions) &&
|
1509
|
+
getMRT_RowSpacerColumnDef(statefulTableOptions),
|
1510
|
+
].filter(Boolean),
|
1802
1511
|
],
|
1803
|
-
tableOptions,
|
1512
|
+
tableOptions: statefulTableOptions,
|
1804
1513
|
});
|
1805
|
-
columnDefsRef.current =
|
1806
|
-
|
1807
|
-
|
1514
|
+
columnDefsRef.current = statefulTableOptions.columns;
|
1515
|
+
//if loading, generate blank rows to show skeleton loaders
|
1516
|
+
statefulTableOptions.data = react.useMemo(() => (statefulTableOptions.state.isLoading ||
|
1517
|
+
statefulTableOptions.state.showSkeletons) &&
|
1518
|
+
!statefulTableOptions.data.length
|
1808
1519
|
? [
|
1809
|
-
...Array(Math.min(
|
1810
|
-
].map(() => Object.assign({}, ...getAllLeafColumnDefs(
|
1520
|
+
...Array(Math.min(statefulTableOptions.state.pagination.pageSize, 20)).fill(null),
|
1521
|
+
].map(() => Object.assign({}, ...getAllLeafColumnDefs(statefulTableOptions.columns).map((col) => ({
|
1811
1522
|
[getColumnId(col)]: null,
|
1812
1523
|
}))))
|
1813
|
-
:
|
1814
|
-
|
1815
|
-
|
1816
|
-
|
1524
|
+
: statefulTableOptions.data, [
|
1525
|
+
statefulTableOptions.data,
|
1526
|
+
statefulTableOptions.state.isLoading,
|
1527
|
+
statefulTableOptions.state.showSkeletons,
|
1817
1528
|
]);
|
1818
1529
|
//@ts-ignore
|
1819
1530
|
const table = reactTable.useReactTable(Object.assign(Object.assign({ onColumnOrderChange,
|
1820
1531
|
onColumnSizingInfoChange,
|
1821
1532
|
onGroupingChange,
|
1822
|
-
onPaginationChange },
|
1823
|
-
//@ts-ignore
|
1533
|
+
onPaginationChange }, statefulTableOptions), { globalFilterFn: (_v = statefulTableOptions.filterFns) === null || _v === void 0 ? void 0 : _v[globalFilterFn !== null && globalFilterFn !== void 0 ? globalFilterFn : 'fuzzy'] }));
|
1824
1534
|
table.refs = {
|
1825
|
-
|
1535
|
+
actionCellRef,
|
1826
1536
|
bottomToolbarRef,
|
1827
1537
|
editInputRefs,
|
1828
1538
|
filterInputRefs,
|
1829
|
-
//@ts-ignore
|
1830
1539
|
searchInputRef,
|
1831
|
-
//@ts-ignore
|
1832
1540
|
tableContainerRef,
|
1833
|
-
//@ts-ignore
|
1834
1541
|
tableFooterRef,
|
1835
1542
|
tableHeadCellRefs,
|
1836
|
-
//@ts-ignore
|
1837
1543
|
tableHeadRef,
|
1838
|
-
//@ts-ignore
|
1839
1544
|
tablePaperRef,
|
1840
|
-
//@ts-ignore
|
1841
1545
|
topToolbarRef,
|
1842
1546
|
};
|
1547
|
+
table.setActionCell =
|
1548
|
+
(_w = statefulTableOptions.onActionCellChange) !== null && _w !== void 0 ? _w : setActionCell;
|
1843
1549
|
table.setCreatingRow = (row) => {
|
1844
1550
|
var _a, _b;
|
1845
1551
|
let _row = row;
|
1846
1552
|
if (row === true) {
|
1847
1553
|
_row = createRow(table);
|
1848
1554
|
}
|
1849
|
-
(_b = (_a =
|
1555
|
+
(_b = (_a = statefulTableOptions === null || statefulTableOptions === void 0 ? void 0 : statefulTableOptions.onCreatingRowChange) === null || _a === void 0 ? void 0 : _a.call(statefulTableOptions, _row)) !== null && _b !== void 0 ? _b : _setCreatingRow(_row);
|
1850
1556
|
};
|
1851
1557
|
table.setColumnFilterFns =
|
1852
|
-
(
|
1853
|
-
table.setDensity = (
|
1558
|
+
(_x = statefulTableOptions.onColumnFilterFnsChange) !== null && _x !== void 0 ? _x : setColumnFilterFns;
|
1559
|
+
table.setDensity = (_y = statefulTableOptions.onDensityChange) !== null && _y !== void 0 ? _y : setDensity;
|
1854
1560
|
table.setDraggingColumn =
|
1855
|
-
(
|
1856
|
-
table.setDraggingRow =
|
1857
|
-
|
1858
|
-
table.
|
1561
|
+
(_z = statefulTableOptions.onDraggingColumnChange) !== null && _z !== void 0 ? _z : setDraggingColumn;
|
1562
|
+
table.setDraggingRow =
|
1563
|
+
(_0 = statefulTableOptions.onDraggingRowChange) !== null && _0 !== void 0 ? _0 : setDraggingRow;
|
1564
|
+
table.setEditingCell =
|
1565
|
+
(_1 = statefulTableOptions.onEditingCellChange) !== null && _1 !== void 0 ? _1 : setEditingCell;
|
1566
|
+
table.setEditingRow =
|
1567
|
+
(_2 = statefulTableOptions.onEditingRowChange) !== null && _2 !== void 0 ? _2 : setEditingRow;
|
1859
1568
|
table.setGlobalFilterFn =
|
1860
|
-
(
|
1569
|
+
(_3 = statefulTableOptions.onGlobalFilterFnChange) !== null && _3 !== void 0 ? _3 : setGlobalFilterFn;
|
1861
1570
|
table.setHoveredColumn =
|
1862
|
-
(
|
1863
|
-
table.setHoveredRow =
|
1864
|
-
|
1571
|
+
(_4 = statefulTableOptions.onHoveredColumnChange) !== null && _4 !== void 0 ? _4 : setHoveredColumn;
|
1572
|
+
table.setHoveredRow =
|
1573
|
+
(_5 = statefulTableOptions.onHoveredRowChange) !== null && _5 !== void 0 ? _5 : setHoveredRow;
|
1574
|
+
table.setIsFullScreen =
|
1575
|
+
(_6 = statefulTableOptions.onIsFullScreenChange) !== null && _6 !== void 0 ? _6 : setIsFullScreen;
|
1865
1576
|
table.setShowAlertBanner =
|
1866
|
-
(
|
1577
|
+
(_7 = statefulTableOptions.onShowAlertBannerChange) !== null && _7 !== void 0 ? _7 : setShowAlertBanner;
|
1867
1578
|
table.setShowColumnFilters =
|
1868
|
-
(
|
1579
|
+
(_8 = statefulTableOptions.onShowColumnFiltersChange) !== null && _8 !== void 0 ? _8 : setShowColumnFilters;
|
1869
1580
|
table.setShowGlobalFilter =
|
1870
|
-
(
|
1581
|
+
(_9 = statefulTableOptions.onShowGlobalFilterChange) !== null && _9 !== void 0 ? _9 : setShowGlobalFilter;
|
1871
1582
|
table.setShowToolbarDropZone =
|
1872
|
-
(
|
1583
|
+
(_10 = statefulTableOptions.onShowToolbarDropZoneChange) !== null && _10 !== void 0 ? _10 : setShowToolbarDropZone;
|
1873
1584
|
useMRT_Effects(table);
|
1874
1585
|
return table;
|
1875
1586
|
};
|
@@ -2138,7 +1849,7 @@ const MRT_CopyButton = (_a) => {
|
|
2138
1849
|
row,
|
2139
1850
|
table,
|
2140
1851
|
})), rest);
|
2141
|
-
return (jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, getCommonTooltipProps('top'), { title: (_b = buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.title) !== null && _b !== void 0 ? _b : (copied ? localization.copiedToClipboard : localization.clickToCopy), children: jsxRuntime.jsx(Button__default["default"], Object.assign({ onClick: (e) => handleCopy(e, cell.getValue()), size: "small", type: "button", variant: "text" }, buttonProps, { sx: (theme) => (Object.assign({ backgroundColor: 'transparent', border: 'none', color: 'inherit', cursor: 'copy', fontFamily: 'inherit', fontSize: 'inherit', letterSpacing: 'inherit', m: '-0.25rem', minWidth: 'unset', textAlign: 'inherit', textTransform: 'inherit' }, parseFromValuesOrFunc(buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.sx, theme))), title: undefined })) })));
|
1852
|
+
return (jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, getCommonTooltipProps('top'), { title: (_b = buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.title) !== null && _b !== void 0 ? _b : (copied ? localization.copiedToClipboard : localization.clickToCopy), children: jsxRuntime.jsx(Button__default["default"], Object.assign({ onClick: (e) => handleCopy(e, cell.getValue()), size: "small", type: "button", variant: "text" }, buttonProps, { sx: (theme) => (Object.assign({ backgroundColor: 'transparent', border: 'none', color: 'inherit', cursor: 'copy', fontFamily: 'inherit', fontSize: 'inherit', letterSpacing: 'inherit', m: '-0.25rem', minWidth: 'unset', py: 0, textAlign: 'inherit', textTransform: 'inherit' }, parseFromValuesOrFunc(buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.sx, theme))), title: undefined })) })));
|
2142
1853
|
};
|
2143
1854
|
|
2144
1855
|
const MRT_EditCellTextField = (_a) => {
|
@@ -2220,7 +1931,9 @@ const MRT_EditCellTextField = (_a) => {
|
|
2220
1931
|
: {})), textFieldProps.InputProps), { sx: (theme) => {
|
2221
1932
|
var _a;
|
2222
1933
|
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)));
|
2223
|
-
} }),
|
1934
|
+
} }), SelectProps: {
|
1935
|
+
MenuProps: { disableScrollLock: true },
|
1936
|
+
}, inputProps: Object.assign({ autoComplete: 'new-password' }, textFieldProps.inputProps), onBlur: handleBlur, onChange: handleChange, onClick: (e) => {
|
2224
1937
|
var _a;
|
2225
1938
|
e.stopPropagation();
|
2226
1939
|
(_a = textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.onClick) === null || _a === void 0 ? void 0 : _a.call(textFieldProps, e);
|
@@ -2237,10 +1950,10 @@ const MRT_EditCellTextField = (_a) => {
|
|
2237
1950
|
|
2238
1951
|
const MRT_TableBodyCell = (_a) => {
|
2239
1952
|
var _b, _c, _d, _e, _f;
|
2240
|
-
var { cell,
|
1953
|
+
var { cell, numRows, rowRef, staticColumnIndex, staticRowIndex, table } = _a, rest = __rest(_a, ["cell", "numRows", "rowRef", "staticColumnIndex", "staticRowIndex", "table"]);
|
2241
1954
|
const theme = styles.useTheme();
|
2242
|
-
const { getState, options: { columnResizeDirection, columnResizeMode, createDisplayMode, editDisplayMode, enableClickToCopy, enableColumnOrdering, enableColumnPinning,
|
2243
|
-
const { columnSizingInfo, creatingRow, density, draggingColumn, draggingRow, editingCell, editingRow, hoveredColumn, hoveredRow, isLoading, showSkeletons, } = getState();
|
1955
|
+
const { getState, options: { columnResizeDirection, columnResizeMode, createDisplayMode, editDisplayMode, enableCellActions, enableClickToCopy, enableColumnOrdering, enableColumnPinning, enableGrouping, layoutMode, muiSkeletonProps, muiTableBodyCellProps, }, setHoveredColumn, } = table;
|
1956
|
+
const { actionCell, columnSizingInfo, creatingRow, density, draggingColumn, draggingRow, editingCell, editingRow, hoveredColumn, hoveredRow, isLoading, showSkeletons, } = getState();
|
2244
1957
|
const { column, row } = cell;
|
2245
1958
|
const { columnDef } = column;
|
2246
1959
|
const { columnDefType } = columnDef;
|
@@ -2313,9 +2026,7 @@ const MRT_TableBodyCell = (_a) => {
|
|
2313
2026
|
const isColumnPinned = enableColumnPinning &&
|
2314
2027
|
columnDef.columnDefType !== 'group' &&
|
2315
2028
|
column.getIsPinned();
|
2316
|
-
const isEditable =
|
2317
|
-
parseFromValuesOrFunc(enableEditing, row) &&
|
2318
|
-
parseFromValuesOrFunc(columnDef.enableEditing, row) !== false;
|
2029
|
+
const isEditable = isCellEditable({ cell, table });
|
2319
2030
|
const isEditing = isEditable &&
|
2320
2031
|
!['custom', 'modal'].includes(editDisplayMode) &&
|
2321
2032
|
(editDisplayMode === 'table' ||
|
@@ -2323,20 +2034,20 @@ const MRT_TableBodyCell = (_a) => {
|
|
2323
2034
|
(editingCell === null || editingCell === void 0 ? void 0 : editingCell.id) === cell.id) &&
|
2324
2035
|
!row.getIsGrouped();
|
2325
2036
|
const isCreating = isEditable && createDisplayMode === 'row' && (creatingRow === null || creatingRow === void 0 ? void 0 : creatingRow.id) === row.id;
|
2037
|
+
const showClickToCopyButton = (parseFromValuesOrFunc(enableClickToCopy, cell) === true ||
|
2038
|
+
parseFromValuesOrFunc(columnDef.enableClickToCopy, cell) === true) &&
|
2039
|
+
!['context-menu', false].includes(
|
2040
|
+
// @ts-ignore
|
2041
|
+
parseFromValuesOrFunc(columnDef.enableClickToCopy, cell));
|
2042
|
+
const isRightClickable = parseFromValuesOrFunc(enableCellActions, cell);
|
2043
|
+
const cellValueProps = {
|
2044
|
+
cell,
|
2045
|
+
table,
|
2046
|
+
};
|
2326
2047
|
const handleDoubleClick = (event) => {
|
2327
2048
|
var _a;
|
2328
2049
|
(_a = tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.onDoubleClick) === null || _a === void 0 ? void 0 : _a.call(tableCellProps, event);
|
2329
|
-
|
2330
|
-
setEditingCell(cell);
|
2331
|
-
queueMicrotask(() => {
|
2332
|
-
var _a;
|
2333
|
-
const textField = editInputRefs.current[column.id];
|
2334
|
-
if (textField) {
|
2335
|
-
textField.focus();
|
2336
|
-
(_a = textField.select) === null || _a === void 0 ? void 0 : _a.call(textField);
|
2337
|
-
}
|
2338
|
-
});
|
2339
|
-
}
|
2050
|
+
openEditingCell({ cell, table });
|
2340
2051
|
};
|
2341
2052
|
const handleDragEnter = (e) => {
|
2342
2053
|
var _a;
|
@@ -2348,24 +2059,29 @@ const MRT_TableBodyCell = (_a) => {
|
|
2348
2059
|
setHoveredColumn(columnDef.enableColumnOrdering !== false ? column : null);
|
2349
2060
|
}
|
2350
2061
|
};
|
2351
|
-
const
|
2352
|
-
|
2353
|
-
|
2062
|
+
const handleContextMenu = (e) => {
|
2063
|
+
var _a;
|
2064
|
+
(_a = tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.onContextMenu) === null || _a === void 0 ? void 0 : _a.call(tableCellProps, e);
|
2065
|
+
if (isRightClickable) {
|
2066
|
+
e.preventDefault();
|
2067
|
+
table.setActionCell(cell);
|
2068
|
+
table.refs.actionCellRef.current = e.currentTarget;
|
2069
|
+
}
|
2354
2070
|
};
|
2355
|
-
return (jsxRuntime.jsx(TableCell__default["default"], Object.assign({ align: theme.direction === 'rtl' ? 'right' : 'left', "data-index": staticColumnIndex, "data-pinned": !!isColumnPinned || undefined,
|
2356
|
-
|
2357
|
-
|
2358
|
-
}
|
2359
|
-
} }, tableCellProps, { onDoubleClick: handleDoubleClick, onDragEnter: handleDragEnter, sx: (theme) => (Object.assign(Object.assign({ '&:hover': {
|
2360
|
-
outline: (editDisplayMode === 'cell' && isEditable) ||
|
2071
|
+
return (jsxRuntime.jsx(TableCell__default["default"], Object.assign({ align: theme.direction === 'rtl' ? 'right' : 'left', "data-index": staticColumnIndex, "data-pinned": !!isColumnPinned || undefined }, tableCellProps, { onContextMenu: handleContextMenu, onDoubleClick: handleDoubleClick, onDragEnter: handleDragEnter, sx: (theme) => (Object.assign(Object.assign({ '&:hover': {
|
2072
|
+
outline: (actionCell === null || actionCell === void 0 ? void 0 : actionCell.id) === cell.id ||
|
2073
|
+
(editDisplayMode === 'cell' && isEditable) ||
|
2361
2074
|
(editDisplayMode === 'table' && (isCreating || isEditing))
|
2362
2075
|
? `1px solid ${theme.palette.grey[500]}`
|
2363
2076
|
: undefined,
|
2364
|
-
outlineOffset: '-1px',
|
2365
2077
|
textOverflow: 'clip',
|
2366
|
-
}, alignItems: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'center' : undefined, cursor:
|
2367
|
-
?
|
2368
|
-
:
|
2078
|
+
}, alignItems: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'center' : undefined, cursor: isRightClickable
|
2079
|
+
? 'context-menu'
|
2080
|
+
: isEditable && editDisplayMode === 'cell'
|
2081
|
+
? 'pointer'
|
2082
|
+
: 'inherit', outline: (actionCell === null || actionCell === void 0 ? void 0 : actionCell.id) === cell.id
|
2083
|
+
? `1px solid ${theme.palette.grey[500]}`
|
2084
|
+
: undefined, outlineOffset: '-1px', overflow: 'hidden', p: density === 'compact'
|
2369
2085
|
? columnDefType === 'display'
|
2370
2086
|
? '0 0.5rem'
|
2371
2087
|
: '0.5rem'
|
@@ -2375,7 +2091,7 @@ const MRT_TableBodyCell = (_a) => {
|
|
2375
2091
|
: '1rem'
|
2376
2092
|
: columnDefType === 'display'
|
2377
2093
|
? '1rem 1.25rem'
|
2378
|
-
: '1.5rem', textOverflow: columnDefType !== 'display' ? 'ellipsis' : undefined, whiteSpace: row.getIsPinned() || density === 'compact' ? 'nowrap' : 'normal'
|
2094
|
+
: '1.5rem', textOverflow: columnDefType !== 'display' ? 'ellipsis' : undefined, whiteSpace: row.getIsPinned() || density === 'compact' ? 'nowrap' : 'normal' }, getCommonMRTCellStyles({
|
2379
2095
|
column,
|
2380
2096
|
table,
|
2381
2097
|
tableCellProps,
|
@@ -2390,8 +2106,7 @@ const MRT_TableBodyCell = (_a) => {
|
|
2390
2106
|
rowRef,
|
2391
2107
|
staticRowIndex,
|
2392
2108
|
table,
|
2393
|
-
})) : isCreating || isEditing ? (jsxRuntime.jsx(MRT_EditCellTextField, { cell: cell, table: table })) :
|
2394
|
-
columnDef.enableClickToCopy !== false ? (jsxRuntime.jsx(MRT_CopyButton, { cell: cell, table: table, children: jsxRuntime.jsx(MRT_TableBodyCellValue, Object.assign({}, cellValueProps)) })) : (jsxRuntime.jsx(MRT_TableBodyCellValue, Object.assign({}, cellValueProps))), cell.getIsGrouped() && !columnDef.GroupedCell && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [" (", (_f = row.subRows) === null || _f === void 0 ? void 0 : _f.length, ")"] }))] })) })));
|
2109
|
+
})) : isCreating || isEditing ? (jsxRuntime.jsx(MRT_EditCellTextField, { cell: cell, table: table })) : showClickToCopyButton && columnDef.enableClickToCopy !== false ? (jsxRuntime.jsx(MRT_CopyButton, { cell: cell, table: table, children: jsxRuntime.jsx(MRT_TableBodyCellValue, Object.assign({}, cellValueProps)) })) : (jsxRuntime.jsx(MRT_TableBodyCellValue, Object.assign({}, cellValueProps))), cell.getIsGrouped() && !columnDef.GroupedCell && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [" (", (_f = row.subRows) === null || _f === void 0 ? void 0 : _f.length, ")"] }))] })) })));
|
2395
2110
|
};
|
2396
2111
|
const Memo_MRT_TableBodyCell = react.memo(MRT_TableBodyCell, (prev, next) => next.cell === prev.cell);
|
2397
2112
|
|
@@ -2492,25 +2207,21 @@ const MRT_TableBodyRow = ({ columnVirtualizer, numRows, pinnedRowIds, row, rowVi
|
|
2492
2207
|
}
|
2493
2208
|
}, selected: isRowSelected }, tableRowProps, { style: Object.assign({ transform: virtualRow
|
2494
2209
|
? `translateY(${virtualRow.start}px)`
|
2495
|
-
: undefined }, tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.style), sx: (theme) => (Object.assign({ '&:hover td':
|
2496
|
-
|
2497
|
-
? styles.alpha(cellHighlightColorHover, 0.3)
|
2498
|
-
: undefined }, pinnedBeforeAfterStyles),
|
2499
|
-
}, backgroundColor: `${baseBackgroundColor} !important`, bottom: !virtualRow && bottomPinnedIndex !== undefined && isRowPinned
|
2210
|
+
: undefined }, tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.style), sx: (theme) => (Object.assign({ '&:hover td:after': cellHighlightColorHover
|
2211
|
+
? Object.assign({ backgroundColor: styles.alpha(cellHighlightColorHover, 0.3) }, commonCellBeforeAfterStyles) : undefined, backgroundColor: `${baseBackgroundColor} !important`, bottom: !virtualRow && bottomPinnedIndex !== undefined && isRowPinned
|
2500
2212
|
? `${bottomPinnedIndex * rowHeight +
|
2501
2213
|
(enableStickyFooter ? tableFooterHeight - 1 : 0)}px`
|
2502
2214
|
: undefined, boxSizing: 'border-box', display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'flex' : undefined, opacity: isRowPinned ? 0.97 : isDraggingRow || isHoveredRow ? 0.5 : 1, position: virtualRow
|
2503
2215
|
? 'absolute'
|
2504
2216
|
: (rowPinningDisplayMode === null || rowPinningDisplayMode === void 0 ? void 0 : rowPinningDisplayMode.includes('sticky')) && isRowPinned
|
2505
2217
|
? 'sticky'
|
2506
|
-
:
|
2218
|
+
: 'relative', td: Object.assign({}, getCommonPinnedCellStyles({ table, theme })), 'td:after': cellHighlightColor
|
2219
|
+
? Object.assign({ backgroundColor: cellHighlightColor }, commonCellBeforeAfterStyles) : undefined, top: virtualRow
|
2507
2220
|
? 0
|
2508
2221
|
: topPinnedIndex !== undefined && isRowPinned
|
2509
2222
|
? `${topPinnedIndex * rowHeight +
|
2510
2223
|
(enableStickyHeader || isFullScreen ? tableHeadHeight - 1 : 0)}px`
|
2511
|
-
: undefined, transition: virtualRow ? 'none' : 'all 150ms ease-in-out', width: '100%', zIndex: (rowPinningDisplayMode === null || rowPinningDisplayMode === void 0 ? void 0 : rowPinningDisplayMode.includes('sticky')) && isRowPinned
|
2512
|
-
? 2
|
2513
|
-
: undefined }, sx)), children: [virtualPaddingLeft ? (jsxRuntime.jsx("td", { style: { display: 'flex', width: virtualPaddingLeft } })) : null, (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : visibleCells).map((cellOrVirtualCell, staticColumnIndex) => {
|
2224
|
+
: undefined, transition: virtualRow ? 'none' : 'all 150ms ease-in-out', width: '100%', zIndex: (rowPinningDisplayMode === null || rowPinningDisplayMode === void 0 ? void 0 : rowPinningDisplayMode.includes('sticky')) && isRowPinned ? 2 : 0 }, sx)), children: [virtualPaddingLeft ? (jsxRuntime.jsx("td", { style: { display: 'flex', width: virtualPaddingLeft } })) : null, (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : visibleCells).map((cellOrVirtualCell, staticColumnIndex) => {
|
2514
2225
|
let cell = cellOrVirtualCell;
|
2515
2226
|
if (columnVirtualizer) {
|
2516
2227
|
staticColumnIndex = cellOrVirtualCell.index;
|
@@ -2518,9 +2229,6 @@ const MRT_TableBodyRow = ({ columnVirtualizer, numRows, pinnedRowIds, row, rowVi
|
|
2518
2229
|
}
|
2519
2230
|
const props = {
|
2520
2231
|
cell,
|
2521
|
-
measureElement: !isDraggingRow && !isHoveredRow
|
2522
|
-
? columnVirtualizer === null || columnVirtualizer === void 0 ? void 0 : columnVirtualizer.measureElement
|
2523
|
-
: undefined,
|
2524
2232
|
numRows,
|
2525
2233
|
rowRef,
|
2526
2234
|
staticColumnIndex,
|
@@ -2614,88 +2322,426 @@ const MRT_TableBody = (_a) => {
|
|
2614
2322
|
return memoMode === 'rows' ? (jsxRuntime.jsx(Memo_MRT_TableBodyRow, Object.assign({}, props), row.id)) : (jsxRuntime.jsx(MRT_TableBodyRow, Object.assign({}, props), row.id));
|
2615
2323
|
}) })))] }));
|
2616
2324
|
};
|
2617
|
-
const Memo_MRT_TableBody = react.memo(MRT_TableBody, (prev, next) => prev.table.options.data === next.table.options.data);
|
2325
|
+
const Memo_MRT_TableBody = react.memo(MRT_TableBody, (prev, next) => prev.table.options.data === next.table.options.data);
|
2326
|
+
|
2327
|
+
const MRT_TableFooterCell = (_a) => {
|
2328
|
+
var _b, _c, _d;
|
2329
|
+
var { footer, staticColumnIndex, table } = _a, rest = __rest(_a, ["footer", "staticColumnIndex", "table"]);
|
2330
|
+
const theme = styles.useTheme();
|
2331
|
+
const { getState, options: { enableColumnPinning, muiTableFooterCellProps }, } = table;
|
2332
|
+
const { density } = getState();
|
2333
|
+
const { column } = footer;
|
2334
|
+
const { columnDef } = column;
|
2335
|
+
const { columnDefType } = columnDef;
|
2336
|
+
const isColumnPinned = enableColumnPinning &&
|
2337
|
+
columnDef.columnDefType !== 'group' &&
|
2338
|
+
column.getIsPinned();
|
2339
|
+
const args = { column, table };
|
2340
|
+
const tableCellProps = Object.assign(Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTableFooterCellProps, args)), parseFromValuesOrFunc(columnDef.muiTableFooterCellProps, args)), rest);
|
2341
|
+
return (jsxRuntime.jsx(TableCell__default["default"], Object.assign({ align: columnDefType === 'group'
|
2342
|
+
? 'center'
|
2343
|
+
: theme.direction === 'rtl'
|
2344
|
+
? 'right'
|
2345
|
+
: 'left', colSpan: footer.colSpan, "data-index": staticColumnIndex, "data-pinned": !!isColumnPinned || undefined, variant: "footer" }, tableCellProps, { sx: (theme) => (Object.assign(Object.assign({ fontWeight: 'bold', p: density === 'compact'
|
2346
|
+
? '0.5rem'
|
2347
|
+
: density === 'comfortable'
|
2348
|
+
? '1rem'
|
2349
|
+
: '1.5rem', verticalAlign: 'top' }, getCommonMRTCellStyles({
|
2350
|
+
column,
|
2351
|
+
header: footer,
|
2352
|
+
table,
|
2353
|
+
tableCellProps,
|
2354
|
+
theme,
|
2355
|
+
})), parseFromValuesOrFunc(tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.sx, theme))), children: (_b = tableCellProps.children) !== null && _b !== void 0 ? _b : (footer.isPlaceholder
|
2356
|
+
? null
|
2357
|
+
: (_d = (_c = parseFromValuesOrFunc(columnDef.Footer, {
|
2358
|
+
column,
|
2359
|
+
footer,
|
2360
|
+
table,
|
2361
|
+
})) !== null && _c !== void 0 ? _c : columnDef.footer) !== null && _d !== void 0 ? _d : null) })));
|
2362
|
+
};
|
2363
|
+
|
2364
|
+
const MRT_TableFooterRow = (_a) => {
|
2365
|
+
var _b;
|
2366
|
+
var { columnVirtualizer, footerGroup, table } = _a, rest = __rest(_a, ["columnVirtualizer", "footerGroup", "table"]);
|
2367
|
+
const { options: { layoutMode, muiTableFooterRowProps }, } = table;
|
2368
|
+
const { virtualColumns, virtualPaddingLeft, virtualPaddingRight } = columnVirtualizer !== null && columnVirtualizer !== void 0 ? columnVirtualizer : {};
|
2369
|
+
// if no content in row, skip row
|
2370
|
+
if (!((_b = footerGroup.headers) === null || _b === void 0 ? void 0 : _b.some((header) => (typeof header.column.columnDef.footer === 'string' &&
|
2371
|
+
!!header.column.columnDef.footer) ||
|
2372
|
+
header.column.columnDef.Footer)))
|
2373
|
+
return null;
|
2374
|
+
const tableRowProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTableFooterRowProps, {
|
2375
|
+
footerGroup,
|
2376
|
+
table,
|
2377
|
+
})), rest);
|
2378
|
+
return (jsxRuntime.jsxs(TableRow__default["default"], Object.assign({}, tableRowProps, { sx: (theme) => (Object.assign({ backgroundColor: getMRTTheme(table, theme).baseBackgroundColor, display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'flex' : undefined, position: 'relative', width: '100%' }, parseFromValuesOrFunc(tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx, theme))), children: [virtualPaddingLeft ? (jsxRuntime.jsx("th", { style: { display: 'flex', width: virtualPaddingLeft } })) : null, (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : footerGroup.headers).map((footerOrVirtualFooter, staticColumnIndex) => {
|
2379
|
+
let footer = footerOrVirtualFooter;
|
2380
|
+
if (columnVirtualizer) {
|
2381
|
+
staticColumnIndex = footerOrVirtualFooter
|
2382
|
+
.index;
|
2383
|
+
footer = footerGroup.headers[staticColumnIndex];
|
2384
|
+
}
|
2385
|
+
return footer ? (jsxRuntime.jsx(MRT_TableFooterCell, { footer: footer, staticColumnIndex: staticColumnIndex, table: table }, footer.id)) : null;
|
2386
|
+
}), virtualPaddingRight ? (jsxRuntime.jsx("th", { style: { display: 'flex', width: virtualPaddingRight } })) : null] })));
|
2387
|
+
};
|
2388
|
+
|
2389
|
+
const MRT_TableFooter = (_a) => {
|
2390
|
+
var { columnVirtualizer, table } = _a, rest = __rest(_a, ["columnVirtualizer", "table"]);
|
2391
|
+
const { getFooterGroups, getState, options: { enableStickyFooter, layoutMode, muiTableFooterProps }, refs: { tableFooterRef }, } = table;
|
2392
|
+
const { isFullScreen } = getState();
|
2393
|
+
const tableFooterProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTableFooterProps, {
|
2394
|
+
table,
|
2395
|
+
})), rest);
|
2396
|
+
const stickFooter = (isFullScreen || enableStickyFooter) && enableStickyFooter !== false;
|
2397
|
+
return (jsxRuntime.jsx(TableFooter__default["default"], Object.assign({}, tableFooterProps, { ref: (ref) => {
|
2398
|
+
tableFooterRef.current = ref;
|
2399
|
+
if (tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.ref) {
|
2400
|
+
// @ts-ignore
|
2401
|
+
tableFooterProps.ref.current = ref;
|
2402
|
+
}
|
2403
|
+
}, sx: (theme) => (Object.assign({ bottom: stickFooter ? 0 : undefined, display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'grid' : undefined, opacity: stickFooter ? 0.97 : undefined, outline: stickFooter
|
2404
|
+
? theme.palette.mode === 'light'
|
2405
|
+
? `1px solid ${theme.palette.grey[300]}`
|
2406
|
+
: `1px solid ${theme.palette.grey[700]}`
|
2407
|
+
: undefined, position: stickFooter ? 'sticky' : 'relative', zIndex: stickFooter ? 1 : undefined }, parseFromValuesOrFunc(tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.sx, theme))), children: getFooterGroups().map((footerGroup) => (jsxRuntime.jsx(MRT_TableFooterRow, { columnVirtualizer: columnVirtualizer, footerGroup: footerGroup, table: table }, footerGroup.id))) })));
|
2408
|
+
};
|
2409
|
+
|
2410
|
+
const mrtFilterOptions = (localization) => [
|
2411
|
+
{
|
2412
|
+
divider: false,
|
2413
|
+
label: localization.filterFuzzy,
|
2414
|
+
option: 'fuzzy',
|
2415
|
+
symbol: '≈',
|
2416
|
+
},
|
2417
|
+
{
|
2418
|
+
divider: false,
|
2419
|
+
label: localization.filterContains,
|
2420
|
+
option: 'contains',
|
2421
|
+
symbol: '*',
|
2422
|
+
},
|
2423
|
+
{
|
2424
|
+
divider: false,
|
2425
|
+
label: localization.filterStartsWith,
|
2426
|
+
option: 'startsWith',
|
2427
|
+
symbol: 'a',
|
2428
|
+
},
|
2429
|
+
{
|
2430
|
+
divider: true,
|
2431
|
+
label: localization.filterEndsWith,
|
2432
|
+
option: 'endsWith',
|
2433
|
+
symbol: 'z',
|
2434
|
+
},
|
2435
|
+
{
|
2436
|
+
divider: false,
|
2437
|
+
label: localization.filterEquals,
|
2438
|
+
option: 'equals',
|
2439
|
+
symbol: '=',
|
2440
|
+
},
|
2441
|
+
{
|
2442
|
+
divider: true,
|
2443
|
+
label: localization.filterNotEquals,
|
2444
|
+
option: 'notEquals',
|
2445
|
+
symbol: '≠',
|
2446
|
+
},
|
2447
|
+
{
|
2448
|
+
divider: false,
|
2449
|
+
label: localization.filterBetween,
|
2450
|
+
option: 'between',
|
2451
|
+
symbol: '⇿',
|
2452
|
+
},
|
2453
|
+
{
|
2454
|
+
divider: true,
|
2455
|
+
label: localization.filterBetweenInclusive,
|
2456
|
+
option: 'betweenInclusive',
|
2457
|
+
symbol: '⬌',
|
2458
|
+
},
|
2459
|
+
{
|
2460
|
+
divider: false,
|
2461
|
+
label: localization.filterGreaterThan,
|
2462
|
+
option: 'greaterThan',
|
2463
|
+
symbol: '>',
|
2464
|
+
},
|
2465
|
+
{
|
2466
|
+
divider: false,
|
2467
|
+
label: localization.filterGreaterThanOrEqualTo,
|
2468
|
+
option: 'greaterThanOrEqualTo',
|
2469
|
+
symbol: '≥',
|
2470
|
+
},
|
2471
|
+
{
|
2472
|
+
divider: false,
|
2473
|
+
label: localization.filterLessThan,
|
2474
|
+
option: 'lessThan',
|
2475
|
+
symbol: '<',
|
2476
|
+
},
|
2477
|
+
{
|
2478
|
+
divider: true,
|
2479
|
+
label: localization.filterLessThanOrEqualTo,
|
2480
|
+
option: 'lessThanOrEqualTo',
|
2481
|
+
symbol: '≤',
|
2482
|
+
},
|
2483
|
+
{
|
2484
|
+
divider: false,
|
2485
|
+
label: localization.filterEmpty,
|
2486
|
+
option: 'empty',
|
2487
|
+
symbol: '∅',
|
2488
|
+
},
|
2489
|
+
{
|
2490
|
+
divider: false,
|
2491
|
+
label: localization.filterNotEmpty,
|
2492
|
+
option: 'notEmpty',
|
2493
|
+
symbol: '!∅',
|
2494
|
+
},
|
2495
|
+
];
|
2496
|
+
const rangeModes = ['between', 'betweenInclusive', 'inNumberRange'];
|
2497
|
+
const emptyModes = ['empty', 'notEmpty'];
|
2498
|
+
const arrModes = ['arrIncludesSome', 'arrIncludesAll', 'arrIncludes'];
|
2499
|
+
const rangeVariants = ['range-slider', 'date-range', 'datetime-range', 'range'];
|
2500
|
+
const MRT_FilterOptionMenu = (_a) => {
|
2501
|
+
var _b, _c, _d, _e;
|
2502
|
+
var { anchorEl, header, onSelect, setAnchorEl, setFilterValue, table } = _a, rest = __rest(_a, ["anchorEl", "header", "onSelect", "setAnchorEl", "setFilterValue", "table"]);
|
2503
|
+
const { getState, options: { columnFilterModeOptions, globalFilterModeOptions, localization, renderColumnFilterModeMenuItems, renderGlobalFilterModeMenuItems, }, setColumnFilterFns, setGlobalFilterFn, } = table;
|
2504
|
+
const { density, globalFilterFn } = getState();
|
2505
|
+
const { column } = header !== null && header !== void 0 ? header : {};
|
2506
|
+
const { columnDef } = column !== null && column !== void 0 ? column : {};
|
2507
|
+
const currentFilterValue = column === null || column === void 0 ? void 0 : column.getFilterValue();
|
2508
|
+
let allowedColumnFilterOptions = (_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.columnFilterModeOptions) !== null && _b !== void 0 ? _b : columnFilterModeOptions;
|
2509
|
+
if (rangeVariants.includes(columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant)) {
|
2510
|
+
allowedColumnFilterOptions = [
|
2511
|
+
...rangeModes,
|
2512
|
+
...(allowedColumnFilterOptions !== null && allowedColumnFilterOptions !== void 0 ? allowedColumnFilterOptions : []),
|
2513
|
+
].filter((option) => rangeModes.includes(option));
|
2514
|
+
}
|
2515
|
+
const internalFilterOptions = react.useMemo(() => mrtFilterOptions(localization).filter((filterOption) => columnDef
|
2516
|
+
? allowedColumnFilterOptions === undefined ||
|
2517
|
+
(allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions.includes(filterOption.option))
|
2518
|
+
: (!globalFilterModeOptions ||
|
2519
|
+
globalFilterModeOptions.includes(filterOption.option)) &&
|
2520
|
+
['contains', 'fuzzy', 'startsWith'].includes(filterOption.option)), []);
|
2521
|
+
const handleSelectFilterMode = (option) => {
|
2522
|
+
var _a, _b;
|
2523
|
+
const prevFilterMode = (_a = columnDef === null || columnDef === void 0 ? void 0 : columnDef._filterFn) !== null && _a !== void 0 ? _a : '';
|
2524
|
+
if (!header || !column) {
|
2525
|
+
// global filter mode
|
2526
|
+
setGlobalFilterFn(option);
|
2527
|
+
}
|
2528
|
+
else if (option !== prevFilterMode) {
|
2529
|
+
// column filter mode
|
2530
|
+
setColumnFilterFns((prev) => (Object.assign(Object.assign({}, prev), { [header.id]: option })));
|
2531
|
+
// reset filter value and/or perform new filter render
|
2532
|
+
if (emptyModes.includes(option)) {
|
2533
|
+
// will now be empty/notEmpty filter mode
|
2534
|
+
if (currentFilterValue !== ' ' &&
|
2535
|
+
!emptyModes.includes(prevFilterMode)) {
|
2536
|
+
column.setFilterValue(' ');
|
2537
|
+
}
|
2538
|
+
else if (currentFilterValue) {
|
2539
|
+
column.setFilterValue(currentFilterValue); // perform new filter render
|
2540
|
+
}
|
2541
|
+
}
|
2542
|
+
else if ((columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === 'multi-select' ||
|
2543
|
+
arrModes.includes(option)) {
|
2544
|
+
// will now be array filter mode
|
2545
|
+
if (currentFilterValue instanceof String ||
|
2546
|
+
(currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.length)) {
|
2547
|
+
column.setFilterValue([]);
|
2548
|
+
setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue([]);
|
2549
|
+
}
|
2550
|
+
else if (currentFilterValue) {
|
2551
|
+
column.setFilterValue(currentFilterValue); // perform new filter render
|
2552
|
+
}
|
2553
|
+
}
|
2554
|
+
else if (((_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === null || _b === void 0 ? void 0 : _b.includes('range')) ||
|
2555
|
+
rangeModes.includes(option)) {
|
2556
|
+
// will now be range filter mode
|
2557
|
+
if (!Array.isArray(currentFilterValue) ||
|
2558
|
+
(!(currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.every((v) => v === '')) &&
|
2559
|
+
!rangeModes.includes(prevFilterMode))) {
|
2560
|
+
column.setFilterValue(['', '']);
|
2561
|
+
setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue('');
|
2562
|
+
}
|
2563
|
+
else {
|
2564
|
+
column.setFilterValue(currentFilterValue); // perform new filter render
|
2565
|
+
}
|
2566
|
+
}
|
2567
|
+
else {
|
2568
|
+
// will now be single value filter mode
|
2569
|
+
if (Array.isArray(currentFilterValue)) {
|
2570
|
+
column.setFilterValue('');
|
2571
|
+
setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue('');
|
2572
|
+
}
|
2573
|
+
else if (currentFilterValue === ' ' &&
|
2574
|
+
emptyModes.includes(prevFilterMode)) {
|
2575
|
+
column.setFilterValue(undefined);
|
2576
|
+
}
|
2577
|
+
else {
|
2578
|
+
column.setFilterValue(currentFilterValue); // perform new filter render
|
2579
|
+
}
|
2580
|
+
}
|
2581
|
+
}
|
2582
|
+
setAnchorEl(null);
|
2583
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect();
|
2584
|
+
};
|
2585
|
+
const filterOption = !!header && columnDef ? columnDef._filterFn : globalFilterFn;
|
2586
|
+
const theme = styles.useTheme();
|
2587
|
+
const { menuBackgroundColor } = getMRTTheme(table, theme);
|
2588
|
+
return (jsxRuntime.jsx(Menu__default["default"], Object.assign({ MenuListProps: {
|
2589
|
+
dense: density === 'compact',
|
2590
|
+
sx: {
|
2591
|
+
backgroundColor: menuBackgroundColor,
|
2592
|
+
},
|
2593
|
+
}, anchorEl: anchorEl, anchorOrigin: { horizontal: 'right', vertical: 'center' }, disableScrollLock: true, onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: (_e = (header && column && columnDef
|
2594
|
+
? (_d = (_c = columnDef.renderColumnFilterModeMenuItems) === null || _c === void 0 ? void 0 : _c.call(columnDef, {
|
2595
|
+
column: column,
|
2596
|
+
internalFilterOptions,
|
2597
|
+
onSelectFilterMode: handleSelectFilterMode,
|
2598
|
+
table,
|
2599
|
+
})) !== null && _d !== void 0 ? _d : renderColumnFilterModeMenuItems === null || renderColumnFilterModeMenuItems === void 0 ? void 0 : renderColumnFilterModeMenuItems({
|
2600
|
+
column: column,
|
2601
|
+
internalFilterOptions,
|
2602
|
+
onSelectFilterMode: handleSelectFilterMode,
|
2603
|
+
table,
|
2604
|
+
})
|
2605
|
+
: renderGlobalFilterModeMenuItems === null || renderGlobalFilterModeMenuItems === void 0 ? void 0 : renderGlobalFilterModeMenuItems({
|
2606
|
+
internalFilterOptions,
|
2607
|
+
onSelectFilterMode: handleSelectFilterMode,
|
2608
|
+
table,
|
2609
|
+
}))) !== null && _e !== void 0 ? _e : internalFilterOptions.map(({ divider, label, option, symbol }, index) => (jsxRuntime.jsx(MRT_ActionMenuItem, { divider: divider, icon: symbol, label: label, onClick: () => handleSelectFilterMode(option), selected: option === filterOption, table: table, value: option }, index))) })));
|
2610
|
+
};
|
2618
2611
|
|
2619
|
-
const
|
2620
|
-
var _b, _c, _d;
|
2621
|
-
var {
|
2622
|
-
const
|
2623
|
-
const {
|
2624
|
-
const { density } = getState();
|
2625
|
-
const { column } = footer;
|
2612
|
+
const MRT_ColumnActionMenu = (_a) => {
|
2613
|
+
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
2614
|
+
var { anchorEl, header, setAnchorEl, table } = _a, rest = __rest(_a, ["anchorEl", "header", "setAnchorEl", "table"]);
|
2615
|
+
const { getState, getAllLeafColumns, options: { columnFilterDisplayMode, columnFilterModeOptions, enableColumnFilterModes, enableColumnFilters, enableColumnPinning, enableColumnResizing, enableGrouping, enableHiding, enableSorting, enableSortingRemoval, icons: { ClearAllIcon, DynamicFeedIcon, FilterListIcon, FilterListOffIcon, PushPinIcon, RestartAltIcon, SortIcon, ViewColumnIcon, VisibilityOffIcon, }, localization, renderColumnActionsMenuItems, }, refs: { filterInputRefs }, setColumnFilterFns, setColumnOrder, setColumnSizingInfo, setShowColumnFilters, } = table;
|
2616
|
+
const { column } = header;
|
2626
2617
|
const { columnDef } = column;
|
2627
|
-
const {
|
2628
|
-
const
|
2629
|
-
|
2630
|
-
|
2631
|
-
|
2632
|
-
|
2633
|
-
|
2634
|
-
|
2635
|
-
|
2636
|
-
|
2637
|
-
|
2638
|
-
|
2639
|
-
|
2640
|
-
|
2641
|
-
|
2618
|
+
const { columnSizing, columnVisibility, density, showColumnFilters } = getState();
|
2619
|
+
const columnFilterValue = column.getFilterValue();
|
2620
|
+
const [filterMenuAnchorEl, setFilterMenuAnchorEl] = react.useState(null);
|
2621
|
+
const handleClearSort = () => {
|
2622
|
+
column.clearSorting();
|
2623
|
+
setAnchorEl(null);
|
2624
|
+
};
|
2625
|
+
const handleSortAsc = () => {
|
2626
|
+
column.toggleSorting(false);
|
2627
|
+
setAnchorEl(null);
|
2628
|
+
};
|
2629
|
+
const handleSortDesc = () => {
|
2630
|
+
column.toggleSorting(true);
|
2631
|
+
setAnchorEl(null);
|
2632
|
+
};
|
2633
|
+
const handleResetColumnSize = () => {
|
2634
|
+
setColumnSizingInfo((old) => (Object.assign(Object.assign({}, old), { isResizingColumn: false })));
|
2635
|
+
column.resetSize();
|
2636
|
+
setAnchorEl(null);
|
2637
|
+
};
|
2638
|
+
const handleHideColumn = () => {
|
2639
|
+
column.toggleVisibility(false);
|
2640
|
+
setAnchorEl(null);
|
2641
|
+
};
|
2642
|
+
const handlePinColumn = (pinDirection) => {
|
2643
|
+
column.pin(pinDirection);
|
2644
|
+
setAnchorEl(null);
|
2645
|
+
};
|
2646
|
+
const handleGroupByColumn = () => {
|
2647
|
+
column.toggleGrouping();
|
2648
|
+
setColumnOrder((old) => ['mrt-row-expand', ...old]);
|
2649
|
+
setAnchorEl(null);
|
2650
|
+
};
|
2651
|
+
const handleClearFilter = () => {
|
2652
|
+
column.setFilterValue(undefined);
|
2653
|
+
setAnchorEl(null);
|
2654
|
+
if (['empty', 'notEmpty'].includes(columnDef._filterFn)) {
|
2655
|
+
setColumnFilterFns((prev) => {
|
2656
|
+
var _a;
|
2657
|
+
return (Object.assign(Object.assign({}, prev), { [header.id]: (_a = allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions[0]) !== null && _a !== void 0 ? _a : 'fuzzy' }));
|
2658
|
+
});
|
2659
|
+
}
|
2660
|
+
};
|
2661
|
+
const handleFilterByColumn = () => {
|
2662
|
+
setShowColumnFilters(true);
|
2663
|
+
queueMicrotask(() => { var _a; return (_a = filterInputRefs.current[`${column.id}-0`]) === null || _a === void 0 ? void 0 : _a.focus(); });
|
2664
|
+
setAnchorEl(null);
|
2665
|
+
};
|
2666
|
+
const handleShowAllColumns = () => {
|
2667
|
+
getAllLeafColumns()
|
2668
|
+
.filter((col) => col.columnDef.enableHiding !== false)
|
2669
|
+
.forEach((col) => col.toggleVisibility(true));
|
2670
|
+
setAnchorEl(null);
|
2671
|
+
};
|
2672
|
+
const handleOpenFilterModeMenu = (event) => {
|
2673
|
+
event.stopPropagation();
|
2674
|
+
setFilterMenuAnchorEl(event.currentTarget);
|
2675
|
+
};
|
2676
|
+
const isSelectFilter = !!columnDef.filterSelectOptions;
|
2677
|
+
const allowedColumnFilterOptions = (_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.columnFilterModeOptions) !== null && _b !== void 0 ? _b : columnFilterModeOptions;
|
2678
|
+
const showFilterModeSubMenu = enableColumnFilterModes &&
|
2679
|
+
columnDef.enableColumnFilterModes !== false &&
|
2680
|
+
!isSelectFilter &&
|
2681
|
+
(allowedColumnFilterOptions === undefined ||
|
2682
|
+
!!(allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions.length));
|
2683
|
+
const internalColumnMenuItems = [
|
2684
|
+
...(enableSorting && column.getCanSort()
|
2685
|
+
? [
|
2686
|
+
enableSortingRemoval !== false && (jsxRuntime.jsx(MRT_ActionMenuItem, { icon: jsxRuntime.jsx(ClearAllIcon, {}), label: localization.clearSort, onClick: handleClearSort, table: table }, 0)),
|
2687
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: column.getIsSorted() === 'asc', icon: jsxRuntime.jsx(SortIcon, { style: { transform: 'rotate(180deg) scaleX(-1)' } }), label: (_c = localization.sortByColumnAsc) === null || _c === void 0 ? void 0 : _c.replace('{column}', String(columnDef.header)), onClick: handleSortAsc, table: table }, 1),
|
2688
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: column.getIsSorted() === 'desc', divider: enableColumnFilters || enableGrouping || enableHiding, icon: jsxRuntime.jsx(SortIcon, {}), label: (_d = localization.sortByColumnDesc) === null || _d === void 0 ? void 0 : _d.replace('{column}', String(columnDef.header)), onClick: handleSortDesc, table: table }, 2),
|
2689
|
+
]
|
2690
|
+
: []),
|
2691
|
+
...(enableColumnFilters && column.getCanFilter()
|
2692
|
+
? [
|
2693
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: !columnFilterValue ||
|
2694
|
+
(Array.isArray(columnFilterValue) &&
|
2695
|
+
!columnFilterValue.filter((value) => value).length), icon: jsxRuntime.jsx(FilterListOffIcon, {}), label: localization.clearFilter, onClick: handleClearFilter, table: table }, 3),
|
2696
|
+
columnFilterDisplayMode === 'subheader' && (jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: showColumnFilters && !enableColumnFilterModes, divider: enableGrouping || enableHiding, icon: jsxRuntime.jsx(FilterListIcon, {}), label: (_e = localization.filterByColumn) === null || _e === void 0 ? void 0 : _e.replace('{column}', String(columnDef.header)), onClick: showColumnFilters
|
2697
|
+
? handleOpenFilterModeMenu
|
2698
|
+
: handleFilterByColumn, onOpenSubMenu: showFilterModeSubMenu ? handleOpenFilterModeMenu : undefined, table: table }, 4)),
|
2699
|
+
showFilterModeSubMenu && (jsxRuntime.jsx(MRT_FilterOptionMenu, { anchorEl: filterMenuAnchorEl, header: header, onSelect: handleFilterByColumn, setAnchorEl: setFilterMenuAnchorEl, table: table }, 5)),
|
2700
|
+
].filter(Boolean)
|
2701
|
+
: []),
|
2702
|
+
...(enableGrouping && column.getCanGroup()
|
2703
|
+
? [
|
2704
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { divider: enableColumnPinning, icon: jsxRuntime.jsx(DynamicFeedIcon, {}), label: (_f = localization[column.getIsGrouped() ? 'ungroupByColumn' : 'groupByColumn']) === null || _f === void 0 ? void 0 : _f.replace('{column}', String(columnDef.header)), onClick: handleGroupByColumn, table: table }, 6),
|
2705
|
+
]
|
2706
|
+
: []),
|
2707
|
+
...(enableColumnPinning && column.getCanPin()
|
2708
|
+
? [
|
2709
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: column.getIsPinned() === 'left' || !column.getCanPin(), icon: jsxRuntime.jsx(PushPinIcon, { style: { transform: 'rotate(90deg)' } }), label: localization.pinToLeft, onClick: () => handlePinColumn('left'), table: table }, 7),
|
2710
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: column.getIsPinned() === 'right' || !column.getCanPin(), icon: jsxRuntime.jsx(PushPinIcon, { style: { transform: 'rotate(-90deg)' } }), label: localization.pinToRight, onClick: () => handlePinColumn('right'), table: table }, 8),
|
2711
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: !column.getIsPinned(), divider: enableHiding, icon: jsxRuntime.jsx(PushPinIcon, {}), label: localization.unpin, onClick: () => handlePinColumn(false), table: table }, 9),
|
2712
|
+
]
|
2713
|
+
: []),
|
2714
|
+
...(enableColumnResizing && column.getCanResize()
|
2715
|
+
? [
|
2716
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: !columnSizing[column.id], icon: jsxRuntime.jsx(RestartAltIcon, {}), label: localization.resetColumnSize, onClick: handleResetColumnSize, table: table }, 10),
|
2717
|
+
]
|
2718
|
+
: []),
|
2719
|
+
...(enableHiding
|
2720
|
+
? [
|
2721
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: !column.getCanHide(), icon: jsxRuntime.jsx(VisibilityOffIcon, {}), label: (_g = localization.hideColumn) === null || _g === void 0 ? void 0 : _g.replace('{column}', String(columnDef.header)), onClick: handleHideColumn, table: table }, 11),
|
2722
|
+
jsxRuntime.jsx(MRT_ActionMenuItem, { disabled: !Object.values(columnVisibility).filter((visible) => !visible)
|
2723
|
+
.length, icon: jsxRuntime.jsx(ViewColumnIcon, {}), label: (_h = localization.showAllColumns) === null || _h === void 0 ? void 0 : _h.replace('{column}', String(columnDef.header)), onClick: handleShowAllColumns, table: table }, 12),
|
2724
|
+
]
|
2725
|
+
: []),
|
2726
|
+
].filter(Boolean);
|
2727
|
+
const theme = styles.useTheme();
|
2728
|
+
const { menuBackgroundColor } = getMRTTheme(table, theme);
|
2729
|
+
return (jsxRuntime.jsx(Menu__default["default"], Object.assign({ MenuListProps: {
|
2730
|
+
dense: density === 'compact',
|
2731
|
+
sx: {
|
2732
|
+
backgroundColor: menuBackgroundColor,
|
2733
|
+
},
|
2734
|
+
}, anchorEl: anchorEl, disableScrollLock: true, onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: (_l = (_k = (_j = columnDef.renderColumnActionsMenuItems) === null || _j === void 0 ? void 0 : _j.call(columnDef, {
|
2735
|
+
closeMenu: () => setAnchorEl(null),
|
2642
2736
|
column,
|
2737
|
+
internalColumnMenuItems,
|
2643
2738
|
table,
|
2644
|
-
|
2645
|
-
|
2646
|
-
|
2647
|
-
|
2648
|
-
|
2649
|
-
|
2650
|
-
footer,
|
2651
|
-
table,
|
2652
|
-
})) !== null && _c !== void 0 ? _c : columnDef.footer) !== null && _d !== void 0 ? _d : null) })));
|
2653
|
-
};
|
2654
|
-
|
2655
|
-
const MRT_TableFooterRow = (_a) => {
|
2656
|
-
var _b;
|
2657
|
-
var { columnVirtualizer, footerGroup, table } = _a, rest = __rest(_a, ["columnVirtualizer", "footerGroup", "table"]);
|
2658
|
-
const { options: { layoutMode, muiTableFooterRowProps }, } = table;
|
2659
|
-
const { virtualColumns, virtualPaddingLeft, virtualPaddingRight } = columnVirtualizer !== null && columnVirtualizer !== void 0 ? columnVirtualizer : {};
|
2660
|
-
// if no content in row, skip row
|
2661
|
-
if (!((_b = footerGroup.headers) === null || _b === void 0 ? void 0 : _b.some((header) => (typeof header.column.columnDef.footer === 'string' &&
|
2662
|
-
!!header.column.columnDef.footer) ||
|
2663
|
-
header.column.columnDef.Footer)))
|
2664
|
-
return null;
|
2665
|
-
const tableRowProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTableFooterRowProps, {
|
2666
|
-
footerGroup,
|
2667
|
-
table,
|
2668
|
-
})), rest);
|
2669
|
-
return (jsxRuntime.jsxs(TableRow__default["default"], Object.assign({}, tableRowProps, { sx: (theme) => (Object.assign({ backgroundColor: getMRTTheme(table, theme).baseBackgroundColor, display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'flex' : undefined, width: '100%' }, parseFromValuesOrFunc(tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx, theme))), children: [virtualPaddingLeft ? (jsxRuntime.jsx("th", { style: { display: 'flex', width: virtualPaddingLeft } })) : null, (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : footerGroup.headers).map((footerOrVirtualFooter, staticColumnIndex) => {
|
2670
|
-
let footer = footerOrVirtualFooter;
|
2671
|
-
if (columnVirtualizer) {
|
2672
|
-
staticColumnIndex = footerOrVirtualFooter
|
2673
|
-
.index;
|
2674
|
-
footer = footerGroup.headers[staticColumnIndex];
|
2675
|
-
}
|
2676
|
-
return footer ? (jsxRuntime.jsx(MRT_TableFooterCell, { footer: footer, staticColumnIndex: staticColumnIndex, table: table }, footer.id)) : null;
|
2677
|
-
}), virtualPaddingRight ? (jsxRuntime.jsx("th", { style: { display: 'flex', width: virtualPaddingRight } })) : null] })));
|
2678
|
-
};
|
2679
|
-
|
2680
|
-
const MRT_TableFooter = (_a) => {
|
2681
|
-
var { columnVirtualizer, table } = _a, rest = __rest(_a, ["columnVirtualizer", "table"]);
|
2682
|
-
const { getFooterGroups, getState, options: { enableStickyFooter, layoutMode, muiTableFooterProps }, refs: { tableFooterRef }, } = table;
|
2683
|
-
const { isFullScreen } = getState();
|
2684
|
-
const tableFooterProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTableFooterProps, {
|
2685
|
-
table,
|
2686
|
-
})), rest);
|
2687
|
-
const stickFooter = (isFullScreen || enableStickyFooter) && enableStickyFooter !== false;
|
2688
|
-
return (jsxRuntime.jsx(TableFooter__default["default"], Object.assign({}, tableFooterProps, { ref: (ref) => {
|
2689
|
-
tableFooterRef.current = ref;
|
2690
|
-
if (tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.ref) {
|
2691
|
-
// @ts-ignore
|
2692
|
-
tableFooterProps.ref.current = ref;
|
2693
|
-
}
|
2694
|
-
}, sx: (theme) => (Object.assign({ bottom: stickFooter ? 0 : undefined, display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'grid' : undefined, opacity: stickFooter ? 0.97 : undefined, outline: stickFooter
|
2695
|
-
? theme.palette.mode === 'light'
|
2696
|
-
? `1px solid ${theme.palette.grey[300]}`
|
2697
|
-
: `1px solid ${theme.palette.grey[700]}`
|
2698
|
-
: undefined, position: stickFooter ? 'sticky' : undefined, zIndex: stickFooter ? 1 : undefined }, parseFromValuesOrFunc(tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.sx, theme))), children: getFooterGroups().map((footerGroup) => (jsxRuntime.jsx(MRT_TableFooterRow, { columnVirtualizer: columnVirtualizer, footerGroup: footerGroup, table: table }, footerGroup.id))) })));
|
2739
|
+
})) !== null && _k !== void 0 ? _k : renderColumnActionsMenuItems === null || renderColumnActionsMenuItems === void 0 ? void 0 : renderColumnActionsMenuItems({
|
2740
|
+
closeMenu: () => setAnchorEl(null),
|
2741
|
+
column,
|
2742
|
+
internalColumnMenuItems,
|
2743
|
+
table,
|
2744
|
+
})) !== null && _l !== void 0 ? _l : internalColumnMenuItems })));
|
2699
2745
|
};
|
2700
2746
|
|
2701
2747
|
const MRT_TableHeadCellColumnActionsButton = (_a) => {
|
@@ -2963,7 +3009,7 @@ const MRT_FilterTextField = (_a) => {
|
|
2963
3009
|
} }))) : isAutocompleteFilter ? (jsxRuntime.jsx(Autocomplete__default["default"], Object.assign({ freeSolo: true, getOptionLabel: (option) => getValueAndLabel(option).label, onChange: (_e, newValue) => handleChange(getValueAndLabel(newValue).value), options: (_t = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.map((option) => getValueAndLabel(option))) !== null && _t !== void 0 ? _t : [] }, autocompleteProps, { renderInput: (builtinTextFieldProps) => {
|
2964
3010
|
var _a;
|
2965
3011
|
return (jsxRuntime.jsx(TextField__default["default"], Object.assign({}, builtinTextFieldProps, commonTextFieldProps, { InputProps: Object.assign(Object.assign({}, builtinTextFieldProps.InputProps), { startAdornment: (_a = commonTextFieldProps === null || commonTextFieldProps === void 0 ? void 0 : commonTextFieldProps.InputProps) === null || _a === void 0 ? void 0 : _a.startAdornment }), inputProps: Object.assign(Object.assign({}, builtinTextFieldProps.inputProps), commonTextFieldProps === null || commonTextFieldProps === void 0 ? void 0 : commonTextFieldProps.inputProps), onChange: handleTextFieldChange, onClick: (e) => e.stopPropagation() })));
|
2966
|
-
}, value: filterValue }))) : (jsxRuntime.jsx(TextField__default["default"], Object.assign({ select: isSelectFilter || isMultiSelectFilter }, commonTextFieldProps, { SelectProps: Object.assign({ displayEmpty: true, multiple: isMultiSelectFilter, renderValue: isMultiSelectFilter
|
3012
|
+
}, value: filterValue }))) : (jsxRuntime.jsx(TextField__default["default"], Object.assign({ select: isSelectFilter || isMultiSelectFilter }, commonTextFieldProps, { SelectProps: Object.assign({ MenuProps: { disableScrollLock: true }, displayEmpty: true, multiple: isMultiSelectFilter, renderValue: isMultiSelectFilter
|
2967
3013
|
? (selected) => !(selected === null || selected === void 0 ? void 0 : selected.length) ? (jsxRuntime.jsx(Box__default["default"], { sx: { opacity: 0.5 }, children: filterPlaceholder })) : (jsxRuntime.jsx(Box__default["default"], { sx: { display: 'flex', flexWrap: 'wrap', gap: '2px' }, children: selected === null || selected === void 0 ? void 0 : selected.map((value) => {
|
2968
3014
|
const selectedValue = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.find((option) => getValueAndLabel(option).value === value);
|
2969
3015
|
return (jsxRuntime.jsx(Chip__default["default"], { label: getValueAndLabel(selectedValue).label }, value));
|
@@ -3119,7 +3165,7 @@ const MRT_TableHeadCellFilterLabel = (_a) => {
|
|
3119
3165
|
}, size: "small" }, rest, { sx: (theme) => (Object.assign({ height: '16px', ml: '4px', opacity: isFilterActive ? 1 : 0.3, p: '8px', transform: 'scale(0.75)', transition: 'all 150ms ease-in-out', width: '16px' }, parseFromValuesOrFunc(rest === null || rest === void 0 ? void 0 : rest.sx, theme))), children: jsxRuntime.jsx(FilterAltIcon, {}) })) }) }) }), jsxRuntime.jsx(Popover__default["default"], { anchorEl: anchorEl, anchorOrigin: {
|
3120
3166
|
horizontal: 'center',
|
3121
3167
|
vertical: 'top',
|
3122
|
-
}, onClick: (event) => event.stopPropagation(), onClose: (event) => {
|
3168
|
+
}, disableScrollLock: true, onClick: (event) => event.stopPropagation(), onClose: (event) => {
|
3123
3169
|
//@ts-ignore
|
3124
3170
|
event.stopPropagation();
|
3125
3171
|
setAnchorEl(null);
|
@@ -3240,7 +3286,7 @@ const MRT_TableHeadCellSortLabel = (_a) => {
|
|
3240
3286
|
|
3241
3287
|
const MRT_TableHeadCell = (_a) => {
|
3242
3288
|
var _b, _c, _d, _f, _g, _h;
|
3243
|
-
var { header, staticColumnIndex, table } = _a, rest = __rest(_a, ["header", "staticColumnIndex", "table"]);
|
3289
|
+
var { columnVirtualizer, header, staticColumnIndex, table } = _a, rest = __rest(_a, ["columnVirtualizer", "header", "staticColumnIndex", "table"]);
|
3244
3290
|
const theme = styles.useTheme();
|
3245
3291
|
const { getState, options: { columnFilterDisplayMode, columnResizeDirection, columnResizeMode, enableColumnActions, enableColumnDragging, enableColumnOrdering, enableColumnPinning, enableGrouping, enableMultiSort, layoutMode, muiTableHeadCellProps, }, refs: { tableHeadCellRefs }, setHoveredColumn, } = table;
|
3246
3292
|
const { columnSizingInfo, density, draggingColumn, grouping, hoveredColumn, showColumnFilters, } = getState();
|
@@ -3317,8 +3363,12 @@ const MRT_TableHeadCell = (_a) => {
|
|
3317
3363
|
: theme.direction === 'rtl'
|
3318
3364
|
? 'right'
|
3319
3365
|
: 'left', colSpan: header.colSpan, "data-index": staticColumnIndex, "data-pinned": !!isColumnPinned || undefined, onDragEnter: handleDragEnter, ref: (node) => {
|
3366
|
+
var _a;
|
3320
3367
|
if (node) {
|
3321
3368
|
tableHeadCellRefs.current[column.id] = node;
|
3369
|
+
if (columnDefType !== 'group') {
|
3370
|
+
(_a = columnVirtualizer === null || columnVirtualizer === void 0 ? void 0 : columnVirtualizer.measureElement) === null || _a === void 0 ? void 0 : _a.call(columnVirtualizer, node);
|
3371
|
+
}
|
3322
3372
|
}
|
3323
3373
|
} }, tableCellProps, { sx: (theme) => (Object.assign(Object.assign({ '& :hover': {
|
3324
3374
|
'.MuiButtonBase-root': {
|
@@ -3340,11 +3390,7 @@ const MRT_TableHeadCell = (_a) => {
|
|
3340
3390
|
? '0.25rem'
|
3341
3391
|
: density === 'comfortable'
|
3342
3392
|
? '.75rem'
|
3343
|
-
: '1.25rem', userSelect: enableMultiSort && column.getCanSort() ? 'none' : undefined, verticalAlign: 'top',
|
3344
|
-
? 3
|
3345
|
-
: column.getIsPinned() && columnDefType !== 'group'
|
3346
|
-
? 2
|
3347
|
-
: 1 }, getCommonMRTCellStyles({
|
3393
|
+
: '1.25rem', userSelect: enableMultiSort && column.getCanSort() ? 'none' : undefined, verticalAlign: 'top' }, getCommonMRTCellStyles({
|
3348
3394
|
column,
|
3349
3395
|
header,
|
3350
3396
|
table,
|
@@ -3394,20 +3440,22 @@ const MRT_TableHeadCell = (_a) => {
|
|
3394
3440
|
|
3395
3441
|
const MRT_TableHeadRow = (_a) => {
|
3396
3442
|
var { columnVirtualizer, headerGroup, table } = _a, rest = __rest(_a, ["columnVirtualizer", "headerGroup", "table"]);
|
3397
|
-
const { options: { layoutMode, muiTableHeadRowProps }, } = table;
|
3443
|
+
const { options: { enableStickyHeader, layoutMode, muiTableHeadRowProps }, } = table;
|
3398
3444
|
const { virtualColumns, virtualPaddingLeft, virtualPaddingRight } = columnVirtualizer !== null && columnVirtualizer !== void 0 ? columnVirtualizer : {};
|
3399
3445
|
const tableRowProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTableHeadRowProps, {
|
3400
3446
|
headerGroup,
|
3401
3447
|
table,
|
3402
3448
|
})), rest);
|
3403
|
-
return (jsxRuntime.jsxs(TableRow__default["default"], Object.assign({}, tableRowProps, { sx: (theme) => (Object.assign({ backgroundColor: getMRTTheme(table, theme).baseBackgroundColor, boxShadow: `4px 0 8px ${styles.alpha(theme.palette.common.black, 0.1)}`, display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'flex' : undefined,
|
3449
|
+
return (jsxRuntime.jsxs(TableRow__default["default"], Object.assign({}, tableRowProps, { sx: (theme) => (Object.assign({ backgroundColor: getMRTTheme(table, theme).baseBackgroundColor, boxShadow: `4px 0 8px ${styles.alpha(theme.palette.common.black, 0.1)}`, display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'flex' : undefined, position: enableStickyHeader && layoutMode === 'semantic'
|
3450
|
+
? 'sticky'
|
3451
|
+
: 'relative', top: 0 }, parseFromValuesOrFunc(tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx, theme))), children: [virtualPaddingLeft ? (jsxRuntime.jsx("th", { style: { display: 'flex', width: virtualPaddingLeft } })) : null, (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : headerGroup.headers).map((headerOrVirtualHeader, staticColumnIndex) => {
|
3404
3452
|
let header = headerOrVirtualHeader;
|
3405
3453
|
if (columnVirtualizer) {
|
3406
3454
|
staticColumnIndex = headerOrVirtualHeader
|
3407
3455
|
.index;
|
3408
3456
|
header = headerGroup.headers[staticColumnIndex];
|
3409
3457
|
}
|
3410
|
-
return header ? (jsxRuntime.jsx(MRT_TableHeadCell, { header: header, staticColumnIndex: staticColumnIndex, table: table }, header.id)) : null;
|
3458
|
+
return header ? (jsxRuntime.jsx(MRT_TableHeadCell, { columnVirtualizer: columnVirtualizer, header: header, staticColumnIndex: staticColumnIndex, table: table }, header.id)) : null;
|
3411
3459
|
}), virtualPaddingRight ? (jsxRuntime.jsx("th", { style: { display: 'flex', width: virtualPaddingRight } })) : null] })));
|
3412
3460
|
};
|
3413
3461
|
|
@@ -3497,7 +3545,7 @@ const MRT_Table = (_a) => {
|
|
3497
3545
|
columnVirtualizer,
|
3498
3546
|
table,
|
3499
3547
|
};
|
3500
|
-
return (jsxRuntime.jsxs(Table__default["default"], Object.assign({ stickyHeader: enableStickyHeader || isFullScreen }, tableProps, { style: Object.assign(Object.assign({}, columnSizeVars), tableProps === null || tableProps === void 0 ? void 0 : tableProps.style), sx: (theme) => (Object.assign({ borderCollapse: 'separate', display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'grid' : undefined }, parseFromValuesOrFunc(tableProps === null || tableProps === void 0 ? void 0 : tableProps.sx, theme))), children: [!!Caption && jsxRuntime.jsx("caption", { children: Caption }), enableTableHead && jsxRuntime.jsx(MRT_TableHead, Object.assign({}, commonTableGroupProps)), memoMode === 'table-body' || columnSizingInfo.isResizingColumn ? (jsxRuntime.jsx(Memo_MRT_TableBody, Object.assign({}, commonTableGroupProps))) : (jsxRuntime.jsx(MRT_TableBody, Object.assign({}, commonTableGroupProps))), enableTableFooter && jsxRuntime.jsx(MRT_TableFooter, Object.assign({}, commonTableGroupProps))] })));
|
3548
|
+
return (jsxRuntime.jsxs(Table__default["default"], Object.assign({ stickyHeader: enableStickyHeader || isFullScreen }, tableProps, { style: Object.assign(Object.assign({}, columnSizeVars), tableProps === null || tableProps === void 0 ? void 0 : tableProps.style), sx: (theme) => (Object.assign({ borderCollapse: 'separate', display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'grid' : undefined, position: 'relative' }, parseFromValuesOrFunc(tableProps === null || tableProps === void 0 ? void 0 : tableProps.sx, theme))), children: [!!Caption && jsxRuntime.jsx("caption", { children: Caption }), enableTableHead && jsxRuntime.jsx(MRT_TableHead, Object.assign({}, commonTableGroupProps)), memoMode === 'table-body' || columnSizingInfo.isResizingColumn ? (jsxRuntime.jsx(Memo_MRT_TableBody, Object.assign({}, commonTableGroupProps))) : (jsxRuntime.jsx(MRT_TableBody, Object.assign({}, commonTableGroupProps))), enableTableFooter && jsxRuntime.jsx(MRT_TableFooter, Object.assign({}, commonTableGroupProps))] })));
|
3501
3549
|
};
|
3502
3550
|
|
3503
3551
|
const MRT_TableLoadingOverlay = (_a) => {
|
@@ -3520,6 +3568,52 @@ const MRT_TableLoadingOverlay = (_a) => {
|
|
3520
3568
|
}), children: jsxRuntime.jsx(CircularProgress__default["default"], Object.assign({ "aria-label": localization.noRecordsToDisplay, id: "mrt-progress" }, circularProgressProps)) }));
|
3521
3569
|
};
|
3522
3570
|
|
3571
|
+
const MRT_CellActionMenu = (_a) => {
|
3572
|
+
var _b, _c;
|
3573
|
+
var { table } = _a, rest = __rest(_a, ["table"]);
|
3574
|
+
const { getState, options: { editDisplayMode, enableClickToCopy, enableEditing, icons: { ContentCopy, EditIcon }, localization, renderCellActionMenuItems, }, refs: { actionCellRef }, } = table;
|
3575
|
+
const { actionCell, density } = getState();
|
3576
|
+
const cell = actionCell;
|
3577
|
+
const { row } = cell;
|
3578
|
+
const { column } = cell;
|
3579
|
+
const { columnDef } = column;
|
3580
|
+
const theme = styles.useTheme();
|
3581
|
+
const { menuBackgroundColor } = getMRTTheme(table, theme);
|
3582
|
+
const handleClose = (event) => {
|
3583
|
+
event === null || event === void 0 ? void 0 : event.stopPropagation();
|
3584
|
+
table.setActionCell(null);
|
3585
|
+
actionCellRef.current = null;
|
3586
|
+
};
|
3587
|
+
const internalMenuItems = [
|
3588
|
+
(parseFromValuesOrFunc(enableClickToCopy, cell) === 'context-menu' ||
|
3589
|
+
parseFromValuesOrFunc(columnDef.enableClickToCopy, cell) ===
|
3590
|
+
'context-menu') && (jsxRuntime.jsx(MRT_ActionMenuItem, { icon: jsxRuntime.jsx(ContentCopy, {}), label: localization.copy, onClick: (event) => {
|
3591
|
+
event.stopPropagation();
|
3592
|
+
navigator.clipboard.writeText(cell.getValue());
|
3593
|
+
handleClose();
|
3594
|
+
}, table: table }, 'mrt-copy')),
|
3595
|
+
parseFromValuesOrFunc(enableEditing, row) && editDisplayMode === 'cell' && (jsxRuntime.jsx(MRT_ActionMenuItem, { icon: jsxRuntime.jsx(EditIcon, {}), label: localization.edit, onClick: () => {
|
3596
|
+
openEditingCell({ cell, table });
|
3597
|
+
handleClose();
|
3598
|
+
}, table: table }, 'mrt-edit')),
|
3599
|
+
].filter(Boolean);
|
3600
|
+
const renderActionProps = {
|
3601
|
+
cell,
|
3602
|
+
closeMenu: handleClose,
|
3603
|
+
column,
|
3604
|
+
internalMenuItems,
|
3605
|
+
row,
|
3606
|
+
table,
|
3607
|
+
};
|
3608
|
+
const menuItems = (_c = (_b = columnDef.renderCellActionMenuItems) === null || _b === void 0 ? void 0 : _b.call(columnDef, renderActionProps)) !== null && _c !== void 0 ? _c : renderCellActionMenuItems === null || renderCellActionMenuItems === void 0 ? void 0 : renderCellActionMenuItems(renderActionProps);
|
3609
|
+
return ((!!(menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) || !!(internalMenuItems === null || internalMenuItems === void 0 ? void 0 : internalMenuItems.length)) && (jsxRuntime.jsx(Menu__default["default"], Object.assign({ MenuListProps: {
|
3610
|
+
dense: density === 'compact',
|
3611
|
+
sx: {
|
3612
|
+
backgroundColor: menuBackgroundColor,
|
3613
|
+
},
|
3614
|
+
}, anchorEl: actionCellRef.current, disableScrollLock: true, onClick: (event) => event.stopPropagation(), onClose: handleClose, open: !!cell, transformOrigin: { horizontal: -100, vertical: 8 } }, rest, { children: menuItems !== null && menuItems !== void 0 ? menuItems : internalMenuItems }))));
|
3615
|
+
};
|
3616
|
+
|
3523
3617
|
const MRT_EditRowModal = (_a) => {
|
3524
3618
|
var _b;
|
3525
3619
|
var { open, table } = _a, rest = __rest(_a, ["open", "table"]);
|
@@ -3564,8 +3658,8 @@ const MRT_EditRowModal = (_a) => {
|
|
3564
3658
|
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? react.useLayoutEffect : react.useEffect;
|
3565
3659
|
const MRT_TableContainer = (_a) => {
|
3566
3660
|
var { table } = _a, rest = __rest(_a, ["table"]);
|
3567
|
-
const { getState, options: { createDisplayMode, editDisplayMode, enableStickyHeader, muiTableContainerProps, }, refs: { bottomToolbarRef, tableContainerRef, topToolbarRef }, } = table;
|
3568
|
-
const { creatingRow, editingRow, isFullScreen, isLoading, showLoadingOverlay, } = getState();
|
3661
|
+
const { getState, options: { createDisplayMode, editDisplayMode, enableCellActions, enableStickyHeader, muiTableContainerProps, }, refs: { bottomToolbarRef, tableContainerRef, topToolbarRef }, } = table;
|
3662
|
+
const { actionCell, creatingRow, editingRow, isFullScreen, isLoading, showLoadingOverlay, } = getState();
|
3569
3663
|
const loading = showLoadingOverlay !== false && (isLoading || showLoadingOverlay);
|
3570
3664
|
const [totalToolbarHeight, setTotalToolbarHeight] = react.useState(0);
|
3571
3665
|
const tableContainerProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTableContainerProps, {
|
@@ -3595,7 +3689,7 @@ const MRT_TableContainer = (_a) => {
|
|
3595
3689
|
? `calc(100vh - ${totalToolbarHeight}px)`
|
3596
3690
|
: undefined }, tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.style), sx: (theme) => (Object.assign({ maxHeight: enableStickyHeader
|
3597
3691
|
? `clamp(350px, calc(100vh - ${totalToolbarHeight}px), 9999px)`
|
3598
|
-
: undefined, maxWidth: '100%', overflow: 'auto', position: 'relative' }, parseFromValuesOrFunc(tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.sx, theme))), children: [loading ? jsxRuntime.jsx(MRT_TableLoadingOverlay, { table: table }) : null, jsxRuntime.jsx(MRT_Table, { table: table }), (createModalOpen || editModalOpen) && (jsxRuntime.jsx(MRT_EditRowModal, { open: true, table: table }))] })));
|
3692
|
+
: undefined, maxWidth: '100%', overflow: 'auto', position: 'relative' }, parseFromValuesOrFunc(tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.sx, theme))), children: [loading ? jsxRuntime.jsx(MRT_TableLoadingOverlay, { table: table }) : null, jsxRuntime.jsx(MRT_Table, { table: table }), (createModalOpen || editModalOpen) && (jsxRuntime.jsx(MRT_EditRowModal, { open: true, table: table })), enableCellActions && actionCell && jsxRuntime.jsx(MRT_CellActionMenu, { table: table })] })));
|
3599
3693
|
};
|
3600
3694
|
|
3601
3695
|
const MRT_LinearProgressBar = (_a) => {
|
@@ -3618,6 +3712,7 @@ const defaultRowsPerPage = [5, 10, 15, 20, 25, 30, 50, 100];
|
|
3618
3712
|
const MRT_TablePagination = (_a) => {
|
3619
3713
|
var { position = 'bottom', table } = _a, rest = __rest(_a, ["position", "table"]);
|
3620
3714
|
const theme = styles.useTheme();
|
3715
|
+
const isMobile = useMediaQuery__default["default"]('(max-width: 720px)');
|
3621
3716
|
const { getPrePaginationRowModel, getState, options: { enableToolbarInternalActions, icons: { ChevronLeftIcon, ChevronRightIcon, FirstPageIcon, LastPageIcon }, localization, muiPaginationProps, paginationDisplayMode, rowCount, }, setPageIndex, setPageSize, } = table;
|
3622
3717
|
const { pagination: { pageIndex = 0, pageSize = 10 }, showGlobalFilter, } = getState();
|
3623
3718
|
const paginationProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiPaginationProps, {
|
@@ -3628,9 +3723,12 @@ const MRT_TablePagination = (_a) => {
|
|
3628
3723
|
const showFirstLastPageButtons = numberOfPages > 2;
|
3629
3724
|
const firstRowIndex = pageIndex * pageSize;
|
3630
3725
|
const lastRowIndex = Math.min(pageIndex * pageSize + pageSize, totalRowCount);
|
3631
|
-
const _b = paginationProps !== null && paginationProps !== void 0 ? paginationProps : {}, { SelectProps, disabled = false, rowsPerPageOptions = defaultRowsPerPage, showFirstButton = showFirstLastPageButtons, showLastButton = showFirstLastPageButtons, showRowsPerPage = true } = _b,
|
3726
|
+
const _b = paginationProps !== null && paginationProps !== void 0 ? paginationProps : {}, { SelectProps = {}, disabled = false, rowsPerPageOptions = defaultRowsPerPage, showFirstButton = showFirstLastPageButtons, showLastButton = showFirstLastPageButtons, showRowsPerPage = true } = _b, restPaginationProps = __rest(_b, ["SelectProps", "disabled", "rowsPerPageOptions", "showFirstButton", "showLastButton", "showRowsPerPage"]);
|
3632
3727
|
const disableBack = pageIndex <= 0 || disabled;
|
3633
3728
|
const disableNext = lastRowIndex >= totalRowCount || disabled;
|
3729
|
+
if (isMobile && (SelectProps === null || SelectProps === void 0 ? void 0 : SelectProps.native) !== false) {
|
3730
|
+
SelectProps.native = true;
|
3731
|
+
}
|
3634
3732
|
const tooltipProps = getCommonTooltipProps();
|
3635
3733
|
return (jsxRuntime.jsxs(Box__default["default"], { className: "MuiTablePagination-root", sx: {
|
3636
3734
|
alignItems: 'center',
|
@@ -3648,7 +3746,10 @@ const MRT_TablePagination = (_a) => {
|
|
3648
3746
|
px: '8px',
|
3649
3747
|
py: '12px',
|
3650
3748
|
zIndex: 2,
|
3651
|
-
}, children: [showRowsPerPage && (jsxRuntime.jsxs(Box__default["default"], { sx: { alignItems: 'center', display: 'flex', gap: '8px' }, children: [jsxRuntime.jsx(InputLabel__default["default"], { htmlFor: "mrt-rows-per-page", sx: { mb: 0 }, children: localization.rowsPerPage }), jsxRuntime.jsx(Select__default["default"], Object.assign({
|
3749
|
+
}, children: [showRowsPerPage && (jsxRuntime.jsxs(Box__default["default"], { sx: { alignItems: 'center', display: 'flex', gap: '8px' }, children: [jsxRuntime.jsx(InputLabel__default["default"], { htmlFor: "mrt-rows-per-page", sx: { mb: 0 }, children: localization.rowsPerPage }), jsxRuntime.jsx(Select__default["default"], Object.assign({ MenuProps: { disableScrollLock: true }, disableUnderline: true, disabled: disabled, inputProps: {
|
3750
|
+
'aria-label': localization.rowsPerPage,
|
3751
|
+
id: 'mrt-rows-per-page',
|
3752
|
+
}, label: localization.rowsPerPage, onChange: (event) => setPageSize(+event.target.value), sx: { mb: 0 }, value: pageSize, variant: "standard" }, SelectProps, { children: rowsPerPageOptions.map((option) => {
|
3652
3753
|
var _a;
|
3653
3754
|
const value = typeof option !== 'number' ? option.value : option;
|
3654
3755
|
const label = typeof option !== 'number' ? option.label : `${option}`;
|
@@ -3658,7 +3759,7 @@ const MRT_TablePagination = (_a) => {
|
|
3658
3759
|
last: LastPageIcon,
|
3659
3760
|
next: ChevronRightIcon,
|
3660
3761
|
previous: ChevronLeftIcon,
|
3661
|
-
} }, item))), showFirstButton: showFirstButton, showLastButton: showLastButton },
|
3762
|
+
} }, item))), showFirstButton: showFirstButton, showLastButton: showLastButton }, restPaginationProps))) : paginationDisplayMode === 'default' ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography__default["default"], { align: "center", component: "span", sx: { m: '0 4px', minWidth: '8ch' }, variant: "body2", children: `${lastRowIndex === 0 ? 0 : (firstRowIndex + 1).toLocaleString()}-${lastRowIndex.toLocaleString()} ${localization.of} ${totalRowCount.toLocaleString()}` }), jsxRuntime.jsxs(Box__default["default"], { gap: "xs", children: [showFirstButton && (jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, tooltipProps, { title: localization.goToFirstPage, children: jsxRuntime.jsx("span", { children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToFirstPage, disabled: disableBack, onClick: () => setPageIndex(0), size: "small", children: jsxRuntime.jsx(FirstPageIcon, Object.assign({}, flipIconStyles(theme))) }) }) }))), jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, tooltipProps, { title: localization.goToPreviousPage, children: jsxRuntime.jsx("span", { children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToPreviousPage, disabled: disableBack, onClick: () => setPageIndex(pageIndex - 1), size: "small", children: jsxRuntime.jsx(ChevronLeftIcon, Object.assign({}, flipIconStyles(theme))) }) }) })), jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, tooltipProps, { title: localization.goToNextPage, children: jsxRuntime.jsx("span", { children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToNextPage, disabled: disableNext, onClick: () => setPageIndex(pageIndex + 1), size: "small", children: jsxRuntime.jsx(ChevronRightIcon, Object.assign({}, flipIconStyles(theme))) }) }) })), showLastButton && (jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, tooltipProps, { title: localization.goToLastPage, children: jsxRuntime.jsx("span", { children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.goToLastPage, disabled: disableNext, onClick: () => setPageIndex(numberOfPages - 1), size: "small", children: jsxRuntime.jsx(LastPageIcon, Object.assign({}, flipIconStyles(theme))) }) }) })))] })] })) : null] }));
|
3662
3763
|
};
|
3663
3764
|
|
3664
3765
|
const MRT_ToolbarDropZone = (_a) => {
|
@@ -3831,12 +3932,12 @@ const MRT_ShowHideColumnsMenu = (_a) => {
|
|
3831
3932
|
sx: {
|
3832
3933
|
backgroundColor: menuBackgroundColor,
|
3833
3934
|
},
|
3834
|
-
}, anchorEl: anchorEl, onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: [jsxRuntime.jsxs(Box__default["default"], { sx: {
|
3935
|
+
}, anchorEl: anchorEl, disableScrollLock: true, onClose: () => setAnchorEl(null), open: !!anchorEl }, rest, { children: [jsxRuntime.jsxs(Box__default["default"], { sx: {
|
3835
3936
|
display: 'flex',
|
3836
3937
|
justifyContent: 'space-between',
|
3837
3938
|
p: '0.5rem',
|
3838
3939
|
pt: 0,
|
3839
|
-
}, children: [enableHiding && (jsxRuntime.jsx(Button__default["default"], { disabled: !getIsSomeColumnsVisible(), onClick: () => handleToggleAllColumns(false), children: localization.hideAll })), enableColumnOrdering && (jsxRuntime.jsx(Button__default["default"], { onClick: () => table.setColumnOrder(getDefaultColumnOrderIds(table.options)), children: localization.resetOrder })), enableColumnPinning && (jsxRuntime.jsx(Button__default["default"], { disabled: !getIsSomeColumnsPinned(), onClick: () => table.resetColumnPinning(true), children: localization.unpinAll })), enableHiding && (jsxRuntime.jsx(Button__default["default"], { disabled: getIsAllColumnsVisible(), onClick: () => handleToggleAllColumns(true), children: localization.showAll }))] }), jsxRuntime.jsx(Divider__default["default"], {}), allColumns.map((column, index) => (jsxRuntime.jsx(MRT_ShowHideColumnsMenuItems, { allColumns: allColumns, column: column, hoveredColumn: hoveredColumn, setHoveredColumn: setHoveredColumn, table: table }, `${index}-${column.id}`)))] })));
|
3940
|
+
}, children: [enableHiding && (jsxRuntime.jsx(Button__default["default"], { disabled: !getIsSomeColumnsVisible(), onClick: () => handleToggleAllColumns(false), children: localization.hideAll })), enableColumnOrdering && (jsxRuntime.jsx(Button__default["default"], { onClick: () => table.setColumnOrder(getDefaultColumnOrderIds(table.options, true)), children: localization.resetOrder })), enableColumnPinning && (jsxRuntime.jsx(Button__default["default"], { disabled: !getIsSomeColumnsPinned(), onClick: () => table.resetColumnPinning(true), children: localization.unpinAll })), enableHiding && (jsxRuntime.jsx(Button__default["default"], { disabled: getIsAllColumnsVisible(), onClick: () => handleToggleAllColumns(true), children: localization.showAll }))] }), jsxRuntime.jsx(Divider__default["default"], {}), allColumns.map((column, index) => (jsxRuntime.jsx(MRT_ShowHideColumnsMenuItems, { allColumns: allColumns, column: column, hoveredColumn: hoveredColumn, setHoveredColumn: setHoveredColumn, table: table }, `${index}-${column.id}`)))] })));
|
3840
3941
|
};
|
3841
3942
|
|
3842
3943
|
const MRT_ShowHideColumnsButton = (_a) => {
|
@@ -4053,6 +4154,7 @@ const MaterialReactTable = (props) => {
|
|
4053
4154
|
return jsxRuntime.jsx(MRT_TablePaper, { table: table });
|
4054
4155
|
};
|
4055
4156
|
|
4157
|
+
exports.MRT_ActionMenuItem = MRT_ActionMenuItem;
|
4056
4158
|
exports.MRT_AggregationFns = MRT_AggregationFns;
|
4057
4159
|
exports.MRT_BottomToolbar = MRT_BottomToolbar;
|
4058
4160
|
exports.MRT_ColumnActionMenu = MRT_ColumnActionMenu;
|
@@ -4118,8 +4220,6 @@ exports.MaterialReactTable = MaterialReactTable;
|
|
4118
4220
|
exports.Memo_MRT_TableBody = Memo_MRT_TableBody;
|
4119
4221
|
exports.Memo_MRT_TableBodyCell = Memo_MRT_TableBodyCell;
|
4120
4222
|
exports.Memo_MRT_TableBodyRow = Memo_MRT_TableBodyRow;
|
4121
|
-
exports.commonListItemStyles = commonListItemStyles;
|
4122
|
-
exports.commonMenuItemStyles = commonMenuItemStyles;
|
4123
4223
|
exports.createMRTColumnHelper = createMRTColumnHelper;
|
4124
4224
|
exports.createRow = createRow;
|
4125
4225
|
exports.defaultDisplayColumnProps = defaultDisplayColumnProps;
|
@@ -4137,7 +4237,9 @@ exports.getIsRowSelected = getIsRowSelected;
|
|
4137
4237
|
exports.getLeadingDisplayColumnIds = getLeadingDisplayColumnIds;
|
4138
4238
|
exports.getTotalRight = getTotalRight;
|
4139
4239
|
exports.getTrailingDisplayColumnIds = getTrailingDisplayColumnIds;
|
4240
|
+
exports.isCellEditable = isCellEditable;
|
4140
4241
|
exports.mrtFilterOptions = mrtFilterOptions;
|
4242
|
+
exports.openEditingCell = openEditingCell;
|
4141
4243
|
exports.prepareColumns = prepareColumns;
|
4142
4244
|
exports.rankGlobalFuzzy = rankGlobalFuzzy;
|
4143
4245
|
exports.reorderColumn = reorderColumn;
|