github mui/mui-x v5.3.0
on GitHub

latest releases: v7.4.0, v7.3.2, v7.3.1...
2 years ago

A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:

  • 🎁 Allow to group rows based on column value (#3277) @flaviendelangle

    ⚠️ This feature is temporarily available on the Pro plan until the release of the Premium plan.

    To avoid future regression for users of the Pro plan, the feature needs to be explicitly activated using the rowGrouping experimental feature flag. 

    // To fully control
<DataGridPro
  rowGroupingModel={rowGroupingModel}
  onRowGroupingModel={newModel => setRowGroupingModel(newModel)}
  experimentalFeatures={{ rowGrouping: true }}
/>

// To initialize without controlling
<DataGridPro
  initialState={{
    rowGrouping: {
      model: rowGroupingModel,
    },
  }}
  experimentalFeatures={{ rowGrouping: true }}
/>

    For more details see the introduction blog post and documentation.

  • ⚡ Add is any of filter operator (#2874) @alexfauquette

    The new filter operator is any of allows the user to provide multiple values. It opens access to complex filtering pattern mixing AND and OR logic connectors, such as status is any of filled or rejected, and currency is any of EUR or USD.

  • ✨ Introduce a maxWidth property in GridColDef (#3550) @flaviendelangle

    You can now limit the width of the flex columns and the resizable columns with the new maxWidth property on GridColDef. 

    const columns: GridColDef[] = [
  { field: 'director', flex: 1, maxWidth: 200 }, // will take the free space up to 200px and will not be resizable above 200px
  { field: 'year', maxWidth: 150 }, // will not be resizable above 150px
]

  • 🚀 Add component slots for a subset of used @mui/material components (#3490) @DanailH

    To make the grid more flexible we added component slots for base @mui/material components that we use. Those component slots are prefixed with Base to differentiate them from the other grid specific components

    For more information check the documentation documentation.

  • 🔥 Allow to pass csvOptions and printOptions to toolbar component prop (#3623) @flaviendelangle 

    const CustomDataGrid = (props: DataGridProps) => {
  return (
    <DataGrid {...props} componentsProps={{ toolbar: { csvOptions: { delimiter: ';' } } }} />
  )
}

  • 🙈 Add controlled behavior for the visible columns (#3554) @flaviendelangle 

    // To fully control
<DataGrid
  columnVisibilityModel={columnVisibilityModel}
  onColumnVisilibilityModelChange={newModel => setColumnVisibilityModel(newModel)}
/>

// To initialize without controlling
<DataGrid
  initialState={{
    columns: {
      columnVisibilityModel
    }
  }}
/>

    See the documentation for more details.

    The hide property from GridColDef still works but has been deprecated.

  • 📚 Documentation improvements

  • 🐞 Bugfixes

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

Changes

Docs

Core

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

Don't miss a new mui-x release

NewReleases is sending notifications on new releases.

Get notifications