Skip to content

Releases: mui/mui-x

v5.12.1

10 Jun 08:48
@DanailH DanailH
v5.12.1
618a9a4
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.12.1

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

  • 🎁 Add reason to onFilterModelChange (#4938) @m4theushw
  • 🔎 Control quick filter input value via model prop (#5013) @alexfauquette
  • 📚 Documentation improvements
  • 🐞 Bugfixes

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

Changes

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

Changes

Docs

Core

Contributors

oliviertassinari, flaviendelangle, and 8 other contributors
Assets 2
Loading

v5.12.0

31 May 19:02
@cherniavskii cherniavskii
v5.12.0
2b8eb8a
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.12.0

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@v5.12.0 / @mui/x-data-grid-pro@v5.12.0 / @mui/x-data-grid-premium@v5.12.0

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

Breaking changes

  • [pickers] Restructure props in MonthPicker / YearPicker and DayPicker (#4814) @flaviendelangle

    The props of MonthPicker / YearPicker and DayPicker have been reworked to make them more consistent for a standalone usage (#4814) @flaviendelangle

    MonthPicker: The prop onMonthChange has been removed, you can use onChange instead since every change is a month change

    YearPicker: The prop onYearPicker has been removed, you can use onChange instead since every change is a year change

    DayPicker: The prop isDateDisabled has been removed, you can now use the same validation props as for the other components (maxDate, minDate, shouldDisableDate, disableFuture and disablePast)

Changes

Docs

Core

Contributors

mbrookes, Rassilion, and 12 other contributors
Assets 2
Loading

v5.11.1

20 May 14:00
@flaviendelangle flaviendelangle
v5.11.1
e5b548f
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.11.1

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

  • 🌍 Support localization on the date and time picker components (#4517) @alexfauquette

    Texts can be translated in the pickers components, similar to what can be done in the data grid component. Check the documentation for more information.

  • 📃 Add support for column spanning when exporting to Excel (#4830) @cherniavskii

  • 🐞 Bugs fixes

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

Changes

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

Breaking changes

  • The props related to the action bar buttons have been removed (clearable, showTodayButton, cancelText, okText)

    To decide which button must be displayed and in which order, you can now use the actions prop of the actionBar component slot props.

    <DatePicker
  componentsProps={{ 
    actionBar: { 
      // The actions will be the same between desktop and mobile
      actions: ['clear'],

      // The actions will be different between desktop and mobile
      actions: (variant) => variant === 'desktop' ? [] : ['clear'],
    }
  }}
/>

    The build-in ActionBar component supports 4 different actions: 'clear', 'cancel', 'accept', and 'today'.
    By default, the pickers will render the cancel and accept button on mobile and no action on desktop.

    If you need other actions, you can provide your own component to the ActionBar component slot

    <DatePicker
  components={{ ActionBar: CustomActionBar }}
/>

Changes

Docs

Core

Contributors

oliviertassinari, flaviendelangle, and 4 other contributors
Assets 2
Loading

v5.11.0

13 May 13:00
@alexfauquette alexfauquette
v5.11.0
99fd61c
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.11.0

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

Contributors

willsoto, oliviertassinari, and 14 other contributors
Assets 2
Loading

v5.10.0

25 Apr 13:56
@DanailH DanailH
v5.10.0
b54798e
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.10.0

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

@mui/x-data-grid@v5.10.0 / @mui/x-data-grid-pro@v5.10.0

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

Docs

Core

Contributors

oliviertassinari, flaviendelangle, and 4 other contributors
Assets 2
Loading

v5.9.0

14 Apr 16:45
@cherniavskii cherniavskii
v5.9.0
b6e06bb
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.9.0

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@v5.9.0 / @mui/x-data-grid-pro@v5.9.0

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

Docs

Core

Contributors

CarsonF, oliviertassinari, and 7 other contributors
Assets 2
Loading

v5.8.0

12 Apr 09:38
@cherniavskii cherniavskii
v5.8.0
7f55c6e
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.8.0

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

  • 🚀 Expose new methods to save and restore the grid state (#4028) @flaviendelangle

    The different methods to save and restore the data-grid state are now documented.

  • ⌚️ Move date and time picker components from the lab (#3451) @flaviendelangle

    Date and time picker components have been moved to the MUI X repository.
    They are now accessible in their own packages: @mui/x-date-pickers and @mui/x-date-pickers-pro.
    For more information, you can read the blog article and the migration guide.

  • 📝 Add onProcessRowUpdateError prop to simplify error management in edit mode (#4267) @m4theushw

  • ✨ Add generic typing to GridColDef and derived interfaces (#4064) @flaviendelangle

    You can now strongly type all the objects related to the row and the cell values.
    Here is an example, you can find out more in the description of #4064.

    const rows: Movie[] = [];

return (
  <DataGrid 
    rows={rows}
    columns={[{ 
      // typeof params.row => Movie (R)
      valueGetter: params => params.row.year, 
    }]}
  />
);

@mui/x-data-grid@v5.8.0 / @mui/x-data-grid-pro@v5.8.0

Changes

@mui/x-date-pickers@v5.0.0-alpha.0 / @mui/x-date-pickers-pro@v5.0.0-alpha.0

Changes

Docs

Core

Contributors

oliviertassinari, flaviendelangle, and 5 other contributors
Assets 2
Loading

v5.7.0

24 Mar 14:53
@m4theushw m4theushw
v5.7.0
e66404d
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.7.0

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

  • ✏ Add a new editing API with better support for server-side persistence and validation (#3963, #4060) @m4theushw

    The new API is stable, but to avoid any breaking changes or conflicts with the old API, you must add the following flag to access it:

    <DataGrid experimentalFeatures={{ newEditingApi: true }} />

    ⚠ Users relying on the old API (legacy) don't need to worry as it will continue to work until v6.

    The new API also features brand new documentation with more useful demos and guides explaining how to create custom edit components.
    Visit the new documentation for more information.

  • 📚 Documentation improvements

  • 🐞 Bug and typo fixes

@mui/x-data-grid@v5.7.0 / @mui/x-data-grid-pro@v5.7.0

Changes

Docs

Core

Contributors

oliviertassinari, flaviendelangle, and 10 other contributors
Assets 2
Loading

v5.6.1

10 Mar 16:41
@flaviendelangle flaviendelangle
v5.6.1
f04331c
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.6.1

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

  • [DataGrid] Allow to add margins or borders between rows (#3848) @m4theushw

    <DataGrid getRowSpacing={() => ({ top: 10, bottom: 10 })} />

    Check the documentation for more information.

@mui/x-data-grid@v5.6.1 / @mui/x-data-grid-pro@v5.6.1

Changes

Docs

Core

Contributors

oliviertassinari, flaviendelangle, and 6 other contributors
Assets 2
Loading

v5.6.0

04 Mar 17:07
@alexfauquette alexfauquette
v5.6.0
d7cb410
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Learn about vigilant mode.
Compare
Choose a tag to compare
v5.6.0

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

  • 📦 Use the same bundling scripts as those in the material-ui repository (#3965) @flaviendelangle

    The code structure and the bundling strategy have been modified to provide better isolation between components.
    The bundle size is slightly reduced, but with tree shaking, the doors are open for significant gains in the future. 🏋
    We predict that such modifications could potentially impact edge cases.
    If you encounter problems with your build, please open an issue.
    These issues will have high priority as part of our risk mitigation strategy.

  • 🧼 Clean and document the column selectors (#4010) @flaviendelangle

    Column selectors have been renamed to improve clarity.
    The old names have been deprecated and will be removed in v6.
    Here are the new names and the modifications needed to get the same information with the new selectors.

    Old name New name
    allGridColumnsFieldsSelector gridColumnFieldsSelector
    allGridColumnsSelector gridColumnDefinitionsSelector
    visibleGridColumnsSelector gridVisibleColumnDefinitionsSelector
    filterableGridColumnsSelector gridFilterableColumnDefinitionsSelector 
    -const { all, lookup, columnVisibilityModel } = gridColumnsSelector(apiRef)
+const all = gridColumnFieldsSelector(apiRef)
+const lookup = gridColumnLookupSelector(apiRef)
+const columnVisibilityModel = gridColumnVisibilityModelSelector(apiRef)

-const filterableFields = filterableGridColumnsIdsSelector(apiRef);
+const lookup = gridFilterableColumnLookupSelector(apiRef);
+const filterableFields = gridColumnFieldsSelector(apiRef).filter(field => lookup[field]);

-const visibleColumnsNumber = visibleGridColumnsLengthSelector(apiRef);
+const visibleColumnsNumber = gridVisibleColumnDefinitionsSelector(apiRef).length;

-const { totalWidth, positions } = gridColumnsMetaSelector(apiRef);
+const totalWidth = gridColumnsTotalWidthSelector(apiRef);
+const positions = gridColumnPositionsSelector(apiRef);

  • 📚 Documentation improvements

  • 🐞 Bug and typo fixes

@mui/x-data-grid@v5.6.0 / @mui/x-data-grid-pro@v5.6.0

Changes

Docs

Core

Contributors

Janpot, oliviertassinari, and 14 other contributors
Assets 2
Loading