@mui/x-data-grid-pro 7.0.0-beta.6 → 7.0.0

package/esm/hooks/features/columnPinning/useGridColumnPinning.js

@@ -3,14 +3,13 @@ import * as React from 'react';
 import { useGridSelector, gridVisibleColumnDefinitionsSelector, gridColumnsTotalWidthSelector, gridColumnPositionsSelector, useGridApiMethod, useGridApiEventHandler, GridPinnedColumnPosition, gridColumnFieldsSelector } from '@mui/x-data-grid';
 import { useGridRegisterPipeProcessor, gridPinnedColumnsSelector, gridVisiblePinnedColumnDefinitionsSelector } from '@mui/x-data-grid/internals';
 export const columnPinningStateInitializer = (state, props, apiRef) => {
-  var _props$initialState;
   apiRef.current.caches.columnPinning = {
     orderedFieldsBeforePinningColumns: null
   };
   let model;
   if (props.pinnedColumns) {
     model = props.pinnedColumns;
-  } else if ((_props$initialState = props.initialState) != null && _props$initialState.pinnedColumns) {
+  } else if (props.initialState?.pinnedColumns) {
     model = props.initialState.pinnedColumns;
   } else {
     model = {};
@@ -20,7 +19,6 @@ export const columnPinningStateInitializer = (state, props, apiRef) => {
   });
 };
 export const useGridColumnPinning = (apiRef, props) => {
-  var _props$initialState3;
   const pinnedColumns = useGridSelector(apiRef, gridPinnedColumnsSelector);
 
   /**
@@ -84,7 +82,6 @@ export const useGridColumnPinning = (apiRef, props) => {
     return initialValue;
   }, [apiRef]);
   const stateExportPreProcessing = React.useCallback((prevState, context) => {
-    var _props$initialState2, _pinnedColumnsToExpor, _pinnedColumnsToExpor2;
     const pinnedColumnsToExport = gridPinnedColumnsSelector(apiRef.current.state);
     const shouldExportPinnedColumns =
     // Always export if the `exportOnlyDirtyModels` property is not activated
@@ -92,16 +89,16 @@ export const useGridColumnPinning = (apiRef, props) => {
     // Always export if the model is controlled
     props.pinnedColumns != null ||
     // Always export if the model has been initialized
-    ((_props$initialState2 = props.initialState) == null ? void 0 : _props$initialState2.pinnedColumns) != null ||
+    props.initialState?.pinnedColumns != null ||
     // Export if the model is not empty
-    ((_pinnedColumnsToExpor = pinnedColumnsToExport.left) != null ? _pinnedColumnsToExpor : []).length > 0 || ((_pinnedColumnsToExpor2 = pinnedColumnsToExport.right) != null ? _pinnedColumnsToExpor2 : []).length > 0;
+    (pinnedColumnsToExport.left ?? []).length > 0 || (pinnedColumnsToExport.right ?? []).length > 0;
     if (!shouldExportPinnedColumns) {
       return prevState;
     }
     return _extends({}, prevState, {
       pinnedColumns: pinnedColumnsToExport
     });
-  }, [apiRef, props.pinnedColumns, (_props$initialState3 = props.initialState) == null ? void 0 : _props$initialState3.pinnedColumns]);
+  }, [apiRef, props.pinnedColumns, props.initialState?.pinnedColumns]);
   const stateRestorePreProcessing = React.useCallback((params, context) => {
     const newPinnedColumns = context.stateToRestore.pinnedColumns;
     if (newPinnedColumns != null) {
@@ -181,16 +178,16 @@ export const useGridColumnPinning = (apiRef, props) => {
      * on must be moved to left or right to make room for it. The ^^^ below represents the column
      * which gave space to receive X.
      *
-     * | X | B | C | D | -> | B | C | D | X | (e.g. X moved to after D, so delta=1)
+     * | X | B | C | D | -> | B | C | D | X | (for example X moved to after D, so delta=1)
      *              ^^^              ^^^
      *
-     * | A | B | C | X | -> | X | A | B | C | (e.g. X moved before A, so delta=-1)
+     * | A | B | C | X | -> | X | A | B | C | (for example X moved before A, so delta=-1)
      *  ^^^                      ^^^
      *
      * If column P is pinned, it will not move to provide space. However, it will jump to the next
      * non-pinned column.
      *
-     * | X | B | P | D | -> | B | D | P | X | (e.g. X moved to after D, with P pinned)
+     * | X | B | P | D | -> | B | D | P | X | (for example X moved to after D, with P pinned)
      *              ^^^          ^^^
      */
     const siblingField = latestColumnFields[targetIndex - delta];

package/esm/hooks/features/columnPinning/useGridColumnPinningPreProcessors.js

@@ -107,4 +107,6 @@ export const useGridColumnPinningPreProcessors = (apiRef, props) => {
     });
   }, [apiRef, disableColumnPinning, pinnedColumns]);
   useGridRegisterPipeProcessor(apiRef, 'hydrateColumns', reorderPinnedColumns);
