material-react-table 2.0.0-alpha.1 → 2.0.0-alpha.3

package/dist/esm/types/types.d.ts

@@ -1,4 +1,7 @@
 import { type Dispatch, type MutableRefObject, type ReactNode, type RefObject, type SetStateAction } from 'react';
+import { type AggregationFn, type Cell, type Column, type ColumnDef, type ColumnFiltersState, type ColumnOrderState, type ColumnPinningState, type ColumnSizingInfoState, type ColumnSizingState, type DeepKeys, type ExpandedState, type FilterFn, type GroupingState, type Header, type HeaderGroup, type OnChangeFn, type PaginationState, type Row, type RowSelectionState, type SortingFn, type SortingState, type Table, type TableOptions, type TableState, type Updater, type VisibilityState } from '@tanstack/react-table';
+import { type VirtualItem, type Virtualizer, type VirtualizerOptions } from '@tanstack/react-virtual';
+import { type AutocompleteProps } from '@mui/material';
 import { type AlertProps } from '@mui/material/Alert';
 import { type ButtonProps } from '@mui/material/Button';
 import { type CheckboxProps } from '@mui/material/Checkbox';
@@ -10,22 +13,21 @@ import { type PaperProps } from '@mui/material/Paper';
 import { type RadioProps } from '@mui/material/Radio';
 import { type SkeletonProps } from '@mui/material/Skeleton';
 import { type SliderProps } from '@mui/material/Slider';
+import { type TableProps } from '@mui/material/Table';
 import { type TableBodyProps } from '@mui/material/TableBody';
 import { type TableCellProps } from '@mui/material/TableCell';
 import { type TableContainerProps } from '@mui/material/TableContainer';
 import { type TableFooterProps } from '@mui/material/TableFooter';
 import { type TableHeadProps } from '@mui/material/TableHead';
 import { type TablePaginationProps } from '@mui/material/TablePagination';
-import { type TableProps } from '@mui/material/Table';
 import { type TableRowProps } from '@mui/material/TableRow';
 import { type TextFieldProps } from '@mui/material/TextField';
 import { type ToolbarProps } from '@mui/material/Toolbar';
-import { type AggregationFn, type Cell, type Column, type ColumnDef, type ColumnFiltersState, type ColumnOrderState, type ColumnPinningState, type ColumnSizingInfoState, type ColumnSizingState, type DeepKeys, type ExpandedState, type FilterFn, type GroupingState, type Header, type HeaderGroup, type OnChangeFn, type PaginationState, type Row, type RowSelectionState, type SortingFn, type SortingState, type Table, type TableOptions, type TableState, type Updater, type VisibilityState } from '@tanstack/react-table';
-import { type VirtualizerOptions, type Virtualizer, type VirtualItem } from '@tanstack/react-virtual';
+import { type DatePickerProps } from '@mui/x-date-pickers';
 import { type MRT_AggregationFns } from './aggregationFns';
 import { type MRT_FilterFns } from './filterFns';
-import { type MRT_SortingFns } from './sortingFns';
 import { type MRT_Icons } from './icons';
