@mui/x-data-grid 7.3.1 → 7.4.0

package/CHANGELOG.md

@@ -3,6 +3,142 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 7.4.0
+
+_May 10, 2024_
+
+We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
+
+- ✨ Add optional `id` attribute on shortcut items of the Date and Time Pickers
+- 🎁 Add support for `date-fns-jalali` v3 in the Date and Time Pickers
+- 🚀 Support rounded corners on `BarChart`
+- 🌍 Add accessibility page to TreeView docs
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.4.0`
+
+- [DataGrid] Fix error when focus moves from column header to `svg` element (#13028) @oukunan
+- [DataGrid] Fix error on column groups change (#12965) @romgrk
+
+#### `@mui/x-data-grid-pro@7.4.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@7.4.0`.
+
+#### `@mui/x-data-grid-premium@7.4.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@7.4.0`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@7.4.0`
+
+- [fields] Fix regression preventing form submit on "Enter" click (#13065) @LukasTy
+- [pickers] Add `AdapterDateFnsJalaliV3` adapter (#12891) @smmoosavi
+- [pickers] Add optional `id` attribute on shortcut items (#12976) @noraleonte
+
+#### `@mui/x-date-pickers-pro@7.4.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@7.4.0`.
+
+### Charts
+
+#### `@mui/x-charts@7.4.0`
+
+- [charts] Add `ChartsGrid` to `themeAugmentation` (#13026) @noraleonte
+- [charts] Support rounded corners on `BarChart` (#12834) @JCQuintas
+
+### Tree View
+
+#### `@mui/x-tree-view@7.4.0`
+
+- [TreeView] Fix props propagation and theme entry in `TreeItem2` (#12889) @flaviendelangle
+
+### Docs
+
+- [docs] Add accessibility page to TreeView docs (#12845) @noraleonte
+- [docs] Fix Charts styling typos (#13061) @oliviertassinari
+- [docs] Fix legal link to EULA free trial (#13013) @oliviertassinari
+- [docs] Update interface name in pinned columns docs (#13070) @cherniavskii
+
+### Core
+
+- [core] Improve release process docs (#12977) @JCQuintas
+- [core] Prepare React 19 (#12991) @oliviertassinari
+- [docs-infra] Fix Netlify PR preview path (#12993) @oliviertassinari
+- [infra] Automation: Add release PR reviewers (#12982) @michelengelen
+
+## 7.3.2
+
+_May 2, 2024_
+
+We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
+
+- 🎁 Add "no data" and "loading" states to charts, allowing users to create [custom visualizations for each state](https://mui.com/x/react-charts/styling/#overlay)
+- 🌍 Improve Hebrew (he-IL) and Hungarian (hu-HU) locales on the Date and Time Pickers
+- 🌍 Improve Danish (da-DK) and Slovak (sk-SK) locales on the Data Grid
+- 📝 Fix a [typo](https://github.com/mui/mui-x/pull/12941/files/4bf4bffbc2799a01a96bc7458a17318cf41c1722#diff-26c31cc69d6f51110f89e339578ef9b3d4a3551f79077fff73f7babb81c5099f) in the auto-generated Charts gradient `id` attribute.
+  It should not affect you, but if you were relying on the gradient `id` attribute, please update your usage.
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.3.2`
+
+- [DataGrid] Allow to change reset text in the columns management panel (#12972) @MBilalShafi
+- [DataGrid] Derive `formattedValue` from the edit value when passing to `renderEditCell` (#12870) @cherniavskii
+- [DataGrid] Fix rows not being recomputed on `props.rowCount` change (#12833) @MBilalShafi
+- [l10n] Improve Danish (da-DK) locale (#12844) @fosterbuster
+- [l10n] Improve Slovak (sk-SK) locale (#12949) @stefikp
+
+#### `@mui/x-data-grid-pro@7.3.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@7.3.2`.
+
+#### `@mui/x-data-grid-premium@7.3.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@7.3.2`, plus:
+
+- [DataGridPremium] Fix print export not working with row grouping (#12957) @MBilalShafi
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@7.3.2`
+
+- [l10n] Improve Hebrew (he-IL) locale (#12910) @michaelNXT1
+- [l10n] Improve Hungarian (hu-HU) locale (#12930) @noherczeg
+- [pickers] Fix typo on the `viewRenderers` prop description (#12915) @flaviendelangle
+- [pickers] Improve TypeScript performance in `PickersDay` (#12920) @flaviendelangle
+
+#### `@mui/x-date-pickers-pro@7.3.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@7.3.2`.
+
+### Charts
+
+#### `@mui/x-charts@7.3.2`
+
+- [charts] Add an overlay for "no data" or "loading" states (#12817) @alexfauquette
+- [charts] Fix typos in documentation, translations and errors (#12941) @JCQuintas
+- [charts] Fix `prop.slots` and `prop.slotProps` not passed to `<ChartsTooltip />` (#12939) @JCQuintas
+
+### Docs
+
+- [docs] Improve Data Grid migration guide (#12969) @MBilalShafi
+- [docs] Polish references to the plans (#12922) @oliviertassinari
+
+### Core
+
+- [core] Fix dependencies (#12951) @LukasTy
+- [core] Remove inconsistent blank lines (#12966) @oliviertassinari
+- [code-infra] Bump node image used by CI in docker (#12961) @LukasTy
+- [docs-infra] Remove no longer needed `next.config` settings (#12861) @oliviertassinari
+- [docs-infra] Use the `@mui/docs/HighlightedCode` (#12848) @alexfauquette
+- [test] Restore `t` command (#12948) @LukasTy
+
 ## 7.3.1
 
 _Apr 26, 2024_
@@ -305,7 +441,7 @@ Same changes as in `@mui/x-date-pickers@7.1.1`, plus:
 
 - [TreeView] Add JSDoc to all `publicAPI` methods (#12649) @flaviendelangle
 - [TreeView] Create `RichTreeViewPro` component (not released yet) (#12610) @flaviendelangle
-- [TreeView] Create pro package (not released yet) (#12240) @flaviendelangle
+- [TreeView] Create Pro package (not released yet) (#12240) @flaviendelangle
 - [TreeView] Fix typo in errors (#12623) @alissa-tung
 - [TreeView] New API method: `setItemExpansion` (#12595) @flaviendelangle
 
@@ -2517,7 +2653,7 @@ Same changes as in `@mui/x-date-pickers@7.0.0-alpha.3`.
 - [core] Make `@mui/system` a direct dependency (#11128) @LukasTy
 - [core] Remove blank lines, coding style @oliviertassinari
 - [core] Remove outdated `ENABLE_AD` env variable (#11181) @oliviertassinari
-- [github] Do not add `plan: Pro` and `plan: Premium` labels on pro / premium issue templates (#10183) @flaviendelangle
+- [github] Do not add `plan: Pro` and `plan: Premium` labels on Pro / Premium issue templates (#10183) @flaviendelangle
 
 ## 7.0.0-alpha.2
 
@@ -3440,10 +3576,10 @@ Same changes as in `@mui/x-date-pickers@6.19.5`.
 - [docs] Fix the Treemap illustration (#12189) @danilo-leal
 - [docs] Fix typo for `AdapterDateFnsV3` (#12037) @flaviendelangle
 - [docs] Improve performance on Charts entry point @oliviertassinari
-- [docs] Move Heatmap to pro (#12170) @alexfauquette
+- [docs] Move Heatmap to Pro (#12170) @alexfauquette
 - [docs] Remove Charts installation next tag call-out (#12133) @LukasTy
 - [docs] Removed `focused` prop from demo (#12126) @michelengelen
-- [docs] Add missing Heatmap pro icon @oliviertassinari
+- [docs] Add missing Heatmap Pro icon @oliviertassinari
 - [docs] Add more illustrations to the Overview page (#12041) @danilo-leal
 - [docs] Avoid use of shorthand (#12009) @oliviertassinari
 
@@ -6170,7 +6306,7 @@ We'd like to offer a big thanks to the 11 contributors who made this release pos
 - [docs] Create examples of pickers with custom fields (#8034) @flaviendelangle
 - [docs] Fix 301 redirections @oliviertassinari
 - [docs] Fix link to React's docs @oliviertassinari
-- [docs] Fix pro license links to point to the same page (#8303) @LukasTy
+- [docs] Fix Pro license links to point to the same page (#8303) @LukasTy
 - [docs] Give an incentive to upgrade (#8269) @oliviertassinari
 - [docs] Improve contrast on data grid navigation (#8239) @oliviertassinari
 - [docs] Update shortcuts page to use slotProps (#8288) @dcorb

package/DataGrid/DataGrid.js

@@ -327,7 +327,7 @@ DataGridRaw.propTypes = {
    */
   keepNonExistentRowsSelected: PropTypes.bool,
   /**
-   * If `true`, a  loading overlay is displayed.
+   * If `true`, a loading overlay is displayed.
    */
   loading: PropTypes.bool,
   /**

package/components/cell/GridCell.js

@@ -131,8 +131,7 @@ const GridCell = /*#__PURE__*/React.forwardRef((props, ref) => {
     cellMode,
     hasFocus,
     isEditable = false,
-    value,
-    formattedValue
+    value
   } = cellParamsWithAPI;
   const canManageOwnFocus = column.type === 'actions' && column.getActions?.(apiRef.current.getRowParams(rowId)).some(action => !action.props.disabled);
   const tabIndex = (cellMode === 'view' || !isEditable) && !canManageOwnFocus ? cellParamsWithAPI.tabIndex : -1;
@@ -156,7 +155,7 @@ const GridCell = /*#__PURE__*/React.forwardRef((props, ref) => {
   if (getCellClassName) {
     classNames.push(getCellClassName(cellParamsWithAPI));
   }
-  const valueToRender = formattedValue == null ? value : formattedValue;
+  const valueToRender = cellParamsWithAPI.formattedValue ?? value;
   const cellRef = React.useRef(null);
   const handleRef = useForkRef(ref, cellRef);
   const focusElementRef = React.useRef(null);
@@ -268,8 +267,10 @@ const GridCell = /*#__PURE__*/React.forwardRef((props, ref) => {
 
     // eslint-disable-next-line @typescript-eslint/naming-convention
     const editCellStateRest = _objectWithoutPropertiesLoose(editCellState, _excluded2);
+    const formattedValue = column.valueFormatter ? column.valueFormatter(editCellState.value, updatedRow, column, apiRef) : cellParamsWithAPI.formattedValue;
     const params = _extends({}, cellParamsWithAPI, {
-      row: updatedRow
+      row: updatedRow,
+      formattedValue
     }, editCellStateRest);
     children = column.renderEditCell(params);
     classNames.push(gridClasses['cell--editing']);

package/components/columnsManagement/GridColumnsManagement.js

@@ -170,7 +170,7 @@ function GridColumnsManagement(props) {
         onClick: () => apiRef.current.setColumnVisibilityModel(initialColumnVisibilityModel),
         disabled: isResetDisabled
       }, rootProps.slotProps?.baseButton, {
-        children: "Reset"
+        children: apiRef.current.getLocaleText('columnsManagementReset')
       })) : null]
     }) : null]
   });

package/constants/localeTextConstants.js

@@ -31,6 +31,7 @@ export const GRID_DEFAULT_LOCALE_TEXT = {
   columnsManagementSearchTitle: 'Search',
   columnsManagementNoColumns: 'No columns',
   columnsManagementShowHideAllText: 'Show/Hide All',
+  columnsManagementReset: 'Reset',
   // Filter panel text
   filterPanelAddFilter: 'Add filter',
   filterPanelRemoveAll: 'Remove all',

package/hooks/features/columnHeaders/useGridColumnHeaders.js

@@ -12,6 +12,7 @@ import { gridRenderContextColumnsSelector, gridVirtualizationColumnEnabledSelect
 import { computeOffsetLeft } from '../virtualization/useGridVirtualScroller';
 import { GridColumnGroupHeader } from '../../../components/columnHeaders/GridColumnGroupHeader';
 import { GridPinnedColumnPosition, gridColumnPositionsSelector, gridVisiblePinnedColumnDefinitionsSelector } from '../columns';
+import { gridColumnGroupsUnwrappedModelSelector } from '../columnGrouping/gridColumnGroupsSelector';
 import { GridScrollbarFillerCell as ScrollbarFiller } from '../../../components/GridScrollbarFillerCell';
 import { getPinnedCellOffset } from '../../../internals/utils/getPinnedCellOffset';
 import { GridColumnHeaderSeparatorSides } from '../../../components/columnHeaders/GridColumnHeaderSeparator';
@@ -44,8 +45,9 @@ export const useGridColumnHeaders = props => {
   const apiRef = useGridPrivateApiContext();
   const theme = useTheme();
   const rootProps = useGridRootProps();
-  const hasVirtualization = useGridSelector(apiRef, gridVirtualizationColumnEnabledSelector);
   const dimensions = useGridSelector(apiRef, gridDimensionsSelector);
+  const hasVirtualization = useGridSelector(apiRef, gridVirtualizationColumnEnabledSelector);
+  const columnGroupsModel = useGridSelector(apiRef, gridColumnGroupsUnwrappedModelSelector);
   const columnPositions = useGridSelector(apiRef, gridColumnPositionsSelector);
   const renderContext = useGridSelector(apiRef, gridRenderContextColumnsSelector);
   const pinnedColumns = useGridSelector(apiRef, gridVisiblePinnedColumnDefinitionsSelector);
@@ -214,13 +216,13 @@ export const useGridColumnHeaders = props => {
     } = columnsToRender;
     const rowStructure = columnGroupsHeaderStructure[depth];
     const firstColumnFieldToRender = visibleColumns[firstColumnToRender].field;
-    const firstGroupToRender = apiRef.current.getColumnGroupPath(firstColumnFieldToRender)[depth] ?? null;
+    const firstGroupToRender = columnGroupsModel[firstColumnFieldToRender]?.[depth] ?? null;
     const firstGroupIndex = rowStructure.findIndex(({
       groupId,
       columnFields
     }) => groupId === firstGroupToRender && columnFields.includes(firstColumnFieldToRender));
     const lastColumnFieldToRender = visibleColumns[lastColumnToRender - 1].field;
-    const lastGroupToRender = apiRef.current.getColumnGroupPath(lastColumnFieldToRender)[depth] ?? null;
+    const lastGroupToRender = columnGroupsModel[lastColumnFieldToRender]?.[depth] ?? null;
     const lastGroupIndex = rowStructure.findIndex(({
       groupId,
       columnFields

package/hooks/features/export/useGridPrintExport.js

@@ -7,6 +7,7 @@ import { gridColumnDefinitionsSelector, gridColumnVisibilityModelSelector } from
 import { gridClasses } from '../../../constants/gridClasses';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
 import { gridRowsMetaSelector } from '../rows/gridRowsMetaSelector';
+import { GRID_ID_AUTOGENERATED } from '../rows/gridRowsUtils';
 import { defaultGetRowsToExport, getColumnsToExport } from './utils';
 import { getDerivedPaginationModel } from '../pagination/useGridPaginationModel';
 import { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';
@@ -42,6 +43,7 @@ export const useGridPrintExport = (apiRef, props) => {
   const previousGridState = React.useRef(null);
   const previousColumnVisibility = React.useRef({});
   const previousRows = React.useRef([]);
+  const previousVirtualizationState = React.useRef();
   React.useEffect(() => {
     doc.current = ownerDocument(apiRef.current.rootElementRef.current);
   }, [apiRef]);
@@ -71,7 +73,13 @@ export const useGridPrintExport = (apiRef, props) => {
     const rowsToExportIds = getRowsToExport({
       apiRef
     });
-    const newRows = rowsToExportIds.map(id => apiRef.current.getRow(id));
+    const newRows = rowsToExportIds.reduce((acc, id) => {
+      const row = apiRef.current.getRow(id);
+      if (!row[GRID_ID_AUTOGENERATED]) {
+        acc.push(row);
+      }
+      return acc;
+    }, []);
     apiRef.current.setRows(newRows);
   }, [apiRef]);
   const handlePrintWindowLoad = React.useCallback((printWindow, options) => {
@@ -124,6 +132,8 @@ export const useGridPrintExport = (apiRef, props) => {
     // prevents us to do it
     const container = document.createElement('div');
     container.appendChild(gridClone);
+    // To avoid an empty page in start on Chromium based browsers
+    printDoc.body.style.marginTop = '0px';
     printDoc.body.innerHTML = container.innerHTML;
     const defaultPageStyle = typeof normalizeOptions.pageStyle === 'function' ? normalizeOptions.pageStyle() : normalizeOptions.pageStyle;
     if (typeof defaultPageStyle === 'string') {
@@ -192,7 +202,9 @@ export const useGridPrintExport = (apiRef, props) => {
       // if the apiRef.current.exportState(); did not exported the column visibility, we update it
       apiRef.current.setColumnVisibilityModel(previousColumnVisibility.current);
     }
-    apiRef.current.unstable_setVirtualization(true);
+    apiRef.current.setState(state => _extends({}, state, {
+      virtualization: previousVirtualizationState.current
+    }));
     apiRef.current.setRows(previousRows.current);
 
     // Clear local state
@@ -208,7 +220,7 @@ export const useGridPrintExport = (apiRef, props) => {
     previousGridState.current = apiRef.current.exportState();
     // It appends that the visibility model is not exported, especially if columnVisibility is not controlled
     previousColumnVisibility.current = gridColumnVisibilityModelSelector(apiRef);
-    previousRows.current = apiRef.current.getSortedRows();
+    previousRows.current = apiRef.current.getSortedRows().filter(row => !row[GRID_ID_AUTOGENERATED]);
     if (props.pagination) {
       const visibleRowCount = gridExpandedRowCountSelector(apiRef);
       const paginationModel = {
@@ -222,11 +234,16 @@ export const useGridPrintExport = (apiRef, props) => {
           'DataGridPro', paginationModel)
         })
       }));
-      apiRef.current.forceUpdate();
     }
+    previousVirtualizationState.current = apiRef.current.state.virtualization;
+    apiRef.current.setState(state => _extends({}, state, {
+      virtualization: _extends({}, state.virtualization, {
+        enabled: false,
+        enabledForColumns: false
+      })
+    }));
     await updateGridColumnsForPrint(options?.fields, options?.allColumns, options?.includeCheckboxes);
     updateGridRowsForPrint(options?.getRowsToExport ?? defaultGetRowsToExport);
-    apiRef.current.unstable_setVirtualization(false);
     await raf(); // wait for the state changes to take action
     const printWindow = buildPrintWindow(options?.fileName);
     if (process.env.NODE_ENV === 'test') {

package/hooks/features/filter/gridFilterSelector.d.ts

@@ -30,10 +30,7 @@ export declare const gridFilteredDescendantCountLookupSelector: import("../../..
  * Does not contain the collapsed children.
  * @category Filtering
  */
-export declare const gridExpandedSortedRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, {
-    id: import("../../..").GridRowId;
-    model: import("../../..").GridValidRowModel;
-}[]>;
+export declare const gridExpandedSortedRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../..").GridRowEntry<import("../../..").GridValidRowModel>[]>;
 /**
  * Get the id of the rows accessible after the filtering process.
  * Does not contain the collapsed children.
@@ -45,10 +42,7 @@ export declare const gridExpandedSortedRowIdsSelector: import("../../../utils/cr
  * Contains the collapsed children.
  * @category Filtering
  */
-export declare const gridFilteredSortedRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, {
-    id: import("../../..").GridRowId;
-    model: import("../../..").GridValidRowModel;
-}[]>;
+export declare const gridFilteredSortedRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../..").GridRowEntry<import("../../..").GridValidRowModel>[]>;
 /**
  * Get the id of the rows accessible after the filtering process.
  * Contains the collapsed children.
@@ -59,10 +53,7 @@ export declare const gridFilteredSortedRowIdsSelector: import("../../../utils/cr
  * Get the id and the model of the top level rows accessible after the filtering process.
  * @category Filtering
  */
-export declare const gridFilteredSortedTopLevelRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, {
-    id: import("../../..").GridRowId;
-    model: import("../../..").GridValidRowModel;
-}[]>;
+export declare const gridFilteredSortedTopLevelRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../..").GridRowEntry<import("../../..").GridValidRowModel>[]>;
 /**
  * Get the amount of rows accessible after the filtering process.
  * @category Filtering

package/hooks/features/focus/useGridFocus.js

@@ -252,7 +252,7 @@ export const useGridFocus = (apiRef, props) => {
     apiRef.current.setColumnGroupHeaderFocus(fields[0], depth, event);
   }, [apiRef]);
   const handleBlur = React.useCallback((_, event) => {
-    if (event.relatedTarget?.className.includes(gridClasses.columnHeader)) {
+    if (event.relatedTarget?.getAttribute('class')?.includes(gridClasses.columnHeader)) {
       return;
     }
     logger.debug(`Clearing focus`);

package/hooks/features/pagination/gridPaginationSelector.d.ts

@@ -46,10 +46,7 @@ export declare const gridPaginationRowRangeSelector: import("../../../utils/crea
  * Get the id and the model of each row to include in the current page if the pagination is enabled.
  * @category Pagination
  */
-export declare const gridPaginatedVisibleSortedGridRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, {
-    id: import("../../..").GridRowId;
-    model: import("../../..").GridValidRowModel;
-}[]>;
+export declare const gridPaginatedVisibleSortedGridRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../..").GridRowEntry<import("../../..").GridValidRowModel>[]>;
 /**
  * Get the id of each row to include in the current page if the pagination is enabled.
  * @category Pagination

package/hooks/features/rows/useGridRows.js

@@ -39,6 +39,7 @@ export const useGridRows = (apiRef, props) => {
   const logger = useGridLogger(apiRef, 'useGridRows');
   const currentPage = useGridVisibleRows(apiRef, props);
   const lastUpdateMs = React.useRef(Date.now());
+  const lastRowCount = React.useRef(props.rowCount);
   const timeout = useTimeout();
   const getRow = React.useCallback(id => {
     const model = gridRowsLookupSelector(apiRef)[id];
@@ -400,6 +401,11 @@ export const useGridRows = (apiRef, props) => {
       isFirstRender.current = false;
       return;
     }
+    let isRowCountPropUpdated = false;
+    if (props.rowCount !== lastRowCount.current) {
+      isRowCountPropUpdated = true;
+      lastRowCount.current = props.rowCount;
+    }
     const areNewRowsAlreadyInState = apiRef.current.caches.rows.rowsBeforePartialUpdates === props.rows;
     const isNewLoadingAlreadyInState = apiRef.current.caches.rows.loadingPropBeforePartialUpdates === props.loading;
     const isNewRowCountAlreadyInState = apiRef.current.caches.rows.rowCountPropBeforePartialUpdates === props.rowCount;
@@ -426,7 +432,9 @@ export const useGridRows = (apiRef, props) => {
         apiRef.current.caches.rows.rowCountPropBeforePartialUpdates = props.rowCount;
         apiRef.current.forceUpdate();
       }
-      return;
+      if (!isRowCountPropUpdated) {
+        return;
+      }
     }
     logger.debug(`Updating all rows, new length ${props.rows.length}`);
     throttledRowsChange({

package/hooks/features/sorting/gridSortingSelector.d.ts

@@ -1,18 +1,16 @@
 import { GridSortDirection, GridSortModel } from '../../../models/gridSortModel';
-import { GridStateCommunity } from '../../../models/gridStateCommunity';
+import type { GridStateCommunity } from '../../../models/gridStateCommunity';
+import type { GridValidRowModel, GridRowEntry } from '../../../models/gridRows';
 /**
  * Get the id of the rows after the sorting process.
  * @category Sorting
  */
-export declare const gridSortedRowIdsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../..").GridRowId[]>;
+export declare const gridSortedRowIdsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../../models/gridRows").GridRowId[]>;
 /**
  * Get the id and the model of the rows after the sorting process.
  * @category Sorting
  */
-export declare const gridSortedRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, {
-    id: import("../../..").GridRowId;
-    model: import("../../..").GridValidRowModel;
-}[]>;
+export declare const gridSortedRowEntriesSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, GridRowEntry<GridValidRowModel>[]>;
 /**
  * Get the current sorting model.
  * @category Sorting

package/hooks/features/sorting/gridSortingSelector.js

@@ -1,6 +1,6 @@
 import { createSelector, createSelectorMemoized } from '../../../utils/createSelector';
-import { gridRowsLookupSelector } from '../rows/gridRowsSelector';
-
+import { gridRowTreeSelector, gridRowsLookupSelector } from '../rows/gridRowsSelector';
+import { GRID_ID_AUTOGENERATED, isAutoGeneratedRow } from '../rows/gridRowsUtils';
 /**
  * @category Sorting
  * @ignore - do not document.
@@ -17,12 +17,25 @@ export const gridSortedRowIdsSelector = createSelector(gridSortingStateSelector,
  * Get the id and the model of the rows after the sorting process.
  * @category Sorting
  */
-export const gridSortedRowEntriesSelector = createSelectorMemoized(gridSortedRowIdsSelector, gridRowsLookupSelector,
-// TODO rows v6: Is this the best approach ?
-(sortedIds, idRowsLookup) => sortedIds.map(id => ({
-  id,
-  model: idRowsLookup[id] ?? {}
-})));
+export const gridSortedRowEntriesSelector = createSelectorMemoized(gridSortedRowIdsSelector, gridRowsLookupSelector, gridRowTreeSelector, (sortedIds, idRowsLookup, rowTree) => sortedIds.reduce((acc, id) => {
+  const model = idRowsLookup[id];
+  if (model) {
+    acc.push({
+      id,
+      model
+    });
+  }
+  const rowNode = rowTree[id];
+  if (rowNode && isAutoGeneratedRow(rowNode)) {
+    acc.push({
+      id,
+      model: {
+        [GRID_ID_AUTOGENERATED]: id
+      }
+    });
+  }
+  return acc;
+}, []));
 
 /**
  * Get the current sorting model.

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v7.3.1
+ * @mui/x-data-grid v7.4.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/locales/arSD.js

@@ -33,6 +33,7 @@ const arSDGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'إضافة مرشِح',

package/locales/beBY.js

@@ -47,6 +47,7 @@ const beBYGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'Дадаць фільтр',

package/locales/bgBG.js

@@ -33,6 +33,7 @@ const bgBGGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'Добави Филтър',

package/locales/csCZ.js

@@ -41,6 +41,7 @@ const csCZGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'Přidat filtr',

package/locales/daDK.js

@@ -32,7 +32,9 @@ const daDKGrid = {
   // Columns management text
   columnsManagementSearchTitle: 'Søg',
   columnsManagementNoColumns: 'Ingen søjler',
-  columnsManagementShowHideAllText: 'Vis/Shjul Alle',
+  columnsManagementShowHideAllText: 'Vis/Skjul Alle',
+  // columnsManagementReset: 'Reset',
+
   // Filter panel text
   filterPanelAddFilter: 'Tilføj filter',
   filterPanelRemoveAll: 'Fjern alle',

package/locales/deDE.js

@@ -33,6 +33,8 @@ const deDEGrid = {
   columnsManagementSearchTitle: 'Suche',
   columnsManagementNoColumns: 'Keine Spalten',
   columnsManagementShowHideAllText: 'Alle anzeigen/verbergen',
+  // columnsManagementReset: 'Reset',
+
   // Filter panel text
   filterPanelAddFilter: 'Filter hinzufügen',
   filterPanelRemoveAll: 'Alle entfernen',

package/locales/elGR.js

@@ -33,6 +33,7 @@ const elGRGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'Προσθήκη φίλτρου',

package/locales/esES.js

@@ -33,6 +33,8 @@ const esESGrid = {
   columnsManagementSearchTitle: 'Buscar',
   columnsManagementNoColumns: 'Sin columnas',
   columnsManagementShowHideAllText: 'Mostrar/Ocultar todas',
+  // columnsManagementReset: 'Reset',
+
   // Filter panel text
   filterPanelAddFilter: 'Agregar filtro',
   filterPanelRemoveAll: 'Remover todos',

package/locales/faIR.js

@@ -33,6 +33,8 @@ const faIRGrid = {
   columnsManagementSearchTitle: 'جستجو',
   columnsManagementNoColumns: 'بدون سطر',
   columnsManagementShowHideAllText: 'نمایش/مخفی کردن همه',
+  // columnsManagementReset: 'Reset',
+
   // Filter panel text
   filterPanelAddFilter: 'افزودن فیلتر',
   filterPanelRemoveAll: 'حذف همه',

package/locales/fiFI.js

@@ -33,6 +33,7 @@ const fiFIGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'Lisää suodatin',

package/locales/frFR.js

@@ -33,6 +33,8 @@ const frFRGrid = {
   columnsManagementSearchTitle: 'Rechercher',
   columnsManagementNoColumns: 'Pas de colonnes',
   columnsManagementShowHideAllText: 'Afficher/masquer toutes',
+  // columnsManagementReset: 'Reset',
+
   // Filter panel text
   filterPanelAddFilter: 'Ajouter un filtre',
   filterPanelRemoveAll: 'Tout supprimer',

package/locales/heIL.js

@@ -33,6 +33,7 @@ const heILGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'הוסף מסנן',

package/locales/hrHR.js

@@ -33,6 +33,7 @@ const hrHRGrid = {
   // columnsManagementSearchTitle: 'Search',
   // columnsManagementNoColumns: 'No columns',
   // columnsManagementShowHideAllText: 'Show/Hide All',
+  // columnsManagementReset: 'Reset',
 
   // Filter panel text
   filterPanelAddFilter: 'Dodajte filter',