material-react-table 1.7.4 → 1.8.0

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 (44) hide show
  1. package/README.md +5 -13
  2. package/dist/cjs/index.js +79 -37
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/cjs/types/MaterialReactTable.d.ts +16 -8
  5. package/dist/cjs/types/body/MRT_TableBody.d.ts +3 -4
  6. package/dist/cjs/types/body/MRT_TableBodyCell.d.ts +2 -3
  7. package/dist/cjs/types/body/MRT_TableBodyRow.d.ts +4 -5
  8. package/dist/cjs/types/body/MRT_TableDetailPanel.d.ts +2 -3
  9. package/dist/cjs/types/footer/MRT_TableFooter.d.ts +2 -3
  10. package/dist/cjs/types/footer/MRT_TableFooterRow.d.ts +2 -3
  11. package/dist/cjs/types/head/MRT_TableHead.d.ts +2 -3
  12. package/dist/cjs/types/head/MRT_TableHeadRow.d.ts +2 -3
  13. package/dist/cjs/types/table/MRT_TableRoot.d.ts +1 -272
  14. package/dist/esm/material-react-table.esm.js +77 -38
  15. package/dist/esm/material-react-table.esm.js.map +1 -1
  16. package/dist/esm/types/MaterialReactTable.d.ts +16 -8
  17. package/dist/esm/types/body/MRT_TableBody.d.ts +3 -4
  18. package/dist/esm/types/body/MRT_TableBodyCell.d.ts +2 -3
  19. package/dist/esm/types/body/MRT_TableBodyRow.d.ts +4 -5
  20. package/dist/esm/types/body/MRT_TableDetailPanel.d.ts +2 -3
  21. package/dist/esm/types/footer/MRT_TableFooter.d.ts +2 -3
  22. package/dist/esm/types/footer/MRT_TableFooterRow.d.ts +2 -3
  23. package/dist/esm/types/head/MRT_TableHead.d.ts +2 -3
  24. package/dist/esm/types/head/MRT_TableHeadRow.d.ts +2 -3
  25. package/dist/esm/types/table/MRT_TableRoot.d.ts +1 -272
  26. package/dist/index.d.ts +16 -7
  27. package/package.json +2 -2
  28. package/src/MaterialReactTable.tsx +44 -7
  29. package/src/body/MRT_TableBody.tsx +11 -10
  30. package/src/body/MRT_TableBodyCell.tsx +8 -12
  31. package/src/body/MRT_TableBodyCellValue.tsx +1 -0
  32. package/src/body/MRT_TableBodyRow.tsx +14 -7
  33. package/src/body/MRT_TableDetailPanel.tsx +2 -3
  34. package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +4 -1
  35. package/src/column.utils.ts +6 -1
  36. package/src/footer/MRT_TableFooter.tsx +2 -3
  37. package/src/footer/MRT_TableFooterRow.tsx +7 -3
  38. package/src/head/MRT_TableHead.tsx +2 -3
  39. package/src/head/MRT_TableHeadRow.tsx +7 -3
  40. package/src/inputs/MRT_EditCellTextField.tsx +38 -2
  41. package/src/menus/MRT_FilterOptionMenu.tsx +14 -5
  42. package/src/menus/MRT_RowActionMenu.tsx +12 -10
  43. package/src/table/MRT_Table.tsx +2 -3
  44. package/src/table/MRT_TableRoot.tsx +33 -19
@@ -18,16 +18,18 @@ import type { TablePaginationProps } from '@mui/material/TablePagination';
18
18
  import type { TableRowProps } from '@mui/material/TableRow';
19
19
  import type { TextFieldProps } from '@mui/material/TextField';
20
20
  import type { ToolbarProps } from '@mui/material/Toolbar';
21
- import type { AggregationFn, Cell, Column, ColumnDef, DeepKeys, FilterFn, Header, HeaderGroup, OnChangeFn, Row, SortingFn, Table, TableOptions, TableState } from '@tanstack/react-table';
22
- import type { VirtualizerOptions, Virtualizer } from '@tanstack/react-virtual';
21
+ import type { AggregationFn, Cell, Column, ColumnDef, ColumnFiltersState, ColumnOrderState, ColumnPinningState, ColumnSizingInfoState, ColumnSizingState, DeepKeys, ExpandedState, FilterFn, GroupingState, Header, HeaderGroup, OnChangeFn, PaginationState, Row, RowSelectionState, SortingFn, SortingState, Table, TableOptions, TableState, VisibilityState } from '@tanstack/react-table';
22
+ import type { VirtualizerOptions, Virtualizer, VirtualItem } from '@tanstack/react-virtual';
23
23
  import { MRT_AggregationFns } from './aggregationFns';
24
24
  import { MRT_FilterFns } from './filterFns';
25
25
  import { MRT_Icons } from './icons';
26
26
  import { MRT_SortingFns } from './sortingFns';
27
+ export { MRT_AggregationFns, MRT_FilterFns, MRT_SortingFns };
27
28
  /**
28
29
  * Most of this file is just TypeScript types
29
30
  */
30
- export type DensityState = 'comfortable' | 'compact' | 'spacious';
31
+ export type MRT_DensityState = 'comfortable' | 'compact' | 'spacious';
32
+ export type { ColumnFiltersState as MRT_ColumnFiltersState, ColumnOrderState as MRT_ColumnOrderState, ColumnPinningState as MRT_ColumnPinningState, ColumnSizingInfoState as MRT_ColumnSizingInfoState, ColumnSizingState as MRT_ColumnSizingState, ExpandedState as MRT_ExpandedState, GroupingState as MRT_GroupingState, PaginationState as MRT_PaginationState, RowSelectionState as MRT_RowSelectionState, SortingState as MRT_SortingState, VirtualItem as MRT_VirtualItem, Virtualizer as MRT_Virtualizer, VirtualizerOptions as MRT_VirtualizerOptions, VisibilityState as MRT_VisibilityState, };
31
33
  type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
