Releases: mui/mui-x
5.0.1
Nov 23, 2021
A big thanks to the 3 contributors who made this release possible. Here are some highlights ✨:
-
🎁 New API to validate the editing values (#3006) @m4theushw
You can now use the
preProcessEditCellProps
key inGridColDef
to synchronously or asynchronously validate the values committed.const columns: GridColDef[] = [ { field: 'firstName', preProcessEditCellProps: (params: GridEditCellPropsChangeParams) => { const hasError = params.props.value.length < 3; return { ...params.props, error: hasError }; }, }, { field: 'email', preProcessEditCellProps: async (params: GridEditCellPropsChangeParams) => { const userWithEmail = await fetchUserByEmail(params.value); const hasError = !!userWithEmail; return { ...params.props, error: hasError }; } } ];
-
✨ New method
getRootDimensions
to access the size of the grid (#3007) @flaviendelangleIt contains the size of the viewport (which is the scrollable container containing the rows and columns) considering scrollbars or not.
const dimensions = apiRef.current.getRootDimensions();
@mui/[email protected]
/ @mui/[email protected]
Changes
- [DataGrid] New API to validate the editing values (#3006) @m4theushw
- [DataGrid] Use color-scheme to set dark mode on native components (#3146) @alexfauquette
- [DataGrid] Fix the
@mui/x-data-grid
type entrypoint (#3196) @flaviendelangle
Core
- [core] Drop
useGridContainerProps
(#3007) @flaviendelangle - [core] Move
getRowIdFromRowIndex
andgetRowIndex
to the sorting API (#3126) @flaviendelangle - [core] Polish v5 CHANGELOG (#3194) @oliviertassinari
- [core] Remove the
index.ts
of the export hooks (#3165) @flaviendelangle - [core] Set the correct release date for v5.0.0 in the CHANGELOG.md (#3192) @flaviendelangle
Docs
- [docs] Move sentence about disabling multi rows selection (#3167) @alexfauquette
v5.0.0
Nov 23, 2021
🎉 We are excited to introduce MUI X v5.0.0 🎉!
If you want to migrate the DataGrid or DataGridPro from v4 to v5, take a look at the migration guide.
This version is fully compatible with @mui/[email protected]
and can be used with @material-ui/[email protected]
with some additional steps.
A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
- ⌨️ Enhance keyboard navigation when pagination is enabled
- 👁 Better support for flex columns
- 📚 Documentation improvements
- 🐞 Bugfixes
@mui/[email protected]
/ @mui/[email protected]
Breaking changes
-
[DataGrid] The following CSS classes were renamed to follow the internal convention:
MuiDataGrid-columnsContainer
was renamed toMuiDataGrid-columnHeaders
MuiDataGrid-columnHeaderWrapper
was renamed toMuiDataGrid-columnHeadersInner
- The
scroll
class applied toMuiDataGrid-columnHeaderWrapper
was renamed toMuiDataGrid-columnHeadersInner--scrollable
-
[DataGrid] The
props.components.Checkbox
andprops.componentsProps.checkbox
props were renamed toprops.components.BaseCheckbox
andprops.componentsProps.baseCheckbox
respectively.As a first step for #3066, these slots were renamed to clearly indicate that they are meant to replace a core component.
<DataGrid components={{ - checkbox: MyCustomCheckbox, + BaseCheckbox: MyCustomCheckbox, }} componentsProps={{ - checkbox: {}, + baseCheckbox: {}, }} />
Note: these changes apply to both the
DataGrid
andDataGridPro
components.
Changes
- [DataGrid] Block multi-rows updates in
apiRef.current.updateRows
on the Community plan (#3095) @flaviendelangle - [DataGrid] Fix filter not working after deleting the value (#3018) @m4theushw
- [DataGrid] Fix performance regression when selecting 100k rows (#3077) @m4theushw
- [DataGrid] Fix
apiRef.current.updateRows
to not share rows from other instances (#3127) @m4theushw - [DataGrid] Fix flex space allocation to not cause a horizontal scroll when there is enough space (#3099) @flaviendelangle
- [DataGrid] Improve the filter panel behaviors (#3080) @flaviendelangle
- [DataGrid] Fix keyboard navigation between column headers and rows when not on the first page (#3086) @flaviendelangle
- [DataGrid] Fix keyboard navigation between rows when not on the first page (#3074) @flaviendelangle
- [DataGrid] Prevents bubbling in menu header (#3000) @alexfauquette
- [DataGrid] Remove unused rendering state and selectors (#3133) @flaviendelangle
- [DataGrid] Rename
Checkbox
component and props slots toBaseCheckbox
(#3142) @DanailH
Core
- [core] Adapt changelog script to GitHub DOM modification (#3087) @alexfauquette
- [core] Automatically close issues that are incomplete and inactive (#3029) @oliviertassinari
- [core] Improve the typing of
LicenseStatus
(#3141) @himself65 - [core] Make
useGridColumnsPreProcessing
generic (#3092) @m4theushw - [core] Move column headers virtualization to hook (#3078) @m4theushw
- [core] Move virtualization logic to hook (#3079) @m4theushw
- [core] Rename directories to match new packages new names (#3088) @flaviendelangle
- [core] Replace
createClientRender
with newcreateRenderer
API (#3125) @flaviendelangle - [core] Store the event manager in a key of
GridApi
instead of making the wholeGridApi
extend it (#3069) @flaviendelangle - [core] Update monorepo (#3139) @m4theushw
- [core] Use
unstable_
prefix instead ofunsafe_
for private APIs (#3090) @flaviendelangle - [core] Use official MUI repo as monorepo (#3084) @m4theushw
Docs
- [docs] Fix broken example in the component slot example (#3123) @himself65
- [docs] Fix inline previews (#3081) @DanailH
- [docs] Fix the client-side validation link clarity (#3100) @oliviertassinari
- [docs] Improve
rowCount
CSS class description (#3072) @ZeeshanTamboli - [docs] Use core repo constants for doc internationalization (#3143) @flaviendelangle
v5.0.0-beta.7
Nov 4, 2021
- 💅 Reduce styles specificity to make it simpler to override (#3012) @DanailH
- 🌍 Add Hebrew (heIL) locale (#3028) @ColdAtNight
- 📚 Documentation improvements
- 🐞 Bugfixes
@mui/[email protected]
/ @mui/[email protected]
Breaking changes
-
[core] Prefix selectors from
useGridContainerProps
withunstable
(#3002) @flaviendelangleThe dimension API is being temporarily made private to allow to clean it in future minor releases. The current approach causes useless re-renders.
If you relay on any of these selectors, open an issue explaining the use case so that will be taken into account when refactoring them.The following selectors were prefixed by
unstable_
. Use the provided alternatives.gridContainerSizesSelector
was renamed tounstable_gridContainerSizesSelector
gridViewportSizesSelector
was renamed tounstable_gridViewportSizesSelector
gridScrollBarSizeSelector
was renamed tounstable_gridScrollBarSizeSelector
The following selectors were removed. You can hard-code their logic in your application if you really need them.
gridDataContainerSizesSelector
const dataContainerSizes = gridContainerSizesSelector(state)?.dataContainerSizes ?? null;
gridDataContainerHeightSelector
const dataContainerHeight = gridContainerSizesSelector(state)?.dataContainerSizes.height ?? null;
The selector
gridViewportSizeStateSelector
was a duplicate and has been removed, you can use the selectorunstable_gridViewportSizesSelector
instead.
Changes
- [DataGrid] Add Hebrew (heIL) locale (#3028) @ColdAtNight
- [DataGrid] Move virtualization logic to hook (#3079) @m4theushw
- [DataGrid] Revert year change in the MIT license (#3059) @oliviertassinari
- [DataGrid] Fix filtering of nullish numeric cells (#3070) @flaviendelangle
- [DataGrid] Improve performance when selecting 100k rows (#3077) @m4theushw
- [DataGrid] Fix
GridEditDateCell
to handle timezone correctly (#2918) @flaviendelangle - [DataGrid] Fix keyboard navigation on page > 0 (#3074) @flaviendelangle
- [DataGrid] Prevents bubbling in menu header (#3000) @alexfauquette
- [DataGrid] Fix wrong params provided to
cellModeChange
whensetCellMode
is called (#3025) @flaviendelangle
Core
- [core] Adapt
useDemoData
for Tree Data (#2978) @flaviendelangle - [core] Group update of MUI Core (#3055) @oliviertassinari
- [core] Ignore
*.tsbuildinfo
files (#3068) @m4theushw - [core] Implement tree-based row management (#2996) @flaviendelangle
- [core] Invert Codesandbox examples on README (#3073) @flaviendelangle
- [core] Prefix selectors from
useGridContainerProps
withunsafe
(#3002) @flaviendelangle - [core] Reduce
setGridState
andapplyFilters
call when updatingfilterModel
(#3023) @flaviendelangle - [core] Reduce styles complexity (#3012) @DanailH
- [core] Upgrade monorepo (#3067) @m4theushw
- [core] Use official MUI repo as monorepo (#3084) @m4theushw
- [test] Retry each expect until success (#3027) @m4theushw
- [core] Adapt changelog script to new GitHub DOM (#3087) @alexfauquette
Docs
- [docs] Explain how to use
valueGetter
to transform type (#3003) @alexfauquette - [docs] Fix the outdated demo of the docs (#3058) @oliviertassinari
- [docs] Fix inline previews (#3081) @DanailH
v4.0.2
Nov 1, 2021
This version backports bug fixes and some of the features from the v5.x active release line.
As the development of v5 evolves, newer fixes might not be cherry-picked to the legacy version.
To have access to the latest features it is encouraged to upgrade to MUI X v5.
Upgrading MUI Core to v5 is also recommended, however, v4 can still be used by following these instructions.
Big thanks to the 3 contributors who made this release possible. Here are some highlights ✨:
- ⚡️ Stop drag event propagation (#2987) @chendoron
- 🐞 Prevent scroll when selecting rows (#2999) @m4theushw
@mui/[email protected]
/ @mui/[email protected]
Changes
- [DataGrid] Prevent scroll when selecting rows (#2999) @m4theushw
- [DataGridPro] Stop drag event propagation (#2987) @chendoron
Core
- [core] Update deploy docs target for v4 (#2808) @oliviertassinari
v5.0.0-beta.6
Oct 29, 2021
A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
- ✨ Allow
valueOptions
fromGridColDef
to accept a function (#2850) @alexfauquette - 💅 Prefix undocumented
apiRef
methods withunsafe_
(#2985) @flaviendelangle - 👁 Unify filtering, sorting, and rows selectors names (#2942) @flaviendelangle
- 💡 Support style overrides added in the theme (#2995) @DanailH
- 📚 Documentation improvements
- 🐞 Bugfixes
@mui/[email protected]
/ @mui/[email protected]
Breaking changes
-
[DataGridPro] The following methods from
apiRef
were renamed. Use the provided alternatives. (#2870) @flaviendelangleapiRef.current.applyFilters
was renamed toapiRef.current.unsafe_applyFilters
apiRef.current.applyFilterLinkOperator
was renamed toapiRef.current.setFilterLinkOperator
apiRef.current.upsertFilter
was renamed toapiRef.current.upsertFilterItem
apiRef.current.deleteFilter
was renamed toapiRef.current.deleteFilterItem
-
[DataGridPro] The
apiRef.current.applyFilter
method was removed. (#2870) @flaviendelangle
You should never have to call it directly since the filters are already applied when thefilterModel
prop changes.
To manually apply the filters, useapiRef.current.unsafe_applyFilters
.-apiRef.current.applyFilter +apiRef.current.unsafe_applyFilters
-
[DataGridPro] Rename filtering, sorting, and rows selectors to match the naming convention (#2942) @flaviendelangle
unorderedGridRowIdsSelector
was renamed togridRowIdsSelector
sortingGridStateSelector
was renamed togridSortingStateSelector
sortedGridRowIdsSelector
was renamed togridSortedRowIdsSelector
visibleSortedGridRowIdsSelector
was renamed togridVisibleSortedRowIdsSelector
visibleGridRowCountSelector
was renamed togridVisibleRowCountSelector
filterGridColumnLookupSelector
was renamed togridFilterActiveItemsSelector
-
[DataGridPro] The
sortedGridRowsSelector
was renamed togridSortedRowEntriesSelector
(#2942) @flaviendelangleThe return value was also changed as below:
-sortedGridRowsSelector: (state: GridState) => Map<GridRowId, GridRowModel> -const map = sortedGridRowsSelector(state); +gridSortedRowEntriesSelector: (state: GridState) => GridRowEntry[] +const map = new Map(gridSortedRowEntriesSelector(state).map(row => [row.id, row.model]));
-
[DataGridPro] The
visibleSortedGridRowsSelector
was replaced withgridVisibleSortedRowEntriesSelector
(#2942) @flaviendelangleThe return value was also changed as below:
-visibleSortedGridRowsSelector: (state: GridState) => Map<GridRowId, GridRowModel>; -const map = visibleSortedGridRowsSelector(state); +gridVisibleSortedRowEntriesSelector: (state: GridState) => GridRowEntry[] +const map = new Map(gridVisibleSortedRowEntriesSelector(state).map(row => [row.id, row.model]));
-
[DataGridPro] The
visibleSortedGridRowsAsArraySelector
was replaced withgridVisibleSortedRowEntriesSelector
(#2942) @flaviendelangleThe return value was also changed as below:
-visibleSortedGridRowsAsArraySelector: (state: GridState) => [GridRowId, GridRowData][]; +gridVisibleSortedRowEntriesSelector: (state: GridState) => GridRowEntry[]
-
[DataGridPro] The
filterGridItemsCounterSelector
selector was removed. (#2942) @flaviendelangle
UsegridFilterActiveItemsSelector
as replacement.-const filterCount = filterGridItemsCounterSelector(state); +const filterCount = gridFilterActiveItemsSelector(state).length;
-
[DataGridPro] The
unorderedGridRowModelsSelector
selector was removed. (#2942) @flaviendelangle
UseapiRef.current.getRowModels
orgridRowIdsSelector
andgridRowsLookupSelector
.
Changes
- [DataGrid] Allow
valueOptions
to accept a function (#2850) @alexfauquette - [DataGrid] Add
overridesResolver
(#2995) @DanailH - [DataGrid] Unify filtering, sorting, and rows selectors names (#2942) @flaviendelangle
- [DataGridPro] Prefix undocumented
apiRef
methods withunsafe_
(#2985) @flaviendelangle
Docs
- [docs] Explain how to use MUI X v5 with MUI Core v4 (#2846) @m4theushw
- [docs] Generate docs for components (#2465) @m4theushw
- [docs] Improve
scrollEndThreshold
API docs (#3001) @ZeeshanTamboli - [docs] Fix CodeSandbox and feature request templates (#2986) @flaviendelangle
Core
- [core] Add step for announcing the releases on Twitter (#2997) @DanailH
- [core] Apply all filters to a row before moving to the next one (#2870) @flaviendelangle
- [core] Change monorepo repository URL (#2983) @m4theushw
- [core] Clean Storybook examples (#2805) @flaviendelangle
- [core] Generate list of all grid exports (#2801) @flaviendelangle
- [core] Improve typing of
buildApi.ts
(#2922) @flaviendelangle - [core] Add additional test for
checkboxSelection
toggling (#2979) @flaviendelangle - [test] Fix flaky visual regression test (#2981) @m4theushw
v5.0.0-beta.5
Oct 22, 2021
A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
- 💅 Remove dependency on
@mui/styles
and use the same styling solution from MUI Core (#2784) @DanailH - ✨ Add support for generics in
GridRowParams
,GridCellParams
andGridRenderCellParams
(#2436) @ZeeshanTamboli - 👁 Rework the virtualization engine (#2673) @m4theushw
- 💡 Enhance internal code structure
- 🐞 Bugfixes
@mui/[email protected]
/ @mui/[email protected]
Breaking changes
-
The
DataGrid
andDataGridPro
no longer depends on@mui/styles
. Usestyled
to provide custom styling. (#2784) @DanailH-import { createTheme } from '@mui/material/styles'; -import { makeStyles } from '@mui/styles'; +import { styled } from '@mui/material/styles';
The following CSS classes were renamed:
.MuiDataGrid-gridMenuList
was renamed to.MuiDataGrid-menuList
.MuiGridToolbarContainer-root
was renamed to.MuiDataGrid-toolbarContainer
.MuiGridMenu-root
was renamed to.MuiDataGrid-menu
.MuiDataGridColumnsPanel-root
was renamed to.MuiDataGrid-columnsPanel
.MuiGridPanel-root
was renamed to.MuiDataGrid-panel
.MuiGridPanelContent-root
was renamed to.MuiDataGrid-panelContent
.MuiGridPanelFooter-root
was renamed to.MuiDataGrid-panelFooter
.MuiDataGridPanelHeader-root
was renamed to.MuiDataGrid-panelHeader
.MuiGridPanelWrapper-root
was renamed to.MuiDataGrid-panelWrapper
.MuiGridFilterForm-root
was renamed to.MuiDataGrid-filterForm
.MuiGridToolbarFilterButton-root
was renamed to.MuiDataGrid-toolbarFilterList
-
[DataGrid] The CSS classes
.MuiDataGrid-window
and.MuiDataGrid-windowContainer
were removed (#2673) @m4theushwThe following CSS classes were renamed:
.MuiDataGrid-viewport
was renamed to.MuiDataGrid-virtualScroller
.MuiDataGrid-dataContainer
was renamed to.MuiDataGrid-virtualScrollerContent
.MuiDataGrid-renderingZone
was renamed to.MuiDataGrid-virtualScrollerRenderZone
-
[DataGrid] Remove the
useGridSlotComponentProps
hook and replace it as below: (#2856) @flaviendelangle-const { apiRef, state, rootElement } = useGridSlotComponentProps(); +const apiRef = useGridApiContext(); +const [state] = useGridState(apiRef); +const rootElement = apiRef.current.rootElementRef;
-
[DataGrid] Remove the
state
prop and use theinitialState
prop (#2848) @flaviendelangleNote that
initialState
only allows thepreferencePanel
,filter.filterModel
andsort.sortModel
keys.
To fully control the state, use the the feature's model prop and change callback (e.g.filterModel
andonFilterModelChange
).<DataGrid - state={{ + initialState={{ preferencePanel: { open: true, openedPanelValue: GridPreferencePanelsValue.filters, }, }} />
-
[DataGridPro] Remove the
onViewportRowsChange
prop and theviewportRowsChange
event (#2673) @m4theushwA listener on the
rowsScroll
event, as shown below, can be used to replace the prop:const apiRef = useGridApiRef(); const prevRenderContext = React.useRef(null); React.useEffect(() => { return apiRef.current.subscribeEvent("rowsScroll", ({ renderContext }) => { if ( !prevRenderContext.current || renderContext.firstRowIdx !== prevRenderContext.current.firstRowIndex || renderContext.lastRowIdx !== prevRenderContext.current.lastRowIndex ) { prevRenderContext.current = renderContext; const params = { firstRowIndex: renderContext.firstRowIndex, lastRowIndex: renderContext.lastRowIndex }; } }); }, [apiRef]); <DataGridPro apiRef={apiRef} />
Changes
- [DataGrid] Add
valueSetter
(#2876) @m4theushw - [DataGrid] Add support for generic types in
GridRowParams
,GridCellParams
,GridRenderCellParams
(#2436) @ZeeshanTamboli - [DataGrid] Fix
actions
column type to not select the row when clicking on an item (#2862) @m4theushw - [DataGrid] Fix column headers misalignment when the render context changes (#2937) @m4theushw
- [DataGrid] Rework virtualization (#2673) @m4theushw
- [DataGrid] Remove
@mui/styles
dependency (#2784) @DanailH - [DataGrid] Remove
useGridSlotComponentProps
(#2856) @flaviendelangle - [DataGrid] Replace
prop.state
withprop.initialState
(#2848) @flaviendelangle - [DataGrid] Use true content height to dispatch
rowsScrollEnd
(#2938) @m4theushw - [DataGrid] Fix the typing of
GridToolbarFilterButton
(#2841) @alexfauquette
Docs
- [docs] Improve the README for releases (#2908) @flaviendelangle
- [docs] Re-add Pro icon (#2928) @m4theushw
- [docs] Fix to not commit changes when clicking outside the cell (#2906) @ZeeshanTamboli
- [docs] Update link to Quick Filter issue (#2909) @m4theushw
Core
- [core] Small fixes on the Components page (#2877) @flaviendelangle
- [core] Make each feature hook responsible for its column pre-processing (#2839) @flaviendelangle
- [core] Add
useGridRowGroupsPreProcessing
internal hook (#2840) @flaviendelangle - [core] Register events async if not registered (#2916) @m4theushw
- [core] Remove
material-ui-utils.ts
(#2872) @DanailH - [core] Remove outdated hooks requirements (#2939) @flaviendelangle
- [core] Remove test event (#2912) @m4theushw
- [core] Remove unused
GridSlotComponentProps
interface (#2911) @flaviendelangle - [core] Rename 'UNSTABLE_' prefix to 'unstable_' (#2931) @flaviendelangle
- [core] Replace usage of
GridRowData
withGridRowModel
(#2936) @flaviendelangle - [core] Revert hardcoded typings (#2907) @DanailH
- [core] Simplify the CSV export (#2941) @flaviendelangle
- [core] Update monorepo version (#2927) @m4theushw
- [test] Take screenshot of the print export (#2881) @m4theushw
v5.0.0-beta.4
Oct 14, 2021
A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
-
🎁 Add the ability to print the grid (#2519) @DanailH
This new feature adds a button to the toolbar to generate a printer-friendly layout. Check the documentation about it.
-
💡 Enhance internal code structure
-
✨ New slots for
row
andcell
(#2753) @m4theushw -
📚 Documentation improvements
-
🐞 Bugfixes
@mui/[email protected]
/ @mui/[email protected]
Breaking changes
-
[DataGrid] Remove unused event listeners and redundant DOM attributes on
GridCell
andGridRow
(#2810) @m4theushwThe following props were removed. If you depend on them, use
componentsProps.row
andcomponentsProps.cell
to pass custom props to the row or cell.onCellBlur
onCellOver
onCellOut
onCellEnter
onCellLeave
onRowOver
onRowOut
onRowEnter
onRowLeave
For more information, check this page. Example:
-<DataGrid onRowOver={handleRowOver} />; +<DataGrid + componentsProps={{ + row: { onMouseOver: handleRowOver }, + }} +/>;
The
data-rowindex
anddata-rowselected
attributes were removed from the cell element. Equivalent attributes can be found in the row element.The
data-editable
attribute was removed from the cell element. Use the.MuiDataGrid-cell--editable
CSS class.The
data-mode
attribute was removed from the cell element. Use the.MuiDataGrid-cell--editing
CSS class. -
[DataGrid] The
state.filter
andstate.visibleRows
were merged into a singlestate.filter
sub-state (#2782) @flaviendelangleTo still access this information, use
state.filter
or the selectors as below:-const filterModel = state.filter -const filterModel = gridFilterStateSelector(state) +const filterModel = state.filter.filterModel +const filterModel = gridFilterModelSelector(state) // preferred method -const visibleRowsLookup = state.visibleRows.visibleRowsLookup -const visibleRowsLookup = visibleGridRowsStateSelector(state).visibleRowsLookup +const visibleRowsLookup = state.filter.visibleRowsLookup +const visibleRowsLookup = gridVisibleRowsLookupSelector(state).visibleRowsLookup // preferred method -const visibleRows = state.visibleRows.visibleRows +const visibleRows = state.filter.visibleRows +const visibleRows = gridVisibleRowsLookupSelector(state).visibleRows // preferred method
-
[DataGrid] The CSS classes constants are not exported anymore. Use
gridClasses
instead. (#2788) @flaviendelangle-const columnHeaderClass = GRID_COLUMN_HEADER_CSS_CLASS +const columnHeaderClass = gridClasses.columnHeader -const rowClass = GRID_ROW_CSS_CLASS +const rowClass = gridClasses.row -const cellClass = GRID_CELL_CSS_CLASS +const cellClass = gridClasses.cell -const columnSeparatorClass = GRID_COLUMN_HEADER_SEPARATOR_RESIZABLE_CSS_CLASS +const columnSeparatorClass = gridClasses['columnSeparator--resizable'] -const columnHeaderTitleClass = GRID_COLUMN_HEADER_TITLE_CSS_CLASS +const columnHeaderTitleClass = gridClasses.columnHeaderTitle -const columnHeaderDropZoneClass = GRID_COLUMN_HEADER_DROP_ZONE_CSS_CLASS +const columnHeaderDropZoneClass = gridClasses.columnHeaderDropZone -const columnHeaderDraggingClass = GRID_COLUMN_HEADER_DRAGGING_CSS_CLASS +const columnHeaderDraggingClass = gridClasses["columnHeader--dragging"]
-
[DataGrid] Rename
gridCheckboxSelectionColDef
toGRID_CHECKBOX_SELECTION_COL_DEF
(#2793) @flaviendelangle- gridCheckboxSelectionColDef + GRID_CHECKBOX_SELECTION_COL_DEF
-
[DataGrid] The constants referring to the column types were removed (#2791) @flaviendelangle
Replace them as below:-const isColumnString = column.type === GRID_STRING_COLUMN_TYPE; +const isColumnString = col.type === 'string'; -const isColumnNumber = col.type === GRID_NUMBER_COLUMN_TYPE; +const isColumnNumber = col.type === 'number'; -const isColumnDate = col.type === GRID_DATE_COLUMN_TYPE; +const isColumnDate = col.type === 'date'; -const isColumnDateTime = col.type === GRID_DATETIME_COLUMN_TYPE; +const isColumnDateTime = col.type === 'dateTime'; -const isColumnBoolean = col.type === GRID_BOOLEAN_COLUMN_TYPE; +const isColumnBoolean = col.type === 'boolean';
-
[DataGrid] The state initializers were removed (#2782) @flaviendelangle
Use
getDefaultGridFilterModel
instead ofgetInitialGridFilterState
:-const [filterModel, setFilterModel] = React.useState(getInitialGridFilterState); +const [filterModel, setFilterModel] = React.useState(getDefaultGridFilterModel);
For the other methods, you can hardcode the value you want to apply:
-const [sortModel, setSortModel] = React.useState(() => getInitialGridSortingState().sortModel); +const [sortModel, setSortModel] React.useState([]); -getInitialGridColumnReorderState -getInitialGridColumnResizeState -getInitialGridColumnsState -getInitialGridRenderingState -getInitialGridRowState -getInitialGridState -getInitialVisibleGridRowsState -getInitialGridState
Changes
- [DataGrid] Add
row
andcell
component slots (#2753) @m4theushw - [DataGrid] Rename
gridCheckboxSelectionColDef
toGRID_CHECKBOX_SELECTION_COL_DEF
(#2793) @flaviendelangle - [DataGrid] Clean hook folder structure and stop exporting internal hooks (#2789) @flaviendelangle
- [DataGrid] Add support for Print export (#2519) @DanailH
- [DataGrid] Remove internal localization and column type constant exports (#2791) @flaviendelangle
- [DataGrid] Remove
GridRowCells
component (#2811) @m4theushw - [DataGrid] Remove class constants exports (#2788) @flaviendelangle
- [DataGrid] Remove unused event listeners on
GridCell
andGridRow
(#2810) @m4theushw - [DataGrid] Fix the header selection checkbox to work with
prop.checkboxSelectionVisibleOnly
(#2781) @flaviendelangle
Docs
- [docs] Add link to installation page (#2778) @MostafaKMilly
- [docs] Add redirect from docs home page to
DataGrid
home page (#2737) @flaviendelangle - [docs] Fix JSX closing tag in
getActions
example (#2847) @dstarner - [docs] Fix pagination in Ant Design demo (#2787) @ZeeshanTamboli
- [docs] Update the
page
prop docs (#2812) @m4theushw
Core
- [core] Update hooks to initialize their state synchronously (#2782) @flaviendelangle
- [core] Fix rollup external warnings (#2736) @eps1lon
v5.0.0-beta.3
Oct 7, 2021
A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
- 🌎 Add Persian (faIR) locale (#2712) @devlifeX
- 🎁 Allow selecting a range of rows with Shift + click (#2456) @flaviendelangle
- 🚀 Allow to throttle the row updates with the
throttleRowsMs
prop onDataGridPro
and remove the default 100ms row update delay (#2561) @flaviendelangle - 💡 Enhance internal code structure
- 📚 Documentation improvements
- 🐞 Bugfixes
@mui/[email protected]
/ @mui/[email protected]
Breaking changes
-
[DataGrid] Rename some selectors and interfaces to follow the codebase naming conventions (#2723) @flaviendelangle
The following selectors were renamed:
-const filterModel = filterGridStateSelector(state); +const filterModel = gridFilterModelSelector(state);
-const density: GridGridDensity = densitySelector(state); +const density: GridDensityState = gridDensitySelector(state);
-const rendering: InternalRenderingState = gridRenderingSelector(state); +const rendering: GridRenderingState = gridRenderingSelector(state);
Changes
- [DataGrid] Add Persian (faIR) locale (#2712) @devlifeX
- [DataGrid] Allow to select range of rows using Shift + click (#2456) @flaviendelangle
- [DataGrid] Fix numeric column filter to not run when value is empty (#2780) @m4theushw
- [DataGrid] Export
singleSelect
operators (#2666) @jeremyalan - [DataGrid] Fix Italian localization (#2717) @destegabry
- [DataGrid] Fix
undefined
in filter panel (#2715) @DanailH - [DataGrid] Fix the fade-out transition of the
GridMenu
(#2734) @flaviendelangle - [DataGrid] Pass row
id
tovalueFormatter
(#2738) @m4theushw - [DataGrid] Fix
onSortModelChange
to not be called during initialization (#2724) @flaviendelangle - [DataGridPro] Stop drag event propagation (#2802) @DanailH
- [DataGridPro] Fix keyboard navigation to work with filtered rows (#2800) @flaviendelangle
Docs
- [docs] Add missing fonts (#2745) @m4theushw
- [docs] Add page for scrolling API (#2634) @m4theushw
- [docs] Add type to
onChange
event argument (#2669) @jayariglesias - [docs] Add explanation about the
id
usage in multiple filters in DataGridPro (#2783) @ZeeshanTamboli - [docs] Fix demo throwing error (#2719) @m4theushw
- [docs] Fix index and improve playground page (#2755) @oliviertassinari
Core
- [core] Add benchmark script (#2683) @m4theushw
- [core] Clean error messages prefix (#2676) @flaviendelangle
- [core] Do not regenerate columns of
useDemoData
on each render (#2747) @flaviendelangle - [core] Don't run benchmark on cached files (#2786) @m4theushw
- [core] Drop localization v4 format (#2792) @flaviendelangle
- [core] Remove useless state update in
useGridColumnMenu
(#2722) @flaviendelangle - [core] Remove v4 conditional code (#2575) @flaviendelangle
- [core] Rework
useGridRows
high frequency update (#2561) @flaviendelangle - [core] Set up
eps1lon/actions-label-merge-conflict
action (#2751) @m4theushw - [core] Stop using selectors for Pro features on React components (#2716) @flaviendelangle
v4.0.1
Sep 29, 2021
This version backports bug fixes and some of the features from the v5.x active release line.
As the development of v5 evolves, newer fixes might not be cherry-picked to the legacy version.
To have access to the latest features it is encouraged to upgrade to MUI X v5 and MUI Core v5.
Big thanks to the 3 contributors who made this release possible. Here are some highlights ✨:
- 👁 Allow to disable virtualization with the
disableVirtualization
prop (#2728) @m4theushw - 🕹 Fix navigation between column headers with rows filtered (#2730) @m4theushw
- 🐞 Fix numeric filter operators not handling '0' correctly (#2732) @flaviendelangle
@mui/[email protected]
/ @mui/[email protected]
Changes
- [DataGrid] Add
disableVirtualization
prop (#2728) @m4theushw - [DataGrid] Fix navigation between column headers with rows filtered (#2730) @m4theushw
- [DataGrid] Fix numeric filter operators not handling '0' correctly (#2732) @flaviendelangle
- [DataGridPro] Only apply
checkboxSelectionVisibleOnly
when pagination is enabled (#2731) @flaviendelangle
Docs
- [docs] Improve SEO ranking (#2467) @oliviertassinari
Core
- [core] Allow to create one logger per Grid instance (#2442) @flaviendelangle
- [core] Update monorepo (#2726) @m4theushw
v5.0.0-beta.2
Sep 24, 2021
A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
- 🇻🇳 Add Vietnamese (viVN) locale (#2668) @tuananh281098
- 🇵🇱 Improve Polish (plPL) locale (#2632) @michallukowski
- ⚡️ Apply the
valueFormatter
to thesingleSelect
column type (#2581) @DanailH
@mui/[email protected]
/ @mui/[email protected]
Breaking changes
-
[DataGrid] The params passed to the
valueFormatter
were changed. (#2581) @DanailHUse the
api
to get the missing params.
TheGridValueFormatterParams
interface has the following signature now:-export type GridValueFormatterParams = Omit<GridRenderCellParams, 'formattedValue' | 'isEditable'>; +export interface GridValueFormatterParams { + /** + * The column field of the cell that triggered the event + */ + field: string; + /** + * The cell value, but if the column has valueGetter, use getValue. + */ + value: GridCellValue; + /** + * GridApi that let you manipulate the grid. + */ + api: any; +}
Changes
- [DataGrid] Add Vietnamese (viVN) locale (#2668) @tuananh281098
- [DataGrid] Apply the
valueFormatter
tosingleSelect
select options (#2581) @DanailH - [DataGrid] Free up column header space when icons are not visible (#2606) @DanailH
- [DataGrid] Improve Polish (plPL) locale (#2632) @michallukowski
Docs
- [docs] Add section for controlled selection and server-side pagination (#2602) @DanailH
- [docs] Fix Algolia search (#2655) @oliviertassinari
- [docs] Improve the seach results relevance (#2656) @oliviertassinari
- [docs] Update installation instructions (#2663) @m4theushw
Core
- [core] Upgrade JSS plugins to 10.8.0 (#2667) @m4theushw