@mui/x-data-grid 6.4.0 → 6.6.0

package/legacy/hooks/features/focus/useGridFocus.js

@@ -9,16 +9,19 @@ import { gridFocusCellSelector, unstable_gridFocusColumnGroupHeaderSelector } fr
 import { gridVisibleColumnDefinitionsSelector } from '../columns/gridColumnsSelector';
 import { getVisibleRows } from '../../utils/useGridVisibleRows';
 import { clamp } from '../../../utils/utils';
+import { gridPinnedRowsSelector } from '../rows/gridRowsSelector';
 export var focusStateInitializer = function focusStateInitializer(state) {
   return _extends({}, state, {
     focus: {
       cell: null,
       columnHeader: null,
+      columnHeaderFilter: null,
       columnGroupHeader: null
     },
     tabIndex: {
       cell: null,
       columnHeader: null,
+      columnHeaderFilter: null,
       columnGroupHeader: null
     }
   });
@@ -54,6 +57,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
             field: field
           },
           columnHeader: null,
+          columnHeaderFilter: null,
           columnGroupHeader: null
         },
         focus: {
@@ -62,6 +66,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
             field: field
           },
           columnHeader: null,
+          columnHeaderFilter: null,
           columnGroupHeader: null
         }
       });
@@ -90,6 +95,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
           columnHeader: {
             field: field
           },
+          columnHeaderFilter: null,
           cell: null,
           columnGroupHeader: null
         },
@@ -97,6 +103,34 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
           columnHeader: {
             field: field
           },
+          columnHeaderFilter: null,
+          cell: null,
+          columnGroupHeader: null
+        }
+      });
+    });
+    apiRef.current.forceUpdate();
+  }, [apiRef, logger, publishCellFocusOut]);
+  var setColumnHeaderFilterFocus = React.useCallback(function (field) {
+    var event = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var cell = gridFocusCellSelector(apiRef);
+    publishCellFocusOut(cell, event);
+    apiRef.current.setState(function (state) {
+      logger.debug("Focusing on column header filter with colIndex=".concat(field));
+      return _extends({}, state, {
+        tabIndex: {
+          columnHeader: null,
+          columnHeaderFilter: {
+            field: field
+          },
+          cell: null,
+          columnGroupHeader: null
+        },
+        focus: {
+          columnHeader: null,
+          columnHeaderFilter: {
+            field: field
+          },
           cell: null,
           columnGroupHeader: null
         }
@@ -118,6 +152,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
             depth: depth
           },
           columnHeader: null,
+          columnHeaderFilter: null,
           cell: null
         },
         focus: {
@@ -126,6 +161,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
             depth: depth
           },
           columnHeader: null,
+          columnHeaderFilter: null,
           cell: null
         }
       });
@@ -137,8 +173,18 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
   }, [apiRef]);
   var moveFocusToRelativeCell = React.useCallback(function (id, field, direction) {
     var columnIndexToFocus = apiRef.current.getColumnIndex(field);
-    var rowIndexToFocus = apiRef.current.getRowIndexRelativeToVisibleRows(id);
     var visibleColumns = gridVisibleColumnDefinitionsSelector(apiRef);
+    var currentPage = getVisibleRows(apiRef, {
+      pagination: props.pagination,
+      paginationMode: props.paginationMode
+    });
+    var pinnedRows = gridPinnedRowsSelector(apiRef);
+
+    // Include pinned rows as well
+    var currentPageRows = [].concat(pinnedRows.top || [], currentPage.rows, pinnedRows.bottom || []);
+    var rowIndexToFocus = currentPageRows.findIndex(function (row) {
+      return row.id === id;
+    });
     if (direction === 'right') {
       columnIndexToFocus += 1;
     } else if (direction === 'left') {
@@ -146,14 +192,10 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
     } else {
       rowIndexToFocus += 1;
     }
-    var currentPage = getVisibleRows(apiRef, {
-      pagination: props.pagination,
-      paginationMode: props.paginationMode
-    });
     if (columnIndexToFocus >= visibleColumns.length) {
       // Go to next row if we are after the last column
       rowIndexToFocus += 1;
-      if (rowIndexToFocus < currentPage.rows.length) {
+      if (rowIndexToFocus < currentPageRows.length) {
         // Go to first column of the next row if there's one more row
         columnIndexToFocus = 0;
       }
@@ -165,8 +207,11 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
         columnIndexToFocus = visibleColumns.length - 1;
       }
     }
-    rowIndexToFocus = clamp(rowIndexToFocus, 0, currentPage.rows.length - 1);
-    var rowToFocus = currentPage.rows[rowIndexToFocus];
+    rowIndexToFocus = clamp(rowIndexToFocus, 0, currentPageRows.length - 1);
+    var rowToFocus = currentPageRows[rowIndexToFocus];
+    if (!rowToFocus) {
+      return;
+    }
     var colSpanInfo = apiRef.current.unstable_getCellColSpanInfo(rowToFocus.id, columnIndexToFocus);
     if (colSpanInfo && colSpanInfo.spannedByColSpan) {
       if (direction === 'left' || direction === 'below') {
@@ -218,6 +263,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
         focus: {
           cell: null,
           columnHeader: null,
+          columnHeaderFilter: null,
           columnGroupHeader: null
         }
       });
@@ -258,6 +304,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
           focus: {
             cell: null,
             columnHeader: null,
+            columnHeaderFilter: null,
             columnGroupHeader: null
           }
         });
