material-react-table 1.0.0-beta.0 → 1.0.0-beta.11
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 +20 -20
- package/dist/cjs/MaterialReactTable.d.ts +96 -19
- package/dist/cjs/_locales/en.d.ts +2 -0
- package/dist/cjs/_locales/es.d.ts +2 -0
- package/dist/cjs/body/MRT_EditRowModal.d.ts +0 -1
- package/dist/cjs/body/MRT_TableBody.d.ts +1 -2
- package/dist/cjs/body/MRT_TableBodyCellValue.d.ts +2 -2
- package/dist/cjs/buttons/MRT_ColumnPinningButtons.d.ts +0 -1
- package/dist/cjs/buttons/MRT_EditActionButtons.d.ts +0 -1
- package/dist/cjs/buttons/MRT_FullScreenToggleButton.d.ts +0 -1
- package/dist/cjs/buttons/MRT_ShowHideColumnsButton.d.ts +0 -1
- package/dist/cjs/buttons/MRT_ToggleDensePaddingButton.d.ts +0 -1
- package/dist/cjs/buttons/MRT_ToggleFiltersButton.d.ts +0 -1
- package/dist/cjs/buttons/MRT_ToggleGlobalFilterButton.d.ts +0 -1
- package/dist/cjs/column.utils.d.ts +12 -1
- package/dist/cjs/index.d.ts +4 -3
- package/dist/cjs/index.js +247 -194
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/inputs/MRT_EditCellTextField.d.ts +0 -1
- package/dist/cjs/inputs/MRT_GlobalFilterTextField.d.ts +0 -1
- package/dist/cjs/menus/MRT_FilterOptionMenu.d.ts +3 -4
- package/dist/cjs/menus/MRT_ShowHideColumnsMenu.d.ts +0 -1
- package/dist/cjs/table/MRT_Table.d.ts +1 -2
- package/dist/cjs/table/MRT_TableRoot.d.ts +250 -3
- package/dist/cjs/toolbar/MRT_TablePagination.d.ts +3 -4
- package/dist/cjs/toolbar/MRT_ToolbarAlertBanner.d.ts +1 -1
- package/dist/cjs/toolbar/MRT_ToolbarInternalButtons.d.ts +3 -4
- package/dist/cjs/toolbar/MRT_TopToolbar.d.ts +1 -0
- package/dist/en.cjs +90 -0
- package/dist/en.cjs.d.ts +2 -0
- package/dist/en.cjs.map +1 -0
- package/dist/en.esm.d.ts +2 -0
- package/dist/en.esm.js +86 -0
- package/dist/en.esm.js.map +1 -0
- package/dist/esm/MaterialReactTable.d.ts +96 -19
- package/dist/esm/_locales/en.d.ts +2 -0
- package/dist/esm/_locales/es.d.ts +2 -0
- package/dist/esm/body/MRT_EditRowModal.d.ts +0 -1
- package/dist/esm/body/MRT_TableBody.d.ts +1 -2
- package/dist/esm/body/MRT_TableBodyCellValue.d.ts +2 -2
- package/dist/esm/buttons/MRT_ColumnPinningButtons.d.ts +0 -1
- package/dist/esm/buttons/MRT_EditActionButtons.d.ts +0 -1
- package/dist/esm/buttons/MRT_FullScreenToggleButton.d.ts +0 -1
- package/dist/esm/buttons/MRT_ShowHideColumnsButton.d.ts +0 -1
- package/dist/esm/buttons/MRT_ToggleDensePaddingButton.d.ts +0 -1
- package/dist/esm/buttons/MRT_ToggleFiltersButton.d.ts +0 -1
- package/dist/esm/buttons/MRT_ToggleGlobalFilterButton.d.ts +0 -1
- package/dist/esm/column.utils.d.ts +12 -1
- package/dist/esm/index.d.ts +4 -3
- package/dist/esm/inputs/MRT_EditCellTextField.d.ts +0 -1
- package/dist/esm/inputs/MRT_GlobalFilterTextField.d.ts +0 -1
- package/dist/esm/material-react-table.esm.js +248 -197
- package/dist/esm/material-react-table.esm.js.map +1 -1
- package/dist/esm/menus/MRT_FilterOptionMenu.d.ts +3 -4
- package/dist/esm/menus/MRT_ShowHideColumnsMenu.d.ts +0 -1
- package/dist/esm/table/MRT_Table.d.ts +1 -2
- package/dist/esm/table/MRT_TableRoot.d.ts +250 -3
- package/dist/esm/toolbar/MRT_TablePagination.d.ts +3 -4
- package/dist/esm/toolbar/MRT_ToolbarAlertBanner.d.ts +1 -1
- package/dist/esm/toolbar/MRT_ToolbarInternalButtons.d.ts +3 -4
- package/dist/esm/toolbar/MRT_TopToolbar.d.ts +1 -0
- package/dist/index.d.ts +47 -41
- package/package.json +7 -6
- package/src/MaterialReactTable.tsx +100 -23
- package/src/_locales/de.ts +0 -0
- package/src/{localization.ts → _locales/en.ts} +4 -82
- package/src/_locales/es.ts +86 -0
- package/src/_locales/fr.ts +0 -0
- package/src/_locales/hi.ts +0 -0
- package/src/_locales/id.ts +0 -0
- package/src/_locales/ja.ts +0 -0
- package/src/_locales/nl.ts +0 -0
- package/src/_locales/pt.ts +0 -0
- package/src/_locales/ru.ts +0 -0
- package/src/_locales/uk.ts +0 -0
- package/src/_locales/vi.ts +0 -0
- package/src/_locales/zh.ts +0 -0
- package/src/body/MRT_TableBody.tsx +54 -30
- package/src/body/MRT_TableBodyCell.tsx +11 -58
- package/src/body/MRT_TableBodyCellValue.tsx +7 -2
- package/src/body/MRT_TableBodyRowGrabHandle.tsx +5 -8
- package/src/buttons/MRT_GrabHandleButton.tsx +2 -2
- package/src/buttons/MRT_ToggleGlobalFilterButton.tsx +7 -2
- package/src/column.utils.ts +72 -0
- package/src/footer/MRT_TableFooter.tsx +3 -2
- package/src/footer/MRT_TableFooterCell.tsx +5 -15
- package/src/head/MRT_TableHead.tsx +10 -2
- package/src/head/MRT_TableHeadCell.tsx +9 -50
- package/src/head/MRT_TableHeadCellFilterLabel.tsx +7 -7
- package/src/head/MRT_TableHeadCellGrabHandle.tsx +5 -12
- package/src/index.tsx +6 -3
- package/src/inputs/MRT_FilterTextField.tsx +13 -5
- package/src/inputs/MRT_GlobalFilterTextField.tsx +18 -5
- package/src/menus/MRT_FilterOptionMenu.tsx +19 -2
- package/src/table/MRT_Table.tsx +3 -4
- package/src/table/MRT_TableContainer.tsx +2 -11
- package/src/table/MRT_TablePaper.tsx +34 -20
- package/src/table/MRT_TableRoot.tsx +34 -11
- package/src/toolbar/MRT_BottomToolbar.tsx +9 -3
- package/src/toolbar/MRT_TablePagination.tsx +8 -5
- package/src/toolbar/MRT_ToolbarAlertBanner.tsx +7 -1
- package/src/toolbar/MRT_ToolbarInternalButtons.tsx +8 -4
- package/src/toolbar/MRT_TopToolbar.tsx +8 -1
- package/dist/cjs/localization.d.ts +0 -82
- package/dist/esm/localization.d.ts +0 -82
|
@@ -1,12 +1,94 @@
|
|
|
1
|
-
import { Dispatch,
|
|
1
|
+
import { Dispatch, MutableRefObject, ReactNode, SetStateAction } from 'react';
|
|
2
2
|
import type { AlertProps, ButtonProps, CheckboxProps, ChipProps, 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, VirtualItem } from 'react-virtual';
|
|
5
5
|
import { MRT_Icons } from './icons';
|
|
6
6
|
import { MRT_FilterFns } from './filterFns';
|
|
7
|
-
import { MRT_Localization } from './localization';
|
|
8
7
|
import { MRT_SortingFns } from './sortingFns';
|
|
9
8
|
declare type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
|
|
9
|
+
export interface MRT_Localization {
|
|
10
|
+
actions: string;
|
|
11
|
+
and: string;
|
|
12
|
+
cancel: string;
|
|
13
|
+
changeFilterMode: string;
|
|
14
|
+
changeSearchMode: string;
|
|
15
|
+
clearFilter: string;
|
|
16
|
+
clearSearch: string;
|
|
17
|
+
clearSort: string;
|
|
18
|
+
clickToCopy: string;
|
|
19
|
+
columnActions: string;
|
|
20
|
+
copiedToClipboard: string;
|
|
21
|
+
dropToGroupBy: string;
|
|
22
|
+
edit: string;
|
|
23
|
+
expand: string;
|
|
24
|
+
expandAll: string;
|
|
25
|
+
filterArrIncludes: string;
|
|
26
|
+
filterArrIncludesAll: string;
|
|
27
|
+
filterArrIncludesSome: string;
|
|
28
|
+
filterBetween: string;
|
|
29
|
+
filterBetweenInclusive: string;
|
|
30
|
+
filterByColumn: string;
|
|
31
|
+
filterContains: string;
|
|
32
|
+
filterEmpty: string;
|
|
33
|
+
filterEndsWith: string;
|
|
34
|
+
filterEquals: string;
|
|
35
|
+
filterEqualsString: string;
|
|
36
|
+
filterFuzzy: string;
|
|
37
|
+
filterGreaterThan: string;
|
|
38
|
+
filterGreaterThanOrEqualTo: string;
|
|
39
|
+
filterInNumberRange: string;
|
|
40
|
+
filterIncludesString: string;
|
|
41
|
+
filterIncludesStringSensitive: string;
|
|
42
|
+
filterLessThan: string;
|
|
43
|
+
filterLessThanOrEqualTo: string;
|
|
44
|
+
filterMode: string;
|
|
45
|
+
filterNotEmpty: string;
|
|
46
|
+
filterNotEquals: string;
|
|
47
|
+
filterStartsWith: string;
|
|
48
|
+
filterWeakEquals: string;
|
|
49
|
+
filteringByColumn: string;
|
|
50
|
+
grab: string;
|
|
51
|
+
groupByColumn: string;
|
|
52
|
+
groupedBy: string;
|
|
53
|
+
hideAll: string;
|
|
54
|
+
hideColumn: string;
|
|
55
|
+
max: string;
|
|
56
|
+
min: string;
|
|
57
|
+
move: string;
|
|
58
|
+
noRecordsToDisplay: string;
|
|
59
|
+
noResultsFound: string;
|
|
60
|
+
or: string;
|
|
61
|
+
pinToLeft: string;
|
|
62
|
+
pinToRight: string;
|
|
63
|
+
resetColumnSize: string;
|
|
64
|
+
resetOrder: string;
|
|
65
|
+
rowActions: string;
|
|
66
|
+
rowNumber: string;
|
|
67
|
+
rowNumbers: string;
|
|
68
|
+
save: string;
|
|
69
|
+
search: string;
|
|
70
|
+
select: string;
|
|
71
|
+
selectedCountOfRowCountRowsSelected: string;
|
|
72
|
+
showAll: string;
|
|
73
|
+
showAllColumns: string;
|
|
74
|
+
showHideColumns: string;
|
|
75
|
+
showHideFilters: string;
|
|
76
|
+
showHideSearch: string;
|
|
77
|
+
sortByColumnAsc: string;
|
|
78
|
+
sortByColumnDesc: string;
|
|
79
|
+
sortedByColumnAsc: string;
|
|
80
|
+
sortedByColumnDesc: string;
|
|
81
|
+
thenBy: string;
|
|
82
|
+
toggleDensity: string;
|
|
83
|
+
toggleFullScreen: string;
|
|
84
|
+
toggleSelectAll: string;
|
|
85
|
+
toggleSelectRow: string;
|
|
86
|
+
toggleVisibility: string;
|
|
87
|
+
ungroupByColumn: string;
|
|
88
|
+
unpin: string;
|
|
89
|
+
unpinAll: string;
|
|
90
|
+
unsorted: string;
|
|
91
|
+
}
|
|
10
92
|
export interface MRT_RowModel<TData extends Record<string, any> = {}> {
|
|
11
93
|
flatRows: MRT_Row<TData>[];
|
|
12
94
|
rows: MRT_Row<TData>[];
|
|
@@ -40,6 +122,7 @@ export declare type MRT_TableInstance<TData extends Record<string, any> = {}> =
|
|
|
40
122
|
filterInputRefs: MutableRefObject<Record<string, HTMLInputElement>>;
|
|
41
123
|
searchInputRef: MutableRefObject<HTMLInputElement>;
|
|
42
124
|
tableContainerRef: MutableRefObject<HTMLDivElement>;
|
|
125
|
+
tablePaperRef: MutableRefObject<HTMLDivElement>;
|
|
43
126
|
topToolbarRef: MutableRefObject<HTMLDivElement>;
|
|
44
127
|
};
|
|
45
128
|
setColumnFilterFns: Dispatch<SetStateAction<{
|
|
@@ -326,7 +409,7 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
326
409
|
muiExpandAllButtonProps?: IconButtonProps | (({ table }: {
|
|
327
410
|
table: MRT_TableInstance<TData>;
|
|
328
411
|
}) => IconButtonProps);
|
|
329
|
-
muiExpandButtonProps?: IconButtonProps | (({ table, }: {
|
|
412
|
+
muiExpandButtonProps?: IconButtonProps | (({ row, table, }: {
|
|
330
413
|
table: MRT_TableInstance<TData>;
|
|
331
414
|
row: MRT_Row<TData>;
|
|
332
415
|
}) => IconButtonProps);
|
|
@@ -362,9 +445,11 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
362
445
|
row: MRT_Row<TData>;
|
|
363
446
|
table: MRT_TableInstance<TData>;
|
|
364
447
|
}) => TableCellProps);
|
|
365
|
-
muiTableBodyCellSkeletonProps?: SkeletonProps | (({
|
|
366
|
-
table: MRT_TableInstance<TData>;
|
|
448
|
+
muiTableBodyCellSkeletonProps?: SkeletonProps | (({ cell, column, row, table, }: {
|
|
367
449
|
cell: MRT_Cell<TData>;
|
|
450
|
+
column: MRT_Column<TData>;
|
|
451
|
+
row: MRT_Row<TData>;
|
|
452
|
+
table: MRT_TableInstance<TData>;
|
|
368
453
|
}) => SkeletonProps);
|
|
369
454
|
muiTableBodyProps?: TableBodyProps | (({ table }: {
|
|
370
455
|
table: MRT_TableInstance<TData>;
|
|
@@ -437,13 +522,6 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
437
522
|
muiTopToolbarProps?: ToolbarProps | (({ table }: {
|
|
438
523
|
table: MRT_TableInstance<TData>;
|
|
439
524
|
}) => ToolbarProps);
|
|
440
|
-
onColumnDrop?: ({ event, draggedColumn, targetColumn, }: {
|
|
441
|
-
event: DragEvent<HTMLButtonElement>;
|
|
442
|
-
draggedColumn: MRT_Column<TData>;
|
|
443
|
-
targetColumn: MRT_Column<TData> | {
|
|
444
|
-
id: string;
|
|
445
|
-
} | null;
|
|
446
|
-
}) => void;
|
|
447
525
|
onDensityChange?: OnChangeFn<boolean>;
|
|
448
526
|
onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
|
|
449
527
|
onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
|
|
@@ -462,13 +540,6 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
462
540
|
onHoveredColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
|
|
463
541
|
onHoveredRowChange?: OnChangeFn<MRT_Row<TData> | null>;
|
|
464
542
|
onIsFullScreenChange?: OnChangeFn<boolean>;
|
|
465
|
-
onRowDrop?: ({ event, draggedRow, targetRow, }: {
|
|
466
|
-
event: DragEvent<HTMLButtonElement>;
|
|
467
|
-
draggedRow: MRT_Row<TData>;
|
|
468
|
-
targetRow: MRT_Row<TData> | {
|
|
469
|
-
id: string;
|
|
470
|
-
} | null;
|
|
471
|
-
}) => void;
|
|
472
543
|
onShowAlertBannerChange?: OnChangeFn<boolean>;
|
|
473
544
|
onShowFiltersChange?: OnChangeFn<boolean>;
|
|
474
545
|
onShowGlobalFilterChange?: OnChangeFn<boolean>;
|
|
@@ -478,6 +549,9 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
478
549
|
positionPagination?: 'bottom' | 'top' | 'both';
|
|
479
550
|
positionToolbarAlertBanner?: 'bottom' | 'top' | 'none';
|
|
480
551
|
positionToolbarDropZone?: 'bottom' | 'top' | 'none' | 'both';
|
|
552
|
+
renderBottomToolbar?: ReactNode | (({ table }: {
|
|
553
|
+
table: MRT_TableInstance<TData>;
|
|
554
|
+
}) => ReactNode);
|
|
481
555
|
renderBottomToolbarCustomActions?: ({ table, }: {
|
|
482
556
|
table: MRT_TableInstance<TData>;
|
|
483
557
|
}) => ReactNode;
|
|
@@ -514,6 +588,9 @@ export declare type MaterialReactTableProps<TData extends Record<string, any> =
|
|
|
514
588
|
renderToolbarInternalActions?: ({ table, }: {
|
|
515
589
|
table: MRT_TableInstance<TData>;
|
|
516
590
|
}) => ReactNode;
|
|
591
|
+
renderTopToolbar?: ReactNode | (({ table }: {
|
|
592
|
+
table: MRT_TableInstance<TData>;
|
|
593
|
+
}) => ReactNode);
|
|
517
594
|
renderTopToolbarCustomActions?: ({ table, }: {
|
|
518
595
|
table: MRT_TableInstance<TData>;
|
|
519
596
|
}) => ReactNode;
|
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
import { FC
|
|
1
|
+
import { FC } from 'react';
|
|
2
2
|
import type { MRT_TableInstance } from '..';
|
|
3
3
|
interface Props {
|
|
4
4
|
table: MRT_TableInstance;
|
|
5
|
-
tableContainerRef: RefObject<HTMLDivElement>;
|
|
6
5
|
}
|
|
7
6
|
export declare const MRT_TableBody: FC<Props>;
|
|
8
7
|
export {};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { MRT_Cell, MRT_TableInstance } from '..';
|
|
3
3
|
interface Props {
|
|
4
4
|
cell: MRT_Cell;
|
|
5
5
|
table: MRT_TableInstance;
|
|
6
6
|
}
|
|
7
|
-
export declare const MRT_TableBodyCellValue:
|
|
7
|
+
export declare const MRT_TableBodyCellValue: React.NamedExoticComponent<Props>;
|
|
8
8
|
export {};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ColumnOrderState, GroupingState } from '@tanstack/react-table';
|
|
2
|
-
import {
|
|
2
|
+
import { TableCellProps, Theme } from '@mui/material';
|
|
3
|
+
import { MaterialReactTableProps, MRT_Column, MRT_ColumnDef, MRT_DefinedColumnDef, MRT_DisplayColumnIds, MRT_FilterOption, MRT_Header, MRT_TableInstance } from '.';
|
|
3
4
|
import { MRT_FilterFns } from './filterFns';
|
|
4
5
|
import { MRT_SortingFns } from './sortingFns';
|
|
5
6
|
export declare const getColumnId: <TData extends Record<string, any> = {}>(columnDef: MRT_ColumnDef<TData>) => string;
|
|
@@ -92,3 +93,13 @@ export declare const getLeadingDisplayColumnIds: <TData extends Record<string, a
|
|
|
92
93
|
export declare const getTrailingDisplayColumnIds: <TData extends Record<string, any> = {}>(props: MaterialReactTableProps<TData>) => (string | false | undefined)[];
|
|
93
94
|
export declare const getDefaultColumnOrderIds: <TData extends Record<string, any> = {}>(props: MaterialReactTableProps<TData>) => string[];
|
|
94
95
|
export declare const getDefaultColumnFilterFn: <TData extends Record<string, any> = {}>(columnDef: MRT_ColumnDef<TData>) => MRT_FilterOption;
|
|
96
|
+
export declare const getIsLastLeftPinnedColumn: (table: MRT_TableInstance, column: MRT_Column) => boolean;
|
|
97
|
+
export declare const getIsFirstRightPinnedColumn: (column: MRT_Column) => boolean;
|
|
98
|
+
export declare const getTotalRight: (table: MRT_TableInstance, column: MRT_Column) => number;
|
|
99
|
+
export declare const getCommonCellStyles: ({ column, header, table, tableCellProps, theme, }: {
|
|
100
|
+
column: MRT_Column;
|
|
101
|
+
header?: MRT_Header<{}> | undefined;
|
|
102
|
+
table: MRT_TableInstance;
|
|
103
|
+
tableCellProps: TableCellProps;
|
|
104
|
+
theme: Theme;
|
|
105
|
+
}) => any;
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -2,13 +2,14 @@ import MaterialReactTable from './MaterialReactTable';
|
|
|
2
2
|
export default MaterialReactTable;
|
|
3
3
|
export * from './MaterialReactTable';
|
|
4
4
|
import type { MRT_Icons } from './icons';
|
|
5
|
-
|
|
6
|
-
export type { MRT_Localization, MRT_Icons };
|
|
5
|
+
export type { MRT_Icons };
|
|
7
6
|
import { MRT_CopyButton } from './buttons/MRT_CopyButton';
|
|
8
7
|
import { MRT_FullScreenToggleButton } from './buttons/MRT_FullScreenToggleButton';
|
|
9
8
|
import { MRT_GlobalFilterTextField } from './inputs/MRT_GlobalFilterTextField';
|
|
10
9
|
import { MRT_ShowHideColumnsButton } from './buttons/MRT_ShowHideColumnsButton';
|
|
10
|
+
import { MRT_TablePagination } from './toolbar/MRT_TablePagination';
|
|
11
11
|
import { MRT_ToggleDensePaddingButton } from './buttons/MRT_ToggleDensePaddingButton';
|
|
12
12
|
import { MRT_ToggleFiltersButton } from './buttons/MRT_ToggleFiltersButton';
|
|
13
13
|
import { MRT_ToggleGlobalFilterButton } from './buttons/MRT_ToggleGlobalFilterButton';
|
|
14
|
-
|
|
14
|
+
import { MRT_ToolbarInternalButtons } from './toolbar/MRT_ToolbarInternalButtons';
|
|
15
|
+
export { MRT_CopyButton, MRT_FullScreenToggleButton, MRT_GlobalFilterTextField, MRT_ShowHideColumnsButton, MRT_TablePagination, MRT_ToggleDensePaddingButton, MRT_ToggleFiltersButton, MRT_ToggleGlobalFilterButton, MRT_ToolbarInternalButtons, };
|