+import { type MRT_SortingFns } from './sortingFns';
 export type { MRT_Icons };
 export type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
 export type Prettify<T> = {
@@ -71,10 +73,9 @@ export interface MRT_Localization {
     filterFuzzy: string;
     filterGreaterThan: string;
     filterGreaterThanOrEqualTo: string;
+    filterInNumberRange: string;
     filterIncludesString: string;
     filterIncludesStringSensitive: string;
-    filteringByColumn: string;
-    filterInNumberRange: string;
     filterLessThan: string;
     filterLessThanOrEqualTo: string;
     filterMode: string;
@@ -82,6 +83,7 @@ export interface MRT_Localization {
     filterNotEquals: string;
     filterStartsWith: string;
     filterWeakEquals: string;
+    filteringByColumn: string;
     goToFirstPage: string;
     goToLastPage: string;
     goToNextPage: string;
@@ -164,26 +166,26 @@ export type MRT_TableInstance<TData extends Record<string, any>> = Omit<Table<TD
         filterInputRefs: MutableRefObject<Record<string, HTMLInputElement>>;
         searchInputRef: MutableRefObject<HTMLInputElement>;
         tableContainerRef: MutableRefObject<HTMLDivElement>;
+        tableFooterRef: MutableRefObject<HTMLTableSectionElement>;
         tableHeadCellRefs: MutableRefObject<Record<string, HTMLTableCellElement>>;
+        tableHeadRef: MutableRefObject<HTMLTableSectionElement>;
         tablePaperRef: MutableRefObject<HTMLDivElement>;
         topToolbarRef: MutableRefObject<HTMLDivElement>;
-        tableHeadRef: MutableRefObject<HTMLTableSectionElement>;
-        tableFooterRef: MutableRefObject<HTMLTableSectionElement>;
     };
-    setCreatingRow: Dispatch<SetStateAction<MRT_Row<TData> | null | true>>;
     setColumnFilterFns: Dispatch<SetStateAction<MRT_ColumnFilterFnsState>>;
+    setCreatingRow: Dispatch<SetStateAction<MRT_Row<TData> | null | true>>;
     setDensity: Dispatch<SetStateAction<MRT_DensityState>>;
     setDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
     setDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
     setEditingCell: Dispatch<SetStateAction<MRT_Cell<TData> | null>>;
     setEditingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
     setGlobalFilterFn: Dispatch<SetStateAction<MRT_FilterOption>>;
-    setHoveredColumn: Dispatch<SetStateAction<MRT_Column<TData> | {
+    setHoveredColumn: Dispatch<SetStateAction<{
         id: string;
-    } | null>>;
-    setHoveredRow: Dispatch<SetStateAction<MRT_Row<TData> | {
+    } | MRT_Column<TData> | null>>;
+    setHoveredRow: Dispatch<SetStateAction<{
         id: string;
-    } | null>>;
+    } | MRT_Row<TData> | null>>;
     setIsFullScreen: Dispatch<SetStateAction<boolean>>;
     setShowAlertBanner: Dispatch<SetStateAction<boolean>>;
     setShowColumnFilters: Dispatch<SetStateAction<boolean>>;
@@ -191,8 +193,8 @@ export type MRT_TableInstance<TData extends Record<string, any>> = Omit<Table<TD
     setShowToolbarDropZone: Dispatch<SetStateAction<boolean>>;
 };
 export type MRT_DefinedTableOptions<TData extends Record<string, any>> = MRT_TableOptions<TData> & {
-    localization: MRT_Localization;
     icons: MRT_Icons;
+    localization: MRT_Localization;
 };
 export type MRT_TableState<TData extends Record<string, any>> = TableState & {
     columnFilterFns: MRT_ColumnFilterFnsState;
@@ -203,12 +205,12 @@ export type MRT_TableState<TData extends Record<string, any>> = TableState & {
     editingCell: MRT_Cell<TData> | null;
     editingRow: MRT_Row<TData> | null;
     globalFilterFn: MRT_FilterOption;
-    hoveredColumn: MRT_Column<TData> | {
+    hoveredColumn: {
         id: string;
-    } | null;
-    hoveredRow: MRT_Row<TData> | {
+    } | MRT_Column<TData> | null;
+    hoveredRow: {
         id: string;
-    } | null;
+    } | MRT_Row<TData> | null;
     isFullScreen: boolean;
     isLoading: boolean;
     isSaving: boolean;
@@ -228,8 +230,8 @@ export type MRT_ColumnDef<TData extends Record<string, any>> = Omit<ColumnDef<TD
     }) => ReactNode;
     Cell?: (props: {
         cell: MRT_Cell<TData>;
-        renderedCellValue: number | string | ReactNode;
         column: MRT_Column<TData>;
+        renderedCellValue: ReactNode | number | string;
         row: MRT_Row<TData>;
         rowRef?: RefObject<HTMLTableRowElement>;
         table: MRT_TableInstance<TData>;
@@ -246,22 +248,22 @@ export type MRT_ColumnDef<TData extends Record<string, any>> = Omit<ColumnDef<TD
         rangeFilterIndex?: number;
         table: MRT_TableInstance<TData>;
     }) => ReactNode;
-    Footer?: ReactNode | ((props: {
+    Footer?: ((props: {
         column: MRT_Column<TData>;
         footer: MRT_Header<TData>;
         table: MRT_TableInstance<TData>;
-    }) => ReactNode);
+    }) => ReactNode) | ReactNode;
     GroupedCell?: (props: {
         cell: MRT_Cell<TData>;
         column: MRT_Column<TData>;
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
     }) => ReactNode;
-    Header?: ReactNode | ((props: {
+    Header?: ((props: {
         column: MRT_Column<TData>;
         header: MRT_Header<TData>;
         table: MRT_TableInstance<TData>;
-    }) => ReactNode);
+    }) => ReactNode) | ReactNode;
     PlaceholderCell?: (props: {
         cell: MRT_Cell<TData>;
         column: MRT_Column<TData>;
@@ -283,8 +285,8 @@ export type MRT_ColumnDef<TData extends Record<string, any>> = Omit<ColumnDef<TD
      * @example accessorKey: 'username' //simple
      * @example accessorKey: 'name.firstName' //deep key dot notation
      */
-    accessorKey?: (string & {}) | DeepKeys<TData>;
-    aggregationFn?: MRT_AggregationFn<TData> | Array<MRT_AggregationFn<TData>>;
+    accessorKey?: DeepKeys<TData> | (string & {});
+    aggregationFn?: Array<MRT_AggregationFn<TData>> | MRT_AggregationFn<TData>;
     /**
      * Specify what type of column this is. Either `data`, `display`, or `group`. Defaults to `data`.
      * Leave this blank if you are just creating a normal data column.
@@ -296,24 +298,24 @@ export type MRT_ColumnDef<TData extends Record<string, any>> = Omit<ColumnDef<TD
     columnDefType?: 'data' | 'display' | 'group';
     columnFilterModeOptions?: Array<LiteralUnion<string & MRT_FilterOption>> | null;
     columns?: MRT_ColumnDef<TData>[];
-    editSelectOptions?: (string | {
+    editSelectOptions?: ({
         text: string;
         value: any;
-    })[];
-    editVariant?: 'text' | 'select';
+    } | string)[];
+    editVariant?: 'select' | 'text';
     enableClickToCopy?: boolean;
     enableColumnActions?: boolean;
     enableColumnDragging?: boolean;
     enableColumnFilterModes?: boolean;
     enableColumnOrdering?: boolean;
-    enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
+    enableEditing?: ((row: MRT_Row<TData>) => boolean) | boolean;
     enableFilterMatchHighlighting?: boolean;
     filterFn?: MRT_FilterFn<TData>;
-    filterSelectOptions?: (string | {
+    filterSelectOptions?: ({
         text: string;
         value: any;
-    })[];
-    filterVariant?: 'checkbox' | 'multi-select' | 'range' | 'range-slider' | 'select' | 'text';
+    } | string)[];
+    filterVariant?: 'autocomplete' | 'checkbox' | 'date' | 'date-range' | 'multi-select' | 'range' | 'range-slider' | 'select' | 'text';
     /**
      * footer must be a string. If you want custom JSX to render the footer, you can also specify a `Footer` option. (Capital F)
      */
@@ -332,53 +334,62 @@ export type MRT_ColumnDef<TData extends Record<string, any>> = Omit<ColumnDef<TD
      * @default gets set to the same value as `accessorKey` by default
      */
     id?: LiteralUnion<string & keyof TData>;
-    muiCopyButtonProps?: ButtonProps | ((props: {
-        cell: MRT_Cell<TData>;
+    muiColumnActionsButtonProps?: ((props: {
+        column: MRT_Column<TData>;
+        table: MRT_TableInstance<TData>;
+    }) => IconButtonProps) | IconButtonProps;
+    muiColumnDragHandleProps?: ((props: {
         column: MRT_Column<TData>;
-        row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => ButtonProps);
-    muiEditTextFieldProps?: TextFieldProps | ((props: {
+    }) => IconButtonProps) | IconButtonProps;
+    muiCopyButtonProps?: ((props: {
         cell: MRT_Cell<TData>;
         column: MRT_Column<TData>;
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => TextFieldProps);
-    muiTableBodyCellProps?: TableCellProps | ((props: {
+    }) => ButtonProps) | ButtonProps;
+    muiEditTextFieldProps?: ((props: {
         cell: MRT_Cell<TData>;
         column: MRT_Column<TData>;
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => TableCellProps);
-    muiTableFooterCellProps?: TableCellProps | ((props: {
-        table: MRT_TableInstance<TData>;
+    }) => TextFieldProps) | TextFieldProps;
+    muiFilterAutocompleteProps?: ((props: {
         column: MRT_Column<TData>;
-    }) => TableCellProps);
-    muiColumnActionsButtonProps?: IconButtonProps | ((props: {
         table: MRT_TableInstance<TData>;
+    }) => AutocompleteProps<any, any, any, any>) | AutocompleteProps<any, any, any, any>;
+    muiFilterCheckboxProps?: ((props: {
         column: MRT_Column<TData>;
-    }) => IconButtonProps);
-    muiColumnDragHandleProps?: IconButtonProps | ((props: {
         table: MRT_TableInstance<TData>;
+    }) => CheckboxProps) | CheckboxProps;
+    muiFilterDatePickerProps?: ((props: {
         column: MRT_Column<TData>;
-    }) => IconButtonProps);
-    muiFilterCheckboxProps?: CheckboxProps | ((props: {
-        column: MRT_Column<TData>;
+        rangeFilterIndex?: number;
         table: MRT_TableInstance<TData>;
-    }) => CheckboxProps);
-    muiFilterTextFieldProps?: TextFieldProps | ((props: {
+    }) => DatePickerProps<any>) | DatePickerProps<any>;
+    muiFilterSliderProps?: ((props: {
+        column: MRT_Column<TData>;
         table: MRT_TableInstance<TData>;
+    }) => SliderProps) | SliderProps;
+    muiFilterTextFieldProps?: ((props: {
         column: MRT_Column<TData>;
         rangeFilterIndex?: number;
-    }) => TextFieldProps);
-    muiFilterSliderProps?: SliderProps | ((props: {
         table: MRT_TableInstance<TData>;
+    }) => TextFieldProps) | TextFieldProps;
+    muiTableBodyCellProps?: ((props: {
+        cell: MRT_Cell<TData>;
+        column: MRT_Column<TData>;
+        row: MRT_Row<TData>;
+        table: MRT_TableInstance<TData>;
+    }) => TableCellProps) | TableCellProps;
+    muiTableFooterCellProps?: ((props: {
         column: MRT_Column<TData>;
-    }) => SliderProps);
-    muiTableHeadCellProps?: TableCellProps | ((props: {
         table: MRT_TableInstance<TData>;
+    }) => TableCellProps) | TableCellProps;
+    muiTableHeadCellProps?: ((props: {
         column: MRT_Column<TData>;
-    }) => TableCellProps);
+        table: MRT_TableInstance<TData>;
+    }) => TableCellProps) | TableCellProps;
     renderColumnActionsMenuItems?: (props: {
         closeMenu: () => void;
         column: MRT_Column<TData>;
@@ -393,12 +404,12 @@ export type MRT_ColumnDef<TData extends Record<string, any>> = Omit<ColumnDef<TD
     }) => ReactNode[];
     sortingFn?: MRT_SortingFn<TData>;
 };
-export type MRT_DefinedColumnDef<TData extends Record<string, any>> = Omit<MRT_ColumnDef<TData>, 'id' | 'defaultDisplayColumn'> & {
+export type MRT_DefinedColumnDef<TData extends Record<string, any>> = Omit<MRT_ColumnDef<TData>, 'defaultDisplayColumn' | 'id'> & {
+    _filterFn: MRT_FilterOption;
     defaultDisplayColumn: Partial<MRT_ColumnDef<TData>>;
     id: string;
-    _filterFn: MRT_FilterOption;
 };
-export type MRT_Column<TData extends Record<string, any>> = Omit<Column<TData, unknown>, 'header' | 'footer' | 'columns' | 'columnDef' | 'filterFn'> & {
+export type MRT_Column<TData extends Record<string, any>> = Omit<Column<TData, unknown>, 'columnDef' | 'columns' | 'filterFn' | 'footer' | 'header'> & {
     columnDef: MRT_DefinedColumnDef<TData>;
     columns?: MRT_Column<TData>[];
     filterFn?: MRT_FilterFn<TData>;
@@ -411,11 +422,11 @@ export type MRT_Header<TData extends Record<string, any>> = Omit<Header<TData, u
 export type MRT_HeaderGroup<TData extends Record<string, any>> = Omit<HeaderGroup<TData>, 'headers'> & {
     headers: MRT_Header<TData>[];
 };
-export type MRT_Row<TData extends Record<string, any>> = Omit<Row<TData>, 'getVisibleCells' | 'getAllCells' | 'subRows' | '_valuesCache'> & {
+export type MRT_Row<TData extends Record<string, any>> = Omit<Row<TData>, '_valuesCache' | 'getAllCells' | 'getVisibleCells' | 'subRows'> & {
+    _valuesCache: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
     getAllCells: () => MRT_Cell<TData>[];
     getVisibleCells: () => MRT_Cell<TData>[];
     subRows?: MRT_Row<TData>[];
-    _valuesCache: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
 };
 export type MRT_Cell<TData extends Record<string, any>> = Omit<Cell<TData, unknown>, 'column' | 'row'> & {
     column: MRT_Column<TData>;
@@ -424,7 +435,7 @@ export type MRT_Cell<TData extends Record<string, any>> = Omit<Cell<TData, unkno
 export type MRT_AggregationOption = string & keyof typeof MRT_AggregationFns;
 export type MRT_AggregationFn<TData extends Record<string, any>> = AggregationFn<TData> | MRT_AggregationOption;
 export type MRT_SortingOption = LiteralUnion<string & keyof typeof MRT_SortingFns>;
-export type MRT_SortingFn<TData extends Record<string, any>> = SortingFn<TData> | MRT_SortingOption;
+export type MRT_SortingFn<TData extends Record<string, any>> = MRT_SortingOption | SortingFn<TData>;
 export type MRT_FilterOption = LiteralUnion<string & keyof typeof MRT_FilterFns>;
 export type MRT_FilterFn<TData extends Record<string, any>> = FilterFn<TData> | MRT_FilterOption;
 export type MRT_InternalFilterOption = {
@@ -433,7 +444,7 @@ export type MRT_InternalFilterOption = {
     option: string;
     symbol: string;
 };
-export type MRT_DisplayColumnIds = 'mrt-row-actions' | 'mrt-row-drag' | 'mrt-row-expand' | 'mrt-row-numbers' | 'mrt-row-select' | 'mrt-row-pin';
+export type MRT_DisplayColumnIds = 'mrt-row-actions' | 'mrt-row-drag' | 'mrt-row-expand' | 'mrt-row-numbers' | 'mrt-row-pin' | 'mrt-row-select';
 /**
  * `columns` and `data` props are the only required props, but there are over 170 other optional props.
  *
@@ -444,7 +455,12 @@ export type MRT_DisplayColumnIds = 'mrt-row-actions' | 'mrt-row-drag' | 'mrt-row
  * @link https://www.material-react-table.com/docs/api/props
  */
 export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<TableOptions<TData>>, 'columns' | 'data' | 'defaultColumn' | 'enableRowSelection' | 'expandRowsFn' | 'getRowId' | 'globalFilterFn' | 'initialState' | 'onStateChange' | 'state'> & {
+    columnFilterDisplayMode?: 'custom' | 'popover' | 'subheader';
     columnFilterModeOptions?: Array<LiteralUnion<string & MRT_FilterOption>> | null;
+    columnVirtualizerInstanceRef?: MutableRefObject<Virtualizer<HTMLDivElement, HTMLTableCellElement> | null>;
+    columnVirtualizerOptions?: ((props: {
+        table: MRT_TableInstance<TData>;
+    }) => Partial<VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>>) | Partial<VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>>;
     /**
      * The columns to display in the table. `accessorKey`s or `accessorFn`s must match keys in the `data` prop.
      *
@@ -456,10 +472,7 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
      * @link https://www.material-react-table.com/docs/api/column-options
      */
     columns: MRT_ColumnDef<TData>[];
-    columnVirtualizerInstanceRef?: MutableRefObject<Virtualizer<HTMLDivElement, HTMLTableCellElement> | null>;
-    columnVirtualizerOptions?: Partial<VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>> | ((props: {
-        table: MRT_TableInstance<TData>;
-    }) => Partial<VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>>);
+    createDisplayMode?: 'custom' | 'modal' | 'row';
     /**
      * Pass your data as an array of objects. Objects can theoretically be any shape, but it's best to keep them consistent.
      *
@@ -478,12 +491,7 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
     displayColumnDefOptions?: Partial<{
         [key in MRT_DisplayColumnIds]: Partial<MRT_ColumnDef<TData>>;
     }>;
-    createDisplayMode?: 'modal' | 'row' | 'custom';
-    editDisplayMode?: 'modal' | 'row' | 'cell' | 'table' | 'custom';
-    columnFilterDisplayMode?: 'subheader' | 'popover' | 'custom';
-    paginationDisplayMode?: 'default' | 'pages' | 'custom';
-    selectDisplayMode?: 'checkbox' | 'radio' | 'switch';
-    rowPinningDisplayMode?: 'sticky' | 'top' | 'bottom' | 'top-and-bottom' | 'select-sticky' | 'select-top' | 'select-bottom';
+    editDisplayMode?: 'cell' | 'custom' | 'modal' | 'row' | 'table';
     enableBottomToolbar?: boolean;
     enableClickToCopy?: boolean;
     enableColumnActions?: boolean;
@@ -492,7 +500,7 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
     enableColumnOrdering?: boolean;
     enableColumnVirtualization?: boolean;
     enableDensityToggle?: boolean;
-    enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
+    enableEditing?: ((row: MRT_Row<TData>) => boolean) | boolean;
     enableExpandAll?: boolean;
     enableFacetedValues?: boolean;
     enableFilterMatchHighlighting?: boolean;
@@ -504,7 +512,7 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
     enableRowDragging?: boolean;
     enableRowNumbers?: boolean;
     enableRowOrdering?: boolean;
-    enableRowSelection?: boolean | ((row: MRT_Row<TData>) => boolean);
+    enableRowSelection?: ((row: MRT_Row<TData>) => boolean) | boolean;
     enableRowVirtualization?: boolean;
     enableSelectAll?: boolean;
     enableStickyFooter?: boolean;
@@ -522,7 +530,7 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
     /**
      * Changes which kind of CSS layout is used to render the table. `semantic` uses default semantic HTML elements, while `grid` adds CSS grid and flexbox styles
      */
-    layoutMode?: 'semantic' | 'grid';
+    layoutMode?: 'grid' | 'semantic';
     /**
      * Pass in either a locale imported from `material-react-table/locales/*` or a custom locale object.
      *
@@ -537,143 +545,155 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
      * @link https://www.material-react-table.com/docs/guides/memoize-components
      */
     memoMode?: 'cells' | 'rows' | 'table-body';
-    muiBottomToolbarProps?: ToolbarProps | ((props: {
+    muiBottomToolbarProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => ToolbarProps);
-    muiExpandAllButtonProps?: IconButtonProps | ((props: {
+    }) => ToolbarProps) | ToolbarProps;
+    muiColumnActionsButtonProps?: ((props: {
+        column: MRT_Column<TData>;
         table: MRT_TableInstance<TData>;
-    }) => IconButtonProps);
-    muiExpandButtonProps?: IconButtonProps | ((props: {
+    }) => IconButtonProps) | IconButtonProps;
+    muiColumnDragHandleProps?: ((props: {
+        column: MRT_Column<TData>;
         table: MRT_TableInstance<TData>;
+    }) => IconButtonProps) | IconButtonProps;
+    muiCopyButtonProps?: ((props: {
+        cell: MRT_Cell<TData>;
+        column: MRT_Column<TData>;
         row: MRT_Row<TData>;
-    }) => IconButtonProps);
-    muiLinearProgressProps?: LinearProgressProps | ((props: {
-        isTopToolbar: boolean;
         table: MRT_TableInstance<TData>;
-    }) => LinearProgressProps);
-    muiSearchTextFieldProps?: TextFieldProps | ((props: {
-        table: MRT_TableInstance<TData>;
-    }) => TextFieldProps);
-    muiSelectAllCheckboxProps?: CheckboxProps | ((props: {
-        table: MRT_TableInstance<TData>;
-    }) => CheckboxProps);
-    muiSelectCheckboxProps?: (CheckboxProps | RadioProps) | ((props: {
+    }) => ButtonProps) | ButtonProps;
+    muiCreateRowModalProps?: ((props: {
+        row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
+    }) => DialogProps) | DialogProps;
+    muiDetailPanelProps?: ((props: {
         row: MRT_Row<TData>;
-    }) => CheckboxProps | RadioProps);
-    muiCopyButtonProps?: ButtonProps | ((props: {
-        cell: MRT_Cell<TData>;
-        column: MRT_Column<TData>;
+        table: MRT_TableInstance<TData>;
+    }) => TableCellProps) | TableCellProps;
+    muiEditRowModalProps?: ((props: {
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => ButtonProps);
-    muiEditTextFieldProps?: TextFieldProps | ((props: {
+    }) => DialogProps) | DialogProps;
+    muiEditTextFieldProps?: ((props: {
         cell: MRT_Cell<TData>;
         column: MRT_Column<TData>;
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => TextFieldProps);
-    muiTableBodyCellProps?: TableCellProps | ((props: {
-        cell: MRT_Cell<TData>;
-        column: MRT_Column<TData>;
+    }) => TextFieldProps) | TextFieldProps;
+    muiExpandAllButtonProps?: ((props: {
+        table: MRT_TableInstance<TData>;
+    }) => IconButtonProps) | IconButtonProps;
+    muiExpandButtonProps?: ((props: {
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => TableCellProps);
-    muiSkeletonProps?: SkeletonProps | ((props: {
-        cell: MRT_Cell<TData>;
+    }) => IconButtonProps) | IconButtonProps;
+    muiFilterAutocompleteProps?: ((props: {
         column: MRT_Column<TData>;
-        row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => SkeletonProps);
-    muiTableBodyProps?: TableBodyProps | ((props: {
+    }) => AutocompleteProps<any, any, any, any>) | AutocompleteProps<any, any, any, any>;
+    muiFilterCheckboxProps?: ((props: {
+        column: MRT_Column<TData>;
         table: MRT_TableInstance<TData>;
-    }) => TableBodyProps);
-    muiRowDragHandleProps?: IconButtonProps | ((props: {
+    }) => CheckboxProps) | CheckboxProps;
+    muiFilterDatePickerProps?: ((props: {
+        column: MRT_Column<TData>;
+        rangeFilterIndex?: number;
         table: MRT_TableInstance<TData>;
-        row: MRT_Row<TData>;
-    }) => IconButtonProps);
-    muiTableBodyRowProps?: TableRowProps | ((props: {
-        isDetailPanel?: boolean;
-        row: MRT_Row<TData>;
-        staticRowIndex: number;
+    }) => DatePickerProps<any>) | DatePickerProps<any>;
+    muiFilterSliderProps?: ((props: {
+        column: MRT_Column<TData>;
         table: MRT_TableInstance<TData>;
-    }) => TableRowProps);
-    muiTableContainerProps?: TableContainerProps | ((props: {
+    }) => SliderProps) | SliderProps;
+    muiFilterTextFieldProps?: ((props: {
+        column: MRT_Column<TData>;
+        rangeFilterIndex?: number;
         table: MRT_TableInstance<TData>;
-    }) => TableContainerProps);
-    muiDetailPanelProps?: TableCellProps | ((props: {
+    }) => TextFieldProps) | TextFieldProps;
+    muiLinearProgressProps?: ((props: {
+        isTopToolbar: boolean;
         table: MRT_TableInstance<TData>;
+    }) => LinearProgressProps) | LinearProgressProps;
+    muiRowDragHandleProps?: ((props: {
         row: MRT_Row<TData>;
-    }) => TableCellProps);
-    muiTableFooterCellProps?: TableCellProps | ((props: {
         table: MRT_TableInstance<TData>;
-        column: MRT_Column<TData>;
-    }) => TableCellProps);
-    muiTableFooterProps?: TableFooterProps | ((props: {
+    }) => IconButtonProps) | IconButtonProps;
+    muiSearchTextFieldProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => TableFooterProps);
-    muiTableFooterRowProps?: TableRowProps | ((props: {
+    }) => TextFieldProps) | TextFieldProps;
+    muiSelectAllCheckboxProps?: ((props: {
         table: MRT_TableInstance<TData>;
-        footerGroup: MRT_HeaderGroup<TData>;
-    }) => TableRowProps);
-    muiColumnActionsButtonProps?: IconButtonProps | ((props: {
+    }) => CheckboxProps) | CheckboxProps;
+    muiSelectCheckboxProps?: ((props: {
+        row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
+    }) => CheckboxProps | RadioProps) | (CheckboxProps | RadioProps);
+    muiSkeletonProps?: ((props: {
+        cell: MRT_Cell<TData>;
         column: MRT_Column<TData>;
-    }) => IconButtonProps);
-    muiColumnDragHandleProps?: IconButtonProps | ((props: {
+        row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
+    }) => SkeletonProps) | SkeletonProps;
+    muiTableBodyCellProps?: ((props: {
+        cell: MRT_Cell<TData>;
         column: MRT_Column<TData>;
-    }) => IconButtonProps);
-    muiFilterCheckboxProps?: CheckboxProps | ((props: {
-        column: MRT_Column<TData>;
+        row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => CheckboxProps);
-    muiFilterTextFieldProps?: TextFieldProps | ((props: {
+    }) => TableCellProps) | TableCellProps;
+    muiTableBodyProps?: ((props: {
         table: MRT_TableInstance<TData>;
-        column: MRT_Column<TData>;
-        rangeFilterIndex?: number;
-    }) => TextFieldProps);
-    muiFilterSliderProps?: SliderProps | ((props: {
+    }) => TableBodyProps) | TableBodyProps;
+    muiTableBodyRowProps?: ((props: {
+        isDetailPanel?: boolean;
+        row: MRT_Row<TData>;
+        staticRowIndex: number;
+        table: MRT_TableInstance<TData>;
+    }) => TableRowProps) | TableRowProps;
+    muiTableContainerProps?: ((props: {
         table: MRT_TableInstance<TData>;
+    }) => TableContainerProps) | TableContainerProps;
+    muiTableFooterCellProps?: ((props: {
         column: MRT_Column<TData>;
-    }) => SliderProps);
-    muiCreateRowModalProps?: DialogProps | ((props: {
-        row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
-    }) => DialogProps);
-    muiEditRowModalProps?: DialogProps | ((props: {
-        row: MRT_Row<TData>;
+    }) => TableCellProps) | TableCellProps;
+    muiTableFooterProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => DialogProps);
-    muiTableHeadCellProps?: TableCellProps | ((props: {
+    }) => TableFooterProps) | TableFooterProps;
+    muiTableFooterRowProps?: ((props: {
+        footerGroup: MRT_HeaderGroup<TData>;
         table: MRT_TableInstance<TData>;
+    }) => TableRowProps) | TableRowProps;
+    muiTableHeadCellProps?: ((props: {
         column: MRT_Column<TData>;
-    }) => TableCellProps);
-    muiTableHeadProps?: TableHeadProps | ((props: {
         table: MRT_TableInstance<TData>;
-    }) => TableHeadProps);
-    muiTableHeadRowProps?: TableRowProps | ((props: {
+    }) => TableCellProps) | TableCellProps;
+    muiTableHeadProps?: ((props: {
         table: MRT_TableInstance<TData>;
+    }) => TableHeadProps) | TableHeadProps;
+    muiTableHeadRowProps?: ((props: {
         headerGroup: MRT_HeaderGroup<TData>;
-    }) => TableRowProps);
-    muiTablePaginationProps?: Partial<Omit<TablePaginationProps, 'rowsPerPage'>> | ((props: {
         table: MRT_TableInstance<TData>;
-    }) => Partial<Omit<TablePaginationProps, 'rowsPerPage'>>);
-    muiTablePaperProps?: PaperProps | ((props: {
+    }) => TableRowProps) | TableRowProps;
+    muiTablePaginationProps?: ((props: {
+        table: MRT_TableInstance<TData>;
+    }) => Partial<Omit<TablePaginationProps, 'rowsPerPage'>>) | Partial<Omit<TablePaginationProps, 'rowsPerPage'>>;
+    muiTablePaperProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => PaperProps);
-    muiTableProps?: TableProps | ((props: {
+    }) => PaperProps) | PaperProps;
+    muiTableProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => TableProps);
-    muiToolbarAlertBannerChipProps?: ChipProps | ((props: {
+    }) => TableProps) | TableProps;
+    muiToolbarAlertBannerChipProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => ChipProps);
-    muiToolbarAlertBannerProps?: AlertProps | ((props: {
+    }) => ChipProps) | ChipProps;
+    muiToolbarAlertBannerProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => AlertProps);
-    muiTopToolbarProps?: ToolbarProps | ((props: {
+    }) => AlertProps) | AlertProps;
+    muiTopToolbarProps?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => ToolbarProps);
+    }) => ToolbarProps) | ToolbarProps;
+    onColumnFilterFnsChange?: OnChangeFn<{
+        [key: string]: MRT_FilterOption;
+    }>;
     onCreatingRowCancel?: (props: {
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
@@ -685,9 +705,6 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
         table: MRT_TableInstance<TData>;
         values: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
     }) => void;
-    onColumnFilterFnsChange?: OnChangeFn<{
-        [key: string]: MRT_FilterOption;
-    }>;
     onDensityChange?: OnChangeFn<MRT_DensityState>;
     onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
     onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
@@ -704,42 +721,33 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
         values: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
     }) => Promise<void> | void;
     onGlobalFilterFnChange?: OnChangeFn<MRT_FilterOption>;
-    onHoveredColumnChange?: OnChangeFn<MRT_Column<TData> | {
+    onHoveredColumnChange?: OnChangeFn<{
         id: string;
-    } | null>;
-    onHoveredRowChange?: OnChangeFn<MRT_Row<TData> | {
+    } | MRT_Column<TData> | null>;
+    onHoveredRowChange?: OnChangeFn<{
         id: string;
-    } | null>;
+    } | MRT_Row<TData> | null>;
     onIsFullScreenChange?: OnChangeFn<boolean>;
     onShowAlertBannerChange?: OnChangeFn<boolean>;
     onShowColumnFiltersChange?: OnChangeFn<boolean>;
     onShowGlobalFilterChange?: OnChangeFn<boolean>;
     onShowToolbarDropZoneChange?: OnChangeFn<boolean>;
+    paginationDisplayMode?: 'custom' | 'default' | 'pages';
     positionActionsColumn?: 'first' | 'last';
     positionExpandColumn?: 'first' | 'last';
-    positionGlobalFilter?: 'left' | 'right' | 'none';
-    positionPagination?: 'bottom' | 'top' | 'both' | 'none';
-    positionToolbarAlertBanner?: 'bottom' | 'top' | 'none';
-    positionToolbarDropZone?: 'bottom' | 'top' | 'none' | 'both';
-    renderBottomToolbar?: ReactNode | ((props: {
+    positionGlobalFilter?: 'left' | 'none' | 'right';
+    positionPagination?: 'both' | 'bottom' | 'none' | 'top';
+    positionToolbarAlertBanner?: 'bottom' | 'none' | 'top';
+    positionToolbarDropZone?: 'both' | 'bottom' | 'none' | 'top';
+    renderBottomToolbar?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => ReactNode);
+    }) => ReactNode) | ReactNode;
     renderBottomToolbarCustomActions?: (props: {
         table: MRT_TableInstance<TData>;
     }) => ReactNode;
-    renderCreateRowModalContent?: (props: {
-        internalEditComponents: ReactNode[];
-        row: MRT_Row<TData>;
-        table: MRT_TableInstance<TData>;
-    }) => ReactNode;
-    renderEditRowModalContent?: (props: {
-        internalEditComponents: ReactNode[];
-        row: MRT_Row<TData>;
-        table: MRT_TableInstance<TData>;
-    }) => ReactNode;
     renderColumnActionsMenuItems?: (props: {
-        column: MRT_Column<TData>;
         closeMenu: () => void;
+        column: MRT_Column<TData>;
         internalColumnMenuItems: ReactNode[];
         table: MRT_TableInstance<TData>;
     }) => ReactNode[];
@@ -749,18 +757,28 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
         onSelectFilterMode: (filterMode: MRT_FilterOption) => void;
         table: MRT_TableInstance<TData>;
     }) => ReactNode[];
+    renderCreateRowModalContent?: (props: {
+        internalEditComponents: ReactNode[];
+        row: MRT_Row<TData>;
+        table: MRT_TableInstance<TData>;
+    }) => ReactNode;
     renderDetailPanel?: (props: {
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
     }) => ReactNode;
+    renderEditRowModalContent?: (props: {
+        internalEditComponents: ReactNode[];
+        row: MRT_Row<TData>;
+        table: MRT_TableInstance<TData>;
+    }) => ReactNode;
+    renderEmptyRowsFallback?: (props: {
+        table: MRT_TableInstance<TData>;
+    }) => ReactNode;
     renderGlobalFilterModeMenuItems?: (props: {
         internalFilterOptions: MRT_InternalFilterOption[];
         onSelectFilterMode: (filterMode: MRT_FilterOption) => void;
         table: MRT_TableInstance<TData>;
     }) => ReactNode[];
-    renderEmptyRowsFallback?: (props: {
-        table: MRT_TableInstance<TData>;
-    }) => ReactNode;
     renderRowActionMenuItems?: (props: {
         closeMenu: () => void;
         row: MRT_Row<TData>;
@@ -774,19 +792,21 @@ export type MRT_TableOptions<TData extends Record<string, any>> = Omit<Partial<T
     renderToolbarInternalActions?: (props: {
         table: MRT_TableInstance<TData>;
     }) => ReactNode;
-    renderTopToolbar?: ReactNode | ((props: {
+    renderTopToolbar?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => ReactNode);
+    }) => ReactNode) | ReactNode;
     renderTopToolbarCustomActions?: (props: {
         table: MRT_TableInstance<TData>;
     }) => ReactNode;
     rowCount?: number;
     rowNumberMode?: 'original' | 'static';
+    rowPinningDisplayMode?: 'bottom' | 'select-bottom' | 'select-sticky' | 'select-top' | 'sticky' | 'top' | 'top-and-bottom';
     rowVirtualizerInstanceRef?: MutableRefObject<Virtualizer<HTMLDivElement, HTMLTableRowElement> | null>;
-    rowVirtualizerOptions?: Partial<VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>> | ((props: {
+    rowVirtualizerOptions?: ((props: {
         table: MRT_TableInstance<TData>;
-    }) => Partial<VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>>);
+    }) => Partial<VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>>) | Partial<VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>>;
     selectAllMode?: 'all' | 'page';
+    selectDisplayMode?: 'checkbox' | 'radio' | 'switch';
     /**
      * Manage state externally any way you want, then pass it back into MRT.
      */