@mui/x-data-grid 6.7.0 → 6.9.0

package/legacy/hooks/features/filter/gridFilterUtils.js

@@ -208,30 +208,32 @@ export var buildAggregatedFilterApplier = function buildAggregatedFilterApplier(
     };
   };
 };
-export var passFilterLogic = function passFilterLogic(allFilterItemResults, allQuickFilterResults, filterModel, apiRef) {
-  var _filterModel$quickFil2, _filterModel$logicOpe;
-  var cleanedFilterItems = filterModel.items.filter(function (item) {
-    return getFilterCallbackFromItem(item, apiRef) !== null;
-  });
-  var cleanedAllFilterItemResults = allFilterItemResults.filter(function (result) {
-    return result != null;
-  });
-  var cleanedAllQuickFilterResults = allQuickFilterResults.filter(function (result) {
-    return result != null;
-  });
-
-  // Defaultize operators
-  var quickFilterLogicOperator = (_filterModel$quickFil2 = filterModel.quickFilterLogicOperator) != null ? _filterModel$quickFil2 : getDefaultGridFilterModel().quickFilterLogicOperator;
-  var logicOperator = (_filterModel$logicOpe = filterModel.logicOperator) != null ? _filterModel$logicOpe : getDefaultGridFilterModel().logicOperator;
+var isNotNull = function isNotNull(result) {
+  return result != null;
+};
+var filterModelItems = function filterModelItems(cache, apiRef, items) {
+  if (!cache.cleanedFilterItems) {
+    cache.cleanedFilterItems = items.filter(function (item) {
+      return getFilterCallbackFromItem(item, apiRef) !== null;
+    });
+  }
+  return cache.cleanedFilterItems;
+};
+export var passFilterLogic = function passFilterLogic(allFilterItemResults, allQuickFilterResults, filterModel, apiRef, cache) {
+  var cleanedFilterItems = filterModelItems(cache, apiRef, filterModel.items);
+  var cleanedFilterItemResults = allFilterItemResults.filter(isNotNull);
+  var cleanedQuickFilterResults = allQuickFilterResults.filter(isNotNull);
 
   // get result for filter items model
-  if (cleanedAllFilterItemResults.length > 0) {
+  if (cleanedFilterItemResults.length > 0) {
+    var _filterModel$logicOpe;
     // Return true if the item pass with one of the rows
     var filterItemPredicate = function filterItemPredicate(item) {
-      return cleanedAllFilterItemResults.some(function (filterItemResult) {
+      return cleanedFilterItemResults.some(function (filterItemResult) {
         return filterItemResult[item.id];
       });
     };
+    var logicOperator = (_filterModel$logicOpe = filterModel.logicOperator) != null ? _filterModel$logicOpe : getDefaultGridFilterModel().logicOperator;
     if (logicOperator === GridLogicOperator.And) {
       var passesAllFilters = cleanedFilterItems.every(filterItemPredicate);
       if (!passesAllFilters) {
@@ -246,13 +248,15 @@ export var passFilterLogic = function passFilterLogic(allFilterItemResults, allQ
   }
 
   // get result for quick filter model
-  if (cleanedAllQuickFilterResults.length > 0 && filterModel.quickFilterValues != null) {
+  if (cleanedQuickFilterResults.length > 0 && filterModel.quickFilterValues != null) {
+    var _filterModel$quickFil2;
     // Return true if the item pass with one of the rows
     var quickFilterValuePredicate = function quickFilterValuePredicate(value) {
-      return cleanedAllQuickFilterResults.some(function (quickFilterValueResult) {
+      return cleanedQuickFilterResults.some(function (quickFilterValueResult) {
         return quickFilterValueResult[value];
       });
     };
+    var quickFilterLogicOperator = (_filterModel$quickFil2 = filterModel.quickFilterLogicOperator) != null ? _filterModel$quickFil2 : getDefaultGridFilterModel().quickFilterLogicOperator;
     if (quickFilterLogicOperator === GridLogicOperator.And) {
       var passesAllQuickFilterValues = filterModel.quickFilterValues.every(quickFilterValuePredicate);
       if (!passesAllQuickFilterValues) {

package/legacy/hooks/features/filter/useGridFilter.js

@@ -272,6 +272,7 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
       var tree = gridRowTreeSelector(apiRef);
       var rowIds = tree[GRID_ROOT_GROUP_ID].children;
       var filteredRowsLookup = {};
+      var filterCache = {};
       for (var i = 0; i < rowIds.length; i += 1) {
         var rowId = rowIds[i];
         var isRowPassing = void 0;
@@ -281,7 +282,7 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
           var _params$isRowMatching = params.isRowMatchingFilters(rowId),
             passingFilterItems = _params$isRowMatching.passingFilterItems,
             passingQuickFilterValues = _params$isRowMatching.passingQuickFilterValues;
-          isRowPassing = passFilterLogic([passingFilterItems], [passingQuickFilterValues], params.filterModel, apiRef);
+          isRowPassing = passFilterLogic([passingFilterItems], [passingQuickFilterValues], params.filterModel, apiRef, filterCache);
         }
         filteredRowsLookup[rowId] = isRowPassing;
       }

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

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_ownerDocument as ownerDocument } from '@mui/utils';
+import { gridClasses } from '../../../constants/gridClasses';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
 import { useGridLogger } from '../../utils/useGridLogger';
 import { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';
@@ -243,20 +244,24 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
     }
     apiRef.current.setColumnHeaderFocus(field, event);
   }, [apiRef]);
-  var focussedColumnGroup = unstable_gridFocusColumnGroupHeaderSelector(apiRef);
   var handleColumnGroupHeaderFocus = React.useCallback(function (_ref3, event) {
     var fields = _ref3.fields,
       depth = _ref3.depth;
     if (event.target !== event.currentTarget) {
       return;
     }
-    if (focussedColumnGroup !== null && focussedColumnGroup.depth === depth && fields.includes(focussedColumnGroup.field)) {
+    var focusedColumnGroup = unstable_gridFocusColumnGroupHeaderSelector(apiRef);
+    if (focusedColumnGroup !== null && focusedColumnGroup.depth === depth && fields.includes(focusedColumnGroup.field)) {
       // This group cell has already been focused
       return;
     }
     apiRef.current.setColumnGroupHeaderFocus(fields[0], depth, event);
-  }, [apiRef, focussedColumnGroup]);
-  var handleBlur = React.useCallback(function () {
+  }, [apiRef]);
+  var handleBlur = React.useCallback(function (_, event) {
+    var _event$relatedTarget;
+    if ((_event$relatedTarget = event.relatedTarget) != null && _event$relatedTarget.className.includes(gridClasses.columnHeader)) {
+      return;
+    }
     logger.debug("Clearing focus");
     apiRef.current.setState(function (state) {
       return _extends({}, state, {

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

@@ -14,7 +14,6 @@ import { GRID_DETAIL_PANEL_TOGGLE_FIELD } from '../../../constants/gridDetailPan
 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) {
@@ -324,12 +323,12 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
       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();
     if (!dimensions) {
       return;
     }
+    var focusedColumnGroup = unstable_gridFocusColumnGroupHeaderSelector(apiRef);
     if (focusedColumnGroup === null) {
       return;
     }
@@ -409,7 +408,7 @@ export var useGridKeyboardNavigation = function useGridKeyboardNavigation(apiRef
     if (shouldPreventDefault) {
       event.preventDefault();
     }
-  }, [apiRef, focusedColumnGroup, currentPageRows.length, goToHeader, goToGroupHeader, goToCell, getRowIdFromIndex]);
+  }, [apiRef, currentPageRows.length, goToHeader, goToGroupHeader, goToCell, getRowIdFromIndex]);
   var handleCellKeyDown = React.useCallback(function (params, event) {
     // Ignore portal
     if (!event.currentTarget.contains(event.target)) {

package/legacy/hooks/features/pagination/gridPaginationSelector.js

@@ -1,4 +1,4 @@
-import { createSelector } from '../../../utils/createSelector';
+import { createSelector, createSelectorMemoized } from '../../../utils/createSelector';
 import { gridFilteredTopLevelRowCountSelector, gridExpandedSortedRowEntriesSelector, gridExpandedSortedRowIdsSelector, gridFilteredSortedTopLevelRowEntriesSelector } from '../filter/gridFilterSelector';
 import { gridRowMaximumTreeDepthSelector, gridRowTreeSelector } from '../rows/gridRowsSelector';
 import { getPageCount } from './gridPaginationUtils';
@@ -47,7 +47,7 @@ export var gridPageCountSelector = createSelector(gridPaginationModelSelector, g
  * Get the index of the first and the last row to include in the current page if the pagination is enabled.
  * @category Pagination
  */
-export var gridPaginationRowRangeSelector = createSelector(gridPaginationModelSelector, gridRowTreeSelector, gridRowMaximumTreeDepthSelector, gridExpandedSortedRowEntriesSelector, gridFilteredSortedTopLevelRowEntriesSelector, function (paginationModel, rowTree, rowTreeDepth, visibleSortedRowEntries, visibleSortedTopLevelRowEntries) {
+export var gridPaginationRowRangeSelector = createSelectorMemoized(gridPaginationModelSelector, gridRowTreeSelector, gridRowMaximumTreeDepthSelector, gridExpandedSortedRowEntriesSelector, gridFilteredSortedTopLevelRowEntriesSelector, function (paginationModel, rowTree, rowTreeDepth, visibleSortedRowEntries, visibleSortedTopLevelRowEntries) {
   var visibleTopLevelRowCount = visibleSortedTopLevelRowEntries.length;
   var topLevelFirstRowIndex = Math.min(paginationModel.pageSize * paginationModel.page, visibleTopLevelRowCount - 1);
   var topLevelLastRowIndex = Math.min(topLevelFirstRowIndex + paginationModel.pageSize - 1, visibleTopLevelRowCount - 1);
@@ -91,7 +91,7 @@ export var gridPaginationRowRangeSelector = createSelector(gridPaginationModelSe
  * Get the id and the model of each row to include in the current page if the pagination is enabled.
  * @category Pagination
  */
-export var gridPaginatedVisibleSortedGridRowEntriesSelector = createSelector(gridExpandedSortedRowEntriesSelector, gridPaginationRowRangeSelector, function (visibleSortedRowEntries, paginationRange) {
+export var gridPaginatedVisibleSortedGridRowEntriesSelector = createSelectorMemoized(gridExpandedSortedRowEntriesSelector, gridPaginationRowRangeSelector, function (visibleSortedRowEntries, paginationRange) {
   if (!paginationRange) {
     return [];
   }
@@ -102,7 +102,7 @@ export var gridPaginatedVisibleSortedGridRowEntriesSelector = createSelector(gri
  * Get the id of each row to include in the current page if the pagination is enabled.
  * @category Pagination
  */
-export var gridPaginatedVisibleSortedGridRowIdsSelector = createSelector(gridExpandedSortedRowIdsSelector, gridPaginationRowRangeSelector, function (visibleSortedRowIds, paginationRange) {
+export var gridPaginatedVisibleSortedGridRowIdsSelector = createSelectorMemoized(gridExpandedSortedRowIdsSelector, gridPaginationRowRangeSelector, function (visibleSortedRowIds, paginationRange) {
   if (!paginationRange) {
     return [];
   }

package/legacy/hooks/features/rowSelection/gridRowSelectionSelector.js

@@ -1,4 +1,4 @@
-import { createSelector } from '../../../utils/createSelector';
+import { createSelector, createSelectorMemoized } from '../../../utils/createSelector';
 import { gridRowsLookupSelector } from '../rows/gridRowsSelector';
 export var gridRowSelectionStateSelector = function gridRowSelectionStateSelector(state) {
   return state.rowSelection;
@@ -6,12 +6,12 @@ export var gridRowSelectionStateSelector = function gridRowSelectionStateSelecto
 export var selectedGridRowsCountSelector = createSelector(gridRowSelectionStateSelector, function (selection) {
   return selection.length;
 });
-export var selectedGridRowsSelector = createSelector(gridRowSelectionStateSelector, gridRowsLookupSelector, function (selectedRows, rowsLookup) {
+export var selectedGridRowsSelector = createSelectorMemoized(gridRowSelectionStateSelector, gridRowsLookupSelector, function (selectedRows, rowsLookup) {
   return new Map(selectedRows.map(function (id) {
     return [id, rowsLookup[id]];
   }));
 });
-export var selectedIdsLookupSelector = createSelector(gridRowSelectionStateSelector, function (selection) {
+export var selectedIdsLookupSelector = createSelectorMemoized(gridRowSelectionStateSelector, function (selection) {
   return selection.reduce(function (lookup, rowId) {
     lookup[rowId] = rowId;
     return lookup;

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

@@ -1,5 +1,5 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { createSelector } from '../../../utils/createSelector';
+import { createSelector, createSelectorMemoized } from '../../../utils/createSelector';
 var gridRowsStateSelector = function gridRowsStateSelector(state) {
   return state.rows;
 };
@@ -29,7 +29,7 @@ export var gridRowGroupingNameSelector = createSelector(gridRowsStateSelector, f
 export var gridRowTreeDepthsSelector = createSelector(gridRowsStateSelector, function (rows) {
   return rows.treeDepths;
 });
-export var gridRowMaximumTreeDepthSelector = createSelector(gridRowsStateSelector, function (rows) {
+export var gridRowMaximumTreeDepthSelector = createSelectorMemoized(gridRowsStateSelector, function (rows) {
   var entries = Object.entries(rows.treeDepths);
   if (entries.length === 0) {
     return 1;
@@ -60,7 +60,7 @@ export var gridAdditionalRowGroupsSelector = createSelector(gridRowsStateSelecto
 /**
  * @ignore - do not document.
  */
-export var gridPinnedRowsSelector = createSelector(gridAdditionalRowGroupsSelector, function (additionalRowGroups) {
+export var gridPinnedRowsSelector = createSelectorMemoized(gridAdditionalRowGroupsSelector, function (additionalRowGroups) {
   var _rawPinnedRows$bottom, _rawPinnedRows$top;
   var rawPinnedRows = additionalRowGroups == null ? void 0 : additionalRowGroups.pinnedRows;
   return {

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

@@ -1,12 +1,24 @@
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
+import _wrapNativeSuper from "@babel/runtime/helpers/esm/wrapNativeSuper";
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 import * as React from 'react';
 import { getGridCellElement, getGridColumnHeaderElement, getGridRowElement } from '../../../utils/domUtils';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
 import { gridFocusCellSelector, gridTabIndexCellSelector } from '../focus/gridFocusStateSelector';
-var warnedOnceMissingColumn = false;
-function warnMissingColumn(field) {
-  console.warn(["MUI: You are calling getValue('".concat(field, "') but the column `").concat(field, "` is not defined."), "Instead, you can access the data from `params.row.".concat(field, "`.")].join('\n'));
-  warnedOnceMissingColumn = true;
-}
+export var MissingRowIdError = /*#__PURE__*/function (_Error) {
+  _inherits(MissingRowIdError, _Error);
+  var _super = _createSuper(MissingRowIdError);
+  function MissingRowIdError() {
+    _classCallCheck(this, MissingRowIdError);
+    return _super.apply(this, arguments);
+  }
+  return _createClass(MissingRowIdError);
+}( /*#__PURE__*/_wrapNativeSuper(Error));
 
 /**
  * @requires useGridColumns (method)
@@ -26,7 +38,7 @@ export function useGridParamsApi(apiRef) {
   var getRowParams = React.useCallback(function (id) {
     var row = apiRef.current.getRow(id);
     if (!row) {
-      throw new Error("No row with id #".concat(id, " found"));
+      throw new MissingRowIdError("No row with id #".concat(id, " found"));
     }
     var params = {
       id: id,
@@ -39,7 +51,7 @@ export function useGridParamsApi(apiRef) {
     var row = apiRef.current.getRow(id);
     var rowNode = apiRef.current.getRowNode(id);
     if (!row || !rowNode) {
-      throw new Error("No row with id #".concat(id, " found"));
+      throw new MissingRowIdError("No row with id #".concat(id, " found"));
     }
     var cellFocus = gridFocusCellSelector(apiRef);
     var cellTabIndex = gridTabIndexCellSelector(apiRef);
@@ -63,7 +75,7 @@ export function useGridParamsApi(apiRef) {
     var row = apiRef.current.getRow(id);
     var rowNode = apiRef.current.getRowNode(id);
     if (!row || !rowNode) {
-      throw new Error("No row with id #".concat(id, " found"));
+      throw new MissingRowIdError("No row with id #".concat(id, " found"));
     }
     var cellFocus = gridFocusCellSelector(apiRef);
     var cellTabIndex = gridTabIndexCellSelector(apiRef);
@@ -77,7 +89,8 @@ export function useGridParamsApi(apiRef) {
       hasFocus: cellFocus !== null && cellFocus.field === field && cellFocus.id === id,
       tabIndex: cellTabIndex && cellTabIndex.field === field && cellTabIndex.id === id ? 0 : -1,
       value: value,
-      formattedValue: value
+      formattedValue: value,
+      isEditable: false
     };
     if (colDef && colDef.valueFormatter) {
       params.formattedValue = colDef.valueFormatter({
@@ -92,15 +105,10 @@ export function useGridParamsApi(apiRef) {
   }, [apiRef]);
   var getCellValue = React.useCallback(function (id, field) {
     var colDef = apiRef.current.getColumn(field);
-    if (process.env.NODE_ENV !== 'production') {
-      if (!colDef && !warnedOnceMissingColumn) {
-        warnMissingColumn(field);
-      }
-    }
     if (!colDef || !colDef.valueGetter) {
       var rowModel = apiRef.current.getRow(id);
       if (!rowModel) {
-        throw new Error("No row with id #".concat(id, " found"));
+        throw new MissingRowIdError("No row with id #".concat(id, " found"));
       }
       return rowModel[field];
     }

package/legacy/hooks/features/sorting/gridSortingSelector.js

@@ -1,4 +1,4 @@
-import { createSelector } from '../../../utils/createSelector';
+import { createSelector, createSelectorMemoized } from '../../../utils/createSelector';
 import { gridRowsLookupSelector } from '../rows/gridRowsSelector';
 
 /**
@@ -21,7 +21,7 @@ export var gridSortedRowIdsSelector = createSelector(gridSortingStateSelector, f
  * Get the id and the model of the rows after the sorting process.
  * @category Sorting
  */
-export var gridSortedRowEntriesSelector = createSelector(gridSortedRowIdsSelector, gridRowsLookupSelector,
+export var gridSortedRowEntriesSelector = createSelectorMemoized(gridSortedRowIdsSelector, gridRowsLookupSelector,
 // TODO rows v6: Is this the best approach ?
 function (sortedIds, idRowsLookup) {
   return sortedIds.map(function (id) {
@@ -44,7 +44,7 @@ export var gridSortModelSelector = createSelector(gridSortingStateSelector, func
  * @category Sorting
  * @ignore - do not document.
  */
-export var gridSortColumnLookupSelector = createSelector(gridSortModelSelector, function (sortModel) {
+export var gridSortColumnLookupSelector = createSelectorMemoized(gridSortModelSelector, function (sortModel) {
   var result = sortModel.reduce(function (res, sortItem, index) {
     res[sortItem.field] = {
       sortDirection: sortItem.sort,

package/legacy/hooks/features/virtualization/useGridVirtualScroller.js

@@ -2,11 +2,10 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 var _excluded = ["style"],
-  _excluded2 = ["style"],
-  _excluded3 = ["style"];
+  _excluded2 = ["style"];
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { unstable_useForkRef as useForkRef, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import { unstable_useForkRef as useForkRef, unstable_useEnhancedEffect as useEnhancedEffect, unstable_useEventCallback as useEventCallback } from '@mui/utils';
 import { useTheme } from '@mui/material/styles';
 import { defaultMemoize } from 'reselect';
 import { useGridPrivateApiContext } from '../../utils/useGridPrivateApiContext';
@@ -52,12 +51,17 @@ export var getRenderableIndexes = function getRenderableIndexes(_ref) {
     maxLastIndex = _ref.maxLastIndex;
   return [clamp(firstIndex - buffer, minFirstIndex, maxLastIndex), clamp(lastIndex + buffer, minFirstIndex, maxLastIndex)];
 };
-var areRenderContextsEqual = function areRenderContextsEqual(context1, context2) {
+export var areRenderContextsEqual = function areRenderContextsEqual(context1, context2) {
   if (context1 === context2) {
     return true;
   }
   return context1.firstRowIndex === context2.firstRowIndex && context1.lastRowIndex === context2.lastRowIndex && context1.firstColumnIndex === context2.firstColumnIndex && context1.lastColumnIndex === context2.lastColumnIndex;
 };
+// The `maxSize` is 3 so that reselect caches the `renderedColumns` values for the pinned left,
+// unpinned, and pinned right sections.
+var MEMOIZE_OPTIONS = {
+  maxSize: 3
+};
 export var useGridVirtualScroller = function useGridVirtualScroller(props) {
   var _currentPage$range3, _currentPage$range4;
   var apiRef = useGridPrivateApiContext();
@@ -104,7 +108,7 @@ export var useGridVirtualScroller = function useGridVirtualScroller(props) {
   var prevRootRowStyle = React.useRef();
   var getRenderedColumnsRef = React.useRef(defaultMemoize(function (columns, firstColumnToRender, lastColumnToRender) {
     return columns.slice(firstColumnToRender, lastColumnToRender);
-  }));
+  }, MEMOIZE_OPTIONS));
   var getNearestIndexToRender = React.useCallback(function (offset) {
     var _currentPage$range, _currentPage$range2;
     var lastMeasuredIndexRelativeToAllRows = apiRef.current.getLastMeasuredRowIndex();
@@ -272,7 +276,7 @@ export var useGridVirtualScroller = function useGridVirtualScroller(props) {
     };
     apiRef.current.publishEvent('scrollPositionChange', params);
   }, [apiRef, computeRenderContext, containerDimensions.width, updateRenderContext]);
-  var handleScroll = function handleScroll(event) {
+  var handleScroll = useEventCallback(function (event) {
     var _event$currentTarget = event.currentTarget,
       scrollTop = _event$currentTarget.scrollTop,
       scrollLeft = _event$currentTarget.scrollLeft;
@@ -313,13 +317,13 @@ export var useGridVirtualScroller = function useGridVirtualScroller(props) {
       });
       prevTotalWidth.current = columnsTotalWidth;
     }
-  };
-  var handleWheel = function handleWheel(event) {
+  });
+  var handleWheel = useEventCallback(function (event) {
     apiRef.current.publishEvent('virtualScrollerWheel', {}, event);
-  };
-  var handleTouchMove = function handleTouchMove(event) {
+  });
+  var handleTouchMove = useEventCallback(function (event) {
     apiRef.current.publishEvent('virtualScrollerTouchMove', {}, event);
-  };
+  });
   var getRows = function getRows() {
     var _rootProps$slotProps;
     var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
@@ -471,22 +475,25 @@ export var useGridVirtualScroller = function useGridVirtualScroller(props) {
       height: height,
       minHeight: shouldExtendContent ? '100%' : 'auto'
     };
+    if (rootProps.autoHeight && currentPage.rows.length === 0) {
+      size.height = getMinimalContentHeight(apiRef, rootProps.rowHeight); // Give room to show the overlay when there no rows.
+    }
+
     return size;
-  }, [rootRef, columnsTotalWidth, rowsMeta.currentPageTotalHeight, needsHorizontalScrollbar]);
+  }, [apiRef, rootRef, columnsTotalWidth, rowsMeta.currentPageTotalHeight, needsHorizontalScrollbar, rootProps.autoHeight, rootProps.rowHeight, currentPage.rows.length]);
   React.useEffect(function () {
     apiRef.current.publishEvent('virtualScrollerContentSizeChange');
   }, [apiRef, contentSize]);
-  if (rootProps.autoHeight && currentPage.rows.length === 0) {
-    contentSize.height = getMinimalContentHeight(apiRef, rootProps.rowHeight); // Give room to show the overlay when there no rows.
-  }
-
-  var rootStyle = {};
-  if (!needsHorizontalScrollbar) {
-    rootStyle.overflowX = 'hidden';
-  }
-  if (rootProps.autoHeight) {
-    rootStyle.overflowY = 'hidden';
-  }
+  var rootStyle = React.useMemo(function () {
+    var style = {};
+    if (!needsHorizontalScrollbar) {
+      style.overflowX = 'hidden';
+    }
+    if (rootProps.autoHeight) {
+      style.overflowY = 'hidden';
+    }
+    return style;
+  }, [needsHorizontalScrollbar, rootProps.autoHeight]);
   var getRenderContext = React.useCallback(function () {
     return prevRenderContext.current;
   }, []);
@@ -498,24 +505,21 @@ export var useGridVirtualScroller = function useGridVirtualScroller(props) {
     updateRenderZonePosition: updateRenderZonePosition,
     getRows: getRows,
     getRootProps: function getRootProps() {
-      var _ref6 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      var _ref6$style = _ref6.style,
-        style = _ref6$style === void 0 ? {} : _ref6$style,
-        other = _objectWithoutProperties(_ref6, _excluded3);
+      var inputProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       return _extends({
         ref: handleRef,
         onScroll: handleScroll,
         onWheel: handleWheel,
-        onTouchMove: handleTouchMove,
-        style: _extends({}, style, rootStyle)
-      }, other);
+        onTouchMove: handleTouchMove
+      }, inputProps, {
+        style: inputProps.style ? _extends({}, inputProps.style, rootStyle) : rootStyle
+      });
     },
     getContentProps: function getContentProps() {
-      var _ref7 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-        _ref7$style = _ref7.style,
-        style = _ref7$style === void 0 ? {} : _ref7$style;
+      var _ref6 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+        style = _ref6.style;
       return {
-        style: _extends({}, style, contentSize)
+        style: style ? _extends({}, style, contentSize) : contentSize
       };
     },
     getRenderZoneProps: function getRenderZoneProps() {

package/legacy/hooks/utils/index.js

@@ -1,6 +1,6 @@
 export * from './useGridApiEventHandler';
 export * from './useGridApiMethod';
 export * from './useGridLogger';
-export * from './useGridSelector';
+export { useGridSelector } from './useGridSelector';
 export * from './useGridNativeEventListener';
 export * from './useFirstRender';

package/legacy/hooks/utils/useGridSelector.js

@@ -1,16 +1,54 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { useLazyRef } from './useLazyRef';
+import { useOnMount } from './useOnMount';
 import { buildWarning } from '../../utils/warning';
+import { fastObjectShallowCompare } from '../../utils/fastObjectShallowCompare';
+var stateNotInitializedWarning = buildWarning(['MUI: `useGridSelector` has been called before the initialization of the state.', 'This hook can only be used inside the context of the grid.']);
 function isOutputSelector(selector) {
   return selector.acceptsApiRef;
 }
-var stateNotInitializedWarning = buildWarning(['MUI: `useGridSelector` has been called before the initialization of the state.', 'This hook can only be used inside the context of the grid.']);
+function applySelector(apiRef, selector) {
+  if (isOutputSelector(selector)) {
+    return selector(apiRef);
+  }
+  return selector(apiRef.current.state);
+}
+var defaultCompare = Object.is;
+export var objectShallowCompare = fastObjectShallowCompare;
+var createRefs = function createRefs() {
+  return {
+    state: null,
+    equals: null,
+    selector: null
+  };
+};
 export var useGridSelector = function useGridSelector(apiRef, selector) {
+  var equals = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultCompare;
   if (process.env.NODE_ENV !== 'production') {
     if (!apiRef.current.state) {
       stateNotInitializedWarning();
     }
   }
-  if (isOutputSelector(selector)) {
-    return selector(apiRef);
-  }
-  return selector(apiRef.current.state);
+  var refs = useLazyRef(createRefs);
+  var didInit = refs.current.selector !== null;
+  var _React$useState = React.useState(
+    // We don't use an initialization function to avoid allocations
+    didInit ? null : applySelector(apiRef, selector)),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    state = _React$useState2[0],
+    setState = _React$useState2[1];
+  refs.current.state = state;
+  refs.current.equals = equals;
+  refs.current.selector = selector;
+  useOnMount(function () {
+    return apiRef.current.store.subscribe(function () {
+      var newState = applySelector(apiRef, refs.current.selector);
+      if (!refs.current.equals(refs.current.state, newState)) {
+        refs.current.state = newState;
+        setState(newState);
+      }
+    });
+  });
+  return state;
 };

package/legacy/hooks/utils/useLazyRef.js

@@ -0,0 +1,9 @@
+import * as React from 'react';
+var UNINITIALIZED = {};
+export function useLazyRef(init, initArg) {
+  var ref = React.useRef(UNINITIALIZED);
+  if (ref.current === UNINITIALIZED) {
+    ref.current = init(initArg);
+  }
+  return ref;
+}

package/legacy/hooks/utils/useOnMount.js

@@ -0,0 +1,7 @@
+import * as React from 'react';
+var EMPTY = [];
+export function useOnMount(fn) {
+  /* eslint-disable react-hooks/exhaustive-deps */
+  React.useEffect(fn, EMPTY);
+  /* eslint-enable react-hooks/exhaustive-deps */
+}

package/legacy/index.js

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

package/legacy/internals/index.js

@@ -48,7 +48,7 @@ export { useGridVirtualScroller, getRenderableIndexes } from '../hooks/features/
 export { useGridVisibleRows, getVisibleRows } from '../hooks/utils/useGridVisibleRows';
 export { useGridInitializeState } from '../hooks/utils/useGridInitializeState';
 export { getColumnsToExport, defaultGetRowsToExport } from '../hooks/features/export/utils';
-export { createSelector, unstable_resetCreateSelectorCache } from '../utils/createSelector';
+export { createSelector, createSelectorMemoized, unstable_resetCreateSelectorCache } from '../utils/createSelector';
 export { findParentElementFromClassName, getActiveElement } from '../utils/domUtils';
 export { isNavigationKey } from '../utils/keyboardUtils';
 export { clamp, isDeepEqual, isNumber, isFunction, isObject } from '../utils/utils';