+  const isColumnPinned = React.useCallback((initialValue, field) => apiRef.current.isColumnPinned(field), [apiRef]);
+  useGridRegisterPipeProcessor(apiRef, 'isColumnPinned', isColumnPinned);
 };

package/esm/hooks/features/columnReorder/useGridColumnReorder.js

@@ -83,8 +83,7 @@ export const useGridColumnReorder = (apiRef, props) => {
     // The limitingGroupId is the id of the group from which the dragged column should not escape
     let limitingGroupId = null;
     draggingColumnGroupPath.forEach(groupId => {
-      var _groupsLookup$groupId;
-      if (!((_groupsLookup$groupId = groupsLookup[groupId]) != null && _groupsLookup$groupId.freeReordering)) {
+      if (!groupsLookup[groupId]?.freeReordering) {
         // Only consider group that are made of more than one column
         if (columnIndex > 0 && getGroupPathFromColumnIndex(columnIndex - 1).includes(groupId)) {
           limitingGroupId = groupId;
@@ -115,9 +114,8 @@ export const useGridColumnReorder = (apiRef, props) => {
         getGroupPathFromColumnIndex(rightIndex).forEach(groupId => {
           if (getGroupPathFromColumnIndex(leftIndex).includes(groupId)) {
             if (!draggingColumnGroupPath.includes(groupId)) {
-              var _groupsLookup$groupId2;
               // moving here split the group groupId in two distincts chunks
-              if (!((_groupsLookup$groupId2 = groupsLookup[groupId]) != null && _groupsLookup$groupId2.freeReordering)) {
+              if (!groupsLookup[groupId]?.freeReordering) {
                 forbiddenIndexes.current[indexToForbid] = true;
               }
             }

package/esm/hooks/features/detailPanel/useGridDetailPanel.js

@@ -8,11 +8,10 @@ import { gridDetailPanelExpandedRowIdsSelector, gridDetailPanelExpandedRowsConte
 // called 3 times when opening/closing a panel.
 
 export const detailPanelStateInitializer = (state, props) => {
-  var _ref, _props$detailPanelExp, _props$initialState;
   return _extends({}, state, {
     detailPanel: {
       heightCache: {},
-      expandedRowIds: (_ref = (_props$detailPanelExp = props.detailPanelExpandedRowIds) != null ? _props$detailPanelExp : (_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.detailPanel) == null ? void 0 : _props$initialState.expandedRowIds) != null ? _ref : []
+      expandedRowIds: props.detailPanelExpandedRowIds ?? props.initialState?.detailPanel?.expandedRowIds ?? []
     }
   });
 };
@@ -30,7 +29,6 @@ function cacheContentAndHeight(apiRef, getDetailPanelContent, getDetailPanelHeig
     return acc;
   }, {});
   const heightCache = rowIds.reduce((acc, id) => {
-    var _previousHeightCache$;
     if (contentCache[id] == null) {
       return acc;
     }
@@ -39,7 +37,7 @@ function cacheContentAndHeight(apiRef, getDetailPanelContent, getDetailPanelHeig
     const autoHeight = height === 'auto';
     acc[id] = {
       autoHeight,
-      height: autoHeight ? (_previousHeightCache$ = previousHeightCache[id]) == null ? void 0 : _previousHeightCache$.height : height
+      height: autoHeight ? previousHeightCache[id]?.height : height
     };
     return acc;
   }, {});
@@ -149,20 +147,18 @@ export const useGridDetailPanel = (apiRef, props) => {
     }
   }, [apiRef, props.detailPanelExpandedRowIds]);
   const updateCachesAndForceUpdate = React.useCallback(() => {
-    var _apiRef$current$updat, _apiRef$current;
     apiRef.current.setState(state => {
       return _extends({}, state, {
         detailPanel: _extends({}, state.detailPanel, cacheContentAndHeight(apiRef, props.getDetailPanelContent, props.getDetailPanelHeight, state.detailPanel.heightCache))
       });
     });
-    (_apiRef$current$updat = (_apiRef$current = apiRef.current).updateDimensions) == null || _apiRef$current$updat.call(_apiRef$current);
+    apiRef.current.updateDimensions?.();
     apiRef.current.forceUpdate();
   }, [apiRef, props.getDetailPanelContent, props.getDetailPanelHeight]);
   useGridApiEventHandler(apiRef, 'sortedRowsSet', updateCachesAndForceUpdate);
   const previousGetDetailPanelContentProp = React.useRef();
   const previousGetDetailPanelHeightProp = React.useRef();
   const updateCachesIfNeeded = React.useCallback(() => {
-    var _apiRef$current$updat2, _apiRef$current2;
     if (props.getDetailPanelContent === previousGetDetailPanelContentProp.current && props.getDetailPanelHeight === previousGetDetailPanelHeightProp.current) {
       return;
     }
@@ -171,19 +167,18 @@ export const useGridDetailPanel = (apiRef, props) => {
         detailPanel: _extends({}, state.detailPanel, cacheContentAndHeight(apiRef, props.getDetailPanelContent, props.getDetailPanelHeight, state.detailPanel.heightCache))
       });
     });
-    (_apiRef$current$updat2 = (_apiRef$current2 = apiRef.current).updateDimensions) == null || _apiRef$current$updat2.call(_apiRef$current2);
+    apiRef.current.updateDimensions?.();
     previousGetDetailPanelContentProp.current = props.getDetailPanelContent;
     previousGetDetailPanelHeightProp.current = props.getDetailPanelHeight;
   }, [apiRef, props.getDetailPanelContent, props.getDetailPanelHeight]);
   const addDetailHeight = React.useCallback((initialValue, row) => {
-    var _heightCache$row$id;
     if (!expandedRowIds || expandedRowIds.length === 0 || !expandedRowIds.includes(row.id)) {
       initialValue.detail = 0;
       return initialValue;
     }
     updateCachesIfNeeded();
     const heightCache = gridDetailPanelExpandedRowsHeightCacheSelector(apiRef);
-    initialValue.detail = (_heightCache$row$id = heightCache[row.id]) != null ? _heightCache$row$id : 0; // Fallback to zero because the cache might not be ready yet (e.g. page was changed)
+    initialValue.detail = heightCache[row.id] ?? 0; // Fallback to zero because the cache might not be ready yet (for example page was changed)
     return initialValue;
   }, [apiRef, expandedRowIds, updateCachesIfNeeded]);
   useGridRegisterPipeProcessor(apiRef, 'rowHeight', addDetailHeight);

package/esm/hooks/features/detailPanel/useGridDetailPanelCache.js

@@ -15,7 +15,6 @@ function cacheContentAndHeight(apiRef, getDetailPanelContent, getDetailPanelHeig
     return acc;
   }, {});
   const heightCache = rowIds.reduce((acc, id) => {
-    var _previousHeightCache$;
     if (contentCache[id] == null) {
       return acc;
     }
@@ -24,7 +23,7 @@ function cacheContentAndHeight(apiRef, getDetailPanelContent, getDetailPanelHeig
     const autoHeight = height === 'auto';
     acc[id] = {
       autoHeight,
-      height: !autoHeight ? height : (_previousHeightCache$ = previousHeightCache[id]) == null ? void 0 : _previousHeightCache$.height
+      height: !autoHeight ? height : previousHeightCache[id]?.height
     };
     return acc;
   }, {});

package/esm/hooks/features/index.js

@@ -1,7 +1,6 @@
 // Only export the variable and types that should be publicly exposed and re-exported from `@mui/x-data-grid-pro`
 export * from './columnPinning';
 export * from './columnReorder';
-export * from './columnResize';
 export * from './rowReorder';
 export * from './treeData';
 export * from './detailPanel';

package/esm/hooks/features/infiniteLoader/useGridInfiniteLoader.js

@@ -26,7 +26,6 @@ export const useGridInfiniteLoader = (apiRef, props) => {
     const currentRatio = entry.intersectionRatio;
     const isIntersecting = entry.isIntersecting;
     if (isIntersecting && currentRatio === 1) {
-      var _observer$current;
       const viewportPageSize = apiRef.current.getViewportPageSize();
       const rowScrollEndParams = {
         visibleColumns,
@@ -34,7 +33,7 @@ export const useGridInfiniteLoader = (apiRef, props) => {
         visibleRowsCount: currentPage.rows.length
       };
       apiRef.current.publishEvent('rowsScrollEnd', rowScrollEndParams);
-      (_observer$current = observer.current) == null || _observer$current.disconnect();
+      observer.current?.disconnect();
       // do not observe this node anymore
       triggerElement.current = null;
     }
@@ -43,14 +42,13 @@ export const useGridInfiniteLoader = (apiRef, props) => {
   const dimensions = useGridSelector(apiRef, gridDimensionsSelector);
   const marginBottom = props.scrollEndThreshold - (dimensions.hasScrollX ? dimensions.scrollbarSize : 0);
   React.useEffect(() => {
-    var _observer$current2;
     if (!isEnabled) {
       return;
     }
     if (!virtualScroller) {
       return;
     }
-    (_observer$current2 = observer.current) == null || _observer$current2.disconnect();
+    observer.current?.disconnect();
     observer.current = new IntersectionObserver(handleLoadMoreRows, {
       threshold: 1,
       root: virtualScroller,
@@ -66,12 +64,10 @@ export const useGridInfiniteLoader = (apiRef, props) => {
       return;
     }
     if (triggerElement.current !== node) {
-      var _observer$current3;
-      (_observer$current3 = observer.current) == null || _observer$current3.disconnect();
+      observer.current?.disconnect();
       triggerElement.current = node;
       if (triggerElement.current) {
-        var _observer$current4;
-        (_observer$current4 = observer.current) == null || _observer$current4.observe(triggerElement.current);
+        observer.current?.observe(triggerElement.current);
       }
     }
   }, [isEnabled]);
@@ -89,9 +85,9 @@ export const useGridInfiniteLoader = (apiRef, props) => {
       role: "presentation"
     }, `trigger-${lastRowId}`);
   }, [isEnabled, triggerRef]);
-  const infiteLoaderPrivateApi = {
+  const infiniteLoaderPrivateApi = {
     getInfiniteLoadingTriggerElement
   };
-  useGridApiMethod(apiRef, infiteLoaderPrivateApi, 'private');
+  useGridApiMethod(apiRef, infiniteLoaderPrivateApi, 'private');
   useGridApiOptionHandler(apiRef, 'rowsScrollEnd', props.onRowsScrollEnd);
 };

package/esm/hooks/features/lazyLoader/useGridLazyLoader.js

@@ -15,9 +15,8 @@ function findSkeletonRowsSection({
   let endIndex = visibleRowsSection.length - 1;
   let isSkeletonSectionFound = false;
   while (!isSkeletonSectionFound && firstRowIndex < lastRowIndex) {
-    var _apiRef$current$getRo, _apiRef$current$getRo2;
-    const isStartingWithASkeletonRow = ((_apiRef$current$getRo = apiRef.current.getRowNode(visibleRowsSection[startIndex].id)) == null ? void 0 : _apiRef$current$getRo.type) === 'skeletonRow';
-    const isEndingWithASkeletonRow = ((_apiRef$current$getRo2 = apiRef.current.getRowNode(visibleRowsSection[endIndex].id)) == null ? void 0 : _apiRef$current$getRo2.type) === 'skeletonRow';
+    const isStartingWithASkeletonRow = apiRef.current.getRowNode(visibleRowsSection[startIndex].id)?.type === 'skeletonRow';
+    const isEndingWithASkeletonRow = apiRef.current.getRowNode(visibleRowsSection[endIndex].id)?.type === 'skeletonRow';
     if (isStartingWithASkeletonRow && isEndingWithASkeletonRow) {
       isSkeletonSectionFound = true;
     }
@@ -35,18 +34,6 @@ function findSkeletonRowsSection({
     lastRowIndex
   } : undefined;
 }
-function isLazyLoadingDisabled({
-  lazyLoadingFeatureFlag,
-  rowsLoadingMode
-}) {
-  if (!lazyLoadingFeatureFlag) {
-    return true;
-  }
-  if (rowsLoadingMode !== 'server') {
-    return true;
-  }
-  return false;
-}
 
 /**
  * @requires useGridRows (state)
@@ -55,20 +42,13 @@ function isLazyLoadingDisabled({
  * @requires useGridScroll (method
  */
 export const useGridLazyLoader = (privateApiRef, props) => {
-  var _props$experimentalFe;
   const sortModel = useGridSelector(privateApiRef, gridSortModelSelector);
   const filterModel = useGridSelector(privateApiRef, gridFilterModelSelector);
   const renderedRowsIntervalCache = React.useRef({
     firstRowToRender: 0,
     lastRowToRender: 0
   });
-  const {
-    lazyLoading
-  } = (_props$experimentalFe = props.experimentalFeatures) != null ? _props$experimentalFe : {};
-  const isDisabled = isLazyLoadingDisabled({
-    lazyLoadingFeatureFlag: lazyLoading,
-    rowsLoadingMode: props.rowsLoadingMode
-  });
+  const isDisabled = props.rowsLoadingMode !== 'server';
   const handleRenderedRowsIntervalChange = React.useCallback(params => {
     if (isDisabled) {
       return;

package/esm/hooks/features/lazyLoader/useGridLazyLoaderPreProcessors.js

@@ -5,13 +5,9 @@ import { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';
 export const GRID_SKELETON_ROW_ROOT_ID = 'auto-generated-skeleton-row-root';
 const getSkeletonRowId = index => `${GRID_SKELETON_ROW_ROOT_ID}-${index}`;
 export const useGridLazyLoaderPreProcessors = (privateApiRef, props) => {
-  var _props$experimentalFe;
-  const {
-    lazyLoading
-  } = (_props$experimentalFe = props.experimentalFeatures) != null ? _props$experimentalFe : {};
   const addSkeletonRows = React.useCallback(groupingParams => {
     const rootGroup = groupingParams.tree[GRID_ROOT_GROUP_ID];
-    if (!lazyLoading || props.rowsLoadingMode !== 'server' || !props.rowCount || rootGroup.children.length >= props.rowCount) {
+    if (props.rowsLoadingMode !== 'server' || !props.rowCount || rootGroup.children.length >= props.rowCount) {
       return groupingParams;
     }
     const tree = _extends({}, groupingParams.tree);
@@ -33,6 +29,6 @@ export const useGridLazyLoaderPreProcessors = (privateApiRef, props) => {
     return _extends({}, groupingParams, {
       tree
     });
-  }, [props.rowCount, props.rowsLoadingMode, lazyLoading]);
+  }, [props.rowCount, props.rowsLoadingMode]);
   useGridRegisterPipeProcessor(privateApiRef, 'hydrateRows', addSkeletonRows);
 };

package/esm/hooks/features/rowPinning/useGridRowPinning.js

@@ -3,18 +3,17 @@ import * as React from 'react';
 import { useGridApiMethod } from '@mui/x-data-grid';
 import { getRowIdFromRowModel } from '@mui/x-data-grid/internals';
 function createPinnedRowsInternalCache(pinnedRows, getRowId) {
-  var _pinnedRows$top, _pinnedRows$bottom;
   const cache = {
     topIds: [],
     bottomIds: [],
     idLookup: {}
   };
-  pinnedRows == null || (_pinnedRows$top = pinnedRows.top) == null || _pinnedRows$top.forEach(rowModel => {
+  pinnedRows?.top?.forEach(rowModel => {
     const id = getRowIdFromRowModel(rowModel, getRowId);
     cache.topIds.push(id);
     cache.idLookup[id] = rowModel;
   });
-  pinnedRows == null || (_pinnedRows$bottom = pinnedRows.bottom) == null || _pinnedRows$bottom.forEach(rowModel => {
+  pinnedRows?.bottom?.forEach(rowModel => {
     const id = getRowIdFromRowModel(rowModel, getRowId);
     cache.bottomIds.push(id);
     cache.idLookup[id] = rowModel;
@@ -22,11 +21,10 @@ function createPinnedRowsInternalCache(pinnedRows, getRowId) {
   return cache;
 }
 export const rowPinningStateInitializer = (state, props, apiRef) => {
-  var _state$rows;
   apiRef.current.caches.pinnedRows = createPinnedRowsInternalCache(props.pinnedRows, props.getRowId);
   return _extends({}, state, {
     rows: _extends({}, state.rows, {
-      additionalRowGroups: _extends({}, (_state$rows = state.rows) == null ? void 0 : _state$rows.additionalRowGroups, {
+      additionalRowGroups: _extends({}, state.rows?.additionalRowGroups, {
         pinnedRows: {
           top: [],
           bottom: []

package/esm/hooks/features/rowPinning/useGridRowPinningPreProcessors.js

@@ -11,7 +11,6 @@ export function addPinnedRow({
   apiRef,
   isAutoGenerated
 }) {
-  var _groupingParams$addit, _groupingParams$addit2;
   const dataRowIdToModelLookup = _extends({}, groupingParams.dataRowIdToModelLookup);
   const dataRowIdToIdLookup = _extends({}, groupingParams.dataRowIdToIdLookup);
   const tree = _extends({}, groupingParams.tree);
@@ -35,12 +34,12 @@ export function addPinnedRow({
 
   apiRef.current.caches.rows.dataRowIdToModelLookup[rowId] = _extends({}, rowModel);
   apiRef.current.caches.rows.dataRowIdToIdLookup[rowId] = rowId;
-  const previousPinnedRows = ((_groupingParams$addit = groupingParams.additionalRowGroups) == null ? void 0 : _groupingParams$addit.pinnedRows) || {};
+  const previousPinnedRows = groupingParams.additionalRowGroups?.pinnedRows || {};
   const newPinnedRow = {
     id: rowId,
     model: rowModel
   };
-  if ((_groupingParams$addit2 = groupingParams.additionalRowGroups) != null && (_groupingParams$addit2 = _groupingParams$addit2.pinnedRows) != null && (_groupingParams$addit2 = _groupingParams$addit2[position]) != null && _groupingParams$addit2.includes(newPinnedRow)) {
+  if (groupingParams.additionalRowGroups?.pinnedRows?.[position]?.includes(newPinnedRow)) {
     return _extends({}, groupingParams, {
       dataRowIdToModelLookup,
       dataRowIdToIdLookup,
@@ -62,7 +61,6 @@ export function addPinnedRow({
 }
 export const useGridRowPinningPreProcessors = apiRef => {
   const addPinnedRows = React.useCallback(groupingParams => {
-    var _pinnedRowsCache$topI, _pinnedRowsCache$bott, _pinnedRowsCache$bott2, _pinnedRowsCache$topI2;
     const pinnedRowsCache = apiRef.current.caches.pinnedRows || {};
     let newGroupingParams = _extends({}, groupingParams, {
       additionalRowGroups: _extends({}, groupingParams.additionalRowGroups, {
@@ -70,7 +68,7 @@ export const useGridRowPinningPreProcessors = apiRef => {
         pinnedRows: {}
       })
     });
-    (_pinnedRowsCache$topI = pinnedRowsCache.topIds) == null || _pinnedRowsCache$topI.forEach(rowId => {
+    pinnedRowsCache.topIds?.forEach(rowId => {
       newGroupingParams = addPinnedRow({
         groupingParams: newGroupingParams,
         rowModel: pinnedRowsCache.idLookup[rowId],
@@ -80,7 +78,7 @@ export const useGridRowPinningPreProcessors = apiRef => {
         isAutoGenerated: false
       });
     });
-    (_pinnedRowsCache$bott = pinnedRowsCache.bottomIds) == null || _pinnedRowsCache$bott.forEach(rowId => {
+    pinnedRowsCache.bottomIds?.forEach(rowId => {
       newGroupingParams = addPinnedRow({
         groupingParams: newGroupingParams,
         rowModel: pinnedRowsCache.idLookup[rowId],
@@ -92,7 +90,7 @@ export const useGridRowPinningPreProcessors = apiRef => {
     });
 
     // If row with the same `id` is present both in `rows` and `pinnedRows` - remove it from the root group children
-    if ((_pinnedRowsCache$bott2 = pinnedRowsCache.bottomIds) != null && _pinnedRowsCache$bott2.length || (_pinnedRowsCache$topI2 = pinnedRowsCache.topIds) != null && _pinnedRowsCache$topI2.length) {
+    if (pinnedRowsCache.bottomIds?.length || pinnedRowsCache.topIds?.length) {
       const shouldKeepRow = rowId => {
         if (newGroupingParams.tree[rowId] && newGroupingParams.tree[rowId].type === 'pinnedRow') {
           return false;

package/esm/hooks/features/treeData/gridTreeDataGroupColDef.js

@@ -15,7 +15,7 @@ export const GRID_TREE_DATA_GROUPING_COL_DEF = _extends({}, GRID_STRING_COL_DEF,
   valueGetter: (value, row, column, apiRef) => {
     const rowId = apiRef.current.getRowId(row);
     const rowNode = apiRef.current.getRowNode(rowId);
-    return (rowNode == null ? void 0 : rowNode.type) === 'group' || (rowNode == null ? void 0 : rowNode.type) === 'leaf' ? rowNode.groupingKey : undefined;
+    return rowNode?.type === 'group' || rowNode?.type === 'leaf' ? rowNode.groupingKey : undefined;
   }
 });
 export const GRID_TREE_DATA_GROUPING_FIELD = '__tree_data_group__';

package/esm/hooks/features/treeData/gridTreeDataUtils.js

@@ -35,9 +35,8 @@ export const filterRowTreeFromTreeData = params => {
     let filteredDescendantCount = 0;
     if (node.type === 'group') {
       node.children.forEach(childId => {
-        var _isMatchingFilters;
         const childNode = rowTree[childId];
-        const childSubTreeSize = filterTreeNode(childNode, (_isMatchingFilters = isMatchingFilters) != null ? _isMatchingFilters : isParentMatchingFilters, areAncestorsExpanded && !!node.childrenExpanded);
+        const childSubTreeSize = filterTreeNode(childNode, isMatchingFilters ?? isParentMatchingFilters, areAncestorsExpanded && !!node.childrenExpanded);
         filteredDescendantCount += childSubTreeSize;
       });
     }

package/esm/hooks/features/treeData/useGridTreeDataPreProcessors.js

@@ -17,7 +17,6 @@ export const useGridTreeDataPreProcessors = (privateApiRef, props) => {
     privateApiRef.current.setStrategyAvailability('rowTree', TREE_DATA_STRATEGY, props.treeData ? () => true : () => false);
   }, [privateApiRef, props.treeData]);
   const getGroupingColDef = React.useCallback(() => {
-    var _colDefOverride;
     const groupingColDefProp = props.groupingColDef;
     let colDefOverride;
     if (typeof groupingColDefProp === 'function') {
@@ -29,7 +28,7 @@ export const useGridTreeDataPreProcessors = (privateApiRef, props) => {
     } else {
       colDefOverride = groupingColDefProp;
     }
-    const _ref = (_colDefOverride = colDefOverride) != null ? _colDefOverride : {},
+    const _ref = colDefOverride ?? {},
       {
         hideDescendantCount
       } = _ref,

package/esm/internals/index.js

@@ -5,7 +5,6 @@ export { DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS } from '../constants/dataGridPro
 
 // eslint-disable-next-line import/export
 export { useGridColumnHeaders } from '../hooks/features/columnHeaders/useGridColumnHeaders';
-export { useGridColumnResize, columnResizeStateInitializer } from '../hooks/features/columnResize/useGridColumnResize';
 export { useGridColumnPinning, columnPinningStateInitializer } from '../hooks/features/columnPinning/useGridColumnPinning';
 export { useGridColumnPinningPreProcessors } from '../hooks/features/columnPinning/useGridColumnPinningPreProcessors';
 export { useGridColumnReorder, columnReorderStateInitializer } from '../hooks/features/columnReorder/useGridColumnReorder';

package/esm/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export const getReleaseInfo = () => {
-  const releaseInfo = "MTcwOTg1MjQwMDAwMA==";
+  const releaseInfo = "MTcxMTA1ODQwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat

package/esm/utils/tree/insertDataRowInTree.js

@@ -19,14 +19,13 @@ export const insertDataRowInTree = ({
 }) => {
   let parentNodeId = GRID_ROOT_GROUP_ID;
   for (let depth = 0; depth < path.length; depth += 1) {
-    var _childrenFromPath;
     const {
       key,
       field
     } = path[depth];
-    const fieldWithDefaultValue = field != null ? field : '__no_field__';
-    const keyWithDefaultValue = key != null ? key : '__no_key__';
-    const existingNodeIdWithPartialPath = (_childrenFromPath = tree[parentNodeId].childrenFromPath) == null || (_childrenFromPath = _childrenFromPath[fieldWithDefaultValue]) == null ? void 0 : _childrenFromPath[keyWithDefaultValue.toString()];
+    const fieldWithDefaultValue = field ?? '__no_field__';
+    const keyWithDefaultValue = key ?? '__no_key__';
+    const existingNodeIdWithPartialPath = tree[parentNodeId].childrenFromPath?.[fieldWithDefaultValue]?.[keyWithDefaultValue.toString()];
 
     // When we reach the last step of the path,
     // We need to create a node for the row passed to `insertNodeInTree`
@@ -41,7 +40,7 @@ export const insertDataRowInTree = ({
           parent: parentNodeId,
           groupingKey: key
         };
-        updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'insertChildren');
+        updatedGroupsManager?.addAction(parentNodeId, 'insertChildren');
         insertNodeInTree(leafNode, tree, treeDepths, previousTree);
       } else {
         const existingNodeWithPartialPath = tree[existingNodeIdWithPartialPath];
@@ -49,8 +48,8 @@ export const insertDataRowInTree = ({
         // If we already have an auto-generated group matching the partial path,
         // We replace it with the node from of data row passed to `insertNodeInTree`
         if (existingNodeWithPartialPath.type === 'group' && existingNodeWithPartialPath.isAutoGenerated) {
-          updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'removeChildren');
-          updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'insertChildren');
+          updatedGroupsManager?.addAction(parentNodeId, 'removeChildren');
+          updatedGroupsManager?.addAction(parentNodeId, 'insertChildren');
           updateGroupNodeIdAndAutoGenerated({
             tree,
             previousTree,
@@ -64,7 +63,7 @@ export const insertDataRowInTree = ({
         } else {
           // If we have another row matching the partial path, then there is a duplicate in the dataset.
           // We warn the user and skip the current row.
-          onDuplicatePath == null || onDuplicatePath(existingNodeIdWithPartialPath, id, path);
+          onDuplicatePath?.(existingNodeIdWithPartialPath, id, path);
         }
       }
     }
@@ -87,7 +86,7 @@ export const insertDataRowInTree = ({
         childrenFromPath: {},
         childrenExpanded: false
       };
-      updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'insertChildren');
+      updatedGroupsManager?.addAction(parentNodeId, 'insertChildren');
       insertNodeInTree(updateGroupDefaultExpansion(autoGeneratedGroupNode, defaultGroupingExpansionDepth, isGroupExpandedByDefault), tree, treeDepths, previousTree);
       parentNodeId = nodeId;
     }

package/esm/utils/tree/removeDataRowFromTree.js

@@ -19,7 +19,7 @@ const removeNodeAndCleanParent = ({
     });
   }
   const parentNode = tree[node.parent];
-  updatedGroupsManager == null || updatedGroupsManager.addAction(parentNode.id, 'removeChildren');
+  updatedGroupsManager?.addAction(parentNode.id, 'removeChildren');
   const shouldDeleteGroup = parentNode.id !== GRID_ROOT_GROUP_ID && parentNode.children.length === 0;
   if (shouldDeleteGroup) {
     if (parentNode.isAutoGenerated) {
@@ -45,8 +45,8 @@ const replaceDataGroupWithAutoGeneratedGroup = ({
   treeDepths,
   updatedGroupsManager
 }) => {
-  updatedGroupsManager == null || updatedGroupsManager.addAction(node.parent, 'removeChildren');
-  updatedGroupsManager == null || updatedGroupsManager.addAction(node.parent, 'insertChildren');
+  updatedGroupsManager?.addAction(node.parent, 'removeChildren');
+  updatedGroupsManager?.addAction(node.parent, 'insertChildren');
   updateGroupNodeIdAndAutoGenerated({
     previousTree: null,
     tree,

package/esm/utils/tree/sortRowTree.js

@@ -106,7 +106,7 @@ export const sortRowTree = params => {
   const rootList = List.from(sortedGroupedByParentRows.get(GRID_ROOT_GROUP_ID));
   rootList.forEach(node => {
     const children = sortedGroupedByParentRows.get(node.data);
-    if (children != null && children.length) {
+    if (children?.length) {
       node.insertAfter(List.from(children));
     }
   });

package/esm/utils/tree/updateRowTree.js

@@ -63,7 +63,7 @@ export const updateRowTree = params => {
         defaultGroupingExpansionDepth: params.defaultGroupingExpansionDepth
       });
     } else {
-      updatedGroupsManager == null || updatedGroupsManager.addAction(tree[id].parent, 'modifyChildren');
+      updatedGroupsManager?.addAction(tree[id].parent, 'modifyChildren');
     }
   }
 

package/esm/utils/tree/utils.js

@@ -37,22 +37,20 @@ export const updateGroupDefaultExpansion = (node, defaultGroupingExpansionDepth,
  * Insert a node in the tree
  */
 export const insertNodeInTree = (node, tree, treeDepths, previousTree) => {
-  var _treeDepths$node$dept;
   // 1. Insert node in the tree.
   tree[node.id] = node;
 
   // 2. Increment the `treeDepths` object for the node's depth.
-  treeDepths[node.depth] = ((_treeDepths$node$dept = treeDepths[node.depth]) != null ? _treeDepths$node$dept : 0) + 1;
+  treeDepths[node.depth] = (treeDepths[node.depth] ?? 0) + 1;
 
   // 3. Register the new node in its parent.
   const parentNode = tree[node.parent];
   if (node.type === 'group' || node.type === 'leaf') {
-    var _groupingField, _groupingKey, _parentNode$childrenF;
     // For groups and leaves,
     // Register the node from its parents `children` and `childrenFromPath` properties.
-    const groupingFieldName = (_groupingField = node.groupingField) != null ? _groupingField : '__no_field__';
-    const groupingKeyName = (_groupingKey = node.groupingKey) != null ? _groupingKey : '__no_key__';
-    const groupingField = (_parentNode$childrenF = parentNode.childrenFromPath) == null ? void 0 : _parentNode$childrenF[groupingFieldName];
+    const groupingFieldName = node.groupingField ?? '__no_field__';
+    const groupingKeyName = node.groupingKey ?? '__no_key__';
+    const groupingField = parentNode.childrenFromPath?.[groupingFieldName];
     if (previousTree !== null && previousTree[parentNode.id] === tree[parentNode.id]) {
       parentNode.children = [...parentNode.children, node.id];
     } else {
@@ -104,9 +102,8 @@ export const removeNodeFromTree = ({
   // For groups and leaves,
   // Unregister the node from its parents `children` and `childrenFromPath` properties.
   else {
-    var _groupingField2, _groupingKey2;
-    const groupingField = (_groupingField2 = node.groupingField) != null ? _groupingField2 : '__no_field__';
-    const groupingKey = (_groupingKey2 = node.groupingKey) != null ? _groupingKey2 : '__no_key__';
+    const groupingField = node.groupingField ?? '__no_field__';
+    const groupingKey = node.groupingKey ?? '__no_key__';
 
     // TODO rows v6: Can we avoid this linear complexity ?
     const children = parentNode.children.filter(childId => childId !== node.id);