32
34
  export interface MRT_Localization {
33
35
  actions: string;
@@ -160,7 +162,7 @@ export type MRT_TableInstance<TData extends Record<string, any> = {}> = Omit<Tab
160
162
  setColumnFilterFns: Dispatch<SetStateAction<{
161
163
  [key: string]: MRT_FilterOption;
162
164
  }>>;
163
- setDensity: Dispatch<SetStateAction<DensityState>>;
165
+ setDensity: Dispatch<SetStateAction<MRT_DensityState>>;
164
166
  setDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
165
167
  setDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
166
168
  setEditingCell: Dispatch<SetStateAction<MRT_Cell<TData> | null>>;
@@ -180,7 +182,7 @@ export type MRT_TableInstance<TData extends Record<string, any> = {}> = Omit<Tab
180
182
  };
181
183
  export type MRT_TableState<TData extends Record<string, any> = {}> = TableState & {
182
184
  columnFilterFns: Record<string, MRT_FilterOption>;
183
- density: DensityState;
185
+ density: MRT_DensityState;
184
186
  draggingColumn: MRT_Column<TData> | null;
185
187
  draggingRow: MRT_Row<TData> | null;
186
188
  editingCell: MRT_Cell<TData> | null;
@@ -277,12 +279,18 @@ export type MRT_ColumnDef<TData extends Record<string, any> = {}> = Omit<ColumnD
277
279
  columnDefType?: 'data' | 'display' | 'group';
278
280
  columnFilterModeOptions?: Array<LiteralUnion<string & MRT_FilterOption>> | null;
279
281
  columns?: MRT_ColumnDef<TData>[];
282
+ editSelectOptions?: (string | {
283
+ text: string;
284
+ value: any;
285
+ })[];
286
+ editVariant?: 'text' | 'select';
280
287
  enableClickToCopy?: boolean;
281
288
  enableColumnActions?: boolean;
282
289
  enableColumnDragging?: boolean;
283
290
  enableColumnFilterModes?: boolean;
284
291
  enableColumnOrdering?: boolean;
285
- enableEditing?: boolean;
292
+ enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
293
+ enableFilterMatchHighlighting?: boolean;
286
294
  filterFn?: MRT_FilterFn<TData>;
287
295
  filterSelectOptions?: (string | {
288
296
  text: string;
@@ -453,7 +461,7 @@ export type MaterialReactTableProps<TData extends Record<string, any> = {}> = Om
453
461
  enableColumnOrdering?: boolean;
454
462
  enableColumnVirtualization?: boolean;
455
463
  enableDensityToggle?: boolean;
456
- enableEditing?: boolean;
464
+ enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
457
465
  enableExpandAll?: boolean;
458
466
  enableFilterMatchHighlighting?: boolean;
459
467
  enableFullScreenToggle?: boolean;
@@ -621,7 +629,7 @@ export type MaterialReactTableProps<TData extends Record<string, any> = {}> = Om
621
629
  muiTopToolbarProps?: ToolbarProps | ((props: {
622
630
  table: MRT_TableInstance<TData>;
623
631
  }) => ToolbarProps);
624
- onDensityChange?: OnChangeFn<DensityState>;
632
+ onDensityChange?: OnChangeFn<MRT_DensityState>;
625
633
  onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
626
634
  onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
627
635
  onEditingCellChange?: OnChangeFn<MRT_Cell<TData> | null>;
@@ -1,10 +1,9 @@
1
1
  import React from 'react';
2
- import { Virtualizer, VirtualItem } from '@tanstack/react-virtual';
3
- import type { MRT_TableInstance } from '..';
2
+ import type { MRT_TableInstance, MRT_VirtualItem, MRT_Virtualizer } from '..';
4
3
  interface Props {
5
- columnVirtualizer?: Virtualizer<HTMLDivElement, HTMLTableCellElement>;
4
+ columnVirtualizer?: MRT_Virtualizer<HTMLDivElement, HTMLTableCellElement>;
6
5
  table: MRT_TableInstance;
7
- virtualColumns?: VirtualItem[];
6
+ virtualColumns?: MRT_VirtualItem[];
8
7
  virtualPaddingLeft?: number;
9
8
  virtualPaddingRight?: number;
10
9
  }
@@ -1,6 +1,5 @@
1
1
  import React, { RefObject } from 'react';
2
- import type { VirtualItem } from '@tanstack/react-virtual';
3
- import type { MRT_Cell, MRT_TableInstance } from '..';
2
+ import type { MRT_Cell, MRT_TableInstance, MRT_VirtualItem } from '..';
4
3
  interface Props {
5
4
  cell: MRT_Cell;
6
5
  enableHover?: boolean;
@@ -9,7 +8,7 @@ interface Props {
9
8
  rowIndex: number;
10
9
  rowRef: RefObject<HTMLTableRowElement>;
11
10
  table: MRT_TableInstance;
12
- virtualCell?: VirtualItem;
11
+ virtualCell?: MRT_VirtualItem;
13
12
  }
14
13
  export declare const MRT_TableBodyCell: ({ cell, enableHover, measureElement, numRows, rowIndex, rowRef, table, virtualCell, }: Props) => JSX.Element;
15
14
  export declare const Memo_MRT_TableBodyCell: React.MemoExoticComponent<({ cell, enableHover, measureElement, numRows, rowIndex, rowRef, table, virtualCell, }: Props) => JSX.Element>;
@@ -1,17 +1,16 @@
1
1
  import React from 'react';
2
- import type { VirtualItem, Virtualizer } from '@tanstack/react-virtual';
3
- import type { MRT_Row, MRT_TableInstance } from '..';
2
+ import type { MRT_Row, MRT_TableInstance, MRT_VirtualItem, MRT_Virtualizer } from '..';
4
3
  interface Props {
5
- columnVirtualizer?: Virtualizer<HTMLDivElement, HTMLTableCellElement>;
4
+ columnVirtualizer?: MRT_Virtualizer<HTMLDivElement, HTMLTableCellElement>;
6
5
  measureElement?: (element: HTMLTableRowElement) => void;
7
6
  numRows: number;
8
7
  row: MRT_Row;
9
8
  rowIndex: number;
10
9
  table: MRT_TableInstance;
11
- virtualColumns?: VirtualItem[];
10
+ virtualColumns?: MRT_VirtualItem[];
12
11
  virtualPaddingLeft?: number;
13
12
  virtualPaddingRight?: number;
14
- virtualRow?: VirtualItem;
13
+ virtualRow?: MRT_VirtualItem;
15
14
  }
16
15
  export declare const MRT_TableBodyRow: ({ columnVirtualizer, measureElement, numRows, row, rowIndex, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight, virtualRow, }: Props) => JSX.Element;
17
16
  export declare const Memo_MRT_TableBodyRow: React.MemoExoticComponent<({ columnVirtualizer, measureElement, numRows, row, rowIndex, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight, virtualRow, }: Props) => JSX.Element>;
@@ -1,11 +1,10 @@
1
1
  import React from 'react';
2
- import type { VirtualItem } from '@tanstack/react-virtual';
3
- import type { MRT_Row, MRT_TableInstance } from '..';
2
+ import type { MRT_Row, MRT_TableInstance, MRT_VirtualItem } from '..';
4
3
  interface Props {
5
4
  parentRowRef: React.RefObject<HTMLTableRowElement>;
6
5
  row: MRT_Row;
7
6
  table: MRT_TableInstance;
8
- virtualRow?: VirtualItem;
7
+ virtualRow?: MRT_VirtualItem;
9
8
  }
10
9
  export declare const MRT_TableDetailPanel: ({ parentRowRef, row, table, virtualRow, }: Props) => JSX.Element;
11
10
  export {};
@@ -1,9 +1,8 @@
1
1
  /// <reference types="react" />
2
- import type { VirtualItem } from '@tanstack/react-virtual';
3
- import type { MRT_TableInstance } from '..';
2
+ import type { MRT_TableInstance, MRT_VirtualItem } from '..';
4
3
  interface Props {
5
4
  table: MRT_TableInstance;
6
- virtualColumns?: VirtualItem[];
5
+ virtualColumns?: MRT_VirtualItem[];
7
6
  virtualPaddingLeft?: number;
8
7
  virtualPaddingRight?: number;
9
8
  }
@@ -1,10 +1,9 @@
1
1
  /// <reference types="react" />
2
- import { VirtualItem } from '@tanstack/react-virtual';
3
- import type { MRT_HeaderGroup, MRT_TableInstance } from '..';
2
+ import type { MRT_HeaderGroup, MRT_TableInstance, MRT_VirtualItem } from '..';
4
3
  interface Props {
5
4
  footerGroup: MRT_HeaderGroup;
6
5
  table: MRT_TableInstance;
7
- virtualColumns?: VirtualItem[];
6
+ virtualColumns?: MRT_VirtualItem[];
8
7
  virtualPaddingLeft?: number;
9
8
  virtualPaddingRight?: number;
10
9
  }
@@ -1,9 +1,8 @@
1
1
  /// <reference types="react" />
2
- import type { VirtualItem } from '@tanstack/react-virtual';
3
- import type { MRT_TableInstance } from '..';
2
+ import type { MRT_TableInstance, MRT_VirtualItem } from '..';
4
3
  interface Props {
5
4
  table: MRT_TableInstance;
6
- virtualColumns?: VirtualItem[];
5
+ virtualColumns?: MRT_VirtualItem[];
7
6
  virtualPaddingLeft?: number;
8
7
  virtualPaddingRight?: number;
9
8
  }
@@ -1,10 +1,9 @@
1
1
  /// <reference types="react" />
2
- import type { VirtualItem } from '@tanstack/react-virtual';
3
- import type { MRT_HeaderGroup, MRT_TableInstance } from '..';
2
+ import type { MRT_HeaderGroup, MRT_TableInstance, MRT_VirtualItem } from '..';
4
3
  interface Props {
5
4
  headerGroup: MRT_HeaderGroup;
6
5
  table: MRT_TableInstance;
7
- virtualColumns?: VirtualItem[];
6
+ virtualColumns?: MRT_VirtualItem[];
8
7
  virtualPaddingLeft?: number;
9
8
  virtualPaddingRight?: number;
10
9
  }
@@ -1,272 +1 @@
1
- import React from 'react';
2
- import type { MRT_Cell, MRT_Column, MRT_ColumnDef, MRT_FilterOption, MRT_Localization, MRT_Row, MRT_TableInstance, MRT_TableState, MaterialReactTableProps } from '..';
3
- export declare const MRT_TableRoot: <TData extends Record<string, any> = {}>(props: Omit<Partial<import("@tanstack/react-table").TableOptions<TData>>, "state" | "data" | "onStateChange" | "initialState" | "getRowId" | "columns" | "defaultColumn" | "globalFilterFn" | "enableRowSelection" | "expandRowsFn"> & {
4
- columnFilterModeOptions?: (string & MRT_FilterOption)[] | null | undefined;
5
- columns: MRT_ColumnDef<TData>[];
6
- data: TData[];
7
- defaultColumn?: Partial<MRT_ColumnDef<TData>> | undefined;
8
- defaultDisplayColumn?: Partial<MRT_ColumnDef<TData>> | undefined;
9
- displayColumnDefOptions?: Partial<{
10
- "mrt-row-drag": Partial<MRT_ColumnDef<{}>>;
11
- "mrt-row-actions": Partial<MRT_ColumnDef<{}>>;
12
- "mrt-row-expand": Partial<MRT_ColumnDef<{}>>;
13
- "mrt-row-select": Partial<MRT_ColumnDef<{}>>;
14
- "mrt-row-numbers": Partial<MRT_ColumnDef<{}>>;
15
- }> | undefined;
16
- editingMode?: "row" | "cell" | "table" | "modal" | undefined;
17
- enableBottomToolbar?: boolean | undefined;
18
- enableClickToCopy?: boolean | undefined;
19
- enableColumnActions?: boolean | undefined;
20
- enableColumnDragging?: boolean | undefined;
21
- enableColumnFilterModes?: boolean | undefined;
22
- enableColumnOrdering?: boolean | undefined;
23
- enableColumnVirtualization?: boolean | undefined;
24
- enableDensityToggle?: boolean | undefined;
25
- enableEditing?: boolean | undefined;
26
- enableExpandAll?: boolean | undefined;
27
- enableFilterMatchHighlighting?: boolean | undefined;
28
- enableFullScreenToggle?: boolean | undefined;
29
- enableGlobalFilterModes?: boolean | undefined;
30
- enableGlobalFilterRankedResults?: boolean | undefined;
31
- enablePagination?: boolean | undefined;
32
- enableRowActions?: boolean | undefined;
33
- enableRowDragging?: boolean | undefined;
34
- enableRowNumbers?: boolean | undefined;
35
- enableRowOrdering?: boolean | undefined;
36
- enableRowSelection?: boolean | ((row: MRT_Row<TData>) => boolean) | undefined;
37
- enableRowVirtualization?: boolean | undefined;
38
- enableSelectAll?: boolean | undefined;
39
- enableStickyFooter?: boolean | undefined;
40
- enableStickyHeader?: boolean | undefined;
41
- enableTableFooter?: boolean | undefined;
42
- enableTableHead?: boolean | undefined;
43
- enableToolbarInternalActions?: boolean | undefined;
44
- enableTopToolbar?: boolean | undefined;
45
- expandRowsFn?: ((dataRow: TData) => TData[]) | undefined;
46
- getRowId?: ((originalRow: TData, index: number, parentRow: MRT_Row<TData>) => string) | undefined;
47
- globalFilterFn?: MRT_FilterOption | undefined;
48
- globalFilterModeOptions?: MRT_FilterOption[] | null | undefined;
49
- icons?: Partial<import("..").MRT_Icons> | undefined;
50
- initialState?: Partial<MRT_TableState<TData>> | undefined;
51
- layoutMode?: "grid" | "semantic" | undefined;
52
- localization?: Partial<MRT_Localization> | undefined;
53
- memoMode?: "rows" | "cells" | "table-body" | undefined;
54
- muiBottomToolbarProps?: import("@mui/material").ToolbarProps<"div", {}> | ((props: {
55
- table: MRT_TableInstance<TData>;
56
- }) => import("@mui/material").ToolbarProps<"div", {}>) | undefined;
57
- muiExpandAllButtonProps?: import("@mui/material").IconButtonProps<"button", {}> | ((props: {
58
- table: MRT_TableInstance<TData>;
59
- }) => import("@mui/material").IconButtonProps<"button", {}>) | undefined;
60
- muiExpandButtonProps?: import("@mui/material").IconButtonProps<"button", {}> | ((props: {
61
- table: MRT_TableInstance<TData>;
62
- row: MRT_Row<TData>;
63
- }) => import("@mui/material").IconButtonProps<"button", {}>) | undefined;
64
- muiLinearProgressProps?: import("@mui/material").LinearProgressProps | ((props: {
65
- isTopToolbar: boolean;
66
- table: MRT_TableInstance<TData>;
67
- }) => import("@mui/material").LinearProgressProps) | undefined;
68
- muiSearchTextFieldProps?: import("@mui/material").TextFieldProps | ((props: {
69
- table: MRT_TableInstance<TData>;
70
- }) => import("@mui/material").TextFieldProps) | undefined;
71
- muiSelectAllCheckboxProps?: import("@mui/material").CheckboxProps | ((props: {
72
- table: MRT_TableInstance<TData>;
73
- }) => import("@mui/material").CheckboxProps) | undefined;
74
- muiSelectCheckboxProps?: import("@mui/material").CheckboxProps | import("@mui/material").RadioProps | ((props: {
75
- table: MRT_TableInstance<TData>;
76
- row: MRT_Row<TData>;
77
- }) => import("@mui/material").CheckboxProps | import("@mui/material").RadioProps) | undefined;
78
- muiTableBodyCellCopyButtonProps?: import("@mui/material").ButtonProps<"button", {}> | ((props: {
79
- cell: MRT_Cell<TData>;
80
- column: MRT_Column<TData>;
81
- row: MRT_Row<TData>;
82
- table: MRT_TableInstance<TData>;
83
- }) => import("@mui/material").ButtonProps<"button", {}>) | undefined;
84
- muiTableBodyCellEditTextFieldProps?: import("@mui/material").TextFieldProps | ((props: {
85
- cell: MRT_Cell<TData>;
86
- column: MRT_Column<TData>;
87
- row: MRT_Row<TData>;
88
- table: MRT_TableInstance<TData>;
89
- }) => import("@mui/material").TextFieldProps) | undefined;
90
- muiTableBodyCellProps?: import("@mui/material").TableCellProps | ((props: {
91
- cell: MRT_Cell<TData>;
92
- column: MRT_Column<TData>;
93
- row: MRT_Row<TData>;
94
- table: MRT_TableInstance<TData>;
95
- }) => import("@mui/material").TableCellProps) | undefined;
96
- muiTableBodyCellSkeletonProps?: import("@mui/material").SkeletonProps<"span", {}> | ((props: {
97
- cell: MRT_Cell<TData>;
98
- column: MRT_Column<TData>;
99
- row: MRT_Row<TData>;
100
- table: MRT_TableInstance<TData>;
101
- }) => import("@mui/material").SkeletonProps<"span", {}>) | undefined;
102
- muiTableBodyProps?: import("@mui/material").TableBodyProps<"tbody", {}> | ((props: {
103
- table: MRT_TableInstance<TData>;
104
- }) => import("@mui/material").TableBodyProps<"tbody", {}>) | undefined;
105
- muiTableBodyRowDragHandleProps?: import("@mui/material").IconButtonProps<"button", {}> | ((props: {
106
- table: MRT_TableInstance<TData>;
107
- row: MRT_Row<TData>;
108
- }) => import("@mui/material").IconButtonProps<"button", {}>) | undefined;
109
- muiTableBodyRowProps?: import("@mui/material").TableRowProps<"tr", {}> | ((props: {
110
- isDetailPanel?: boolean | undefined;
111
- row: MRT_Row<TData>;
112
- table: MRT_TableInstance<TData>;
113
- }) => import("@mui/material").TableRowProps<"tr", {}>) | undefined;
114
- muiTableContainerProps?: import("@mui/material").TableContainerProps<"div", {}> | ((props: {
115
- table: MRT_TableInstance<TData>;
116
- }) => import("@mui/material").TableContainerProps<"div", {}>) | undefined;
117
- muiTableDetailPanelProps?: import("@mui/material").TableCellProps | ((props: {
118
- table: MRT_TableInstance<TData>;
119
- row: MRT_Row<TData>;
120
- }) => import("@mui/material").TableCellProps) | undefined;
121
- muiTableFooterCellProps?: import("@mui/material").TableCellProps | ((props: {
122
- table: MRT_TableInstance<TData>;
123
- column: MRT_Column<TData>;
124
- }) => import("@mui/material").TableCellProps) | undefined;
125
- muiTableFooterProps?: import("@mui/material").TableFooterProps<"tfoot", {}> | ((props: {
126
- table: MRT_TableInstance<TData>;
127
- }) => import("@mui/material").TableFooterProps<"tfoot", {}>) | undefined;
128
- muiTableFooterRowProps?: import("@mui/material").TableRowProps<"tr", {}> | ((props: {
129
- table: MRT_TableInstance<TData>;
130
- footerGroup: import("..").MRT_HeaderGroup<TData>;
131
- }) => import("@mui/material").TableRowProps<"tr", {}>) | undefined;
132
- muiTableHeadCellColumnActionsButtonProps?: import("@mui/material").IconButtonProps<"button", {}> | ((props: {
133
- table: MRT_TableInstance<TData>;
134
- column: MRT_Column<TData>;
135
- }) => import("@mui/material").IconButtonProps<"button", {}>) | undefined;
136
- muiTableHeadCellDragHandleProps?: import("@mui/material").IconButtonProps<"button", {}> | ((props: {
137
- table: MRT_TableInstance<TData>;
138
- column: MRT_Column<TData>;
139
- }) => import("@mui/material").IconButtonProps<"button", {}>) | undefined;
140
- muiTableHeadCellFilterCheckboxProps?: import("@mui/material").CheckboxProps | ((props: {
141
- column: MRT_Column<TData>;
142
- table: MRT_TableInstance<TData>;
143
- }) => import("@mui/material").CheckboxProps) | undefined;
144
- muiTableHeadCellFilterTextFieldProps?: import("@mui/material").TextFieldProps | ((props: {
145
- table: MRT_TableInstance<TData>;
146
- column: MRT_Column<TData>;
147
- rangeFilterIndex?: number | undefined;
148
- }) => import("@mui/material").TextFieldProps) | undefined;
149
- muiTableHeadCellProps?: import("@mui/material").TableCellProps | ((props: {
150
- table: MRT_TableInstance<TData>;
151
- column: MRT_Column<TData>;
152
- }) => import("@mui/material").TableCellProps) | undefined;
153
- muiTableHeadProps?: import("@mui/material").TableHeadProps<"thead", {}> | ((props: {
154
- table: MRT_TableInstance<TData>;
155
- }) => import("@mui/material").TableHeadProps<"thead", {}>) | undefined;
156
- muiTableHeadRowProps?: import("@mui/material").TableRowProps<"tr", {}> | ((props: {
157
- table: MRT_TableInstance<TData>;
158
- headerGroup: import("..").MRT_HeaderGroup<TData>;
159
- }) => import("@mui/material").TableRowProps<"tr", {}>) | undefined;
160
- muiTablePaginationProps?: Partial<import("@mui/material").TablePaginationProps<React.JSXElementConstructor<import("@mui/material").TablePaginationBaseProps>, {}>> | ((props: {
161
- table: MRT_TableInstance<TData>;
162
- }) => Partial<import("@mui/material").TablePaginationProps<React.JSXElementConstructor<import("@mui/material").TablePaginationBaseProps>, {}>>) | undefined;
163
- muiTablePaperProps?: import("@mui/material").PaperProps<"div", {}> | ((props: {
164
- table: MRT_TableInstance<TData>;
165
- }) => import("@mui/material").PaperProps<"div", {}>) | undefined;
166
- muiTableProps?: import("@mui/material").TableProps<"table", {}> | ((props: {
167
- table: MRT_TableInstance<TData>;
168
- }) => import("@mui/material").TableProps<"table", {}>) | undefined;
169
- muiToolbarAlertBannerChipProps?: import("@mui/material").ChipProps<"div", {}> | ((props: {
170
- table: MRT_TableInstance<TData>;
171
- }) => import("@mui/material").ChipProps<"div", {}>) | undefined;
172
- muiToolbarAlertBannerProps?: import("@mui/material").AlertProps | ((props: {
173
- table: MRT_TableInstance<TData>;
174
- }) => import("@mui/material").AlertProps) | undefined;
175
- muiTopToolbarProps?: import("@mui/material").ToolbarProps<"div", {}> | ((props: {
176
- table: MRT_TableInstance<TData>;
177
- }) => import("@mui/material").ToolbarProps<"div", {}>) | undefined;
178
- onDensityChange?: import("@tanstack/react-table").OnChangeFn<import("..").DensityState> | undefined;
179
- onDraggingColumnChange?: import("@tanstack/react-table").OnChangeFn<MRT_Column<TData> | null> | undefined;
180
- onDraggingRowChange?: import("@tanstack/react-table").OnChangeFn<MRT_Row<TData> | null> | undefined;
181
- onEditingCellChange?: import("@tanstack/react-table").OnChangeFn<MRT_Cell<TData> | null> | undefined;
182
- onEditingRowCancel?: ((props: {
183
- row: MRT_Row<TData>;
184
- table: MRT_TableInstance<TData>;
185
- }) => void) | undefined;
186
- onEditingRowSave?: ((props: {
187
- exitEditingMode: () => void;
188
- row: MRT_Row<TData>;
189
- table: MRT_TableInstance<TData>;
190
- values: Record<(string & Record<never, never>) | (string & import("@tanstack/react-table").DeepKeys<TData>), any>;
191
- }) => void | Promise<void>) | undefined;
192
- onEditingRowChange?: import("@tanstack/react-table").OnChangeFn<MRT_Row<TData> | null> | undefined;
193
- onColumnFilterFnsChange?: import("@tanstack/react-table").OnChangeFn<{
194
- [key: string]: MRT_FilterOption;
195
- }> | undefined;
196
- onGlobalFilterFnChange?: import("@tanstack/react-table").OnChangeFn<MRT_FilterOption> | undefined;
197
- onHoveredColumnChange?: import("@tanstack/react-table").OnChangeFn<MRT_Column<TData> | null> | undefined;
198
- onHoveredRowChange?: import("@tanstack/react-table").OnChangeFn<MRT_Row<TData> | null> | undefined;
199
- onIsFullScreenChange?: import("@tanstack/react-table").OnChangeFn<boolean> | undefined;
200
- onShowAlertBannerChange?: import("@tanstack/react-table").OnChangeFn<boolean> | undefined;
201
- onShowFiltersChange?: import("@tanstack/react-table").OnChangeFn<boolean> | undefined;
202
- onShowGlobalFilterChange?: import("@tanstack/react-table").OnChangeFn<boolean> | undefined;
203
- onShowToolbarDropZoneChange?: import("@tanstack/react-table").OnChangeFn<boolean> | undefined;
204
- positionActionsColumn?: "first" | "last" | undefined;
205
- positionExpandColumn?: "first" | "last" | undefined;
206
- positionGlobalFilter?: "left" | "right" | "none" | undefined;
207
- positionPagination?: "bottom" | "top" | "none" | "both" | undefined;
208
- positionToolbarAlertBanner?: "bottom" | "top" | "none" | undefined;
209
- positionToolbarDropZone?: "bottom" | "top" | "none" | "both" | undefined;
210
- renderBottomToolbar?: React.ReactNode | ((props: {
211
- table: MRT_TableInstance<TData>;
212
- }) => React.ReactNode);
213
- renderBottomToolbarCustomActions?: ((props: {
214
- table: MRT_TableInstance<TData>;
215
- }) => React.ReactNode) | undefined;
216
- renderColumnActionsMenuItems?: ((props: {
217
- column: MRT_Column<TData>;
218
- closeMenu: () => void;
219
- table: MRT_TableInstance<TData>;
220
- }) => React.ReactNode[]) | undefined;
221
- renderColumnFilterModeMenuItems?: ((props: {
222
- column: MRT_Column<TData>;
223
- internalFilterOptions: import("..").MRT_InternalFilterOption[];
224
- onSelectFilterMode: (filterMode: MRT_FilterOption) => void;
225
- table: MRT_TableInstance<TData>;
226
- }) => React.ReactNode[]) | undefined;
227
- renderDetailPanel?: ((props: {
228
- row: MRT_Row<TData>;
229
- table: MRT_TableInstance<TData>;
230
- }) => React.ReactNode) | undefined;
231
- renderGlobalFilterModeMenuItems?: ((props: {
232
- internalFilterOptions: import("..").MRT_InternalFilterOption[];
233
- onSelectFilterMode: (filterMode: MRT_FilterOption) => void;
234
- table: MRT_TableInstance<TData>;
235
- }) => React.ReactNode[]) | undefined;
236
- renderRowActionMenuItems?: ((props: {
237
- closeMenu: () => void;
238
- row: MRT_Row<TData>;
239
- table: MRT_TableInstance<TData>;
240
- }) => React.ReactNode[]) | undefined;
241
- renderRowActions?: ((props: {
242
- cell: MRT_Cell<TData>;
243
- row: MRT_Row<TData>;
244
- table: MRT_TableInstance<TData>;
245
- }) => React.ReactNode) | undefined;
246
- renderToolbarInternalActions?: ((props: {
247
- table: MRT_TableInstance<TData>;
248
- }) => React.ReactNode) | undefined;
249
- renderTopToolbar?: React.ReactNode | ((props: {
250
- table: MRT_TableInstance<TData>;
251
- }) => React.ReactNode);
252
- renderTopToolbarCustomActions?: ((props: {
253
- table: MRT_TableInstance<TData>;
254
- }) => React.ReactNode) | undefined;
255
- rowCount?: number | undefined;
256
- rowNumberMode?: "original" | "static" | undefined;
257
- selectAllMode?: "all" | "page" | undefined;
258
- state?: Partial<MRT_TableState<TData>> | undefined;
259
- columnVirtualizerInstanceRef?: React.MutableRefObject<import("@tanstack/react-virtual").Virtualizer<HTMLDivElement, HTMLTableCellElement> | null> | undefined;
260
- columnVirtualizerProps?: Partial<import("@tanstack/react-virtual").VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>> | ((props: {
261
- table: MRT_TableInstance<TData>;
262
- }) => Partial<import("@tanstack/react-virtual").VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>>) | undefined;
263
- rowVirtualizerInstanceRef?: React.MutableRefObject<import("@tanstack/react-virtual").Virtualizer<HTMLDivElement, HTMLTableRowElement> | null> | undefined;
264
- rowVirtualizerProps?: Partial<import("@tanstack/react-virtual").VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>> | ((props: {
265
- table: MRT_TableInstance<TData>;
266
- }) => Partial<import("@tanstack/react-virtual").VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>>) | undefined;
267
- tableInstanceRef?: React.MutableRefObject<MRT_TableInstance<TData> | null> | undefined;
268
- virtualizerInstanceRef?: any;
269
- virtualizerProps?: any;
270
- } & {
271
- localization: MRT_Localization;
272
- }) => JSX.Element;
1
+ export declare const MRT_TableRoot: any;
package/dist/index.d.ts CHANGED
@@ -21,7 +21,9 @@ import { TextFieldProps } from '@mui/material/TextField';
21
21
  import { ToolbarProps } from '@mui/material/Toolbar';
22
22
  import * as _tanstack_react_table from '@tanstack/react-table';
23
23
  import { Row, Table, TableState, ColumnDef, DeepKeys, Column, Header, HeaderGroup, Cell, AggregationFn, SortingFn, FilterFn, TableOptions, OnChangeFn } from '@tanstack/react-table';
24
+ export { ColumnFiltersState as MRT_ColumnFiltersState, ColumnOrderState as MRT_ColumnOrderState, ColumnPinningState as MRT_ColumnPinningState, ColumnSizingInfoState as MRT_ColumnSizingInfoState, ColumnSizingState as MRT_ColumnSizingState, ExpandedState as MRT_ExpandedState, GroupingState as MRT_GroupingState, PaginationState as MRT_PaginationState, RowSelectionState as MRT_RowSelectionState, SortingState as MRT_SortingState, VisibilityState as MRT_VisibilityState } from '@tanstack/react-table';
24
25
  import { Virtualizer, VirtualizerOptions } from '@tanstack/react-virtual';
26
+ export { VirtualItem as MRT_VirtualItem, Virtualizer as MRT_Virtualizer, VirtualizerOptions as MRT_VirtualizerOptions } from '@tanstack/react-virtual';
25
27
  import { RankingInfo } from '@tanstack/match-sorter-utils';
26
28
 
27
29
  declare const MRT_AggregationFns: {
@@ -147,7 +149,8 @@ declare const MRT_SortingFns: {
147
149
  /**
148
150
  * Most of this file is just TypeScript types
149
151
  */
150
- type DensityState = 'comfortable' | 'compact' | 'spacious';
152
+ type MRT_DensityState = 'comfortable' | 'compact' | 'spacious';
153
+
151
154
  type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
152
155
  interface MRT_Localization {
153
156
  actions: string;
@@ -280,7 +283,7 @@ type MRT_TableInstance<TData extends Record<string, any> = {}> = Omit<Table<TDat
280
283
  setColumnFilterFns: Dispatch<SetStateAction<{
281
284
  [key: string]: MRT_FilterOption;
282
285
  }>>;
283
- setDensity: Dispatch<SetStateAction<DensityState>>;
286
+ setDensity: Dispatch<SetStateAction<MRT_DensityState>>;
284
287
  setDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
285
288
  setDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
286
289
  setEditingCell: Dispatch<SetStateAction<MRT_Cell<TData> | null>>;
@@ -300,7 +303,7 @@ type MRT_TableInstance<TData extends Record<string, any> = {}> = Omit<Table<TDat
300
303
  };
301
304
  type MRT_TableState<TData extends Record<string, any> = {}> = TableState & {
302
305
  columnFilterFns: Record<string, MRT_FilterOption>;
303
- density: DensityState;
306
+ density: MRT_DensityState;
304
307
  draggingColumn: MRT_Column<TData> | null;
305
308
  draggingRow: MRT_Row<TData> | null;
306
309
  editingCell: MRT_Cell<TData> | null;
@@ -397,12 +400,18 @@ type MRT_ColumnDef<TData extends Record<string, any> = {}> = Omit<ColumnDef<TDat
397
400
  columnDefType?: 'data' | 'display' | 'group';
398
401
  columnFilterModeOptions?: Array<LiteralUnion<string & MRT_FilterOption>> | null;
399
402
  columns?: MRT_ColumnDef<TData>[];
403
+ editSelectOptions?: (string | {
404
+ text: string;
405
+ value: any;
406
+ })[];
407
+ editVariant?: 'text' | 'select';
400
408
  enableClickToCopy?: boolean;
401
409
  enableColumnActions?: boolean;
402
410
  enableColumnDragging?: boolean;
403
411
  enableColumnFilterModes?: boolean;
404
412
  enableColumnOrdering?: boolean;
405
- enableEditing?: boolean;
413
+ enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
414
+ enableFilterMatchHighlighting?: boolean;
406
415
  filterFn?: MRT_FilterFn<TData>;
407
416
  filterSelectOptions?: (string | {
408
417
  text: string;
@@ -573,7 +582,7 @@ type MaterialReactTableProps<TData extends Record<string, any> = {}> = Omit<Part
573
582
  enableColumnOrdering?: boolean;
574
583
  enableColumnVirtualization?: boolean;
575
584
  enableDensityToggle?: boolean;
576
- enableEditing?: boolean;
585
+ enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
577
586
  enableExpandAll?: boolean;
578
587
  enableFilterMatchHighlighting?: boolean;
579
588
  enableFullScreenToggle?: boolean;
@@ -741,7 +750,7 @@ type MaterialReactTableProps<TData extends Record<string, any> = {}> = Omit<Part
741
750
  muiTopToolbarProps?: ToolbarProps | ((props: {
742
751
  table: MRT_TableInstance<TData>;
743
752
  }) => ToolbarProps);
744
- onDensityChange?: OnChangeFn<DensityState>;
753
+ onDensityChange?: OnChangeFn<MRT_DensityState>;
745
754
  onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
746
755
  onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
747
756
  onEditingCellChange?: OnChangeFn<MRT_Cell<TData> | null>;
@@ -935,4 +944,4 @@ interface Props<TData extends Record<string, any> = {}> {
935
944
  }
936
945
  declare const MRT_BottomToolbar: <TData extends Record<string, any> = {}>({ table, }: Props<TData>) => JSX.Element;
937
946
 
938
- export { DensityState, MRT_AggregationFn, MRT_AggregationOption, MRT_BottomToolbar, MRT_Cell, MRT_Column, MRT_ColumnDef, MRT_CopyButton, MRT_DefinedColumnDef, MRT_DisplayColumnIds, MRT_EditActionButtons, MRT_FilterFn, MRT_FilterOption, MRT_FilterOptionMenu, MRT_FullScreenToggleButton, MRT_GlobalFilterTextField, MRT_Header, MRT_HeaderGroup, MRT_Icons, MRT_InternalFilterOption, MRT_Localization, MRT_Row, MRT_RowModel, MRT_ShowHideColumnsButton, MRT_SortingFn, MRT_SortingOption, MRT_TableInstance, MRT_TablePagination, MRT_TableState, MRT_ToggleDensePaddingButton, MRT_ToggleFiltersButton, MRT_ToggleGlobalFilterButton, MRT_ToggleRowActionMenuButton, MRT_ToolbarAlertBanner, MRT_ToolbarDropZone, MRT_ToolbarInternalButtons, MRT_TopToolbar, MaterialReactTableProps, MaterialReactTable as default };
947
+ export { MRT_AggregationFn, MRT_AggregationFns, MRT_AggregationOption, MRT_BottomToolbar, MRT_Cell, MRT_Column, MRT_ColumnDef, MRT_CopyButton, MRT_DefinedColumnDef, MRT_DensityState, MRT_DisplayColumnIds, MRT_EditActionButtons, MRT_FilterFn, MRT_FilterFns, MRT_FilterOption, MRT_FilterOptionMenu, MRT_FullScreenToggleButton, MRT_GlobalFilterTextField, MRT_Header, MRT_HeaderGroup, MRT_Icons, MRT_InternalFilterOption, MRT_Localization, MRT_Row, MRT_RowModel, MRT_ShowHideColumnsButton, MRT_SortingFn, MRT_SortingFns, MRT_SortingOption, MRT_TableInstance, MRT_TablePagination, MRT_TableState, MRT_ToggleDensePaddingButton, MRT_ToggleFiltersButton, MRT_ToggleGlobalFilterButton, MRT_ToggleRowActionMenuButton, MRT_ToolbarAlertBanner, MRT_ToolbarDropZone, MRT_ToolbarInternalButtons, MRT_TopToolbar, MaterialReactTableProps, MaterialReactTable as default };
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.7.4",
2
+ "version": "1.8.0",
3
3
  "license": "MIT",
4
4
  "name": "material-react-table",
5
5
  "description": "A fully featured Material UI V5 implementation of TanStack React Table V8, written from the ground up in TypeScript.",
@@ -34,7 +34,7 @@
34
34
  "size-limit": [
35
35
  {
36
36
  "path": "dist/cjs/index.js",
37
- "limit": "50 KB"
37
+ "limit": "54 KB"
38
38
  },
39
39
  {
40
40
  "path": "dist/esm/material-react-table.esm.js",