material-react-table 2.0.4 → 2.0.5
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.d.ts +2 -1
- package/dist/index.esm.js +27 -45
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +27 -45
- package/dist/index.js.map +1 -1
- package/dist/types/MaterialReactTable.d.ts +7 -0
- package/dist/types/aggregationFns.d.ts +11 -0
- package/dist/types/body/MRT_TableBody.d.ts +13 -0
- package/dist/types/body/MRT_TableBodyCell.d.ts +15 -0
- package/dist/types/body/MRT_TableBodyCellValue.d.ts +8 -0
- package/dist/types/body/MRT_TableBodyRow.d.ts +18 -0
- package/dist/types/body/MRT_TableBodyRowGrabHandle.d.ts +10 -0
- package/dist/types/body/MRT_TableBodyRowPinButton.d.ts +8 -0
- package/dist/types/body/MRT_TableDetailPanel.d.ts +13 -0
- package/dist/types/body/index.d.ts +7 -0
- package/dist/types/buttons/MRT_ColumnPinningButtons.d.ts +8 -0
- package/dist/types/buttons/MRT_CopyButton.d.ts +8 -0
- package/dist/types/buttons/MRT_EditActionButtons.d.ts +9 -0
- package/dist/types/buttons/MRT_ExpandAllButton.d.ts +7 -0
- package/dist/types/buttons/MRT_ExpandButton.d.ts +8 -0
- package/dist/types/buttons/MRT_GrabHandleButton.d.ts +12 -0
- package/dist/types/buttons/MRT_RowPinButton.d.ts +10 -0
- package/dist/types/buttons/MRT_ShowHideColumnsButton.d.ts +7 -0
- package/dist/types/buttons/MRT_ToggleDensePaddingButton.d.ts +7 -0
- package/dist/types/buttons/MRT_ToggleFiltersButton.d.ts +7 -0
- package/dist/types/buttons/MRT_ToggleFullScreenButton.d.ts +7 -0
- package/dist/types/buttons/MRT_ToggleGlobalFilterButton.d.ts +7 -0
- package/dist/types/buttons/MRT_ToggleRowActionMenuButton.d.ts +9 -0
- package/dist/types/buttons/index.d.ts +13 -0
- package/dist/types/column.utils.d.ts +127 -0
- package/dist/types/filterFns.d.ts +69 -0
- package/dist/types/footer/MRT_TableFooter.d.ts +11 -0
- package/dist/types/footer/MRT_TableFooterCell.d.ts +8 -0
- package/dist/types/footer/MRT_TableFooterRow.d.ts +12 -0
- package/dist/types/footer/index.d.ts +3 -0
- package/dist/types/head/MRT_TableHead.d.ts +11 -0
- package/dist/types/head/MRT_TableHeadCell.d.ts +8 -0
- package/dist/types/head/MRT_TableHeadCellColumnActionsButton.d.ts +8 -0
- package/dist/types/head/MRT_TableHeadCellFilterContainer.d.ts +8 -0
- package/dist/types/head/MRT_TableHeadCellFilterLabel.d.ts +8 -0
- package/dist/types/head/MRT_TableHeadCellGrabHandle.d.ts +10 -0
- package/dist/types/head/MRT_TableHeadCellResizeHandle.d.ts +8 -0
- package/dist/types/head/MRT_TableHeadCellSortLabel.d.ts +8 -0
- package/dist/types/head/MRT_TableHeadRow.d.ts +12 -0
- package/dist/types/head/index.d.ts +9 -0
- package/dist/types/hooks/index.d.ts +4 -0
- package/dist/types/hooks/useMRT_DisplayColumns.d.ts +9 -0
- package/dist/types/hooks/useMRT_Effects.d.ts +2 -0
- package/dist/types/hooks/useMRT_TableInstance.d.ts +2 -0
- package/dist/types/hooks/useMRT_TableOptions.d.ts +22 -0
- package/dist/types/icons.d.ts +36 -0
- package/dist/types/index.d.ts +18 -0
- package/dist/types/inputs/MRT_EditCellTextField.d.ts +8 -0
- package/dist/types/inputs/MRT_FilterCheckbox.d.ts +8 -0
- package/dist/types/inputs/MRT_FilterRangeFields.d.ts +8 -0
- package/dist/types/inputs/MRT_FilterRangeSlider.d.ts +8 -0
- package/dist/types/inputs/MRT_FilterTextField.d.ts +9 -0
- package/dist/types/inputs/MRT_GlobalFilterTextField.d.ts +7 -0
- package/dist/types/inputs/MRT_SelectCheckbox.d.ts +9 -0
- package/dist/types/inputs/index.d.ts +7 -0
- package/dist/types/locales/am.d.ts +2 -0
- package/dist/types/locales/ar.d.ts +2 -0
- package/dist/types/locales/az.d.ts +2 -0
- package/dist/types/locales/bg.d.ts +2 -0
- package/dist/types/locales/cs.d.ts +2 -0
- package/dist/types/locales/da.d.ts +2 -0
- package/dist/types/locales/de.d.ts +2 -0
- package/dist/types/locales/en.d.ts +2 -0
- package/dist/types/locales/es.d.ts +2 -0
- package/dist/types/locales/et.d.ts +2 -0
- package/dist/types/locales/fa.d.ts +2 -0
- package/dist/types/locales/fi.d.ts +2 -0
- package/dist/types/locales/fr.d.ts +2 -0
- package/dist/types/locales/hu.d.ts +2 -0
- package/dist/types/locales/hy.d.ts +2 -0
- package/dist/types/locales/id.d.ts +2 -0
- package/dist/types/locales/it.d.ts +2 -0
- package/dist/types/locales/ja.d.ts +2 -0
- package/dist/types/locales/ko.d.ts +2 -0
- package/dist/types/locales/nl.d.ts +2 -0
- package/dist/types/locales/no.d.ts +2 -0
- package/dist/types/locales/np.d.ts +2 -0
- package/dist/types/locales/pl.d.ts +2 -0
- package/dist/types/locales/pt-BR.d.ts +2 -0
- package/dist/types/locales/pt.d.ts +2 -0
- package/dist/types/locales/ro.d.ts +2 -0
- package/dist/types/locales/ru.d.ts +2 -0
- package/dist/types/locales/sk.d.ts +2 -0
- package/dist/types/locales/sr-Cyrl-RS.d.ts +2 -0
- package/dist/types/locales/sr-Latn-RS.d.ts +2 -0
- package/dist/types/locales/sv.d.ts +2 -0
- package/dist/types/locales/tr.d.ts +2 -0
- package/dist/types/locales/uk.d.ts +2 -0
- package/dist/types/locales/vi.d.ts +2 -0
- package/dist/types/locales/zh-Hans.d.ts +2 -0
- package/dist/types/locales/zh-Hant.d.ts +2 -0
- package/dist/types/menus/MRT_ColumnActionMenu.d.ts +20 -0
- package/dist/types/menus/MRT_FilterOptionMenu.d.ts +13 -0
- package/dist/types/menus/MRT_RowActionMenu.d.ts +12 -0
- package/dist/types/menus/MRT_ShowHideColumnsMenu.d.ts +10 -0
- package/dist/types/menus/MRT_ShowHideColumnsMenuItems.d.ts +12 -0
- package/dist/types/menus/index.d.ts +5 -0
- package/dist/types/modals/MRT_EditRowModal.d.ts +8 -0
- package/dist/types/modals/index.d.ts +1 -0
- package/dist/types/sortingFns.d.ts +12 -0
- package/dist/types/style.utils.d.ts +32 -0
- package/dist/types/table/MRT_Table.d.ts +7 -0
- package/dist/types/table/MRT_TableContainer.d.ts +7 -0
- package/dist/types/table/MRT_TableLoadingOverlay.d.ts +7 -0
- package/dist/types/table/MRT_TablePaper.d.ts +7 -0
- package/dist/types/table/index.d.ts +5 -0
- package/dist/types/toolbar/MRT_BottomToolbar.d.ts +7 -0
- package/dist/types/toolbar/MRT_LinearProgressBar.d.ts +8 -0
- package/dist/types/toolbar/MRT_TablePagination.d.ts +14 -0
- package/dist/types/toolbar/MRT_ToolbarAlertBanner.d.ts +8 -0
- package/dist/types/toolbar/MRT_ToolbarDropZone.d.ts +7 -0
- package/dist/types/toolbar/MRT_ToolbarInternalButtons.d.ts +7 -0
- package/dist/types/toolbar/MRT_TopToolbar.d.ts +6 -0
- package/dist/types/toolbar/index.d.ts +7 -0
- package/dist/types/types.d.ts +854 -0
- package/dist/types/useMaterialReactTable.d.ts +2 -0
- package/package.json +32 -32
- package/src/body/MRT_TableBody.tsx +18 -23
- package/src/body/MRT_TableBodyCellValue.tsx +1 -1
- package/src/head/MRT_TableHeadCellSortLabel.tsx +15 -9
- package/src/inputs/MRT_GlobalFilterTextField.tsx +10 -10
- package/src/toolbar/MRT_TablePagination.tsx +1 -0
- package/src/types.ts +2 -0
package/dist/index.js
CHANGED
@@ -517,7 +517,7 @@ const MRT_TableBodyCellValue = ({ cell, table, }) => {
|
|
517
517
|
allowedTypes.includes(typeof renderedCellValue) &&
|
518
518
|
((filterValue &&
|
519
519
|
allowedTypes.includes(typeof filterValue) &&
|
520
|
-
|
520
|
+
['autocomplete', 'text'].includes(columnDef.filterVariant)) ||
|
521
521
|
(globalFilter &&
|
522
522
|
allowedTypes.includes(typeof globalFilter) &&
|
523
523
|
column.getCanGlobalFilter()))) {
|
@@ -1076,19 +1076,18 @@ const MRT_TableBody = (_a) => {
|
|
1076
1076
|
const virtualRows = rowVirtualizer
|
1077
1077
|
? rowVirtualizer.getVirtualItems()
|
1078
1078
|
: undefined;
|
1079
|
+
const commonRowProps = {
|
1080
|
+
columnVirtualizer,
|
1081
|
+
numRows: rows.length,
|
1082
|
+
table,
|
1083
|
+
virtualColumns,
|
1084
|
+
virtualPaddingLeft,
|
1085
|
+
virtualPaddingRight,
|
1086
|
+
};
|
1079
1087
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!(rowPinningDisplayMode === null || rowPinningDisplayMode === void 0 ? void 0 : rowPinningDisplayMode.includes('sticky')) &&
|
1080
1088
|
getIsSomeRowsPinned('top') && (jsxRuntime.jsx(TableBody__default["default"], Object.assign({}, tableBodyProps, { sx: (theme) => (Object.assign({ display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'grid' : undefined, position: 'sticky', top: tableHeadHeight - 1, zIndex: 1 }, parseFromValuesOrFunc(tableBodyProps === null || tableBodyProps === void 0 ? void 0 : tableBodyProps.sx, theme))), children: getTopRows().map((row, rowIndex) => {
|
1081
|
-
const props = {
|
1082
|
-
|
1083
|
-
measureElement: rowVirtualizer === null || rowVirtualizer === void 0 ? void 0 : rowVirtualizer.measureElement,
|
1084
|
-
numRows: rows.length,
|
1085
|
-
row,
|
1086
|
-
rowIndex,
|
1087
|
-
table,
|
1088
|
-
virtualColumns,
|
1089
|
-
virtualPaddingLeft,
|
1090
|
-
virtualPaddingRight,
|
1091
|
-
};
|
1089
|
+
const props = Object.assign(Object.assign({}, commonRowProps), { row,
|
1090
|
+
rowIndex });
|
1092
1091
|
return memoMode === 'rows' ? (jsxRuntime.jsx(Memo_MRT_TableBodyRow, Object.assign({}, props), row.id)) : (jsxRuntime.jsx(MRT_TableBodyRow, Object.assign({}, props), row.id));
|
1093
1092
|
}) }))), jsxRuntime.jsxs(TableBody__default["default"], Object.assign({}, tableBodyProps, { sx: (theme) => (Object.assign({ display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'grid' : undefined, height: rowVirtualizer
|
1094
1093
|
? `${rowVirtualizer.getTotalSize()}px`
|
@@ -1109,36 +1108,16 @@ const MRT_TableBody = (_a) => {
|
|
1109
1108
|
const row = rowVirtualizer
|
1110
1109
|
? rows[rowOrVirtualRow.index]
|
1111
1110
|
: rowOrVirtualRow;
|
1112
|
-
const props = {
|
1113
|
-
|
1114
|
-
measureElement: rowVirtualizer === null || rowVirtualizer === void 0 ? void 0 : rowVirtualizer.measureElement,
|
1115
|
-
numRows: rows.length,
|
1116
|
-
pinnedRowIds,
|
1117
|
-
row,
|
1118
|
-
rowIndex: rowVirtualizer ? rowOrVirtualRow.index : rowIndex,
|
1119
|
-
table,
|
1120
|
-
virtualColumns,
|
1121
|
-
virtualPaddingLeft,
|
1122
|
-
virtualPaddingRight,
|
1123
|
-
virtualRow: rowVirtualizer
|
1111
|
+
const props = Object.assign(Object.assign({}, commonRowProps), { measureElement: rowVirtualizer === null || rowVirtualizer === void 0 ? void 0 : rowVirtualizer.measureElement, pinnedRowIds,
|
1112
|
+
row, rowIndex: rowVirtualizer ? rowOrVirtualRow.index : rowIndex, virtualRow: rowVirtualizer
|
1124
1113
|
? rowOrVirtualRow
|
1125
|
-
: undefined
|
1126
|
-
};
|
1127
|
-
return memoMode === 'rows' ? (jsxRuntime.jsx(Memo_MRT_TableBodyRow, Object.assign({}, props), row.id)) : (jsxRuntime.jsx(MRT_TableBodyRow, Object.assign({}, props), row.id));
|
1114
|
+
: undefined });
|
1115
|
+
return memoMode === 'rows' ? (jsxRuntime.jsx(Memo_MRT_TableBodyRow, Object.assign({}, props), `${row.id}${row.index}`)) : (jsxRuntime.jsx(MRT_TableBodyRow, Object.assign({}, props), `${row.id}${row.index}`));
|
1128
1116
|
}) })))] })), !(rowPinningDisplayMode === null || rowPinningDisplayMode === void 0 ? void 0 : rowPinningDisplayMode.includes('sticky')) &&
|
1129
1117
|
getIsSomeRowsPinned('bottom') && (jsxRuntime.jsx(TableBody__default["default"], Object.assign({}, tableBodyProps, { sx: (theme) => (Object.assign({ bottom: tableFooterHeight - 1, display: (layoutMode === null || layoutMode === void 0 ? void 0 : layoutMode.startsWith('grid')) ? 'grid' : undefined, position: 'sticky', zIndex: 1 }, parseFromValuesOrFunc(tableBodyProps === null || tableBodyProps === void 0 ? void 0 : tableBodyProps.sx, theme))), children: getBottomRows().map((row, rowIndex) => {
|
1130
|
-
const props = {
|
1131
|
-
|
1132
|
-
|
1133
|
-
numRows: rows.length,
|
1134
|
-
row,
|
1135
|
-
rowIndex,
|
1136
|
-
table,
|
1137
|
-
virtualColumns,
|
1138
|
-
virtualPaddingLeft,
|
1139
|
-
virtualPaddingRight,
|
1140
|
-
};
|
1141
|
-
return memoMode === 'rows' ? (jsxRuntime.jsx(Memo_MRT_TableBodyRow, Object.assign({}, props), row.id)) : (jsxRuntime.jsx(MRT_TableBodyRow, Object.assign({}, props), row.id));
|
1118
|
+
const props = Object.assign(Object.assign({}, commonRowProps), { row,
|
1119
|
+
rowIndex });
|
1120
|
+
return memoMode === 'rows' ? (jsxRuntime.jsx(Memo_MRT_TableBodyRow, Object.assign({}, props), `${row.id}`)) : (jsxRuntime.jsx(MRT_TableBodyRow, Object.assign({}, props), row.id));
|
1142
1121
|
}) })))] }));
|
1143
1122
|
};
|
1144
1123
|
const Memo_MRT_TableBody = react.memo(MRT_TableBody, (prev, next) => prev.table.options.data === next.table.options.data);
|
@@ -1759,7 +1738,7 @@ const MRT_FilterTextField = (_a) => {
|
|
1759
1738
|
localization[`filter${((_l = currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.charAt(0)) === null || _l === void 0 ? void 0 : _l.toUpperCase()) +
|
1760
1739
|
(currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.slice(1))}`]) })) : null, inputProps: {
|
1761
1740
|
'aria-label': filterPlaceholder,
|
1762
|
-
autoComplete: 'new-password',
|
1741
|
+
autoComplete: 'new-password', // disable autocomplete and autofill
|
1763
1742
|
disabled: !!filterChipLabel,
|
1764
1743
|
sx: {
|
1765
1744
|
textOverflow: 'ellipsis',
|
@@ -2041,11 +2020,14 @@ const MRT_TableHeadCellSortLabel = (_a) => {
|
|
2041
2020
|
: column.getNextSortingOrder() === 'desc'
|
2042
2021
|
? localization.sortByColumnDesc.replace('{column}', columnDef.header)
|
2043
2022
|
: localization.sortByColumnAsc.replace('{column}', columnDef.header);
|
2023
|
+
const direction = isSorted
|
2024
|
+
? column.getIsSorted()
|
2025
|
+
: undefined;
|
2044
2026
|
return (jsxRuntime.jsx(Tooltip__default["default"], { placement: "top", title: sortTooltip, children: jsxRuntime.jsx(Badge__default["default"], { badgeContent: sorting.length > 1 ? column.getSortIndex() + 1 : 0, overlap: "circular", children: jsxRuntime.jsx(TableSortLabel__default["default"], Object.assign({ IconComponent: !isSorted
|
2045
|
-
? (props) => (jsxRuntime.jsx(SyncAltIcon, Object.assign({}, props, { style: {
|
2027
|
+
? (props) => (jsxRuntime.jsx(SyncAltIcon, Object.assign({}, props, { direction: direction, style: {
|
2046
2028
|
transform: 'rotate(-90deg) scaleX(0.9) translateX(-1px)',
|
2047
2029
|
} })))
|
2048
|
-
: ArrowDownwardIcon, active: true, "aria-label": sortTooltip, direction:
|
2030
|
+
: ArrowDownwardIcon, active: true, "aria-label": sortTooltip, direction: direction, onClick: (e) => {
|
2049
2031
|
var _a;
|
2050
2032
|
e.stopPropagation();
|
2051
2033
|
(_a = header.column.getToggleSortingHandler()) === null || _a === void 0 ? void 0 : _a(e);
|
@@ -2244,7 +2226,7 @@ const MRT_TablePagination = (_a) => {
|
|
2244
2226
|
const firstRowIndex = pageIndex * pageSize;
|
2245
2227
|
const lastRowIndex = Math.min(pageIndex * pageSize + pageSize, totalRowCount);
|
2246
2228
|
const _b = paginationProps !== null && paginationProps !== void 0 ? paginationProps : {}, { SelectProps, rowsPerPageOptions = defaultRowsPerPage, showFirstButton = showFirstLastPageButtons, showLastButton = showFirstLastPageButtons, showRowsPerPage = true } = _b, _rest = __rest(_b, ["SelectProps", "rowsPerPageOptions", "showFirstButton", "showLastButton", "showRowsPerPage"]);
|
2247
|
-
return (jsxRuntime.jsxs(Box__default["default"], { sx: {
|
2229
|
+
return (jsxRuntime.jsxs(Box__default["default"], { className: "MuiTablePagination-root", sx: {
|
2248
2230
|
alignItems: 'center',
|
2249
2231
|
display: 'flex',
|
2250
2232
|
flexWrap: 'wrap',
|
@@ -2310,10 +2292,10 @@ const MRT_GlobalFilterTextField = (_a) => {
|
|
2310
2292
|
}
|
2311
2293
|
isMounted.current = true;
|
2312
2294
|
}, [globalFilter]);
|
2313
|
-
return (jsxRuntime.jsxs(Collapse__default["default"], { in: showGlobalFilter, mountOnEnter: true, orientation: "horizontal", unmountOnExit: true, children: [jsxRuntime.jsx(TextField__default["default"], Object.assign({ InputProps: Object.assign(Object.assign({ endAdornment: (jsxRuntime.jsx(InputAdornment__default["default"], { position: "end", children: jsxRuntime.jsx(Tooltip__default["default"], { title: (_b = localization.clearSearch) !== null && _b !== void 0 ? _b : '', children: jsxRuntime.jsx("span", { children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.clearSearch, disabled: !(searchValue === null || searchValue === void 0 ? void 0 : searchValue.length), onClick: handleClear, size: "small", children: jsxRuntime.jsx(CloseIcon, {}) }) }) }) })), startAdornment: enableGlobalFilterModes ? (jsxRuntime.jsx(InputAdornment__default["default"], { position: "start", children: jsxRuntime.jsx(Tooltip__default["default"], { title: localization.changeSearchMode, children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.changeSearchMode, onClick: handleGlobalFilterMenuOpen, size: "small", sx: { height: '1.75rem', width: '1.75rem' }, children: jsxRuntime.jsx(SearchIcon, {}) }) }) })) : (jsxRuntime.jsx(SearchIcon, { style: { marginRight: '4px' } })) }, textFieldProps.InputProps), { sx: (theme) => {
|
2295
|
+
return (jsxRuntime.jsxs(Collapse__default["default"], { in: showGlobalFilter, mountOnEnter: true, orientation: "horizontal", unmountOnExit: true, children: [jsxRuntime.jsx(TextField__default["default"], Object.assign({ inputProps: Object.assign({ autoComplete: 'new-password' }, textFieldProps.inputProps), onChange: handleChange, placeholder: localization.search, size: "small", value: searchValue !== null && searchValue !== void 0 ? searchValue : '', variant: "outlined" }, textFieldProps, { InputProps: Object.assign(Object.assign({ endAdornment: (jsxRuntime.jsx(InputAdornment__default["default"], { position: "end", children: jsxRuntime.jsx(Tooltip__default["default"], { title: (_b = localization.clearSearch) !== null && _b !== void 0 ? _b : '', children: jsxRuntime.jsx("span", { children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.clearSearch, disabled: !(searchValue === null || searchValue === void 0 ? void 0 : searchValue.length), onClick: handleClear, size: "small", children: jsxRuntime.jsx(CloseIcon, {}) }) }) }) })), startAdornment: enableGlobalFilterModes ? (jsxRuntime.jsx(InputAdornment__default["default"], { position: "start", children: jsxRuntime.jsx(Tooltip__default["default"], { title: localization.changeSearchMode, children: jsxRuntime.jsx(IconButton__default["default"], { "aria-label": localization.changeSearchMode, onClick: handleGlobalFilterMenuOpen, size: "small", sx: { height: '1.75rem', width: '1.75rem' }, children: jsxRuntime.jsx(SearchIcon, {}) }) }) })) : (jsxRuntime.jsx(SearchIcon, { style: { marginRight: '4px' } })) }, textFieldProps.InputProps), { sx: (theme) => {
|
2314
2296
|
var _a;
|
2315
2297
|
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)));
|
2316
|
-
} }),
|
2298
|
+
} }), inputRef: (inputRef) => {
|
2317
2299
|
searchInputRef.current = inputRef;
|
2318
2300
|
if (textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.inputRef) {
|
2319
2301
|
textFieldProps.inputRef = inputRef;
|