material-react-table 0.36.2 → 0.37.2
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.
- package/README.md +7 -3
- package/dist/cjs/MaterialReactTable.d.ts +34 -15
- package/dist/cjs/body/MRT_TableBodyCellValue.d.ts +8 -0
- package/dist/cjs/buttons/MRT_CopyButton.d.ts +5 -5
- package/dist/cjs/buttons/MRT_ToggleRowActionMenuButton.d.ts +2 -1
- package/dist/cjs/column.utils.d.ts +2 -1
- package/dist/cjs/index.d.ts +2 -1
- package/dist/cjs/index.js +172 -122
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/MaterialReactTable.d.ts +34 -15
- package/dist/esm/body/MRT_TableBodyCellValue.d.ts +8 -0
- package/dist/esm/buttons/MRT_CopyButton.d.ts +5 -5
- package/dist/esm/buttons/MRT_ToggleRowActionMenuButton.d.ts +2 -1
- package/dist/esm/column.utils.d.ts +2 -1
- package/dist/esm/index.d.ts +2 -1
- package/dist/esm/material-react-table.esm.js +172 -123
- package/dist/esm/material-react-table.esm.js.map +1 -1
- package/dist/index.d.ts +42 -16
- package/package.json +4 -4
- package/src/MaterialReactTable.tsx +49 -11
- package/src/body/MRT_EditRowModal.tsx +21 -19
- package/src/body/MRT_TableBodyCell.tsx +12 -26
- package/src/body/MRT_TableBodyCellValue.tsx +27 -0
- package/src/body/MRT_TableBodyRow.tsx +1 -1
- package/src/body/MRT_TableBodyRowGrabHandle.tsx +3 -2
- package/src/buttons/MRT_CopyButton.tsx +11 -7
- package/src/buttons/MRT_EditActionButtons.tsx +13 -4
- package/src/buttons/MRT_ToggleGlobalFilterButton.tsx +3 -16
- package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +9 -4
- package/src/column.utils.ts +15 -10
- package/src/head/MRT_TableHeadCell.tsx +3 -5
- package/src/index.tsx +2 -0
- package/src/inputs/MRT_EditCellTextField.tsx +16 -5
- package/src/inputs/MRT_FilterTextField.tsx +9 -6
- package/src/inputs/MRT_GlobalFilterTextField.tsx +7 -2
- package/src/menus/MRT_ColumnActionMenu.tsx +2 -12
- package/src/table/MRT_TableContainer.tsx +10 -10
- package/src/table/MRT_TableRoot.tsx +45 -27
- package/src/toolbar/MRT_BottomToolbar.tsx +9 -5
- package/src/toolbar/MRT_TopToolbar.tsx +8 -2
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Dispatch, DragEvent, ReactNode, SetStateAction } from 'react';
|
|
1
|
+
import { Dispatch, DragEvent, MutableRefObject, ReactNode, SetStateAction } from 'react';
|
|
2
2
|
import type { AlertProps, ButtonProps, CheckboxProps, IconButtonProps, LinearProgressProps, PaperProps, SkeletonProps, TableBodyProps, TableCellProps, TableContainerProps, TableFooterProps, TableHeadProps, TablePaginationProps, TableProps, TableRowProps, TextFieldProps, ToolbarProps } from '@mui/material';
|
|
3
3
|
import type { Cell, Column, ColumnDef, DeepKeys, FilterFn, Header, HeaderGroup, OnChangeFn, Row, SortingFn, Table, TableOptions, TableState } from '@tanstack/react-table';
|
|
4
4
|
import type { Options as VirtualizerOptions } from 'react-virtual';
|
|
@@ -32,9 +32,16 @@ export declare type MRT_TableInstance<TData extends Record<string, any> = {}> =
|
|
|
32
32
|
getState: () => MRT_TableState<TData>;
|
|
33
33
|
options: MaterialReactTableProps<TData> & {
|
|
34
34
|
icons: MRT_Icons;
|
|
35
|
-
tableId: string;
|
|
36
35
|
localization: MRT_Localization;
|
|
37
36
|
};
|
|
37
|
+
refs: {
|
|
38
|
+
bottomToolbarRef: MutableRefObject<HTMLDivElement>;
|
|
39
|
+
editInputRefs: MutableRefObject<Record<string, HTMLInputElement>>;
|
|
40
|
+
filterInputRefs: MutableRefObject<Record<string, HTMLInputElement>>;
|
|
41
|
+
searchInputRef: MutableRefObject<HTMLInputElement>;
|
|
42
|
+
tableContainerRef: MutableRefObject<HTMLDivElement>;
|
|
43
|
+
topToolbarRef: MutableRefObject<HTMLDivElement>;
|
|
44
|
+
};
|
|
38
45
|
setColumnFilterFns: Dispatch<SetStateAction<{
|
|
39
46
|
[key: string]: MRT_FilterOption;
|
|
40
47
|
}>>;
|
|
@@ -78,19 +85,22 @@ export declare type MRT_TableState<TData extends Record<string, any> = {}> = Tab
|
|
|
78
85
|
showSkeletons: boolean;
|
|
79
86
|
};
|
|
80
87
|
export declare type MRT_ColumnDef<TData extends Record<string, any> = {}> = Omit<ColumnDef<TData, unknown>, 'aggregatedCell' | 'cell' | 'columns' | 'filterFn' | 'footer' | 'header' | 'id' | 'sortingFn'> & {
|
|
81
|
-
AggregatedCell?: ({ cell, column, table, }: {
|
|
88
|
+
AggregatedCell?: ({ cell, column, row, table, }: {
|
|
82
89
|
cell: MRT_Cell<TData>;
|
|
83
90
|
column: MRT_Column<TData>;
|
|
91
|
+
row: MRT_Row<TData>;
|
|
84
92
|
table: MRT_TableInstance<TData>;
|
|
85
93
|
}) => ReactNode;
|
|
86
|
-
Cell?: ({ cell, column, table, }: {
|
|
94
|
+
Cell?: ({ cell, column, row, table, }: {
|
|
87
95
|
cell: MRT_Cell<TData>;
|
|
88
96
|
column: MRT_Column<TData>;
|
|
97
|
+
row: MRT_Row<TData>;
|
|
89
98
|
table: MRT_TableInstance<TData>;
|
|
90
99
|
}) => ReactNode;
|
|
91
|
-
Edit?: ({ cell, column, table, }: {
|
|
100
|
+
Edit?: ({ cell, column, row, table, }: {
|
|
92
101
|
cell: MRT_Cell<TData>;
|
|
93
102
|
column: MRT_Column<TData>;
|
|
103
|
+
row: MRT_Row<TData>;
|
|
94
104
|
table: MRT_TableInstance<TData>;
|
|
95
105
|
}) => ReactNode;
|
|
96
106
|
Filter?: ({ column, header, table, }: {
|
|
@@ -169,8 +179,10 @@ export declare type MRT_ColumnDef<TData extends Record<string, any> = {}> = Omit
|
|
|
169
179
|
table: MRT_TableInstance<TData>;
|
|
170
180
|
cell: MRT_Cell<TData>;
|
|
171
181
|
}) => ButtonProps);
|
|
172
|
-
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ cell, table, }: {
|
|
182
|
+
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ cell, column, row, table, }: {
|
|
173
183
|
cell: MRT_Cell<TData>;
|
|
184
|
+
column: MRT_Column<TData>;
|
|
185
|
+
row: MRT_Row<TData>;
|
|
174
186
|
table: MRT_TableInstance<TData>;
|
|
175
187
|
}) => TextFieldProps);
|
|
176
188
|
muiTableBodyCellProps?: TableCellProps | (({ cell, table, }: {
|
|
@@ -231,7 +243,7 @@ export declare type MRT_SortingOption = LiteralUnion<string & keyof typeof MRT_S
|
|
|
231
243
|
export declare type MRT_SortingFn<TData extends Record<string, any> = {}> = SortingFn<TData> | MRT_SortingOption;
|
|
232
244
|
export declare type MRT_FilterOption = LiteralUnion<string & keyof typeof MRT_FilterFns>;
|
|
233
245
|
export declare type MRT_FilterFn<TData extends Record<string, any> = {}> = FilterFn<TData> | MRT_FilterOption;
|
|
234
|
-
export declare type MRT_DisplayColumnIds = 'mrt-row-
|
|
246
|
+
export declare type MRT_DisplayColumnIds = 'mrt-row-actions' | 'mrt-row-drag' | 'mrt-row-expand' | 'mrt-row-numbers' | 'mrt-row-select';
|
|
235
247
|
/**
|
|
236
248
|
* `columns` and `data` props are the only required props, but there are over 150 other optional props.
|
|
237
249
|
*
|
|
@@ -301,17 +313,23 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
301
313
|
table: MRT_TableInstance<TData>;
|
|
302
314
|
row: MRT_Row<TData>;
|
|
303
315
|
}) => CheckboxProps);
|
|
304
|
-
muiTableBodyCellCopyButtonProps?: ButtonProps | (({
|
|
305
|
-
table: MRT_TableInstance<TData>;
|
|
316
|
+
muiTableBodyCellCopyButtonProps?: ButtonProps | (({ cell, column, row, table, }: {
|
|
306
317
|
cell: MRT_Cell<TData>;
|
|
318
|
+
column: MRT_Column<TData>;
|
|
319
|
+
row: MRT_Row<TData>;
|
|
320
|
+
table: MRT_TableInstance<TData>;
|
|
307
321
|
}) => ButtonProps);
|
|
308
|
-
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ cell, table, }: {
|
|
322
|
+
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ cell, column, row, table, }: {
|
|
309
323
|
cell: MRT_Cell<TData>;
|
|
324
|
+
column: MRT_Column<TData>;
|
|
325
|
+
row: MRT_Row<TData>;
|
|
310
326
|
table: MRT_TableInstance<TData>;
|
|
311
327
|
}) => TextFieldProps);
|
|
312
|
-
muiTableBodyCellProps?: TableCellProps | (({
|
|
313
|
-
table: MRT_TableInstance<TData>;
|
|
328
|
+
muiTableBodyCellProps?: TableCellProps | (({ cell, column, row, table, }: {
|
|
314
329
|
cell: MRT_Cell<TData>;
|
|
330
|
+
column: MRT_Column<TData>;
|
|
331
|
+
row: MRT_Row<TData>;
|
|
332
|
+
table: MRT_TableInstance<TData>;
|
|
315
333
|
}) => TableCellProps);
|
|
316
334
|
muiTableBodyCellSkeletonProps?: SkeletonProps | (({ table, cell, }: {
|
|
317
335
|
table: MRT_TableInstance<TData>;
|
|
@@ -398,7 +416,8 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
398
416
|
onDensityChange?: OnChangeFn<boolean>;
|
|
399
417
|
onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
|
|
400
418
|
onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
|
|
401
|
-
onEditingRowSave?: ({ row, table, values, }: {
|
|
419
|
+
onEditingRowSave?: ({ exitEditingMode, row, table, values, }: {
|
|
420
|
+
exitEditingMode: () => void;
|
|
402
421
|
row: MRT_Row<TData>;
|
|
403
422
|
table: MRT_TableInstance<TData>;
|
|
404
423
|
values: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
|
|
@@ -440,7 +459,8 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
440
459
|
row: MRT_Row<TData>;
|
|
441
460
|
table: MRT_TableInstance<TData>;
|
|
442
461
|
}) => ReactNode[];
|
|
443
|
-
renderRowActions?: ({ row, table, }: {
|
|
462
|
+
renderRowActions?: ({ cell, row, table, }: {
|
|
463
|
+
cell: MRT_Cell<TData>;
|
|
444
464
|
row: MRT_Row<TData>;
|
|
445
465
|
table: MRT_TableInstance<TData>;
|
|
446
466
|
}) => ReactNode;
|
|
@@ -454,7 +474,6 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
454
474
|
rowNumberMode?: 'original' | 'static';
|
|
455
475
|
selectAllMode?: 'all' | 'page';
|
|
456
476
|
state?: Partial<MRT_TableState<TData>>;
|
|
457
|
-
tableId?: string;
|
|
458
477
|
virtualizerProps?: Partial<VirtualizerOptions<HTMLDivElement>> | (({ table, }: {
|
|
459
478
|
table: MRT_TableInstance<TData>;
|
|
460
479
|
}) => Partial<VirtualizerOptions<HTMLDivElement>>);
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
2
|
import { MRT_Cell, MRT_TableInstance } from '..';
|
|
3
|
-
interface Props {
|
|
4
|
-
cell: MRT_Cell
|
|
3
|
+
interface Props<TData extends Record<string, any> = {}> {
|
|
4
|
+
cell: MRT_Cell<TData>;
|
|
5
5
|
children: ReactNode;
|
|
6
|
-
table: MRT_TableInstance
|
|
6
|
+
table: MRT_TableInstance<TData>;
|
|
7
7
|
}
|
|
8
|
-
export declare const MRT_CopyButton:
|
|
8
|
+
export declare const MRT_CopyButton: <TData extends Record<string, any> = {}>({ cell, children, table, }: Props<TData>) => JSX.Element;
|
|
9
9
|
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ColumnOrderState } from '@tanstack/react-table';
|
|
1
|
+
import { ColumnOrderState, GroupingState } from '@tanstack/react-table';
|
|
2
2
|
import { MaterialReactTableProps, MRT_Column, MRT_ColumnDef, MRT_DefinedColumnDef, MRT_DisplayColumnIds, MRT_FilterOption } from '.';
|
|
3
3
|
import { MRT_FilterFns } from './filterFns';
|
|
4
4
|
import { MRT_SortingFns } from './sortingFns';
|
|
@@ -81,6 +81,7 @@ export declare const prepareColumns: <TData extends Record<string, any> = {}>(co
|
|
|
81
81
|
basic: import("@tanstack/table-core").SortingFn<any>;
|
|
82
82
|
} & Record<string, import("@tanstack/table-core").SortingFn<any>>) => MRT_DefinedColumnDef<TData>[];
|
|
83
83
|
export declare const reorderColumn: <TData extends Record<string, any> = {}>(draggedColumn: MRT_Column<TData>, targetColumn: MRT_Column<TData>, columnOrder: ColumnOrderState) => ColumnOrderState;
|
|
84
|
+
export declare const showExpandColumn: <TData extends Record<string, any> = {}>(props: MaterialReactTableProps<TData>, grouping?: GroupingState) => boolean;
|
|
84
85
|
export declare const getLeadingDisplayColumnIds: <TData extends Record<string, any> = {}>(props: MaterialReactTableProps<TData>) => MRT_DisplayColumnIds[];
|
|
85
86
|
export declare const getTrailingDisplayColumnIds: <TData extends Record<string, any> = {}>(props: MaterialReactTableProps<TData>) => (string | false | undefined)[];
|
|
86
87
|
export declare const getDefaultColumnOrderIds: <TData extends Record<string, any> = {}>(props: MaterialReactTableProps<TData>) => string[];
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -4,10 +4,11 @@ export * from './MaterialReactTable';
|
|
|
4
4
|
import type { MRT_Icons } from './icons';
|
|
5
5
|
import type { MRT_Localization } from './localization';
|
|
6
6
|
export type { MRT_Localization, MRT_Icons };
|
|
7
|
+
import { MRT_CopyButton } from './buttons/MRT_CopyButton';
|
|
7
8
|
import { MRT_FullScreenToggleButton } from './buttons/MRT_FullScreenToggleButton';
|
|
8
9
|
import { MRT_GlobalFilterTextField } from './inputs/MRT_GlobalFilterTextField';
|
|
9
10
|
import { MRT_ShowHideColumnsButton } from './buttons/MRT_ShowHideColumnsButton';
|
|
10
11
|
import { MRT_ToggleDensePaddingButton } from './buttons/MRT_ToggleDensePaddingButton';
|
|
11
12
|
import { MRT_ToggleFiltersButton } from './buttons/MRT_ToggleFiltersButton';
|
|
12
13
|
import { MRT_ToggleGlobalFilterButton } from './buttons/MRT_ToggleGlobalFilterButton';
|
|
13
|
-
export { MRT_FullScreenToggleButton, MRT_GlobalFilterTextField, MRT_ShowHideColumnsButton, MRT_ToggleDensePaddingButton, MRT_ToggleFiltersButton, MRT_ToggleGlobalFilterButton, };
|
|
14
|
+
export { MRT_FullScreenToggleButton, MRT_GlobalFilterTextField, MRT_ShowHideColumnsButton, MRT_ToggleDensePaddingButton, MRT_ToggleFiltersButton, MRT_ToggleGlobalFilterButton, MRT_CopyButton, };
|