@mui/x-data-grid 6.10.0 → 6.10.1

package/hooks/features/rows/gridRowsUtils.js

@@ -264,11 +264,11 @@ export const updateCacheWithNewRows = ({
 export function calculatePinnedRowsHeight(apiRef) {
   var _pinnedRows$top, _pinnedRows$bottom;
   const pinnedRows = gridPinnedRowsSelector(apiRef);
-  const topPinnedRowsHeight = (pinnedRows == null ? void 0 : (_pinnedRows$top = pinnedRows.top) == null ? void 0 : _pinnedRows$top.reduce((acc, value) => {
+  const topPinnedRowsHeight = (pinnedRows == null || (_pinnedRows$top = pinnedRows.top) == null ? void 0 : _pinnedRows$top.reduce((acc, value) => {
     acc += apiRef.current.unstable_getRowHeight(value.id);
     return acc;
   }, 0)) || 0;
-  const bottomPinnedRowsHeight = (pinnedRows == null ? void 0 : (_pinnedRows$bottom = pinnedRows.bottom) == null ? void 0 : _pinnedRows$bottom.reduce((acc, value) => {
+  const bottomPinnedRowsHeight = (pinnedRows == null || (_pinnedRows$bottom = pinnedRows.bottom) == null ? void 0 : _pinnedRows$bottom.reduce((acc, value) => {
     acc += apiRef.current.unstable_getRowHeight(value.id);
     return acc;
   }, 0)) || 0;

package/hooks/features/rows/useGridRowsMeta.js

@@ -145,10 +145,10 @@ export const useGridRowsMeta = (apiRef, props) => {
       }
       return acc + maximumBaseSize + otherSizes;
     }, 0);
-    pinnedRows == null ? void 0 : (_pinnedRows$top = pinnedRows.top) == null ? void 0 : _pinnedRows$top.forEach(row => {
+    pinnedRows == null || (_pinnedRows$top = pinnedRows.top) == null ? void 0 : _pinnedRows$top.forEach(row => {
       calculateRowProcessedSizes(row);
     });
-    pinnedRows == null ? void 0 : (_pinnedRows$bottom = pinnedRows.bottom) == null ? void 0 : _pinnedRows$bottom.forEach(row => {
+    pinnedRows == null || (_pinnedRows$bottom = pinnedRows.bottom) == null ? void 0 : _pinnedRows$bottom.forEach(row => {
       calculateRowProcessedSizes(row);
     });
     apiRef.current.setState(state => {

package/hooks/features/sorting/useGridSorting.js

@@ -14,8 +14,8 @@ import { buildAggregatedSortingApplier, mergeStateWithSortModel, getNextGridSort
 import { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';
 import { getTreeNodeDescendants } from '../rows/gridRowsUtils';
 export const sortingStateInitializer = (state, props) => {
-  var _ref, _props$sortModel, _props$initialState, _props$initialState$s;
-  const sortModel = (_ref = (_props$sortModel = props.sortModel) != null ? _props$sortModel : (_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$s = _props$initialState.sorting) == null ? void 0 : _props$initialState$s.sortModel) != null ? _ref : [];
+  var _ref, _props$sortModel, _props$initialState;
+  const sortModel = (_ref = (_props$sortModel = props.sortModel) != null ? _props$sortModel : (_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.sorting) == null ? void 0 : _props$initialState.sortModel) != null ? _ref : [];
   return _extends({}, state, {
     sorting: {
       sortModel: sanitizeSortModel(sortModel, props.disableMultipleColumnsSorting),
@@ -29,7 +29,7 @@ export const sortingStateInitializer = (state, props) => {
  * @requires useGridColumns (event)
  */
 export const useGridSorting = (apiRef, props) => {
-  var _props$initialState3, _props$initialState3$;
+  var _props$initialState3;
   const logger = useGridLogger(apiRef, 'useGridSorting');
   apiRef.current.registerControlState({
     stateId: 'sortModel',
@@ -151,7 +151,7 @@ export const useGridSorting = (apiRef, props) => {
    * PRE-PROCESSING
    */
   const stateExportPreProcessing = React.useCallback((prevState, context) => {
-    var _props$initialState2, _props$initialState2$;
+    var _props$initialState2;
     const sortModelToExport = gridSortModelSelector(apiRef);
     const shouldExportSortModel =
     // Always export if the `exportOnlyDirtyModels` property is not activated
@@ -159,7 +159,7 @@ export const useGridSorting = (apiRef, props) => {
     // Always export if the model is controlled
     props.sortModel != null ||
     // Always export if the model has been initialized
-    ((_props$initialState2 = props.initialState) == null ? void 0 : (_props$initialState2$ = _props$initialState2.sorting) == null ? void 0 : _props$initialState2$.sortModel) != null ||
+    ((_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.sorting) == null ? void 0 : _props$initialState2.sortModel) != null ||
     // Export if the model is not empty
     sortModelToExport.length > 0;
     if (!shouldExportSortModel) {
@@ -170,7 +170,7 @@ export const useGridSorting = (apiRef, props) => {
         sortModel: sortModelToExport
       }
     });
-  }, [apiRef, props.sortModel, (_props$initialState3 = props.initialState) == null ? void 0 : (_props$initialState3$ = _props$initialState3.sorting) == null ? void 0 : _props$initialState3$.sortModel]);
+  }, [apiRef, props.sortModel, (_props$initialState3 = props.initialState) == null || (_props$initialState3 = _props$initialState3.sorting) == null ? void 0 : _props$initialState3.sortModel]);
   const stateRestorePreProcessing = React.useCallback((params, context) => {
     var _context$stateToResto;
     const sortModel = (_context$stateToResto = context.stateToRestore.sorting) == null ? void 0 : _context$stateToResto.sortModel;

package/hooks/features/virtualization/useGridVirtualScroller.js

@@ -427,7 +427,7 @@ export const useGridVirtualScroller = props => {
         firstColumnToRender: firstColumnToRender,
         lastColumnToRender: lastColumnToRender,
         selected: isSelected,
-        index: rowIndexOffset + ((currentPage == null ? void 0 : (_currentPage$range5 = currentPage.range) == null ? void 0 : _currentPage$range5.firstRowIndex) || 0) + firstRowToRender + i,
+        index: rowIndexOffset + ((currentPage == null || (_currentPage$range5 = currentPage.range) == null ? void 0 : _currentPage$range5.firstRowIndex) || 0) + firstRowToRender + i,
         containerWidth: availableSpace,
         isLastVisible: lastVisibleRowIndex,
         position: position

package/index.js

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

package/joy/joySlots.js

@@ -94,7 +94,7 @@ const TextField = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
     } = _ref2,
     props = _objectWithoutPropertiesLoose(_ref2, _excluded2);
   const rootRef = useForkRef(ref, (_props$InputProps = props.InputProps) == null ? void 0 : _props$InputProps.ref);
-  const inputForkRef = useForkRef(inputRef, props == null ? void 0 : (_props$inputProps = props.inputProps) == null ? void 0 : _props$inputProps.ref);
+  const inputForkRef = useForkRef(inputRef, props == null || (_props$inputProps = props.inputProps) == null ? void 0 : _props$inputProps.ref);
   const {
     startAdornment,
     endAdornment
@@ -234,7 +234,7 @@ const Select = /*#__PURE__*/React.forwardRef((_ref6, ref) => {
         onOpen == null ? void 0 : onOpen({});
       } else {
         var _MenuProps$onClose;
-        MenuProps == null ? void 0 : (_MenuProps$onClose = MenuProps.onClose) == null ? void 0 : _MenuProps$onClose.call(MenuProps, {}, undefined);
+        MenuProps == null || (_MenuProps$onClose = MenuProps.onClose) == null ? void 0 : _MenuProps$onClose.call(MenuProps, {}, undefined);
       }
     },
     size: convertSize(size),

package/legacy/components/panel/GridPanel.js

@@ -86,8 +86,8 @@ var GridPanel = /*#__PURE__*/React.forwardRef(function (props, ref) {
     anchorEl = _React$useState4[0],
     setAnchorEl = _React$useState4[1];
   React.useEffect(function () {
-    var _apiRef$current$rootE, _apiRef$current$rootE2;
-    var columnHeadersElement = (_apiRef$current$rootE = apiRef.current.rootElementRef) == null ? void 0 : (_apiRef$current$rootE2 = _apiRef$current$rootE.current) == null ? void 0 : _apiRef$current$rootE2.querySelector(".".concat(gridClasses.columnHeaders));
+    var _apiRef$current$rootE;
+    var columnHeadersElement = (_apiRef$current$rootE = apiRef.current.rootElementRef) == null || (_apiRef$current$rootE = _apiRef$current$rootE.current) == null ? void 0 : _apiRef$current$rootE.querySelector(".".concat(gridClasses.columnHeaders));
     if (columnHeadersElement) {
       setAnchorEl(columnHeadersElement);
     }

package/legacy/components/panel/filterPanel/GridFilterForm.js

@@ -247,7 +247,7 @@ var GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(props
       focus: function focus() {
         if (currentOperator != null && currentOperator.InputComponent) {
           var _valueRef$current;
-          valueRef == null ? void 0 : (_valueRef$current = valueRef.current) == null ? void 0 : _valueRef$current.focus();
+          valueRef == null || (_valueRef$current = valueRef.current) == null ? void 0 : _valueRef$current.focus();
         } else {
           filterSelectorRef.current.focus();
         }
@@ -348,7 +348,7 @@ var GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(props
         native: isBaseSelectNative,
         inputRef: filterSelectorRef
       }, (_rootProps$slotProps8 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps8.baseSelect, {
-        children: currentColumn == null ? void 0 : (_currentColumn$filter2 = currentColumn.filterOperators) == null ? void 0 : _currentColumn$filter2.map(function (operator) {
+        children: currentColumn == null || (_currentColumn$filter2 = currentColumn.filterOperators) == null ? void 0 : _currentColumn$filter2.map(function (operator) {
           return /*#__PURE__*/_createElement(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {
             native: isBaseSelectNative,
             key: operator.value,

package/legacy/components/panel/filterPanel/GridFilterInputSingleSelect.js

@@ -43,7 +43,7 @@ var SingleSelectOperatorContainer = styled('div')(_defineProperty({
   margin: 'auto 0px 5px 5px'
 }));
 function GridFilterInputSingleSelect(props) {
-  var _item$value, _rootProps$slotProps$, _rootProps$slotProps, _rootProps$slotProps$2, _resolvedColumn, _resolvedColumn2, _rootProps$slotProps2, _rootProps$slotProps3, _rootProps$slotProps4;
+  var _item$value, _rootProps$slotProps$, _rootProps$slotProps, _resolvedColumn, _resolvedColumn2, _rootProps$slotProps2, _rootProps$slotProps3, _rootProps$slotProps4;
   var item = props.item,
     applyValue = props.applyValue,
     type = props.type,
@@ -64,7 +64,7 @@ function GridFilterInputSingleSelect(props) {
   var id = useId();
   var labelId = useId();
   var rootProps = useGridRootProps();
-  var isSelectNative = (_rootProps$slotProps$ = (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : (_rootProps$slotProps$2 = _rootProps$slotProps.baseSelect) == null ? void 0 : _rootProps$slotProps$2.native) != null ? _rootProps$slotProps$ : true;
+  var isSelectNative = (_rootProps$slotProps$ = (_rootProps$slotProps = rootProps.slotProps) == null || (_rootProps$slotProps = _rootProps$slotProps.baseSelect) == null ? void 0 : _rootProps$slotProps.native) != null ? _rootProps$slotProps$ : true;
   var resolvedColumn = null;
   if (item.field) {
     var column = apiRef.current.getColumn(item.field);

package/legacy/hooks/features/columns/gridColumnsUtils.js

@@ -208,8 +208,15 @@ export var applyInitialState = function applyInitialState(columnsState, initialS
   });
   return newColumnsState;
 };
+function getDefaultColTypeDef(columnTypes, type) {
+  var colDef = columnTypes[DEFAULT_GRID_COL_TYPE_KEY];
+  if (type && columnTypes[type]) {
+    colDef = columnTypes[type];
+  }
+  return colDef;
+}
 export var createColumnsState = function createColumnsState(_ref5) {
-  var _apiRef$current$getRo, _apiRef$current$getRo2, _apiRef$current, _apiRef$current$getRo3;
+  var _apiRef$current$getRo, _apiRef$current$getRo2, _apiRef$current;
   var apiRef = _ref5.apiRef,
     columnsToUpsert = _ref5.columnsToUpsert,
     initialState = _ref5.initialState,
@@ -248,11 +255,7 @@ export var createColumnsState = function createColumnsState(_ref5) {
     columnsToKeep[field] = true;
     var existingState = columnsState.lookup[field];
     if (existingState == null) {
-      var colDef = columnTypes[DEFAULT_GRID_COL_TYPE_KEY];
-      if (newColumn.type && columnTypes[newColumn.type]) {
-        colDef = columnTypes[newColumn.type];
-      }
-      existingState = _extends({}, colDef, {
+      existingState = _extends({}, getDefaultColTypeDef(columnTypes, newColumn.type), {
         field: field,
         hasBeenResized: false
       });
@@ -260,6 +263,13 @@ export var createColumnsState = function createColumnsState(_ref5) {
     } else if (keepOnlyColumnsToUpsert) {
       columnsState.orderedFields.push(field);
     }
+
+    // If the column type has changed - merge the existing state with the default column type definition
+    if (existingState && existingState.type !== newColumn.type) {
+      existingState = _extends({}, existingState, getDefaultColTypeDef(columnTypes, newColumn.type), {
+        field: field
+      });
+    }
     var hasBeenResized = existingState.hasBeenResized;
     COLUMNS_DIMENSION_PROPERTIES.forEach(function (key) {
       if (newColumn[key] !== undefined) {
@@ -282,7 +292,7 @@ export var createColumnsState = function createColumnsState(_ref5) {
   }
   var columnsStateWithPreProcessing = apiRef.current.unstable_applyPipeProcessors('hydrateColumns', columnsState);
   var columnsStateWithPortableColumns = applyInitialState(columnsStateWithPreProcessing, initialState);
-  return hydrateColumnsWidth(columnsStateWithPortableColumns, (_apiRef$current$getRo = (_apiRef$current$getRo2 = (_apiRef$current = apiRef.current).getRootDimensions) == null ? void 0 : (_apiRef$current$getRo3 = _apiRef$current$getRo2.call(_apiRef$current)) == null ? void 0 : _apiRef$current$getRo3.viewportInnerSize.width) != null ? _apiRef$current$getRo : 0);
+  return hydrateColumnsWidth(columnsStateWithPortableColumns, (_apiRef$current$getRo = (_apiRef$current$getRo2 = (_apiRef$current = apiRef.current).getRootDimensions) == null || (_apiRef$current$getRo2 = _apiRef$current$getRo2.call(_apiRef$current)) == null ? void 0 : _apiRef$current$getRo2.viewportInnerSize.width) != null ? _apiRef$current$getRo : 0);
 };
 export var mergeColumnsState = function mergeColumnsState(columnsState) {
   return function (state) {

package/legacy/hooks/features/columns/useGridColumns.js

@@ -13,13 +13,13 @@ import { getGridDefaultColumnTypes } from '../../../colDef';
 import { jsx as _jsx } from "react/jsx-runtime";
 var defaultColumnTypes = getGridDefaultColumnTypes();
 export var columnsStateInitializer = function columnsStateInitializer(state, props, apiRef) {
-  var _props$initialState, _ref, _props$columnVisibili, _props$initialState2, _props$initialState2$;
+  var _props$initialState, _ref, _props$columnVisibili, _props$initialState2;
   var columnsState = createColumnsState({
     apiRef: apiRef,
     columnTypes: defaultColumnTypes,
     columnsToUpsert: props.columns,
     initialState: (_props$initialState = props.initialState) == null ? void 0 : _props$initialState.columns,
-    columnVisibilityModel: (_ref = (_props$columnVisibili = props.columnVisibilityModel) != null ? _props$columnVisibili : (_props$initialState2 = props.initialState) == null ? void 0 : (_props$initialState2$ = _props$initialState2.columns) == null ? void 0 : _props$initialState2$.columnVisibilityModel) != null ? _ref : {},
+    columnVisibilityModel: (_ref = (_props$columnVisibili = props.columnVisibilityModel) != null ? _props$columnVisibili : (_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.columns) == null ? void 0 : _props$initialState2.columnVisibilityModel) != null ? _ref : {},
     keepOnlyColumnsToUpsert: true
   });
   return _extends({}, state, {
@@ -173,7 +173,7 @@ export function useGridColumns(apiRef, props) {
    * PRE-PROCESSING
    */
   var stateExportPreProcessing = React.useCallback(function (prevState, context) {
-    var _props$initialState$c, _props$initialState3, _props$initialState3$;
+    var _props$initialState$c, _props$initialState3;
     var columnsStateToExport = {};
     var columnVisibilityModelToExport = gridColumnVisibilityModelSelector(apiRef);
     var shouldExportColumnVisibilityModel =
@@ -183,7 +183,7 @@ export function useGridColumns(apiRef, props) {
     props.columnVisibilityModel != null ||
     // Always export if the model has been initialized
     // TODO v6 Do a nullish check instead to export even if the initial model equals "{}"
-    Object.keys((_props$initialState$c = (_props$initialState3 = props.initialState) == null ? void 0 : (_props$initialState3$ = _props$initialState3.columns) == null ? void 0 : _props$initialState3$.columnVisibilityModel) != null ? _props$initialState$c : {}).length > 0 ||
+    Object.keys((_props$initialState$c = (_props$initialState3 = props.initialState) == null || (_props$initialState3 = _props$initialState3.columns) == null ? void 0 : _props$initialState3.columnVisibilityModel) != null ? _props$initialState$c : {}).length > 0 ||
     // Always export if the model is not empty
     Object.keys(columnVisibilityModelToExport).length > 0;
     if (shouldExportColumnVisibilityModel) {

package/legacy/hooks/features/dimensions/useGridDimensions.js

@@ -81,7 +81,7 @@ export function useGridDimensions(apiRef, props) {
     } else {
       viewportOuterSize = {
         width: rootDimensionsRef.current.width,
-        height: rootDimensionsRef.current.height - totalHeaderHeight
+        height: Math.max(rootDimensionsRef.current.height - totalHeaderHeight, 0)
       };
       var scrollInformation = hasScroll({
         content: {

package/legacy/hooks/features/editing/useGridCellEditing.js

@@ -345,7 +345,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
   }());
   var setCellEditingEditCellValue = React.useCallback( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(params) {
-      var _editingState$id, _editingState$id$fiel2;
+      var _editingState$id;
       var id, field, value, debounceMs, skipValueParser, column, row, parsedValue, editingState, newProps, hasChanged;
       return _regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
@@ -399,7 +399,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
             newProps.value = column.preProcessEditCellProps ? editingState[id][field].value : parsedValue;
             updateOrDeleteFieldState(id, field, newProps);
             editingState = gridEditRowsStateSelector(apiRef.current.state);
-            return _context2.abrupt("return", !((_editingState$id = editingState[id]) != null && (_editingState$id$fiel2 = _editingState$id[field]) != null && _editingState$id$fiel2.error));
+            return _context2.abrupt("return", !((_editingState$id = editingState[id]) != null && (_editingState$id = _editingState$id[field]) != null && _editingState$id.error));
           case 24:
           case "end":
             return _context2.stop();
@@ -451,11 +451,11 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
         id = _ref4[0],
         fields = _ref4[1];
       Object.entries(fields).forEach(function (_ref5) {
-        var _copyOfPrevCellModes$, _copyOfPrevCellModes$2, _idToIdLookup$id;
+        var _copyOfPrevCellModes$, _idToIdLookup$id;
         var _ref6 = _slicedToArray(_ref5, 2),
           field = _ref6[0],
           params = _ref6[1];
-        var prevMode = ((_copyOfPrevCellModes$ = copyOfPrevCellModes[id]) == null ? void 0 : (_copyOfPrevCellModes$2 = _copyOfPrevCellModes$[field]) == null ? void 0 : _copyOfPrevCellModes$2.mode) || GridCellModes.View;
+        var prevMode = ((_copyOfPrevCellModes$ = copyOfPrevCellModes[id]) == null || (_copyOfPrevCellModes$ = _copyOfPrevCellModes$[field]) == null ? void 0 : _copyOfPrevCellModes$.mode) || GridCellModes.View;
         var originalId = (_idToIdLookup$id = idToIdLookup[id]) != null ? _idToIdLookup$id : id;
         if (params.mode === GridCellModes.Edit && prevMode === GridCellModes.View) {
           updateStateToStartCellEditMode(_extends({

package/legacy/hooks/features/export/serializers/csvSerializer.js

@@ -4,15 +4,13 @@ import { GRID_CHECKBOX_SELECTION_COL_DEF } from '../../../../colDef';
 import { buildWarning } from '../../../../utils/warning';
 function sanitizeCellValue(value, delimiterCharacter) {
   if (typeof value === 'string') {
-    var formattedValue = value.replace(/"/g, '""');
-
     // Make sure value containing delimiter or line break won't be split into multiple rows
-    if ([delimiterCharacter, '\n', '\r'].some(function (delimiter) {
-      return formattedValue.includes(delimiter);
+    if ([delimiterCharacter, '\n', '\r', '"'].some(function (delimiter) {
+      return value.includes(delimiter);
     })) {
-      return "\"".concat(formattedValue, "\"");
+      return "\"".concat(value.replace(/"/g, '""'), "\"");
     }
-    return formattedValue;
+    return value;
   }
   return value;
 }

package/legacy/hooks/features/export/useGridPrintExport.js

@@ -131,11 +131,12 @@ export var useGridPrintExport = function useGridPrintExport(apiRef, props) {
       var _printDoc$body$classL;
       (_printDoc$body$classL = printDoc.body.classList).add.apply(_printDoc$body$classL, _toConsumableArray(normalizeOptions.bodyClassName.split(' ')));
     }
+    var stylesheetLoadPromises = [];
     if (normalizeOptions.copyStyles) {
       var rootCandidate = gridRootElement.getRootNode();
       var root = rootCandidate.constructor.name === 'ShadowRoot' ? rootCandidate : doc.current;
       var headStyleElements = root.querySelectorAll("style, link[rel='stylesheet']");
-      for (var i = 0; i < headStyleElements.length; i += 1) {
+      var _loop = function _loop() {
         var node = headStyleElements[i];
         if (node.tagName === 'STYLE') {
           var newHeadStyleElements = printDoc.createElement(node.tagName);
@@ -161,24 +162,35 @@ export var useGridPrintExport = function useGridPrintExport(apiRef, props) {
               _newHeadStyleElements.setAttribute(attr.nodeName, attr.nodeValue || '');
             }
           }
+          stylesheetLoadPromises.push(new Promise(function (resolve) {
+            _newHeadStyleElements.addEventListener('load', function () {
+              return resolve();
+            });
+          }));
           printDoc.head.appendChild(_newHeadStyleElements);
         }
+      };
+      for (var i = 0; i < headStyleElements.length; i += 1) {
+        _loop();
       }
     }
 
     // Trigger print
     if (process.env.NODE_ENV !== 'test') {
-      printWindow.contentWindow.print();
+      // wait for remote stylesheets to load
+      Promise.all(stylesheetLoadPromises).then(function () {
+        printWindow.contentWindow.print();
+      });
     }
   }, [apiRef, doc, props.columnHeaderHeight]);
   var handlePrintWindowAfterPrint = React.useCallback(function (printWindow) {
-    var _previousGridState$cu, _previousGridState$cu2;
+    var _previousGridState$cu;
     // Remove the print iframe
     doc.current.body.removeChild(printWindow);
 
     // Revert grid to previous state
     apiRef.current.restoreState(previousGridState.current || {});
-    if (!((_previousGridState$cu = previousGridState.current) != null && (_previousGridState$cu2 = _previousGridState$cu.columns) != null && _previousGridState$cu2.columnVisibilityModel)) {
+    if (!((_previousGridState$cu = previousGridState.current) != null && (_previousGridState$cu = _previousGridState$cu.columns) != null && _previousGridState$cu.columnVisibilityModel)) {
       // if the apiRef.current.exportState(); did not exported the column visibility, we update it
       apiRef.current.setColumnVisibilityModel(previousColumnVisibility.current);
     }

package/legacy/hooks/features/export/utils.js

@@ -30,10 +30,10 @@ export var defaultGetRowsToExport = function defaultGetRowsToExport(_ref2) {
     return rowTree[id].type !== 'footer';
   });
   var pinnedRows = gridPinnedRowsSelector(apiRef);
-  var topPinnedRowsIds = (pinnedRows == null ? void 0 : (_pinnedRows$top = pinnedRows.top) == null ? void 0 : _pinnedRows$top.map(function (row) {
+  var topPinnedRowsIds = (pinnedRows == null || (_pinnedRows$top = pinnedRows.top) == null ? void 0 : _pinnedRows$top.map(function (row) {
     return row.id;
   })) || [];
-  var bottomPinnedRowsIds = (pinnedRows == null ? void 0 : (_pinnedRows$bottom = pinnedRows.bottom) == null ? void 0 : _pinnedRows$bottom.map(function (row) {
+  var bottomPinnedRowsIds = (pinnedRows == null || (_pinnedRows$bottom = pinnedRows.bottom) == null ? void 0 : _pinnedRows$bottom.map(function (row) {
     return row.id;
   })) || [];
   bodyRows.unshift.apply(bodyRows, _toConsumableArray(topPinnedRowsIds));

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

@@ -136,7 +136,7 @@ export var gridFilterActiveItemsSelector = createSelectorMemoized(gridFilterMode
       return false;
     }
     var column = columnLookup[item.field];
-    if (!(column != null && column.filterOperators) || (column == null ? void 0 : (_column$filterOperato = column.filterOperators) == null ? void 0 : _column$filterOperato.length) === 0) {
+    if (!(column != null && column.filterOperators) || (column == null || (_column$filterOperato = column.filterOperators) == null ? void 0 : _column$filterOperato.length) === 0) {
       return false;
     }
     var filterOperator = column.filterOperators.find(function (operator) {

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

@@ -132,6 +132,7 @@ var getFilterCallbackFromItem = function getFilterCallbackFromItem(filterItem, a
     }
   };
 };
+var filterItemsApplierId = 1;
 
 /**
  * Generates a method to easily check if a row is matching the current filter model.
@@ -150,16 +151,35 @@ export var buildAggregatedFilterItemsApplier = function buildAggregatedFilterIte
   if (appliers.length === 0) {
     return null;
   }
-  return function (row, shouldApplyFilter) {
-    var resultPerItemId = {};
-    for (var i = 0; i < appliers.length; i += 1) {
-      var applier = appliers[i];
-      if (!shouldApplyFilter || shouldApplyFilter(applier.item.field)) {
-        resultPerItemId[applier.item.id] = applier.v7 ? applier.fn(row) : applier.fn(getRowId ? getRowId(row) : row.id);
-      }
-    }
-    return resultPerItemId;
-  };
+
+  // Original logic:
+  // return (row, shouldApplyFilter) => {
+  //   const resultPerItemId: GridFilterItemResult = {};
+  //
+  //   for (let i = 0; i < appliers.length; i += 1) {
+  //     const applier = appliers[i];
+  //     if (!shouldApplyFilter || shouldApplyFilter(applier.item.field)) {
+  //       resultPerItemId[applier.item.id!] = applier.v7
+  //         ? applier.fn(row)
+  //         : applier.fn(getRowId ? getRowId(row) : row.id);
+  //     }
+  //   }
+  //
+  //   return resultPerItemId;
+  // };
+
+  // We generate a new function with `eval()` to avoid expensive patterns for JS engines
+  // such as a dynamic object assignment, e.g. `{ [dynamicKey]: value }`.
+  var filterItemTemplate = "(function filterItem$$(row, shouldApplyFilter) {\n      ".concat(appliers.map(function (applier, i) {
+    return "const shouldApply".concat(i, " = !shouldApplyFilter || shouldApplyFilter(").concat(JSON.stringify(applier.item.field), ");");
+  }).join('\n'), "\n\n      const result$$ = {\n      ").concat(appliers.map(function (applier, i) {
+    return "".concat(JSON.stringify(String(applier.item.id)), ":\n          !shouldApply").concat(i, " ?\n            false :\n            ").concat(applier.v7 ? "appliers[".concat(i, "].fn(row)") : "appliers[".concat(i, "].fn(").concat(getRowId ? 'getRowId(row)' : 'row.id', ")"), ",\n      ");
+  }).join('\n'), "};\n\n      return result$$;\n    })");
+
+  // eslint-disable-next-line no-eval
+  var filterItem = eval(filterItemTemplate.replaceAll('$$', String(filterItemsApplierId)));
+  filterItemsApplierId += 1;
+  return filterItem;
 };
 
 /**

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

@@ -1,7 +1,9 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
+import { defaultMemoize } from 'reselect';
 import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import { useLazyRef } from '../../utils/useLazyRef';
 import { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
 import { useGridLogger } from '../../utils/useGridLogger';
@@ -17,8 +19,8 @@ import { buildAggregatedFilterApplier, sanitizeFilterModel, mergeStateWithFilter
 import { isDeepEqual } from '../../../utils/utils';
 import { jsx as _jsx } from "react/jsx-runtime";
 export var filterStateInitializer = function filterStateInitializer(state, props, apiRef) {
-  var _ref, _props$filterModel, _props$initialState, _props$initialState$f;
-  var filterModel = (_ref = (_props$filterModel = props.filterModel) != null ? _props$filterModel : (_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$f = _props$initialState.filter) == null ? void 0 : _props$initialState$f.filterModel) != null ? _ref : getDefaultGridFilterModel();
+  var _ref, _props$filterModel, _props$initialState;
+  var filterModel = (_ref = (_props$filterModel = props.filterModel) != null ? _props$filterModel : (_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.filter) == null ? void 0 : _props$initialState.filterModel) != null ? _ref : getDefaultGridFilterModel();
   return _extends({}, state, {
     filter: {
       filterModel: sanitizeFilterModel(filterModel, props.disableMultipleColumnsFiltering, apiRef),
@@ -38,6 +40,9 @@ function getVisibleRowsLookupState(apiRef, state) {
     filteredRowsLookup: state.filter.filteredRowsLookup
   });
 }
+function createMemoizedValues() {
+  return defaultMemoize(Object.values);
+}
 
 /**
  * @requires useGridColumns (method, event)
@@ -45,7 +50,7 @@ function getVisibleRowsLookupState(apiRef, state) {
  * @requires useGridRows (event)
  */
 export var useGridFilter = function useGridFilter(apiRef, props) {
-  var _props$initialState3, _props$initialState3$, _props$slotProps2;
+  var _props$initialState3, _props$slotProps2;
   var logger = useGridLogger(apiRef, 'useGridFilter');
   apiRef.current.registerControlState({
     stateId: 'filter',
@@ -229,7 +234,7 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
    * PRE-PROCESSING
    */
   var stateExportPreProcessing = React.useCallback(function (prevState, context) {
-    var _props$initialState2, _props$initialState2$;
+    var _props$initialState2;
     var filterModelToExport = gridFilterModelSelector(apiRef);
     var shouldExportFilterModel =
     // Always export if the `exportOnlyDirtyModels` property is not activated
@@ -237,7 +242,7 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
     // Always export if the model is controlled
     props.filterModel != null ||
     // Always export if the model has been initialized
-    ((_props$initialState2 = props.initialState) == null ? void 0 : (_props$initialState2$ = _props$initialState2.filter) == null ? void 0 : _props$initialState2$.filterModel) != null ||
+    ((_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.filter) == null ? void 0 : _props$initialState2.filterModel) != null ||
     // Export if the model is not equal to the default value
     !isDeepEqual(filterModelToExport, getDefaultGridFilterModel());
     if (!shouldExportFilterModel) {
@@ -248,7 +253,7 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
         filterModel: filterModelToExport
       }
     });
-  }, [apiRef, props.filterModel, (_props$initialState3 = props.initialState) == null ? void 0 : (_props$initialState3$ = _props$initialState3.filter) == null ? void 0 : _props$initialState3$.filterModel]);
+  }, [apiRef, props.filterModel, (_props$initialState3 = props.initialState) == null || (_props$initialState3 = _props$initialState3.filter) == null ? void 0 : _props$initialState3.filterModel]);
   var stateRestorePreProcessing = React.useCallback(function (params, context) {
     var _context$stateToResto;
     var filterModel = (_context$stateToResto = context.stateToRestore.filter) == null ? void 0 : _context$stateToResto.filterModel;
@@ -268,11 +273,8 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
     }
     return initialValue;
   }, [props.slots.filterPanel, (_props$slotProps2 = props.slotProps) == null ? void 0 : _props$slotProps2.filterPanel]);
-  var dataRowIdToIdLookup = apiRef.current.state.rows.dataRowIdToModelLookup;
-  var rows = React.useMemo(function () {
-    return Object.values(dataRowIdToIdLookup);
-  }, [dataRowIdToIdLookup]);
   var getRowId = props.getRowId;
+  var getRowsRef = useLazyRef(createMemoizedValues);
   var flatFilteringMethod = React.useCallback(function (params) {
     if (props.filterMode !== 'client' || !params.isRowMatchingFilters) {
       return {
@@ -288,6 +290,7 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
       passingFilterItems: null,
       passingQuickFilterValues: null
     };
+    var rows = getRowsRef.current(apiRef.current.state.rows.dataRowIdToModelLookup);
     for (var i = 0; i < rows.length; i += 1) {
       var row = rows[i];
       var id = getRowId ? getRowId(row) : row.id;
@@ -304,7 +307,7 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
       filteredRowsLookup: filteredRowsLookup,
       filteredDescendantCountLookup: {}
     };
-  }, [apiRef, rows, props.filterMode, getRowId]);
+  }, [apiRef, props.filterMode, getRowId, getRowsRef]);
   useGridRegisterPipeProcessor(apiRef, 'columnMenu', addColumnMenuItem);
   useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);
   useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);

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

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { unstable_ownerDocument as ownerDocument } from '@mui/utils';
+import { unstable_ownerDocument as ownerDocument, unstable_useEventCallback as useEventcallback } from '@mui/utils';
 import { gridClasses } from '../../../constants/gridClasses';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
 import { useGridLogger } from '../../utils/useGridLogger';
@@ -347,6 +347,36 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
       });
     }
   }, [apiRef]);
+  var handlePaginationModelChange = useEventcallback(function () {
+    var currentFocusedCell = gridFocusCellSelector(apiRef);
+    if (!currentFocusedCell) {
+      return;
+    }
+    var currentPage = getVisibleRows(apiRef, {
+      pagination: props.pagination,
+      paginationMode: props.paginationMode
+    });
+    var rowIsInCurrentPage = currentPage.rows.find(function (row) {
+      return row.id === currentFocusedCell.id;
+    });
+    if (rowIsInCurrentPage) {
+      return;
+    }
+    var visibleColumns = gridVisibleColumnDefinitionsSelector(apiRef);
+    apiRef.current.setState(function (state) {
+      return _extends({}, state, {
+        tabIndex: {
+          cell: {
+            id: currentPage.rows[0].id,
+            field: visibleColumns[0].field
+          },
+          columnGroupHeader: null,
+          columnHeader: null,
+          columnHeaderFilter: null
+        }
+      });
+    });
+  });
   var focusApi = {
     setCellFocus: setCellFocus,
     setColumnHeaderFocus: setColumnHeaderFocus,
@@ -375,4 +405,5 @@ export var useGridFocus = function useGridFocus(apiRef, props) {
   useGridApiEventHandler(apiRef, 'columnHeaderFocus', handleColumnHeaderFocus);
   useGridApiEventHandler(apiRef, 'columnGroupHeaderFocus', handleColumnGroupHeaderFocus);
   useGridApiEventHandler(apiRef, 'rowsSet', handleRowSet);
+  useGridApiEventHandler(apiRef, 'paginationModelChange', handlePaginationModelChange);
 };