Material React Table

• Removed internal display column def memoization that caused edge cases with enabling and disabling features conditionally. (like enableRowActions and enableEditing, etc.)

• Improved Column Resizing and Column/Row DnD Performance by caching column definitions while user is dragging.

• Added new grow column option to allow for columns to grow to fill the remaining space in the table when layoutMode: 'grid-no-grow' is enabled, or to force a column to not grow when layoutMode: 'grid' is enabled and grow: false is set.

  • mrt-row-select, mrt-row-drag, mrt-row-pin, and mrt-row-number columns are now set to grow: false by default now.

  • mrt-row-expand column is also set to grow: false if only detail panels are enabled.

  • mrt-row-expand is now set to a size: 100 by default (slightly wider)

• Fixed indentation of mrt expand column when layoutMode was grid or grid-no-grow (using margin instead of padding now)

• Modified editSelectOptions to allow for dynamic values on a per-cell basis. ({ row, cell, etc. }) => []

• Fixed edit textbox controlled component warning

• New 'positionCreatingRow' table option to customize where the creating row is rendered in the table body.

• All MRT MUI menus now use the baseBackgroundColor mrt theme color for the menu background color.

• Fixed bug where the page index was not being reset to last page with rows when number of rows in the table changed.

• Made some tooltips text non-interactive to prevent accidental clicks.

• Simplified internal column preparation APIs.

• Upgraded to TanStack Table v8.11.6 for SSR bugfix (document not defined)

• Added support for Detail Panels and Row Virtualization at the same time

• Added support for Conditional Detail Panels (expand button is disabled when renderDetailPanel returns falsy value). Empty detail panels <tr> still render for virtualization and striped rows to work properly.

• Fixed Row Selection indeterminate and checked state when sub-row selection is off

• Fixed Expand Row Button padding and rotation in RTL mode

• Fixed Pagination Icon Buttons in RTL mode

• Set a default "right" cell alignment when theme.direction is "rtl"

• Improved Header Group Column Sizing

• Removed some internal "@mui/material" imports. (Could speed up dev server hot reloads in some cases)

• Fixed bug where Date and Time Picker filters were not opening properly on mobile devices

• Fixed selected row count in toolbar alert banner when using manualPagination

• Fixed row dragging with column virtualization enabled

• Fixed filter mode switching away from empty/notEmpty having an empty space value

• Fixed any setDragImage errors with internal try/catch when refs are null

• Fixed filter range slider not having a min width in popover columnFilterDisplayMode

• Implemented better default UI for groupedColumnMode: 'remove'. Expand column shows grouped row values.

• Fixed grouped parent row selection toggling bugs

• Tweaked media queries for search textbox on top of top toolbar alert banner.

• Fixed MUI Pagination disabled tooltip warning

• Fixed Column Pinning Spacing with Column Virtualization

• Fixed Column Action Clear Filter Item when filterFn was "empty" or "notEmpty"

• Upgraded to TanStack Table v8.11.3 for bug fixes with expanding and row selection

• Added 'datetime', 'datetime-range', 'time', and 'time-range' filter variants

• Added Tooltips to pagination buttons

• Added new MRT_ColumnVirtualizer and MRT_RowVirtualizer types

• Added behavior to not render Save Row button unless either onCreatingRowSave or onEditingRowSave is provided

• Allowed muiColumnActionsButtonProps.children to be overridden with a custom icon

• Fixed issue with Sticky Row Pinning and Row Virtualization

• disable row selection for creating row

• fixed virtualized column index warning

• Added new visibleInShowHideMenu column option to allow for columns to be hidden from the show/hide columns menu, regardless of column visibility state.

• Fixed bug where the Show All button in the show/hide columns menu did not properly skip columns with enableHiding: false set.

• Fixed bug where creatingRow did not work with virtualization enabled.

• Added new useMRT_Rows, useMRT_ColumnVirtualizer, and useMRT_RowVirtualizer hooks to allow for more advanced use cases for headless mode.

• Fixed possible duplicate table body row keys warning

• Upgraded to TanStack Table v8.11.2 for new columnResizeDirection table option

• Added proper column resizing support for right-to-left languages

• Updated French locale

• Fixed warning on edit textfield with outlined variant

• Fixed horizontal scrollbar showing up in layoutMode grid with column resizing enabled

• add disabled prop to muiTablePaginationProps

• Upgraded to TanStack Virtual v3.0.1 stable release

