material-react-table 0.5.8 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/dist/MaterialReactTable.d.ts +1 -10
  2. package/dist/body/MRT_TableBodyCell.d.ts +1 -1
  3. package/dist/body/MRT_TableBodyRow.d.ts +1 -1
  4. package/dist/body/MRT_TableDetailPanel.d.ts +1 -1
  5. package/dist/buttons/MRT_EditActionButtons.d.ts +1 -1
  6. package/dist/buttons/MRT_ExpandButton.d.ts +1 -1
  7. package/dist/buttons/MRT_ToggleColumnActionMenuButton.d.ts +1 -1
  8. package/dist/buttons/MRT_ToggleRowActionMenuButton.d.ts +1 -1
  9. package/dist/enums.d.ts +12 -0
  10. package/dist/filtersFNs.d.ts +20 -0
  11. package/dist/footer/MRT_TableFooterCell.d.ts +1 -1
  12. package/dist/footer/MRT_TableFooterRow.d.ts +1 -1
  13. package/dist/head/MRT_TableHeadCell.d.ts +1 -1
  14. package/dist/head/MRT_TableHeadRow.d.ts +1 -1
  15. package/dist/inputs/MRT_EditCellTextField.d.ts +1 -1
  16. package/dist/inputs/MRT_FilterTextField.d.ts +1 -1
  17. package/dist/inputs/MRT_SelectCheckbox.d.ts +1 -1
  18. package/dist/localization.d.ts +43 -44
  19. package/dist/material-react-table.cjs.development.js +375 -227
  20. package/dist/material-react-table.cjs.development.js.map +1 -1
  21. package/dist/material-react-table.cjs.production.min.js +1 -1
  22. package/dist/material-react-table.cjs.production.min.js.map +1 -1
  23. package/dist/material-react-table.esm.js +367 -221
  24. package/dist/material-react-table.esm.js.map +1 -1
  25. package/dist/menus/MRT_ColumnActionMenu.d.ts +1 -1
  26. package/dist/menus/MRT_FilterTypeMenu.d.ts +1 -1
  27. package/dist/menus/MRT_RowActionMenu.d.ts +1 -1
  28. package/dist/menus/MRT_ShowHideColumnsMenu.d.ts +3 -2
  29. package/dist/menus/MRT_ShowHideColumnsMenuItems.d.ts +8 -0
  30. package/dist/useMRT.d.ts +1 -1
  31. package/package.json +3 -3
  32. package/src/MaterialReactTable.tsx +1 -11
  33. package/src/body/MRT_TableBody.tsx +1 -1
  34. package/src/body/MRT_TableBodyCell.tsx +1 -1
  35. package/src/body/MRT_TableBodyRow.tsx +1 -1
  36. package/src/body/MRT_TableDetailPanel.tsx +1 -1
  37. package/src/buttons/MRT_EditActionButtons.tsx +5 -8
  38. package/src/buttons/MRT_ExpandAllButton.tsx +2 -2
  39. package/src/buttons/MRT_ExpandButton.tsx +3 -3
  40. package/src/buttons/MRT_FullScreenToggleButton.tsx +2 -2
  41. package/src/buttons/MRT_ShowHideColumnsButton.tsx +4 -52
  42. package/src/buttons/MRT_ToggleColumnActionMenuButton.tsx +4 -3
  43. package/src/buttons/MRT_ToggleDensePaddingButton.tsx +2 -2
  44. package/src/buttons/MRT_ToggleFiltersButton.tsx +2 -2
  45. package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +4 -8
  46. package/src/buttons/MRT_ToggleSearchButton.tsx +1 -1
  47. package/src/enums.ts +12 -0
  48. package/src/filtersFNs.ts +31 -0
  49. package/src/footer/MRT_TableFooter.tsx +1 -1
  50. package/src/footer/MRT_TableFooterCell.tsx +1 -1
  51. package/src/footer/MRT_TableFooterRow.tsx +1 -1
  52. package/src/head/MRT_TableHead.tsx +1 -1
  53. package/src/head/MRT_TableHeadCell.tsx +20 -7
  54. package/src/head/MRT_TableHeadCellActions.tsx +1 -1
  55. package/src/head/MRT_TableHeadRow.tsx +1 -1
  56. package/src/inputs/MRT_EditCellTextField.tsx +1 -1
  57. package/src/inputs/MRT_FilterTextField.tsx +35 -11
  58. package/src/inputs/MRT_SearchTextField.tsx +3 -3
  59. package/src/inputs/MRT_SelectCheckbox.tsx +5 -5
  60. package/src/localization.ts +87 -88
  61. package/src/menus/MRT_ColumnActionMenu.tsx +60 -15
  62. package/src/menus/MRT_FilterTypeMenu.tsx +45 -11
  63. package/src/menus/MRT_RowActionMenu.tsx +2 -2
  64. package/src/menus/MRT_ShowHideColumnsMenu.tsx +53 -36
  65. package/src/menus/MRT_ShowHideColumnsMenuItems.tsx +57 -0
  66. package/src/toolbar/MRT_ToolbarAlertBanner.tsx +3 -3
  67. package/src/useMRT.tsx +22 -4
@@ -1,7 +1,7 @@
1
- import React, { useState, useMemo, useContext, createContext, Fragment, useRef, useEffect } from 'react';
1
+ import React, { useState, useMemo, useCallback, useContext, createContext, Fragment, useRef, useEffect } from 'react';
2
2
  import { useTable, useFilters, useGlobalFilter, useGroupBy, useSortBy, useExpanded, usePagination, useRowSelect, useResizeColumns, useFlexLayout, useAsyncDebounce } from 'react-table';
3
3
  import { matchSorter } from 'match-sorter';
4
- import { Menu, MenuItem, TextField, InputAdornment, Tooltip, IconButton, Chip, Box, TableCell, TableSortLabel, Divider, Collapse, Skeleton, Checkbox, TableRow, TableHead, alpha, TableBody, TableFooter, Table, FormControlLabel, Switch, Button, TablePagination, useMediaQuery, Alert, Toolbar, TableContainer, Paper, LinearProgress } from '@mui/material';
4
+ import { Menu, MenuItem, TextField, InputAdornment, Tooltip, IconButton, Chip, FormControlLabel, Switch, Box, Button, Divider, TableCell, TableSortLabel, Collapse, Skeleton, Checkbox, TableRow, TableHead, alpha, TableBody, TableFooter, Table, TablePagination, useMediaQuery, Alert, Toolbar, TableContainer, Paper, LinearProgress } from '@mui/material';
5
5
  import ArrowRightIcon from '@mui/icons-material/ArrowRight';
6
6
  import CancelIcon from '@mui/icons-material/Cancel';
7
7
  import ClearAllIcon from '@mui/icons-material/ClearAll';
@@ -97,6 +97,21 @@ function _objectWithoutPropertiesLoose(source, excluded) {
97
97
  return target;
98
98
  }
99
99
 
