material-react-table 1.11.5 → 1.12.0-beta.1

package/src/MaterialReactTable.tsx

@@ -1,994 +1,16 @@
-import {
-  Dispatch,
-  MutableRefObject,
-  ReactNode,
-  SetStateAction,
-  useMemo,
-} from 'react';
-import type { AlertProps } from '@mui/material/Alert';
-import type { ButtonProps } from '@mui/material/Button';
-import type { CheckboxProps } from '@mui/material/Checkbox';
-import type { ChipProps } from '@mui/material/Chip';
-import type { IconButtonProps } from '@mui/material/IconButton';
-import type { LinearProgressProps } from '@mui/material/LinearProgress';
-import type { PaperProps } from '@mui/material/Paper';
-import type { RadioProps } from '@mui/material/Radio';
-import type { SkeletonProps } from '@mui/material/Skeleton';
-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 { TableRowProps } from '@mui/material/TableRow';
-import type { TextFieldProps } from '@mui/material/TextField';
-import type { ToolbarProps } from '@mui/material/Toolbar';
-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,
-  Updater,
-  VisibilityState,
-} from '@tanstack/react-table';
-import type {
-  VirtualizerOptions,
-  Virtualizer,
-  VirtualItem,
-} from '@tanstack/react-virtual';
+import { useMemo } from 'react';
 import { MRT_AggregationFns } from './aggregationFns';
-import { MRT_DefaultColumn, MRT_DefaultDisplayColumn } from './column.utils';
 import { MRT_FilterFns } from './filterFns';
-import { MRT_Default_Icons, MRT_Icons } from './icons';
 import { MRT_SortingFns } from './sortingFns';
-import { MRT_TableRoot } from './table/MRT_TableRoot';
+import { MRT_DefaultColumn, MRT_DefaultDisplayColumn } from './column.utils';
+import { MRT_Default_Icons } from './icons';
 import { MRT_Localization_EN } from './_locales/en';
+import { MRT_TableRoot } from './table/MRT_TableRoot';
+import { type MaterialReactTableProps } from './types';
 
 export { MRT_AggregationFns, MRT_FilterFns, MRT_SortingFns };
 