• Added MuiTablePagination-root class to mrt pagination root element for easier styling

• Fixed potential duplicate key warning while rendering skeleton rows when getRowId table option is provided and doesn't properly return undefined

• Fixed muiSearchTextFieldProps.InputProps now able to partially overridden

• Add support for 'all' rows pagination option

• Added muiPaginationProps.SelectProps support back to allow for native select

• Locale updates

• Fixed bug with popover filters null ref focus

• Fixed bug where edit row action menu was created for all editDisplayModes

• Fixed rest spread on table head row

• Changed pagination text to a span instead of with hardcoded 0 margin and padding

• Made MaterialReactTable a named export instead of a default export.

• Made @mui/x-date-pickers a required peer dependency.

• Added new useMaterialReactTable hook to replace the need for the tableInstanceRef prop.

• Now exporting all MRT_* sub-components and utility functions from material-react-table package to allow for easier building of custom UIs in headless mode.

• Added createMRTColumnHelper utility function to help with creating columns with slightly more type-safety.

• Added new mrtTheme table option to allow for changing some basic mui theme colors that are hard to target with CSS or the mui theme provider.

• Added new layoutMode: 'grid-no-grow' option for better column resizing behavior.

• Improved column resizing UI.

• Added new columnFilterDisplayMode option to allow for different filter UIs.

• Added new createDisplayMode table option to allow for different create/editing UIs. Added new functionality for creating new rows in the table.

• Renamed editMode prop to editDisplayMode table option.

• Added new paginationDisplayMode option to allow for different pagination UIs.

• Added new rowPinningDisplayMode table option and row pinning features.

• Added new "autocomplete" filterVariant.

• Added new "date" filterVariant.

• Added new "date-range" filterVariant.

• Added new loading overlay UI features when isLoading or showLoadingOverlay are true Progress bars no longer show when isLoading is true.

• Changed the default sort icon and show it as visible with a low opacity by default in table header cells.

• Changed the filter label icon to show before the sort icon in table header cells.

• Changed the default global filter search box UI to be compact and outlined.

• Changed edit text field UI to be more compact by default.

• Changed the default rowNumberDisplayMode to "static".

• Changed how the full screen table UI works internally. (No more mui full screen dialog, just simple CSS)

• Upgraded to TanStack Table v8.10.7

• Upgraded to TanStack Virtual v3.0.0-beta.68

• Renamed options

  • editingMode -> editDisplayMode

  • rowNumberMode -> rowNumberDisplayMode

  • enablePinning -> enableColumnPinning and enableRowPinning

  • virtualizerInstanceRef split into columnVirtualizerRef and rowVirtualizerRef

  • virtualizerProps split into columnVirtualizerOptions and rowVirtualizerOptions

  • columnVirtualizerProps -> columnVirtualizerOptions

  • rowVirtualizerProps -> rowVirtualizerOptions

  • muiTablePaginationProps -> muiPaginationProps

  • muiTableBodyCellCopyButtonProps -> muiCopyButtonProps

  • muiTableBodyCellEditTextFieldProps -> muiEditTextFieldProps

  • muiTableBodyCellSkeletonProps -> muiSkeletonProps

  • muiTableBodyRowDragHandleProps -> muiRowDragHandleProps

  • muiTableDetailPanelProps -> muiDetailPanelProps

  • muiTableHeadCellColumnActionsButtonProps -> muiColumnActionsButtonProps

  • muiTableHeadCellDragHandleProps -> muiColumnDragHandleProps

  • muiTableHeadCellFilterCheckboxProps -> muiFilterCheckboxProps

  • muiTableHeadCellFilterTextFieldProps -> muiFilterTextFieldProps

  • muiTableHeadCellFilterSliderProps -> muiFilterSliderProps

  • MRT_FilterFnsState -> MRT_ColumnFilterFns

  • MaterialReactTableProps -> MRT_TableOptions

  • MRT_FullScreenToggleButton => MRT_ToggleFullScreenButton

Is anything missing from this v2 changelog? Make a PR or join the Discord to discuss.

See the old V1 Changelog

Material React Table V2 was a big release months in the making that mostly focussed on the new useMaterialReactTable hook and paradigms. New features will be added and many bug fixes around virtualization compatibility with advanced features will be prioritized first.

A lighter weight useMaterialReactTableLight hook is also being considered in the near future that will be a bit more bare-bones and tree-shakable. All features will be opt-in and will not be enabled by default.