100
+ var fuzzySearchFN = function fuzzySearchFN(rows, columnIds, filterValue) {
101
+ return matchSorter(rows, filterValue.toString().trim(), {
102
+ keys: columnIds.map(function (c) {
103
+ return "values." + c;
104
+ }),
105
+ sorter: function sorter(rankedItems) {
106
+ return rankedItems;
107
+ }
108
+ });
109
+ };
110
+
111
+ fuzzySearchFN.autoRemove = function (val) {
112
+ return !val;
113
+ };
114
+
100
115
  var fuzzyFilterFN = function fuzzyFilterFN(rows, id, filterValue) {
101
116
  return matchSorter(rows, filterValue.toString().trim(), {
102
117
  keys: ["values." + id],
@@ -160,6 +175,26 @@ notEqualsFilterFN.autoRemove = function (val) {
160
175
  return !val;
161
176
  };
162
177
 
178
+ var greaterThanFilterFN = function greaterThanFilterFN(rows, id, filterValue) {
179
+ return rows.filter(function (row) {
180
+ return !isNaN(+filterValue) && !isNaN(+row.values[id]) ? +row.values[id] > +filterValue : row.values[id].toString().toLowerCase().trim() > filterValue.toString().toLowerCase().trim();
181
+ });
182
+ };
183
+
184
+ greaterThanFilterFN.autoRemove = function (val) {
185
+ return !val;
186
+ };
187
+
188
+ var lessThanFilterFN = function lessThanFilterFN(rows, id, filterValue) {
189
+ return rows.filter(function (row) {
190
+ return !isNaN(+filterValue) && !isNaN(+row.values[id]) ? +row.values[id] < +filterValue : row.values[id].toString().toLowerCase().trim() < filterValue.toString().toLowerCase().trim();
191
+ });
192
+ };
193
+
194
+ lessThanFilterFN.autoRemove = function (val) {
195
+ return !val;
196
+ };
197
+
163
198
  var emptyFilterFN = function emptyFilterFN(rows, id, _filterValue) {
164
199
  return rows.filter(function (row) {
165
200
  return !row.values[id].toString().toLowerCase().trim();
@@ -186,6 +221,9 @@ var defaultFilterFNs = {
186
221
  endsWith: endsWithFilterFN,
187
222
  equals: equalsFilterFN,
188
223
  fuzzy: fuzzyFilterFN,
224
+ globalFuzzy: fuzzySearchFN,
225
+ greaterThan: greaterThanFilterFN,
226
+ lessThan: lessThanFilterFN,
189
227
  notEmpty: notEmptyFilterFN,
190
228
  notEquals: notEqualsFilterFN,
191
229
  startsWith: startsWithFilterFN
@@ -196,7 +234,7 @@ var MaterialReactTableContext = /*#__PURE__*/function () {
196
234
  }();
197
235
 
198
236
  var MaterialReactTableProvider = function MaterialReactTableProvider(props) {
199
- var _props$initialState$d, _props$initialState, _props$initialState$f, _props$initialState2, _props$initialState$s, _props$initialState3, _props$initialState$s2, _props$initialState4;
237
+ var _props$initialState$d, _props$initialState, _props$initialState$f, _props$initialState2, _props$initialState$s, _props$initialState3, _props$initialState$s2, _props$initialState4, _props$globalFilter;
200
238
 
201
239
  var hooks = [useFilters, useGlobalFilter, useGroupBy, useSortBy, useExpanded, usePagination, useRowSelect];
202
240
  if (props.enableColumnResizing) hooks.unshift(useResizeColumns, useFlexLayout);
@@ -224,9 +262,35 @@ var MaterialReactTableProvider = function MaterialReactTableProvider(props) {
224
262
  var filterTypes = useMemo(function () {
225
263
  return _extends({}, defaultFilterFNs, props.filterTypes);
226
264
  }, [props.filterTypes]);
265
+ var findLowestLevelCols = useCallback(function () {
266
+ var lowestLevelColumns = props.columns;
267
+ var currentCols = props.columns;
268
+
269
+ while (!!currentCols.length && currentCols.some(function (col) {
270
+ return col.columns;
271
+ })) {
272
+ var nextCols = currentCols.filter(function (col) {
273
+ return !!col.columns;
274
+ }).map(function (col) {
275
+ return col.columns;
276
+ }).flat();
277
+
278
+ if (nextCols.every(function (col) {
279
+ return !col.columns;
280
+ })) {
281
+ lowestLevelColumns = [].concat(lowestLevelColumns, nextCols);
282
+ }
283
+
284
+ currentCols = nextCols;
285
+ }
286
+
287
+ return lowestLevelColumns.filter(function (col) {
288
+ return !col.columns;
289
+ });
290
+ }, [props.columns]);
227
291
 
228
292
  var _useState6 = useState(function () {
229
- return Object.assign.apply(Object, [{}].concat(props.columns.map(function (c) {
293
+ return Object.assign.apply(Object, [{}].concat(findLowestLevelCols().map(function (c) {
230
294
  var _ref, _c$filter, _props$initialState5, _props$initialState5$, _ref2;
231
295
 
232
296
  return _ref2 = {}, _ref2[c.accessor] = (_ref = (_c$filter = c.filter) != null ? _c$filter : props == null ? void 0 : (_props$initialState5 = props.initialState) == null ? void 0 : (_props$initialState5$ = _props$initialState5.filters) == null ? void 0 : _props$initialState5$[c.accessor]) != null ? _ref : !!c.filterSelectOptions ? 'equals' : 'fuzzy', _ref2;
@@ -236,7 +300,7 @@ var MaterialReactTableProvider = function MaterialReactTableProvider(props) {
236
300
  setCurrentFilterTypes = _useState6[1];
237
301
 
238
302
  var columns = useMemo(function () {
239
- return props.columns.map(function (column) {
303
+ return findLowestLevelCols().map(function (column) {
240
304
  column.filter = filterTypes[currentFilterTypes[column.accessor]];
241
305
  return column;
242
306
  });
@@ -245,7 +309,7 @@ var MaterialReactTableProvider = function MaterialReactTableProvider(props) {
245
309
  columns: columns,
246
310
  // @ts-ignore
247
311
  filterTypes: filterTypes,
248
- globalFilterValue: 'fuzzy',
312
+ globalFilter: (_props$globalFilter = props.globalFilter) != null ? _props$globalFilter : 'globalFuzzy',
249
313
  useControlledState: function useControlledState(state) {
250
314
  return useMemo(function () {
251
315
  return _extends({}, state, {
@@ -295,6 +359,21 @@ var useMRT = function useMRT() {
295
359
  return useContext(MaterialReactTableContext);
296
360
  };
297
361
 
362
+ var MRT_FILTER_TYPE;
363
+
364
+ (function (MRT_FILTER_TYPE) {
365
+ MRT_FILTER_TYPE["CONTAINS"] = "contains";
366
+ MRT_FILTER_TYPE["EMPTY"] = "empty";
367
+ MRT_FILTER_TYPE["ENDS_WITH"] = "endsWith";
368
+ MRT_FILTER_TYPE["EQUALS"] = "equals";
369
+ MRT_FILTER_TYPE["FUZZY"] = "fuzzy";
370
+ MRT_FILTER_TYPE["GREATER_THAN"] = "greaterThan";
371
+ MRT_FILTER_TYPE["LESS_THAN"] = "lessThan";
372
+ MRT_FILTER_TYPE["NOT_EMPTY"] = "notEmpty";
373
+ MRT_FILTER_TYPE["NOT_EQUALS"] = "notEquals";
374
+ MRT_FILTER_TYPE["STARTS_WITH"] = "startsWith";
375
+ })(MRT_FILTER_TYPE || (MRT_FILTER_TYPE = {}));
376
+
298
377
  var commonMenuItemStyles = {
299
378
  py: '6px',
300
379
  my: 0,
@@ -314,36 +393,54 @@ var MRT_FilterTypeMenu = function MRT_FilterTypeMenu(_ref) {
314
393
  var filterTypes = useMemo(function () {
315
394
  return [{
316
395
  type: MRT_FILTER_TYPE.FUZZY,
317
- label: localization.filterMenuItemFuzzy,
318
- divider: false
396
+ label: localization.filterFuzzy,
397
+ divider: false,
398
+ fn: fuzzyFilterFN
319
399
  }, {
320
400
  type: MRT_FILTER_TYPE.CONTAINS,
321
- label: localization.filterMenuItemContains,
322
- divider: true
401
+ label: localization.filterContains,
402
+ divider: true,
403
+ fn: containsFilterFN
323
404
  }, {
324
405
  type: MRT_FILTER_TYPE.STARTS_WITH,
325
- label: localization.filterMenuItemStartsWith,
326
- divider: false
406
+ label: localization.filterStartsWith,
407
+ divider: false,
408
+ fn: startsWithFilterFN
327
409
  }, {
328
410
  type: MRT_FILTER_TYPE.ENDS_WITH,
329
- label: localization.filterMenuItemEndsWith,
330
- divider: true
411
+ label: localization.filterEndsWith,
412
+ divider: true,
413
+ fn: endsWithFilterFN
331
414
  }, {
332
415
  type: MRT_FILTER_TYPE.EQUALS,
333
- label: localization.filterMenuItemEquals,
334
- divider: false
416
+ label: localization.filterEquals,
417
+ divider: false,
418
+ fn: equalsFilterFN
335
419
  }, {
336
420
  type: MRT_FILTER_TYPE.NOT_EQUALS,
337
- label: localization.filterMenuItemNotEquals,
338
- divider: true
421
+ label: localization.filterNotEquals,
422
+ divider: true,
423
+ fn: notEqualsFilterFN
424
+ }, {
425
+ type: MRT_FILTER_TYPE.GREATER_THAN,
426
+ label: localization.filterGreaterThan,
427
+ divider: false,
428
+ fn: greaterThanFilterFN
429
+ }, {
430
+ type: MRT_FILTER_TYPE.LESS_THAN,
431
+ label: localization.filterLessThan,
432
+ divider: true,
433
+ fn: lessThanFilterFN
339
434
  }, {
340
435
  type: MRT_FILTER_TYPE.EMPTY,
341
- label: localization.filterMenuItemEmpty,
342
- divider: false
436
+ label: localization.filterEmpty,
437
+ divider: false,
438
+ fn: emptyFilterFN
343
439
  }, {
344
440
  type: MRT_FILTER_TYPE.NOT_EMPTY,
345
- label: localization.filterMenuItemNotEmpty,
346
- divider: false
441
+ label: localization.filterNotEmpty,
442
+ divider: false,
443
+ fn: notEmptyFilterFN
347
444
  }];
348
445
  }, []);
349
446
 
@@ -379,14 +476,15 @@ var MRT_FilterTypeMenu = function MRT_FilterTypeMenu(_ref) {
379
476
  }, filterTypes.map(function (_ref2, index) {
380
477
  var type = _ref2.type,
381
478
  label = _ref2.label,
382
- divider = _ref2.divider;
479
+ divider = _ref2.divider,
480
+ fn = _ref2.fn;
383
481
  return React.createElement(MenuItem, {
384
482
  divider: divider,
385
483
  key: index,
386
484
  onClick: function onClick() {
387
485
  return handleSelectFilterType(type);
388
486
  },
389
- selected: type === filterType,
487
+ selected: type === filterType || fn === filterType,
390
488
  sx: commonMenuItemStyles,
391
489
  value: type
392
490
  }, label);
@@ -394,7 +492,7 @@ var MRT_FilterTypeMenu = function MRT_FilterTypeMenu(_ref) {
394
492
  };
395
493
 
396
494
  var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
397
- var _localization$filterT, _localization$filterT2, _column$filterSelectO;
495
+ var _localization$filterB, _localization$clearFi, _column$filterSelectO;
398
496
 
399
497
  var column = _ref.column;
400
498
 
@@ -453,10 +551,10 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
453
551
  }
454
552
 
455
553
  var filterType = tableInstance.state.currentFilterTypes[column.id];
456
- var isCustomFilterType = filterType instanceof Function;
457
554
  var isSelectFilter = !!column.filterSelectOptions;
458
- var filterChipLabel = !isCustomFilterType && [MRT_FILTER_TYPE.EMPTY, MRT_FILTER_TYPE.NOT_EMPTY].includes(filterType);
459
- var filterPlaceholder = (_localization$filterT = localization.filterTextFieldPlaceholder) == null ? void 0 : _localization$filterT.replace('{column}', String(column.Header));
555
+ var filterChipLabel = !(filterType instanceof Function) && [MRT_FILTER_TYPE.EMPTY, MRT_FILTER_TYPE.NOT_EMPTY].includes(filterType) ? //@ts-ignore
556
+ localization["filter" + (filterType.charAt(0).toUpperCase() + filterType.slice(1))] : '';
557
+ var filterPlaceholder = (_localization$filterB = localization.filterByColumn) == null ? void 0 : _localization$filterB.replace('{column}', String(column.Header));
460
558
  return React.createElement(React.Fragment, null, React.createElement(TextField, Object.assign({
461
559
  fullWidth: true,
462
560
  id: "mrt-" + idPrefix + "-" + column.id + "-filter-text-field",
@@ -468,6 +566,14 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
468
566
  },
469
567
  title: filterPlaceholder
470
568
  },
569
+ helperText: filterType instanceof Function ? '' : localization.filterMode.replace('{filterType}', // @ts-ignore
570
+ localization["filter" + (filterType.charAt(0).toUpperCase() + filterType.slice(1))]),
571
+ FormHelperTextProps: {
572
+ sx: {
573
+ fontSize: '0.6rem',
574
+ lineHeight: '0.8rem'
575
+ }
576
+ },
471
577
  label: isSelectFilter && !filterValue ? filterPlaceholder : undefined,
472
578
  InputLabelProps: {
473
579
  shrink: false,
@@ -495,7 +601,6 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
495
601
  arrow: true,
496
602
  title: localization.changeFilterMode
497
603
  }, React.createElement("span", null, React.createElement(IconButton, {
498
- disabled: isCustomFilterType,
499
604
  onClick: handleFilterMenuOpen,
500
605
  size: "small",
501
606
  sx: {
@@ -504,7 +609,7 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
504
609
  }
505
610
  }, React.createElement(FilterListIcon, null)))), filterChipLabel && React.createElement(Chip, {
506
611
  onDelete: handleClearFilterChip,
507
- label: filterType
612
+ label: filterChipLabel
508
613
  })),
509
614
  endAdornment: !filterChipLabel && React.createElement(InputAdornment, {
510
615
  position: "end"
@@ -512,9 +617,9 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
512
617
  arrow: true,
513
618
  disableHoverListener: isSelectFilter,
514
619
  placement: "right",
515
- title: (_localization$filterT2 = localization.filterTextFieldClearButtonTitle) != null ? _localization$filterT2 : ''
620
+ title: (_localization$clearFi = localization.clearFilter) != null ? _localization$clearFi : ''
516
621
  }, React.createElement("span", null, React.createElement(IconButton, {
517
- "aria-label": localization.filterTextFieldClearButtonTitle,
622
+ "aria-label": localization.clearFilter,
518
623
  disabled: !(filterValue != null && filterValue.length),
519
624
  onClick: handleClear,
520
625
  size: "small",
@@ -528,7 +633,8 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
528
633
  }
529
634
  }, textFieldProps, {
530
635
  sx: _extends({
531
- m: '0 -0.25rem',
636
+ m: '-0.25rem',
637
+ p: 0,
532
638
  minWidth: !filterChipLabel ? '5rem' : 'auto',
533
639
  width: 'calc(100% + 0.5rem)',
534
640
  mt: isSelectFilter && !filterValue ? '-1rem' : undefined,
@@ -540,7 +646,7 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
540
646
  divider: true,
541
647
  disabled: !filterValue,
542
648
  value: ""
543
- }, localization.filterTextFieldClearButtonTitle), column == null ? void 0 : (_column$filterSelectO = column.filterSelectOptions) == null ? void 0 : _column$filterSelectO.map(function (option) {
649
+ }, localization.clearFilter), column == null ? void 0 : (_column$filterSelectO = column.filterSelectOptions) == null ? void 0 : _column$filterSelectO.map(function (option) {
544
650
  var value;
545
651
  var text;
546
652
 
@@ -563,6 +669,101 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
563
669
  }));
564
670
  };
565
671
 
672
+ var MRT_ShowHideColumnsMenuItems = function MRT_ShowHideColumnsMenuItems(_ref) {
673
+ var _column$columns, _column$columns2, _column$isVisible, _column$columns4;
674
+
675
+ var column = _ref.column,
676
+ isSubMenu = _ref.isSubMenu;
677
+ var isParentHeader = !!(column != null && (_column$columns = column.columns) != null && _column$columns.length);
678
+ var allChildColumnsVisible = isParentHeader && !!((_column$columns2 = column.columns) != null && _column$columns2.every(function (childColumn) {
679
+ return childColumn.isVisible;
680
+ }));
681
+ var switchChecked = (_column$isVisible = column.isVisible) != null ? _column$isVisible : allChildColumnsVisible;
682
+
683
+ var handleToggleColumnHidden = function handleToggleColumnHidden(column) {
684
+ if (isParentHeader) {
685
+ var _column$columns3;
686
+
687
+ column == null ? void 0 : (_column$columns3 = column.columns) == null ? void 0 : _column$columns3.forEach == null ? void 0 : _column$columns3.forEach(function (childColumn) {
688
+ childColumn.toggleHidden(switchChecked);
689
+ });
690
+ } else {
691
+ column.toggleHidden();
692
+ }
693
+ };
694
+
695
+ return React.createElement(React.Fragment, null, React.createElement(MenuItem, {
696
+ sx: _extends({}, commonMenuItemStyles$1, {
697
+ pl: (column.depth + 0.5) * 2 + "rem"
698
+ })
699
+ }, React.createElement(FormControlLabel, {
700
+ componentsProps: {
701
+ typography: {
702
+ sx: {
703
+ marginBottom: 0
704
+ }
705
+ }
706
+ },
707
+ checked: switchChecked,
708
+ control: React.createElement(Switch, null),
709
+ disabled: isSubMenu && switchChecked,
710
+ label: column.Header,
711
+ onChange: function onChange() {
712
+ return handleToggleColumnHidden(column);
713
+ }
714
+ })), (_column$columns4 = column.columns) == null ? void 0 : _column$columns4.map(function (c, i) {
715
+ return React.createElement(MRT_ShowHideColumnsMenuItems, {
716
+ key: i + "-" + c.id,
717
+ column: c,
718
+ isSubMenu: isSubMenu
719
+ });
720
+ }));
721
+ };
722
+
723
+ var MRT_ShowHideColumnsMenu = function MRT_ShowHideColumnsMenu(_ref) {
724
+ var anchorEl = _ref.anchorEl,
725
+ isSubMenu = _ref.isSubMenu,
726
+ setAnchorEl = _ref.setAnchorEl;
727
+
728
+ var _useMRT = useMRT(),
729
+ localization = _useMRT.localization,
730
+ tableInstance = _useMRT.tableInstance;
731
+
732
+ return React.createElement(Menu, {
733
+ anchorEl: anchorEl,
734
+ open: !!anchorEl,
735
+ onClose: function onClose() {
736
+ return setAnchorEl(null);
737
+ },
738
+ MenuListProps: {
739
+ dense: tableInstance.state.densePadding
740
+ }
741
+ }, React.createElement(Box, {
742
+ sx: {
743
+ display: 'flex',
744
+ justifyContent: isSubMenu ? 'center' : 'space-between',
745
+ p: '0.5rem',
746
+ pt: 0
747
+ }
748
+ }, !isSubMenu && React.createElement(Button, {
749
+ disabled: !tableInstance.getToggleHideAllColumnsProps().checked && !tableInstance.getToggleHideAllColumnsProps().indeterminate,
750
+ onClick: function onClick() {
751
+ return tableInstance.toggleHideAllColumns(true);
752
+ }
753
+ }, localization.hideAll), React.createElement(Button, {
754
+ disabled: tableInstance.getToggleHideAllColumnsProps().checked,
755
+ onClick: function onClick() {
756
+ return tableInstance.toggleHideAllColumns(false);
757
+ }
758
+ }, localization.showAll)), React.createElement(Divider, null), tableInstance.columns.map(function (column, index) {
759
+ return React.createElement(MRT_ShowHideColumnsMenuItems, {
760
+ column: column,
761
+ isSubMenu: isSubMenu,
762
+ key: index + "-" + column.id
763
+ });
764
+ }));
765
+ };
766
+
566
767
  var commonMenuItemStyles$1 = {
567
768
  py: '6px',
568
769
  my: 0,
@@ -575,7 +776,7 @@ var commonListItemStyles = {
575
776
  alignItems: 'center'
576
777
  };
577
778
  var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
578
- var _localization$columnA, _localization$columnA2, _localization$filterT, _localization, _localization$columnA3;
779
+ var _localization$sortByC, _localization$sortByC2, _localization$filterB, _localization, _localization$hideCol, _tableInstance$state$, _localization$showAll;
579
780
 
580
781
  var anchorEl = _ref.anchorEl,
581
782
  column = _ref.column,
@@ -589,6 +790,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
589
790
  _useMRT$icons = _useMRT.icons,
590
791
  ArrowRightIcon = _useMRT$icons.ArrowRightIcon,
591
792
  ClearAllIcon = _useMRT$icons.ClearAllIcon,
793
+ ViewColumnIcon = _useMRT$icons.ViewColumnIcon,
592
794
  DynamicFeedIcon = _useMRT$icons.DynamicFeedIcon,
593
795
  FilterListIcon = _useMRT$icons.FilterListIcon,
594
796
  FilterListOffIcon = _useMRT$icons.FilterListOffIcon,
@@ -603,6 +805,10 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
603
805
  filterMenuAnchorEl = _useState[0],
604
806
  setFilterMenuAnchorEl = _useState[1];
605
807
 
808
+ var _useState2 = useState(null),
809
+ showHideColumnsMenuAnchorEl = _useState2[0],
810
+ setShowHideColumnsMenuAnchorEl = _useState2[1];
811
+
606
812
  var handleClearSort = function handleClearSort() {
607
813
  column.clearSortBy();
608
814
  setAnchorEl(null);
@@ -649,6 +855,15 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
649
855
  setFilterMenuAnchorEl(event.currentTarget);
650
856
  };
651
857
 
858
+ var handleShowAllColumns = function handleShowAllColumns() {
859
+ tableInstance.toggleHideAllColumns(false);
860
+ };
861
+
862
+ var handleOpenShowHideColumnsMenu = function handleOpenShowHideColumnsMenu(event) {
863
+ event.stopPropagation();
864
+ setShowHideColumnsMenuAnchorEl(event.currentTarget);
865
+ };
866
+
652
867
  return React.createElement(Menu, {
653
868
  anchorEl: anchorEl,
654
869
  open: !!anchorEl,
@@ -660,21 +875,21 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
660
875
  }
661
876
  }, !disableSortBy && column.canSort && [React.createElement(MenuItem, {
662
877
  disabled: !column.isSorted,
663
- key: 1,
878
+ key: 0,
664
879
  onClick: handleClearSort,
665
880
  sx: commonMenuItemStyles$1
666
881
  }, React.createElement(Box, {
667
882
  sx: commonListItemStyles
668
- }, React.createElement(ClearAllIcon, null), localization.columnActionMenuItemClearSort)), React.createElement(MenuItem, {
883
+ }, React.createElement(ClearAllIcon, null), localization.clearSort)), React.createElement(MenuItem, {
669
884
  disabled: column.isSorted && !column.isSortedDesc,
670
- key: 2,
885
+ key: 1,
671
886
  onClick: handleSortAsc,
672
887
  sx: commonMenuItemStyles$1
673
888
  }, React.createElement(Box, {
674
889
  sx: commonListItemStyles
675
- }, React.createElement(SortIcon, null), (_localization$columnA = localization.columnActionMenuItemSortAsc) == null ? void 0 : _localization$columnA.replace('{column}', String(column.Header)))), React.createElement(MenuItem, {
890
+ }, React.createElement(SortIcon, null), (_localization$sortByC = localization.sortByColumnAsc) == null ? void 0 : _localization$sortByC.replace('{column}', String(column.Header)))), React.createElement(MenuItem, {
676
891
  divider: !disableFilters || enableColumnGrouping || !disableColumnHiding,
677
- key: 3,
892
+ key: 2,
678
893
  disabled: column.isSorted && column.isSortedDesc,
679
894
  onClick: handleSortDesc,
680
895
  sx: commonMenuItemStyles$1
@@ -684,21 +899,21 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
684
899
  style: {
685
900
  transform: 'rotate(180deg) scaleX(-1)'
686
901
  }
687
- }), (_localization$columnA2 = localization.columnActionMenuItemSortDesc) == null ? void 0 : _localization$columnA2.replace('{column}', String(column.Header))))], !disableFilters && column.canFilter && [React.createElement(MenuItem, {
902
+ }), (_localization$sortByC2 = localization.sortByColumnDesc) == null ? void 0 : _localization$sortByC2.replace('{column}', String(column.Header))))], !disableFilters && column.canFilter && [React.createElement(MenuItem, {
688
903
  disabled: !column.filterValue,
689
904
  key: 0,
690
905
  onClick: handleClearFilter,
691
906
  sx: commonMenuItemStyles$1
692
907
  }, React.createElement(Box, {
693
908
  sx: commonListItemStyles
694
- }, React.createElement(FilterListOffIcon, null), localization.filterTextFieldClearButtonTitle)), React.createElement(MenuItem, {
909
+ }, React.createElement(FilterListOffIcon, null), localization.clearFilter)), React.createElement(MenuItem, {
695
910
  divider: enableColumnGrouping || !disableColumnHiding,
696
911
  key: 1,
697
912
  onClick: handleFilterByColumn,
698
913
  sx: commonMenuItemStyles$1
699
914
  }, React.createElement(Box, {
700
915
  sx: commonListItemStyles
701
- }, React.createElement(FilterListIcon, null), (_localization$filterT = localization.filterTextFieldPlaceholder) == null ? void 0 : _localization$filterT.replace('{column}', String(column.Header))), !column.filterSelectOptions && React.createElement(IconButton, {
916
+ }, React.createElement(FilterListIcon, null), (_localization$filterB = localization.filterByColumn) == null ? void 0 : _localization$filterB.replace('{column}', String(column.Header))), !column.filterSelectOptions && React.createElement(IconButton, {
702
917
  onClick: handleOpenFilterModeMenu,
703
918
  onMouseEnter: handleOpenFilterModeMenu,
704
919
  size: "small",
@@ -713,18 +928,37 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
713
928
  onSelect: handleFilterByColumn
714
929
  })], enableColumnGrouping && column.canGroupBy && [React.createElement(MenuItem, {
715
930
  divider: !disableColumnHiding,
716
- key: 2,
931
+ key: 0,
717
932
  onClick: handleGroupByColumn,
718
933
  sx: commonMenuItemStyles$1
719
934
  }, React.createElement(Box, {
720
935
  sx: commonListItemStyles
721
- }, React.createElement(DynamicFeedIcon, null), (_localization = localization[column.isGrouped ? 'columnActionMenuItemUnGroupBy' : 'columnActionMenuItemGroupBy']) == null ? void 0 : _localization.replace('{column}', String(column.Header))))], !disableColumnHiding && [React.createElement(MenuItem, {
722
- key: 1,
936
+ }, React.createElement(DynamicFeedIcon, null), (_localization = localization[column.isGrouped ? 'ungroupByColumn' : 'groupByColumn']) == null ? void 0 : _localization.replace('{column}', String(column.Header))))], !disableColumnHiding && [React.createElement(MenuItem, {
937
+ key: 0,
723
938
  onClick: handleHideColumn,
724
939
  sx: commonMenuItemStyles$1
725
940
  }, React.createElement(Box, {
726
941
  sx: commonListItemStyles
727
- }, React.createElement(VisibilityOffIcon, null), (_localization$columnA3 = localization.columnActionMenuItemHideColumn) == null ? void 0 : _localization$columnA3.replace('{column}', String(column.Header))))]);
942
+ }, React.createElement(VisibilityOffIcon, null), (_localization$hideCol = localization.hideColumn) == null ? void 0 : _localization$hideCol.replace('{column}', String(column.Header)))), React.createElement(MenuItem, {
943
+ disabled: !((_tableInstance$state$ = tableInstance.state.hiddenColumns) != null && _tableInstance$state$.length),
944
+ key: 1,
945
+ onClick: handleShowAllColumns,
946
+ sx: commonMenuItemStyles$1
947
+ }, React.createElement(Box, {
948
+ sx: commonListItemStyles
949
+ }, React.createElement(ViewColumnIcon, null), (_localization$showAll = localization.showAllColumns) == null ? void 0 : _localization$showAll.replace('{column}', String(column.Header))), !column.filterSelectOptions && React.createElement(IconButton, {
950
+ onClick: handleOpenShowHideColumnsMenu,
951
+ onMouseEnter: handleOpenShowHideColumnsMenu,
952
+ size: "small",
953
+ sx: {
954
+ p: 0
955
+ }
956
+ }, React.createElement(ArrowRightIcon, null))), React.createElement(MRT_ShowHideColumnsMenu, {
957
+ anchorEl: showHideColumnsMenuAnchorEl,
958
+ isSubMenu: true,
959
+ key: 2,
960
+ setAnchorEl: setShowHideColumnsMenuAnchorEl
961
+ })]);
728
962
  };
729
963
 
730
964
  var MRT_ToggleColumnActionMenuButton = function MRT_ToggleColumnActionMenuButton(_ref) {
@@ -748,9 +982,10 @@ var MRT_ToggleColumnActionMenuButton = function MRT_ToggleColumnActionMenuButton
748
982
  arrow: true,
749
983
  enterDelay: 1000,
750
984
  enterNextDelay: 1000,
751
- title: localization.columnActionMenuButtonTitle
985
+ placement: "top",
986
+ title: localization.columnActions
752
987
  }, React.createElement(IconButton, {
753
- "aria-label": localization.columnActionMenuButtonTitle,
988
+ "aria-label": localization.columnActions,
754
989
  onClick: handleClick,
755
990
  size: "small",
756
991
  sx: {
@@ -782,7 +1017,7 @@ var commonTableHeadCellStyles = function commonTableHeadCellStyles(densePadding,
782
1017
  };
783
1018
  };
784
1019
  var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
785
- var _column$columns, _localization$columnA, _localization$columnA2;
1020
+ var _column$columns, _localization$sortByC, _localization$sortByC2;
786
1021
 
787
1022
  var column = _ref.column;
788
1023
 
@@ -806,8 +1041,10 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
806
1041
  style: _extends({}, column.getHeaderProps().style, mTableHeadCellProps == null ? void 0 : mTableHeadCellProps.style, mcTableHeadCellProps == null ? void 0 : mcTableHeadCellProps.style)
807
1042
  });
808
1043
 
809
- var sortTooltip = column.isSorted ? column.isSortedDesc ? localization.columnActionMenuItemClearSort : (_localization$columnA = localization.columnActionMenuItemSortDesc) == null ? void 0 : _localization$columnA.replace('{column}', column.Header) : (_localization$columnA2 = localization.columnActionMenuItemSortAsc) == null ? void 0 : _localization$columnA2.replace('{column}', column.Header);
810
- var filterTooltip = !!column.filterValue ? localization.filterApplied.replace('{column}', String(column.Header)).replace('{filterType}', column.filterValue) : localization.toggleFilterButtonTitle;
1044
+ var sortTooltip = column.isSorted ? column.isSortedDesc ? localization.clearSort : (_localization$sortByC = localization.sortByColumnDesc) == null ? void 0 : _localization$sortByC.replace('{column}', column.Header) : (_localization$sortByC2 = localization.sortByColumnAsc) == null ? void 0 : _localization$sortByC2.replace('{column}', column.Header);
1045
+ var filterType = tableInstance.state.currentFilterTypes[column.id];
1046
+ var filterTooltip = !!column.filterValue ? localization.filteringByColumn.replace('{column}', String(column.Header)).replace('{filterType}', filterType instanceof Function ? '' : // @ts-ignore
1047
+ localization["filter" + (filterType.charAt(0).toUpperCase() + filterType.slice(1))]).replace('{filterValue}', column.filterValue) : localization.showHideFilters;
811
1048
  var columnHeader = column.render('Header');
812
1049
  return React.createElement(TableCell, Object.assign({
813
1050
  align: isParentHeader ? 'center' : 'left'
@@ -1011,10 +1248,10 @@ var MRT_SelectCheckbox = function MRT_SelectCheckbox(_ref) {
1011
1248
  arrow: true,
1012
1249
  enterDelay: 1000,
1013
1250
  enterNextDelay: 1000,
1014
- title: selectAll ? localization.selectAllCheckboxTitle : localization.selectCheckboxTitle
1251
+ title: selectAll ? localization.toggleSelectAll : localization.toggleSelectRow
1015
1252
  }, React.createElement(Checkbox, Object.assign({
1016
1253
  inputProps: {
1017
- 'aria-label': selectAll ? localization.selectAllCheckboxTitle : localization.selectCheckboxTitle
1254
+ 'aria-label': selectAll ? localization.toggleSelectAll : localization.toggleSelectRow
1018
1255
  },
1019
1256
  onChange: onSelectChange
1020
1257
  }, checkboxProps, {
@@ -1034,8 +1271,8 @@ var MRT_ExpandAllButton = function MRT_ExpandAllButton() {
1034
1271
  }, tableInstance.getToggleAllRowsExpandedProps(), {
1035
1272
  sx: commonTableBodyButtonCellStyles(tableInstance.state.densePadding)
1036
1273
  }), React.createElement(IconButton, {
1037
- "aria-label": localization.expandAllButtonTitle,
1038
- title: localization.expandAllButtonTitle
1274
+ "aria-label": localization.expandAll,
1275
+ title: localization.expandAll
1039
1276
  }, React.createElement(DoubleArrowDownIcon, {
1040
1277
  style: {
1041
1278
  transform: "rotate(" + (tableInstance.isAllRowsExpanded ? -180 : anyRowsExpanded ? -90 : 0) + "deg)",
@@ -1075,7 +1312,7 @@ var MRT_TableHeadCellActions = function MRT_TableHeadCellActions() {
1075
1312
  sx: _extends({}, commonTableHeadCellStyles(densePadding), {
1076
1313
  textAlign: 'center'
1077
1314
  })
1078
- }, localization.actionsHeadColumnTitle);
1315
+ }, localization.actions);
1079
1316
  };
1080
1317
 
1081
1318
  var MRT_TableHeadRow = function MRT_TableHeadRow(_ref) {
@@ -1181,9 +1418,9 @@ var MRT_ExpandButton = function MRT_ExpandButton(_ref) {
1181
1418
  textAlign: 'left'
1182
1419
  })
1183
1420
  }, React.createElement(IconButton, Object.assign({
1184
- "aria-label": localization.expandButtonTitle,
1421
+ "aria-label": localization.expand,
1185
1422
  disabled: !row.canExpand && !renderDetailPanel,
1186
- title: localization.expandButtonTitle
1423
+ title: localization.expand
1187
1424
  }, row.getToggleRowExpandedProps()), React.createElement(ExpandMoreIcon, {
1188
1425
  style: {
1189
1426
  transform: "rotate(" + (!row.canExpand && !renderDetailPanel ? -90 : row.isExpanded ? -180 : 0) + "deg)",
@@ -1219,7 +1456,7 @@ var MRT_RowActionMenu = function MRT_RowActionMenu(_ref) {
1219
1456
  }, enableRowEditing && React.createElement(MenuItem, {
1220
1457
  onClick: handleEdit,
1221
1458
  sx: commonMenuItemStyles$1
1222
- }, React.createElement(EditIcon, null), localization.rowActionMenuItemEdit), (_renderRowActionMenuI = renderRowActionMenuItems == null ? void 0 : renderRowActionMenuItems(row, tableInstance, function () {
1459
+ }, React.createElement(EditIcon, null), localization.edit), (_renderRowActionMenuI = renderRowActionMenuItems == null ? void 0 : renderRowActionMenuItems(row, tableInstance, function () {
1223
1460
  return setAnchorEl(null);
1224
1461
  })) != null ? _renderRowActionMenuI : null);
1225
1462
  };
@@ -2033,15 +2270,15 @@ var MRT_EditActionButtons = function MRT_EditActionButtons(_ref) {
2033
2270
  }
2034
2271
  }, React.createElement(Tooltip, {
2035
2272
  arrow: true,
2036
- title: localization.rowActionButtonCancel
2273
+ title: localization.cancel
2037
2274
  }, React.createElement(IconButton, {
2038
- "aria-label": localization.rowActionButtonCancel,
2275
+ "aria-label": localization.cancel,
2039
2276
  onClick: handleCancel
2040
2277
  }, React.createElement(CancelIcon, null))), React.createElement(Tooltip, {
2041
2278
  arrow: true,
2042
- title: localization.rowActionButtonSave
2279
+ title: localization.save
2043
2280
  }, React.createElement(IconButton, {
2044
- "aria-label": localization.rowActionButtonSave,
2281
+ "aria-label": localization.save,
2045
2282
  color: "info",
2046
2283
  onClick: handleSave
2047
2284
  }, React.createElement(SaveIcon, null))));
@@ -2095,7 +2332,7 @@ var MRT_ToggleRowActionMenuButton = function MRT_ToggleRowActionMenuButton(_ref)
2095
2332
  }) : !renderRowActionMenuItems && enableRowEditing ? React.createElement(Tooltip, {
2096
2333
  placement: "right",
2097
2334
  arrow: true,
2098
- title: localization.rowActionMenuItemEdit
2335
+ title: localization.edit
2099
2336
  }, React.createElement(IconButton, {
2100
2337
  sx: commonIconButtonStyles,
2101
2338
  onClick: handleEdit
@@ -2103,9 +2340,9 @@ var MRT_ToggleRowActionMenuButton = function MRT_ToggleRowActionMenuButton(_ref)
2103
2340
  arrow: true,
2104
2341
  enterDelay: 1000,
2105
2342
  enterNextDelay: 1000,
2106
- title: localization.rowActionMenuButtonTitle
2343
+ title: localization.rowActions
2107
2344
  }, React.createElement(IconButton, {
2108
- "aria-label": localization.rowActionMenuButtonTitle,
2345
+ "aria-label": localization.rowActions,
2109
2346
  onClick: handleOpenRowActionMenu,
2110
2347
  size: "small",
2111
2348
  sx: commonIconButtonStyles
@@ -2325,7 +2562,7 @@ var MRT_SearchTextField = function MRT_SearchTextField() {
2325
2562
  orientation: "horizontal"
2326
2563
  }, React.createElement(TextField, Object.assign({
2327
2564
  id: "mrt-" + idPrefix + "-search-text-field",
2328
- placeholder: localization.searchTextFieldPlaceholder,
2565
+ placeholder: localization.search,
2329
2566
  onChange: function onChange(event) {
2330
2567
  setSearchValue(event.target.value);
2331
2568
  handleChange(event);
@@ -2341,11 +2578,11 @@ var MRT_SearchTextField = function MRT_SearchTextField() {
2341
2578
  endAdornment: React.createElement(InputAdornment, {
2342
2579
  position: "end"
2343
2580
  }, React.createElement(IconButton, {
2344
- "aria-label": localization.searchTextFieldClearButtonTitle,
2581
+ "aria-label": localization.clearSearch,
2345
2582
  disabled: (searchValue == null ? void 0 : searchValue.length) === 0,
2346
2583
  onClick: handleClear,
2347
2584
  size: "small",
2348
- title: localization.searchTextFieldClearButtonTitle
2585
+ title: localization.clearSearch
2349
2586
  }, React.createElement(CloseIcon, {
2350
2587
  fontSize: "small"
2351
2588
  })))
@@ -2370,9 +2607,9 @@ var MRT_FullScreenToggleButton = function MRT_FullScreenToggleButton(_ref) {
2370
2607
 
2371
2608
  return React.createElement(Tooltip, {
2372
2609
  arrow: true,
2373
- title: localization.toggleFullScreenButtonTitle
2610
+ title: localization.toggleFullScreen
2374
2611
  }, React.createElement(IconButton, Object.assign({
2375
- "aria-label": localization.toggleFilterButtonTitle,
2612
+ "aria-label": localization.showHideFilters,
2376
2613
  onClick: function onClick() {
2377
2614
  return setFullScreen(!fullScreen);
2378
2615
  },
@@ -2380,61 +2617,12 @@ var MRT_FullScreenToggleButton = function MRT_FullScreenToggleButton(_ref) {
2380
2617
  }, rest), fullScreen ? React.createElement(FullscreenExitIcon, null) : React.createElement(FullscreenIcon, null)));
2381
2618
  };
2382
2619
 
2383
- var MRT_ShowHideColumnsMenu = function MRT_ShowHideColumnsMenu(_ref) {
2384
- var _column$columns, _column$columns2, _column$isVisible, _column$columns4;
2385
-
2386
- var column = _ref.column;
2387
- var isParentHeader = !!(column != null && (_column$columns = column.columns) != null && _column$columns.length);
2388
- var allChildColumnsVisible = isParentHeader && !!((_column$columns2 = column.columns) != null && _column$columns2.every(function (childColumn) {
2389
- return childColumn.isVisible;
2390
- }));
2391
- var switchChecked = (_column$isVisible = column.isVisible) != null ? _column$isVisible : allChildColumnsVisible;
2392
-
2393
- var handleToggleColumnHidden = function handleToggleColumnHidden(column) {
2394
- if (isParentHeader) {
2395
- var _column$columns3;
2396
-
2397
- column == null ? void 0 : (_column$columns3 = column.columns) == null ? void 0 : _column$columns3.forEach == null ? void 0 : _column$columns3.forEach(function (childColumn) {
2398
- childColumn.toggleHidden(switchChecked);
2399
- });
2400
- } else {
2401
- column.toggleHidden();
2402
- }
2403
- };
2404
-
2405
- return React.createElement(React.Fragment, null, React.createElement(MenuItem, {
2406
- sx: _extends({}, commonMenuItemStyles$1, {
2407
- pl: (column.depth + 0.5) * 2 + "rem"
2408
- })
2409
- }, React.createElement(FormControlLabel, {
2410
- componentsProps: {
2411
- typography: {
2412
- sx: {
2413
- marginBottom: 0
2414
- }
2415
- }
2416
- },
2417
- checked: switchChecked,
2418
- control: React.createElement(Switch, null),
2419
- label: column.Header,
2420
- onChange: function onChange() {
2421
- return handleToggleColumnHidden(column);
2422
- }
2423
- })), (_column$columns4 = column.columns) == null ? void 0 : _column$columns4.map(function (c, i) {
2424
- return React.createElement(MRT_ShowHideColumnsMenu, {
2425
- key: i + "-" + c.id,
2426
- column: c
2427
- });
2428
- }));
2429
- };
2430
-
2431
2620
  var MRT_ShowHideColumnsButton = function MRT_ShowHideColumnsButton(_ref) {
2432
2621
  var rest = _extends({}, _ref);
2433
2622
 
2434
2623
  var _useMRT = useMRT(),
2435
2624
  ViewColumnIcon = _useMRT.icons.ViewColumnIcon,
2436
- localization = _useMRT.localization,
2437
- tableInstance = _useMRT.tableInstance;
2625
+ localization = _useMRT.localization;
2438
2626
 
2439
2627
  var _useState = useState(null),
2440
2628
  anchorEl = _useState[0],
@@ -2446,42 +2634,15 @@ var MRT_ShowHideColumnsButton = function MRT_ShowHideColumnsButton(_ref) {
2446
2634
 
2447
2635
  return React.createElement(React.Fragment, null, React.createElement(Tooltip, {
2448
2636
  arrow: true,
2449
- title: localization.showHideColumnsButtonTitle
2637
+ title: localization.showHideColumns
2450
2638
  }, React.createElement(IconButton, Object.assign({
2451
- "aria-label": localization.showHideColumnsButtonTitle,
2639
+ "aria-label": localization.showHideColumns,
2452
2640
  onClick: handleClick,
2453
2641
  size: "small"
2454
- }, rest), React.createElement(ViewColumnIcon, null))), React.createElement(Menu, {
2642
+ }, rest), React.createElement(ViewColumnIcon, null))), React.createElement(MRT_ShowHideColumnsMenu, {
2455
2643
  anchorEl: anchorEl,
2456
- open: !!anchorEl,
2457
- onClose: function onClose() {
2458
- return setAnchorEl(null);
2459
- },
2460
- MenuListProps: {
2461
- dense: tableInstance.state.densePadding
2462
- }
2463
- }, React.createElement(Box, {
2464
- sx: {
2465
- display: 'flex',
2466
- justifyContent: 'space-between',
2467
- p: '0.5rem'
2468
- }
2469
- }, React.createElement(Button, {
2470
- disabled: !tableInstance.getToggleHideAllColumnsProps().checked && !tableInstance.getToggleHideAllColumnsProps().indeterminate,
2471
- onClick: function onClick() {
2472
- return tableInstance.toggleHideAllColumns(true);
2473
- }
2474
- }, localization.columnShowHideMenuHideAll), React.createElement(Button, {
2475
- disabled: tableInstance.getToggleHideAllColumnsProps().checked,
2476
- onClick: function onClick() {
2477
- return tableInstance.toggleHideAllColumns(false);
2478
- }
2479
- }, localization.columnShowHideMenuShowAll)), React.createElement(Divider, null), tableInstance.columns.map(function (column, index) {
2480
- return React.createElement(MRT_ShowHideColumnsMenu, {
2481
- key: index + "-" + column.id,
2482
- column: column
2483
- });
2484
- })));
2644
+ setAnchorEl: setAnchorEl
2645
+ }));
2485
2646
  };
2486
2647
 
2487
2648
  var MRT_ToggleDensePaddingButton = function MRT_ToggleDensePaddingButton(_ref) {
@@ -2497,9 +2658,9 @@ var MRT_ToggleDensePaddingButton = function MRT_ToggleDensePaddingButton(_ref) {
2497
2658
 
2498
2659
  return React.createElement(Tooltip, {
2499
2660
  arrow: true,
2500
- title: localization.toggleDensePaddingSwitchTitle
2661
+ title: localization.toggleDensePadding
2501
2662
  }, React.createElement(IconButton, Object.assign({
2502
- "aria-label": localization.toggleDensePaddingSwitchTitle,
2663
+ "aria-label": localization.toggleDensePadding,
2503
2664
  onClick: function onClick() {
2504
2665
  return setDensePadding(!densePadding);
2505
2666
  },
@@ -2520,9 +2681,9 @@ var MRT_ToggleFiltersButton = function MRT_ToggleFiltersButton(_ref) {
2520
2681
 
2521
2682
  return React.createElement(Tooltip, {
2522
2683
  arrow: true,
2523
- title: localization.toggleFilterButtonTitle
2684
+ title: localization.showHideFilters
2524
2685
  }, React.createElement(IconButton, Object.assign({
2525
- "aria-label": localization.toggleFilterButtonTitle,
2686
+ "aria-label": localization.showHideFilters,
2526
2687
  onClick: function onClick() {
2527
2688
  return setShowFilters(!showFilters);
2528
2689
  },
@@ -2554,7 +2715,7 @@ var MRT_ToggleSearchButton = function MRT_ToggleSearchButton(_ref) {
2554
2715
 
2555
2716
  return React.createElement(Tooltip, {
2556
2717
  arrow: true,
2557
- title: localization.toggleSearchButtonTitle
2718
+ title: localization.showHideSearch
2558
2719
  }, React.createElement(IconButton, Object.assign({
2559
2720
  size: "small",
2560
2721
  onClick: handleToggleSearch
@@ -2629,7 +2790,7 @@ var MRT_TablePagination = function MRT_TablePagination() {
2629
2790
  };
2630
2791
 
2631
2792
  var MRT_ToolbarAlertBanner = function MRT_ToolbarAlertBanner() {
2632
- var _localization$toolbar, _localization$toolbar2;
2793
+ var _localization$selecte, _localization$selecte2;
2633
2794
 
2634
2795
  var _useMRT = useMRT(),
2635
2796
  muiTableToolbarAlertBannerProps = _useMRT.muiTableToolbarAlertBannerProps,
@@ -2641,13 +2802,13 @@ var MRT_ToolbarAlertBanner = function MRT_ToolbarAlertBanner() {
2641
2802
 
2642
2803
  var isMobile = useMediaQuery('(max-width:720px)');
2643
2804
  var alertProps = muiTableToolbarAlertBannerProps instanceof Function ? muiTableToolbarAlertBannerProps(tableInstance) : muiTableToolbarAlertBannerProps;
2644
- var selectMessage = tableInstance.selectedFlatRows.length > 0 ? (_localization$toolbar = localization.toolbarAlertSelectionMessage) == null ? void 0 : (_localization$toolbar2 = _localization$toolbar.replace('{selectedCount}', tableInstance.selectedFlatRows.length.toString())) == null ? void 0 : _localization$toolbar2.replace('{rowCount}', tableInstance.flatRows.length.toString()) : null;
2645
- var groupedByMessage = tableInstance.state.groupBy.length > 0 ? React.createElement("span", null, localization.toolbarAlertGroupedByMessage, ' ', tableInstance.state.groupBy.map(function (columnId, index) {
2805
+ var selectMessage = tableInstance.selectedFlatRows.length > 0 ? (_localization$selecte = localization.selectedCountOfRowCountRowsSelected) == null ? void 0 : (_localization$selecte2 = _localization$selecte.replace('{selectedCount}', tableInstance.selectedFlatRows.length.toString())) == null ? void 0 : _localization$selecte2.replace('{rowCount}', tableInstance.flatRows.length.toString()) : null;
2806
+ var groupedByMessage = tableInstance.state.groupBy.length > 0 ? React.createElement("span", null, localization.groupedBy, ' ', tableInstance.state.groupBy.map(function (columnId, index) {
2646
2807
  var _tableInstance$allCol;
2647
2808
 
2648
2809
  return React.createElement(Fragment, {
2649
2810
  key: index + "-" + columnId
2650
- }, index > 0 ? localization.toolbarAlertGroupedThenByMessage : '', React.createElement(Chip, {
2811
+ }, index > 0 ? localization.thenBy : '', React.createElement(Chip, {
2651
2812
  color: "secondary",
2652
2813
  label: (_tableInstance$allCol = tableInstance.allColumns.find(function (column) {
2653
2814
  return column.id === columnId;
@@ -2819,51 +2980,50 @@ var MRT_TableContainer = function MRT_TableContainer() {
2819
2980
  };
2820
2981
 
2821
2982
  var MRT_DefaultLocalization_EN = {
2822
- actionsHeadColumnTitle: 'Actions',
2823
- columnActionMenuButtonTitle: 'Column Actions',
2824
- columnActionMenuItemClearSort: 'Clear sort',
2825
- columnActionMenuItemGroupBy: 'Group by {column}',
2826
- columnActionMenuItemHideColumn: 'Hide {column} column',
2827
- columnActionMenuItemSortAsc: 'Sort by {column} ascending',
2828
- columnActionMenuItemSortDesc: 'Sort by {column} descending',
2829
- columnActionMenuItemUnGroupBy: 'Ungroup by {column}',
2830
- columnShowHideMenuHideAll: 'Hide all',
2831
- columnShowHideMenuShowAll: 'Show all',
2832
- expandAllButtonTitle: 'Expand all',
2833
- expandButtonTitle: 'Expand',
2834
- filterApplied: 'Filtering by {column} - ({filterType})',
2835
- filterMenuItemContains: 'Contains Exact',
2836
- filterMenuItemEmpty: 'Empty',
2837
- filterMenuItemEndsWith: 'Ends With',
2838
- filterMenuItemEquals: 'Equals',
2983
+ actions: 'Actions',
2984
+ cancel: 'Cancel',
2839
2985
  changeFilterMode: 'Change filter mode',
2840
- filterMenuItemFuzzy: 'Fuzzy Match (Default)',
2841
- filterMenuItemNotEmpty: 'Not Empty',
2842
- filterMenuItemNotEquals: 'Not Equals',
2843
- filterMenuItemStartsWith: 'Starts With',
2844
- filterMenuTitle: 'Filter Mode',
2845
- filterTextFieldChangeFilterButtonTitle: 'Change Filter Mode',
2846
- filterTextFieldChipLabelEmpty: 'Empty',
2847
- filterTextFieldChipLabelNotEmpty: 'Not Empty',
2848
- filterTextFieldClearButtonTitle: 'Clear filter',
2849
- filterTextFieldPlaceholder: 'Filter by {column}',
2850
- rowActionButtonCancel: 'Cancel',
2851
- rowActionButtonSave: 'Save',
2852
- rowActionMenuButtonTitle: 'Row Actions',
2853
- rowActionMenuItemEdit: 'Edit',
2854
- rowActionsColumnTitle: 'Actions',
2855
- searchTextFieldClearButtonTitle: 'Clear search',
2856
- searchTextFieldPlaceholder: 'Search',
2857
- selectAllCheckboxTitle: 'Toggle select all',
2858
- selectCheckboxTitle: 'Toggle select row',
2859
- showHideColumnsButtonTitle: 'Show/Hide columns',
2860
- toggleDensePaddingSwitchTitle: 'Toggle dense padding',
2861
- toggleFilterButtonTitle: 'Show/Hide filters',
2862
- toggleFullScreenButtonTitle: 'Toggle full screen',
2863
- toggleSearchButtonTitle: 'Show/Hide search',
2864
- toolbarAlertGroupedByMessage: 'Grouped by ',
2865
- toolbarAlertGroupedThenByMessage: ', then by ',
2866
- toolbarAlertSelectionMessage: '{selectedCount} of {rowCount} row(s) selected'
2986
+ clearFilter: 'Clear filter',
2987
+ clearSearch: 'Clear search',
2988
+ clearSort: 'Clear sort',
2989
+ columnActions: 'Column Actions',
2990
+ edit: 'Edit',
2991
+ expand: 'Expand',
2992
+ expandAll: 'Expand all',
2993
+ filterByColumn: 'Filter by {column}',
2994
+ filterContains: 'Contains Exact',
2995
+ filterEmpty: 'Empty',
2996
+ filterEndsWith: 'Ends With',
2997
+ filterEquals: 'Equals',
2998
+ filterFuzzy: 'Fuzzy Match',
2999
+ filterGreaterThan: 'Greater Than',
3000
+ filterLessThan: 'Less Than',
3001
+ filterMode: 'Filter Mode: {filterType}',
3002
+ filterNotEmpty: 'Not Empty',
3003
+ filterNotEquals: 'Not Equals',
3004
+ filterStartsWith: 'Starts With',
3005
+ filteringByColumn: 'Filtering by {column} - {filterType} "{filterValue}"',
3006
+ groupByColumn: 'Group by {column}',
3007
+ groupedBy: 'Grouped by ',
3008
+ hideAll: 'Hide all',
3009
+ hideColumn: 'Hide {column} column',
3010
+ rowActions: 'Row Actions',
3011
+ save: 'Save',
3012
+ search: 'Search',
3013
+ selectedCountOfRowCountRowsSelected: '{selectedCount} of {rowCount} row(s) selected',
3014
+ showAll: 'Show all',
3015
+ showAllColumns: 'Show all columns',
3016
+ showHideColumns: 'Show/Hide columns',
3017
+ showHideFilters: 'Show/Hide filters',
3018
+ showHideSearch: 'Show/Hide search',
3019
+ sortByColumnAsc: 'Sort by {column} ascending',
3020
+ sortByColumnDesc: 'Sort by {column} descending',
3021
+ thenBy: ', then by ',
3022
+ toggleDensePadding: 'Toggle dense padding',
3023
+ toggleFullScreen: 'Toggle full screen',
3024
+ toggleSelectAll: 'Toggle select all',
3025
+ toggleSelectRow: 'Toggle select row',
3026
+ ungroupByColumn: 'Ungroup by {column}'
2867
3027
  };
2868
3028
 
2869
3029
  var MRT_Default_Icons = {
@@ -2895,19 +3055,6 @@ var MRT_Default_Icons = {
2895
3055
  };
2896
3056
 
2897
3057
  var _excluded = ["defaultColumn", "icons", "localization", "positionActionsColumn", "positionPagination", "positionToolbarActions", "positionToolbarAlertBanner"];
2898
- var MRT_FILTER_TYPE;
2899
-
2900
- (function (MRT_FILTER_TYPE) {
2901
- MRT_FILTER_TYPE["CONTAINS"] = "contains";
2902
- MRT_FILTER_TYPE["EMPTY"] = "empty";
2903
- MRT_FILTER_TYPE["ENDS_WITH"] = "endsWith";
2904
- MRT_FILTER_TYPE["EQUALS"] = "equals";
2905
- MRT_FILTER_TYPE["FUZZY"] = "fuzzy";
2906
- MRT_FILTER_TYPE["NOT_EMPTY"] = "notEmpty";
2907
- MRT_FILTER_TYPE["NOT_EQUALS"] = "notEquals";
2908
- MRT_FILTER_TYPE["STARTS_WITH"] = "startsWith";
2909
- })(MRT_FILTER_TYPE || (MRT_FILTER_TYPE = {}));
2910
-
2911
3058
  var MaterialReactTable = (function (_ref) {
2912
3059
  var _ref$defaultColumn = _ref.defaultColumn,
2913
3060
  defaultColumn = _ref$defaultColumn === void 0 ? {
@@ -2938,5 +3085,4 @@ var MaterialReactTable = (function (_ref) {
2938
3085
  });
2939
3086
 
2940
3087
  export default MaterialReactTable;
2941
- export { MRT_FILTER_TYPE };
2942
3088
  //# sourceMappingURL=material-react-table.esm.js.map