material-react-table 0.7.6 → 0.8.0-alpha.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 (53) hide show
  1. package/dist/MaterialReactTable.d.ts +13 -15
  2. package/dist/body/MRT_TableBody.d.ts +0 -1
  3. package/dist/body/MRT_TableBodyCell.d.ts +1 -0
  4. package/dist/body/MRT_TableBodyRow.d.ts +0 -1
  5. package/dist/buttons/MRT_CopyButton.d.ts +2 -1
  6. package/dist/enums.d.ts +2 -2
  7. package/dist/filtersFNs.d.ts +31 -30
  8. package/dist/footer/MRT_TableFooter.d.ts +0 -1
  9. package/dist/head/MRT_TableHead.d.ts +0 -1
  10. package/dist/inputs/MRT_FilterRangeFields.d.ts +8 -0
  11. package/dist/inputs/MRT_FilterTextField.d.ts +1 -0
  12. package/dist/localization.d.ts +6 -2
  13. package/dist/material-react-table.cjs.development.js +372 -402
  14. package/dist/material-react-table.cjs.development.js.map +1 -1
  15. package/dist/material-react-table.cjs.production.min.js +1 -1
  16. package/dist/material-react-table.cjs.production.min.js.map +1 -1
  17. package/dist/material-react-table.esm.js +375 -405
  18. package/dist/material-react-table.esm.js.map +1 -1
  19. package/dist/table/MRT_Table.d.ts +0 -1
  20. package/dist/toolbar/MRT_ToolbarTop.d.ts +1 -0
  21. package/dist/utils.d.ts +1 -1
  22. package/package.json +24 -24
  23. package/src/MaterialReactTable.tsx +17 -24
  24. package/src/body/MRT_TableBody.tsx +3 -11
  25. package/src/body/MRT_TableBodyCell.tsx +102 -51
  26. package/src/body/MRT_TableBodyRow.tsx +21 -30
  27. package/src/buttons/MRT_ColumnPinningButtons.tsx +28 -40
  28. package/src/buttons/MRT_CopyButton.tsx +3 -2
  29. package/src/buttons/MRT_EditActionButtons.tsx +1 -2
  30. package/src/buttons/MRT_ExpandAllButton.tsx +1 -2
  31. package/src/enums.ts +2 -2
  32. package/src/filtersFNs.ts +71 -81
  33. package/src/footer/MRT_TableFooter.tsx +6 -16
  34. package/src/footer/MRT_TableFooterCell.tsx +5 -7
  35. package/src/footer/MRT_TableFooterRow.tsx +5 -8
  36. package/src/head/MRT_TableHead.tsx +5 -16
  37. package/src/head/MRT_TableHeadCell.tsx +98 -39
  38. package/src/head/MRT_TableHeadRow.tsx +8 -15
  39. package/src/inputs/MRT_EditCellTextField.tsx +2 -2
  40. package/src/inputs/MRT_FilterRangeFields.tsx +41 -0
  41. package/src/inputs/MRT_FilterTextField.tsx +73 -41
  42. package/src/inputs/MRT_SelectCheckbox.tsx +16 -17
  43. package/src/localization.ts +13 -5
  44. package/src/menus/MRT_ColumnActionMenu.tsx +7 -6
  45. package/src/menus/MRT_FilterOptionMenu.tsx +36 -33
  46. package/src/menus/MRT_ShowHideColumnsMenu.tsx +1 -1
  47. package/src/menus/MRT_ShowHideColumnsMenuItems.tsx +3 -5
  48. package/src/table/MRT_Table.tsx +5 -16
  49. package/src/table/MRT_TableContainer.tsx +7 -78
  50. package/src/table/MRT_TableRoot.tsx +51 -51
  51. package/src/toolbar/MRT_LinearProgressBar.tsx +5 -2
  52. package/src/toolbar/MRT_ToolbarAlertBanner.tsx +3 -2
  53. package/src/toolbar/MRT_ToolbarTop.tsx +4 -6
