npm @mui/x-data-grid-pro 7.0.0-alpha.0
v7.0.0-alpha.0

latest releases: 7.22.2, 7.22.1, 7.22.0...
12 months ago

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 ✨:

  • 🚀 First v7 alpha release
  • ✨ Fix aggregation label not showing when renderHeader is used (#10961) @cherniavskii
  • 📘 Server side data source early documentation
  • 💫 New recipes added for the data grid
  • 📈 <ChartsReferenceLine /> component is now available
  • 🌍 Add Basque (eu) locale, improve Czech (cs-CZ) and Spanish (es-ES) locales
  • 🐞 Bugfixes
  • 📚 Documentation improvements

Data Grid

Breaking changes

  • The deprecated components and componentsProps props have been removed. Use slots and slotProps instead. See components section for more details.
  • The print export will now only print the selected rows if there are any.
    If there are no selected rows, it will print all rows. This makes the print export consistent with the other exports.
    You can customize the rows to export by using the getRowsToExport function.
  • The getApplyFilterFnV7 in GridFilterOperator was renamed to getApplyFilterFn.
    If you use getApplyFilterFnV7 directly - rename it to getApplyFilterFn.
  • The signature of the function returned by 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;
   };
 }
  • The getApplyQuickFilterFnV7 in GridColDef was renamed to getApplyQuickFilterFn.
    If you use getApplyQuickFilterFnV7 directly - rename it to getApplyQuickFilterFn.
  • The signature of the function returned by 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.0

@mui/x-data-grid-pro@7.0.0-alpha.0 pro

Same changes as in @mui/x-data-grid@7.0.0-alpha.0, plus:

  • [DataGridPro] Autosize Columns - Fix headers being cut off (#10666) @gitstart
  • [DataGridPro] Add data source interface and basic documentation (#10543) @MBilalShafi

@mui/x-data-grid-premium@7.0.0-alpha.0 premium

Same changes as in @mui/x-data-grid-pro@7.0.0-alpha.0, plus:

Date Pickers

Breaking changes

  • The deprecated components and componentsProps props have been removed. Use slots and slotProps instead.

@mui/x-date-pickers@7.0.0-alpha.0

@mui/x-date-pickers-pro@7.0.0-alpha.0 pro

Same changes as in @mui/x-date-pickers@7.0.0-alpha.0.

Charts / @mui/x-charts@7.0.0-alpha.0

Breaking changes

Types for slots and slotProps got 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

@mui/x-codemod@7.0.0-alpha.0

Docs

Core

Don't miss a new x-data-grid-pro release

NewReleases is sending notifications on new releases.