@@ -288,6 +335,7 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
           focus: {
             cell: null,
             columnHeader: null,
+            columnHeaderFilter: null,
             columnGroupHeader: null
           }
         });
@@ -296,7 +344,8 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
   }, [apiRef]);
   var focusApi = {
     setCellFocus: setCellFocus,
-    setColumnHeaderFocus: setColumnHeaderFocus
+    setColumnHeaderFocus: setColumnHeaderFocus,
+    setColumnHeaderFilterFocus: setColumnHeaderFilterFocus
   };
   var focusPrivateApi = {
     moveFocusToRelativeCell: moveFocusToRelativeCell,

package/legacy/hooks/features/headerFiltering/gridHeaderFilteringSelectors.js

@@ -0,0 +1,11 @@
+/* eslint-disable @typescript-eslint/naming-convention */
+import { createSelector } from '../../../utils/createSelector';
+export var unstable_gridHeaderFilteringStateSelector = function unstable_gridHeaderFilteringStateSelector(state) {
+  return state.headerFiltering;
+};
+export var unstable_gridHeaderFilteringEditFieldSelector = createSelector(unstable_gridHeaderFilteringStateSelector, function (headerFilteringState) {
+  return headerFilteringState.editing;
+});
+export var unstable_gridHeaderFilteringMenuSelector = createSelector(unstable_gridHeaderFilteringStateSelector, function (headerFilteringState) {
+  return headerFilteringState.menuOpen;
+});

package/legacy/hooks/features/headerFiltering/index.js

@@ -0,0 +1 @@
+export * from './gridHeaderFilteringSelectors';

package/legacy/hooks/features/headerFiltering/useGridHeaderFiltering.js

@@ -0,0 +1,93 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiMethod } from '../../utils/useGridApiMethod';
+import { useGridLogger } from '../../utils';
+import { gridColumnLookupSelector, gridColumnVisibilityModelSelector, gridColumnFieldsSelector } from '../columns/gridColumnsSelector';
+export var headerFilteringStateInitializer = function headerFilteringStateInitializer(state) {
+  return _extends({}, state, {
+    headerFiltering: {
+      editing: null,
+      menuOpen: null
+    }
+  });
+};
+export var useGridHeaderFiltering = function useGridHeaderFiltering(apiRef, props) {
+  var logger = useGridLogger(apiRef, 'useGridHeaderFiltering');
+  var setHeaderFilterState = React.useCallback(function (headerFilterState) {
+    apiRef.current.setState(function (state) {
+      var _headerFilterState$ed, _headerFilterState$me;
+      // Safety check to avoid MIT users from using it
+      // This hook should ultimately be moved to the Pro package
+      if (props.signature === 'DataGrid') {
+        return state;
+      }
+      return _extends({}, state, {
+        headerFiltering: {
+          editing: (_headerFilterState$ed = headerFilterState.editing) != null ? _headerFilterState$ed : null,
+          menuOpen: (_headerFilterState$me = headerFilterState.menuOpen) != null ? _headerFilterState$me : null
+        }
+      });
+    });
+    apiRef.current.forceUpdate();
+  }, [apiRef, props.signature]);
+  var startHeaderFilterEditMode = React.useCallback(function (field) {
+    logger.debug("Starting edit mode on header filter for field: ".concat(field));
+    apiRef.current.setHeaderFilterState({
+      editing: field
+    });
+  }, [apiRef, logger]);
+  var stopHeaderFilterEditMode = React.useCallback(function () {
+    logger.debug("Stopping edit mode on header filter");
+    apiRef.current.setHeaderFilterState({
+      editing: null
+    });
+  }, [apiRef, logger]);
+  var showHeaderFilterMenu = React.useCallback(function (field) {
+    logger.debug("Opening header filter menu for field: ".concat(field));
+    apiRef.current.setHeaderFilterState({
+      menuOpen: field
+    });
+  }, [apiRef, logger]);
+  var hideHeaderFilterMenu = React.useCallback(function () {
+    logger.debug("Hiding header filter menu for active field");
+    var fieldToFocus = apiRef.current.state.headerFiltering.menuOpen;
+    if (fieldToFocus) {
+      var columnLookup = gridColumnLookupSelector(apiRef);
+      var columnVisibilityModel = gridColumnVisibilityModelSelector(apiRef);
+      var orderedFields = gridColumnFieldsSelector(apiRef);
+
+      // If the column was removed from the grid, we need to find the closest visible field
+      if (!columnLookup[fieldToFocus]) {
+        fieldToFocus = orderedFields[0];
+      }
+
+      // If the field to focus is hidden, we need to find the closest visible field
+      if (columnVisibilityModel[fieldToFocus] === false) {
+        // contains visible column fields + the field that was just hidden
+        var visibleOrderedFields = orderedFields.filter(function (field) {
+          if (field === fieldToFocus) {
+            return true;
+          }
+          return columnVisibilityModel[field] !== false;
+        });
+        var fieldIndex = visibleOrderedFields.indexOf(fieldToFocus);
+        fieldToFocus = visibleOrderedFields[fieldIndex + 1] || visibleOrderedFields[fieldIndex - 1];
+      }
+      apiRef.current.setHeaderFilterState({
+        menuOpen: null
+      });
+      apiRef.current.setColumnHeaderFilterFocus(fieldToFocus);
+    }
+  }, [apiRef, logger]);
+  var headerFilterPrivateApi = {
+    setHeaderFilterState: setHeaderFilterState
+  };
+  var headerFilterApi = {
+    startHeaderFilterEditMode: startHeaderFilterEditMode,
+    stopHeaderFilterEditMode: stopHeaderFilterEditMode,
+    showHeaderFilterMenu: showHeaderFilterMenu,
+    hideHeaderFilterMenu: hideHeaderFilterMenu
+  };
+  useGridApiMethod(apiRef, headerFilterApi, 'public');
+  useGridApiMethod(apiRef, headerFilterPrivateApi, 'private');
+};