@@ -1,10 +1,10 @@
1
1
  import { ChangeEvent, Dispatch, FC, FocusEvent, MouseEvent, ReactNode, SetStateAction } from 'react';
2
2
  import { AlertProps, ButtonProps, CheckboxProps, IconButtonProps, LinearProgressProps, PaperProps, SkeletonProps, TableBodyProps, TableCellProps, TableContainerProps, TableFooterProps, TableHeadProps, TablePaginationProps, TableProps, TableRowProps, TextFieldProps, ToolbarProps } from '@mui/material';
3
- import { Cell, Column, ColumnDef, DefaultGenerics, FilterFn, FilterFnOption, Header, HeaderGroup, Options, Overwrite, PaginationState, Row, TableInstance, TableState, VisibilityState } from '@tanstack/react-table';
3
+ import { Cell, Column, ColumnDef, FilterFn, FilterFnOption, Header, HeaderGroup, Overwrite, PaginationState, ReactTableGenerics, Row, TableGenerics, TableInstance, TableState, UseTableInstanceOptions, VisibilityState } from '@tanstack/react-table';
4
4
  import { MRT_Localization } from './localization';
5
5
  import { MRT_Icons } from './icons';
6
6
  import { MRT_FILTER_OPTION } from './enums';
7
- export declare type MRT_TableOptions<D extends Record<string, any> = {}> = Partial<Omit<Options<D>, 'columns' | 'data' | 'initialState' | 'state' | 'expandRowsFn' | 'filterFns'>> & {
7
+ export declare type MRT_TableOptions<D extends Record<string, any> = {}> = Partial<Omit<UseTableInstanceOptions<ReactTableGenerics>, 'columns' | 'data' | 'initialState' | 'state' | 'expandRowsFn' | 'filterFns'>> & {
8
8
  columns: MRT_ColumnDef<D>[];
9
9
  data: D[];
10
10
  expandRowsFn?: (dataRow: D) => D[];
@@ -19,7 +19,7 @@ export interface MRT_RowModel<D extends Record<string, any> = {}> {
19
19
  [key: string]: MRT_Row<D>;
20
20
  };
21
21
  }
22
- export declare type MRT_TableInstance<D extends Record<string, any> = {}> = Omit<TableInstance<Overwrite<Partial<DefaultGenerics>, {
22
+ export declare type MRT_TableInstance<D extends Record<string, any> = {}> = Omit<TableInstance<Overwrite<Partial<TableGenerics>, {
23
23
  Row: D;
24
24
  }>>, 'getAllColumns' | 'getAllLeafColumns' | 'getExpandedRowModel' | 'getPaginationRowModel' | 'getPrePaginationRowModel' | 'getRowModel' | 'getSelectedRowModel' | 'getState' | 'options'> & {
25
25
  getAllColumns: () => MRT_Column<D>[];
@@ -35,10 +35,10 @@ export declare type MRT_TableInstance<D extends Record<string, any> = {}> = Omit
35
35
  idPrefix: string;
36
36
  localization: MRT_Localization;
37
37
  };
38
- setCurrentEditingCell: Dispatch<SetStateAction<MRT_Cell<D> | null>>;
39
- setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row<D> | null>>;
38
+ setCurrentEditingCell: Dispatch<SetStateAction<MRT_Cell | null>>;
39
+ setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row | null>>;
40
40
  setCurrentFilterFns: Dispatch<SetStateAction<{
41
- [key: string]: MRT_FilterFn<D>;
41
+ [key: string]: MRT_FilterFn;
42
42
  }>>;
43
43
  setCurrentGlobalFilterFn: Dispatch<SetStateAction<MRT_FilterFn<D>>>;
44
44
  setIsDensePadding: Dispatch<SetStateAction<boolean>>;
@@ -52,10 +52,13 @@ export declare type MRT_TableState<D extends Record<string, any> = {}> = Omit<Ta
52
52
  currentFilterFns: Record<string, string | Function>;
53
53
  currentGlobalFilterFn: Record<string, string | Function>;
54
54
  isDensePadding: boolean;
55
+ isLoading: boolean;
55
56
  isFullScreen: boolean;
57
+ pagination: Partial<PaginationState>;
56
58
  showFilters: boolean;
57
59
  showGlobalFilter: boolean;
58
- pagination: Partial<PaginationState>;
60
+ showProgressBars: boolean;
61
+ showSkeletons: boolean;
59
62
  };
60
63
  export declare type MRT_ColumnDef<D extends Record<string, any> = {}> = Omit<ColumnDef<D>, 'header' | 'footer' | 'columns' | 'filterFn'> & {
61
64
  Edit?: ({ cell, tableInstance, }: {
@@ -144,11 +147,8 @@ export declare type MRT_Header<D extends Record<string, any> = {}> = Omit<Header
144
147
  export declare type MRT_HeaderGroup<D extends Record<string, any> = {}> = Omit<HeaderGroup<D>, 'headers'> & {
145
148
  headers: MRT_Header<D>[];
146
149
  };
147
- export declare type MRT_Row<D extends Record<string, any> = {}> = Omit<Row<D>, 'getVisibleCells' | 'getAllCells' | 'subRows' | 'original' | 'getLeftVisibleCells' | 'getRightVisibleCells' | 'getCenterVisibleCells'> & {
150
+ export declare type MRT_Row<D extends Record<string, any> = {}> = Omit<Row<D>, 'getVisibleCells' | 'getAllCells' | 'subRows' | 'original'> & {
148
151
  getAllCells: () => MRT_Cell<D>[];
149
- getCenterVisibleCells: () => MRT_Cell<D>[];
150
- getLeftVisibleCells: () => MRT_Cell<D>[];
151
- getRightVisibleCells: () => MRT_Cell<D>[];
152
152
  getVisibleCells: () => MRT_Cell<D>[];
153
153
  subRows?: MRT_Row<D>[];
154
154
  original: D;
@@ -157,7 +157,7 @@ export declare type MRT_Cell<D extends Record<string, any> = {}> = Omit<Cell<D>,
157
157
  column: MRT_Column<D>;
158
158
  row: MRT_Row<D>;
159
159
  };
160
- export declare type MRT_FilterFn<D extends Record<string, any> = {}> = FilterFn<D> | FilterFnOption<D> | MRT_FILTER_OPTION | number | string | symbol;
160
+ export declare type MRT_FilterFn<D extends Record<string, any> = {}> = FilterFn<TableGenerics> | FilterFnOption<D> | MRT_FILTER_OPTION | number | string | symbol;
161
161
  export declare type MaterialReactTableProps<D extends Record<string, any> = {}> = MRT_TableOptions<D> & {
162
162
  editingMode?: 'table' | 'row' | 'cell';
163
163
  enableClickToCopy?: boolean;
@@ -181,8 +181,6 @@ export declare type MaterialReactTableProps<D extends Record<string, any> = {}>
181
181
  enabledGlobalFilterOptions?: (MRT_FILTER_OPTION | string)[];
182
182
  icons?: Partial<MRT_Icons>;
183
183
  idPrefix?: string;
184
- isLoading?: boolean;
185
- isReloading?: boolean;
186
184
  localization?: Partial<MRT_Localization>;
187
185
  muiLinearProgressProps?: LinearProgressProps | (({ tableInstance, }: {
188
186
  tableInstance: MRT_TableInstance;
@@ -392,5 +390,5 @@ export declare type MaterialReactTableProps<D extends Record<string, any> = {}>
392
390
  }>;
393
391
  }) => ReactNode;
394
392
  };
395
- declare const _default: <D extends Record<string, any> = {}>({ autoResetExpanded, autoResetSorting, columnResizeMode, editingMode, enableColumnActions, enableColumnFilters, enableColumnResizing, enableDensePaddingToggle, enableExpandAll, enableFilters, enableFullScreenToggle, enableGlobalFilter, enableHiding, enableMultiRowSelection, enablePagination, enableSelectAll, enableSorting, enableStickyHeader, enableTableFooter, enableTableHead, enableToolbarBottom, enableToolbarInternalActions, enableToolbarTop, icons, localization, persistentStateMode, positionActionsColumn, positionPagination, positionToolbarActions, positionToolbarAlertBanner, ...rest }: MaterialReactTableProps<D>) => JSX.Element;
393
+ declare const _default: <D extends Record<string, any> = {}>({ autoResetExpanded, columnResizeMode, editingMode, enableColumnActions, enableColumnFilters, enableColumnResizing, enableDensePaddingToggle, enableExpandAll, enableFilters, enableFullScreenToggle, enableGlobalFilter, enableHiding, enableMultiRowSelection, enablePagination, enablePinning, enableSelectAll, enableSorting, enableStickyHeader, enableTableFooter, enableTableHead, enableToolbarBottom, enableToolbarInternalActions, enableToolbarTop, icons, localization, persistentStateMode, positionActionsColumn, positionPagination, positionToolbarActions, positionToolbarAlertBanner, ...rest }: MaterialReactTableProps<D>) => JSX.Element;
396
394
  export default _default;
@@ -1,7 +1,6 @@
1
1
  import { FC } from 'react';
2
2
  import { MRT_TableInstance } from '..';
3
3
  interface Props {
4
- pinned: 'left' | 'center' | 'right' | 'none';
5
4
  tableInstance: MRT_TableInstance;
6
5
  }
7
6
  export declare const MRT_TableBody: FC<Props>;
@@ -2,6 +2,7 @@ import { FC } from 'react';
2
2
  import type { MRT_Cell, MRT_TableInstance } from '..';
3
3
  interface Props {
4
4
  cell: MRT_Cell;
5
+ enableHover?: boolean;
5
6
  tableInstance: MRT_TableInstance;
6
7
  }
7
8
  export declare const MRT_TableBodyCell: FC<Props>;
@@ -1,7 +1,6 @@
1
1
  import { FC } from 'react';
2
2
  import type { MRT_Row, MRT_TableInstance } from '..';
3
3
  interface Props {
4
- pinned: 'left' | 'center' | 'right' | 'none';
5
4
  row: MRT_Row;
6
5
  tableInstance: MRT_TableInstance;
7
6
  }
@@ -1,7 +1,8 @@
1
- import { FC } from 'react';
1
+ import { FC, ReactNode } from 'react';
2
2
  import { MRT_Cell, MRT_TableInstance } from '..';
3
3
  interface Props {
4
4
  cell: MRT_Cell;
5
+ children: ReactNode;
5
6
  tableInstance: MRT_TableInstance;
6
7
  }
7
8
  export declare const MRT_CopyButton: FC<Props>;
package/dist/enums.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  export declare enum MRT_FILTER_OPTION {
2
- BEST_MATCH = "bestMatch",
3
- BEST_MATCH_FIRST = "bestMatchFirst",
2
+ BETWEEN = "between",
4
3
  CONTAINS = "contains",
5
4
  EMPTY = "empty",
6
5
  ENDS_WITH = "endsWith",
7
6
  EQUALS = "equals",
7
+ FUZZY = "fuzzy",
8
8
  GREATER_THAN = "greaterThan",
9
9
  LESS_THAN = "lessThan",
10
10
  NOT_EMPTY = "notEmpty",
@@ -1,91 +1,92 @@
1
+ import { RankingInfo } from '@tanstack/match-sorter-utils';
1
2
  import { MRT_Row } from '.';
2
- export declare const bestMatchFirst: {
3
- (rows: MRT_Row[], columnIds: string[] | string, filterValue: string | number): MRT_Row<{}>[];
4
- autoRemove(val: any): boolean;
5
- };
6
- export declare const bestMatch: {
7
- (rows: MRT_Row[], columnIds: string[] | string, filterValue: string | number): MRT_Row<{}>[];
3
+ export declare const fuzzy: {
4
+ (row: MRT_Row, columnId: string, value: string, addMeta: (item: RankingInfo) => void): boolean;
8
5
  autoRemove(val: any): boolean;
9
6
  };
10
7
  export declare const contains: {
11
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
8
+ (row: MRT_Row, id: string, filterValue: string | number): any;
12
9
  autoRemove(val: any): boolean;
13
10
  };
14
11
  export declare const startsWith: {
15
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
12
+ (row: MRT_Row, id: string, filterValue: string | number): any;
16
13
  autoRemove(val: any): boolean;
17
14
  };
18
15
  export declare const endsWith: {
19
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
16
+ (row: MRT_Row, id: string, filterValue: string | number): any;
20
17
  autoRemove(val: any): boolean;
21
18
  };
22
19
  export declare const equals: {
23
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
20
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
24
21
  autoRemove(val: any): boolean;
25
22
  };
26
23
  export declare const notEquals: {
27
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
24
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
28
25
  autoRemove(val: any): boolean;
29
26
  };
30
27
  export declare const greaterThan: {
31
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
28
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
32
29
  autoRemove(val: any): boolean;
33
30
  };
34
31
  export declare const lessThan: {
35
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
32
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
33
+ autoRemove(val: any): boolean;
34
+ };
35
+ export declare const between: {
36
+ (row: MRT_Row, id: string, filterValues: [string | number, string | number]): boolean;
36
37
  autoRemove(val: any): boolean;
37
38
  };
38
39
  export declare const empty: {
39
- (rows: MRT_Row[], id: string, _filterValue: string | number): MRT_Row<{}>[];
40
+ (row: MRT_Row, id: string, _filterValue: string | number): boolean;
40
41
  autoRemove(val: any): boolean;
41
42
  };
42
43
  export declare const notEmpty: {
43
- (rows: MRT_Row[], id: string, _filterValue: string | number): MRT_Row<{}>[];
44
+ (row: MRT_Row, id: string, _filterValue: string | number): boolean;
44
45
  autoRemove(val: any): boolean;
45
46
  };
46
47
  export declare const defaultFilterFNs: {
47
- bestMatch: {
48
- (rows: MRT_Row[], columnIds: string[] | string, filterValue: string | number): MRT_Row<{}>[];
49
- autoRemove(val: any): boolean;
50
- };
51
- bestMatchFirst: {
52
- (rows: MRT_Row[], columnIds: string[] | string, filterValue: string | number): MRT_Row<{}>[];
48
+ between: {
49
+ (row: MRT_Row, id: string, filterValues: [string | number, string | number]): boolean;
53
50
  autoRemove(val: any): boolean;
54
51
  };
55
52
  contains: {
56
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
53
+ (row: MRT_Row, id: string, filterValue: string | number): any;
57
54
  autoRemove(val: any): boolean;
58
55
  };
59
56
  empty: {
60
- (rows: MRT_Row[], id: string, _filterValue: string | number): MRT_Row<{}>[];
57
+ (row: MRT_Row, id: string, _filterValue: string | number): boolean;
61
58
  autoRemove(val: any): boolean;
62
59
  };
63
60
  endsWith: {
64
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
61
+ (row: MRT_Row, id: string, filterValue: string | number): any;
65
62
  autoRemove(val: any): boolean;
66
63
  };
67
64
  equals: {
68
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
65
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
66
+ autoRemove(val: any): boolean;
67
+ };
68
+ fuzzy: {
69
+ (row: MRT_Row, columnId: string, value: string, addMeta: (item: RankingInfo) => void): boolean;
69
70
  autoRemove(val: any): boolean;
70
71
  };
71
72
  greaterThan: {
72
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
73
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
73
74
  autoRemove(val: any): boolean;
74
75
  };
75
76
  lessThan: {
76
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
77
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
77
78
  autoRemove(val: any): boolean;
78
79
  };
79
80
  notEmpty: {
80
- (rows: MRT_Row[], id: string, _filterValue: string | number): MRT_Row<{}>[];
81
+ (row: MRT_Row, id: string, _filterValue: string | number): boolean;
81
82
  autoRemove(val: any): boolean;
82
83
  };
83
84
  notEquals: {
84
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
85
+ (row: MRT_Row, id: string, filterValue: string | number): boolean;
85
86
  autoRemove(val: any): boolean;
86
87
  };
87
88
  startsWith: {
88
- (rows: MRT_Row[], id: string, filterValue: string | number): MRT_Row<{}>[];
89
+ (row: MRT_Row, id: string, filterValue: string | number): any;
89
90
  autoRemove(val: any): boolean;
90
91
  };
91
92
  };
@@ -1,7 +1,6 @@
1
1
  import { FC } from 'react';
2
2
  import type { MRT_TableInstance } from '..';
3
3
  interface Props {
4
- pinned: 'left' | 'center' | 'right' | 'none';
5
4
  tableInstance: MRT_TableInstance;
6
5
  }
7
6
  export declare const MRT_TableFooter: FC<Props>;
@@ -1,7 +1,6 @@
1
1
  import { FC } from 'react';
2
2
  import type { MRT_TableInstance } from '..';
3
3
  interface Props {
4
- pinned: 'left' | 'center' | 'right' | 'none';
5
4
  tableInstance: MRT_TableInstance;
6
5
  }
7
6
  export declare const MRT_TableHead: FC<Props>;
@@ -0,0 +1,8 @@
1
+ import { FC } from 'react';
2
+ import { MRT_Header, MRT_TableInstance } from '..';
3
+ interface Props {
4
+ header: MRT_Header;
5
+ tableInstance: MRT_TableInstance;
6
+ }
7
+ declare const MRT_FilterRangeFields: FC<Props>;
8
+ export default MRT_FilterRangeFields;
@@ -2,6 +2,7 @@ import { FC } from 'react';
2
2
  import type { MRT_Header, MRT_TableInstance } from '..';
3
3
  interface Props {
4
4
  header: MRT_Header;
5
+ inputIndex?: number;
5
6
  tableInstance: MRT_TableInstance;
6
7
  }
7
8
  export declare const MRT_FilterTextField: FC<Props>;
@@ -1,5 +1,6 @@
1
1
  export interface MRT_Localization {
2
2
  actions: string;
3
+ and: string;
3
4
  cancel: string;
4
5
  changeFilterMode: string;
5
6
  changeSearchMode: string;
@@ -12,13 +13,13 @@ export interface MRT_Localization {
12
13
  edit: string;
13
14
  expand: string;
14
15
  expandAll: string;
15
- filterBestMatch: string;
16
- filterBestMatchFirst: string;
16
+ filterBetween: string;
17
17
  filterByColumn: string;
18
18
  filterContains: string;
19
19
  filterEmpty: string;
20
20
  filterEndsWith: string;
21
21
  filterEquals: string;
22
+ filterFuzzy: string;
22
23
  filterGreaterThan: string;
23
24
  filterLessThan: string;
24
25
  filterMode: string;
@@ -30,6 +31,8 @@ export interface MRT_Localization {
30
31
  groupedBy: string;
31
32
  hideAll: string;
32
33
  hideColumn: string;
34
+ max: string;
35
+ min: string;
33
36
  pinToLeft: string;
34
37
  pinToRight: string;
35
38
  resetColumnSize: string;
@@ -50,6 +53,7 @@ export interface MRT_Localization {
50
53
  sortedByColumnAsc: string;
51
54
  sortedByColumnDesc: string;
52
55
  thenBy: string;
56
+ to: string;
53
57
  toggleDensePadding: string;
54
58
  toggleFullScreen: string;
55
59
  toggleSelectAll: string;