material-react-table-narender 2.13.5 → 2.13.7
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.d.ts +3 -0
- package/dist/index.esm.js +32 -5
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +32 -4
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/menus/MRT_ShowHideColumnsMenu.tsx +12 -0
- package/src/components/menus/MRT_ShowHideColumnsMenuItems.tsx +29 -0
- package/src/icons.ts +2 -0
- package/src/locales/te.ts +0 -0
- package/src/utils/cell.utils.ts +32 -0
package/dist/index.d.ts
CHANGED
@@ -233,6 +233,9 @@ declare const MRT_Default_Icons: {
|
|
233
233
|
readonly VisibilityOffIcon: _mui_material_OverridableComponent.OverridableComponent<_mui_material.SvgIconTypeMap<{}, "svg">> & {
|
234
234
|
muiName: string;
|
235
235
|
};
|
236
|
+
readonly SettingsBackupRestoreIcon: _mui_material_OverridableComponent.OverridableComponent<_mui_material.SvgIconTypeMap<{}, "svg">> & {
|
237
|
+
muiName: string;
|
238
|
+
};
|
236
239
|
};
|
237
240
|
type MRT_Icons = Record<keyof typeof MRT_Default_Icons, any>;
|
238
241
|
|
package/dist/index.esm.js
CHANGED
@@ -48,9 +48,10 @@ import SortIcon from '@mui/icons-material/Sort';
|
|
48
48
|
import SyncAltIcon from '@mui/icons-material/SyncAlt';
|
49
49
|
import ViewColumnIcon from '@mui/icons-material/ViewColumn';
|
50
50
|
import VisibilityOffIcon from '@mui/icons-material/VisibilityOff';
|
51
|
+
import SettingsBackupRestoreIcon from '@mui/icons-material/SettingsBackupRestore';
|
51
52
|
import { defaultRangeExtractor, useVirtualizer } from '@tanstack/react-virtual';
|
52
53
|
import Paper from '@mui/material/Paper';
|
53
|
-
import { useTheme as useTheme$1 } from '@mui/material';
|
54
|
+
import { Button as Button$1, useTheme as useTheme$1 } from '@mui/material';
|
54
55
|
import TableContainer from '@mui/material/TableContainer';
|
55
56
|
import Table from '@mui/material/Table';
|
56
57
|
import TableBody from '@mui/material/TableBody';
|
@@ -502,6 +503,26 @@ const cellKeyboardShortcuts = ({ cell, cellElements, cellValue, containerElement
|
|
502
503
|
'PageDown',
|
503
504
|
].includes(event.key)) {
|
504
505
|
event.preventDefault();
|
506
|
+
// if (['ArrowDown'].includes(event.key)) {
|
507
|
+
// debugger; // This will pause execution for debugging purposes
|
508
|
+
// // Select the input element within the MUI Autocomplete component
|
509
|
+
// const autocomplete = currentCell.querySelector('.MuiAutocomplete-root input[type="text"]');
|
510
|
+
// // Check if the current cell is an MUI Autocomplete
|
511
|
+
// if (autocomplete) {
|
512
|
+
// return; // Exit the function if it's an Autocomplete
|
513
|
+
// }
|
514
|
+
// // Additional logic for when it's not an Autocomplete can go here
|
515
|
+
// }
|
516
|
+
if (['ArrowDown', 'ArrowUp'].includes(event.key)) {
|
517
|
+
const autocomplete = currentCell.querySelector('.MuiAutocomplete-root input[type="text"]');
|
518
|
+
// Check if the autocomplete input exists and is focused
|
519
|
+
if (autocomplete && document.activeElement === autocomplete) {
|
520
|
+
// Do something with the autocomplete input
|
521
|
+
console.log('Autocomplete input found and is focused:', autocomplete);
|
522
|
+
return; // Exit if it's an Autocomplete and it is focused
|
523
|
+
}
|
524
|
+
// Additional logic if not an Autocomplete or not focused
|
525
|
+
}
|
505
526
|
const currentRow = parentElement || currentCell.closest('tr');
|
506
527
|
const tableElement = containerElement || currentCell.closest('table');
|
507
528
|
const allCells = cellElements ||
|
@@ -1270,6 +1291,7 @@ const MRT_Default_Icons = {
|
|
1270
1291
|
SyncAltIcon,
|
1271
1292
|
ViewColumnIcon,
|
1272
1293
|
VisibilityOffIcon,
|
1294
|
+
SettingsBackupRestoreIcon
|
1273
1295
|
};
|
1274
1296
|
|
1275
1297
|
const MRT_Localization_EN = {
|
@@ -3992,7 +4014,7 @@ const MRT_ColumnPinningButtons = (_a) => {
|
|
3992
4014
|
const MRT_ShowHideColumnsMenuItems = (_a) => {
|
3993
4015
|
var _b;
|
3994
4016
|
var { allColumns, column, hoveredColumn, isNestedColumns, setHoveredColumn, table } = _a, rest = __rest(_a, ["allColumns", "column", "hoveredColumn", "isNestedColumns", "setHoveredColumn", "table"]);
|
3995
|
-
const { getState, options: { enableColumnOrdering, enableColumnPinning, enableHiding, localization, mrtTheme: { draggingBorderColor }, }, setColumnOrder, } = table;
|
4017
|
+
const { getState, options: { enableColumnOrdering, enableColumnPinning, enableHiding, localization, enableColumnResizing, mrtTheme: { draggingBorderColor }, icons: { SettingsBackupRestoreIcon }, }, setColumnOrder, } = table;
|
3996
4018
|
const { columnOrder } = getState();
|
3997
4019
|
const { columnDef } = column;
|
3998
4020
|
const { columnDefType } = columnDef;
|
@@ -4053,12 +4075,15 @@ const MRT_ShowHideColumnsMenuItems = (_a) => {
|
|
4053
4075
|
opacity: columnDefType !== 'display' ? 1 : 0.5,
|
4054
4076
|
},
|
4055
4077
|
},
|
4056
|
-
}, control: jsx(Tooltip, Object.assign({}, getCommonTooltipProps(), { title: localization.toggleVisibility, children: jsx(Switch, {}) })), disabled: !column.getCanHide(), label: columnDef.header, onChange: () => handleToggleColumnHidden(column) })) : (jsx(Typography, { sx: { alignSelf: 'center' }, children: columnDef.header }))
|
4078
|
+
}, control: jsx(Tooltip, Object.assign({}, getCommonTooltipProps(), { title: localization.toggleVisibility, children: jsx(Switch, {}) })), disabled: !column.getCanHide(), label: columnDef.header, onChange: () => handleToggleColumnHidden(column) })) : (jsx(Typography, { sx: { alignSelf: 'center' }, children: columnDef.header })), enableColumnResizing && columnDefType !== 'group' &&
|
4079
|
+
(columnDef.enableResizing !== false ? (jsx(Tooltip, Object.assign({}, getCommonTooltipProps(), { title: localization.resetColumnSize, children: jsx(Button$1, { onClick: () => {
|
4080
|
+
column.resetSize();
|
4081
|
+
}, children: jsx(SettingsBackupRestoreIcon, {}) }) }))) : (jsx(Box, { sx: { width: '28px' } })))] }) })), (_b = column.columns) === null || _b === void 0 ? void 0 : _b.map((c, i) => (jsx(MRT_ShowHideColumnsMenuItems, { allColumns: allColumns, column: c, hoveredColumn: hoveredColumn, isNestedColumns: isNestedColumns, setHoveredColumn: setHoveredColumn, table: table }, `${i}-${c.id}`)))] }));
|
4057
4082
|
};
|
4058
4083
|
|
4059
4084
|
const MRT_ShowHideColumnsMenu = (_a) => {
|
4060
4085
|
var { anchorEl, setAnchorEl, table } = _a, rest = __rest(_a, ["anchorEl", "setAnchorEl", "table"]);
|
4061
|
-
const { getAllColumns, getAllLeafColumns, getCenterLeafColumns, getIsAllColumnsVisible, getIsSomeColumnsPinned, getIsSomeColumnsVisible, getLeftLeafColumns, getRightLeafColumns, getState, options: { enableColumnOrdering, enableColumnPinning, enableHiding, localization, mrtTheme: { menuBackgroundColor }, }, } = table;
|
4086
|
+
const { getAllColumns, getAllLeafColumns, getCenterLeafColumns, getIsAllColumnsVisible, getIsSomeColumnsPinned, getIsSomeColumnsVisible, getLeftLeafColumns, getRightLeafColumns, getState, options: { enableColumnOrdering, enableColumnPinning, enableHiding, localization, enableColumnResizing, mrtTheme: { menuBackgroundColor }, }, } = table;
|
4062
4087
|
const { columnOrder, columnPinning, density } = getState();
|
4063
4088
|
const handleToggleAllColumns = (value) => {
|
4064
4089
|
getAllLeafColumns()
|
@@ -4096,7 +4121,9 @@ const MRT_ShowHideColumnsMenu = (_a) => {
|
|
4096
4121
|
justifyContent: 'space-between',
|
4097
4122
|
p: '0.5rem',
|
4098
4123
|
pt: 0,
|
4099
|
-
}, children: [enableHiding && (jsx(Button, { disabled: !getIsSomeColumnsVisible(), onClick: () => handleToggleAllColumns(false), children: localization.hideAll })), enableColumnOrdering && (jsx(Button, { onClick: () => table.setColumnOrder(getDefaultColumnOrderIds(table.options, true)), children: localization.resetOrder })), enableColumnPinning && (jsx(Button, { disabled: !getIsSomeColumnsPinned(), onClick: () => table.resetColumnPinning(true), children: localization.unpinAll })), enableHiding && (jsx(Button, { disabled: getIsAllColumnsVisible(), onClick: () => handleToggleAllColumns(true), children: localization.showAll }))
|
4124
|
+
}, children: [enableHiding && (jsx(Button, { disabled: !getIsSomeColumnsVisible(), onClick: () => handleToggleAllColumns(false), children: localization.hideAll })), enableColumnOrdering && (jsx(Button, { onClick: () => table.setColumnOrder(getDefaultColumnOrderIds(table.options, true)), children: localization.resetOrder })), enableColumnPinning && (jsx(Button, { disabled: !getIsSomeColumnsPinned(), onClick: () => table.resetColumnPinning(true), children: localization.unpinAll })), enableHiding && (jsx(Button, { disabled: getIsAllColumnsVisible(), onClick: () => handleToggleAllColumns(true), children: localization.showAll })), enableColumnResizing && (jsx(Button, { onClick: () => {
|
4125
|
+
table.resetColumnSizing(true);
|
4126
|
+
}, children: localization.resetColumnSize }))] }), jsx(Divider, {}), allColumns.map((column, index) => (jsx(MRT_ShowHideColumnsMenuItems, { allColumns: allColumns, column: column, hoveredColumn: hoveredColumn, isNestedColumns: isNestedColumns, setHoveredColumn: setHoveredColumn, table: table }, `${index}-${column.id}`)))] })));
|
4100
4127
|
};
|
4101
4128
|
|
4102
4129
|
const MRT_ShowHideColumnsButton = (_a) => {
|