package/legacy/hooks/features/index.js

@@ -11,4 +11,5 @@ export * from './rows';
 export * from './rowSelection';
 export * from './sorting';
 export * from './dimensions';
-export * from './statePersistence';
+export * from './statePersistence';
+export * from './headerFiltering';

package/legacy/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js

@@ -15,6 +15,7 @@ import { gridPinnedRowsSelector } from '../rows/gridRowsSelector';
 import { unstable_gridFocusColumnGroupHeaderSelector } from '../focus';
 import { gridColumnGroupsHeaderMaxDepthSelector } from '../columnGrouping/gridColumnGroupsSelector';
 import { useGridSelector } from '../../utils/useGridSelector';
+import { unstable_gridHeaderFilteringEditFieldSelector, unstable_gridHeaderFilteringMenuSelector } from '../headerFiltering/gridHeaderFilteringSelectors';
 import { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';
 function enrichPageRowsWithPinnedRows(apiRef, rows) {
   var pinnedRows = gridPinnedRowsSelector(apiRef) || {};
@@ -69,6 +70,9 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
   var currentPageRows = React.useMemo(function () {
     return enrichPageRowsWithPinnedRows(apiRef, initialCurrentPageRows);
   }, [apiRef, initialCurrentPageRows]);
+  var headerFilteringEnabled =
+  // @ts-expect-error // TODO move relevant code to the `DataGridPro`
+  props.signature !== 'DataGrid' && props.unstable_headerFilters;
 
   /**
    * @param {number} colIndex Index of the column to focus
@@ -108,6 +112,14 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
     var field = apiRef.current.getVisibleColumns()[colIndex].field;
     apiRef.current.setColumnHeaderFocus(field, event);
   }, [apiRef, logger]);
+  var goToHeaderFilter = React.useCallback(function (colIndex, event) {
+    logger.debug("Navigating to header filter col ".concat(colIndex));
+    apiRef.current.scrollToIndexes({
+      colIndex: colIndex
+    });
+    var field = apiRef.current.getVisibleColumns()[colIndex].field;
+    apiRef.current.setColumnHeaderFilterFocus(field, event);
+  }, [apiRef, logger]);
   var goToGroupHeader = React.useCallback(function (colIndex, depth, event) {
     logger.debug("Navigating to header col ".concat(colIndex));
     apiRef.current.scrollToIndexes({
@@ -117,7 +129,7 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
     apiRef.current.setColumnGroupHeaderFocus(field, depth, event);
   }, [apiRef, logger]);
   var getRowIdFromIndex = React.useCallback(function (rowIndex) {
-    return currentPageRows[rowIndex].id;
+    return currentPageRows == null ? void 0 : currentPageRows[rowIndex].id;
   }, [currentPageRows]);
   var handleColumnHeaderKeyDown = React.useCallback(function (params, event) {
     var headerTitleNode = event.currentTarget.querySelector(".".concat(gridClasses.columnHeaderTitleContainerContent));
@@ -143,7 +155,11 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
       case 'ArrowDown':
         {
           if (firstRowIndexInPage !== null) {
-            goToCell(colIndexBefore, getRowIdFromIndex(firstRowIndexInPage));
+            if (headerFilteringEnabled) {
+              goToHeaderFilter(colIndexBefore, event);
+            } else {
+              goToCell(colIndexBefore, getRowIdFromIndex(firstRowIndexInPage));
+            }
           }
           break;
         }
@@ -217,7 +233,97 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
     if (shouldPreventDefault) {
       event.preventDefault();
     }
-  }, [apiRef, currentPageRows.length, theme.direction, goToCell, getRowIdFromIndex, goToHeader, goToGroupHeader]);
+  }, [apiRef, currentPageRows.length, headerFilteringEnabled, goToHeaderFilter, goToCell, getRowIdFromIndex, theme.direction, goToHeader, goToGroupHeader]);
+  var handleHeaderFilterKeyDown = React.useCallback(function (params, event) {
+    var dimensions = apiRef.current.getRootDimensions();
+    if (!dimensions) {
+      return;
+    }
+    var isEditing = unstable_gridHeaderFilteringEditFieldSelector(apiRef) === params.field;
+    var isHeaderMenuOpen = unstable_gridHeaderFilteringMenuSelector(apiRef) === params.field;
+    if (isEditing || isHeaderMenuOpen || !isNavigationKey(event.key)) {
+      return;
+    }
+    var viewportPageSize = apiRef.current.getViewportPageSize();
+    var colIndexBefore = params.field ? apiRef.current.getColumnIndex(params.field) : 0;
+    var firstRowIndexInPage = 0;
+    var lastRowIndexInPage = currentPageRows.length - 1;
+    var firstColIndex = 0;
+    var lastColIndex = gridVisibleColumnDefinitionsSelector(apiRef).length - 1;
+    var shouldPreventDefault = true;
+    switch (event.key) {
+      case 'ArrowDown':
+        {
+          var rowId = getRowIdFromIndex(firstRowIndexInPage);
+          if (firstRowIndexInPage !== null && rowId != null) {
+            goToCell(colIndexBefore, rowId);
+          }
+          break;
+        }
+      case 'ArrowRight':
+        {
+          var rightColIndex = getRightColumnIndex({
+            currentColIndex: colIndexBefore,
+            firstColIndex: firstColIndex,
+            lastColIndex: lastColIndex,
+            direction: theme.direction
+          });
+          if (rightColIndex !== null) {
+            goToHeaderFilter(rightColIndex, event);
+          }
+          break;
+        }
+      case 'ArrowLeft':
+        {
+          var leftColIndex = getLeftColumnIndex({
+            currentColIndex: colIndexBefore,
+            firstColIndex: firstColIndex,
+            lastColIndex: lastColIndex,
+            direction: theme.direction
+          });
+          if (leftColIndex !== null) {
+            goToHeaderFilter(leftColIndex, event);
+          } else {
+            apiRef.current.setColumnHeaderFilterFocus(params.field, event);
+          }
+          break;
+        }
+      case 'ArrowUp':
+        {
+          goToHeader(colIndexBefore, event);
+          break;
+        }
+      case 'PageDown':
+        {
+          if (firstRowIndexInPage !== null && lastRowIndexInPage !== null) {
+            goToCell(colIndexBefore, getRowIdFromIndex(Math.min(firstRowIndexInPage + viewportPageSize, lastRowIndexInPage)));
+          }
+          break;
+        }
+      case 'Home':
+        {
+          goToHeaderFilter(firstColIndex, event);
+          break;
+        }
+      case 'End':
+        {
+          goToHeaderFilter(lastColIndex, event);
+          break;
+        }
+      case ' ':
+        {
+          // prevent Space event from scrolling
+          break;
+        }
+      default:
+        {
+          shouldPreventDefault = false;
+        }
+    }
+    if (shouldPreventDefault) {
+      event.preventDefault();
+    }
+  }, [apiRef, currentPageRows.length, goToHeaderFilter, theme.direction, goToHeader, goToCell, getRowIdFromIndex]);
   var focusedColumnGroup = useGridSelector(apiRef, unstable_gridFocusColumnGroupHeaderSelector);
   var handleColumnGroupHeaderKeyDown = React.useCallback(function (params, event) {
     var dimensions = apiRef.current.getRootDimensions();
@@ -350,6 +456,8 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
         {
           if (rowIndexBefore > firstRowIndexInPage) {
             goToCell(colIndexBefore, getRowIdFromIndex(rowIndexBefore - 1));
+          } else if (headerFilteringEnabled) {
+            goToHeaderFilter(colIndexBefore, event);
           } else {
             goToHeader(colIndexBefore, event);
           }
@@ -450,7 +558,7 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
     if (shouldPreventDefault) {
       event.preventDefault();
     }
-  }, [apiRef, currentPageRows, theme.direction, getRowIdFromIndex, goToCell, goToHeader]);
+  }, [apiRef, currentPageRows, theme.direction, goToCell, getRowIdFromIndex, headerFilteringEnabled, goToHeaderFilter, goToHeader]);
   var checkIfCanStartEditing = React.useCallback(function (initialValue, _ref3) {
     var event = _ref3.event;
     if (event.key === ' ') {
@@ -461,6 +569,7 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
   }, []);
   useGridRegisterPipeProcessor(apiRef, 'canStartEditing', checkIfCanStartEditing);
   useGridApiEventHandler(apiRef, 'columnHeaderKeyDown', handleColumnHeaderKeyDown);
+  useGridApiEventHandler(apiRef, 'headerFilterKeyDown', handleHeaderFilterKeyDown);
   useGridApiEventHandler(apiRef, 'columnGroupHeaderKeyDown', handleColumnGroupHeaderKeyDown);
   useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);
 };

package/legacy/hooks/features/preferencesPanel/useGridPreferencesPanel.js

@@ -56,14 +56,16 @@ export var useGridPreferencesPanel = function useGridPreferencesPanel(apiRef, pr
   var hidePreferencesDelayed = React.useCallback(function () {
     hideTimeout.current = setTimeout(hidePreferences, 100);
   }, [hidePreferences]);
-  var showPreferences = React.useCallback(function (newValue) {
+  var showPreferences = React.useCallback(function (newValue, panelId, labelId) {
     logger.debug('Opening Preferences Panel');
     doNotHidePanel();
     apiRef.current.setState(function (state) {
       return _extends({}, state, {
         preferencePanel: _extends({}, state.preferencePanel, {
           open: true,
-          openedPanelValue: newValue
+          openedPanelValue: newValue,
+          panelId: panelId,
+          labelId: labelId
         })
       });
     });

package/legacy/hooks/features/rows/useGridRows.js

@@ -120,8 +120,23 @@ export var useGridRows = function useGridRows(apiRef, props) {
     if (props.signature === GridSignature.DataGrid && updates.length > 1) {
       throw new Error(["MUI: You can't update several rows at once in `apiRef.current.updateRows` on the DataGrid.", 'You need to upgrade to DataGridPro or DataGridPremium component to unlock this feature.'].join('\n'));
     }
+    var nonPinnedRowsUpdates = [];
+    updates.forEach(function (update) {
+      var id = getRowIdFromRowModel(update, props.getRowId, 'A row was provided without id when calling updateRows():');
+      var rowNode = apiRef.current.getRowNode(id);
+      if ((rowNode == null ? void 0 : rowNode.type) === 'pinnedRow') {
+        // @ts-ignore because otherwise `release:build` doesn't work
+        var pinnedRowsCache = apiRef.current.caches.pinnedRows;
+        var prevModel = pinnedRowsCache.idLookup[id];
+        if (prevModel) {
+          pinnedRowsCache.idLookup[id] = _extends({}, prevModel, update);
+        }
+      } else {
+        nonPinnedRowsUpdates.push(update);
+      }
+    });
     var cache = updateCacheWithNewRows({
-      updates: updates,
+      updates: nonPinnedRowsUpdates,
       getRowId: props.getRowId,
       previousCache: apiRef.current.caches.rows
     });

package/legacy/hooks/features/rows/useGridRowsMeta.js

@@ -1,4 +1,3 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_debounce as debounce, unstable_capitalize as capitalize } from '@mui/utils';
@@ -105,20 +104,14 @@ export var useGridRowsMeta = function useGridRowsMeta(apiRef, props) {
       } else {
         rowsHeightLookup.current[row.id].needsFirstMeasurement = false;
       }
-      var existingBaseSizes = Object.entries(sizes).reduce(function (acc, _ref) {
-        var _ref2 = _slicedToArray(_ref, 2),
-          key = _ref2[0],
-          size = _ref2[1];
-        if (/^base[A-Z]/.test(key)) {
-          acc[key] = size;
+      var initialHeights = {};
+      /* eslint-disable-next-line no-restricted-syntax */
+      for (var _key in sizes) {
+        if (/^base[A-Z]/.test(_key)) {
+          initialHeights[_key] = sizes[_key];
         }
-        return acc;
-      }, {});
-
-      // We use an object to make simple to check if a height is already added or not
-      var initialHeights = _extends({}, existingBaseSizes, {
-        baseCenter: baseRowHeight
-      });
+      }
+      initialHeights.baseCenter = baseRowHeight;
       if (getRowSpacing) {
         var _spacing$top, _spacing$bottom;
         var indexRelativeToCurrentPage = apiRef.current.getRowIndexRelativeToVisibleRows(row.id);
@@ -140,16 +133,15 @@ export var useGridRowsMeta = function useGridRowsMeta(apiRef, props) {
       var maximumBaseSize = 0;
       var otherSizes = 0;
       var processedSizes = calculateRowProcessedSizes(row);
-      Object.entries(processedSizes).forEach(function (_ref3) {
-        var _ref4 = _slicedToArray(_ref3, 2),
-          size = _ref4[0],
-          value = _ref4[1];
-        if (/^base[A-Z]/.test(size)) {
+      /* eslint-disable-next-line no-restricted-syntax, guard-for-in */
+      for (var _key2 in processedSizes) {
+        var value = processedSizes[_key2];
+        if (/^base[A-Z]/.test(_key2)) {
           maximumBaseSize = value > maximumBaseSize ? value : maximumBaseSize;
         } else {
           otherSizes += value;
         }
-      });
+      }
       return acc + maximumBaseSize + otherSizes;
     }, 0);
     pinnedRows == null ? void 0 : (_pinnedRows$top = pinnedRows.top) == null ? void 0 : _pinnedRows$top.forEach(function (row) {

package/legacy/index.js

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

package/legacy/internals/index.js

@@ -4,13 +4,16 @@ export { GridVirtualScrollerRenderZone } from '../components/virtualization/Grid
 export { GridBaseColumnHeaders } from '../components/columnHeaders/GridBaseColumnHeaders';
 export { GridColumnHeadersInner } from '../components/columnHeaders/GridColumnHeadersInner';
 export { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from '../constants/defaultGridSlotsComponents';
+export { getGridFilter } from '../components/panel/filterPanel/GridFilterPanel';
 export { useGridRegisterPipeProcessor } from '../hooks/core/pipeProcessing';
 export { useGridRegisterStrategyProcessor, GRID_DEFAULT_STRATEGY } from '../hooks/core/strategyProcessing';
 export { useGridInitialization } from '../hooks/core/useGridInitialization';
 export { useGridClipboard } from '../hooks/features/clipboard/useGridClipboard';
 export { useGridColumnHeaders } from '../hooks/features/columnHeaders/useGridColumnHeaders';
+export { unstable_gridHeaderFilteringEditFieldSelector, unstable_gridHeaderFilteringMenuSelector } from '../hooks/features/headerFiltering/gridHeaderFilteringSelectors';
 export { useGridColumnMenu, columnMenuStateInitializer } from '../hooks/features/columnMenu/useGridColumnMenu';
 export { useGridColumns, columnsStateInitializer } from '../hooks/features/columns/useGridColumns';
+export { getTotalHeaderHeight } from '../hooks/features/columns/gridColumnsUtils';
 export { useGridColumnSpanning } from '../hooks/features/columns/useGridColumnSpanning';
 export { useGridColumnGrouping, columnGroupsStateInitializer } from '../hooks/features/columnGrouping/useGridColumnGrouping';
 export { useGridDensity, densityStateInitializer } from '../hooks/features/density/useGridDensity';
@@ -32,6 +35,7 @@ export { useGridRowsMeta, rowsMetaStateInitializer } from '../hooks/features/row
 export { useGridParamsApi } from '../hooks/features/rows/useGridParamsApi';
 export { getRowIdFromRowModel } from '../hooks/features/rows/gridRowsUtils';
 export { gridAdditionalRowGroupsSelector, gridPinnedRowsSelector } from '../hooks/features/rows/gridRowsSelector';
+export { headerFilteringStateInitializer, useGridHeaderFiltering } from '../hooks/features/headerFiltering/useGridHeaderFiltering';
 export { calculatePinnedRowsHeight } from '../hooks/features/rows/gridRowsUtils';
 export { useGridRowSelection, rowSelectionStateInitializer } from '../hooks/features/rowSelection/useGridRowSelection';
 export { useGridRowSelectionPreProcessors } from '../hooks/features/rowSelection/useGridRowSelectionPreProcessors';

package/legacy/internals/utils/index.js

@@ -1,2 +1,3 @@
 export * from './computeSlots';
-export * from './slotsMigration';
+export * from './slotsMigration';
+export * from './useProps';

package/legacy/internals/utils/useProps.js

@@ -0,0 +1,33 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["components", "componentsProps"];
+import * as React from 'react';
+/** Gathers props for the root element into a single `.forwardedProps` field */
+function groupForwardedProps(props) {
+  var _props$forwardedProps;
+  var keys = Object.keys(props);
+  if (!keys.some(function (key) {
+    return key.startsWith('aria-') || key.startsWith('data-');
+  })) {
+    return props;
+  }
+  var newProps = {};
+  var forwardedProps = (_props$forwardedProps = props.forwardedProps) != null ? _props$forwardedProps : {};
+  for (var i = 0; i < keys.length; i += 1) {
+    var _key = keys[i];
+    if (_key.startsWith('aria-') || _key.startsWith('data-')) {
+      forwardedProps[_key] = props[_key];
+    } else {
+      newProps[_key] = props[_key];
+    }
+  }
+  newProps.forwardedProps = forwardedProps;
+  return newProps;
+}
+export function useProps(allProps) {
+  return React.useMemo(function () {
+    var components = allProps.components,
+      componentsProps = allProps.componentsProps,
+      themedProps = _objectWithoutProperties(allProps, _excluded);
+    return [components, componentsProps, groupForwardedProps(themedProps)];
+  }, [allProps]);
+}