-/**
- * Most of this file is just TypeScript types
- */
-
-type Prettify<T> = { [K in keyof T]: T[K] } & {};
-
-type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
-
-export type MRT_DensityState = 'comfortable' | 'compact' | 'spacious';
-
-export type MRT_FilterFnsState = Record<string, MRT_FilterOption>;
-
-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,
-  Updater as MRT_Updater,
-  VirtualItem as MRT_VirtualItem,
-  Virtualizer as MRT_Virtualizer,
-  VirtualizerOptions as MRT_VirtualizerOptions,
-  VisibilityState as MRT_VisibilityState,
-};
-
-export interface MRT_Localization {
-  actions: string;
-  and: string;
-  cancel: string;
-  changeFilterMode: string;
-  changeSearchMode: string;
-  clearFilter: string;
-  clearSearch: string;
-  clearSort: string;
-  clickToCopy: string;
-  collapse: string;
-  collapseAll: string;
-  columnActions: string;
-  copiedToClipboard: string;
-  dropToGroupBy: string;
-  edit: string;
-  expand: string;
-  expandAll: string;
-  filterArrIncludes: string;
-  filterArrIncludesAll: string;
-  filterArrIncludesSome: string;
-  filterBetween: string;
-  filterBetweenInclusive: string;
-  filterByColumn: string;
-  filterContains: string;
-  filterEmpty: string;
-  filterEndsWith: string;
-  filterEquals: string;
-  filterEqualsString: string;
-  filterFuzzy: string;
-  filterGreaterThan: string;
-  filterGreaterThanOrEqualTo: string;
-  filterInNumberRange: string;
-  filterIncludesString: string;
-  filterIncludesStringSensitive: string;
-  filterLessThan: string;
-  filterLessThanOrEqualTo: string;
-  filterMode: string;
-  filterNotEmpty: string;
-  filterNotEquals: string;
-  filterStartsWith: string;
-  filterWeakEquals: string;
-  filteringByColumn: string;
-  goToFirstPage: string;
-  goToLastPage: string;
-  goToNextPage: string;
-  goToPreviousPage: string;
-  grab: string;
-  groupByColumn: string;
-  groupedBy: string;
-  hideAll: string;
-  hideColumn: string;
-  max: string;
-  min: string;
-  move: string;
-  noRecordsToDisplay: string;
-  noResultsFound: string;
-  of: string;
-  or: string;
-  pinToLeft: string;
-  pinToRight: string;
-  resetColumnSize: string;
-  resetOrder: string;
-  rowActions: string;
-  rowNumber: string;
-  rowNumbers: string;
-  rowsPerPage: string;
-  save: string;
-  search: string;
-  select: string;
-  selectedCountOfRowCountRowsSelected: string;
-  showAll: string;
-  showAllColumns: string;
-  showHideColumns: string;
-  showHideFilters: string;
-  showHideSearch: string;
-  sortByColumnAsc: string;
-  sortByColumnDesc: string;
-  sortedByColumnAsc: string;
-  sortedByColumnDesc: string;
-  thenBy: string;
-  toggleDensity: string;
-  toggleFullScreen: string;
-  toggleSelectAll: string;
-  toggleSelectRow: string;
-  toggleVisibility: string;
-  ungroupByColumn: string;
-  unpin: string;
-  unpinAll: string;
-  unsorted: string;
-}
-
-export interface MRT_RowModel<TData extends Record<string, any> = {}> {
-  flatRows: MRT_Row<TData>[];
-  rows: MRT_Row<TData>[];
-  rowsById: { [key: string]: MRT_Row<TData> };
-}
-
-export type MRT_TableInstance<TData extends Record<string, any> = {}> =
-  Prettify<
-    Omit<
-      Table<TData>,
-      | 'getAllColumns'
-      | 'getAllFlatColumns'
-      | 'getAllLeafColumns'
-      | 'getCenterLeafColumns'
-      | 'getColumn'
-      | 'getExpandedRowModel'
-      | 'getFlatHeaders'
-      | 'getLeftLeafColumns'
-      | 'getPaginationRowModel'
-      | 'getPreFilteredRowModel'
-      | 'getPrePaginationRowModel'
-      | 'getRightLeafColumns'
-      | 'getRowModel'
-      | 'getSelectedRowModel'
-      | 'getState'
-      | 'options'
-    > & {
-      getAllColumns: () => MRT_Column<TData>[];
-      getAllFlatColumns: () => MRT_Column<TData>[];
-      getAllLeafColumns: () => MRT_Column<TData>[];
-      getCenterLeafColumns: () => MRT_Column<TData>[];
-      getColumn: (columnId: string) => MRT_Column<TData>;
-      getExpandedRowModel: () => MRT_RowModel<TData>;
-      getFlatHeaders: () => MRT_Header<TData>[];
-      getLeftLeafColumns: () => MRT_Column<TData>[];
-      getPaginationRowModel: () => MRT_RowModel<TData>;
-      getPreFilteredRowModel: () => MRT_RowModel<TData>;
-      getPrePaginationRowModel: () => MRT_RowModel<TData>;
-      getRightLeafColumns: () => MRT_Column<TData>[];
-      getRowModel: () => MRT_RowModel<TData>;
-      getSelectedRowModel: () => MRT_RowModel<TData>;
-      getState: () => MRT_TableState<TData>;
-      options: MaterialReactTableProps<TData> & {
-        icons: MRT_Icons;
-        localization: MRT_Localization;
-      };
-      refs: {
-        bottomToolbarRef: MutableRefObject<HTMLDivElement>;
-        editInputRefs: MutableRefObject<Record<string, HTMLInputElement>>;
-        filterInputRefs: MutableRefObject<Record<string, HTMLInputElement>>;
-        searchInputRef: MutableRefObject<HTMLInputElement>;
-        tableContainerRef: MutableRefObject<HTMLDivElement>;
-        tableHeadCellRefs: MutableRefObject<
-          Record<string, HTMLTableCellElement>
-        >;
-        tablePaperRef: MutableRefObject<HTMLDivElement>;
-        topToolbarRef: MutableRefObject<HTMLDivElement>;
-      };
-      setColumnFilterFns: Dispatch<SetStateAction<MRT_FilterFnsState>>;
-      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> | { id: string } | null>
-      >;
-      setHoveredRow: Dispatch<
-        SetStateAction<MRT_Row<TData> | { id: string } | null>
-      >;
-      setIsFullScreen: Dispatch<SetStateAction<boolean>>;
-      setShowAlertBanner: Dispatch<SetStateAction<boolean>>;
-      setShowColumnFilters: Dispatch<SetStateAction<boolean>>;
-      setShowGlobalFilter: Dispatch<SetStateAction<boolean>>;
-      setShowToolbarDropZone: Dispatch<SetStateAction<boolean>>;
-    }
-  >;
-
-export type MRT_TableState<TData extends Record<string, any> = {}> = Prettify<
-  TableState & {
-    columnFilterFns: MRT_FilterFnsState;
-    density: MRT_DensityState;
-    draggingColumn: MRT_Column<TData> | null;
-    draggingRow: MRT_Row<TData> | null;
-    editingCell: MRT_Cell<TData> | null;
-    editingRow: MRT_Row<TData> | null;
-    globalFilterFn: MRT_FilterOption;
-    hoveredColumn: MRT_Column<TData> | { id: string } | null;
-    hoveredRow: MRT_Row<TData> | { id: string } | null;
-    isFullScreen: boolean;
-    isLoading: boolean;
-    showAlertBanner: boolean;
-    showColumnFilters: boolean;
-    showGlobalFilter: boolean;
-    showProgressBars: boolean;
-    showSkeletons: boolean;
-    showToolbarDropZone: boolean;
-  }
->;
-
-export type MRT_ColumnDef<TData extends Record<string, any> = {}> =
-  // Prettify<
-  Omit<
-    ColumnDef<TData, unknown>,
-    | 'accessorKey'
-    | 'aggregatedCell'
-    | 'aggregationFn'
-    | 'cell'
-    | 'columns'
-    | 'filterFn'
-    | 'footer'
-    | 'header'
-    | 'id'
-    | 'sortingFn'
-  > & {
-    AggregatedCell?: (props: {
-      cell: MRT_Cell<TData>;
-      column: MRT_Column<TData>;
-      row: MRT_Row<TData>;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode;
-    Cell?: (props: {
-      cell: MRT_Cell<TData>;
-      renderedCellValue: number | string | ReactNode;
-      column: MRT_Column<TData>;
-      row: MRT_Row<TData>;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode;
-    Edit?: (props: {
-      cell: MRT_Cell<TData>;
-      column: MRT_Column<TData>;
-      row: MRT_Row<TData>;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode;
-    Filter?: (props: {
-      column: MRT_Column<TData>;
-      header: MRT_Header<TData>;
-      rangeFilterIndex?: number;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode;
-    Footer?:
-      | ReactNode
-      | ((props: {
-          column: MRT_Column<TData>;
-          footer: MRT_Header<TData>;
-          table: MRT_TableInstance<TData>;
-        }) => ReactNode);
-    GroupedCell?: (props: {
-      cell: MRT_Cell<TData>;
-      column: MRT_Column<TData>;
-      row: MRT_Row<TData>;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode;
-    Header?:
-      | ReactNode
-      | ((props: {
-          column: MRT_Column<TData>;
-          header: MRT_Header<TData>;
-          table: MRT_TableInstance<TData>;
-        }) => ReactNode);
-    PlaceholderCell?: (props: {
-      cell: MRT_Cell<TData>;
-      column: MRT_Column<TData>;
-      row: MRT_Row<TData>;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode;
-    /**
-     * Either an `accessorKey` or a combination of an `accessorFn` and `id` are required for a data column definition.
-     * Specify a function here to point to the correct property in the data object.
-     *
-     * @example accessorFn: (row) => row.username
-     */
-    accessorFn?: (originalRow: TData) => any;
-    /**
-     * Either an `accessorKey` or a combination of an `accessorFn` and `id` are required for a data column definition.
-     * Specify which key in the row this column should use to access the correct data.
-     * Also supports Deep Key Dot Notation.
-     *
-     * @example accessorKey: 'username' //simple
-     * @example accessorKey: 'name.firstName' //deep key dot notation
-     */
-    accessorKey?: DeepKeys<TData>;
-    aggregationFn?: MRT_AggregationFn<TData> | Array<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.
-     *
-     * @default 'data'
-     *
-     * @example columnDefType: 'display'
-     */
-    columnDefType?: 'data' | 'display' | 'group';
-    columnFilterModeOptions?: Array<
-      LiteralUnion<string & MRT_FilterOption>
-    > | null;
-    columns?: MRT_ColumnDef<TData>[];
-    editSelectOptions?: (string | { text: string; value: any })[];
-    editVariant?: 'text' | 'select';
-    enableClickToCopy?: boolean;
-    enableColumnActions?: boolean;
-    enableColumnDragging?: boolean;
-    enableColumnFilterModes?: boolean;
-    enableColumnOrdering?: boolean;
-    enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
-    enableFilterMatchHighlighting?: boolean;
-    filterFn?: MRT_FilterFn<TData>;
-    filterSelectOptions?: (string | { text: string; value: any })[];
-    filterVariant?: 'text' | 'select' | 'multi-select' | 'range' | 'checkbox';
-    /**
-     * footer must be a string. If you want custom JSX to render the footer, you can also specify a `Footer` option. (Capital F)
-     */
-    footer?: string;
-    /**
-     * header must be a string. If you want custom JSX to render the header, you can also specify a `Header` option. (Capital H)
-     */
-    header: string;
-    /**
-     * Either an `accessorKey` or a combination of an `accessorFn` and `id` are required for a data column definition.
-     *
-     * If you have also specified an `accessorFn`, MRT still needs to have a valid `id` to be able to identify the column uniquely.
-     *
-     * `id` defaults to the `accessorKey` or `header` if not specified.
-     *
-     * @default gets set to the same value as `accessorKey` by default
-     */
-    id?: LiteralUnion<string & keyof TData>;
-    muiTableBodyCellCopyButtonProps?:
-      | ButtonProps
-      | ((props: {
-          cell: MRT_Cell<TData>;
-          column: MRT_Column<TData>;
-          row: MRT_Row<TData>;
-          table: MRT_TableInstance<TData>;
-        }) => ButtonProps);
-    muiTableBodyCellEditTextFieldProps?:
-      | TextFieldProps
-      | ((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>;
-          row: MRT_Row<TData>;
-          table: MRT_TableInstance<TData>;
-        }) => TableCellProps);
-    muiTableFooterCellProps?:
-      | TableCellProps
-      | ((props: {
-          table: MRT_TableInstance<TData>;
-          column: MRT_Column<TData>;
-        }) => TableCellProps);
-    muiTableHeadCellColumnActionsButtonProps?:
-      | IconButtonProps
-      | ((props: {
-          table: MRT_TableInstance<TData>;
-          column: MRT_Column<TData>;
-        }) => IconButtonProps);
-    muiTableHeadCellDragHandleProps?:
-      | IconButtonProps
-      | ((props: {
-          table: MRT_TableInstance<TData>;
-          column: MRT_Column<TData>;
-        }) => IconButtonProps);
-    muiTableHeadCellFilterCheckboxProps?:
-      | CheckboxProps
-      | ((props: {
-          column: MRT_Column<TData>;
-          table: MRT_TableInstance<TData>;
-        }) => CheckboxProps);
-    muiTableHeadCellFilterTextFieldProps?:
-      | TextFieldProps
-      | ((props: {
-          table: MRT_TableInstance<TData>;
-          column: MRT_Column<TData>;
-          rangeFilterIndex?: number;
-        }) => TextFieldProps);
-    muiTableHeadCellProps?:
-      | TableCellProps
-      | ((props: {
-          table: MRT_TableInstance<TData>;
-          column: MRT_Column<TData>;
-        }) => TableCellProps);
-    renderColumnActionsMenuItems?: (props: {
-      closeMenu: () => void;
-      column: MRT_Column<TData>;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode[];
-    renderColumnFilterModeMenuItems?: (props: {
-      column: MRT_Column<TData>;
-      internalFilterOptions: MRT_InternalFilterOption[];
-      onSelectFilterMode: (filterMode: MRT_FilterOption) => void;
-      table: MRT_TableInstance<TData>;
-    }) => ReactNode[];
-    sortingFn?: MRT_SortingFn<TData>;
-  };
-// >
-
-export type MRT_DefinedColumnDef<TData extends Record<string, any> = {}> =
-  // Prettify<
-  Omit<MRT_ColumnDef<TData>, 'id' | 'defaultDisplayColumn'> & {
-    defaultDisplayColumn: Partial<MRT_ColumnDef<TData>>;
-    id: string;
-    _filterFn: MRT_FilterOption;
-  };
-// >
-
-export type MRT_Column<TData extends Record<string, any> = {}> =
-  // Prettify<
-  Omit<
-    Column<TData, unknown>,
-    'header' | 'footer' | 'columns' | 'columnDef' | 'filterFn'
-  > & {
-    columnDef: MRT_DefinedColumnDef<TData>;
-    columns?: MRT_Column<TData>[];
-    filterFn?: MRT_FilterFn<TData>;
-    footer: string;
-    header: string;
-  };
-// >;
-
-export type MRT_Header<TData extends Record<string, any> = {}> = Prettify<
-  Omit<Header<TData, unknown>, 'column'> & {
-    column: MRT_Column<TData>;
-  }
->;
-
-export type MRT_HeaderGroup<TData extends Record<string, any> = {}> = Prettify<
-  Omit<HeaderGroup<TData>, 'headers'> & {
-    headers: MRT_Header<TData>[];
-  }
->;
-
-export type MRT_Row<TData extends Record<string, any> = {}> = Prettify<
-  Omit<
-    Row<TData>,
-    'getVisibleCells' | 'getAllCells' | 'subRows' | '_valuesCache'
-  > & {
-    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> = {}> = Prettify<
-  Omit<Cell<TData, unknown>, 'column' | 'row'> & {
-    column: MRT_Column<TData>;
-    row: MRT_Row<TData>;
-  }
->;
-
-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_FilterOption = LiteralUnion<
-  string & keyof typeof MRT_FilterFns
->;
-
-export type MRT_FilterFn<TData extends Record<string, any> = {}> =
-  | FilterFn<TData>
-  | MRT_FilterOption;
-
-export type MRT_InternalFilterOption = {
-  option: string;
-  symbol: string;
-  label: string;
-  divider: boolean;
-};
-
-export type MRT_DisplayColumnIds =
-  | 'mrt-row-actions'
-  | 'mrt-row-drag'
-  | 'mrt-row-expand'
-  | 'mrt-row-numbers'
-  | 'mrt-row-select';
-
-export type MRT_CreateTableFeature<
-  TData extends Record<string, any> = {},
-  TFeature = any,
-> = (table: MRT_TableInstance<TData>) => TFeature;
-
-/**
- * `columns` and `data` props are the only required props, but there are over 170 other optional props.
- *
- * See more info on creating columns and data on the official docs site:
- * @link https://www.material-react-table.com/docs/getting-started/usage
- *
- * See the full props list on the official docs site:
- * @link https://www.material-react-table.com/docs/api/props
- */
-export type MaterialReactTableProps<TData extends Record<string, any> = {}> =
-  Prettify<
-    Omit<
-      Partial<TableOptions<TData>>,
-      | 'columns'
-      | 'data'
-      | 'defaultColumn'
-      | 'enableRowSelection'
-      | 'expandRowsFn'
-      | 'getRowId'
-      | 'globalFilterFn'
-      | 'initialState'
-      | 'onStateChange'
-      | 'state'
-    > & {
-      columnFilterModeOptions?: Array<
-        LiteralUnion<string & MRT_FilterOption>
-      > | null;
-      /**
-       * The columns to display in the table. `accessorKey`s or `accessorFn`s must match keys in the `data` prop.
-       *
-       * See more info on creating columns on the official docs site:
-       * @link https://www.material-react-table.com/docs/guides/data-columns
-       * @link https://www.material-react-table.com/docs/guides/display-columns
-       *
-       * See all Columns Options on the official docs site:
-       * @link https://www.material-react-table.com/docs/api/column-options
-       */
-      columns: MRT_ColumnDef<TData>[];
-      /**
-       * Pass your data as an array of objects. Objects can theoretically be any shape, but it's best to keep them consistent.
-       *
-       * See the usage guide for more info on creating columns and data:
-       * @link https://www.material-react-table.com/docs/getting-started/usage
-       */
-      data: TData[];
-      /**
-       * Instead of specifying a bunch of the same options for each column, you can just change an option in the `defaultColumn` prop to change a default option for all columns.
-       */
-      defaultColumn?: Partial<MRT_ColumnDef<TData>>;
-      /**
-       * Change the default options for display columns.
-       */
-      defaultDisplayColumn?: Partial<MRT_ColumnDef<TData>>;
-      displayColumnDefOptions?: Partial<{
-        [key in MRT_DisplayColumnIds]: Partial<MRT_ColumnDef>;
-      }>;
-      editingMode?: 'table' | 'modal' | 'row' | 'cell';
-      enableBottomToolbar?: boolean;
-      enableClickToCopy?: boolean;
-      enableColumnActions?: boolean;
-      enableColumnDragging?: boolean;
-      enableColumnFilterModes?: boolean;
-      enableColumnOrdering?: boolean;
-      enableColumnVirtualization?: boolean;
-      enableDensityToggle?: boolean;
-      enableEditing?: boolean | ((row: MRT_Row<TData>) => boolean);
-      enableExpandAll?: boolean;
-      enableFilterMatchHighlighting?: boolean;
-      enableFullScreenToggle?: boolean;
-      enableGlobalFilterModes?: boolean;
-      enableGlobalFilterRankedResults?: boolean;
-      enablePagination?: boolean;
-      enableRowActions?: boolean;
-      enableRowDragging?: boolean;
-      enableRowNumbers?: boolean;
-      enableRowOrdering?: boolean;
-      enableRowSelection?: boolean | ((row: MRT_Row<TData>) => boolean);
-      enableRowVirtualization?: boolean;
-      enableSelectAll?: boolean;
-      enableStickyFooter?: boolean;
-      enableStickyHeader?: boolean;
-      enableTableFooter?: boolean;
-      enableTableHead?: boolean;
-      enableToolbarInternalActions?: boolean;
-      enableTopToolbar?: boolean;
-      expandRowsFn?: (dataRow: TData) => TData[];
-      getRowId?: (
-        originalRow: TData,
-        index: number,
-        parentRow: MRT_Row<TData>,
-      ) => string;
-      globalFilterFn?: MRT_FilterOption;
-      globalFilterModeOptions?: MRT_FilterOption[] | null;
-      icons?: Partial<MRT_Icons>;
-      initialState?: Partial<MRT_TableState<TData>>;
-      /**
-       * 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';
-      /**
-       * Pass in either a locale imported from `material-react-table/locales/*` or a custom locale object.
-       *
-       * See the localization (i18n) guide for more info:
-       * @link https://www.material-react-table.com/docs/guides/localization
-       */
-      localization?: Partial<MRT_Localization>;
-      /**
-       * Memoize cells, rows, or the entire table body to potentially improve render performance.
-       *
-       * @warning This will break some dynamic rendering features. See the memoization guide for more info:
-       * @link https://www.material-react-table.com/docs/guides/memoize-components
-       */
-      memoMode?: 'cells' | 'rows' | 'table-body';
-      muiBottomToolbarProps?:
-        | ToolbarProps
-        | ((props: { table: MRT_TableInstance<TData> }) => ToolbarProps);
-      muiExpandAllButtonProps?:
-        | IconButtonProps
-        | ((props: { table: MRT_TableInstance<TData> }) => IconButtonProps);
-      muiExpandButtonProps?:
-        | IconButtonProps
-        | ((props: {
-            table: MRT_TableInstance<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: {
-            table: MRT_TableInstance<TData>;
-            row: MRT_Row<TData>;
-          }) => CheckboxProps | RadioProps);
-      muiTableBodyCellCopyButtonProps?:
-        | ButtonProps
-        | ((props: {
-            cell: MRT_Cell<TData>;
-            column: MRT_Column<TData>;
-            row: MRT_Row<TData>;
-            table: MRT_TableInstance<TData>;
-          }) => ButtonProps);
-      muiTableBodyCellEditTextFieldProps?:
-        | TextFieldProps
-        | ((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>;
-            row: MRT_Row<TData>;
-            table: MRT_TableInstance<TData>;
-          }) => TableCellProps);
-      muiTableBodyCellSkeletonProps?:
-        | SkeletonProps
-        | ((props: {
-            cell: MRT_Cell<TData>;
-            column: MRT_Column<TData>;
-            row: MRT_Row<TData>;
-            table: MRT_TableInstance<TData>;
-          }) => SkeletonProps);
-      muiTableBodyProps?:
-        | TableBodyProps
-        | ((props: { table: MRT_TableInstance<TData> }) => TableBodyProps);
-      muiTableBodyRowDragHandleProps?:
-        | IconButtonProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            row: MRT_Row<TData>;
-          }) => IconButtonProps);
-      muiTableBodyRowProps?:
-        | TableRowProps
-        | ((props: {
-            isDetailPanel?: boolean;
-            row: MRT_Row<TData>;
-            staticRowIndex: number;
-            table: MRT_TableInstance<TData>;
-          }) => TableRowProps);
-      muiTableContainerProps?:
-        | TableContainerProps
-        | ((props: { table: MRT_TableInstance<TData> }) => TableContainerProps);
-      muiTableDetailPanelProps?:
-        | TableCellProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            row: MRT_Row<TData>;
-          }) => TableCellProps);
-      muiTableFooterCellProps?:
-        | TableCellProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            column: MRT_Column<TData>;
-          }) => TableCellProps);
-      muiTableFooterProps?:
-        | TableFooterProps
-        | ((props: { table: MRT_TableInstance<TData> }) => TableFooterProps);
-      muiTableFooterRowProps?:
-        | TableRowProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            footerGroup: MRT_HeaderGroup<TData>;
-          }) => TableRowProps);
-      muiTableHeadCellColumnActionsButtonProps?:
-        | IconButtonProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            column: MRT_Column<TData>;
-          }) => IconButtonProps);
-      muiTableHeadCellDragHandleProps?:
-        | IconButtonProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            column: MRT_Column<TData>;
-          }) => IconButtonProps);
-      muiTableHeadCellFilterCheckboxProps?:
-        | CheckboxProps
-        | ((props: {
-            column: MRT_Column<TData>;
-            table: MRT_TableInstance<TData>;
-          }) => CheckboxProps);
-      muiTableHeadCellFilterTextFieldProps?:
-        | TextFieldProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            column: MRT_Column<TData>;
-            rangeFilterIndex?: number;
-          }) => TextFieldProps);
-      muiTableHeadCellProps?:
-        | TableCellProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            column: MRT_Column<TData>;
-          }) => TableCellProps);
-      muiTableHeadProps?:
-        | TableHeadProps
-        | ((props: { table: MRT_TableInstance<TData> }) => TableHeadProps);
-      muiTableHeadRowProps?:
-        | TableRowProps
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-            headerGroup: MRT_HeaderGroup<TData>;
-          }) => TableRowProps);
-      muiTablePaginationProps?:
-        | Partial<Omit<TablePaginationProps, 'rowsPerPage'>>
-        | ((props: {
-            table: MRT_TableInstance<TData>;
-          }) => Partial<Omit<TablePaginationProps, 'rowsPerPage'>>);
-      muiTablePaperProps?:
-        | PaperProps
-        | ((props: { table: MRT_TableInstance<TData> }) => PaperProps);
-      muiTableProps?:
-        | TableProps
-        | ((props: { table: MRT_TableInstance<TData> }) => TableProps);
-      muiToolbarAlertBannerChipProps?:
-        | ChipProps
-        | ((props: { table: MRT_TableInstance<TData> }) => ChipProps);
-      muiToolbarAlertBannerProps?:
-        | AlertProps
-        | ((props: { table: MRT_TableInstance<TData> }) => AlertProps);
-      muiTopToolbarProps?:
-        | ToolbarProps
-        | ((props: { table: MRT_TableInstance<TData> }) => ToolbarProps);
-      onDensityChange?: OnChangeFn<MRT_DensityState>;
-      onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
-      onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
-      onEditingCellChange?: OnChangeFn<MRT_Cell<TData> | null>;
-      onEditingRowCancel?: (props: {
-        row: MRT_Row<TData>;
-        table: MRT_TableInstance<TData>;
-      }) => void;
-      onEditingRowSave?: (props: {
-        exitEditingMode: () => void;
-        row: MRT_Row<TData>;
-        table: MRT_TableInstance<TData>;
-        values: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
-      }) => Promise<void> | void;
-      onEditingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
-      onColumnFilterFnsChange?: OnChangeFn<{ [key: string]: MRT_FilterOption }>;
-      onGlobalFilterFnChange?: OnChangeFn<MRT_FilterOption>;
-      onHoveredColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
-      onHoveredRowChange?: OnChangeFn<MRT_Row<TData> | null>;
-      onIsFullScreenChange?: OnChangeFn<boolean>;
-      onShowAlertBannerChange?: OnChangeFn<boolean>;
-      onShowColumnFiltersChange?: OnChangeFn<boolean>;
-      onShowGlobalFilterChange?: OnChangeFn<boolean>;
-      onShowToolbarDropZoneChange?: OnChangeFn<boolean>;
-      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: { table: MRT_TableInstance<TData> }) => ReactNode);
-      renderBottomToolbarCustomActions?: (props: {
-        table: MRT_TableInstance<TData>;
-      }) => ReactNode;
-      renderColumnActionsMenuItems?: (props: {
-        column: MRT_Column<TData>;
-        closeMenu: () => void;
-        table: MRT_TableInstance<TData>;
-      }) => ReactNode[];
-      renderColumnFilterModeMenuItems?: (props: {
-        column: MRT_Column<TData>;
-        internalFilterOptions: MRT_InternalFilterOption[];
-        onSelectFilterMode: (filterMode: MRT_FilterOption) => void;
-        table: MRT_TableInstance<TData>;
-      }) => ReactNode[];
-      renderDetailPanel?: (props: {
-        row: MRT_Row<TData>;
-        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>;
-        table: MRT_TableInstance<TData>;
-      }) => ReactNode[];
-      renderRowActions?: (props: {
-        cell: MRT_Cell<TData>;
-        row: MRT_Row<TData>;
-        table: MRT_TableInstance<TData>;
-      }) => ReactNode;
-      renderToolbarInternalActions?: (props: {
-        table: MRT_TableInstance<TData>;
-      }) => ReactNode;
-      renderTopToolbar?:
-        | ReactNode
-        | ((props: { table: MRT_TableInstance<TData> }) => ReactNode);
-      renderTopToolbarCustomActions?: (props: {
-        table: MRT_TableInstance<TData>;
-      }) => ReactNode;
-      rowCount?: number;
-      rowNumberMode?: 'original' | 'static';
-      selectAllMode?: 'all' | 'page';
-      /**
-       * Manage state externally any way you want, then pass it back into MRT.
-       */
-      state?: Partial<MRT_TableState<TData>>;
-      /**
-       * Sequence of features important any dependent feature must be defined first
-       */
-      tableFeatures?: Array<MRT_CreateTableFeature<TData>>;
-      /**
-       * Get access to the table instance via a ref to read state or call built-in methods
-       */
-      tableInstanceRef?: MutableRefObject<MRT_TableInstance<TData> | null>;
-      /**
-       * @deprecated Use `rowVirtualizerInstanceRef` instead
-       */
-      virtualizerInstanceRef?: any;
-      /**
-       * @deprecated Use `rowVirtualizerProps` instead
-       */
-      virtualizerProps?: any;
-    }
-  > & {
-    columnVirtualizerInstanceRef?: MutableRefObject<Virtualizer<
-      HTMLDivElement,
-      HTMLTableCellElement
-    > | null>;
-    columnVirtualizerProps?:
-      | Partial<VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>>
-      | ((props: {
-          table: MRT_TableInstance<TData>;
-        }) => Partial<
-          VirtualizerOptions<HTMLDivElement, HTMLTableCellElement>
-        >);
-    rowVirtualizerInstanceRef?: MutableRefObject<Virtualizer<
-      HTMLDivElement,
-      HTMLTableRowElement
-    > | null>;
-    rowVirtualizerProps?:
-      | Partial<VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>>
-      | ((props: {
-          table: MRT_TableInstance<TData>;
-        }) => Partial<VirtualizerOptions<HTMLDivElement, HTMLTableRowElement>>);
-  };
-
-const MaterialReactTable = <TData extends Record<string, any> = {}>({
+export const MaterialReactTable = <TData extends Record<string, any> = {}>({
   aggregationFns,
   autoResetExpanded = false,
   columnResizeMode = 'onChange',
@@ -1141,4 +163,8 @@ const MaterialReactTable = <TData extends Record<string, any> = {}>({
   );
 };
 
+/**
+ * @deprecated Use named exports instead of default export (will be removed in v2)
+ * @example import { MaterialReactTable } from 'material-react-table';
+ */
 export default MaterialReactTable;