Skip to content

v6.0.0-alpha.4

Pre-release
Pre-release

Choose a tag to compare

View all tags
@alexfauquette alexfauquette released this 20 Oct 15:36
· 2781 commits to next since this release
v6.0.0-alpha.4
1efef88
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Verified
Learn about vigilant mode.

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

  • 📝 Manage pickers' toolbar customization with slots
  • 🐞 Bugfixes
  • 🌍 Improve Turkish (tr-TR) locale on the data grid and pickers (#6542) @ramazansancar

@mui/x-data-grid@v6.0.0-alpha.4 / @mui/x-data-grid-pro@v6.0.0-alpha.4 / @mui/x-data-grid-premium@v6.0.0-alpha.4

Breaking changes

  • To avoid confusion with the props that will be added for the cell selection feature, some props related to row selection were renamed to have "row" in their name.
    The renamed props are the following:

    Old name New name
    selectionModel rowSelectionModel
    onSelectionModelChange onRowSelectionModelChange
    disableSelectionOnClick disableRowSelectionOnClick
    disableMultipleSelection disableMultipleRowSelection

  • The gridSelectionStateSelector selector was renamed to gridRowSelectionStateSelector.

  • The selectionChange event was renamed to rowSelectionChange.

Changes

@mui/x-date-pickers@v6.0.0-alpha.4 / @mui/x-date-pickers-pro@v6.0.0-alpha.4

Breaking changes

  • The ToolbarComponent has been replaced by a Toolbar component slot.
    You can find more information about this pattern in the MUI Base documentation:

    // Same on all other pickers
<DatePicker
-  ToolbarComponent: MyToolbar,
+  components={{ Toolbar: MyToolbar }}
/>

  • The toolbarPlaceholder and toolbarFormat props have been moved to the toolbar components props slot:

    // Same on all other pickers
<DatePicker
-  toolbarPlaceholder="__"
-  toolbarFormat="DD / MM / YYYY"
+  componentsProps={{
+    toolbar: {
+      toolbarPlaceholder: "__",
+      toolbarFormat: "DD / MM / YYYY",
+    }
+  }}
/>

  • The toolbarTitle prop has been moved to the localization object:

    // Same on all other pickers
<DatePicker
-  toolbarTitle="Title"
+  localeText={{ toolbarTitle: "Title" }}
/>

  • The toolbar related translation keys have been renamed to better fit their usage:

    // Same on all other pickers
<DatePicker
  localeText={{
-    datePickerDefaultToolbarTitle: 'Date Picker',
+    datePickerToolbarTitle: 'Date Picker',
-    timePickerDefaultToolbarTitle: 'Time Picker',
+    timePickerToolbarTitle: 'Time Picker',
-    dateTimePickerDefaultToolbarTitle: 'Date Time Picker',
+    dateTimePickerToolbarTitle: 'Date Time Picker',
-    dateRangePickerDefaultToolbarTitle: 'Date Range Picker',
+    dateRangePickerToolbarTitle: 'Date Range Picker',
  }}
/>

  • The onChange / openView props on the toolbar have been renamed onViewChange / view

  • The hideTabs, dateRangeIcon, and timeIcon props have been moved to tabs component props:

    // Same on all other Date Time picker variations
<DateTimePicker
-  hideTabs={false}
-  dateRangeIcon={<LightModeIcon />}
-  timeIcon={<AcUnitIcon />}
+  componentsProps={{
+    tabs: {
+      hidden: false,
+      dateRangeIcon: <LightModeIcon />,
+      timeIcon: <AcUnitIcon />,
+    }
+  }}
/>

  • The onChange prop on DateTimePickerTabs component has been renamed to onViewChange to better fit its usage:

    <DateTimePickerTabs
-  onChange={() => {}}
+  onViewChange={() => {}}
/>

Changes

Docs

Core

Contributors

oliviertassinari, flaviendelangle, and 7 other contributors
Assets 2
Loading