@mui/x-internals
Shared utilities used by MUI X packages. This package should never be installed or used directly.
Utility functions for the MUI X packages (internal use only).
Shared utilities used by MUI X packages. This package should never be installed or used directly.
For full v7 changelog, please refer to the v.7x branch.
All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.
Nov 20, 2025
We'd like to extend a big thank you to the 15 contributors who made this release possible. Here are some highlights ✨:
wheel to the charts zoomcolumns prop stable.Special thanks go out to these community members for their valuable contributions: @lauri865, @noobyogi0010, @sai6855
The following team members contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @mj12albert, @noraleonte, @rita-codes, @siriwatknp, @ZeeshanTamboli
@mui/x-data-grid@8.19.0tabNavigation prop to control tab navigation in the grid (#20286) @arminmehautoHeight prop (#20363) @cherniavskii@mui/x-data-grid-pro@8.19.0 Same changes as in @mui/x-data-grid@8.19.0.
@mui/x-data-grid-premium@8.19.0 Same changes as in @mui/x-data-grid-pro@8.19.0, plus:
ExcelJS version (#20329) @cherniavskii@mui/x-date-pickers@8.19.0slotProps.field.slotProps (#20322) @flaviendelangle@mui/x-date-pickers-pro@8.19.0 Same changes as in @mui/x-date-pickers@8.19.0.
@mui/x-charts@8.19.0niceDomain utility (#20250) @bernardobelchiortouch-action: pan-y when zoom is disabled (#20204) @bernardobelchiorgetBBox() for correct SVG sizes in firefox (#20309) @JCQuintas@mui/x-internals (#20365) @alexfauquette@mui/x-charts-pro@8.19.0 Same changes as in @mui/x-charts@8.19.0, plus:
wheel to zoom (#19998) @JCQuintas@mui/x-charts-premium@8.19.0 Same changes as in @mui/x-charts-pro@8.19.0.
@mui/x-tree-view@8.19.0@mui/x-tree-view-pro@8.19.0 Same changes as in @mui/x-tree-view@8.19.0.
@mui/x-codemod@8.19.0Internal changes.
LoadingButton with Button component (#20208) @JanpotcheckMaterialVersion (#20307) @Janpot@docsearch/react (#20313) @Janpotuse-react-version pnpm script (#20319) @cherniavskiiNov 13, 2025
We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
Add barLabelPlacement property to customize the bar label position in bar charts, enabling labels to be placed above bars.
Add source property to the date/time picker lifecycle and event handler context, enabling clearer differentiation between changes initiated by the picker UI and those from direct field input.
Special thanks go out to these community members for their valuable contributions: @htollefsen, @sai6855, @Sigdriv
The following team members contributed to this release: @arminmeh, @bernardobelchior, @brijeshb42, @cherniavskii, @flaviendelangle, @JCQuintas, @michelengelen, @noraleonte, @prakhargupta1, @rita-codes, @siriwatknp
@mui/x-data-grid@8.18.0useGridApiRef (#20277) @cherniavskii@mui/x-data-grid-pro@8.18.0 Same changes as in @mui/x-data-grid@8.18.0.
@mui/x-data-grid-premium@8.18.0 Same changes as in @mui/x-data-grid-pro@8.18.0, plus:
cellParams value from the aggregation cells (#20224) @arminmeh@mui/x-date-pickers@8.18.0source property to onChange and onAccept context object (#20234) @michelengelen@mui/x-date-pickers-pro@8.18.0 Same changes as in @mui/x-date-pickers@8.18.0.
@mui/x-charts@8.18.0ChartAxisZoomSliderThumb (#20232) @sai6855@mui/x-charts-pro@8.18.0 Same changes as in @mui/x-charts@8.18.0, plus:
@mui/x-charts-premium@8.18.0 Same changes as in @mui/x-charts-pro@8.18.0.
@mui/x-tree-view@8.18.0TreeItemId type instead of raw string (#20233) @flaviendelangle@mui/x-tree-view-pro@8.18.0 Same changes as in @mui/x-tree-view@8.18.0.
@mui/x-codemod@8.18.0Internal changes.
useAxes() hook documentation page (#20229) @JCQuintasNov 5, 2025
We'd like to extend a big thank you to the 13 contributors who made this release possible. Here are some highlights ✨:
Add colorGetter prop to cartesian charts series
🌎 Add Catalan (ca-ES) locale on the Data Grid
Special thanks go out to these community members for their valuable contributions: @frncesc, @Methuselah96, @samuelwalk, @htollefsen
The following team members contributed to this release: @alexfauquette, @bernardobelchior, @flaviendelangle, @Janpot, @JCQuintas, @mnajdova, @rita-codes, @arminmeh, @brijeshb42
@mui/x-data-grid@8.17.0editable prop is updated in the column definition (#20147) @arminmeh@mui/x-data-grid-pro@8.17.0 Same changes as in @mui/x-data-grid@8.17.0.
@mui/x-data-grid-premium@8.17.0 Same changes as in @mui/x-data-grid-pro@8.17.0.
@mui/x-date-pickers@8.17.0Internal changes.
@mui/x-date-pickers-pro@8.17.0 Same changes as in @mui/x-date-pickers@8.17.0.
@mui/x-charts@8.17.0barLabel to bar series. Deprecate barLabel in BarPlot. (#20184) @bernardobelchiorChartsSurface classes (#20180) @bernardobelchioroverflow: scroll container (#20182) @bernardobelchior@mui/x-internals (#20052) @alexfauquette@mui/x-internals (#20121) @alexfauquetteuseDataset hook (#20205) @JCQuintas@mui/x-charts-pro@8.17.0 Same changes as in @mui/x-charts@8.17.0, plus:
@mui/x-charts-premium@8.17.0 Same changes as in @mui/x-charts-pro@8.17.0.
@mui/x-tree-view@8.17.0expandedItems prop (#20181) @Methuselah96aria-checked instead of aria-selected on items (#19851) @flaviendelangle@mui/x-tree-view-pro@8.17.0 Same changes as in @mui/x-tree-view@8.17.0.
@mui/x-codemod@8.17.0Internal changes.
getInitialProps with getStaticProps (#20192) @JanpotOct 29, 2025
We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
brush zoom interaction to chartsSpecial thanks go out to the community members for their valuable contributions: @felix-wg, @frncesc, @sai6855
The following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @brijeshb42, @flaviendelangle, @JCQuintas, @MBilalShafi, @mbrookes, @michelengelen, @noraleonte, @rita-codes
@mui/x-data-grid@8.16.0Ctrl+A key combination for the row selection in the community version (#20110) @felix-wg@mui/x-data-grid-pro@8.16.0 Same changes as in @mui/x-data-grid@8.16.0, plus:
getVisibleRowsLookup() to fix the build with tsc (#20116) @arminmeh@mui/x-data-grid-premium@8.16.0 Same changes as in @mui/x-data-grid-pro@8.16.0, plus:
valueFormatter() crash (#20070) @sai6855@mui/x-date-pickers@8.16.0@mui/x-date-pickers-pro@8.16.0 Same changes as in @mui/x-date-pickers@8.16.0.
@mui/x-charts@8.16.0undefined id and color in series (#20087) @bernardobelchioruseMemo from isZoomOnEnabled and isPanOnEnabled hooks (#20132) @Copilot@mui/x-charts-pro@8.16.0 Same changes as in @mui/x-charts@8.16.0, plus:
brush zoom interaction (#19899) @JCQuintas@mui/x-charts-premium@8.16.0 Same changes as in @mui/x-charts-pro@8.16.0.
@mui/x-tree-view@8.16.0Internal changes.
@mui/x-tree-view-pro@8.16.0 Same changes as in @mui/x-tree-view@8.16.0.
@mui/x-codemod@8.16.0Internal changes.
rows prop documentation (#20127) @MBilalShafiOct 23, 2025
We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
brush charts interaction for building custom behavior.
Special thanks go out to the community members for their valuable contributions: @ZagrebaAlex
The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @prakhargupta1, @rita-codes, @siriwatknp, @arminmeh, @brijeshb42, @noraleonte
@mui/x-data-grid@8.15.0dataSource.fetchRows API's return type (#20068) @arminmeh@mui/x-data-grid-pro@8.15.0 Same changes as in @mui/x-data-grid@8.15.0, plus:
@mui/x-data-grid-premium@8.15.0 Same changes as in @mui/x-data-grid-pro@8.15.0, plus:
@mui/x-date-pickers@8.15.0Internal changes.
@mui/x-date-pickers-pro@8.15.0 Same changes as in @mui/x-date-pickers@8.15.0.
@mui/x-charts@8.15.0ChartsBrushOverlay and allow brush configuration (#19956) @JCQuintasgetStringSize benchmark. Remove benchmarks from built package. (#19995) @bernardobelchiorgetStringSize and batchMeasureStrings performance (#19996) @bernardobelchior@mui/x-charts-pro@8.15.0 Same changes as in @mui/x-charts@8.15.0, plus:
axis.reverse (#20031) @JCQuintas@mui/x-charts-premium@8.15.0 Same changes as in @mui/x-charts-pro@8.15.0.
@mui/x-tree-view@8.15.0@mui/x-tree-view-pro@8.15.0 Same changes as in @mui/x-tree-view@8.15.0.
@mui/x-codemod@8.14.0Internal changes.
environment: 'browser' from vitest browser config (#19993) @bernardobelchiorOct 16, 2025
We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @djpremier, @jacknot, @justdoit1897, @mellis481, @sai6855
The following are all team members who have contributed to this release: @arminmeh, @bernardobelchior, @brijeshb42, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @noraleonte, @siriwatknp
@mui/x-data-grid@8.14.1isCellEditable prop change (#19898) @cherniavskii@mui/x-data-grid-pro@8.14.1 Same changes as in @mui/x-data-grid@8.14.1, plus:
@mui/x-data-grid-premium@8.14.1 Same changes as in @mui/x-data-grid-pro@8.14.1.
@mui/x-date-pickers@8.14.1Internal changes.
@mui/x-date-pickers-pro@8.14.1 Same changes as in @mui/x-date-pickers@8.14.1.
@mui/x-charts@8.14.1minBarSize when y-axis is reversed (#19932) @bernardobelchiordatasetKeys.id not being optional (#19897) @bernardobelchiorGaugeValueArc having wrong class (#19965) @bernardobelchiorundefined path when highlight empty line chart axis (#19969) @bernardobelchior@mui/x-charts-pro@8.14.1 Same changes as in @mui/x-charts@8.14.1, plus:
highlighting to Sankey chart (#19662) @JCQuintas@mui/x-charts-premium@8.14.1 Same changes as in @mui/x-charts-pro@8.14.1.
@mui/x-tree-view@8.14.1ownerState to the icon (#19772) @flaviendelangle@mui/x-tree-view-pro@8.14.1 Same changes as in @mui/x-tree-view@8.14.1.
@mui/x-codemod@8.14.0Internal changes.
'bumpX' and 'bumpY' curve types to the interpolation demo (#19676) @djpremierisExpanded type in tree view docs (#19092) @mellis481Oct 9, 2025
We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
pressAndDrag gesture. Pan by pressing and dragging.Special thanks go out to the community members for their valuable contributions: @djpremier, @Utkarsh-0304
The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @flaviendelangle, @hasdfa, @Janpot, @JCQuintas, @prakhargupta1, @rita-codes, @noraleonte, @brijeshb42, @arminmeh, @michelengelen
@mui/x-data-grid@8.14.0@mui/x-data-grid-pro@8.14.0 Same changes as in @mui/x-data-grid@8.14.0.
@mui/x-data-grid-premium@8.14.0 Same changes as in @mui/x-data-grid-pro@8.14.0, plus:
@mui/x-date-pickers@8.14.0autoCapitalize value for Firefox compatibility (#19285) @michelengelen@mui/x-date-pickers-pro@8.14.0 Same changes as in @mui/x-date-pickers@8.14.0.
@mui/x-charts@8.14.0pressAndDrag pan gesture (#19779) @JCQuintasminPointers and maxPointers to be configured by pointer type (#19794) @JCQuintas@mui/x-charts-pro@8.14.0 Same changes as in @mui/x-charts@8.14.0.
@mui/x-charts-premium@8.14.0 Same changes as in @mui/x-charts-pro@8.14.0.
@mui/x-tree-view@8.14.0@mui/x-tree-view-pro@8.14.0 Same changes as in @mui/x-tree-view@8.14.0.
@mui/x-codemod@8.14.0Internal changes.
baseUrl (#19837) @Janpotlodash with es-toolkit (#19853) @bernardobelchiorlodash (#19864) @bernardobelchiortitle knob (#19792) @JCQuintasOct 1, 2025
@mui/x-charts-pro failure on import due to missing @mui/x-internals release@mui/x-data-grid@8.13.1Internal changes.
@mui/x-data-grid-pro@8.13.1 Same changes as in @mui/x-data-grid@8.13.1.
@mui/x-data-grid-premium@8.13.1 Same changes as in @mui/x-data-grid-pro@8.13.1.
@mui/x-date-pickers@8.12.0Internal changes.
@mui/x-date-pickers-pro@8.12.0 Same changes as in @mui/x-date-pickers@8.12.0.
@mui/x-charts@8.13.1Internal changes.
@mui/x-charts-pro@8.13.1 Same changes as in @mui/x-charts@8.13.1, plus:
@mui/x-charts-pro failure on import due to missing @mui/x-internals release @bernardobelchior@mui/x-charts-premium@8.13.1 Same changes as in @mui/x-charts-pro@8.13.1.
@mui/x-tree-view@8.13.1Internal changes.
@mui/x-tree-view-pro@8.13.1 Same changes as in @mui/x-tree-view@8.13.1.
@mui/x-codemod@8.12.0Internal changes.
Oct 1, 2025
We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
tapAndDrag gesture. Zoom in/out by tapping twice and dragging vertically.<BarChartPro
zoomInteractionConfig={{
// Only zoom when Control key is pressed
zoom: [{ type: 'wheel', keys: ['Control'] }],
// Only pan when Shift key is pressed
pan: [{ type: 'drag', keys: ['Shift'] }],
}}
/>Special thanks go out to the community members for their valuable contributions: @sai6855
The following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @flaviendelangle, @hasdfa, @Janpot, @JCQuintas, @KenanYusuf, @mapache-salvaje, @MBilalShafi, @mnajdova, @rita-codes, @siriwatknp
@mui/x-data-grid@8.13.0slotProps not being applied (#19769) @sai6855fetchRows() when strategy is not initialized (#19728) @MBilalShafi@mui/x-data-grid-pro@8.13.0 Same changes as in @mui/x-data-grid@8.13.0, plus:
@mui/x-data-grid-premium@8.13.0 Same changes as in @mui/x-data-grid-pro@8.13.0, plus:
metadata.referenceId to AI assistant prompt resolver (#19695) @hasdfa@mui/x-date-pickers@8.12.0Internal changes.
@mui/x-date-pickers-pro@8.12.0 Same changes as in @mui/x-date-pickers@8.12.0.
@mui/x-charts@8.13.0tapAndDrag zoom gesture (#19727) @JCQuintas@mui/x-charts-pro@8.13.0 Same changes as in @mui/x-charts@8.13.0, plus:
@mui/x-charts-premium@8.13.0 Same changes as in @mui/x-charts-pro@8.13.0.
@mui/x-tree-view@8.13.0apiRef type of each Tree View component (#19543) @flaviendelangle@mui/x-tree-view-pro@8.13.0 Same changes as in @mui/x-tree-view@8.13.0.
@mui/x-codemod@8.12.0Internal changes.
FocusedMark API page (#19773) @bernardobelchiorreleaseInfo (#19674) @Janpotpnpm-lock.yaml broken lockfile (#19755) @bernardobelchiorSep 25, 2025
Release highlight ✨:
@mui/x-data-grid@8.12.1Internal changes.
@mui/x-data-grid-pro@8.12.1 Same changes as in @mui/x-data-grid@8.12.1.
@mui/x-data-grid-premium@8.12.1 Same changes as in @mui/x-data-grid-pro@8.12.1, plus:
Sep 25, 2025
We'd like to extend a big thank you to the 15 contributors who made this release possible. Here are some highlights ✨:
renderer="svg-batch" prop to Scatter charts that provides improved performance for large datasets@mui/x-codemod minimum supported Node version is 20.19.
This was only the case due to using the v18 yargs package; this now explicitly aligns with it. (#18979)
Special thanks go out to the community members for their valuable contributions: @deade1e, @sai6855, @thomas-mcdonald
The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @flaviendelangle, @Janpot, @JCQuintas, @LukasTy, @michelengelen, @prakhargupta1, @rita-codes, @siriwatknp, @arminmeh, @romgrk
@mui/x-data-grid@8.12.0@mui/x-data-grid-pro@8.12.0 Same changes as in @mui/x-data-grid@8.12.0.
@mui/x-data-grid-premium@8.12.0 Same changes as in @mui/x-data-grid-pro@8.12.0, plus:
@mui/x-date-pickers@8.12.0slotProps.textField.slotProps.htmlInput resolution (#19713) @LukasTy@mui/x-date-pickers-pro@8.12.0 Same changes as in @mui/x-date-pickers@8.12.0.
@mui/x-charts@8.12.0getAxisExtremum (#19627) @bernardobelchiorgetAxisScale (#19673) @bernardobelchior@mui/x-charts-pro@8.12.0 Same changes as in @mui/x-charts@8.12.0, plus:
valueFormatter to sankey (#19636) @JCQuintassource/target keywords in sankey link color (#19634) @JCQuintasSankeyChart (#19659) @JCQuintasmax and filterMode: 'discard' (#19200) @bernardobelchior@mui/x-charts-premium@8.12.0 Same changes as in @mui/x-charts-pro@8.12.0, plus:
@mui/x-tree-view@8.12.0null to the icon slots (#19569) @flaviendelangleapiRef.current.isItemExpanded() method (#19619) @flaviendelangle@mui/x-tree-view-pro@8.12.0 Same changes as in @mui/x-tree-view@8.12.0.
@mui/x-codemod@8.12.0engines.node to >=20.19 to align with yargs package (#18979) @LukasTyExportServerSideData demo layout shift (#19669) @siriwatknpupdateRow() description (#19554) @deade1etsx files in visual regression (#19595) @JCQuintasDEFAULT_TIMESTAMP format to ISO 8601 (#19624) @JanpotfindLatestTaggedVersion to filter tags based on major version (#19693) @michelengelencreateReleasePR.mjs (#19702) @bernardobelchiorx-charts-premium releasable (#18959) @JCQuintascreate-playground script only runs if target file is absent (#19603) @michelengelenmatchPackageNames to matchDepNames for date-fns-v2 @JanpotSep 16, 2025
We'd like to extend a big thank you to the 11 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @sai6855
The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @brijeshb42, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @LukasTy, @rita-codes, @siriwatknp
@mui/x-data-grid@8.11.3operator types to display literal values (#19529) @siriwatknp@mui/x-data-grid-pro@8.11.3 Same changes as in @mui/x-data-grid@8.11.3.
@mui/x-data-grid-premium@8.11.3 Same changes as in @mui/x-data-grid-pro@8.11.3.
@mui/x-date-pickers@8.11.3slots and slotProps propagation strategy (#18867) @LukasTy@mui/x-date-pickers-pro@8.11.3 Same changes as in @mui/x-date-pickers@8.11.3.
@mui/x-charts@8.11.3inline- piecewise legend options (#19382) @JCQuintasisBandScale to isDiscreteScale (#19514) @bernardobelchior@mui/x-charts-pro@8.11.3 Same changes as in @mui/x-charts@8.11.3, plus:
@mui/x-tree-view@8.11.3removeItem event (#19500) @flaviendelangle@mui/x-tree-view-pro@8.11.3 Same changes as in @mui/x-tree-view@8.11.3.
@mui/x-codemod@8.11.3Internal changes.
shiny bar chart example at the top (#19416) @JCQuintasSep 10, 2025
We'd like to extend a big thank you to the 13 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @ludvigeriksson, @sai6855
The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @brijeshb42, @flaviendelangle, @Janpot, @LukasTy, @MBilalShafi, @noraleonte, @rita-codes, @romgrk, @siriwatknp
@mui/x-data-grid@8.11.2stringify() for theme objects (#19427) @romgrk@mui/x-data-grid-pro@8.11.2 Same changes as in @mui/x-data-grid@8.11.2.
@mui/x-data-grid-premium@8.11.2 Same changes as in @mui/x-data-grid-pro@8.11.2, plus:
0 as total aggregation value when aggregation position is set to null for row groups (#19515) @cherniavskii@mui/x-date-pickers@8.11.2textField.slotProps (#18980) @LukasTycalendarState.currentMonth in Month Calendar when available (#19073) @LukasTyid and aria-labelledby attributes from spinbuttons (#19523) @LukasTy@mui/x-date-pickers-pro@8.11.2 Same changes as in @mui/x-date-pickers@8.11.2.
@mui/x-charts@8.11.2ChartsXAxis and ChartsYAxis (#19198) @bernardobelchiorgetRange and createDateFormatter (#19517) @bernardobelchiorfilterMode: 'discard' (#19199) @bernardobelchior@mui/x-charts-pro@8.11.2 Same changes as in @mui/x-charts@8.11.2.
@mui/x-tree-view@8.11.2props.items in the getItemTree() method (#19483) @flaviendelangle@mui/x-tree-view-pro@8.11.2 Same changes as in @mui/x-tree-view@8.11.2.
@mui/x-codemod@8.11.2Internal changes.
Sep 4, 2025
We'd like to extend a big thank you to the 6 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @sai6855
The following are all team members who have contributed to this release: @brijeshb42, @flaviendelangle, @JCQuintas, @mapache-salvaje, @oliviertassinari
@mui/x-data-grid@8.11.1GridCell component (#19384) @sai6855@mui/x-data-grid-pro@8.11.1 Same changes as in @mui/x-data-grid@8.11.1.
@mui/x-data-grid-premium@8.11.1 Same changes as in @mui/x-data-grid-pro@8.11.1.
@mui/x-date-pickers@8.11.1slotProps for input adornment in PickerFieldUI component (#19399) @sai6855@mui/x-date-pickers-pro@8.11.1 Same changes as in @mui/x-date-pickers@8.11.1.
@mui/x-charts@8.11.1axisId when composing (#19397) @JCQuintas@mui/x-charts-pro@8.11.1 Same changes as in @mui/x-charts@8.11.1.
@mui/x-tree-view@8.11.1@mui/x-tree-view-pro@8.11.1 Same changes as in @mui/x-tree-view@8.11.1.
@mui/x-codemod@8.11.1Internal changes.
Aug 29, 2025
We'd like to extend a big thank you to the 19 contributors who made this release possible. Here are some highlights ✨:
📊 Add new SankeyChart
🚀 Data Grid row grouping now supports row reordering
See the Drag-and-drop group reordering section for more details.
📚 Documentation improvements
Special thanks go out to the community members for their valuable contributions: @dwrth, @lauri865, @Webini
The following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @brijeshb42, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @mapache-salvaje, @MBilalShafi, @michelengelen, @noraleonte, @oliviertassinari, @rita-codes, @romgrk, @sai6855, @siriwatknp
@mui/x-data-grid@8.11.0columnUnsortedIcon slot back (#19268) @arminmehmenu role to the empty actions menu (#19338) @arminmehcolumnsManagementRow style override slot not working (#19097) @dwrth@mui/x-data-grid-pro@8.11.0 Same changes as in @mui/x-data-grid@8.11.0, plus:
multipleColumnsSortingMode="always" (#19099) @MBilalShafikeepColumnPositionIfDraggedOutside is enabled (#19372) @arminmeh@mui/x-data-grid-premium@8.11.0 Same changes as in @mui/x-data-grid-pro@8.11.0, plus:
valueFormatter issues when rowGroupingColumnMode="single" (#18967) @cherniavskii@mui/x-date-pickers@8.11.0startContainer is a restricted object (#18772) @Webini@mui/x-date-pickers-pro@8.11.0 Same changes as in @mui/x-date-pickers@8.11.0.
@mui/x-charts@8.11.0RadarAxis component to render labels (#19240) @alexfauquettefill and stroke properties (#19316) @sai6855hideLegend prop description in docs (#19371) @sai6855@mui/x-charts-pro@8.11.0 Same changes as in @mui/x-charts@8.11.0, plus:
SankeyChart (#18895) @JCQuintas@mui/x-tree-view@8.11.0slotProps (#19247) @flaviendelangle@mui/x-tree-view-pro@8.11.0 Same changes as in @mui/x-tree-view@8.11.0.
@mui/x-codemod@8.11.0Internal changes.
synchronize to workflow triggers (#19342) @michelengelenAug 20, 2025
We'd like to extend a big thank you to the 10 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @lauri-heinonen-2025-04, @Methuselah96, @sai6855, @wilcoschoneveld
The following are all team members who have contributed to this release: @alexfauquette, @cherniavskii, @flaviendelangle, @Janpot, @oliviertassinari, @rita-codes
@mui/x-data-grid@8.10.2<GridEditSingleSelect /> when density='compact' (#19249) @sai6855disableColumnSorting (#19222) @wilcoschoneveld@mui/x-data-grid-pro@8.10.2 Same changes as in @mui/x-data-grid@8.10.2, plus:
@mui/x-data-grid-premium@8.10.2 Same changes as in @mui/x-data-grid-pro@8.10.2.
@mui/x-date-pickers@8.10.2Internal changes.
@mui/x-date-pickers-pro@8.10.2 Same changes as in @mui/x-date-pickers@8.10.2.
@mui/x-charts@8.10.2Internal changes.
@mui/x-charts-pro@8.10.2 Same changes as in @mui/x-charts@8.10.2.
@mui/x-tree-view@8.10.2aria-hidden to the Tree Item Checkbox (#19246) @flaviendelangle@mui/x-tree-view-pro@8.10.2 Same changes as in @mui/x-tree-view@8.10.2.
@mui/x-codemod@8.10.2Internal changes.
renovate.json @oliviertassinariexeca update (#19229) @JanpotAug 15, 2025
We'd like to extend a big thank you to the 11 contributors who made this release possible. Here are some highlights ✨:
band and point scales.The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @Janpot, @JCQuintas, @mnajdova, @oliviertassinari, @prakhargupta1, @romgrk, @brijeshb42, @noraleonte, @rita-codes
@mui/x-data-grid@8.10.1@mui/x-data-grid-pro@8.10.1 Same changes as in @mui/x-data-grid@8.10.1.
@mui/x-data-grid-premium@8.10.1 Same changes as in @mui/x-data-grid-pro@8.10.1.
@mui/x-date-pickers@8.10.0Internal changes.
@mui/x-date-pickers-pro@8.10.0 Same changes as in @mui/x-date-pickers@8.10.0.
Axes can now be grouped by category when using band and point scales
@mui/x-charts@8.10.1@mui/x-charts-pro@8.10.1 Same changes as in @mui/x-charts@8.10.1.
@mui/x-tree-view@8.10.1@mui/x-tree-view-pro@8.10.1 Same changes as in @mui/x-tree-view@8.10.1.
@mui/x-codemod@8.10.1Internal changes.
:catalog for @babel/runtime (#19028) @oliviertassinarifs-extra removal from formattedTSDemos script (#19132) @bernardobelchiorfs-extra with node:fs where possible (#19127) @bernardobelchiorlockFileMaintenance simple @oliviertassinarilockFileMaintenance is enabled @oliviertassinariAug 8, 2025
We'd like to extend a big thank you to the 17 contributors who made this release possible. Here are some highlights ✨:
FunnelChart marked as stableSpecial thanks go out to the community members for their valuable contributions: @AnderzL7, @aqeelat, @dwrth, @noobyogi0010, @nusr, @sai6855
The following are all team members who have contributed to this release: @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @mapache-salvaje, @MBilalShafi, @oliviertassinari, @rita-codes, @romgrk
@mui/x-data-grid@8.10.0BaseSelect to allow variant change (#19026) @dwrthuse-sync-external-store shim (#19063) @romgrkdataSource.fetchRows() API method (#18904) @MBilalShafipreProcessEditCellProps() if cell is not editable based on isCellEditable() (#18405) @nusrrenderCountry throwing an error when used in tree data (#19068) @cherniavskiislotProps being ignored by the grid (#19095) @romgrk@mui/x-data-grid-pro@8.10.0 Same changes as in @mui/x-data-grid@8.10.0, plus:
@mui/x-data-grid-premium@8.10.0 Same changes as in @mui/x-data-grid-pro@8.10.0, plus:
valueFormatter (#18982) @arminmehsingleSelect columns not working in pivot model (#18971) @cherniavskii@mui/x-date-pickers@8.10.0MuiPickersLayout-toolbar is overlapping the Calendar in RTL MobileDatePicker variant (#18981) @rita-codes@mui/x-date-pickers-pro@8.10.0 Same changes as in @mui/x-date-pickers@8.10.0.
@mui/x-charts@8.10.0groups to band and point axis config (#18766) @JCQuintasmotion library (#18993) @JCQuintasUnstable_ radar exports (#19079) @JCQuintasvalueFormatter in heatmap (#19047) @sai6855@mui/x-charts-pro@8.10.0 Same changes as in @mui/x-charts@8.10.0, plus:
slotProps.tooltip.trigger not respected in ScatterChartPro and FunnelChart (#18902) @bernardobelchiorFunnelChart as stable (#19048) @JCQuintascreateAxisFilterMapper (#18998) @bernardobelchior@mui/x-tree-view@8.10.0Internal changes.
@mui/x-tree-view-pro@8.10.0 Same changes as in @mui/x-tree-view@8.10.0.
@mui/x-codemod@8.10.0Internal changes.
RichTreeViewPro demo for dragging via custom drag-handle is not working properly (#19008) @rita-codesPORT env on docs:dev script (#19014) @JCQuintasmodule field (#18961) @Janpot@mui/system (#19062) @aqeelatJul 31, 2025
We'd like to extend a big thank you to the 23 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @AmrElnaggar99, @atlanteh, @ddolcimascolo, @Jiseoup, @leonaha5, @noherczeg, @sai6855
The following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @bharatkashyap, @brijeshb42, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @mapache-salvaje, @MBilalShafi, @rita-codes, @romgrk, @siriwatknp
@mui/x-data-grid@8.9.2<GridEditSingleSelect /> (#18184) @sai6855@mui/x-data-grid-pro@8.9.2 Same changes as in @mui/x-data-grid@8.9.2, plus:
@mui/x-data-grid-premium@8.9.2 Same changes as in @mui/x-data-grid-pro@8.9.2, plus:
privateMode to AI assistant prompt resolver (#18759) @bharatkashyapvalueFormatter() (#18916) @cherniavskiiapi param for the aggregation function optional (#18984) @arminmeh@mui/x-date-pickers@8.9.2@mui/x-date-pickers-pro@8.9.2 Same changes as in @mui/x-date-pickers@8.9.2.
@mui/x-charts@8.9.2valueFormatter() (#18877) @sai6855ChartsWrapper from './ChartsWrapper' rather than './internals' (#18966) @JCQuintas@mui/x-charts-pro@8.9.2 Same changes as in @mui/x-charts@8.9.2, plus:
@mui/x-codemod@8.9.2Internal changes.
variant to pickerVariant (#18919) @AmrElnaggar99Jul 21, 2025
We'd like to extend a big thank you to the 2 contributors who made this release possible. Here are some highlights ✨:
🐞 Fix package publish issue
The following are all team members who have contributed to this release: @KenanYusuf, @MBilalShafi
@mui/x-data-grid@8.9.1gridVisibleColumnDefinitionsSelector (#18724) @KenanYusuf@mui/x-data-grid-pro@8.9.1 Same changes as in @mui/x-data-grid@8.9.1.
@mui/x-data-grid-premium@8.9.1 Same changes as in @mui/x-data-grid-pro@8.9.1.
Jul 17, 2025
We'd like to extend a big thank you to the 10 contributors who made this release possible. Here are some highlights ✨:
✨ Improve the drag and drop interaction for Data Grid row reordering feature. It uses a drop indicator to point to the position the row would be moving to.
https://github.com/user-attachments/assets/37284c4f-e8d4-4fc6-a6af-a780592905ef
🚀 Improve Data Grid Pivoting and Aggregation performance
📊 Add minBarSize to set a minimum height for bars
Special thanks go out to the community members for their valuable contributions: @lauri865
The following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @flaviendelangle, @JCQuintas, @LukasTy, @mapache-salvaje, @noraleonte, @MBilalShafi
@mui/x-data-grid@8.9.0Internal changes.
@mui/x-data-grid-pro@8.9.0 Same changes as in @mui/x-data-grid@8.9.0, plus:
@mui/x-data-grid-premium@8.9.0 Same changes as in @mui/x-data-grid-pro@8.9.0, plus:
@mui/x-date-pickers@8.9.0AdapterDayjs (#18429) @flaviendelangletimeSteps JSDoc (#18807) @LukasTy@mui/x-date-pickers-pro@8.9.0 Same changes as in @mui/x-date-pickers@8.9.0.
@mui/x-charts@8.9.0minBarSize to prevent bars from having 0 height (#18798) @JCQuintasminBarSize now ignores 0 and null values (#18816) @JCQuintas@mui/x-charts-pro@8.9.0 Same changes as in @mui/x-charts@8.9.0 plus:
[charts-pro] Fix issue where charts gestures weren't properly working when inside the shadow-dom (#18837) @JCQuintas
@mui/x-tree-view@8.9.0Internal changes.
@mui/x-tree-view-pro@8.9.0 Same changes as in @mui/x-tree-view@8.9.0.
@mui/x-codemod@8.9.0Internal changes.
import restriction rule for test files (#18669) @LukasTy@testing-library/jest-dom (#18800) @bernardobelchioreslint-plugin-mui-x (#18797) @bernardobelchiorJul 11, 2025
We'd like to extend a big thank you to the 13 contributors who made this release possible. Here are some highlights ✨:
📊 Chart zoom preview can be enabled
🌎 Add Indonesian (id-ID) locale on the Data Grid
Special thanks go out to the community members for their valuable contributions: @kennarddh
The following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @noraleonte, @prakhargupta1, @rita-codes, @siriwatknp
@mui/x-data-grid@8.8.0useGridSelector missing subscription in React.StrictMode (#18676) @cherniavskiiz-index (#18688) @KenanYusuf@mui/x-data-grid-pro@8.8.0 Same changes as in @mui/x-data-grid@8.8.0, plus:
@mui/x-data-grid-premium@8.8.0 Same changes as in @mui/x-data-grid-pro@8.8.0.
@mui/x-date-pickers@8.8.0Internal changes.
@mui/x-date-pickers-pro@8.8.0 Same changes as in @mui/x-date-pickers@8.8.0.
@mui/x-charts@8.8.0@mui/x-charts-pro@8.8.0 Same changes as in @mui/x-charts@8.8.0, plus:
funnelDirection to control pyramid direction (#18568) @JCQuintasonBeforeExport callback (#18722) @bernardobelchior@mui/x-tree-view@8.8.0checkboxSelection are enabled (#18749) @rita-codes@mui/x-tree-view-pro@8.8.0 Same changes as in @mui/x-tree-view@8.8.0.
@mui/x-codemod@8.8.0Internal changes.
size column filtering in files tree demo (#17952) @cherniavskiillms.txt for X and their products (#18595) @siriwatknp@mui/* packages are picked by Material UI renovate group (#18711) @LukasTyprettier config resolving (#18720) @LukasTyJul 4, 2025
We'd like to extend a big thank you to the 15 contributors who made this release possible. Here are some highlights ✨:
useChartProApiRef for easier access to the APIreferenceDate props on range componentsSpecial thanks go out to the community members for their valuable contributions: @ShahrazH, @vadimkuragkovskiy, @whythecode
The following are all team members who have contributed to this release: @alexfauquette, @brijeshb42, @mapache-salvaje, @arminmeh, @bernardobelchior, @bharatkashyap, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen, @rita-codes
@mui/x-data-grid@8.7.0@mui/x-data-grid-pro@8.7.0 Same changes as in @mui/x-data-grid@8.7.0.
@mui/x-data-grid-premium@8.7.0 Same changes as in @mui/x-data-grid-pro@8.7.0.
@mui/x-date-pickers@8.7.0start and end referenceDate props on range components (#18549) @LukasTy@mui/x-date-pickers-pro@8.7.0 Same changes as in @mui/x-date-pickers@8.7.0.
@mui/x-charts@8.7.0ChartsReferenceLineProps (#18598) @bernardobelchior@mui/x-charts-pro@8.7.0 Same changes as in @mui/x-charts@8.7.0, plus:
useChartProApiRef for easier refs (#18013) @JCQuintasuseChartApiContext to useChartProApiContext (#18565) @JCQuintas@mui/x-tree-view@8.7.0Internal changes.
@mui/x-tree-view-pro@8.7.0 Same changes as in @mui/x-tree-view@8.7.0, plus:
dataSource JSDoc (#18650) @LukasTydocument object (#18657) @vadimkuragkovskiymaterial-ui/disallow-react-api-in-server-components ESLint rule is applied (#18570) @LukasTyJun 27, 2025
We'd like to extend a big thank you to the 12 contributors who made this release possible. Here are some highlights ✨:
📅 Add usePickerAdapter hook to access the date adapter.
You can use the adapter in your custom components if you need them to work with multiple date libraries — Learn more.
🌎 Improve Danish (da-DK) locale
Special thanks go out to the community members for their valuable contributions: @omalyutin, @ShahrazH, @vadimka123
The following are all team members who have contributed to this release: @arminmeh, @bernardobelchior, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @noraleonte, @rita-codes, @sai6855
@mui/x-data-grid@8.6.0label type in GridActionsCellItem type (#18175) @sai6855@mui/x-data-grid-pro@8.6.0 Same changes as in @mui/x-data-grid@8.6.0, plus:
@mui/x-data-grid-premium@8.6.0 Same changes as in @mui/x-data-grid-pro@8.6.0.
@mui/x-date-pickers@8.6.0usePickerAdapter hook (#18457) @LukasTyvalue when updating lastCommittedValue in internal state (#18518) @LukasTyusePickerAdapter hook internally instead of useUtils (#18465) @LukasTy@mui/x-date-pickers-pro@8.6.0 Same changes as in @mui/x-date-pickers@8.6.0.
@mui/x-charts@8.6.0data-series to charts legend item (#18414) @bernardobelchiordata-series to bar charts (#18413) @bernardobelchiordata-series to elements of line chart (#18409) @bernardobelchiordata-series to pie charts (#18432) @bernardobelchiorisElementInside helper (#18530) @JCQuintas@mui/x-charts-pro@8.6.0 Same changes as in @mui/x-charts@8.6.0, plus:
@mui/x-tree-view@8.6.0Internal changes.
@mui/x-tree-view-pro@8.6.0 Same changes as in @mui/x-tree-view@8.6.0, plus:
@mui/x-codemod@8.6.0Internal changes.
GridRenderContext (#18492) @arminmehnextOrAccept action (#18505) @LukasTyString.raw for creating the remote regex (#18462) @michelengelenJun 19, 2025
We'd like to extend a big thank you to the 10 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @alisasanib, @arminmeh, @sai6855
The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @flaviendelangle, @JCQuintas, @LukasTy, @MBilalShafi, @oliviertassinari
@mui/x-data-grid@8.5.3@mui/x-data-grid-pro@8.5.3 Same changes as in @mui/x-data-grid@8.5.3, plus:
rowCount response when new children are fetched with the data source (#17711) @arminmeh@mui/x-data-grid-premium@8.5.3 Same changes as in @mui/x-data-grid-pro@8.5.3.
@mui/x-date-pickers@8.5.3inputSizeSmall to classes interface (#18242) @sai6855@mui/x-date-pickers-pro@8.5.3 Same changes as in @mui/x-date-pickers@8.5.3.
@mui/x-charts@8.5.3tabIndex in surface and legend (#18344) @JCQuintas@mui/x-charts-pro@8.5.3 Same changes as in @mui/x-charts@8.5.3, plus:
FunnelChart label positioning with different curves (#18354) @JCQuintas@mui/x-tree-view@8.5.3Internal changes.
@mui/x-tree-view-pro@8.5.3 Same changes as in @mui/x-tree-view@8.5.3.
@mui/x-codemod@8.5.3Internal changes.
Playwright renovate group (#18397) @LukasTyCODEOWNERS for charts repositories (#18418) @JCQuintasURL usage for test config (#18444) @LukasTyvitest bundled types (#17758) @JCQuintasJun 12, 2025
We'd like to extend a big thank you to the 15 contributors who made this release possible. Here are some highlights ✨:
useSyncExternalStore import error in React 17Special thanks go out to the community members for their valuable contributions: @alisasanib, @noobyogi0010.
The following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @JCQuintas, @KenanYusuf, @LukasTy, @mapache-salvaje, @michelengelen, @noraleonte, @oliviertassinari, @prakhargupta1, @romgrk.
@mui/x-data-grid@8.5.2@mui/x-data-grid-pro@8.5.2 Same changes as in @mui/x-data-grid@8.5.2, plus:
@mui/x-data-grid-premium@8.5.2 Same changes as in @mui/x-data-grid-pro@8.5.2.
@mui/x-date-pickers@8.5.2PickerDay2 and DateRangePickerDay2 components (#15921) @noraleontehiddenLabel prop propagation (#18195) @noobyogi0010@mui/x-date-pickers-pro@8.5.2 Same changes as in @mui/x-date-pickers@8.5.2.
@mui/x-charts@8.5.2sx prop merging from useComponentRenderer (#18235) @bernardobelchioruseSyncExternalStore import error in React 17 (#18314) @bernardobelchior@mui/x-charts-pro@8.5.2 Same changes as in @mui/x-charts@8.5.2, plus:
gap prop does not impact the drawing area (#18233) @JCQuintasChartsToolbarPro types in pro charts (#18243) @bernardobelchior@mui/x-tree-view@8.5.2useSyncExternalStore import error in React 17 (#18314) @bernardobelchior@mui/x-tree-view-pro@8.5.2 Same changes as in @mui/x-tree-view@8.5.2.
React to 19.0.0 (#18265) @LukasTycatalog for reused dependencies (#18302) @LukasTyJun 5, 2025
We'd like to extend a big thank you to the 9 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @moosekebab, @TiagoPortfolio. The following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen, @arminmeh.
@mui/x-data-grid@8.5.1registerPipeProcessor() for Node v20 (#18241) @arminmehuseComponentRenderer from x-internals (#18203) @bernardobelchior@mui/x-data-grid-pro@8.5.1 Same changes as in @mui/x-data-grid@8.5.1, plus:
@mui/x-data-grid-premium@8.5.1 Same changes as in @mui/x-data-grid-pro@8.5.1.
@mui/x-date-pickers@8.5.1transformOrigin resolving based on popper placement (#18206) @LukasTy@mui/x-date-pickers-pro@8.5.1 Same changes as in @mui/x-date-pickers@8.5.1.
@mui/x-charts@8.5.1extendVertically (#18211) @JCQuintas@mui/x-charts-pro@8.5.1 Same changes as in @mui/x-charts@8.5.1, plus:
linear-sharp curve as alternative to square edge (#17966) @JCQuintasFunnelSectionLabel (#18061) @JCQuintas@mui/x-tree-view@8.5.1Internal changes.
@mui/x-tree-view-pro@8.5.1 Same changes as in @mui/x-tree-view@8.5.1.
valueFormatter signature in migration guide (#18226) @michelengelenprocessRowUpdate (#18213) @JCQuintasistanbul references (#18194) @JCQuintasmocha with vitest on e2e and regression tests (#18071) @JCQuintasno-direct-state-access tests (#18209) @JCQuintasplaywright docker image (#18186) @LukasTyMay 29, 2025
We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
RadarChartPro, FunnelChart and Heatmap as image and PDF.RadarChart is now stable.Special thanks go out to the community members for their valuable contributions: @xBlizZer, @sai6855, @alisasanib. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @oliviertassinari.
@mui/x-data-grid@8.5.0toggleColumn event type (#18023) @KenanYusufany type (#17979) @sai6855@mui/x-data-grid-pro@8.5.0 Same changes as in @mui/x-data-grid@8.5.0, plus:
@mui/x-data-grid-premium@8.5.0 Same changes as in @mui/x-data-grid-pro@8.5.0, plus:
GridApiPremium type (#18037) @arminmeh@mui/x-date-pickers@8.5.0Internal changes.
@mui/x-date-pickers-pro@8.5.0 Same changes as in @mui/x-date-pickers@8.5.0, plus:
@mui/x-charts@8.5.0render prop to charts toolbar components (#17649) @bernardobelchioruseFunnelSeries and useRadarSeries (#18034) @JCQuintasChartApi through context (#18004) @bernardobelchior@mui/x-charts-pro@8.5.0 Same changes as in @mui/x-charts@8.5.0, plus:
ChartAxisZoomSlider into smaller files (#18011) @bernardobelchior@mui/x-tree-view@8.5.0Internal changes.
@mui/x-tree-view-pro@8.5.0 Same changes as in @mui/x-tree-view@8.5.0.
babel-plugin-display-name in vitest (#17903) @JCQuintasponyfillGlobal usage (#18003) @LukasTybabel-plugin-display-name from npm (#18040) @LukasTyponyfillGlobal (#17986) @xBlizZerMay 21, 2025
We'd like to offer a big thanks to the 21 contributors who made this release possible. Here are some highlights ✨:
🔺 Support regular pyramid variation in the <FunnelChart /> component:
📚 Documentation improvements
Special thanks go out to the community members for their valuable contributions: @aizerin, @arminmeh, @campmarc, @jyash97, @mapache-salvaje, @noraleonte, @nusr, @ragnarr18, @romgrk, @whereisrmsqhs. Following are all team members who have contributed to this release: @alexfauquette, @bernardobelchior, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @rita-codes.
@mui/x-data-grid@8.4.0exclude selection model type if quick filter does not have actual values (#17899) @arminmeh@mui/x-data-grid-pro@8.4.0 Same changes as in @mui/x-data-grid@8.4.0, plus:
aria-expanded attribute to the master detail toggle button (#17122) @whereisrmsqhs@mui/x-data-grid-premium@8.4.0 Same changes as in @mui/x-data-grid-pro@8.4.0.
@mui/x-date-pickers@8.4.0disabled value is used when focusing or clicking (#17914) @aizerinPickersTextField overflow (#17942) @noraleonte@mui/x-date-pickers-pro@8.4.0 Same changes as in @mui/x-date-pickers@8.4.0.
@mui/x-charts@8.4.0isPointInside less often (#17850) @bernardobelchioruseAnimate test (#17777) @JCQuintasisXInside and isYInside (#17911) @bernardobelchior@mui/x-charts-pro@8.4.0 Same changes as in @mui/x-charts@8.4.0, plus:
Pyramid chart (#17783) @JCQuintas@mui/x-tree-view@8.4.0getItemChildren prop in RichTreeView (#17894) @rita-codesapiRef to toggle the editing status of an item (#17768) @rita-codes@mui/x-tree-view-pro@8.4.0 Same changes as in @mui/x-tree-view@8.4.0.
apiRef copy (#17776) @mapache-salvajedisplayName (#17845) @romgrkvitest cli (#17847) @JCQuintasisolatedModules=true in tsconfig (#17781) @JCQuintasMay 14, 2025
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @100pearlcent, @htollefsen, @JanPretzel, @sai6855. Following are all team members who have contributed to this release: @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @MBilalShafi, @oliviertassinari, @prakhargupta1.
@mui/x-data-grid@8.3.1reason param for onRowSelectionModelChange callback (#17545) @sai6855renderContext calculation loop (#17779) @cherniavskii@mui/x-data-grid-pro@8.3.1 Same changes as in @mui/x-data-grid@8.3.1.
@mui/x-data-grid-premium@8.3.1 Same changes as in @mui/x-data-grid-pro@8.3.1, plus:
@mui/x-date-pickers@8.3.1@mui/x-date-pickers-pro@8.3.1 Same changes as in @mui/x-date-pickers@8.3.1.
@mui/x-charts@8.3.1@mui/x-charts-pro@8.3.1 Same changes as in @mui/x-charts@8.3.1, plus:
@mui/x-tree-view@8.3.1Internal changes.
@mui/x-tree-view-pro@8.3.1 Same changes as in @mui/x-tree-view@8.3.1.
mocha with vitest for browser & jsdom tests (#14508) @JCQuintasMay 8, 2025
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
<FunnelChart />, including variant, borderRadius, pyramid, and step-pyramid curves.Special thanks go out to this community member for a valuable contribution: @ptuukkan. Team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @flaviendelangle, @Janpot, @JCQuintas, @LukasTy, @MBilalShafi, @rita-codes, @romgrk.
@mui/x-data-grid@8.3.0isRowSelectable prop (#17629) @MBilalShafipreProcessEditCellProps for non-editable columns when starting a row update (#17732) @arminmeh@mui/x-data-grid-pro@8.3.0 Same changes as in @mui/x-data-grid@8.3.0.
@mui/x-data-grid-premium@8.3.0 Same changes as in @mui/x-data-grid-pro@8.3.0.
@mui/x-date-pickers@8.3.0DigitalClock stealing focus from a Picker open button on close (#17686) @LukasTy@mui/x-date-pickers-pro@8.3.0 Same changes as in @mui/x-date-pickers@8.3.0, plus:
The <FunnelChart /> series now accepts a variant='outlined' prop for a simpler style.
Add a borderRadius property to <FunnelChart />. All funnels have 8px as a default value.
Add a pyramid curve to <FunnelChart />, which allows creation of a pyramid-shaped funnel.
Add a step-pyramid curve to <FunnelChart />, which creates a stepped-pyramid like shape.
@mui/x-charts@8.3.0<PieArcLabel /> not taking arcLabelRadius into account (#17655) @bernardobelchior<MarkElement /> performance (#17546) @bernardobelchiormaterialSlots internal constant (#17710) @bernardobelchior@mui/x-charts-pro@8.3.0 Same changes as in @mui/x-charts@8.3.0, plus:
pyramid curve to <FunnelChart /> (#17665) @JCQuintasvariant='outlined' to <FunnelChart /> series (#17661) @JCQuintasborderRadius property to <FunnelChart /> (#17660) @JCQuintas@mui/x-tree-view@8.3.0@mui/x-tree-view-pro@8.3.0 Same changes as in @mui/x-tree-view@8.3.0.
node types in the built packages (#17533) @LukasTypkg.pr.new publishing (#17402) @JanpotMay 1, 2025
We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
<FunnelChart/> now uses the strawberrySky sequential color palette by default.
apiRef.exportAsImage — Learn more.Special thanks go out to the community members for their valuable contributions: @federico-ntr, @nusr. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @hasdfa, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @oliviertassinari, @romgrk.
@mui/x-data-grid@8.2.0defaultProps causing unwanted re-renders (#17490) @KenanYusuf<GridEditInputCell /> break input (#16773) @nusr@mui/x-data-grid-pro@8.2.0 Same changes as in @mui/x-data-grid@8.2.0, plus:
@mui/x-data-grid-premium@8.2.0 Same changes as in @mui/x-data-grid-pro@8.2.0.
@mui/x-date-pickers@8.2.0@mui/x-date-pickers-pro@8.2.0 Same changes as in @mui/x-date-pickers@8.2.0.
@mui/x-charts@8.2.0<circle /> for circular legend mark (#17590) @alexfauquette@mui/x-charts-pro@8.2.0 Same changes as in @mui/x-charts@8.2.0, plus:
gap option to <FunnelChart /> (#17642) @JCQuintas<FunnelChart /> (#17606) @JCQuintas@mui/x-tree-view@8.2.0Internal changes.
@mui/x-tree-view-pro@8.2.0 Same changes as in @mui/x-tree-view@8.2.0.
groupingColDef reference needs to be stable (#17544) @arminmeh@next usages (#17542) @LukasTyloadStyleSheets to internals and use it in data grid and charts (#17548) @bernardobelchiorvitest changes (#17619) @JCQuintasclock=fake and add async act for datagrid (#17563) @JCQuintasbranch switch comments (#17589) @michelengelenApr 24, 2025
We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
apiRef.exportAsPrint().Special thanks go out to the community members for their valuable contributions: @lhilgert9, @ArturAghakaryan, @sai6855. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @JCQuintas, @joserodolfofreitas, @KenanYusuf, @LukasTy, @mapache-salvaje, @oliviertassinari, @romgrk.
@mui/x-data-grid@8.1.0material prop (#17513) @KenanYusuf@mui/x-data-grid-pro@8.1.0 Same changes as in @mui/x-data-grid@8.1.0, plus:
@mui/x-data-grid-premium@8.1.0 Same changes as in @mui/x-data-grid-pro@8.1.0.
@mui/x-date-pickers@8.1.0PickersInputBase owner state typing (#17478) @LukasTy@mui/x-date-pickers-pro@8.1.0 Same changes as in @mui/x-date-pickers@8.1.0.
apiRef.exportAsPrint().@mui/x-charts@8.1.0rafThrottle on event handlers instead of setter (#17489) @bernardobelchior@mui/x-charts-pro@8.1.0 Same changes as in @mui/x-charts@8.1.0, plus:
initialZoom (#17500) @bernardobelchior@mui/x-tree-view@8.1.0Internal changes.
@mui/x-tree-view-pro@8.1.0 Same changes as in @mui/x-tree-view@8.1.0.
@types/node (#17444) @LukasTyreact-is dependency (#17470) @LukasTyoverridesResolver in styled components (#17466) @romgrk@babel/node (#17446) @LukasTyclock=fake from pickers (#17253) @JCQuintasApr 17, 2025
We're excited to announce the first v8 stable release! 🎉🚀
This is now the officially supported major version, where we'll keep rolling out new features, bug fixes, and improvements. Migration guides are available with a complete list of the breaking changes:
Here are the highlights from alpha and beta releases included in this stable release:
🎁 @mui/material@7 support – see the Material UI v7 upgrade guide.
🔄 Pivoting.
🎨 Improved Data Grid theming and add default background color.
📊 New Pro chart: Funnel.
margin and axis-size).🚫 Removed react-spring dependency from @mui/x-charts.
🚀 New Time Range Picker component.
🔁 Support automatic parents and children selection for the Rich Tree View components.
Below are the changes since the last beta release:
@mui/x-data-grid@8.0.0@mui/x-data-grid-pro@8.0.0 Same changes as in @mui/x-data-grid@8.0.0, plus:
@mui/x-data-grid-premium@8.0.0 Same changes as in @mui/x-data-grid-pro@8.0.0, plus:
groupingValueGetter for row grouping on the server (#17376) @cherniavskii@mui/x-date-pickers@8.0.0<input /> but the field expects the accessible DOM structure (#17237) @flaviendelangleEnter press with accessible DOM structure (#17328) @LukasTydisabled=true (#17215) @flaviendelangle@mui/x-date-pickers-pro@8.0.0 Same changes as in @mui/x-date-pickers@8.0.0, plus:
@mui/x-charts@8.0.0slotProps.legend.hidden to migration docs (#17379) @bernardobelchiorAnimationContext into a plugin (#17299) @bernardobelchiorbarElementClasses (#17273) @10tacionuseAnimate hook (#17162) @bernardobelchioruseAnimate test flakiness (#17372) @bernardobelchioruseEventCallback to memoize onZoomChange without triggering a re-render (#17233) @JCQuintasChartDataProvider (#17403) @bernardobelchior@mui/x-charts-pro@8.0.0 Same changes as in @mui/x-charts@8.0.0, plus:
requestAnimationFrame (#17137) @JCQuintas@mui/x-tree-view@8.0.0@mui/x-tree-view-pro@8.0.0 Same changes as in @mui/x-tree-view@8.0.0.
ownerState changes (#17151) @flaviendelangleResponsiveChartContainer migration guide (#17364) @MonstraGTelemetryContextType (#17282) @oliviertassinari__RELEASE_INFO__ is managed (#17416) @LukasTyvitest changes (#17247) @JCQuintasvitest (#17251) @JCQuintasclock=fake from pickers tests (#17225) @JCQuintasApr 3, 2025
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
react-spring as a dependency of @mui/x-chartsTeam members who have contributed to this release: @bernardobelchior, @cherniavskii, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @oliviertassinari, @noraleonte, @romgrk, @alexfauquette.
The list view feature and its related props are now stable.
The unstable_listColumn prop has been renamed to listViewColumn.
The GridListColDef type has been renamed to GridListViewColDef.
-const listViewColDef: GridListColDef = {
+const listViewColDef: GridListViewColDef = {
field: 'listColumn',
renderCell: ListViewCell,
};
<DataGridPro
- unstable_listView
- unstable_listColumn={listViewColDef}
+ listView
+ listViewColumn={listViewColDef}
/>The useGridApiEventHandler() hook has been renamed to useGridEvent().
useGridApiOptionHandler() hook has been renamed to useGridEventPriority().@mui/x-data-grid@8.0.0-beta.3useGridApiEventHandler() to useGridEvent() (#17159) @romgrk@mui/x-data-grid-pro@8.0.0-beta.3 Same changes as in @mui/x-data-grid@8.0.0-beta.3, plus:
@mui/x-data-grid-premium@8.0.0-beta.3 Same changes as in @mui/x-data-grid-pro@8.0.0-beta.3.
@mui/x-date-pickers@8.0.0-beta.3nextOrAccept action bar action (#17037) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-beta.3 Same changes as in @mui/x-date-pickers@8.0.0-beta.3.
Removed react-spring as a dependency of @mui/x-charts.
A consequence of this change is that the props of some slots have been changed because the SpringValue wrapper has been removed. The affected slots and props are:
x, y, width and height props of the bar slot are now number;startAngle, endAngle, innerRadius, outerRadius, arcLabelRadius, cornerRadius and paddingAngle props of pieArc and pieArcLabel slot are now number.Additionally, the pieArc slot now receives a skipAnimation prop to configure whether animations should be enabled or disabled.
Tick labels in the y-axis of cartesian charts will now have an ellipsis applied to prevent overflow. If your tick labels are being clipped sooner than you would like, you can increase the y-axis size by increasing its width property.
The tooltip DOM structure is modified to improve accessibility. If you relied on it to apply some style or run tests, you might be impacted by this modification.
@mui/x-charts@8.0.0-beta.3react-spring (#16961) @bernardobelchiorreact-spring (#17123) @bernardobelchior@mui/x-charts-pro@8.0.0-beta.3 Same changes as in @mui/x-charts@8.0.0-beta.3.
@mui/x-tree-view@8.0.0-beta.3Internal changes.
@mui/x-tree-view-pro@8.0.0-beta.3 Same changes as in @mui/x-tree-view@8.0.0-beta.3.
@mui/x-codemod@8.0.0-beta.3listView prop rename codemod (#17220) @MBilalShafi@mui dependency versions (#17160) @LukasTytest:unit warning (#17224) @JCQuintasdescribeValidation (#17150) @JCQuintasdescribeValue (#17199) @JCQuintasMar 27, 2025
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @lhilgert9. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @flaviendelangle, @hasdfa, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @mnajdova, @romgrk.
@mui/x-data-grid@8.0.0-beta.2@mui/styled-engine-sc (#17154) @KenanYusuf@mui/x-data-grid-pro@8.0.0-beta.2 Same changes as in @mui/x-data-grid@8.0.0-beta.2, plus:
@mui/x-data-grid-premium@8.0.0-beta.2 Same changes as in @mui/x-data-grid-pro@8.0.0-beta.2.
@mui/x-date-pickers@8.0.0-beta.2@mui/x-date-pickers-pro@8.0.0-beta.2 Same changes as in @mui/x-date-pickers@8.0.0-beta.2.
@mui/x-charts@8.0.0-beta.2@mui/x-charts-pro@8.0.0-beta.2 Same changes as in @mui/x-charts@8.0.0-beta.2.
@mui/x-tree-view@8.0.0-beta.2Internal changes.
@mui/x-tree-view-pro@8.0.0-beta.2 Same changes as in @mui/x-tree-view@8.0.0-beta.2.
@mui/x-codemod@8.0.0-beta.1ExportExcel component (#17110) @KenanYusuf@mui/styles dependency & patches (#17071) @mnajdovaisDeepEqual to @mui/x-internals (#17129) @JCQuintastest_regressions step from React 18 pipeline (#17108) @LukasTyissue-status-label-handler.yml @michelengelenMar 21, 2025
We'd like to offer a big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community members for their valuable contributions: @jyash97. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @flaviendelangle, @JCQuintas, @KenanYusuf.
@mui/x-data-grid@8.0.0-beta.1forwardRef to ClickAwayListener (#17049) @arminmeh@mui/x-data-grid-pro@8.0.0-beta.1 Same changes as in @mui/x-data-grid@8.0.0-beta.1, plus:
checkboxSelectionVisibleOnly and paginationMode="server" (#17026) @arminmeh@mui/x-data-grid-premium@8.0.0-beta.1 Same changes as in @mui/x-data-grid-pro@8.0.0-beta.1, plus:
@mui/x-date-pickers@8.0.0-beta.1useField hook (part 1) (#16944) @flaviendelangledoesSectionFormatHaveLeadingZeros (#17051) @flaviendelangledisableOpenPicker prop (#17040) @flaviendelanglecleanLeadingZeros method (#17063) @flaviendelangleownerState in PickersDay and DateRangePickerDay (#17035) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-beta.1 Same changes as in @mui/x-date-pickers@8.0.0-beta.1, plus:
@mui/x-charts@8.0.0-beta.1@mui/x-charts-pro@8.0.0-beta.1 Same changes as in @mui/x-charts@8.0.0-beta.1, plus:
@mui/x-tree-view@8.0.0-beta.1Internal changes.
@mui/x-tree-view-pro@8.0.0-beta.1 Same changes as in @mui/x-tree-view@8.0.0-beta.1.
Mar 18, 2025
We'd like to offer a big thanks to the 21 contributors who made this release possible. Here are some highlights ✨:
@mui/material version 7 in all X packages@mui/material has been updated to accept only v7.
This has been done to increase the adoption rate of ESM.
Since only v7 of @mui/material has proper ESM support, we decided to help with its adoption and fix numerous issues using X packages in environments where transpiling is not an option.Special thanks go out to the community members for their valuable contributions: @Blake-McCullough, @hlavacz, @k-rajat19, @layerok, @nusr, @owais635, @yelahj. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @DiegoAndai, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @noraleonte, @romgrk.
Below are the highlights of the alpha releases leading up to this beta release:
⚛️ React 19 support.
🛠️ New and improved Data Grid Toolbar component.
🎨 Improve Data Grid theming and add default background color.
📊 New Pro chart: Funnel.
📊 Add a new API to support multiple axes (decouple margin and axis-size)
🔁 Support automatic parents and children selection for the Rich Tree View components.
@mui/x-data-grid@8.0.0-beta.0toggleMenu click (#16845) @michelengelenQuickFilter debounce overriding input value (#16856) @KenanYusufprintOptions not respecting hideFooter root prop (#14863) @k-rajat19processRowUpdate() error if the row is removed before it is executed (#16741) @arminmeh@mui/x-data-grid-pro@8.0.0-beta.0 Same changes as in @mui/x-data-grid@8.0.0-beta.0, plus:
@mui/x-data-grid-premium@8.0.0-beta.0 Same changes as in @mui/x-data-grid-pro@8.0.0-beta.0, plus:
useClearableField hook has been removed.
The custom field component now receives the clearable and onClear props — Learn more.ExportedUseClearableFieldProps, UseClearableFieldSlots, UseClearableFieldSlotProps, and UseClearableFieldResponse types have been removed — Learn more.@mui/x-date-pickers@8.0.0-beta.0props.value as the source of truth when defined (#16853) @flaviendelanglefocusedView to time renderers (#16869) @LukasTyuseClearableField hook (#16859) @LukasTy@mui/x-date-pickers-pro@8.0.0-beta.0 Same changes as in @mui/x-date-pickers@8.0.0-beta.0, plus:
height property.
The default line-height has also been changed to 1.25, so if you aren't customizing the line height for x-axis tick labels, make sure to double check if the result is desirable.@mui/x-charts@8.0.0-beta.0forwardRef (#16894) @bernardobelchiorisInteracting behavior directly to community code (#16999) @JCQuintasfireEvent usage from tests (#17006) @JCQuintasuseIsClient (#16937) @bernardobelchior@mui/x-charts-pro@8.0.0-beta.0 Same changes as in @mui/x-charts@8.0.0-beta.0.
@mui/x-tree-view@8.0.0-beta.0Internal changes.
@mui/x-tree-view-pro@8.0.0-beta.0 Same changes as in @mui/x-tree-view@8.0.0-beta.0.
showQuickFilter: true toolbar prop from demos (#17003) @KenanYusuf@mui/utils dependency to only v7 (#16928) @Janpotcimg/node image version (#16964) @LukasTyTanstack query renovate group (#16989) @LukasTypull_request to pull_request_target (#16902) @michelengelenMar 7, 2025
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community member for their valuable contributions: @vadimka123.
Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen, @noraleonte, @oliviertassinari.
density prop. A density selector can be added to a custom toolbar passed to slots.toolbar. See Toolbar component—Settings menu for an example.slotProps={{ toolbar: { showQuickFilter: false } }} to hide it.<GridSaveAltIcon /> icon is not exported anymore. Import SaveAlt from @mui/icons-material instead.@mui/x-data-grid@8.0.0-alpha.14aria-hidden console error when scrollbar is dragged (#16829) @arminmeh<Toolbar /> component (#14611) @KenanYusuf@mui/x-data-grid-pro@8.0.0-alpha.14 Same changes as in @mui/x-data-grid@8.0.0-alpha.14.
@mui/x-data-grid-premium@8.0.0-alpha.14 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.14.
onChange when the date is partially filled — Learn more.@mui/x-date-pickers@8.0.0-alpha.14props.value as the source of truth when defined (#15875) @flaviendelanglehelperText (#16821) @LukasTyTValidationProps generic to the PickerManager interface (#16832) @flaviendelangleedge property setting in different button position cases (#16838) @LukasTyusePicker folder (#16680) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.14 Same changes as in @mui/x-date-pickers@8.0.0-alpha.14.
@mui/x-charts@8.0.0-alpha.14undefined behaving differently from missing value for axis size (#16844) @bernardobelchiordefaultizeAxis function into two (#16745) @bernardobelchiortextAnchor and dominantBaseline based on angle (#16817) @bernardobelchior@mui/x-charts-pro@8.0.0-alpha.14 Same changes as in @mui/x-charts@8.0.0-alpha.14, plus:
The selectItem method has been renamed setItemSelection:
const { publicAPI } = useTreeItemUtils();
const handleSelectItem() {
- publicAPI.selectItem({ event, itemId: props.itemId, shouldBeSelected: true })
+ publicAPI.setItemSelection({ event, itemId: props.itemId, shouldBeSelected: true })
}The setItemExpansion method now receives a single object instead of a list of parameters:
const { publicAPI } = useTreeItemUtils();
const handleExpandItem() {
- publicAPI.setItemExpansion(event, props.itemId, true)
+ publicAPI.setItemExpansion({ event, itemId: props.itemId, shouldBeExpanded: true })
}@mui/x-tree-view@8.0.0-alpha.14@mui/x-tree-view-pro@8.0.0-alpha.14 Same changes as in @mui/x-tree-view@8.0.0-alpha.14.
Feb 28, 2025
We'd like to offer a big thanks to the 19 contributors who made this release possible. Here are some highlights ✨:
margin and axis-size. A new API to support multiple axes (#16418) @JCQuintasSpecial thanks go out to the community members for their contributions: @denpiligrim, @lhilgert9, @noherczeg, @officialkidmax, @pcorpet. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @hasdfa, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen, @MBilalShafi, @oliviertassinari, @romgrk.
The slots.baseFormControl component was removed.
The "Reset" button in the column visibility panel now resets to the initial column visibility model. Previously it was reset to the model that was active at the time the panel was opened. The reset behavior follows these rules:
columnVisibilityModel is provided, it resets to that model.columnVisibilityModel is provided, it resets to the first model value.columns prop or updateColumns() API method), the reset reference point updates to the current columnVisibilityModel.To revert to the previous behavior, provide a custom component to the slots.columnsManagement.
The deprecated LicenseInfo export has been removed from the @mui/x-data-grid-pro and @mui/x-data-grid-premium packages.
You have to import it from @mui/x-license instead:
- import { LicenseInfo } from '@mui/x-data-grid-pro';
- import { LicenseInfo } from '@mui/x-data-grid-premium';
+ import { LicenseInfo } from '@mui/x-license';
LicenseInfo.setLicenseKey('YOUR_LICENSE_KEY');The row selection model has been changed from GridRowId[] to { type: 'include' | 'exclude'; ids: Set<GridRowId> }.
Using Set allows for a more efficient row selection management.
The exclude selection type allows to select all rows except the ones in the ids set.
This change impacts the following props:
rowSelectionModelonRowSelectionModelChangeinitialState.rowSelectionModel- const [rowSelectionModel, setRowSelectionModel] = React.useState<GridRowSelectionModel>([]);
+ const [rowSelectionModel, setRowSelectionModel] = React.useState<GridRowSelectionModel>({ type: 'include', ids: new Set() });This change also impacts the gridRowSelectionStateSelector selector.
For convenience, use the gridRowSelectionManagerSelector selector to handle both selection types:
- const rowSelection = gridRowSelectionStateSelector(apiRef);
- const isRowSelected = rowSelection.includes(rowId);
+ const rowSelectionManager = gridRowSelectionManagerSelector(apiRef);
+ const isRowSelected = rowSelectionManager.has(rowId);There is also a createRowSelectionManager utility function that can be used to manage the row selection:
const rowSelectionManager = createRowSelectionManager({
type: 'include',
ids: new Set(),
});
rowSelectionManager.select(rowId);
rowSelectionManager.unselect(rowId);
rowSelectionManager.has(rowId);The selectedIdsLookupSelector selector has been removed. Use the gridRowSelectionManagerSelector or gridRowSelectionStateSelector selectors instead.
selectedGridRowsSelector has been renamed to gridRowSelectionIdsSelector.The selectedGridRowsCountSelector has been renamed to gridRowSelectionCountSelector.
The data source feature and its related props are now stable.
<DataGridPro
- unstable_dataSource={dataSource}
- unstable_dataSourceCache={cache}
- unstable_lazyLoading
- unstable_lazyLoadingRequestThrottleMs={100}
+ dataSource={dataSource}
+ dataSourceCache={cache}
+ lazyLoading
+ lazyLoadingRequestThrottleMs={100}
/>The data source API is now stable.
- apiRef.current.unstable_dataSource.getRows()
+ apiRef.current.dataSource.getRows()The signature of unstable_onDataSourceError() has been updated to support future use-cases.
<DataGrid
- unstable_onDataSourceError={(error: Error, params: GridGetRowsParams) => {
- if (params.filterModel) {
- // do something
- }
- }}
+ unstable_onDataSourceError={(error: GridGetRowsError | GridUpdateRowError) => {
+ if (error instanceof GridGetRowsError && error.params.filterModel) {
+ // do something
+ }
+ }}
/>Fix the type of the GridSortModel to allow readonly arrays.
GridSortItem interface is not exported anymore.
The showToolbar prop is now required to display the toolbar.
It is no longer necessary to pass GridToolbar as a slot to display the default toolbar.
<DataGrid
+ showToolbar
- slots={{
- toolbar: GridToolbar,
- }}
/>@mui/x-data-grid@8.0.0-alpha.13showToolbar prop to enable default toolbar (#16687) @KenanYusufshowColumnVerticalBorder prop (#16715) @KenanYusufSelect menuprops onClose() (#16643) @romgrkGridSortItem internal (#16732) @arminmehsx prop usage with styled() components (#16665) @KenanYusufAutocomplete (#16390) @romgrkonDataSourceError() callback (#16718) @MBilalShafiGridSortModel (#16627) @pcorpet@mui/x-data-grid-pro@8.0.0-alpha.13 Same changes as in @mui/x-data-grid@8.0.0-alpha.13, plus:
LicenseInfo reexports (#16671) @cherniavskii@mui/x-data-grid-premium@8.0.0-alpha.13 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.13, plus:
valueGetter to get row group keys (#16016) @cherniavskii<DateRangePicker /> now uses a dialog instead of a tooltip to render their view when used with a single input range field.@mui/x-date-pickers@8.0.0-alpha.13@mui/x-date-pickers-pro@8.0.0-alpha.13 Same changes as in @mui/x-date-pickers@8.0.0-alpha.13.
Charts array inputs are now readonly. Allowing externally defined as const to be used as a prop value of the React component.
const xAxis = [{ position: 'bottom' }] as const
<BarChart xAxis={xAxis} />Replace topAxis, rightAxis, bottomAxis and leftAxis props by the position property in the axis config.
If you were using them to place axis, set the position property to the corresponding value 'top' | 'right' | 'bottom' | 'left'.
If you were disabling an axis by setting it to null, set its position to 'none'.
<LineChart
yAxis={[
{
scaleType: 'linear',
+ position: 'right',
},
]}
series={[{ data: [1, 10, 30, 50, 70, 90, 100], label: 'linear' }]}
height={400}
- rightAxis={{}}
/>Remove position prop from ChartsXAxis and ChartsYAxis.
The position prop has been removed from the ChartsXAxis and ChartsYAxis components. Configure it directly in the axis config.
<ChartContainer
yAxis={[
{
id: 'my-axis',
+ position: 'right',
},
]}
>
- <ChartsYAxis axisId="my-axis" position="right" />
+ <ChartsYAxis axisId="my-axis" />
</ChartContainer>Add minTickLabelGap to x-axis, which allows users to define the minimum gap, in pixels, between two tick labels. The default value is 4px. Make sure to check your charts as the spacing between tick labels might have changed.
@mui/x-charts@8.0.0-alpha.13labelMarkType (#16739) @bernardobelchiorminTickLabelGap to x-axis (#16548) @bernardobelchiormargin and axis-size (#16418) @JCQuintastheme.shape error in the tooltip (#16748) @alexfauquettedefaultizeAxis function type-safe (#16642) @JCQuintasseries.data readonly (#16645) @JCQuintasChartsUsageDemo to TSX and removed NoSnap (#16686) @JCQuintasposition='none' axes from rendering (#16727) @JCQuintas@mui/x-charts-pro@8.0.0-alpha.13 Same changes as in @mui/x-charts@8.0.0-alpha.13, plus:
@mui/x-tree-view@8.0.0-alpha.13Internal changes.
@mui/x-tree-view-pro@8.0.0-alpha.13 Same changes as in @mui/x-tree-view@8.0.0-alpha.13.
@mui/x-codemod@8.0.0-alpha.13vitest (#16755) @JCQuintasvitest (#16757) @JCQuintasFeb 17, 2025
We'd like to offer a big thanks to the 16 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @Neonin, @nusr, and @pawelkula. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @oliviertassinari, @romgrk, and @mapache-salvaje.
The main--hasSkeletonLoadingOverlay class has been renamed to main--hiddenContent and is now also applied when the "No columns" overlay is displayed.
The apiRef.current.forceUpdate() method was removed. Use selectors combined with useGridSelector() hook to react to changes in the state.
The selectors signature has been updated. They are only accepting apiRef as a first argument and instanceId is no longer the third argument.
-mySelector(state, arguments, instanceId)
+mySelector(apiRef, arguments)@mui/x-data-grid@8.0.0-alpha.12apiRef as first argument (#16198) @arminmehundefined value for pagination rowCount (#16488) @cherniavskiigetRowId() API method as a selector (#16487) @MBilalShafionClock prop of the base Select slot (#16557) @romgrkapiRef.current.forceUpdate() method (#16560) @MBilalShafi-1 for "All" rows per page (#16485) @nusr@mui/x-data-grid-pro@8.0.0-alpha.12 Same changes as in @mui/x-data-grid@8.0.0-alpha.12.
@mui/x-data-grid-premium@8.0.0-alpha.12 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.12, plus:
The aria-label on the <Clock /> component and Time Picker opening button has been fixed to rely on the set ampm property instead of defaulting to the user's locale.
The following unused formats have been removed from the adapters and can no longer be overridden via the dateFormats prop on the <LocalizationProvider /> component:
fullTime - please use fullTime12h and fullTime24h instead: <LocalizationProvider
dateFormats={{
- fullTime: 'LT',
+ fullTime12h: 'hh:mm A',
+ fullTime24h: 'hh:mm',
}}
>keyboardDateTime - please use keyboardDateTime12h and keyboardDateTime24h instead: <LocalizationProvider
dateFormats={{
- keyboardDateTime: 'DD.MM.YYYY | LT',
+ keyboardDateTime12h: 'DD.MM.YYYY | hh:mm A',
+ keyboardDateTime24h: 'DD.MM.YYYY | hh:mm',
}}
>@mui/x-date-pickers@8.0.0-alpha.12ampm flag value (#16572) @LukasTy@mui/x-date-pickers-pro@8.0.0-alpha.12 Same changes as in @mui/x-date-pickers@8.0.0-alpha.12, plus:
useSeries hook family has been stabilized and renamed accordingly — Learn more@mui/x-charts@8.0.0-alpha.12test:performance:browser script #16600 @bernardobelchioruseXxxSeries hooks (#16552) @JCQuintasuseXxxSeries into useXxxSeriesContext (#16546) @JCQuintasuseXxxSeries support array of ids and document them (#15545) @JCQuintasvalueFormatter (#16555) @alexfauquettecolors prop from SparkLineChart. (#16494) @bernardobelchioruseSeries, usePieSeries, etc.) (#16459) @bernardobelchior@mui/x-charts-pro@8.0.0-alpha.12 Same changes as in @mui/x-charts@8.0.0-alpha.12.
@mui/x-tree-view@8.0.0-alpha.12Internal changes.
@mui/x-tree-view-pro@8.0.0-alpha.12 Same changes as in @mui/x-tree-view@8.0.0-alpha.12.
next releases (#16423) @LukasTyFeb 7, 2025
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @lauri865. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @bernardobelchior, @flaviendelangle, @Janpot, @KenanYusuf, @LukasTy, @MBilalShafi, @noraleonte, @romgrk.
createUseGridApiEventHandler() is not exported anymore.The filteredRowsLookup object of the filter state does not contain true values anymore. If the row is filtered out, the value is false. Otherwise, the row id is not present in the object.
This change only impacts you if you relied on filteredRowsLookup to get ids of filtered rows. In this case,use gridDataRowIdsSelector selector to get row ids and check filteredRowsLookup for false values:
const filteredRowsLookup = gridFilteredRowsLookupSelector(apiRef);
-const filteredRowIds = Object.keys(filteredRowsLookup).filter((rowId) => filteredRowsLookup[rowId] === true);
+const rowIds = gridDataRowIdsSelector(apiRef);
+const filteredRowIds = rowIds.filter((rowId) => filteredRowsLookup[rowId] !== false);The visibleRowsLookup state does not contain true values anymore. If the row is not visible, the value is false. Otherwise, the row id is not present in the object:
const visibleRowsLookup = gridVisibleRowsLookupSelector(apiRef);
-const isRowVisible = visibleRowsLookup[rowId] === true;
+const isRowVisible = visibleRowsLookup[rowId] !== false;@mui/x-data-grid@8.0.0-alpha.11<GridRoot /> double-render pass on mount in SPA mode (#15648) @lauri865MenuList import (#16444) @romgrkuseGridApiEventHandler() (#16479) @romgrk@mui/x-data-grid-pro@8.0.0-alpha.11 Same changes as in @mui/x-data-grid@8.0.0-alpha.11, plus:
useGridApiContext() for Pro and Premium packages on React < 19 (#16441) @arminmeh@mui/x-data-grid-premium@8.0.0-alpha.11 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.11, plus:
@mui/x-date-pickers@8.0.0-alpha.11Internal changes.
@mui/x-date-pickers-pro@8.0.0-alpha.11 Same changes as in @mui/x-date-pickers@8.0.0-alpha.11, plus:
currentMonthCalendarPosition prop behavior on mobile (#16455) @LukasTy@mui/x-charts@8.0.0-alpha.11color prop to Sparkline and deprecate colors (#16477) @bernardobelchior@mui/x-charts-pro@8.0.0-alpha.11 Same changes as in @mui/x-charts@8.0.0-alpha.11.
@mui/x-tree-view@8.0.0-alpha.11Internal changes.
@mui/x-tree-view-pro@8.0.0-alpha.11 Same changes as in @mui/x-tree-view@8.0.0-alpha.11.
react-transition-group transitions in unit testing (#16288) @lauri865Jan 30, 2025
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @k-rajat19, @lauri865, @mateuseap. Following are all team members who have contributed to this release: @alexfauquette, @flaviendelangle, @JCQuintas, @KenanYusuf, @MBilalShafi, @romgrk, @arminmeh.
viewportInnerSize.width now includes pinned columns' widths (fixes recursive loops in updating dimensions <-> columns)The Data Grid now has a default background color, and its customization has moved from theme.mixins.MuiDataGrid to theme.palette.DataGrid with the following properties:
bg: Sets the background color of the entire grid (new property)headerBg: Sets the background color of the header (previously named containerBackground)pinnedBg: Sets the background color of pinned rows and columns (previously named pinnedBackground) const theme = createTheme({
- mixins: {
- MuiDataGrid: {
- containerBackground: '#f8fafc',
- pinnedBackground: '#f1f5f9',
- },
- },
+ palette: {
+ DataGrid: {
+ bg: '#f8fafc',
+ headerBg: '#e2e8f0',
+ pinnedBg: '#f1f5f9',
+ },
+ },
});The detailPanels, pinnedColumns, and pinnedRowsRenderZone classes have been removed.
Return type of the useGridApiRef() hook and the type of apiRef prop are updated to explicitly include the possibilty of null. In addition to this, useGridApiRef() returns a reference that is initialized with null instead of {}.
Only the initial value and the type are updated. Logic that initializes the API and its availability remained the same, which means that if you could access API in a particular line of your code before, you are able to access it as well after this change.
Depending on the context in which the API is being used, you can decide what is the best way to deal with null value. Some options are:
apiRef is not nullapiRef is nullapiRef is null@mui/x-data-grid@8.0.0-alpha.10renderContext calculation with scroll bounce / over-scroll (#16297) @lauri865gridClasses (#16256) @mateuseapnull in the return type of the useGridApiRef() hook (#16353) @arminmehonClick prop on toolbar buttons (#16356) @KenanYusuficonContainer during autosizing (#16399) @michelengelen@mui/x-data-grid-pro@8.0.0-alpha.10 Same changes as in @mui/x-data-grid@8.0.0-alpha.10, plus:
useGridApiRef for Pro and Premium packages on React < 19 (#16328) @arminmeh@mui/x-data-grid-premium@8.0.0-alpha.10 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.10.
field slot no longer receives the ref, disabled, className, sx, label, name, formatDensity, enableAccessibleFieldDOMStructure, selectedSections, onSelectedSectionsChange and inputRef props — Learn moreMuiPickersPopper theme entry have been renamed MuiPickerPopper and some of its props have been removed — Learn more@mui/x-date-pickers@8.0.0-alpha.10<PickersPopper /> (#16319) @flaviendelanglePickerContextValue properties (#16327) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.10 Same changes as in @mui/x-date-pickers@8.0.0-alpha.10.
legend.position.horizontal from "left" | "middle" | "right" to "start" | "center" | "end".
This is to align with the CSS values and reflect the RTL ability of the legend component.blueberryTwilightPalette from @mui/x-charts/colorPalettes and set it on the colors property of charts.id property is now optional on the Pie and Scatter data types.@mui/x-charts@8.0.0-alpha.10bumpX and bumpY curve options (#16318) @JCQuintastooltipGetter to seriesConfig (#16331) @JCQuintaslegend.position.horizontal from "left" | "middle" | "right" to "start" | "center" | "end" (#16315) @JCQuintasid optional on PieValueType and ScatterValueType (#16389) @JCQuintas@mui/x-charts-pro@8.0.0-alpha.10 Same changes as in @mui/x-charts@8.0.0-alpha.10.
@mui/x-tree-view@8.0.0-alpha.10Internal changes.
@mui/x-tree-view-pro@8.0.0-alpha.10 Same changes as in @mui/x-tree-view@8.0.0-alpha.10.
Jan 24, 2025
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @AxharKhan, @lauri865, @mapache-salvaje, @mostafaRoosta74.
Following are all team members who have contributed to this release: @alexfauquette, @cherniavskii, @Janpot, @JCQuintas, @LukasTy, @arminmeh.
@mui/x-data-grid@v8.0.0-alpha.9apiRef to be MutableRefObject for React versions < 19 (#16279) @arminmeh@mui/x-data-grid-pro@v8.0.0-alpha.9 Same changes as in @mui/x-data-grid@v8.0.0-alpha.9.
@mui/x-data-grid-premium@v8.0.0-alpha.9 Same changes as in @mui/x-data-grid-pro@v8.0.0-alpha.9.
@mui/x-date-pickers@v8.0.0-alpha.9all selected state on section edit (#16223) @LukasTy@mui/x-date-pickers-pro@v8.0.0-alpha.9 Same changes as in @mui/x-date-pickers@v8.0.0-alpha.9.
The experimentalMarkRendering prop has been removed from the LineChart component.
The line mark are now <circle /> element by default.
And you can chose another shape by adding a shape property to your line series.
The codemod only removes the experimentalMarkRendering prop.
If you relied on the fact that marks were path elements, you need to update your logic.
@mui/x-charts@v8.0.0-alpha.9<circle /> instead of <path /> for line marks by default (#15220) @alexfauquette@mui/x-charts-pro@v8.0.0-alpha.9 Same changes as in @mui/x-charts@v8.0.0-alpha.9, plus:
pro components watermark (#16222) @JCQuintas@mui/x-tree-view@v8.0.0-alpha.9Internal changes.
@mui/x-tree-view-pro@v8.0.0-alpha.9 Same changes as in @mui/x-tree-view@v8.0.0-alpha.9.
domainLimit definition (#16270) @alexfauquetteJan 16, 2025
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
🍬 Improved design for Data Grid Header filters
🔄 Data Grid Scroll restoration
Special thanks go out to the community contributors who have helped make this release possible: @lauri865. Following are all team members who have contributed to this release: @arminmeh, @romgrk, @samuelsycamore, @alexfauquette, @cherniavskii, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen.
slotProps={{ headerFilterCell: { showClearIcon: true } }} to restore the clear button in the cell.@mui/x-data-grid@8.0.0-alpha.8@mui/x-data-grid-pro@8.0.0-alpha.8 Same changes as in @mui/x-data-grid@8.0.0-alpha.8, plus:
@mui/x-data-grid-premium@8.0.0-alpha.8 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.8.
useMultiInputDateRangeField, useMultiInputTimeRangeField, and useMultiInputDateTimeRangeField hooks have been removed in favor of the new useMultiInputRangeField hook — Learn morefield slot no longer receives the value, onChange, timezone, format, disabled, formatDensity, enableAccessibleFieldDOMStructure, selectedSections and onSelectedSectionsChange props — Learn more@mui/x-date-pickers@8.0.0-alpha.8onRangePositionChange into setRangePosition in usePickerRangePositionContext (#16189) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.8 Same changes as in @mui/x-date-pickers@8.0.0-alpha.8.
x and y axis now log a warning in dev mode. Axis ids should be unique to prevent internal issues.@mui/x-charts@8.0.0-alpha.8offset could be Infinite (#16131) @JCQuintasuseChartGradientId public (#16106) @JCQuintasskipAnimation is set to true (#16166) @alexfauquettertl for gradient legend (#16115) @JCQuintas@mui/x-charts-pro@8.0.0-alpha.8 Same changes as in @mui/x-charts@8.0.0-alpha.8.
@mui/x-tree-view@8.0.0-alpha.8No changes since @mui/x-tree-view-pro@v8.0.0-alpha.7.
@mui/x-tree-view-pro@8.0.0-alpha.8 Same changes as in @mui/x-tree-view@8.0.0-alpha.8.
RefObject (#16124) @arminmehreact and react-dom definitions to simplify dep resolving (#16160) @LukasTydate-fns-v2 (#16158) @LukasTyJan 9, 2025
We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @derek-0000, @josteinjhauge, @k-rajat19, @nusr, @tomashauser. Following are all team members who have contributed to this release: @cherniavskii, @flaviendelangle, @JCQuintas, @LukasTy, @MBilalShafi, @arminmeh, @romgrk, @oliviertassinari.
@mui/x-data-grid@8.0.0-alpha.7name attribute to the checkbox selection column (#15178) @derek-0000@mui/x-data-grid-pro@8.0.0-alpha.7 Same changes as in @mui/x-data-grid@8.0.0-alpha.7.
@mui/x-data-grid-premium@8.0.0-alpha.7 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.7, plus:
date-fns and date-fns-jalali date library adapters have been renamed to better align with the current stable major versions — Learn morecloseOnSelect and Action Bar actions values - Learn morelayout slot no longer receives the value, onChange and onSelectShortcut props — Learn more.toolbar slot no longer receives the value, onChange and isLandscape props — Learn more.shortcuts slot no longer receives the onChange, isValid and isLandscape props — Learn more.PickerShortcutChangeImportance type has been renamed PickerChangeImportance — Learn more.layout slot no longer receives the rangePosition and onRangePositionChange on range pickers — Learn more.toolbar slot no longer receives the rangePosition and onRangePositionChange on range pickers — Learn more.tabs slot no longer receives the rangePosition and onRangePositionChange on range pickers — Learn more.@mui/x-date-pickers@8.0.0-alpha.7inputRef.current.focus on accessibleFieldDOMStructure (#15985) @LukasTysetValue internally to update the picker value (#16056) @flaviendelanglemanager (#15339) @flaviendelangle<PickersActionBar /> (#16071) @LukasTyNonEmptyDateRange type (#16035) @flaviendelangleAdapterDateFns into AdapterDateFnsV2 and AdapterDateFnsV3 into AdapterDateFns (#16082) @LukasTyctx.onViewChange to ctx.setView and add it to the actions context (#16044) @flaviendelangledate-fns-jalali v4 (#16011) @LukasTycloseOnSelect and actionBar.actions default values (#15944) @LukasTyusePickerContext() and usePickerActionsContext() instead of passing props to the shortcuts and toolbar slots (#15948) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.7 Same changes as in @mui/x-date-pickers@8.0.0-alpha.7.
DefaultChartsLegend component, since it is now easier to create custom legends — Learn more.width and height properties of the charts now only apply to the svg element, and not their wrappers, this might cause some layout shifts.slotProps.legend.direction now accepts 'horizontal' | 'vertical' instead of 'row' | 'column' — Learn more.getSeriesToDisplay function was removed in favor of the useLegend hook. — Learn more.@mui/x-charts@8.0.0-alpha.7@mui/x-charts-pro@8.0.0-alpha.7 Same changes as in @mui/x-charts@8.0.0-alpha.7.
@mui/x-tree-view@8.0.0-alpha.7@mui/x-tree-view-pro@8.0.0-alpha.7 Same changes as in @mui/x-tree-view@8.0.0-alpha.7.
EditingWithDatePickers demo (#15967) @k-rajat19LocalizationProvider (#16084) @tomashauserrelease:version docs (#16038) @cherniavskiitestSkipIf and describeSkipIf (#16049) @JCQuintasDec 26, 2024
We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @JoepVerkoelen, @k-rajat19, @lauri865. Following are all team members who have contributed to this release: @flaviendelangle, @JCQuintas, @LukasTy, @MBilalShafi, @romgrk.
sanitizeFilterItemValue() utility is not exported anymore.@mui/x-data-grid@8.0.0-alpha.6renderContext state in grid root for better scroll performance (#15986) @lauri865forwardRef with a shim for forward compatibility (#15955) @lauri865@mui/x-data-grid-pro@8.0.0-alpha.6 Same changes as in @mui/x-data-grid@8.0.0-alpha.6.
@mui/x-data-grid-premium@8.0.0-alpha.6 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.6, plus:
@mui/x-date-pickers@8.0.0-alpha.6usePickerContext() and usePickerActionsContext() to get the actions in the actionBar slot and in internal components (#15843) @flaviendelangleusePickerContext() to get the view-related props in the layout, toolbar and tabs slots (#15606) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.6 Same changes as in @mui/x-date-pickers@8.0.0-alpha.6.
@mui/x-charts@8.0.0-alpha.6No changes since @mui/x-charts@v8.0.0-alpha.5.
@mui/x-charts-pro@8.0.0-alpha.6 Same changes as in @mui/x-charts@8.0.0-alpha.6.
@mui/x-tree-view@8.0.0-alpha.6No changes since @mui/x-tree-view-pro@v8.0.0-alpha.5.
@mui/x-tree-view-pro@8.0.0-alpha.6 Same changes as in @mui/x-tree-view@8.0.0-alpha.6.
next-env.d.ts changes (#15947) @JCQuintasDec 19, 2024
We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @good-jinu, @k-rajat19. Following are all team members who have contributed to this release: @alexfauquette, @cherniavskii, @flaviendelangle, @KenanYusuf, @LukasTy, @MBilalShafi, @romgrk.
Passing additional props (like data-*, aria-*) directly on the Data Grid component is no longer supported. To pass the props, use slotProps:
.root element, use slotProps.root..main element (the one with role="grid"), use slotProps.main.detailPanelExpandedRowIds and onDetailPanelExpandedRowIdsChange props use a Set instead of an array:
-detailPanelExpandedRowIds?: GridRowId[];
+detailPanelExpandedRowIds?: Set<GridRowId>;
-onDetailPanelExpandedRowIdsChange?: (ids: GridRowId[], details: GridCallbackDetails) => void;
+onDetailPanelExpandedRowIdsChange?: (ids: Set<GridRowId>, details: GridCallbackDetails) => void;apiRef.current.getExpandedDetailPanels and apiRef.current.setExpandedDetailPanels methods receive and return a Set instead of an array.
gridDetailPanelExpandedRowIdsSelector returns a Set instead of an array.gridDetailPanelExpandedRowsHeightCacheSelector was removed.@mui/x-data-grid@8.0.0-alpha.5columnGroupHeaderHeight prop in getTotalHeaderHeight method (#15915) @k-rajat19<Badge /> to leaf import (#15879) @romgrk<ListItemText /> and <ListItemIcon /> to leaf import (#15869) @romgrkslotProps to forward props to .main and .root elements (#15870) @MBilalShafi@mui/x-data-grid-pro@8.0.0-alpha.5 Same changes as in @mui/x-data-grid@8.0.0-alpha.5, plus:
Set for detailPanelExpandedRowIds (#15835) @cherniavskii@mui/x-data-grid-premium@8.0.0-alpha.5 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.5.
The <PickersMonth /> component has been moved inside the Month Calendar component — Learn more.
The <PickersYear /> component has been moved inside the Year Calendar component — Learn more.
@mui/x-date-pickers@8.0.0-alpha.5PickersMonth and PickersYear from the theme and remove the div wrapping each button (#15806) @flaviendelangleownerState object on the <PickersTextField /> component (#15863) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.5 Same changes as in @mui/x-date-pickers@8.0.0-alpha.5.
@mui/x-charts@8.0.0-alpha.5<ScatterChart /> value type if null (#15917) @alexfauquette@mui/x-charts-pro@8.0.0-alpha.5 Same changes as in @mui/x-charts@8.0.0-alpha.5.
@mui/x-tree-view@8.0.0-alpha.5No changes since @mui/x-tree-view-pro@v8.0.0-alpha.4.
@mui/x-tree-view-pro@8.0.0-alpha.5 Same changes as in @mui/x-tree-view@8.0.0-alpha.5.
@mui/material-nextjs dependency (#15925) @LukasTyDec 13, 2024
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @k-rajat19, @nusr, @rares985, @zivl. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi.
The selectors signature has been updated due to the support of arguments in the selectors. Pass undefined as arguments if the selector doesn't use any arguments.
-mySelector(state, instanceId)
+mySelector(state, arguments, instanceId)The useGridSelector signature has been updated due to the introduction of arguments parameter in the selectors. Pass undefined as arguments if the selector doesn't use any arguments.
-const output = useGridSelector(apiRef, selector, equals)
+const output = useGridSelector(apiRef, selector, arguments, equals)The default variant for text fields and selects in the filter panel has been changed to outlined.
<DataGrid
- unstable_rowSpanning
+ rowSpanning
/>@mui/x-data-grid@8.0.0-alpha.4<GridActionsCell /> (#15867) @k-rajat19columnsManagement slot (#15817) @k-rajat19@mui/x-data-grid-pro@8.0.0-alpha.4 Same changes as in @mui/x-data-grid@8.0.0-alpha.4, plus:
@mui/x-data-grid-premium@8.0.0-alpha.4 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.4, plus:
valueOptions for singleSelect column type (#15739) @arminmeh@mui/x-date-pickers@8.0.0-alpha.4usePicker logic (#15763) @flaviendelangleownerState property from isRtl to layoutDirection (#15803) @flaviendelangleownerState in useClearableField (#15776) @flaviendelangleownerState in the toolbar components (#15777) @flaviendelangleownerState object for the clock components and the desktop / mobile wrappers (#15669) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.4 Same changes as in @mui/x-date-pickers@8.0.0-alpha.4.
@mui/x-charts@8.0.0-alpha.4@mui/x-charts-pro@8.0.0-alpha.4 Same changes as in @mui/x-charts@8.0.0-alpha.4.
@mui/x-tree-view@8.0.0-alpha.4No changes, releasing to keep the versions in sync.
@mui/x-tree-view-pro@8.0.0-alpha.4 Releasing to benefit from license package fix (#15814).
updateRows method for list view demos (#15732) @KenanYusuf@type/react-test-renderer dep (#15766) @LukasTyconsole.log for the error message on CodeSandbox to avoid rendering error (#15814) @arminmehDec 5, 2024
We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @ihsanberkozcan, @k-rajat19, @perezShaked. Following are all team members who have contributed to this release: @arminmeh, @cherniavskii, @flaviendelangle, @JCQuintas, @MBilalShafi, @noraleonte.
isRowSelectable prop.rowPositionsDebounceMs prop was removed.gridRowsDataRowIdToIdLookupSelector selector was removed. Use the gridRowsLookupSelector selector in combination with the getRowId() API method instead.-const idToIdLookup = gridRowsDataRowIdToIdLookupSelector(apiRef);
-const rowId = idToIdLookup[id]
+const rowsLookup = gridRowsLookupSelector(apiRef);
+const rowId = apiRef.current.getRowId(rowsLookup[id])role attribute to treegrid if the Data Grid is used with row grouping feature.@mui/x-data-grid@8.0.0-alpha.3isRowSelectable (#15692) @MBilalShafigridRowsDataRowIdToIdLookupSelector selector (#15698) @arminmehrowPositionsDebounceMs prop (#15482) @k-rajat19@mui/x-data-grid-pro@8.0.0-alpha.3 Same changes as in @mui/x-data-grid@8.0.0-alpha.3, plus:
@mui/x-data-grid-premium@8.0.0-alpha.3 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.3, plus:
ariaV8 experimental flag (#15694) @arminmehonOpen() and onClose() methods of the usePickerContext() hook have been replaced with a single setOpen method — Learn more.@mui/x-date-pickers@8.0.0-alpha.3onOpen() and onClose() methods of usePickerContext() with a single setOpen() method. (#15701) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.3 Same changes as in @mui/x-date-pickers@8.0.0-alpha.3.
@mui/x-charts@8.0.0-alpha.3pattern and gradient support (#15720) @JCQuintas@mui/x-charts-pro@8.0.0-alpha.3 Same changes as in @mui/x-charts@8.0.0-alpha.3.
@mui/x-tree-view@8.0.0-alpha.3No changes since @mui/x-tree-view-pro@v8.0.0-alpha.2.
@mui/x-tree-view-pro@8.0.0-alpha.3 Same changes as in @mui/x-tree-view@8.0.0-alpha.3.
@mui/x-tree-view-pro to releaseChangelog (#15316) @flaviendelanglepreset-safe folder exists in codemod test (#15703) @JCQuintaspreset-safe into global codemod config (#15659) @JCQuintasNov 29, 2024
We'd like to offer a big thanks to the 17 contributors who made this release possible. Here are some highlights ✨:
<ChartDataProvider /> and <ChartsSurface /> components are now fully divided — Learn more.Special thanks go out to the community contributors who have helped make this release possible: @dloeda, @headironc, @jedesroches, @k-rajat19, @lauri865, @mathzdev, @nphmuller, @zinoroman. Following are all team members who have contributed to this release: @arminmeh, @alexfauquette, @cherniavskii, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @oliviertassinari.
<GridOverlays /> component is not exported anymore.indeterminateCheckboxAction prop has been removed. Clicking on an indeterminate checkbox "selects" the unselected descendants.apiRef.current.resize() method was removed.rowSelectionPropagation prop has been changed to { parents: true, descendants: true } which means that the selection will be propagated to the parents and descendants by default.
To revert to the previous behavior, pass rowSelectionPropagation as { parents: false, descendants: false }.estimatedRowCount is used, the text provided to the Table Pagination component from the Material UI library is updated and requires additional translations. Check the example at the end of Index-based pagination section.@mui/x-data-grid@v8.0.0-alpha.2/jsdom/ to /jsdom|HappyDOM/. (#15634) @jedesroches<GridOverlays /> export (#15573) @k-rajat19indeterminateCheckboxAction prop (#15522) @MBilalShafi<GridCell /> due to performance issues (#15616) @lauri865resize method (#15599) @cherniavskiirowSelectionPropagation (#15523) @MBilalShafi@mui/x-data-grid-pro@v8.0.0-alpha.2 Same changes as in @mui/x-data-grid@v8.0.0-alpha.2, plus:
boolean column type (#15528) @k-rajat19@mui/x-data-grid-premium@v8.0.0-alpha.2 Same changes as in @mui/x-data-grid-pro@v8.0.0-alpha.2.
The props received by the layout and the toolbar slots have been reworked — Learn more.
The TSection generic of the FieldRef type has been replaced with the TValue generic — Learn more.
@mui/x-date-pickers@v8.0.0-alpha.2America/Asuncion timezone and AdapterMoment (#15552) @flaviendelangleTSection and strictly type TValue (#15434) @flaviendelangleorientation, isLandscape, isRtl, wrapperVariant and disabled props from PickersLayout (#15494) @flaviendelangleownerState in <PickersCalendarHeader />, <PickersArrowSwitcher /> and <DayCalendarSkeleton /> (#15499) @flaviendelangleownerState object in all the field components (#15510) @flaviendelangle@mui/x-date-pickers-pro@v8.0.0-alpha.2 Same changes as in @mui/x-date-pickers@v8.0.0-alpha.2.
<div /> wrapping them anymore. All props are now passed to the root <svg /> instead of the <div />.@mui/x-charts@v8.0.0-alpha.2@mui/utils and @mui/system (#15603) @alexfauquettereleasePointerCapture (#15602) @alexfauquette@mui/x-charts-pro@v8.0.0-alpha.2 Same changes as in @mui/x-charts@v8.0.0-alpha.2.
@mui/x-tree-view@v8.0.0-alpha.2@mui/utils and @mui/system (#15604) @alexfauquette@mui/x-tree-view-pro@v8.0.0-alpha.2Same changes as in @mui/x-tree-view@v8.0.0-alpha.2.
new and preview tags in v8 docs (#15547) @JCQuintasanchorEl API page for charts (#15625) @oliviertassinari() function convention for docs @oliviertassinari@types/node bumps (#15591) @LukasTyNov 22, 2024
We'd like to offer a big thanks to the 16 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @CarlosLopezLg, @headironc, @hendrikpeilke, @k-rajat19, @lhilgert9, @viktormelin. Following are all team members who have contributed to this release: @alexfauquette, @arthurbalduini, @cherniavskii, @flaviendelangle, @JCQuintas, @LukasTy, @MBilalShafi, @oliviertassinari, @KenanYusuf, @arminmeh.
@mui/x-data-grid@v8.0.0-alpha.1GridColumnsManagement (#15347) @k-rajat19@mui/x-data-grid-pro@v8.0.0-alpha.1 Same changes as in @mui/x-data-grid@v8.0.0-alpha.1.
@mui/x-data-grid-premium@v8.0.0-alpha.1 Same changes as in @mui/x-data-grid-pro@v8.0.0-alpha.1, plus:
FieldValueType type has been renamed to PickerValueType — Learn more.toolbar and layout slots no longer receive the disabled and readOnly props — Learn more.@mui/x-date-pickers@v8.0.0-alpha.1PickerOwnerState and PickerContextValue (#15415) @flaviendelangleprops.value when it changes (#15490) @flaviendelangle<PickersToolbar /> component (#15515) @LukasTyFieldValueType in favor of PickerValueType (#15259) @arthurbalduiniprops.referenceDate timezone when props.value and props.defaultValue are not defined (#15532) @flaviendelangletouchend event (#15346) @arthurbalduini@mui/x-date-pickers-pro@v8.0.0-alpha.1 Same changes as in @mui/x-date-pickers@v8.0.0-alpha.1, plus:
referenceDate when selecting date (#15429) @LukasTyThe DX of the Tooltip customization has been refactored
tooltip prop has been removed in favor of slotProps.tooltip for consistency.popper, axisContent, and itemContent slots have been removed in favor of the tooltip slot which overrides the entire tooltip.useItemTooltip or useAxisTooltip hook to get the data, and wrap your component in ChartsTooltipContainer to follow the pointer position.ChartsItemTooltipContent or ChartsItemTooltipContent to get default data and place them in your custom tooltip.The library now uses the SVG filter attribute instead of d3-color for color manipulation.
LinePlot, AreaPlot, and BarPlot components.
If you've customized the fill of those elements, you might need to override it by using the CSS filter.theme.styleOverride is removed for MuiLineElement, MuiAreaElement, and MuiBarElement to improve performance.
You can still target those elements by using the MuiLinePlot, MuiAreaPlot, and MuiBarPlot and target the appropriate classes lineElementClasses.root, areaElementClasses.root, barElementClasses.rootRemoved the resolveSizeBeforeRender prop from all chart components — Learn more.
width and height props from the ChartsSurface component.viewport prop from all charts.@mui/x-charts@v8.0.0-alpha.1<ChartDataProvider /> and <ChartsSurface /> (#15375) @JCQuintas<ChartsGrid /> component (#15463) @alexfauquette<SvgRefProvider /> to split the received ref (#15424) @JCQuintasd3-color with CSS filter for highlight (#15084) @alexfauquette<DrawingProvider /> into <DrawingAreaProvider /> and <SvgRefProvider /> (#15417) @JCQuintas@mui/x-charts-pro@v8.0.0-alpha.1 Same changes as in @mui/x-charts@v8.0.0-alpha.1.
publicAPI methods in the render because they are now memoized — Learn more.@mui/x-tree-view@v8.0.0-alpha.1treeId from the item context (#15542) @flaviendelanglemoveItemInTree() (#15539) @flaviendelangleslotProps.groupTransition (#15534) @flaviendelangle'DensitySelectorGrid' to time-sensitive argos tests (#15425) @JCQuintasaction pins (#15462) @LukasTy.ts demo files (#15345) @KenanYusufNov 14, 2024
We'd like to offer a big thanks to the 22 contributors who made this release possible. Here are some highlights ✨:
📚 Documentation improvements
Special thanks go out to the community contributors who have helped make this release possible: @belkocik, @GeorgiosDrivas, @k-rajat19, @kalyan90, @DungTiger, @fxnoob, @GuillaumeMeheut Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @arthurbalduini, @cherniavskii, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @noraleonte, @oliviertassinari, @romgrk, @samuelsycamore, @joserodolfofreitas.
@mui/x-data-grid@8.0.0-alpha.0onPaginationModelChange callback (#13959) @DungTigerbaseMenuList and baseMenuItem (#15049) @romgrk@mui/x-data-grid-pro@8.0.0-alpha.0 Same changes as in @mui/x-data-grid@8.0.0-alpha.0, plus:
@mui/x-data-grid-premium@8.0.0-alpha.0 Same changes as in @mui/x-data-grid-pro@8.0.0-alpha.0, plus:
The default DOM structure of the field has changed Learn more.
v8.x, the fields' DOM structure consisted of an <input />, which held the whole value for the component, but unfortunately presents a few limitations in terms of accessibility when managing multiple section values.v8.x, all the field and picker components come with a new DOM structure that allows the field component to set aria attributes on individual sections, providing a far better experience with screen readers.Some translation keys no longer require utils and the date object as parameters, but only the formatted value as a string. The keys affected by this changes are: clockLabelText, openDatePickerDialogue and openTimePickerDialogue — Learn more.
The following types are no longer exported by @mui/x-date-pickers and @mui/x-date-pickers-pro — Learn more.
UseDateFieldComponentPropsUseTimeFieldComponentPropsUseDateTimeFieldComponentPropsBaseSingleInputFieldPropsBaseMultiInputFieldPropsBasePickersTextFieldPropsThe TDate generic has been removed from all the types, interfaces, and variables of the @mui/x-date-pickers and @mui/x-date-pickers-pro packages — Learn more.
Renamed usePickersTranslations and usePickersContext hooks to have a coherent Picker prefix instead of Pickers — Learn more.
The LicenseInfo object is no longer exported from the @mui/x-date-pickers-pro package — Learn more.
@mui/x-date-pickers@8.0.0-alpha.0UseDateFieldComponentProps and equivalent interfaces (#15053) @flaviendelangleownerState object (#15056) @flaviendelangleownerState of the field and actionBar slots when resolved in a picker component (#15162) @flaviendelangleDateCalendar timezone management (#12321) @LukasTyDateTimeRangePicker error when using format without time (#14917) @fxnoobDigitalClock time options on a DST switch day (#10793) @LukasTyTDate generics in favor of PickerValidDate direct usage (#15001) @flaviendelangleutils and value params from translations (#14986) @arthurbalduini@mui/x-license (#14487) @k-rajat19disabled and readOnly props (#15304) @flaviendelangleownerState in DateCalendar, DateRangeCalendar, MonthCalendar and YearCalendar (#15171) @flaviendelangleownerState in usePickersLayout and useXXXPicker (#14994) @flaviendelangle@mui/x-date-pickers-pro@8.0.0-alpha.0 Same changes as in @mui/x-date-pickers@8.0.0-alpha.0.
The legend prop has been removed. To pass props to the legend, use slotProps={{ legend: { ... } }} instead. This can be automatically done with the codemod as long as the legend prop does not come from a destructured object — Learn more.
The slots.legend does not receive the drawingArea prop. You can still access your custom legend with the useDrawingArea() hook if your custom legend needs it.
Removed or renamed multiple props from Series — Learn more.
highlighted and faded properties of highlightScope have been deprecated in favor of highlight and fade.
The deprecated ones are now removed.xAxisKey, yAxisKey, and zAxisKey properties have been deprecated in favor of xAxisId, yAxisId, and zAxisId.The Pie Chart lost all props and renderer linked to axes because pie chart does not need cartesian axes. If you used it, you can still add them back with composition. Please consider opening an issue to share your use case with us — Learn more.
@mui/x-charts@8.0.0-alpha.0hideLegend prop (#15277) @alexfauquettenull data (#15337) @alexfauquettexAxisKey, yAxisKey, and zAxisKey series keys (#15192) @alexfauquettelegend props (#15081) @alexfauquettegetSymbol method (#15233) @romgrk@mui/x-charts-pro@8.0.0-alpha.0 Same changes as in @mui/x-charts@8.0.0-alpha.0.
The ContentComponent or ContentProps props of the <TreeItem /> component have been removed in favor of the new slots, slotProps props and of the useTreeItem hook — Learn more.
The onClick and onMouseDown callbacks of the Tree Item component are now passed to the root element instead of the content — Learn more.
Rename the <TreeItem2 /> component (and related utils) — Learn more.
The <TreeView /> component has been renamed <SimpleTreeView /> which has exactly the same API — Learn more.
The indentation of nested Tree Items is now applied on the content of the element — Learn more.
@mui/x-tree-view@8.0.0-alpha.0TreeView component (#15093) @flaviendelangle<TreeItem /> with <TreeItem2 /> and migrate all the components and utils (#14913) @flaviendelangleLicenseInfo from @mui/x-date-pickers-pro (#15321) @flaviendelanglePickersPopper component to the Date Picker customization playground (#15305) @LukasTyAutocomplete Field demo (#15165) @flaviendelangleapplyDomain docs for the charts (#15332) @JCQuintasAdapterMomentHijri doc section (#15312) @flaviendelanglePickersTextField in the customization playground (#15288) @LukasTynext instead of ^8.0.0 in the migration guides (#15091) @flaviendelanglecherry-pick GitHub actions (#15099) @LukasTy() at the name of function name in the doc (#15075) @oliviertassinarimaster @oliviertassinaritools-public.mui.com redirection @oliviertassinarihelpers to @mui/x-internals package (#15188) @LukasTyMar 17, 2025
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
@mui/material version 7 in all X packagesSpecial thanks go out to the community contributors who have helped make this release possible: @Blake-McCullough, @hlavacz, @yelahj, @k-rajat19, @nusr. Following are all team members who have contributed to this release: @arminmeh, @flaviendelangle, @LukasTy, @michelengelen, @MBilalShafi.
@mui/x-data-grid@7.28.0toggleMenu click (#16909) @michelengelenprocessRowUpdate() error if the row is removed before it is executed (#16904) @arminmehprintOptions not respecting hideFooter root prop (#16915) @k-rajat19@mui/x-data-grid-pro@7.28.0 Same changes as in @mui/x-data-grid@7.28.0, plus:
@mui/x-data-grid-premium@7.28.0 Same changes as in @mui/x-data-grid-pro@7.28.0, plus:
@mui/x-date-pickers@7.28.0@mui/x-date-pickers-pro@7.28.0 Same changes as in @mui/x-date-pickers@7.28.0, plus:
@mui/x-charts@7.28.0Internal changes.
@mui/x-charts-pro@7.28.0 Same changes as in @mui/x-charts@7.28.0.
@mui/x-tree-view@7.28.0Internal changes.
@mui/x-tree-view-pro@7.28.0 Same changes as in @mui/x-tree-view@7.28.0.
@mui/material v7 in dependencies (#16951) @LukasTyMar 7, 2025
We'd like to offer a big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
Team members who have contributed to this release: @arminmeh, @cherniavskii, @LukasTy, @michelengelen.
@mui/x-data-grid@7.27.3aria-hidden console error when scrollbar is dragged (#16834) @arminmeh@mui/x-data-grid-pro@7.27.3 Same changes as in @mui/x-data-grid@7.27.3.
@mui/x-data-grid-premium@7.27.3 Same changes as in @mui/x-data-grid-pro@7.27.3.
@mui/x-date-pickers@7.27.3helperText (#16828) @LukasTy@mui/x-date-pickers-pro@7.27.3 Same changes as in @mui/x-date-pickers@7.27.3.
Feb 27, 2025
We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @pcorpet, @noherczeg, @denpiligrim. Following are all team members who have contributed to this release: @MBilalShafi, @KenanYusuf.
@mui/x-data-grid@v7.27.2showColumnVerticalBorder prop (#16726) @KenanYusufGridSortModel (#16731) @pcorpet@mui/x-data-grid-pro@v7.27.2 Same changes as in @mui/x-data-grid@v7.27.2.
@mui/x-data-grid-premium@v7.27.2 Same changes as in @mui/x-data-grid-pro@v7.27.2.
Feb 25, 2025
We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @nusr, @officialkidmax. Following are all team members who have contributed to this release: @bernardobelchior, @MBilalShafi, @KenanYusuf.
@mui/x-data-grid@7.27.1getRowId() API method as a selector (#16574) @MBilalShafi@mui/x-data-grid-pro@7.27.1 Same changes as in @mui/x-data-grid@7.27.1.
@mui/x-data-grid-premium@7.27.1 Same changes as in @mui/x-data-grid-pro@7.27.1.
@mui/x-date-pickers@7.27.1@mui/x-date-pickers-pro@7.27.1 Same changes as in @mui/x-date-pickers@7.27.1.
@mui/x-charts@7.27.1@mui/x-charts-pro@7.27.1 Same changes as in @mui/x-charts@7.27.1.
Feb 17, 2025
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @pawelkula, @Neonin. Following are all team members who have contributed to this release: @cherniavskii, @JCQuintas, @oliviertassinari, @arminmeh and @LukasTy
@mui/x-data-grid@7.27.0resetPageOnSortFilter prop that resets the page after sorting and filtering (#16580) @arminmehundefined value for pagination rowCount (#16558) @cherniavskii@mui/x-data-grid-pro@7.27.0 Same changes as in @mui/x-data-grid@7.27.0.
@mui/x-data-grid-premium@7.27.0 Same changes as in @mui/x-data-grid-pro@7.27.0, plus:
@mui/x-date-pickers@7.27.0Internal changes.
@mui/x-date-pickers-pro@7.27.0 Same changes as in @mui/x-date-pickers@7.27.0, plus:
@mui/x-charts@7.27.0Internal changes.
@mui/x-charts-pro@7.27.0 Feb 7, 2025
We'd like to offer a big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @lauri865. Following are all team members who have contributed to this release: @arminmeh, @noraleonte, @LukasTy, @KenanYusuf, @flaviendelangle.
@mui/x-data-grid@7.26.0<GridRoot /> double-render pass on mount in SPA mode (#16480) @lauri865@mui/x-data-grid-pro@7.26.0 Same changes as in @mui/x-data-grid@7.26.0, plus:
useGridApiContext() for Pro and Premium packages on React < 19 (#16446) @arminmeh@mui/x-data-grid-premium@7.26.0 Same changes as in @mui/x-data-grid-pro@7.26.0, plus:
@mui/x-date-pickers@7.26.0Internal changes.
@mui/x-date-pickers-pro@7.26.0 Same changes as in @mui/x-date-pickers@7.26.0, plus:
currentMonthCalendarPosition prop behavior on mobile (#16457) @LukasTy@mui/x-charts@7.26.0Internal changes.
@mui/x-charts-pro@7.26.0 Same changes as in @mui/x-charts@7.26.0.
@mui/x-tree-view@7.26.0Internal changes.
@mui/x-tree-view-pro@7.26.0 Same changes as in @mui/x-tree-view@7.26.0.
Jan 31, 2025
We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @k-rajat19, @lauri865. Following are all team members who have contributed to this release: @KenanYusuf, @MBilalShafi, @arminmeh.
@mui/x-data-grid@7.25.0renderContext calculation with scroll bounce / over-scroll (#16368) @lauri865onClick prop on toolbar buttons (#16364) @KenanYusuficonContainer during autosizing (#16409) @michelengelen@mui/x-data-grid-pro@7.25.0 Same changes as in @mui/x-data-grid@7.25.0, plus:
useGridApiRef for Pro and Premium packages on React < 19 (#16348) @arminmeh@mui/x-data-grid-premium@7.25.0 Same changes as in @mui/x-data-grid-pro@7.25.0.
@mui/x-date-pickers@7.25.0Internal changes.
@mui/x-date-pickers-pro@7.25.0 Same changes as in @mui/x-date-pickers@7.25.0.
@mui/x-charts@7.25.0Internal changes.
@mui/x-charts-pro@7.25.0 Same changes as in @mui/x-charts@7.25.0.
@mui/x-tree-view@7.25.0Internal changes.
@mui/x-tree-view-pro@7.25.0 Same changes as in @mui/x-tree-view@7.25.0.
Jan 24, 2025
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @mostafaRoosta74, @lauri865.
Following are all team members who have contributed to this release: @alexfauquette, @JCQuintas, @cherniavskii, @LukasTy, @arminmeh.
@mui/x-data-grid@7.24.1apiRef to be MutableRefObject for React versions < 19 (#16320) @arminmeh@mui/x-data-grid-pro@7.24.1 Same changes as in @mui/x-data-grid@7.24.1.
@mui/x-data-grid-premium@7.24.1 Same changes as in @mui/x-data-grid-pro@7.24.1.
@mui/x-date-pickers@7.24.1all selected state on section edit (#16232) @LukasTy@mui/x-date-pickers-pro@7.24.1 Same changes as in @mui/x-date-pickers@7.24.1.
@mui/x-charts@7.24.1offset could be Infinite (@JCQuintas) (#16309) @JCQuintas@mui/x-charts-pro@7.24.1 Same changes as in @mui/x-charts@7.24.1.
@mui/x-tree-view@7.24.1Internal changes.
@mui/x-tree-view-pro@7.24.1 Same changes as in @mui/x-tree-view@7.24.1.
domainLimit definition (#16271) @alexfauquette@mui/x-internals a dependency of @mui/x-license (#16265) @alexfauquetteJan 17, 2025
We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @lauri865, @AxharKhan. Following are all team members who have contributed to this release: @KenanYusuf, @arminmeh, @cherniavskii, @michelengelen, @samuelsycamore, @LukasTy.
@mui/x-data-grid@7.24.0@mui/x-data-grid-pro@7.24.0 Same changes as in @mui/x-data-grid@7.24.0, plus:
@mui/x-data-grid-premium@7.24.0 Same changes as in @mui/x-data-grid-pro@7.24.0.
@mui/x-date-pickers@7.24.0Internal changes.
@mui/x-date-pickers-pro@7.24.0 Same changes as in @mui/x-date-pickers@7.24.0.
@mui/x-charts@7.24.0Internal changes.
@mui/x-charts-pro@7.24.0 Same changes as in @mui/x-charts@7.24.0.
@mui/x-tree-view@7.24.0Internal changes.
@mui/x-tree-view-pro@7.24.0 Same changes as in @mui/x-tree-view@7.24.0.
RefObject (#16125) @arminmehreact and react-dom definitions to simplify dep resolving (#16214) @LukasTyJan 9, 2025
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @josteinjhauge, @derek-0000, @nusr, @k-rajat19, @tomashauser. Following are all team members who have contributed to this release: @flaviendelangle, @LukasTy, @MBilalShafi, @arminmeh, @oliviertassinari, @cherniavskii.
@mui/x-data-grid@7.23.6name attribute to selection checkboxes (#16041) @derek-0000@mui/x-data-grid-pro@7.23.6 Same changes as in @mui/x-data-grid@7.23.6.
@mui/x-data-grid-premium@7.23.6 Same changes as in @mui/x-data-grid-pro@7.23.6.
@mui/x-date-pickers@7.23.6date-fns-jalali v4 (#16013) @LukasTy@mui/x-date-pickers-pro@7.23.6 Same changes as in @mui/x-date-pickers@7.23.6.
@mui/x-charts@7.23.6@mui/x-charts-pro@7.23.6 Same changes as in @mui/x-charts@7.23.6.
@mui/x-tree-view@7.23.6@mui/x-tree-view-pro@7.23.6 Same changes as in @mui/x-tree-view@7.23.6.
EditingWithDatePickers demo (#16047) @k-rajat19LocalizationProvider (#16088) @tomashauserrelease:version docs (#16040) @cherniavskiiDec 27, 2024
Here are some highlights ✨:
@mui/x-data-grid@7.23.5No changes since @mui/x-data-grid@v7.23.4.
@mui/x-data-grid-pro@7.23.5 Same changes as in @mui/x-data-grid@7.23.5.
@mui/x-data-grid-premium@7.23.5 Same changes as in @mui/x-data-grid-pro@7.23.5.
Dec 27, 2024
We'd like to offer a big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributor who has helped make this release possible: @JoepVerkoelen. Following are all team members who have contributed to this release: @arminmeh, @oliviertassinari.
@mui/x-data-grid@7.23.4forwardRef with a shim for forward compatibility (#15984) @lauri865@mui/x-data-grid-pro@7.23.4 Same changes as in @mui/x-data-grid@7.23.4.
@mui/x-data-grid-premium@7.23.4 Same changes as in @mui/x-data-grid-pro@7.23.4, plus:
Dec 19, 2024
We'd like to offer a big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @k-rajat19, @good-jinu. Following are all team members who have contributed to this release: @KenanYusuf, @MBilalShafi, @arminmeh, @flaviendelangle.
@mui/x-data-grid@7.23.3.main element (#15919) @MBilalShaficolumnGroupHeaderHeight prop in getTotalHeaderHeight method (#15927) @k-rajat19indeterminateCheckboxAction prop (#15862) @MBilalShafiaria-label value for group checkboxes (#15861) @MBilalShafi<GridActionsCell /> (#15871) @k-rajat19@mui/x-data-grid-pro@7.23.3 Same changes as in @mui/x-data-grid@7.23.3.
@mui/x-data-grid-premium@7.23.3 Same changes as in @mui/x-data-grid-pro@7.23.3.
@mui/x-date-pickers@7.23.3@mui/x-date-pickers-pro@7.23.3 Same changes as in @mui/x-date-pickers@7.23.3.
Dec 12, 2024
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @ihsanberkozcan, @k-rajat19, @lhilgert9, @nusr, @rares985.
Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy.
@mui/x-data-grid@7.23.2columnsManagement slot (#15821) @k-rajat19@mui/x-data-grid-pro@7.23.2 Same changes as in @mui/x-data-grid@7.23.2, plus:
@mui/x-data-grid-premium@7.23.2 Same changes as in @mui/x-data-grid-pro@7.23.2, plus:
valueOptions for singleSelect column type (#15754) @arminmeh@mui/x-date-pickers@7.23.2@mui/x-date-pickers-pro@7.23.2 Same changes as in @mui/x-date-pickers@7.23.2.
@mui/x-charts@7.23.2@mui/x-charts-pro@7.23.2 Same changes as in @mui/x-charts@7.23.2.
@mui/x-tree-view@v7.23.2No changes, releasing to keep the versions in sync.
@mui/x-tree-view-pro@7.23.2 Releasing to benefit from license package fix (#15818).
updateRows method for list view demos (#15824) @KenanYusuf@mui/x-tree-view-pro to releaseChangelog (#15747) @flaviendelangleconsole.log for the error message on CodeSandbox to avoid rendering error (#15818) @arminmehDec 5, 2024
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @lhilgert9.
Following are all team members who have contributed to this release: @arthurbalduini, @cherniavskii, @flaviendelangle, @JCQuintas, @LukasTy and @MBilalShafi.
@mui/x-data-grid@7.23.1@mui/x-data-grid-pro@7.23.1 Same changes as in @mui/x-data-grid@7.23.1, plus:
@mui/x-data-grid-premium@7.23.1 Same changes as in @mui/x-data-grid-pro@7.23.1.
@mui/x-date-pickers@7.23.1touchend event (#15430) @arthurbalduini@mui/x-date-pickers-pro@7.23.1 Same changes as in @mui/x-date-pickers@7.23.1.
@mui/x-charts@7.23.1pattern and gradient support (#15724) @JCQuintas@mui/x-charts-pro@7.23.1 Same changes as in @mui/x-charts@7.23.1.
@mui/internal-markdown to support nested demo imports (#15738) @alexfauquette@mui/x-tree-view-pro to releaseChangelog (#15747) @flaviendelangleNov 29, 2024
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
✨ Support for a new display mode on the Data Grid with the List View feature, offering an extremely flexible way to render datasets and enabling developers to adapt how data is displayed across different screen sizes.
https://github.com/user-attachments/assets/61286adc-03fc-4323-9739-8ca726fcc16c
⚛️ React 19 support
Special thanks go out to the community contributors who have helped make this release possible: @dloeda, @headironc, @mathzdev, @nphmuller, @lhilgert9, @lauri865. Following are all team members who have contributed to this release: @oliviertassinari, @arminmeh, @KenanYusuf, @flaviendelangle, @MBilalShafi.
@mui/x-data-grid@v7.23.0/jsdom/ to /jsdom|HappyDOM/. (#15642) @jedesrochesGridCell performance (#15621) @lauri865@mui/x-data-grid-pro@v7.23.0 Same changes as in @mui/x-data-grid@v7.23.0, plus:
boolean column type (#15640) @k-rajat19@mui/x-data-grid-premium@v7.23.0 Same changes as in @mui/x-data-grid-pro@v7.23.0.
@mui/x-date-pickers@v7.23.0America/Asuncion timezone and AdapterMoment (#15653) @flaviendelangleprops.referenceDate timezone when props.value and props.defaultValue are not defined (#15544) @flaviendelangle@mui/x-date-pickers-pro@v7.23.0 Same changes as in @mui/x-date-pickers@v7.23.0.
@mui/x-charts@v7.23.0releasePointerCapture (#15609) @alexfauquette@mui/x-charts-pro@v7.23.0 Same changes as in @mui/x-charts@v7.23.0.
@mui/x-tree-view@v7.23.0@mui/x-tree-view-pro@7.23.0 Same changes as in @mui/x-tree-view@7.23.0.
Nov 21, 2024
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @CarlosLopezLg, @headironc, @viktormelin, @qerkules, @DungTiger, @hendrikpeilke, @k-rajat19. Following are all team members who have contributed to this release: @alexfauquette, @LukasTy, @MBilalShafi, @flaviendelangle.
@mui/x-data-grid@7.22.3GridColumnsManagement (#15476) @k-rajat19onPaginationModelChange (#15402) @DungTiger@mui/x-data-grid-pro@7.22.3 Same changes as in @mui/x-data-grid@7.22.3.
@mui/x-data-grid-premium@7.22.3 Same changes as in @mui/x-data-grid-pro@7.22.3.
@mui/x-date-pickers@7.22.3props.value when it changes (#15500) @flaviendelangleDateTimeRangePicker error when using format without time (#15341) @fxnoobPickersToolbar component (#15525) @LukasTy@mui/x-date-pickers-pro@7.22.3 Same changes as in @mui/x-date-pickers@7.22.3, plus:
referenceDate when selecting date (#15431) @LukasTy@mui/x-charts@7.22.3No changes since @mui/x-charts@7.22.2.
@mui/x-charts-pro@7.22.3 PickersPopper component to customization playground (#15397) @LukasTynext version links (#15423) @LukasTyloading state in the demos (#15538) @cherniavskii.ts demo files (#15421) @KenanYusufNov 8, 2024
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @clins1994, @GuillaumeMeheut, @k-rajat19. Following are all team members who have contributed to this release: @LukasTy, @MBilalShafi, @KenanYusuf, @arminmeh.
Keep an eye out for the MUI⠀X v8.0.0-aplha.0 release soon. It will follow a weekly release schedule as always until it is stable.
@mui/x-data-grid@7.22.2null reference error in GridVirtualScrollbar (#15289) @MBilalShafiboolean column type (#15257) @k-rajat19@mui/x-data-grid-pro@7.22.2 Same changes as in @mui/x-data-grid@7.22.2, plus:
Enter key in Tree data (#15313) @k-rajat19@mui/x-data-grid-premium@7.22.2 Same changes as in @mui/x-data-grid-pro@7.22.2, plus:
@mui/x-date-pickers@7.22.2moment-hijri@3.0.0 (#15248) @LukasTy@mui/x-date-pickers-pro@7.22.2 Same changes as in @mui/x-date-pickers@7.22.2.
@mui/x-charts@7.22.2SeriesValueFormatter to return null value (#15295) @clins1994domainLimit for each axis. (#15325) @GuillaumeMeheut@mui/x-charts-pro@7.0.0-beta.7 Same changes as in @mui/x-charts@7.22.2.
Nov 1, 2024
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @wojtkolos, @dpak-maurya, @k-rajat19. Following are all team members who have contributed to this release: @LukasTy, @arminmeh, @MBilalShafi, @KenanYusuf, @flaviendelangle.
@mui/x-data-grid@7.22.1rowGroupingModelChange handler to respective hook (#15127) @MBilalShafi@mui/x-data-grid-pro@7.22.1 Same changes as in @mui/x-data-grid@7.22.1, plus:
@mui/x-data-grid-premium@7.22.1 @mui/x-date-pickers@7.22.1@mui/x-date-pickers-pro@7.22.1 Same changes as in @mui/x-date-pickers@7.22.1.
@mui/x-tree-view@7.22.1TreeItem2DragAndDropOverlay and TreeItem2LabelInput from the root of each package (#15208) @flaviendelangle@mui/x-tree-view-pro@7.22.1 Same changes as in @mui/x-tree-view@7.22.1.
Oct 25, 2024
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
Special thanks go out to the community contributors who have helped make this release possible: @clins1994, @GITPHLAP, @k-rajat19, @kalyan90, @merotosc, @yash49. Following are all team members who have contributed to this release: @cherniavskii, @flaviendelangle, @LukasTy, @MBilalShafi, @romgrk.
@mui/x-data-grid@7.22.0GridPanelAnchor positioning (#15022) @k-rajat19pageStyle prop of the GridPrintExportMenuItem component (#15015) @flaviendelangle<Box /> and <Badge /> (#15013) @romgrk@mui/x-data-grid-pro@7.22.0 Same changes as in @mui/x-data-grid@7.22.0, plus:
@mui/x-data-grid-premium@7.22.0 Same changes as in @mui/x-data-grid-pro@7.22.0, plus:
@mui/x-date-pickers@7.22.0DateCalendar timezone management (#15119) @LukasTyDigitalClock time options on a DST switch day (#15092) @LukasTy@mui/x-date-pickers-pro@7.22.0 Same changes as in @mui/x-date-pickers@7.22.0.
@mui/x-charts@7.22.0onAxisClick(_, data) callback (#15038) @clins1994@mui/x-charts-pro@7.0.0-beta.6 Same changes as in @mui/x-charts@7.22.0.
@mui/x-tree-view@7.22.0default-branch-switch instances for v7.x (#15085) @MBilalShafifireEvent instead of userEvent (#14927) @LukasTyOct 17, 2024
We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
dataset prop support for the Scatter Chart componentSpecial thanks go out to the community contributors who have helped make this release possible: @k-rajat19, @kalyan90, @rotembarsela, @wangkailang. Following are all team members who have contributed to this release: @arthurbalduini, @cherniavskii, @flaviendelangle, @JCQuintas, @LukasTy, @MBilalShafi, @arminmeh, @romgrk, @KenanYusuf, @oliviertassinari, @samuelsycamore.
@mui/x-data-grid@7.21.0onRowSelectionModelChange firing unnecessarily on initial render (#14909) @MBilalShafionRowSelectionModelChange not being called after row is removed (#14972) @arminmeh@mui/x-data-grid-pro@7.21.0 Same changes as in @mui/x-data-grid@7.21.0, plus:
rowHeight={undefined} (#14983) @cherniavskii@mui/x-data-grid-premium@7.21.0 Same changes as in @mui/x-data-grid-pro@7.21.0.
@mui/x-date-pickers@7.21.0PageUp and PageDown event handlers on time components (#14928) @arthurbalduiniownerState object (#14889) @flaviendelanglePickerValidDate usage in the Date Range Picker Toolbar (#14925) @flaviendelangle@mui/x-date-pickers-pro@7.21.0 Same changes as in @mui/x-date-pickers@7.21.0.
@mui/x-charts@7.21.0dataset to be used with the Scatter Chart (#14915) @JCQuintasreduce motion preference disables animation on page load (#14417) @JCQuintas@mui/x-charts-pro@7.0.0-beta.5 Same changes as in @mui/x-charts@7.21.0.
@mui/x-tree-view@7.21.0alpha() usage with CSS variables (#14969) @wangkailangaria-selected attribute (#14991) @flaviendelangle@mui/x-codemod@7.21.0vitest/playwright (#14926) @JCQuintasAdapterDayjs coverage calculation (#14957) @LukasTyOct 11, 2024
We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
props.ContentComponent and props.ContentProps) have been deprecated and will be removed in the new major version of the Tree View component.Special thanks go out to the community contributors who have helped make this release possible: @k-rajat19, @kalyan90, @uma-neko, @vfbiby. Following are all team members who have contributed to this release: @alelthomas, @arminmeh, @arthurbalduini, @cherniavskii, @flaviendelangle, @JCQuintas, @MBilalShafi, @noraleonte, @oliviertassinari, @samuelsycamore, @siriwatknp.
@mui/x-data-grid@7.20.0onColumnHeaderContextMenu event (#14734) @vfbibyscrollToIndexes (#14888) @arminmehrowId param to processRowUpdate (#14821) @k-rajat19@mui/x-data-grid-pro@7.20.0 Same changes as in @mui/x-data-grid@7.20.0, plus:
rowSelectionPropagation JSDoc and doc section (#14907) @flaviendelangle@mui/x-data-grid-premium@7.20.0 Same changes as in @mui/x-data-grid-pro@7.20.0.
@mui/x-date-pickers@7.20.0PageUp and PageDown support for time components (#14812) @arthurbalduiniPickerValidDate (#14896) @flaviendelangleDateFieldInPickerProps interface to the DatePicker folder and rename it DatePickerFieldProps (same for time and date time) (#14828) @flaviendelangle@mui/x-date-pickers-pro@7.20.0 Same changes as in @mui/x-date-pickers@7.20.0.
@mui/x-charts@7.20.0No changes since @mui/x-charts@v7.19.0.
@mui/x-charts-pro@7.0.0-beta.4 Same changes as in @mui/x-charts@7.20.0.
@mui/x-tree-view@7.20.0ContentComponent and ContentProps props (#14908) @flaviendelangletooltip and highlighting pages (#14824) @JCQuintas<TreeItem2 /> component and the useTreeItem2 hook (#14551) @noraleonte@mui/utils v6 (#14867) @siriwatknpdata-mui-test in favour of data-testid (#14882) @JCQuintasvitest group (#14856) @JCQuintaswaitFor() with act() (#14851) @oliviertassinariOct 4, 2024
We'd like to offer a big thanks to the 26 contributors who made this release possible. Here are some highlights ✨:
minHeight and maxHeight on flex parent container for the Data Grid componentpublicAPI from the useTreeItem2Utils hook for the Tree ViewSpecial thanks goes out to our community contributors who have helped make this release possible: @AWAIS97, @chucamphong, @GMchris, @JakubSveda, @k-rajat19, @k725, @lhilgert9, @ruiaraujo012, @Sanderand, @thomasmoon, @vallereaugabriel. Following are all team members who have contributed to this release: @alexfauquette, @arminmeh, @arthurbalduini, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @MBilalShafi, @michelengelen, @noraleonte, @oliviertassinari, @romgrk, @sai6855, @samuelsycamore.
@mui/x-data-grid@7.19.0undefined value (#14456) @sai6855checkboxSelectionVisibleOnly reset the selection on filtering (#14677) @MBilalShafiCSSVarsProvider is used (#12901) @cherniavskiiminHeight and maxHeight on flex parent container (#14614) @cherniavskii@mui/x-data-grid-pro@7.19.0 Same changes as in @mui/x-data-grid@7.19.0, plus:
onRowsScrollEnd not firing on very fast scrolling (#14171) @arminmeh@mui/x-data-grid-premium@7.19.0 Same changes as in @mui/x-data-grid-pro@7.19.0, plus:
@mui/x-date-pickers@7.19.0yearsOrder="desc" and direction="rtl" (#14682) @thomasmoonPickerValidDate type (#14771) @flaviendelangle@mui/x-date-pickers-pro@7.19.0 Same changes as in @mui/x-date-pickers@7.19.0.
@mui/x-charts@7.19.0LineChart area animation being stuck when resizing container (#14711) @alexfauquettewarnOnce (#14792) @JCQuintas@mui/x-charts-pro@7.0.0-beta.3 Same changes as in @mui/x-charts@7.19.0.
@mui/x-tree-view@7.19.0getDefaultizedParams instead of in the plugin render (#14661) @flaviendelanglepublicAPI form useTreeItem2Utils (#14729) @noraleonteinstance.getTreeItemIdAttribute (#14667) @flaviendelanglepages.ts navigation (#14782) @samuelsycamoree identifier (#14724) @samuelsycamoreEscape event firing event (#14797) @oliviertassinariSep 20, 2024
We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
💫 Support Row spanning on the Data Grid that automatically merges the consecutive cells in a column based on the cell value
⏰ Support date-fns v4 (#14673) @LukasTy
@mui/x-data-grid@7.18.0columnGroupHeaderHeight prop for sizing column group headers (#14637) @KenanYusufdocument reference when the grid is rendered in a popup window (#14649) @arminmehminFirstColumn from GetHeadersParams interface (#14450) @k-rajat19@mui/x-data-grid-pro@7.18.0 Same changes as in @mui/x-data-grid@7.18.0, plus:
onRowsScrollEnd being triggered instantly when bottom pinned row is present (#14602) @arminmehisEmpty and isNotEmpty filter operators (#14493) @k-rajat19@mui/x-data-grid-premium@7.18.0 Same changes as in @mui/x-data-grid-pro@7.18.0.
@mui/x-date-pickers@7.18.0date-fns v4 (#14673) @LukasTy@mui/x-date-pickers-pro@7.18.0 Same changes as in @mui/x-date-pickers@7.18.0.
@mui/x-charts@7.18.0PolarProvider to manage polar axes (#14642) @alexfauquetteLineChart animation being stuck with initial drawing area value (#14553) @JCQuintas@mui/x-charts-pro@7.0.0-beta.1 Same changes as in @mui/x-charts@7.18.0.
@mui/x-tree-view@7.18.0"use client" directive to every public component and hook (#14579) @flaviendelanglegroupingValueGetter callout in column definition docs (#14599) @michelengelenvale-action.yml from main repo @oliviertassinarivalueGetter and valueFormatter signature change (#14613) @cherniavskiiobserve method to avoid flaky wait for a callback (#14640) @arminmehmaster (#14644) @cherniavskiipackage.json repository rule @oliviertassinariSep 13, 2024
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.17.0:has() selectors (#14559) @KenanYusuf@mui/x-data-grid-pro@7.17.0 Same changes as in @mui/x-data-grid@7.17.0.
@mui/x-data-grid-premium@7.17.0 Same changes as in @mui/x-data-grid-pro@7.17.0.
@mui/x-date-pickers@7.17.0useSplitFieldProps and make it public (#14514) @flaviendelangle"use client" directive to every public component and hook (#14562) @flaviendelangle@mui/x-date-pickers-pro@7.17.0 Same changes as in @mui/x-date-pickers@7.17.0, plus:
currentMonthCalendarPosition not scrolling to future sibling (#14442) @GMchris@mui/x-charts@7.17.0"use client" directive to every public component and hook (#14578) @flaviendelangleonItemClick on the Legend component (#14231) @JCQuintasonAxisClick with layout='horizontal' (#14547) @alexfauquettepath with circle for performance improvement (#14518) @alexfauquette@mui/x-charts-pro@7.0.0-beta.1 Same changes as in @mui/x-charts@7.17.0.
@mui/x-tree-view@7.17.0useTreeItem2 stable (#14498) @flaviendelangleconsole.error messages on charts docs (#14554) @JCQuintas@mui/x-internals (#14528) @k-rajat19ESLint plugins renovate group (#14574) @LukasTyact() logic (#14529) @oliviertassinariSep 5, 2024
We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
slots concept introduction documentation page (#13881)@mui/x-data-grid@7.16.0GridFilterInputMultipleValue (#14302) @sai6855columns and columnGroupingModel update (#14368) @cherniavskiiautoHeight prop enabled (#14235) @KenanYusuf@mui/x-data-grid-pro@7.16.0 Same changes as in @mui/x-data-grid@7.16.0, plus:
@mui/x-data-grid-premium@7.16.0 Same changes as in @mui/x-data-grid-pro@7.16.0.
@mui/x-date-pickers@7.16.0onError JSDoc (#14492) @flaviendelangle@mui/x-date-pickers-pro@7.16.0 Same changes as in @mui/x-date-pickers@7.16.0.
@mui/x-charts@7.16.0LineChart not properly animating when hydrating (#14355) @JCQuintas.mjs extension for ESM build (#14387) @alexfauquettepackage.json for vendor package (#14465) @alexfauquette@mui/x-charts-pro@7.0.0-beta.0 Same changes as in @mui/x-charts@7.16.0, plus:
BarChartPro and LineChartPro (#14391) @JCQuintas@mui/x-tree-view@7.16.0@mui/x-codemod@7.16.0experimentalFeatures codemod for typescript parser (#14150) @MBilalShafislots concept introduction page (#13881) @flaviendelanglePieChart examples (#14297) @JCQuintassecrets: inherit to workflow call (#14454) @michelengelenAug 29, 2024
We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
@mui/material@6) peer dependency (#14142) @cherniavskiiYou can now use MUI X components with either v5 or v6 of @mui/material package 🎉
@mui/x-data-grid-pro@7.15.0 GridRowReorderCell component (#14079) @genepaul@mui/x-data-grid-premium@7.15.0 Same changes as in @mui/x-data-grid-pro@7.15.0.
@mui/x-date-pickers@7.15.0onTouchStart handler for TimeClock (#14305) @arthurbalduini@mui/x-date-pickers-pro@7.15.0 Same changes as in @mui/x-date-pickers@7.15.0, plus:
@mui/x-charts@7.15.0themeAugmentation in pro plan (#14313) @lhilgert9LineChart transition stopping before completion (#14366) @JCQuintas@mui/x-charts-pro@7.0.0-alpha.3 Same changes as in @mui/x-charts@7.15.0, plus:
@mui/x-charts package (#14335) @LukasTyh2 @oliviertassinariMUI Core renovate group (#14382) @LukasTy@mui/material@6 (#14357) @cherniavskiinext releases of @mui/docs (#14364) @LukasTy@mui/material@6 peer dependency (#14142) @cherniavskiiuseRtl instead of useTheme to access direction (#14359) @LukasTyAug 23, 2024
We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
💫 Allow filtering the axis on zoom, making the axis adapt by removing values outside the view.
📊 Improve bar chart performances
@mui/x-data-grid@7.14.0getTreeDataPath (#11743) @pcorpetevent.key for Tab and Escape keys (#14170) @k-rajat19api in gridCellParams interface (#14201) @k-rajat19@mui/x-data-grid-pro@7.14.0 Same changes as in @mui/x-data-grid@7.14.0.
@mui/x-data-grid-premium@7.14.0 Same changes as in @mui/x-data-grid-pro@7.14.0, plus:
onCellSelectionModelChange not triggered when additional cell range is selected (#14199) @arminmeh@mui/x-date-pickers@7.14.0Space and Enter on the TimeClock component @arthurbalduini@mui/x-date-pickers-pro@7.14.0 Same changes as in @mui/x-date-pickers@7.14.0.
@mui/x-charts@7.14.0isPointInside function for both graphs and axis (#14222) @JCQuintas@mui/x-charts-pro@7.0.0-alpha.2 Same changes as in @mui/x-charts@7.14.0, plus:
eslint-plugin-testing-library (#14232) @LukasTyAug 16, 2024
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
💫 Allow to edit the label of Tree View's items.
🔧 Improve rows accessibility on the Data Grid features "Tree Data" and "Row Grouping". Certain "Row Grouping" accessibility updates will only be applied if experimental feature flag is enabled. See the documentation for more information.
@mui/x-data-grid@7.13.0null and undefined values (#14166) @k-rajat19useGridStateInitialization (#14181) @k-rajat19@mui/x-data-grid-pro@7.13.0 Same changes as in @mui/x-data-grid@7.13.0, plus:
@mui/x-data-grid-premium@7.13.0 Same changes as in @mui/x-data-grid-pro@7.13.0.
@mui/x-date-pickers@7.13.0@mui/x-date-pickers-pro@7.13.0 Same changes as in @mui/x-date-pickers@7.13.0.
@mui/x-charts@7.13.0baseline property to the LineChart series (#14153) @JCQuintasCartesianContextProvider to CartesianProvider (#14102) @JCQuintas@mui/x-charts-pro@7.0.0-alpha.1 Same changes as in @mui/x-charts@7.13.0.
@mui/x-tree-view@7.13.0canMoveItemToNewPosition prop (#14176) @flaviendelanglecache-docs plugin setup (#14105) @LukasTyAug 8, 2024
We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
@mui/x-charts-pro is released in alpha version 🧪. This new package introduces two main features:@mui/x-data-grid@7.12.1checkboxSelectionVisibleOnly behavior with server-side pagination (#14083) @MBilalShaficolumnHeadersContainerRef being undefined before mount (#14051) @samwato@mui/x-data-grid-pro@7.12.1 Same changes as in @mui/x-data-grid@7.12.1.
@mui/x-data-grid-premium@7.12.1 Same changes as in @mui/x-data-grid-pro@7.12.1.
@mui/x-date-pickers@7.12.1@mui/x-date-pickers-pro@7.12.1 Same changes as in @mui/x-date-pickers@7.12.1.
@mui/x-charts@7.12.1plugins to PluginProvider (#14056) @JCQuintas@mui/x-charts-pro@7.0.0-alpha.0 Same changes as in @mui/x-charts@7.12.1, plus:
@mui/x-tree-view@7.12.1No changes since @mui/x-tree-view@7.12.0.
updateRows() (#14027) @MBilalShafiRich Tree View-Ordering page (#14123) @oliviertassinariLatest Version section (#14132) @michelengelenAug 1, 2024
The Pro plan is receiving two new packages:
@mui/x-tree-view-pro (available today!)@mui/x-charts-pro (available in the coming weeks)As always, every feature released as part of the MIT plan will remain free and MIT licensed forever.
This expansion of the Pro plan comes with some adjustments to our pricing strategy. Learn more about those in the Upcoming changes to MUI X pricing in 2024 blog post.
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
🎁 Introduce item reordering using drag and drop on the <RichTreeViewPro /> component
📦 Support CommonJS bundle out of the box on @mui/x-charts by adding vendored D3 dependencies.
d3 packages installed by @mui/x-charts and don't have them in your package.json. You shouldn't be affected otherwise.For more context, the initial issue is caused by D3 only exporting ESM.
The solution up until now was to export charts with only ESM. But some frameworks are confused by this configuration.
So in order to fix this, we are providing a CJS version of D3.
🌍 Improve Turkish (tr-TR) locale on the Data Grid
@mui/x-data-grid@7.12.0role=presentation a11y issue (#13891) @romgrk@mui/x-data-grid-pro@7.12.0 Same changes as in @mui/x-data-grid@7.12.0.
@mui/x-data-grid-premium@7.12.0 Same changes as in @mui/x-data-grid-pro@7.12.0.
@mui/x-date-pickers@7.12.0@mui/x-date-pickers-pro@7.12.0 Same changes as in @mui/x-date-pickers@7.12.0.
@mui/x-charts@7.12.0axisId prop being allowed in xAxis/yAxis config. Use id instead. (#13986) @JCQuintasSeriesProvider to use in filtering (#14026) @JCQuintas@mui/x-tree-view@7.12.0onItemClick on the Tree View components (#14018) @flaviendelangleisEventTargetInDescendants (#13982) @flaviendelangleminDate and maxDate default description (#14024) @LukasTyrenderCell & autogenerated rows (#13879) @romgrkcharts performance with codspeed (#13952) @JCQuintasvale action paths filtering (#14038) @LukasTyJul 25, 2024
We'd like to offer a big thanks to the 18 contributors who made this release possible. Here are some highlights ✨:
Zoom to be controllable for charts (#13858) @JCQuintas@mui/x-data-grid@7.11.1GridPreferencesPanel (#13934) @k-rajat19@mui/x-data-grid-pro@7.11.1 Same changes as in @mui/x-data-grid@7.11.1.
@mui/x-data-grid-premium@7.11.1 Same changes as in @mui/x-data-grid-pro@7.11.1, plus:
api object to events (#13893) @pcorpet@mui/x-date-pickers@7.11.1@mui/x-date-pickers-pro@7.11.1 Same changes as in @mui/x-date-pickers@7.11.1.
@mui/x-charts@7.11.1ownerState function to slotProps typing when available (#13965) @alexfauquetteZoom to be controllable (#13858) @JCQuintasxAxisKey /zAxisKey in favor of xAxisId/zAxisId (#13940) @alexfauquette@mui/x-tree-view@7.11.1SparkLineChart reference not being correctly capitalised (#13960) @duckboy81@mui/material-nextjs to MUI Core renovate group (#13966) @LukasTyuseReactVersion script from the monorepo (#13710) @cherniavskiiJul 18, 2024
We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.11.0gridEditRowsStateSelector (#13877) @romgrkcolumnResizeStop event not emitted when column is not resized (#13307) @mateuseapdate and datetime-local input types in GridFilterInputMultipleValue type (#13411) @karudedios@mui/x-data-grid-pro@7.11.0 Same changes as in @mui/x-data-grid@7.11.0.
@mui/x-data-grid-premium@7.11.0 Same changes as in @mui/x-data-grid-pro@7.11.0.
@mui/x-date-pickers@7.11.0Mui-selected class to TimeClock meridiem buttons (#13848) @LukasTy@mui/x-date-pickers-pro@7.11.0 Same changes as in @mui/x-date-pickers@7.11.0, plus:
name prop propagation regression (#13821) @LukasTy@mui/x-charts@7.11.0useChartContainerProps (#13817) @JCQuintasclassName to root element (#13647) @JCQuintas@mui/x-tree-view@7.11.0useTreeView hook (#13845) @flaviendelangleprocess.env.NODE_ENV in production (#13869) @cherniavskiionChange and onAccept props (#13543) @flaviendelanglerenovate group (#13846) @LukasTyimport/prefer-default-export rule @oliviertassinari...other and test imports in charts (#13844) @JCQuintasnext tag for @mui/docs package bumps (#13813) @LukasTy@mui/docs dependency (#13760) @LukasTyEventManager to @mui/x-internals package (#13815) @flaviendelangleJul 11, 2024
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.10.0'standard' in GridFilterInputMultipleValue (#13129) @tarunrajputreadonly on more array props (#13331) @pcorpet@mui/x-data-grid-pro@7.10.0 Same changes as in @mui/x-data-grid@7.10.0, plus:
@mui/x-data-grid-premium@7.10.0 Same changes as in @mui/x-data-grid-pro@7.10.0.
@mui/x-date-pickers@7.10.0readOnly flag (#13688) @LukasTy@mui/x-date-pickers-pro@7.10.0 Same changes as in @mui/x-date-pickers@7.10.0, plus:
calendarHeader slot props propagation (#13780) @LukasTyformat from given views (#13743) @LukasTy@mui/x-charts@7.10.0LineChart when using the log scale (#13791) @alexfauquetteOnSeriesItemClick documentation (#13761) @tonyhallett@mui/x-tree-view@7.10.0getItemTree and getItemOrderedChildrenIds methods to the public API (#13804) @flaviendelangleloading prop value (#13604) @oliviertassinariDateTimeRangePicker to the "Commonly used components" demo (#13775) @flaviendelangleDATA_GRID_PROPS_DEFAULT_VALUES alphabetically (#13783) @oliviertassinariJul 5, 2024
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
selectItem() and getItemDOMElement() methods to the TreeView component public APIusePickersTranslations hook public in the pickers component@mui/x-data-grid@7.9.0pagination={undefined} (#13349) @sai6855@mui/x-data-grid-pro@7.9.0 Same changes as in @mui/x-data-grid@7.9.0.
@mui/x-data-grid-premium@7.9.0 Same changes as in @mui/x-data-grid-pro@7.9.0.
@mui/x-date-pickers@7.9.0usePickersTranslations hook public (#13657) @flaviendelangle@mui/x-date-pickers-pro@7.9.0 Same changes as in @mui/x-date-pickers@7.9.0.
@mui/x-charts@7.9.0Zoom&Pan to the Pro charts (unreleased) (#13405) @JCQuintas@mui/x-tree-view@7.9.0selectItem() and getItemDOMElement() methods to the public API (#13485) @flaviendelanglereact_next workflow in CircleCI (#13360) @cherniavskiijscodeshift-add-imports package (#13720) @LukasTy@mui/docs usage (#13713) @LukasTyJun 28, 2024
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
🛰 Introduce server-side data source for improved server integration in the Data Grid.
Supports server-side pagination, sorting and filtering on plain and tree data, and automatic caching.
To enable, provide a getRows function to the unstable_dataSource prop on the Data Grid component.
const dataSource = {
getRows: async (params: GridServerGetRowsParams) => {
const data = await fetch(
`https://api.example.com/data?${new URLSearchParams({
page: params.page,
pageSize: params.pageSize,
sortModel: JSON.stringify(params.sortModel),
filterModel: JSON.stringify(params.filterModel),
}).toString()}`,
);
return {
rows: data.rows,
totalRows: data.totalRows,
};
},
}
<DataGridPro
unstable_dataSource={dataSource}
{...otherProps}
/>See server-side data documentation for more details.
📈 Support Date data on the BarChart component
@mui/x-data-grid@7.8.0columnHeaderSortIcon slot (#13563) @arminmehhideFooter option is set (#13034) @tarunrajput@mui/x-data-grid-pro@7.8.0 Same changes as in @mui/x-data-grid@7.8.0, plus:
@mui/x-data-grid-premium@7.8.0 Same changes as in @mui/x-data-grid-pro@7.8.0.
@mui/x-date-pickers@7.8.0@mui/x-date-pickers-pro@7.8.0 Same changes as in @mui/x-date-pickers@7.8.0.
@mui/x-charts@7.8.0Date data (#13471) @alexfauquette@mui/x-tree-view@7.8.0expansionTrigger prop (#13533) @noraleonteLuxon throwOnInvalid support (#13621) @LukasTy../internals root (#13633) @JCQuintas\_app folder with monorepo (#13582) @JanpotJun 21, 2024
We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.7.1@mui/x-data-grid-pro@7.7.1 Same changes as in @mui/x-data-grid@7.7.1, plus:
getTreeDataPath reference (#13519) @cherniavskii@mui/x-data-grid-premium@7.7.1 Same changes as in @mui/x-data-grid-pro@7.7.1.
@mui/x-date-pickers@7.7.1Space key down (#13510) @flaviendelangleonAccept callback (#13511) @flaviendelangleAdapterDateFnsV3 generated method types (#13464) @alexey-kozlenkovview behavior (#13552) @LukasTy@mui/x-date-pickers-pro@7.7.1 Same changes as in @mui/x-date-pickers@7.7.1, plus:
@mui/x-charts@7.7.1CartesianProvider to use logic in Pro package (#13531) @JCQuintasPro versions of regular charts (#13547) @JCQuintasChartContainerPro for future Zoom changes (#13532) @JCQuintas@mui/x-tree-view@7.7.1useTreeViewId to the core plugins (#13566) @flaviendelangleuseTreeViewId (#13579) @flaviendelangleitemId with escaping characters when using Simple Tree View (#13487) @oukunanPickerValidDate type override (#13476) @flaviendelangle@testing-library/react dependency (#13478) @LukasTyJun 13, 2024
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.7.0getFilterState method (#13418) @cherniavskii@mui/x-data-grid-pro@7.7.0 Same changes as in @mui/x-data-grid@7.7.0, plus:
@mui/x-data-grid-premium@7.7.0 Same changes as in @mui/x-data-grid-pro@7.7.0.
@mui/x-date-pickers@7.7.0@mui/x-date-pickers-pro@7.7.0 Same changes as in @mui/x-date-pickers@7.7.0.
@mui/x-charts@7.7.0ResponsiveChartContainer (#13398) @alexfauquetteZAxisContextProvider by default in the ChartContainer (#13465) @alexfauquette@mui/x-tree-view@7.7.0renderHeader recipe to the Master Details docs (#13370) @michelengeleneslint-plugin-react-compiler experimental version and rules (#13415) @JCQuintas<TreeItem2 /> (#13314) @flaviendelangleJun 6, 2024
We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.6.2areElementSizesEqual utility to improve code readability (#13254) @layerok@mui/x-data-grid-pro@7.6.2 Same changes as in @mui/x-data-grid@7.6.2.
@mui/x-data-grid-premium@7.6.2 Same changes as in @mui/x-data-grid-pro@7.6.2.
@mui/x-date-pickers@7.6.2PageUp and PageDown editing on letter sections (#13310) @arthurbalduiniAdapterDayjs timezone behavior (#13362) @LukasTyuseRtl instead of useTheme to access direction (#13363) @flaviendelangle@mui/x-date-pickers-pro@7.6.2 Same changes as in @mui/x-date-pickers@7.6.2.
@mui/x-charts@7.6.2Initializable type and behavior to allow checking if a complex context has been initialized. (#13365) @JCQuintasxAxis and yAxis (#13372) @Valyok26tickInterval (#13355) @alexfauquettequickFilterValues (#12919) @michelengelenCSS.escape for the future @oliviertassinaril10n action setup (#13382) @LukasTymarked dependency (#13383) @LukasTy@types/prettier dependency (#13389) @LukasTydocs/.env.local to .gitignore (#13377) @KenanYusufMay 31, 2024
We'd like to offer a big thanks to the 2 contributors who made this release possible. Here are some highlights ✨:
🐞 Address the @mui/internal-test-utils added as a direct dependency to @mui/x-data-grid by mistake.
@mui/x-data-grid@7.6.1@mui/internal-test-utils to dev dependency (#13318) @LukasTy@mui/x-data-grid-pro@7.6.1 Same changes as in @mui/x-data-grid@7.6.1.
@mui/x-data-grid-premium@7.6.1 Same changes as in @mui/x-data-grid-pro@7.6.1.
May 30, 2024
We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.6.0GridColumnHeadersProps (#13229) @cherniavskii@mui/x-data-grid-pro@7.6.0 Same changes as in @mui/x-data-grid@7.6.0.
@mui/x-data-grid-premium@7.6.0 Same changes as in @mui/x-data-grid-pro@7.6.0, plus:
@mui/x-date-pickers@7.6.0DateBuilderReturnType when the date is undefined (#13244) @alexey-kozlenkov@mui/x-date-pickers-pro@7.6.0 Same changes as in @mui/x-date-pickers@7.6.0.
@mui/x-charts@7.6.0@mui/x-tree-view@7.6.0l10n script execution with arguments (#13297) @LukasTy@mui/material version used in sandboxes (#13260) @LukasTydescribeTreeView for keyboard navigation tests on disabled items (#13184) @flaviendelangledescribeTreeView for remaining items tests (#13262) @flaviendelangleDateRangePosition type in favor of RangePosition (#13288) @LukasTyMay 23, 2024
We'd like to offer a big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
label to be displayed in BarChart@mui/x-data-grid@7.5.1@mui/x-data-grid-pro@7.5.1 Same changes as in @mui/x-data-grid@7.5.1.
@mui/x-data-grid-premium@7.5.1 Same changes as in @mui/x-data-grid-pro@7.5.1.
@mui/x-date-pickers@7.5.1disableOpenPicker prop behavior (#13212) @LukasTy@mui/x-date-pickers-pro@7.5.1 Same changes as in @mui/x-date-pickers@7.5.1.
@mui/x-charts@7.5.1label to be displayed inside bars in BarChart (#12988) @JCQuintasapiRef methods doc examples (#13193) @flaviendelangleraw-loader package (#13160) @LukasTyyarn to pnpm in PropTypes comment (#13167) @LukasTydescribeTreeView for items test (partial) (#12893) @flaviendelangledescribeTreeView for keyboard selection tests (#13164) @flaviendelangledescribeTreeView for navigation tests (#12907) @flaviendelangledescribeTreeView for items rendering edge-case tests (#13168) @flaviendelangletest:coverage:inspect to allow easier debugging (#13198) @JCQuintasyarn proptypes vs pnpm proptypes (#13199) @JCQuintasnx for lerna tasks (#13166) @LukasTyMay 17, 2024
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.5.0rowModesModel controlled prop (#13056) @Janpot@mui/x-data-grid-pro@7.5.0 Same changes as in @mui/x-data-grid@7.5.0.
@mui/x-data-grid-premium@7.5.0 Same changes as in @mui/x-data-grid-pro@7.5.0.
@mui/x-date-pickers@7.5.0textField slot placeholder value (#13148) @arthurbalduiniAdapterMomentJalaali regression (#13144) @LukasTyAdapterDateFnsBase in Jalali adapters (#13075) @LukasTy@mui/x-date-pickers-pro@7.5.0 Same changes as in @mui/x-date-pickers@7.5.0.
@mui/x-charts@7.5.0trigger=axis now follow touch on mobile (#13043) @wzdorowaseries.label property to receive a function with the "location" it is going to be displayed on (#12830) @JCQuintasuseSlotProps types (#13141) @alexfauquette@mui/x-tree-view@7.5.0@mui/x-date-pickers imports (#13120) @LukasTySectionTitle component in the doc (#13139) @alexfauquetteMay 10, 2024
We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
id attribute on shortcut items of the Date and Time Pickersdate-fns-jalali v3 in the Date and Time PickersBarChart@mui/x-data-grid@7.4.0svg element (#13028) @oukunan@mui/x-data-grid-pro@7.4.0 Same changes as in @mui/x-data-grid@7.4.0.
@mui/x-data-grid-premium@7.4.0 Same changes as in @mui/x-data-grid-pro@7.4.0.
@mui/x-date-pickers@7.4.0AdapterDateFnsJalaliV3 adapter (#12891) @smmoosaviid attribute on shortcut items (#12976) @noraleonte@mui/x-date-pickers-pro@7.4.0 Same changes as in @mui/x-date-pickers@7.4.0.
@mui/x-charts@7.4.0ChartsGrid to themeAugmentation (#13026) @noraleonteBarChart (#12834) @JCQuintas@mui/x-tree-view@7.4.0<TreeItem2 /> (#12889) @flaviendelangleMay 2, 2024
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
id attribute.
It should not affect you, but if you were relying on the gradient id attribute, please update your usage.@mui/x-data-grid@7.3.2formattedValue from the edit value when passing to renderEditCell (#12870) @cherniavskiiprops.rowCount change (#12833) @MBilalShafi@mui/x-data-grid-pro@7.3.2 Same changes as in @mui/x-data-grid@7.3.2.
@mui/x-data-grid-premium@7.3.2 Same changes as in @mui/x-data-grid-pro@7.3.2, plus:
@mui/x-date-pickers@7.3.2viewRenderers prop description (#12915) @flaviendelanglePickersDay (#12920) @flaviendelangle@mui/x-date-pickers-pro@7.3.2 Same changes as in @mui/x-date-pickers@7.3.2.
@mui/x-charts@7.3.2prop.slots and prop.slotProps not passed to <ChartsTooltip /> (#12939) @JCQuintasnext.config settings (#12861) @oliviertassinari@mui/docs/HighlightedCode (#12848) @alexfauquettet command (#12948) @LukasTyApr 26, 2024
We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.3.1columnHeaders slot (#12768) @cherniavskii@mui/x-data-grid-pro@7.3.1 Same changes as in @mui/x-data-grid@7.3.1.
@mui/x-data-grid-premium@7.3.1 Same changes as in @mui/x-data-grid-pro@7.3.1.
@mui/x-date-pickers@7.3.1@mui/x-date-pickers-pro@7.3.1 Same changes as in @mui/x-date-pickers@7.3.1.
@mui/x-charts@7.3.1BarCharts (#12859) @JCQuintas@mui/x-tree-view@7.3.1aria-activedescendant attribute (#12867) @flaviendelangletype-ahead (#12827) @flaviendelanglesx props (#12791) @derek-0000l10n GH workflow (#12895) @LukasTysetupFiles entries in package.json (#12899) @LukasTydescribeTreeView for focus tests (#12698) @flaviendelangledescribeTreeView for type-ahead tests (#12811) @flaviendelanglepnpm (#11875) @LukasTyApr 18, 2024
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
🎨 Support color scales in Charts (#12490) @alexfauquette
Add a colorMap configuration to an axis, and the chart will use it to select colors.
Each impacted chart (bar charts, line charts, scatter charts) has a dedicated section explaining how this color map is impacting it.
🌍 Improve Danish (da-DK) locale on the Data Grid
@mui/x-data-grid@7.3.0onCellEditStop on error (#12747) @sai6855@mui/x-data-grid-pro@7.3.0 Same changes as in @mui/x-data-grid@7.3.0, plus:
@mui/x-data-grid-premium@7.3.0 Same changes as in @mui/x-data-grid-pro@7.3.0.
A typo fix:
- ContinuouseScaleName
+ ContinuousScaleName@mui/x-charts@7.3.0dataIndex to series valueFormatter (#12745) @JCQuintasDEFAULT_X_AXIS_KEY and DEFAULT_Y_AXIS_KEY (#12780) @alexfauquettePieArcLabel (#12806) @JCQuintas@mui/x-tree-view@7.3.0defaultMuiPrevented on the onFocus prop of the root slot (#12813) @flaviendelangleDateTimeRangePicker (#12786) @LukasTyApr 12, 2024
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.2.0api property to GridCallbackDetails (#12742) @sai6855date/dateTime columns (#12709) @cherniavskii@mui/x-data-grid-pro@7.2.0 Same changes as in @mui/x-data-grid@7.2.0.
@mui/x-data-grid-premium@7.2.0 Same changes as in @mui/x-data-grid-pro@7.2.0, plus:
@mui/x-date-pickers@7.2.0@mui/x-date-pickers-pro@7.2.0 Same changes as in @mui/x-date-pickers@7.2.0, plus:
@mui/x-charts@7.2.0tickLabelInterval not working on YAxis (#12746) @JCQuintas@mui/x-tree-view@7.2.0getNavigableChildrenIds method (#12713) @flaviendelanglestate.items.itemTree (#12717) @flaviendelangleinstance and publicAPI methods from plugin and populate the main objects inside useTreeView (#12650) @flaviendelangleAxisFormatter documentation for customizing tick/tooltip value formatting (#12700) @JCQuintasl10n PR packages (#12735) @LukasTydescribeTreeView for icons tests (#12672) @flaviendelangledescribeTreeView in existing tests for useTreeViewItems (#12732) @flaviendelangleApr 5, 2024
We'd like to offer a big thanks to the 19 contributors who made this release possible. Here are some highlights ✨:
setItemExpansion Tree View API method (#12595) @flaviendelangle@mui/x-data-grid@7.1.1ColDefChangesGridNoSnap demo crash (#12663) @MBilalShafirowCount is used with client-side pagination (#12448) @michelengelenGridFormatterParams completely (#12660) @romgrk@mui/x-data-grid-pro@7.1.1 Same changes as in @mui/x-data-grid@7.1.1.
@mui/x-data-grid-premium@7.1.1 Same changes as in @mui/x-data-grid-pro@7.1.1.
@mui/x-date-pickers@7.1.1readOnly behavior (#12609) @LukasTy@mui/x-date-pickers-pro@7.1.1 Same changes as in @mui/x-date-pickers@7.1.1, plus:
@mui/x-charts@7.1.1tickInterval usage for y-axis (#12592) @alexfauquetteid is a number (#12677) @JCQuintassx property on ChartsTooltip (#12659) @JCQuintas@mui/x-tree-view@7.1.1publicAPI methods (#12649) @flaviendelangle<RichTreeViewPro /> component (not released yet) (#12610) @flaviendelanglesetItemExpansion (#12595) @flaviendelanglecheckboxSelectionVisibleOnly prop (#12646) @michelengelen_action: 'delete' in processRowUpdate (#12670) @michelengelenPieShapeNoSnap demo (#12636) @alp-exgetItemId prop description (#12637) @flaviendelanglemargin usage more visible (#12591) @alexfauquetteday from the default dayOfWeekFormatter function params (#12644) @LukasTy<TreeItem2 /> for icon expansion example on <RichTreeView /> (#12563) @flaviendelanglemaster to v6 action (#12648) @LukasTy@mui/x-tree-view-pro/themeAugmentation (#12674) @flaviendelangledescribeTreeView to run test on <SimpleTreeView /> and <RichTreeView />, using <TreeItem /> and <TreeItem2 /> + migrate expansion tests (#12428) @flaviendelangletest-types CI step allowed memory (#12651) @LukasTyexpress package (#12602) @LukasTyl10n PR belongs to (#12639) @LukasTydescribeTreeView for selection tests (#12647) @flaviendelangleMar 28, 2024
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
resizeThrottleMs prop (#12556) @romgrk@mui/x-data-grid@7.1.0resizeThrottleMs prop (#12556) @romgrkrowEditStop event if row has fields with errors (#11383) @cherniavskiiGridToolbarQuickFilter component (#12484) @jhawkins11@mui/x-data-grid-pro@7.1.0 Same changes as in @mui/x-data-grid@7.1.0.
@mui/x-data-grid-premium@7.1.0 Same changes as in @mui/x-data-grid-pro@7.1.0.
@mui/x-date-pickers@7.1.0@mui/zero-runtime (stop using ownerState in styled) (#12003) @flaviendelangle@mui/x-date-pickers-pro@7.1.0 Same changes as in @mui/x-date-pickers@7.1.0, plus:
readOnly (#12593) @LukasTy@mui/x-charts@7.1.0@mui/x-tree-view@7.1.0l10n script on Windows (#12550) @LukasTyDateTimeRangePicker tag in releaseChangelog (#12526) @LukasTyMar 22, 2024
We're excited to announce the first v7 stable release! 🎉🚀
This is now the officially supported major version, where we'll keep rolling out new features, bug fixes, and improvements. Migration guides are available with a complete list of the breaking changes:
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
viewRenderers on DateTimePicker (#12441) @LukasTydensity for the Data Grid (#12332) @MBilalShafiThe density is a controlled prop now, if you were previously passing the density prop to the Data Grid, you will need to do one of the following:
initialState.density to initialize it. <DataGrid
- density="compact"
+ initialState={{ density: "compact" }}
/>onDensityChange callback to update the density prop accordingly for it to work as expected.+ const [density, setDensity] = React.useState<GridDensity>('compact');
<DataGrid
- density="compact"
+ density={density}
+ onDensityChange={(newDensity) => setDensity(newDensity)}
/>The selector gridDensityValueSelector was removed, use the gridDensitySelector instead.
The props rowBuffer and columnBuffer were renamed to rowBufferPx and columnBufferPx.
Their value is now a pixel value rather than a number of items. Their default value is now 150.
The props rowThreshold and columnThreshold have been removed.
If you had the rowThreshold prop set to 0 to force new rows to be rendered more often – this is no longer necessary.
@mui/x-data-grid@7.0.0ElementType usage (#12479) @cherniavskiirows an optional prop (#12478) @MBilalShafi@mui/x-data-grid-pro@7.0.0 Same changes as in @mui/x-data-grid@7.0.0.
@mui/x-data-grid-premium@7.0.0 Same changes as in @mui/x-data-grid-pro@7.0.0, plus:
DesktopDateTimePicker view rendering has been optimized by using the same technique as for DesktopDateTimeRangePicker.dateTimeViewRenderers have been removed in favor of reusing existing time view renderers (renderTimeViewClock, renderDigitalClockTimeView and renderMultiSectionDigitalClockTimeView) and date view renderer (renderDateViewCalendar).renderTimeViewClock to time view renderers will no longer revert to the old behavior of rendering only date or time view.@mui/x-date-pickers@7.0.0DesktopDateTimePicker (#12441) @LukasTy@mui/x-date-pickers-pro@7.0.0 Same changes as in @mui/x-date-pickers@7.0.0, plus:
JSDoc (#12518) @LukasTy@mui/x-charts@7.0.0CartesianContextProvider (#12461) @JanpotnodeId prop used by <TreeItem /> has been renamed to itemId for consistency: <TreeView>
- <TreeItem label="Item 1" nodeId="one">
+ <TreeItem label="Item 1" itemId="one">
</TreeView>The focus is now applied to the Tree Item root element instead of the Tree View root element.
This change will allow new features that require the focus to be on the Tree Item, like the drag and drop reordering of items. It also solves several issues with focus management, like the inability to scroll to the focused item when a lot of items are rendered.
This will mostly impact how you write tests to interact with the Tree View:
For example, if you were writing a test with react-testing-library, here is what the changes could look like:
it('test example on first item', () => {
- const { getByRole } = render(
+ const { getAllByRole } = render(
<SimpleTreeView>
<TreeItem nodeId="one" />
<TreeItem nodeId="two" />
</SimpleTreeView>
);
- const tree = getByRole('tree');
+ const firstTreeItem = getAllByRole('treeitem')[0];
act(() => {
- tree.focus();
+ firstTreeItem.focus();
});
- fireEvent.keyDown(tree, { key: 'ArrowDown' });
+ fireEvent.keyDown(firstTreeItem, { key: 'ArrowDown' });
})@mui/x-tree-view@7.0.0nodeId to itemId (#12418) @noraleonteContentComponent prop to avoid using the word "node" (#12476) @flaviendelangle@mui/x-codemod@7.0.0@mui/material peer dependency for all packages (#12516) @LukasTyno-restricted-imports ESLint rule not working for Data Grid packages (#12477) @cherniavskiino-response action runs (#12491) @michaldudaklegacy browserlistrc entry (#12415) @LukasTyMar 14, 2024
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
lazyLoading feature flag was removed from the experimentalFeatures prop.columnHeader--showColumnBorder class was replaced by columnHeader--withLeftBorder and columnHeader--withRightBorder.columnHeadersInner, columnHeadersInner--scrollable, and columnHeaderDropZone classes were removed since the inner wrapper was removed in our effort to simplify the DOM structure and improve accessibility.pinnedColumnHeaders, pinnedColumnHeaders--left, and pinnedColumnHeaders--right classes were removed along with the element they were applied to.
The pinned column headers now use position: 'sticky' and are rendered in the same row element as the regular column headers.@mui/x-data-grid@7.0.0-beta.7rowCount part of the state (#12381) @MBilalShafibaseSwitch slot (#12439) @romgrk@mui/x-data-grid-pro@7.0.0-beta.7 Same changes as in @mui/x-data-grid@7.0.0-beta.7, plus:
inputRef to the props passed to colDef.renderHeaderFilter (#12328) @vovarudomanenko@mui/x-data-grid-premium@7.0.0-beta.7 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.7, plus:
@mui/x-date-pickers@7.0.0-beta.7tabIndex on accessible field DOM structure (#12311) @flaviendelangle@mui/x-date-pickers-pro@7.0.0-beta.7 Same changes as in @mui/x-date-pickers@7.0.0-beta.7.
@mui/x-charts@7.0.0-beta.7The onNodeFocus callback has been renamed to onItemFocus for consistency:
<SimpleTreeView
- onNodeFocus={onNodeFocus}
+ onItemFocus={onItemFocus}
/>@mui/x-tree-view@7.0.0-beta.7<TreeItem2 /> component and a new useTreeItem2 hook (#11721) @flaviendelangleonNodeFocus to onItemFocus (#12419) @noraleontelegacy bundle drop mention in migration pages (#12424) @LukasTyInfo import (#12427) @LukasTyrel="noreferrer" by rel="noopener" @oliviertassinaridate-fns weekStarsOn overriding example (#12416) @LukasTyMar 8, 2024
We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.0.0-beta.6sortModel (#12325) @MBilalShafistopCellMode event in renderEditRating component (#12335) @sai6855@mui/x-data-grid-pro@7.0.0-beta.6 Same changes as in @mui/x-data-grid@7.0.0-beta.6, plus:
onRowsScrollEnd to use IntersectionObserver (#8672) @DanailH@mui/x-data-grid-premium@7.0.0-beta.6 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.6.
@mui/x-charts@7.0.0-beta.6The component used to animate the item children is now defined as a slot on the <TreeItem /> component.
If you were passing a TransitionComponent or TransitionProps to your <TreeItem /> component,
you need to use the new groupTransition slot on this component:
<SimpleTreeView>
<TreeItem
nodeId="1"
label="Node 1"
- TransitionComponent={Fade}
+ slots={{ groupTransition: Fade }}
- TransitionProps={{ timeout: 600 }}
+ slotProps={{ groupTransition: { timeout: 600 } }}
/>
</SimpleTreeView>The group class of the <TreeItem /> component has been renamed to groupTransition to match with its new slot name.
const StyledTreeItem = styled(TreeItem)({
- [`& .${treeItemClasses.group}`]: {
+ [`& .${treeItemClasses.groupTransition}`]: {
marginLeft: 20,
},
});@mui/x-tree-view@7.0.0-beta.6props.items (#12359) @flaviendelanglegetItem (#12251) @flaviendelangleTransitionComponent and TransitionProps with a groupTransition slot (#12336) @flaviendelanglez-index usage in SVG (#12337) @alexfauquetteCharts test (#11551) @alexfauquetteMar 1, 2024
We'd like to offer a big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
getSortComparator for more advanced sorting behaviors (#12215) @cherniavskiiuse client directive to the Grid packages (#11803) @MBilalShafi@mui/x-data-grid@7.0.0-beta.5getSortComparator for more advanced sorting behaviors (#12215) @cherniavskiiuse client directive to the Grid packages (#11803) @MBilalShafidisableResetButton and disableShowHideToggle flags to not exclude each other (#12169) @adyryquerySelector call (#12229) @romgrkonColumnWidthChange called before autosize affects column width (#12140) @shaharyar-shamshiupsertFilterItems removing filters that are not part of the update (#11954) @gitstart@mui/x-data-grid-pro@7.0.0-beta.5 Same changes as in @mui/x-data-grid@7.0.0-beta.5, plus:
@mui/x-data-grid-premium@7.0.0-beta.5 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.5, plus:
@mui/x-date-pickers@7.0.0-beta.5@mui/x-date-pickers-pro@7.0.0-beta.5 Same changes as in @mui/x-date-pickers@7.0.0-beta.5.
@mui/x-charts@7.0.0-beta.5@mui/x-tree-view@7.0.0-beta.5getComponentInfo RegExp (#12241) @flaviendelanglewindow. reference for common globals @oliviertassinarino-response workflow (#12193) @MBilalShafiFeb 23, 2024
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
legacy bundle that used to support old browsers like IE 11 is no longer included..MuiDataGrid-cellContent has been removed, use .MuiDataGrid-cell to style the cells.@mui/x-data-grid@7.0.0-beta.4is any of filter operator (#11939) @gitstart@mui/x-data-grid-pro@7.0.0-beta.4 Same changes as in @mui/x-data-grid@7.0.0-beta.4.
@mui/x-data-grid-premium@7.0.0-beta.4 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.4.
The selectedSections prop no longer accepts start and end indexes.
When selecting several — but not all — sections, the field components were not behaving correctly, you can now only select one or all sections:
<DateField
- selectedSections={{ startIndex: 0, endIndex: 0 }}
+ selectedSections={0}
// If the field has 3 sections
- selectedSections={{ startIndex: 0, endIndex: 2 }}
+ selectedSections="all"
/>The headless field hooks (for example useDateField()) now returns a new prop called enableAccessibleFieldDOMStructure.
This property is utilized to determine whether the anticipated UI is constructed using an accessible DOM structure.
Learn more about this new accessible DOM structure in the v8 migration guide.
When building a custom UI, you are most-likely only supporting one DOM structure, so you can remove enableAccessibleFieldDOMStructure before it is passed to the DOM:
function MyCustomTextField(props) {
const {
+ // Should be ignored
+ enableAccessibleFieldDOMStructure,
// ... rest of the props you are using
} = props;
return ( /* Some UI to edit the date */ )
}
function MyCustomField(props) {
const fieldResponse = useDateField<Dayjs, false, typeof textFieldProps>({
...props,
+ // If you only support one DOM structure, we advise you to hardcode it here to avoid unwanted switches in your application
+ enableAccessibleFieldDOMStructure: false,
});
return <MyCustomTextField ref={ref} {...fieldResponse} />;
}
function App() {
return <DatePicker slots={{ field: MyCustomField }} />;
}The following internal types were exported by mistake and have been removed from the public API:
UseDateFieldDefaultizedPropsUseTimeFieldDefaultizedPropsUseDateTimeFieldDefaultizedPropsUseSingleInputDateRangeFieldComponentPropsUseSingleInputTimeRangeFieldComponentPropsUseSingleInputDateTimeRangeFieldComponentProps@mui/x-date-pickers@7.0.0-beta.4PickersTextField component in the fields (#10649) @flaviendelangleDateTimePickerTabs (#12096) @LukasTy@mui/x-date-pickers-pro@7.0.0-beta.4 Same changes as in @mui/x-date-pickers@7.0.0-beta.4.
@mui/x-charts@7.0.0-beta.4These components are no longer exported from @mui/x-charts:
CartesianContextProviderDrawingProvider@mui/x-charts@7.0.0-beta.4@mui/x-tree-view@7.0.0-beta.4findIndex to support IE 11 (#12129) @flaviendelanglepro plan (#12047) @alexfauquetteundefined (#12128) @alexfauquetteexperimental.cpus to control amount of export workers in Next.js (#12095) @JanpotdescribeConformance (#12130) @michaldudakFeb 16, 2024
We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
🎁 Charts get a built in grid
🎛️ Charts get a Gauge component.
🐞 Bugfixes
📚 Documentation improvements
rowEditCommit event and the related prop onRowEditCommit was removed. The processRowUpdate prop can be used in place.@mui/x-data-grid@7.0.0-beta.3rowEditCommit (#12073) @MBilalShafi@mui/x-data-grid-pro@7.0.0-beta.3 Same changes as in @mui/x-data-grid@7.0.0-beta.3.
@mui/x-data-grid-premium@7.0.0-beta.3 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.3.
@mui/x-charts@7.0.0-beta.3ChartsGrid component (#11034) @alexfauquette@mui/x-tree-view@7.0.0-beta.3dayOfWeekFormatter typo in the pickers v6 to v7 migration document (#12043) @StylesTripAdapterDateFnsV3 (#12036) @flaviendelanglefocused prop from demo (#12092) @michelengelenFeb 9, 2024
We'd like to offer a big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.0.0-beta.2removeAllFilterItems as a reason of onFilterModelChange callback (#11911) @shaharyar-shamshipageSizeOptions prop (#11609) @pcorpetlastPage in GridPagination (#11958) @MBilalShafi@mui/x-data-grid-pro@7.0.0-beta.2 Same changes as in @mui/x-data-grid@v7.0.0-beta.2.
@mui/x-data-grid-premium@v7.0.0-beta.2 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.2, plus:
@mui/x-date-pickers@7.0.0-beta.2isWithinRange method (#11936) @LukasTyTDate (#11791) @flaviendelangle@mui/x-date-pickers-pro@7.0.0-beta.2 Same changes as in @mui/x-date-pickers@7.0.0-beta.2.
@mui/x-charts@7.0.0-beta.2reverse property to axes (#11899) @alexfauquette@mui/x-tree-view@7.0.0-beta.2If you're using the commercial license, you need to update the import path:
-import { LicenseInfo } from '@mui/x-license-pro';
+import { LicenseInfo } from '@mui/x-license';@mui/x-license@7.0.0-beta.2
@mui/x-license-pro to @mui/x-license (#11938) @cherniavskiiAdapterDateFnsV3 on the Getting Started page (#11985) @flaviendelangleCharts breaking change steps (#11971) @alexfauquetteChartsTooltip typo (#11961) @thisisharsh7Localization documentation sections (#11989) @LukasTydocs:serve script (#11935) @cherniavskiiLicenseInfo re-exports (#11956) @cherniavskiitest_types failing on the next branch (#11944) @cherniavskiitest_static on the next branch (#11977) @cherniavskiiFeb 1, 2024
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
GridColDef methods signatures (#11573) @cherniavskii🚀 All charts have click handlers (#11411) @alexfauquette Test their respective documentation demonstrations to know more about the data format:
Big thanks to @giladappsforce and @yaredtsy for their contribution on exploring this feature.
The signature of GridColDef['valueGetter'] has been changed for performance reasons:
- valueGetter: ({ value, row }) => value,
+ valueGetter: (value, row, column, apiRef) => value,The GridValueGetterParams interface has been removed:
- const customValueGetter = (params: GridValueGetterParams) => params.row.budget;
+ const customValueGetter: GridValueGetterFn = (value, row) => row.budget;The signature of GridColDef['valueFormatter'] has been changed for performance reasons:
- valueFormatter: ({ value }) => value,
+ valueFormatter: (value, row, column, apiRef) => value,The GridValueFormatterParams interface has been removed:
- const gridDateFormatter = ({ value, field, id }: GridValueFormatterParams<Date>) => value.toLocaleDateString();
+ const gridDateFormatter: GridValueFormatter = (value: Date) => value.toLocaleDateString();The signature of GridColDef['valueSetter'] has been changed for performance reasons:
- valueSetter: (params) => {
- const [firstName, lastName] = params.value!.toString().split(' ');
- return { ...params.row, firstName, lastName };
- }
+ valueSetter: (value, row) => {
+ const [firstName, lastName] = value!.toString().split(' ');
+ return { ...row, firstName, lastName };
+}The GridValueSetterParams interface has been removed:
- const setFullName = (params: GridValueSetterParams) => {
- const [firstName, lastName] = params.value!.toString().split(' ');
- return { ...params.row, firstName, lastName };
- };
+ const setFullName: GridValueSetter<Row> = (value, row) => {
+ const [firstName, lastName] = value!.toString().split(' ');
+ return { ...row, firstName, lastName };
+ }The signature of GridColDef['valueParser'] has been changed for performance reasons:
- valueParser: (value, params: GridCellParams) => value.toLowerCase(),
+ valueParser: (value, row, column, apiRef) => value.toLowerCase(),The signature of GridColDef['colSpan'] has been changed for performance reasons:
- colSpan: ({ row, field, value }: GridCellParams) => (row.id === 'total' ? 2 : 1),
+ colSpan: (value, row, column, apiRef) => (row.id === 'total' ? 2 : 1),The signature of GridColDef['pastedValueParser'] has been changed for performance reasons:
- pastedValueParser: (value, params) => new Date(value),
+ pastedValueParser: (value, row, column, apiRef) => new Date(value),The signature of GridColDef['groupingValueGetter'] has been changed for performance reasons:
- groupingValueGetter: (params) => params.value.name,
+ groupingValueGetter: (value: { name: string }) => value.name,@mui/x-data-grid@7.0.0-beta.1toggleAllMode prop to the columnsManagement slot (#10794) @H999GridColDef methods signatures (#11573) @cherniavskii@mui/x-data-grid-pro@7.0.0-beta.1 Same changes as in @mui/x-data-grid@7.0.0-beta.1.
@mui/x-data-grid-premium@7.0.0-beta.1 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.1.
@mui/x-date-pickers@7.0.0-beta.1@mui/x-date-pickers-pro@7.0.0-beta.1 Same changes as in @mui/x-date-pickers@7.0.0-beta.1.
The line chart now have animation by default.
You can disable it with skipAnimation prop.
See animation documentation for more information.
Pie charts onClick get renamed onItemClick for consistency with other charts click callback.
@mui/x-charts@7.0.0-beta.1
onClick support (#11411) @alexfauquetteJan 26, 2024
We are glad to announce MUI X v7 beta! This version has several improvements, bug fixes, and exciting features 🎉. We want to offer a big thanks to the 7 contributors who made this release possible ✨:
🚀 Release the Date Time Range Picker component (#9528) @LukasTy
🎁 New column management panel design for the Data Grid (#11770) @MBilalShafi
🐞 Bugfixes
The columns management component has been redesigned and the component was extracted from the ColumnsPanel which now only serves as a wrapper to display the component above the headers as a panel. As a result, a new slot columnsManagement and the related prop slotProps.columnsManagement have been introduced. The props corresponding to the columns management component which were previously passed to the prop slotProps.columnsPanel should now be passed to slotProps.columnsManagement. slotProps.columnsPanel could still be used to override props corresponding to the Panel component used in ColumnsPanel which uses Popper component under the hood.
<DataGrid
slotProps={{
- columnsPanel: {
+ columnsManagement: {
sort: 'asc',
autoFocusSearchField: false,
},
}}
/>Show all and Hide all buttons in the ColumnsPanel have been combined into one Show/Hide All toggle in the new columns management component. The related props disableShowAllButton and disableHideAllButton have been replaced with a new prop disableShowHideToggle.
<DataGrid
- disableShowAllButton
- disableHideAllButton
+ disableShowHideToggle
/>@mui/x-data-grid@7.0.0-beta.0GridColumnTypes interface for custom column types (#11742) @cherniavskiiapiRef early (#11792) @cherniavskii@mui/x-data-grid-pro@7.0.0-beta.0 Same changes as in @mui/x-data-grid@7.0.0-beta.0.
@mui/x-data-grid-premium@7.0.0-beta.0 Same changes as in @mui/x-data-grid-pro@7.0.0-beta.0.
@mui/x-date-pickers@7.0.0-beta.0layout.tabs class to Tabs slot (#11781) @LukasTy@mui/x-date-pickers-pro@7.0.0-beta.0 Same changes as in @mui/x-date-pickers@7.0.0-beta.0, plus:
DateTimeRangePicker component (#9528) @LukasTyDateTimeRangePicker theme augmentation (#11814) @LukasTycalendars prop on Mobile (#11752) @LukasTy@mui/x-tree-view@7.0.0-beta.0contextValue to the headless Tree View doc (#11705) @flaviendelangledisableSelection prop (#11821) @flaviendelangleDateTimeRangePicker in relevant demos (#11815) @LukasTyJan 19, 2024
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
@mui/material peer dependency for all packages (#11692) @LukasTy
The minimum required version of @mui/material is now 5.15.0.The ariaV7 experimental flag has been removed and the Data Grid now uses the improved accessibility implementation by default.
If you were using the ariaV7 flag, you can remove it from the experimentalFeatures prop:
-<DataGrid experimentalFeatures={{ ariaV7: true }} />
+<DataGrid />The most notable changes that might affect your application or tests are:
The role="grid" attribute along with related ARIA attributes are now applied to the inner div element instead of the root div element:
-<div class="MuiDataGrid-root" role="grid" aria-colcount="5" aria-rowcount="101" aria-multiselectable="false">
+<div class="MuiDataGrid-root">
<div class="MuiDataGrid-toolbarContainer"></div>
- <div class="MuiDataGrid-main"></div>
+ <div class="MuiDataGrid-main" role="grid" aria-colcount="5" aria-rowcount="101" aria-multiselectable="false"></div>
<div class="MuiDataGrid-footerContainer"></div>
</div>When the Tree data feature is used, the grid role is now role="treegrid" instead of role="grid".
The Data Grid cells now have role="gridcell" instead of role="cell".
The buttons in toolbar composable components GridToolbarColumnsButton, GridToolbarFilterButton, GridToolbarDensity, and GridToolbarExport are now wrapped with a tooltip component and have a consistent interface. To override some props corresponding to the toolbar buttons or their corresponding tooltips, you can use the slotProps prop. Following is an example diff. See Toolbar section for more details.
function CustomToolbar() {
return (
<GridToolbarContainer>
<GridToolbarColumnsButton />
<GridToolbarFilterButton
- title="Custom filter" // 🛑 This was previously forwarded to the tooltip component
+ slotProps={{ tooltip: { title: 'Custom filter' } }} // ✅ This is the correct way now
/>
<GridToolbarDensitySelector
- variant="outlined" // 🛑 This was previously forwarded to the button component
+ slotProps={{ button: { variant: 'outlined' } }} // ✅ This is the correct way now
/>
</GridToolbarContainer>
);
}Column grouping is now enabled by default. The flag columnGrouping is no longer needed to be passed to the experimentalFeatures prop to enable it.
-<DataGrid experimentalFeatures={{ columnGrouping: true }} />
+<DataGrid />The column grouping API methods getColumnGroupPath and getAllGroupDetails are no longer prefixed with unstable_.
The column grouping selectors gridFocusColumnGroupHeaderSelector and gridTabIndexColumnGroupHeaderSelector are no longer prefixed with unstable_.
The disabled column specific features like hiding, sorting, filtering, pinning, row grouping, etc could now be controlled programmatically using initialState, respective controlled models, or the API object. See the related docs section.
@mui/x-data-grid@7.0.0-alpha.9filterModel.logicOperator (#11673) @MBilalShaficolumn grouping feature stable (#11698) @MBilalShafiariaV7 experimental flag (#11428) @cherniavskii@mui/x-data-grid-pro@7.0.0-alpha.9 Same changes as in @mui/x-data-grid@7.0.0-alpha.9, plus:
@mui/x-data-grid-premium@7.0.0-alpha.9 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.9, plus:
The locales export has been removed from the root of the packages.
If you were importing locales from the root, be sure to update it:
-import { frFR } from '@mui/x-date-pickers';
+import { frFR } from '@mui/x-date-pickers/locales';@mui/x-date-pickers@7.0.0-alpha.9PickersTextField and its dependencies public (#11581) @flaviendelanglegetWeekNumber behavior (#11697) @LukasTylocales (#11612) @LukasTy@mui/x-date-pickers-pro@7.0.0-alpha.9 Same changes as in @mui/x-date-pickers@7.0.0-alpha.9.
@mui/x-charts@7.0.0-alpha.9innerRadius and outerRadius to the DOM (#11689) @alexfauquettestackOffset for LineChart (#11647) @alexfauquetteThe expandIcon / defaultExpandIcon props, used to expand the children of a node (rendered when it is collapsed),
is now defined as a slot both on the Tree View and the Tree Item components.
If you were using the ChevronRight icon from @mui/icons-material,
you can stop passing it to your component because it is now the default value:
-import ChevronRightIcon from '@mui/icons-material/ChevronRight';
<SimpleTreeView
- defaultExpandIcon={<ChevronRightIcon />}
>
{items}
</SimpleTreeView>If you were passing another icon to your Tree View component,
you need to use the new expandIcon slot on this component:
<SimpleTreeView
- defaultExpandIcon={<MyCustomExpandIcon />}
+ slots={{ expandIcon: MyCustomExpandIcon }}
>
{items}
</SimpleTreeView>If you were passing another icon to your Tree Item component,
you need to use the new expandIcon slot on this component:
<SimpleTreeView>
<TreeItem
nodeId="1"
label="Node 1"
- expandIcon={<MyCustomExpandIcon />}
+ slots={{ expandIcon: MyCustomExpandIcon }}
/>
</SimpleTreeView>The collapseIcon / defaultCollapseIcon props, used to collapse the children of a node (rendered when it is expanded),
is now defined as a slot both on the Tree View and the Tree Item components.
If you were using the ExpandMore icon from @mui/icons-material,
you can stop passing it to your component because it is now the default value:
- import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
<SimpleTreeView
- defaultCollapseIcon={<ExpandMoreIcon />}
>
{items}
</SimpleTreeView>If you were passing another icon to your Tree View component,
you need to use the new collapseIcon slot on this component:
<SimpleTreeView
- defaultCollapseIcon={<MyCustomCollapseIcon />}
+ slots={{ collapseIcon: MyCustomCollapseIcon }}
>
{items}
</SimpleTreeView>If you were passing another icon to your Tree Item component,
you need to use the new collapseIcon slot on this component:
<SimpleTreeView>
<TreeItem
nodeId="1"
label="Node 1"
- collapseIcon={<MyCustomCollapseIcon />}
+ slots={{ collapseIcon: MyCustomCollapseIcon }}
/>
</SimpleTreeView>The useTreeItem hook has been renamed useTreeItemState.
This will help create a new headless version of the Tree Item component based on a future useTreeItem hook.
-import { TreeItem, useTreeItem } from '@mui/x-tree-view/TreeItem';
+import { TreeItem, useTreeItemState } from '@mui/x-tree-view/TreeItem';
const CustomContent = React.forwardRef((props, ref) => {
- const { disabled } = useTreeItem(props.nodeId);
+ const { disabled } = useTreeItemState(props.nodeId);
// Render some UI
});
function App() {
return (
<SimpleTreeView>
<TreeItem ContentComponent={CustomContent} />
</SimpleTreeView>
)
}The parentIcon prop has been removed from the Tree View components.
If you were passing an icon to your Tree View component,
you can achieve the same behavior
by passing the same icon to both the collapseIcon and the expandIcon slots on this component:
<SimpleTreeView
- defaultParentIcon={<MyCustomParentIcon />}
+ slots={{ collapseIcon: MyCustomParentIcon, expandIcon: MyCustomParentIcon }}
>
{items}
</SimpleTreeView>The endIcon / defaultEndIcon props, rendered next to an item without children,
is now defined as a slot both on the Tree View and the Tree Item components.
If you were passing an icon to your Tree View component,
you need to use the new endIcon slot on this component:
<SimpleTreeView
- defaultEndIcon={<MyCustomEndIcon />}
+ slots={{ endIcon: MyCustomEndIcon }}
>
{items}
</SimpleTreeView>If you were passing an icon to your Tree Item component,
you need to use the new endIcon slot on this component:
<SimpleTreeView>
<TreeItem
nodeId="1"
label="Node 1"
- endIcon={<MyCustomEndIcon />}
+ slots={{ endIcon: MyCustomEndIcon }}
/>
</SimpleTreeView>The icon prop, rendered next to an item without children,
is now defined as a slot on the Tree Item component.
If you were passing an icon to your Tree Item component,
you need to use the new icon slot on this component:
<SimpleTreeView>
<TreeItem
nodeId="1"
label="Node 1"
- icon={<MyCustomIcon />}
+ slots={{ icon: MyCustomIcon }}
/>
</SimpleTreeView>@mui/x-tree-view@7.0.0-alpha.9Theme generic to variants (#11480) @dhulmeuseTreeItem to useTreeItemState (#11712) @flaviendelangleslots and slotProps on the Tree View components (#11664) @flaviendelanglepageSizeOptions prop documentation (#11682) @oliviertassinariclassName prop (#11693) @oliviertassinari@mui/material peer dependency for all packages (#11692) @LukasTykarma run in parallel (#11571) @romgrkkarma-parallel run under a new command (#11716) @romgrkJan 11, 2024
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
AdapterDateFnsV3.// with date-fns v2.x
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
import de from 'date-fns/locale/de';// with date-fns v3.x
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFnsV3';
import { de } from 'date-fns/locale/de';The import path for locales has been changed:
-import { enUS } from '@mui/x-data-grid';
+import { enUS } from '@mui/x-data-grid/locales';
-import { enUS } from '@mui/x-data-grid-pro';
+import { enUS } from '@mui/x-data-grid-pro/locales';
-import { enUS } from '@mui/x-data-grid-premium';
+import { enUS } from '@mui/x-data-grid-premium/locales';@mui/x-data-grid@7.0.0-alpha.8@mui/x-data-grid-pro@7.0.0-alpha.8 Same changes as in @mui/x-data-grid@7.0.0-alpha.8.
@mui/x-data-grid-premium@7.0.0-alpha.8 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.8.
@mui/x-date-pickers@7.0.0-alpha.8date-fns@3.x adapter (#11462) @LukasTyOpenPickerButton (#11642) @noraleonteDateRange to @mui/x-date-pickers-pro/models (#11611) @flaviendelangle@mui/x-date-pickers-pro@7.0.0-alpha.8 Same changes as in @mui/x-date-pickers@7.0.0-alpha.8.
@mui/x-tree-view@7.0.0-alpha.8onKeyDown handler (#11481) @flaviendelanglex-date-pickers-pro demo adapter imports (#11628) @LukasTygit diff format @oliviertassinarijsdom version (#11652) @cherniavskiiJan 5, 2024
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
🎁 New component to create a Tree View from a structured data source:
You can now directly pass your data to the <RichTreeView /> component instead of manually converting it into JSX <TreeItem /> components:
const ITEMS = [
{
id: 'node-1',
label: 'Node 1',
children: [
{ id: 'node-1-1', label: 'Node 1.1' },
{ id: 'node-1-2', label: 'Node 1.2' },
],
},
{
id: 'node-2',
label: 'Node 2',
},
];
<RichTreeView
items={MUI_X_PRODUCTS}
defaultCollapseIcon={<ExpandMoreIcon />}
defaultExpandIcon={<ChevronRightIcon />}
/>;🌍 Improve Czech (cs-CZ) locale on the Data Grid
@mui/x-data-grid@7.0.0-alpha.7hasEval when disableEval is set (#11516) @reihwaldautoPageSize and autoHeight (#11585) @Sboonnyeval with new Function (#11557) @oliviertassinariautoPageSize is used with autoHeight (#11554) @Sboonny@mui/x-data-grid-pro@7.0.0-alpha.7 Same changes as in @mui/x-data-grid@7.0.0-alpha.7.
@mui/x-data-grid-premium@7.0.0-alpha.7 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.7.
@mui/x-date-pickers@7.0.0-alpha.7@mui/x-date-pickers-pro@7.0.0-alpha.7 Same changes as in @mui/x-date-pickers@7.0.0-alpha.7.
@mui/x-charts@7.0.0-alpha.7arcLabelRadius property (#11487) @alexfauquettenull in line chart using dataset (#11550) @alexfauquetteThe expansion props have been renamed to better describe their behaviors:
| Old name | New name |
| :---------------- | :---------------------- |
| onNodeToggle | onExpandedNodesChange |
| expanded | expandedNodes |
| defaultExpanded | defaultExpandedNodes |
<TreeView
- onNodeToggle={handleExpansionChange}
+ onExpandedNodesChange={handleExpansionChange}
- expanded={expandedNodes}
+ expandedNodes={expandedNodes}
- defaultExpanded={defaultExpandedNodes}
+ defaultExpandedNodes={defaultExpandedNodes}
/>The selection props have been renamed to better describe their behaviors:
| Old name | New name |
| :---------------- | :---------------------- |
| onNodeSelect | onSelectedNodesChange |
| selected | selectedNodes |
| defaultSelected | defaultSelectedNodes |
<TreeView
- onNodeSelect={handleSelectionChange}
+ onSelectedNodesChange={handleSelectionChange}
- selected={selectedNodes}
+ selectedNodes={selectedNodes}
- defaultSelected={defaultSelectedNodes}
+ defaultSelectedNodes={defaultSelectedNodes}
/>@mui/x-tree-view@7.0.0-alpha.7items prop (#11059) @flaviendelangleonNodeExpansionToggle prop (#11547) @flaviendelanglenext.config.js (#11514) @oliviertassinariDec 22, 2023
We'd like to offer a big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
Date objects in the filterModelSelect component for all components.The getOptionValue and getOptionLabel props were removed from the following components:
GridEditSingleSelectCellGridFilterInputSingleSelectGridFilterInputMultipleSingleSelectUse the getOptionValue and getOptionLabel properties on the singleSelect column definition instead:
const column: GridColDef = {
type: 'singleSelect',
field: 'country',
valueOptions: [
{ code: 'BR', name: 'Brazil' },
{ code: 'FR', name: 'France' },
],
getOptionValue: (value: any) => value.code,
getOptionLabel: (value: any) => value.name,
};The filterModel now supports Date objects as values for date and dateTime column types.
The filterModel still accepts strings as values for date and dateTime column types,
but all updates to the filterModel coming from the UI (for example filter panel) will set the value as a Date object.
@mui/x-data-grid@7.0.0-alpha.6checkboxSelection respect the disableMultipleRowSelection prop (#11448) @cherniavskiiDate objects in filter model (#7069) @cherniavskiiSelects by default (#11330) @cherniavskii@mui/x-data-grid-pro@7.0.0-alpha.6 Same changes as in @mui/x-data-grid@7.0.0-alpha.6.
@mui/x-data-grid-premium@7.0.0-alpha.6 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.6.
@mui/x-date-pickers@7.0.0-alpha.6PickersInput sizing styles (#11392) @noraleontePickersTextField standard and filled variants (#11250) @noraleontePickersSectionList (#11449) @flaviendelanglePickersSectionList (#11352) @flaviendelangle@mui/x-date-pickers-pro@7.0.0-alpha.6 Same changes as in @mui/x-date-pickers@7.0.0-alpha.6.
@mui/x-charts@7.0.0-alpha.5ChartsText component public (#11370) @alexfauquettefalse default values for boolean props (#11477) @cherniavskiiname prop examples (#11422) @LukasTydate-fns package to v2 in codesandbox (#11463) @LukasTycherry-pick action (#11446) @LukasTyDec 14, 2023
We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
instanceId prop is now required for state selectors.
This prop is used to distinguish between multiple Data Grid instances on the same page.
See migration docs for more details.@mui/x-data-grid@7.0.0-alpha.5instanceId required for state selectors (#11395) @cherniavskii@mui/x-data-grid-pro@7.0.0-alpha.5 Same changes as in @mui/x-data-grid@7.0.0-alpha.5.
@mui/x-data-grid-premium@7.0.0-alpha.5 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.5.
The slot interfaces have been renamed to match with @mui/base naming.
The SlotsComponent suffix has been replaced with Slots and SlotsComponentsProps with SlotProps.
-DateCalendarSlotsComponent
-DateCalendarSlotsComponentsProps
+DateCalendarSlots
+DateCalendarSlotPropsMove inputRef inside the props passed to the field hooks
The field hooks now only receive the props instead of an object containing both the props and the inputRef.
-const { inputRef, ...otherProps } = props
-const fieldResponse = useDateField({ props: otherProps, inputRef });
+const fieldResponse = useDateField(props);If you are using a multi input range field hook, the same applies to startInputRef and endInputRef params
-const { inputRef: startInputRef, ...otherStartTextFieldProps } = startTextFieldProps
-const { inputRef: endInputRef, ...otherEndTextFieldProps } = endTextFieldProps
const fieldResponse = useMultiInputDateRangeField({
sharedProps,
- startTextFieldProps: otherStartTextFieldProps,
- endTextFieldProps: otherEndTextFieldProps,
- startInputRef
- endInputRef,
+ startTextFieldProps,
+ endTextFieldProps
});Rename the ref returned by the field hooks to inputRef
When used with the v6 TextField approach (where the input is an <input /> HTML element), the field hooks return a ref that needs to be passed to the <input /> element.
This ref was previously named ref and has been renamed inputRef for extra clarity.
const fieldResponse = useDateField(props);
-return <input ref={fieldResponse.ref} />
+return <input ref={fieldResponse.inputRef} />If you are using a multi input range field hook, the same applies to the ref in the startDate and endDate objects
const fieldResponse = useDateField(props);
return (
<div>
- <input ref={fieldResponse.startDate.ref} />
+ <input ref={fieldResponse.startDate.inputRef} />
<span>–</span>
- <input ref={fieldResponse.endDate.ref} />
+ <input ref={fieldResponse.endDate.inputRef} />
</div>
)Restructure the API of useClearableField
The useClearableField hook API has been simplified to now take a props parameter instead of a fieldProps, InputProps, clearable, onClear, slots and slotProps parameters.
You should now be able to directly pass the returned value from your field hook (for example useDateField) to useClearableField
const fieldResponse = useDateField(props);
-const { InputProps, onClear, clearable, slots, slotProps, ...otherFieldProps } = fieldResponse
-const { InputProps: ProcessedInputProps, fieldProps: processedFieldProps } = useClearableField({
- fieldProps: otherFieldProps,
- InputProps,
- clearable,
- onClear,
- slots,
- slotProps,
-});
-
- return <MyCustomTextField {...processedFieldProps} InputProps={ProcessedInputProps} />
+const processedFieldProps = useClearableField(fieldResponse);
+
+return <MyCustomTextField {...processedFieldProps} />@mui/x-date-pickers@7.0.0-alpha.5@types/react version (#11397) @LukasTy@mui/x-date-pickers-pro@7.0.0-alpha.5 Same changes as in @mui/x-date-pickers@7.0.0-alpha.5, plus:
autoFocus behavior (#11273) @kealjones-wk@mui/x-charts@7.0.0-alpha.5@mui/x-codemod@7.0.0-alpha.5cellSelection codemod and update migration guide (#11353) @MBilalShafinext -> master (#11382) @MBilalShafino-response workflow (#11369) @MBilalShafiDec 8, 2023
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
🚀 The scatter charts now use voronoi to trigger items
Users needed to hover the item to highlight the scatter item or show the tooltip. Now they can interact with data by triggering the closest element. See the docs page for more info.
📚 Add Pickers FAQ page
The header filters feature is now stable. unstable_ prefix is removed from prop headerFilters and related exports.
See migration docs for more details.
The GridColDef['type'] has been narrowed down to only accept the built-in column types.
TypeScript users need to use the GridColDef interface when defining columns:
// 🛑 `type` is inferred as `string` and is too wide
const columns = [{ type: 'number', field: 'id' }];
<DataGrid columns={columns} />;
// ✅ `type` is `'number'`
const columns: GridColDef[] = [{ type: 'number', field: 'id' }];
<DataGrid columns={columns} />;
// ✅ Alternalively, `as const` can be used to narrow down the type
const columns = [{ type: 'number' as const, field: 'id' }];
<DataGrid columns={columns} />;@mui/x-data-grid@7.0.0-alpha.4GridColDef['type'] (#11270) @cherniavskii@mui/x-data-grid-pro@7.0.0-alpha.4 Same changes as in @mui/x-data-grid@7.0.0-alpha.4, plus:
@mui/x-data-grid-premium@7.0.0-alpha.4 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.4.
@mui/x-date-pickers@7.0.0-alpha.4PickersTextField (#11258) @flaviendelangleMultiSectionDigitalClock issues (#11305) @LukasTy@mui/x-date-pickers-pro@7.0.0-alpha.4 Same changes as in @mui/x-date-pickers@7.0.0-alpha.4.
@mui/x-charts@7.0.0-alpha.4@mui/utils as a dependency (#11351) @michelengelenonPaginationModelChange docs (#10191) @JFBenzsDemoContainer styling coverage (#11315) @LukasTyDec 4, 2023
We'd like to offer a big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
🚀 Support localized start of the week on pickers' AdapterLuxon
When using Luxon 3.4.4 or higher, the start of the week will be defined by the date locale (for example: Sunday for en-US, Monday for fr-FR).
📈 Fix a lot of Charts package issues
The clipboard paste feature is now enabled by default. The flag clipboardPaste is no longer needed to be passed to the experimentalFeatures prop.
The clipboard related exports ignoreValueFormatterDuringExport and splitClipboardPastedText are no longer prefixed with unstable_.
The deprecated constants SUBMIT_FILTER_STROKE_TIME and SUBMIT_FILTER_DATE_STROKE_TIME have been removed from the Data Grid exports. Use the filterDebounceMs prop to customize filter debounce time.
The slots.preferencesPanel slot and the slotProps.preferencesPanel prop were removed. Use slots.panel and slotProps.panel instead.
The GridPreferencesPanel component is not exported anymore as it wasn't meant to be used outside of the Data Grid.
The unstable_ prefix has been removed from the cell selection props listed below.
| Old name | New name |
| :------------------------------------ | :--------------------------- |
| unstable_cellSelection | cellSelection |
| unstable_cellSelectionModel | cellSelectionModel |
| unstable_onCellSelectionModelChange | onCellSelectionModelChange |
The unstable_ prefix has been removed from the cell selection API methods listed below.
| Old name | New name |
| :--------------------------------- | :------------------------ |
| unstable_getCellSelectionModel | getCellSelectionModel |
| unstable_getSelectedCellsAsArray | getSelectedCellsAsArray |
| unstable_isCellSelected | isCellSelected |
| unstable_selectCellRange | selectCellRange |
| unstable_setCellSelectionModel | setCellSelectionModel |
The Quick Filter now ignores hidden columns by default. See including hidden columns section for more details.
@mui/x-data-grid@7.0.0-alpha.3onFilterModelChange being fired with stale field value (#11000) @gitstartpreferencesPanel slot (#11228) @cherniavskii@mui/x-data-grid-pro@7.0.0-alpha.3 Same changes as in @mui/x-data-grid@7.0.0-alpha.3.
@mui/x-data-grid-premium@7.0.0-alpha.3 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.3, plus:
The Date and Time Pickers now use the localized week when using AdapterLuxon and Luxon v3.4.4 or higher is installed.
This new behavior allows AdapterLuxon to have the same behavior as the other adapters.
If you want to keep the start of the week on Monday even if your locale says otherwise, you can hardcode the week settings as follows:
The Firefox browser currently does not support this behavior because the getWeekInfo API is not yet implemented.
import { Settings, Info } from 'luxon';
Settings.defaultWeekSettings = {
firstDay: 1,
minimalDays: Info.getMinimumDaysInFirstWeek(),
weekend: [6, 7],
};Add new parameters to the shortcuts slot onChange callback
The onChange callback fired when selecting a shortcut now requires two new parameters (previously they were optional):
changeImportance of the shortcut.item containing the entire shortcut object. const CustomShortcuts = (props) => {
return (
<React.Fragment>
{props.items.map(item => {
const value = item.getValue({ isValid: props.isValid });
return (
<button
- onClick={() => onChange(value)}
+ onClick={() => onChange(value, props.changeImportance ?? 'accept', item)}
>
{value}
</button>
)
}}
</React.Fragment>
)
}
<DatePicker slots={{ shortcuts: CustomShortcuts }} />AdapterDayjs with the customParseFormat plugin
The call to dayjs.extend(customParseFormatPlugin) has been moved to the AdapterDayjs constructor. This allows users to pass custom options to this plugin before the adapter uses it.If you are using this plugin before the rendering of the first LocalizationProvider component and did not call dayjs.extend in your own codebase, you will need to manually extend dayjs:
import dayjs from 'dayjs';
import customParseFormatPlugin from 'dayjs/plugin/customParseFormat';
dayjs.extend(customParseFormatPlugin);The other plugins are still added before the adapter initialization.
@mui/x-date-pickers@7.0.0-alpha.3format parameter (#11130) @LukasTychangeImportance and shortcut mandatory in PickersShortcuts (#10941) @flaviendelanglecustomParseFormat to constructor (#11151) @michelengelenPickersTextField styling - outlined variant (#10778) @noraleonteAdapterLuxon (#10964) @flaviendelangle@mui/x-date-pickers-pro@7.0.0-alpha.3 Same changes as in @mui/x-date-pickers@7.0.0-alpha.3.
@mui/x-charts@7.0.0-alpha.3defaultizeValueFormatter util to accept an optional series.valueFormatter value (#11144) @michelengelenlabelStyle and tickLabelStyle props on <ChartsYAxis /> (#11180) @akamfoadTextField styling example to customization playground (#10812) @noraleonteDayCalendar (#11158) @flaviendelanglenewFeature flag on v6 features (#11168) @flaviendelangle@mui/system a direct dependency (#11128) @LukasTyENABLE_AD env variable (#11181) @oliviertassinariplan: Pro and plan: Premium labels on Pro / Premium issue templates (#10183) @flaviendelangleNov 23, 2023
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
@mui/x-data-grid@7.0.0-alpha.2@mui/x-data-grid-pro@7.0.0-alpha.2 Same changes as in @mui/x-data-grid@7.0.0-alpha.2.
@mui/x-data-grid-premium@7.0.0-alpha.2 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.2.
The deprecated shouldDisableClock prop has been removed in favor of the more flexible shouldDisableTime prop.
The shouldDisableClock prop received value as a number of hours, minutes, or seconds.
Instead, the shouldDisableTime prop receives the date object (based on the used adapter).
You can read more about the deprecation of this prop in v6 migration guide.
<DateTimePicker
- shouldDisableClock={(timeValue, view) => view === 'hours' && timeValue < 12}
+ shouldDisableTime={(value, view) => view === 'hours' && value.hour() < 12}
/>The adapter.dateWithTimezone method has been removed and its content moved to the date method.
You can use the adapter.date method instead:
- adapter.dateWithTimezone(undefined, 'system');
+ adapter.date(undefined, 'system');The dayPickerClasses variable has been renamed to dayCalendarClasses to be consistent with the new name of the DayCalendar component introduced in v6.0.0.
- import { dayPickerClasses } from '@mui/x-date-pickers/DateCalendar';
+ import { dayCalendarClasses } from '@mui/x-date-pickers/DateCalendar';The deprecated defaultCalendarMonth prop has been removed in favor of the more flexible referenceDate prop.
- <DateCalendar defaultCalendarMonth={dayjs('2022-04-01')};
+ <DateCalendar referenceDate{dayjs('2022-04-01')} />The adapter.date method now has the v6 adapter.dateWithTimezone method behavior.
It no longer accepts any as a value but only string | null | undefined.
- adapter.date(new Date());
+ adapter.date();
- adapter.date(new Date('2022-04-17');
+ adapter.date('2022-04-17');
- adapter.date(new Date(2022, 3, 17, 4, 5, 34));
+ adapter.date('2022-04-17T04:05:34');
- adapter.date(new Date('Invalid Date'));
+ adapter.getInvalidDate();@mui/x-date-pickers@7.0.0-alpha.2defaultCalendarMonth prop (#10987) @flaviendelangleshouldDisableClock prop (#11042) @flaviendelangledayPickerClasses variable dayCalendarClasses (#11140) @flaviendelangleadapter.date with the current adapter.dateWithTimezone (#10979) @flaviendelangle@mui/x-date-pickers-pro@7.0.0-alpha.2 Same changes as in @mui/x-date-pickers@7.0.0-alpha.2.
@mui/x-charts@7.0.0-alpha.2ChartsTooltip component setup (#11152) @LukasTy@mui/x-codemod@7.0.0-alpha.2referenceDate instead of defaultCalendarMonth (#11139) @flaviendelangle@mui/x-data-grid-generator (#11134) @oliviertassinaribabel-plugin-module-resolver to 5.0.0 (#11065) @flaviendelangleNov 17, 2023
We'd like to offer a big thanks to the 3 contributors who made this release possible. Here are some highlights ✨:
@mui/x-date-pickers@7.0.0-alpha.1 / @mui/x-date-pickers-pro@7.0.0-alpha.1 The string argument of the dayOfWeekFormatter prop has been replaced in favor of the date object to allow more flexibility.
<DateCalendar
// If you were still using the day string, you can get it back with your date library.
- dayOfWeekFormatter={dayStr => `${dayStr}.`}
+ dayOfWeekFormatter={day => `${day.format('dd')}.`}
// If you were already using the day object, just remove the first argument.
- dayOfWeekFormatter={(_dayStr, day) => `${day.format('dd')}.`}
+ dayOfWeekFormatter={day => `${day.format('dd')}.`}
/>The imports related to the calendarHeader slot have been moved from @mui/x-date-pickers/DateCalendar to @mui/x-date-pickers/PIckersCalendarHeader:
export {
pickersCalendarHeaderClasses,
PickersCalendarHeaderClassKey,
PickersCalendarHeaderClasses,
PickersCalendarHeader,
PickersCalendarHeaderProps,
PickersCalendarHeaderSlotsComponent,
PickersCalendarHeaderSlotsComponentsProps,
ExportedPickersCalendarHeaderProps,
-} from '@mui/x-date-pickers/DateCalendar';
+} from '@mui/x-date-pickers/PickersCalendarHeader';The monthAndYear format has been removed.
It was used in the header of the calendar views, you can replace it with the new format prop of the calendarHeader slot:
<LocalizationProvider
adapter={AdapterDayJS}
- formats={{ monthAndYear: 'MM/YYYY' }}
/>
<DatePicker
+ slotProps={{ calendarHeader: { format: 'MM/YYYY' }}}
/>
<DateRangePicker
+ slotProps={{ calendarHeader: { format: 'MM/YYYY' }}}
/>
<LocalizationProvider />The adapter.getDiff method have been removed, you can directly use your date library:
// For Day.js
-const diff = adapter.getDiff(value, comparing, unit);
+const diff = value.diff(comparing, unit);
// For Luxon
-const diff = adapter.getDiff(value, comparing, unit);
+const getDiff = (value: DateTime, comparing: DateTime | string, unit?: AdapterUnits) => {
+ const parsedComparing = typeof comparing === 'string'
+ ? DateTime.fromJSDate(new Date(comparing))
+ : comparing;
+ if (unit) {
+ return Math.floor(value.diff(comparing).as(unit));
+ }
+ return value.diff(comparing).as('millisecond');
+};
+
+const diff = getDiff(value, comparing, unit);
// For DateFns
-const diff = adapter.getDiff(value, comparing, unit);
+const getDiff = (value: Date, comparing: Date | string, unit?: AdapterUnits) => {
+ const parsedComparing = typeof comparing === 'string' ? new Date(comparing) : comparing;
+ switch (unit) {
+ case 'years':
+ return dateFns.differenceInYears(value, parsedComparing);
+ case 'quarters':
+ return dateFns.differenceInQuarters(value, parsedComparing);
+ case 'months':
+ return dateFns.differenceInMonths(value, parsedComparing);
+ case 'weeks':
+ return dateFns.differenceInWeeks(value, parsedComparing);
+ case 'days':
+ return dateFns.differenceInDays(value, parsedComparing);
+ case 'hours':
+ return dateFns.differenceInHours(value, parsedComparing);
+ case 'minutes':
+ return dateFns.differenceInMinutes(value, parsedComparing);
+ case 'seconds':
+ return dateFns.differenceInSeconds(value, parsedComparing);
+ default: {
+ return dateFns.differenceInMilliseconds(value, parsedComparing);
+ }
+ }
+};
+
+const diff = getDiff(value, comparing, unit);
// For Moment
-const diff = adapter.getDiff(value, comparing, unit);
+const diff = value.diff(comparing, unit);The adapter.getFormatHelperText method have been removed, you can use the adapter.expandFormat instead:
-const expandedFormat = adapter.getFormatHelperText(format);
+const expandedFormat = adapter.expandFormat(format);And if you need the exact same output you can apply the following transformation:
// For Day.js
-const expandedFormat = adapter.getFormatHelperText(format);
+const expandedFormat = adapter.expandFormat(format).replace(/a/gi, '(a|p)m').toLocaleLowerCase();
// For Luxon
-const expandedFormat = adapter.getFormatHelperText(format);
+const expandedFormat = adapter.expandFormat(format).replace(/(a)/g, '(a|p)m').toLocaleLowerCase();
// For DateFns
-const expandedFormat = adapter.getFormatHelperText(format);
+const expandedFormat = adapter.expandFormat(format).replace(/(aaa|aa|a)/g, '(a|p)m').toLocaleLowerCase();
// For Moment
-const expandedFormat = adapter.getFormatHelperText(format);
+const expandedFormat = adapter.expandFormat(format).replace(/a/gi, '(a|p)m').toLocaleLowerCase();The adapter.getMeridiemText method have been removed, you can use the adapter.setHours, adapter.date and adapter.format methods to recreate its behavior:
-const meridiem = adapter.getMeridiemText('am');
+const getMeridiemText = (meridiem: 'am' | 'pm') => {
+ const date = adapter.setHours(adapter.date()!, meridiem === 'am' ? 2 : 14);
+ return utils.format(date, 'meridiem');
+};
+
+const meridiem = getMeridiemText('am');The adapter.getMonthArray method have been removed, you can use the adapter.startOfYear and adapter.addMonths methods to recreate its behavior:
-const monthArray = adapter.getMonthArray(value);
+const getMonthArray = (year) => {
+ const firstMonth = utils.startOfYear(year);
+ const months = [firstMonth];
+
+ while (months.length < 12) {
+ const prevMonth = months[months.length - 1];
+ months.push(utils.addMonths(prevMonth, 1));
+ }
+
+ return months;
+}
+
+const monthArray = getMonthArray(value);The adapter.getNextMonth method have been removed, you can use the adapter.addMonths method instead:
-const nextMonth = adapter.getNextMonth(value);
+const nextMonth = adapter.addMonths(value, 1);The adapter.getPreviousMonth method have been removed, you can use the adapter.addMonths method instead:
-const previousMonth = adapter.getPreviousMonth(value);
+const previousMonth = adapter.addMonths(value, -1);The adapter.getWeekdays method have been removed, you can use the adapter.startOfWeek and adapter.addDays methods instead:
-const weekDays = adapter.getWeekdays(value);
+const getWeekdays = (value) => {
+ const start = adapter.startOfWeek(value);
+ return [0, 1, 2, 3, 4, 5, 6].map((diff) => utils.addDays(start, diff));
+};
+
+const weekDays = getWeekdays(value);The isNull method have been removed, you can replace it with a very basic check:
-const isNull = adapter.isNull(value);
+const isNull = value === null;The adapter.mergeDateAndTime method have been removed, you can use the adapter.setHours, adapter.setMinutes, and adapter.setSeconds methods to recreate its behavior:
-const result = adapter.mergeDateAndTime(valueWithDate, valueWithTime);
+const mergeDateAndTime = <TDate>(
+ dateParam,
+ timeParam,
+ ) => {
+ let mergedDate = dateParam;
+ mergedDate = utils.setHours(mergedDate, utils.getHours(timeParam));
+ mergedDate = utils.setMinutes(mergedDate, utils.getMinutes(timeParam));
+ mergedDate = utils.setSeconds(mergedDate, utils.getSeconds(timeParam));
+
+ return mergedDate;
+ };
+
+const result = mergeDateAndTime(valueWithDate, valueWithTime);The adapter.parseISO method have been removed, you can directly use your date library:
// For Day.js
-const value = adapter.parseISO(isoString);
+const value = dayjs(isoString);
// For Luxon
-const value = adapter.parseISO(isoString);
+const value = DateTime.fromISO(isoString);
// For DateFns
-const value = adapter.parseISO(isoString);
+const value = dateFns.parseISO(isoString);
// For Moment
-const value = adapter.parseISO(isoString);
+const value = moment(isoString, true);The adapter.toISO method have been removed, you can directly use your date library:
// For Day.js
-const isoString = adapter.toISO(value);
+const isoString = value.toISOString();
// For Luxon
-const isoString = adapter.toISO(value);
+const isoString = value.toUTC().toISO({ format: 'extended' });
// For DateFns
-const isoString = adapter.toISO(value);
+const isoString = dateFns.formatISO(value, { format: 'extended' });
// For Moment
-const isoString = adapter.toISO(value);
+const isoString = value.toISOString();The adapter.isEqual method used to accept any type of value for its two input and tried to parse them before checking if they were equal.
The method has been simplified and now only accepts an already-parsed date or null (ie: the same formats used by the value prop in the pickers)
const adapterDayjs = new AdapterDayjs();
const adapterLuxon = new AdapterLuxon();
const adapterDateFns = new AdapterDateFns();
const adapterMoment = new AdatperMoment();
// Supported formats
const isEqual = adapterDayjs.isEqual(null, null); // Same for the other adapters
const isEqual = adapterLuxon.isEqual(DateTime.now(), DateTime.fromISO('2022-04-17'));
const isEqual = adapterMoment.isEqual(moment(), moment('2022-04-17'));
const isEqual = adapterDateFns.isEqual(new Date(), new Date('2022-04-17'));
// Non-supported formats (JS Date)
-const isEqual = adapterDayjs.isEqual(new Date(), new Date('2022-04-17'));
+const isEqual = adapterDayjs.isEqual(dayjs(), dayjs('2022-04-17'));
-const isEqual = adapterLuxon.isEqual(new Date(), new Date('2022-04-17'));
+const isEqual = adapterLuxon.isEqual(DateTime.now(), DateTime.fromISO('2022-04-17'));
-const isEqual = adapterMoment.isEqual(new Date(), new Date('2022-04-17'));
+const isEqual = adapterMoment.isEqual(moment(), moment('2022-04-17'));
// Non-supported formats (string)
-const isEqual = adapterDayjs.isEqual('2022-04-16', '2022-04-17');
+const isEqual = adapterDayjs.isEqual(dayjs('2022-04-17'), dayjs('2022-04-17'));
-const isEqual = adapterLuxon.isEqual('2022-04-16', '2022-04-17');
+const isEqual = adapterLuxon.isEqual(DateTime.fromISO('2022-04-17'), DateTime.fromISO('2022-04-17'));
-const isEqual = adapterMoment.isEqual('2022-04-16', '2022-04-17');
+const isEqual = adapterMoment.isEqual(moment('2022-04-17'), moment('2022-04-17'));
-const isEqual = adapterDateFns.isEqual('2022-04-16', '2022-04-17');
+const isEqual = adapterDateFns.isEqual(new Date('2022-04-17'), new Date('2022-04-17'));The dateLibInstance prop of LocalizationProvider does not work with AdapterDayjs anymore (#11023). This prop was used to set the pickers in UTC mode before the implementation of a proper timezone support in the components.
You can learn more about the new approach on the dedicated doc page.
// When a `value` or a `defaultValue` is provided
<LocalizationProvider
adapter={AdapterDayjs}
- dateLibInstance={dayjs.utc}
>
<DatePicker value={dayjs.utc('2022-04-17')} />
</LocalizationProvider>
// When no `value` or `defaultValue` is provided
<LocalizationProvider
adapter={AdapterDayjs}
- dateLibInstance={dayjs.utc}
>
- <DatePicker />
+ <DatePicker timezone="UTC" />
</LocalizationProvider>The property hasLeadingZeros has been removed from the sections in favor of the more precise hasLeadingZerosInFormat and hasLeadingZerosInInput properties (#10994). To keep the same behavior, you can replace it by hasLeadingZerosInFormat:
const fieldRef = React.useRef<FieldRef<FieldSection>>(null);
React.useEffect(() => {
const firstSection = fieldRef.current!.getSections()[0];
- console.log(firstSection.hasLeadingZeros);
+ console.log(firstSection.hasLeadingZerosInFormat);
}, []);
return (
<DateField unstableFieldRef={fieldRef} />
);The adapter.getYearRange method used to accept two params and now accepts a tuple to be consistent with the adapter.isWithinRange method (#10978):
-adapter.getYearRange(start, end);
+adapter.getYearRange([start, end])The adapter.isValid method used to accept any type of value and tried to parse them before checking their validity (#10971).
The method has been simplified and now only accepts an already-parsed date or null.
Which is the same type as the one accepted by the components value prop.
const adapterDayjs = new AdapterDayjs();
const adapterLuxon = new AdapterLuxon();
const adapterDateFns = new AdapterDateFns();
const adapterMoment = new AdatperMoment();
// Supported formats
const isValid = adapterDayjs.isValid(null); // Same for the other adapters
const isValid = adapterLuxon.isValid(DateTime.now());
const isValid = adapterMoment.isValid(moment());
const isValid = adapterDateFns.isValid(new Date());
// Non-supported formats (JS Date)
-const isValid = adapterDayjs.isValid(new Date('2022-04-17'));
+const isValid = adapterDayjs.isValid(dayjs('2022-04-17'));
-const isValid = adapterLuxon.isValid(new Date('2022-04-17'));
+const isValid = adapterLuxon.isValid(DateTime.fromISO('2022-04-17'));
-const isValid = adapterMoment.isValid(new Date('2022-04-17'));
+const isValid = adapterMoment.isValid(moment('2022-04-17'));
// Non-supported formats (string)
-const isValid = adapterDayjs.isValid('2022-04-17');
+const isValid = adapterDayjs.isValid(dayjs('2022-04-17'));
-const isValid = adapterLuxon.isValid('2022-04-17');
+const isValid = adapterLuxon.isValid(DateTime.fromISO('2022-04-17'));
-const isValid = adapterMoment.isValid('2022-04-17');
+const isValid = adapterMoment.isValid(moment('2022-04-17'));
-const isValid = adapterDateFns.isValid('2022-04-17');
+const isValid = adapterDateFns.isValid(new Date('2022-04-17'));adapter.getYearRange to be consistent with adapter.isWithinRange (#10978) @flaviendelanglecomponents / componentsProps typings (#11040) @flaviendelangleadapter.isEqual method to accept TDate | null instead of any (#10976) @flaviendelangleadapter.isValid method to accept TDate | null instead of any (#10971) @flaviendelanglehasLeadingZeros property from FieldSection (#10994) @flaviendelangledayjs (#11023) @flaviendelanglecalendarHeader slot to @mui/x-date-pickers/PickersCalendarHeader (#11020) @flaviendelangledayOfWeekFormatter prop (#10992) @flaviendelanglenext tag (#10996) @LukasTyNov 10, 2023
We're thrilled to announce the first alpha release of our next major version, v7. This release introduces a few breaking changes, paving the way for the upcoming features like Pivoting and DateTimeRangePicker.
A special shoutout to thank the 12 contributors who made this release possible. Here are some highlights ✨:
renderHeader is used (#10961) @cherniavskii<ChartsReferenceLine /> component is now availablecomponents and componentsProps props have been removed. Use slots and slotProps instead. See components section for more details.getRowsToExport function.getApplyFilterFnV7 in GridFilterOperator was renamed to getApplyFilterFn.
If you use getApplyFilterFnV7 directly - rename it to getApplyFilterFn.getApplyFilterFn has changed for performance reasons: const getApplyFilterFn: GetApplyFilterFn<any, unknown> = (filterItem) => {
if (!filterItem.value) {
return null;
}
const filterRegex = new RegExp(escapeRegExp(filterItem.value), 'i');
- return (cellParams) => {
- const { value } = cellParams;
+ return (value, row, colDef, apiRef) => {
return value != null ? filterRegex.test(String(value)) : false;
};
}getApplyQuickFilterFnV7 in GridColDef was renamed to getApplyQuickFilterFn.
If you use getApplyQuickFilterFnV7 directly - rename it to getApplyQuickFilterFn.getApplyQuickFilterFn has changed for performance reasons: const getGridStringQuickFilterFn: GetApplyQuickFilterFn<any, unknown> = (value) => {
if (!value) {
return null;
}
const filterRegex = new RegExp(escapeRegExp(value), 'i');
- return (cellParams) => {
- const { formattedValue } = cellParams;
+ return (value, row, column, apiRef) => {
+ let formattedValue = apiRef.current.getRowFormattedValue(row, column);
return formattedValue != null ? filterRegex.test(formattedValue.toString()) : false;
};
};@mui/x-data-grid@7.0.0-alpha.0undefined slot value (#10937) @romgrkcomponents and componentsProps (#10911) @MBilalShafi@mui/x-data-grid-pro@7.0.0-alpha.0 Same changes as in @mui/x-data-grid@7.0.0-alpha.0, plus:
@mui/x-data-grid-premium@7.0.0-alpha.0 Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.0, plus:
renderHeader is used (#10936) @cherniavskiicomponents and componentsProps props have been removed. Use slots and slotProps instead.@mui/x-date-pickers@7.0.0-alpha.0MultiInputTimeRangeField section selection (#10922) @noraleontereferenceDate behavior in views (#10863) @LukasTycomponents and componentsProps props (#10700) @alexfauquette@mui/x-date-pickers-pro@7.0.0-alpha.0 Same changes as in @mui/x-date-pickers@7.0.0-alpha.0.
@mui/x-charts@7.0.0-alpha.0Types for slots and slotProps have been renamed by removing the "Component" which is meaningless for charts.
Unless you imported those types, to create a wrapper, you should not be impacted by this breaking change.
Here is an example of the renaming for the <ChartsTooltip /> component.
-ChartsTooltipSlotsComponent
+ChartsTooltipSlots
-ChartsTooltipSlotComponentProps
+ChartsTooltipSlotProps<ChartsReferenceLine /> component (#10597) (#10946) @alexfauquetteslots and slotProps types (#10875) @alexfauquette@mui/x-codemod@7.0.0-alpha.0v7.0.0/preset-safe (#10973) @LukasTy@next tag to the installation instructions (#10963) @MBilalShafimaster into next (#10929) @cherniavskiiChanges before 7.x are listed in our changelog for older versions.