github mui/mui-x v5.11.0
on GitHub

latest releases: v7.18.0, v6.20.5, v7.17.0...
2 years ago

We'd like to offer a big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:

  • 🚀 Premium plan release. We're happy to announce that the Premium plan is finally out! With it, MUI X officially steps up to the next level, supporting the most advanced use cases for UI components.

    This plan is available through the new @mui/x-data-grid-premium package, which contains the row grouping and the Excel export features.

    If you were already using the row grouping feature, you can upgrade by installing @mui/x-data-grid-premium and replace DataGridPro with DataGridPremium, as follows. Note that the experimental flag is not required anymore to use the row grouping. 

    -import { DataGridPro } from '@mui/x-data-grid-pro';
+import { DataGridPremium } from '@mui/x-data-grid-premium';

-<DataGridPro experimentalFeatures={{ rowGrouping: true }} />
+<DataGridPremium />

    For more information about the revised pricing model please have a look at the blog post.

  • 👔 Excel export. You can find this new Premium feature at: https://mui.com/x/react-data-grid/export/#excel-export.

  • 🔎 Quick filtering. You can now add a quick filtering search bar to your grid. To do so, either pass showQuickFilter prop to the <GridToolbar /> or use the <GridToolbarQuickFilter /> component in your custom toolbar. More information about how to customize the filtering logic is in the documentation.

  • 🐞 Bugs fixes

@mui/x-data-grid@v5.11.0 / @mui/x-data-grid-pro@v5.11.0 / @mui/x-data-grid-premium@v5.11.0

Breaking changes

  • Move row grouping to the premium package (#4223) @flaviendelangle

    The use of rowGrouping in the @mui/x-data-grid-pro package is deprecated. The experimental flag will be removed in an upcoming release.

Changes

@mui/x-date-pickers@5.0.0-alpha.3 / @mui/x-date-pickers-pro@5.0.0-alpha.3

Breaking changes

  • Rework the auto-closing behavior of the pickers (#4408) @flaviendelangle

    The disableCloseOnSelect prop has been replaced by a new closeOnSelect prop which has the opposite behavior.
    The default behavior remains the same (close after the last step on desktop but not on mobile). 

     // If you don't want to close after the last step
-<DatePicker disableCloseOnSelect={false} />
+<DatePicker closeOnSelect />

 // If you want to close after the last step
-<DatePicker disableCloseOnSelect />
+<DatePicker closeOnSelect={false} />

Changes

Docs

Core

Check out latest releases or
releases around mui/mui-x v5.11.0

Don't miss a new mui-x release

NewReleases is sending notifications on new releases.

Get notifications