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

package/node/internals/utils/getPinnedCellOffset.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getPinnedCellOffset = void 0;
+var _columns = require("../../hooks/features/columns");
+const getPinnedCellOffset = (pinnedPosition, computedWidth, columnIndex, columnPositions, dimensions) => {
+  const scrollbarWidth = dimensions.hasScrollY ? dimensions.scrollbarSize : 0;
+  let pinnedOffset;
+  switch (pinnedPosition) {
+    case _columns.GridPinnedColumnPosition.LEFT:
+      pinnedOffset = columnPositions[columnIndex];
+      break;
+    case _columns.GridPinnedColumnPosition.RIGHT:
+      pinnedOffset = dimensions.columnsTotalWidth - columnPositions[columnIndex] - computedWidth + scrollbarWidth;
+      break;
+    default:
+      pinnedOffset = 0;
+      break;
+  }
+  return pinnedOffset;
+};
+exports.getPinnedCellOffset = getPinnedCellOffset;

package/node/joy/joySlots.js

@@ -14,7 +14,6 @@ var _FormControl = _interopRequireDefault(require("@mui/joy/FormControl"));
 var _FormLabel = _interopRequireDefault(require("@mui/joy/FormLabel"));
 var _Button = _interopRequireDefault(require("@mui/joy/Button"));
 var _IconButton = _interopRequireDefault(require("@mui/joy/IconButton"));
-var _Switch = _interopRequireDefault(require("@mui/joy/Switch"));
 var _Select = _interopRequireDefault(require("@mui/joy/Select"));
 var _Option = _interopRequireDefault(require("@mui/joy/Option"));
 var _Box = _interopRequireDefault(require("@mui/joy/Box"));
@@ -32,10 +31,9 @@ const _excluded = ["touchRippleRef", "inputProps", "onChange", "color", "size",
   _excluded2 = ["onChange", "label", "placeholder", "value", "inputRef", "type", "size", "variant"],
   _excluded3 = ["startIcon", "color", "endIcon", "size", "sx", "variant"],
   _excluded4 = ["color", "size", "sx", "touchRippleRef"],
-  _excluded5 = ["name", "checkedIcon", "color", "disableRipple", "disableFocusRipple", "disableTouchRipple", "edge", "icon", "inputProps", "inputRef", "size", "sx", "onChange", "onClick"],
-  _excluded6 = ["open", "onOpen", "value", "onChange", "size", "color", "variant", "inputProps", "MenuProps", "inputRef", "error", "native", "fullWidth", "labelId"],
-  _excluded7 = ["native"],
-  _excluded8 = ["shrink", "variant", "sx"];
+  _excluded5 = ["open", "onOpen", "value", "onChange", "size", "color", "variant", "inputProps", "MenuProps", "inputRef", "error", "native", "fullWidth", "labelId"],
+  _excluded6 = ["native"],
+  _excluded7 = ["shrink", "variant", "sx"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function convertColor(color) {
@@ -162,43 +160,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(function IconButton(_ref4, ref)
     sx: sx
   }));
 });
-const Switch = /*#__PURE__*/React.forwardRef(function Switch(_ref5, ref) {
-  let {
-      name,
-      color: colorProp,
-      edge,
-      icon,
-      inputProps,
-      inputRef,
-      size,
-      sx,
-      onChange,
-      onClick
-    } = _ref5,
-    props = (0, _objectWithoutPropertiesLoose2.default)(_ref5, _excluded5);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Switch.default, (0, _extends2.default)({}, props, {
-    onChange: onChange,
-    size: convertSize(size),
-    color: convertColor(colorProp),
-    ref: ref,
-    slotProps: {
-      input: (0, _extends2.default)({}, inputProps, {
-        name,
-        onClick: onClick,
-        ref: inputRef
-      }),
-      thumb: {
-        children: icon
-      }
-    },
-    sx: [(0, _extends2.default)({}, edge === 'start' && {
-      ml: '-8px'
-    }, edge === 'end' && {
-      mr: '-8px'
-    }), ...(Array.isArray(sx) ? sx : [sx])]
-  }));
-});
-const Select = /*#__PURE__*/React.forwardRef((_ref6, ref) => {
+const Select = /*#__PURE__*/React.forwardRef((_ref5, ref) => {
   let {
       open,
       onOpen,
@@ -210,8 +172,8 @@ const Select = /*#__PURE__*/React.forwardRef((_ref6, ref) => {
       MenuProps,
       inputRef,
       labelId
-    } = _ref6,
-    props = (0, _objectWithoutPropertiesLoose2.default)(_ref6, _excluded6);
+    } = _ref5,
+    props = (0, _objectWithoutPropertiesLoose2.default)(_ref5, _excluded5);
   const handleChange = (event, newValue) => {
     if (event && onChange) {
       // Same as in https://github.com/mui/material-ui/blob/e5558282a8f36856aef1299f3a36f3235e92e770/packages/mui-material/src/Select/SelectInput.js#L288-L300
@@ -262,17 +224,17 @@ const Select = /*#__PURE__*/React.forwardRef((_ref6, ref) => {
     }
   }));
 });
-const Option = /*#__PURE__*/React.forwardRef((_ref7, ref) => {
-  let props = (0, _objectWithoutPropertiesLoose2.default)(_ref7, _excluded7);
+const Option = /*#__PURE__*/React.forwardRef((_ref6, ref) => {
+  let props = (0, _objectWithoutPropertiesLoose2.default)(_ref6, _excluded6);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, (0, _extends2.default)({}, props, {
     ref: ref
   }));
 });
-const InputLabel = /*#__PURE__*/React.forwardRef((_ref8, ref) => {
+const InputLabel = /*#__PURE__*/React.forwardRef((_ref7, ref) => {
   let {
       sx
-    } = _ref8,
-    props = (0, _objectWithoutPropertiesLoose2.default)(_ref8, _excluded8);
+    } = _ref7,
+    props = (0, _objectWithoutPropertiesLoose2.default)(_ref7, _excluded7);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_FormLabel.default, (0, _extends2.default)({}, props, {
     ref: ref,
     sx: sx
@@ -402,7 +364,6 @@ const joySlots = (0, _extends2.default)({}, _icons.default, {
   baseTextField: TextField,
   baseButton: Button,
   baseIconButton: IconButton,
-  baseSwitch: Switch,
   baseSelect: Select,
   baseSelectOption: Option,
   baseInputLabel: InputLabel,

package/node/locales/jaJP.js

@@ -36,10 +36,9 @@ const jaJPGrid = {
   toolbarExportPrint: '印刷',
   toolbarExportExcel: 'Excelダウンロード',
   // Columns management text
-  // columnsManagementSearchTitle: 'Search',
-  // columnsManagementNoColumns: 'No columns',
-  // columnsManagementShowHideAllText: 'Show/Hide All',
-
+  columnsManagementSearchTitle: '検索',
+  columnsManagementNoColumns: 'カラムなし',
+  columnsManagementShowHideAllText: 'すべて表示/非表示',
   // Filter panel text
   filterPanelAddFilter: 'フィルター追加',
   filterPanelRemoveAll: 'すべて削除',

package/node/material/index.js

@@ -10,7 +10,6 @@ var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
 var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 var _FormControl = _interopRequireDefault(require("@mui/material/FormControl"));
 var _Select = _interopRequireDefault(require("@mui/material/Select"));
-var _Switch = _interopRequireDefault(require("@mui/material/Switch"));
 var _Button = _interopRequireDefault(require("@mui/material/Button"));
 var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _InputAdornment = _interopRequireDefault(require("@mui/material/InputAdornment"));
@@ -63,7 +62,6 @@ const materialSlots = (0, _extends2.default)({}, iconSlots, {
   baseTextField: _TextField.default,
   baseFormControl: _FormControl.default,
   baseSelect: _Select.default,
-  baseSwitch: _Switch.default,
   baseButton: _Button.default,
   baseIconButton: _IconButton.default,
   baseInputAdornment: _InputAdornment.default,

package/node/models/api/index.js

@@ -156,15 +156,4 @@ Object.keys(_gridScrollApi).forEach(function (key) {
       return _gridScrollApi[key];
     }
   });
-});
-var _gridVirtualizationApi = require("./gridVirtualizationApi");
-Object.keys(_gridVirtualizationApi).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _gridVirtualizationApi[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _gridVirtualizationApi[key];
-    }
-  });
 });

package/node/utils/cellBorderUtils.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.shouldCellShowRightBorder = exports.shouldCellShowLeftBorder = void 0;
+var _gridColumnsInterfaces = require("../hooks/features/columns/gridColumnsInterfaces");
+const shouldCellShowRightBorder = (pinnedPosition, indexInSection, sectionLength, showCellVerticalBorderRootProp) => {
+  const isSectionLastCell = indexInSection === sectionLength - 1;
+  return showCellVerticalBorderRootProp && (pinnedPosition !== _gridColumnsInterfaces.GridPinnedColumnPosition.LEFT ? !isSectionLastCell : true) || pinnedPosition === _gridColumnsInterfaces.GridPinnedColumnPosition.LEFT && isSectionLastCell;
+};
+exports.shouldCellShowRightBorder = shouldCellShowRightBorder;
+const shouldCellShowLeftBorder = (pinnedPosition, indexInSection) => {
+  return pinnedPosition === _gridColumnsInterfaces.GridPinnedColumnPosition.RIGHT && indexInSection === 0;
+};
+exports.shouldCellShowLeftBorder = shouldCellShowLeftBorder;

package/node/utils/createSelector.js

@@ -7,7 +7,7 @@ exports.createSelectorMemoized = exports.createSelector = void 0;
 var _reselect = require("reselect");
 var _warning = require("./warning");
 const cache = new WeakMap();
-const missingInstanceIdWarning = (0, _warning.buildWarning)(['MUI X: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, e.g. `mySelector(apiRef)`, or pass the instance ID explicitly, e.g. `mySelector(state, apiRef.current.instanceId)`.']);
+const missingInstanceIdWarning = (0, _warning.buildWarning)(['MUI X: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, for example `mySelector(apiRef)`, or pass the instance ID explicitly, for example `mySelector(state, apiRef.current.instanceId)`.']);
 function checkIsAPIRef(value) {
   return 'current' in value && 'instanceId' in value.current;
 }

package/node/utils/domUtils.js

@@ -3,8 +3,19 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.findGridCellElementsFromCol = findGridCellElementsFromCol;
+exports.findGridCells = findGridCells;
+exports.findGridElement = findGridElement;
+exports.findGridHeader = findGridHeader;
+exports.findGroupHeaderElementsFromField = findGroupHeaderElementsFromField;
+exports.findHeaderElementFromField = findHeaderElementFromField;
+exports.findLeftPinnedCellsAfterCol = findLeftPinnedCellsAfterCol;
+exports.findLeftPinnedHeadersAfterCol = findLeftPinnedHeadersAfterCol;
 exports.findParentElementFromClassName = findParentElementFromClassName;
+exports.findRightPinnedCellsBeforeCol = findRightPinnedCellsBeforeCol;
+exports.findRightPinnedHeadersBeforeCol = findRightPinnedHeadersBeforeCol;
 exports.getActiveElement = void 0;
+exports.getFieldFromHeaderElem = getFieldFromHeaderElem;
 exports.getGridCellElement = getGridCellElement;
 exports.getGridColumnHeaderElement = getGridColumnHeaderElement;
 exports.getGridRowElement = getGridRowElement;
@@ -59,4 +70,148 @@ function isEventTargetInPortal(event) {
     return true;
   }
   return false;
+}
+function getFieldFromHeaderElem(colCellEl) {
+  return colCellEl.getAttribute('data-field');
+}
+function findHeaderElementFromField(elem, field) {
+  return elem.querySelector(`[data-field="${field}"]`);
+}
+function findGroupHeaderElementsFromField(elem, field) {
+  return Array.from(elem.querySelectorAll(`[data-fields*="|-${field}-|"]`) ?? []);
+}
+function findGridCellElementsFromCol(col, api) {
+  const root = findParentElementFromClassName(col, _gridClasses.gridClasses.root);
+  if (!root) {
+    throw new Error('MUI X: The root element is not found.');
+  }
+  const ariaColIndex = col.getAttribute('aria-colindex');
+  if (!ariaColIndex) {
+    return [];
+  }
+  const colIndex = Number(ariaColIndex) - 1;
+  const cells = [];
+  if (!api.virtualScrollerRef?.current) {
+    return [];
+  }
+  queryRows(api).forEach(rowElement => {
+    const rowId = rowElement.getAttribute('data-id');
+    if (!rowId) {
+      return;
+    }
+    let columnIndex = colIndex;
+    const cellColSpanInfo = api.unstable_getCellColSpanInfo(rowId, colIndex);
+    if (cellColSpanInfo && cellColSpanInfo.spannedByColSpan) {
+      columnIndex = cellColSpanInfo.leftVisibleCellIndex;
+    }
+    const cell = rowElement.querySelector(`[data-colindex="${columnIndex}"]`);
+    if (cell) {
+      cells.push(cell);
+    }
+  });
+  return cells;
+}
+function findGridElement(api, klass) {
+  return api.rootElementRef.current.querySelector(`.${_gridClasses.gridClasses[klass]}`);
+}
+const findPinnedCells = ({
+  api,
+  colIndex,
+  position,
+  filterFn
+}) => {
+  if (colIndex === null) {
+    return [];
+  }
+  const cells = [];
+  queryRows(api).forEach(rowElement => {
+    const rowId = rowElement.getAttribute('data-id');
+    if (!rowId) {
+      return;
+    }
+    rowElement.querySelectorAll(`.${_gridClasses.gridClasses[position === 'left' ? 'cell--pinnedLeft' : 'cell--pinnedRight']}`).forEach(cell => {
+      const currentColIndex = parseCellColIndex(cell);
+      if (currentColIndex !== null && filterFn(currentColIndex)) {
+        cells.push(cell);
+      }
+    });
+  });
+  return cells;
+};
+function findLeftPinnedCellsAfterCol(api, col) {
+  const colIndex = parseCellColIndex(col);
+  return findPinnedCells({
+    api,
+    colIndex,
+    position: 'left',
+    filterFn: index => index > colIndex
+  });
+}
+function findRightPinnedCellsBeforeCol(api, col) {
+  const colIndex = parseCellColIndex(col);
+  return findPinnedCells({
+    api,
+    colIndex,
+    position: 'right',
+    filterFn: index => index < colIndex
+  });
+}
+const findPinnedHeaders = ({
+  api,
+  colIndex,
+  position,
+  filterFn
+}) => {
+  if (!api.columnHeadersContainerRef?.current) {
+    return [];
+  }
+  if (colIndex === null) {
+    return [];
+  }
+  const elements = [];
+  api.columnHeadersContainerRef.current.querySelectorAll(`.${_gridClasses.gridClasses[position === 'left' ? 'columnHeader--pinnedLeft' : 'columnHeader--pinnedRight']}`).forEach(element => {
+    const currentColIndex = parseCellColIndex(element);
+    if (currentColIndex !== null && filterFn(currentColIndex)) {
+      elements.push(element);
+    }
+  });
+  return elements;
+};
+function findLeftPinnedHeadersAfterCol(api, col) {
+  const colIndex = parseCellColIndex(col);
+  return findPinnedHeaders({
+    api,
+    position: 'left',
+    colIndex,
+    filterFn: index => index > colIndex
+  });
+}
+function findRightPinnedHeadersBeforeCol(api, col) {
+  const colIndex = parseCellColIndex(col);
+  return findPinnedHeaders({
+    api,
+    position: 'right',
+    colIndex,
+    filterFn: index => index < colIndex
+  });
+}
+function findGridHeader(api, field) {
+  const headers = api.columnHeadersContainerRef.current;
+  return headers.querySelector(`:scope > div > [data-field="${field}"][role="columnheader"]`);
+}
+function findGridCells(api, field) {
+  const container = api.virtualScrollerRef.current;
+  return Array.from(container.querySelectorAll(`:scope > div > div > div > [data-field="${field}"][role="gridcell"]`));
+}
+function queryRows(api) {
+  return api.virtualScrollerRef.current.querySelectorAll(
+  // Use > to ignore rows from nested data grids (for example in detail panel)
+  `:scope > div > div > .${_gridClasses.gridClasses.row}`);
+}
+function parseCellColIndex(col) {
+  const ariaColIndex = col.getAttribute('aria-colindex');
+  if (!ariaColIndex) {
+    return null;
+  }
+  return Number(ariaColIndex) - 1;
 }

package/node/utils/keyboardUtils.js

@@ -18,7 +18,7 @@ const isEscapeKey = key => key === 'Escape';
 exports.isEscapeKey = isEscapeKey;
 const isTabKey = key => key === 'Tab';
 
-// Non printable keys have a name, e.g. "ArrowRight", see the whole list:
+// Non printable keys have a name, for example "ArrowRight", see the whole list:
 // https://developer.mozilla.org/en-US/docs/Web/API/UI_Events/Keyboard_event_key_values
 // So event.key.length === 1 is often enough.
 //

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "7.0.0-beta.6",
+  "version": "7.0.0",
   "description": "The community edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -37,14 +37,14 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.24.0",
-    "@mui/system": "^5.15.9",
-    "@mui/utils": "^5.15.9",
+    "@mui/system": "^5.15.14",
+    "@mui/utils": "^5.15.14",
     "clsx": "^2.1.0",
     "prop-types": "^15.8.1",
     "reselect": "^4.1.8"
   },
   "peerDependencies": {
-    "@mui/material": "^5.15.0",
+    "@mui/material": "^5.15.14",
     "react": "^17.0.0 || ^18.0.0",
     "react-dom": "^17.0.0 || ^18.0.0"
   },

package/utils/cellBorderUtils.d.ts

@@ -0,0 +1,3 @@
+import { GridPinnedColumnPosition } from '../hooks/features/columns/gridColumnsInterfaces';
+export declare const shouldCellShowRightBorder: (pinnedPosition: GridPinnedColumnPosition | undefined, indexInSection: number, sectionLength: number, showCellVerticalBorderRootProp: boolean) => boolean;
+export declare const shouldCellShowLeftBorder: (pinnedPosition: GridPinnedColumnPosition | undefined, indexInSection: number) => boolean;

package/utils/cellBorderUtils.js

@@ -0,0 +1,8 @@
+import { GridPinnedColumnPosition } from '../hooks/features/columns/gridColumnsInterfaces';
+export const shouldCellShowRightBorder = (pinnedPosition, indexInSection, sectionLength, showCellVerticalBorderRootProp) => {
+  const isSectionLastCell = indexInSection === sectionLength - 1;
+  return showCellVerticalBorderRootProp && (pinnedPosition !== GridPinnedColumnPosition.LEFT ? !isSectionLastCell : true) || pinnedPosition === GridPinnedColumnPosition.LEFT && isSectionLastCell;
+};
+export const shouldCellShowLeftBorder = (pinnedPosition, indexInSection) => {
+  return pinnedPosition === GridPinnedColumnPosition.RIGHT && indexInSection === 0;
+};

package/utils/createSelector.js

@@ -1,7 +1,7 @@
 import { createSelector as reselectCreateSelector } from 'reselect';
 import { buildWarning } from './warning';
 const cache = new WeakMap();
-const missingInstanceIdWarning = buildWarning(['MUI X: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, e.g. `mySelector(apiRef)`, or pass the instance ID explicitly, e.g. `mySelector(state, apiRef.current.instanceId)`.']);
+const missingInstanceIdWarning = buildWarning(['MUI X: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, for example `mySelector(apiRef)`, or pass the instance ID explicitly, for example `mySelector(state, apiRef.current.instanceId)`.']);
 function checkIsAPIRef(value) {
   return 'current' in value && 'instanceId' in value.current;
 }
@@ -16,7 +16,7 @@ export const createSelector = (a, b, c, d, e, f, ...rest) => {
   if (a && b && c && d && e && f) {
     selector = (stateOrApiRef, instanceIdParam) => {
       const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam != null ? instanceIdParam : isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID;
+      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
       const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
       const va = a(state, instanceId);
       const vb = b(state, instanceId);
@@ -28,7 +28,7 @@ export const createSelector = (a, b, c, d, e, f, ...rest) => {
   } else if (a && b && c && d && e) {
     selector = (stateOrApiRef, instanceIdParam) => {
       const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam != null ? instanceIdParam : isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID;
+      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
       const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
       const va = a(state, instanceId);
       const vb = b(state, instanceId);
@@ -39,7 +39,7 @@ export const createSelector = (a, b, c, d, e, f, ...rest) => {
   } else if (a && b && c && d) {
     selector = (stateOrApiRef, instanceIdParam) => {
       const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam != null ? instanceIdParam : isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID;
+      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
       const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
       const va = a(state, instanceId);
       const vb = b(state, instanceId);
@@ -49,7 +49,7 @@ export const createSelector = (a, b, c, d, e, f, ...rest) => {
   } else if (a && b && c) {
     selector = (stateOrApiRef, instanceIdParam) => {
       const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam != null ? instanceIdParam : isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID;
+      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
       const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
       const va = a(state, instanceId);
       const vb = b(state, instanceId);
@@ -58,7 +58,7 @@ export const createSelector = (a, b, c, d, e, f, ...rest) => {
   } else if (a && b) {
     selector = (stateOrApiRef, instanceIdParam) => {
       const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam != null ? instanceIdParam : isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID;
+      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
       const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
       const va = a(state, instanceId);
       return b(va);
@@ -75,7 +75,7 @@ export const createSelector = (a, b, c, d, e, f, ...rest) => {
 export const createSelectorMemoized = (...args) => {
   const selector = (stateOrApiRef, instanceId) => {
     const isAPIRef = checkIsAPIRef(stateOrApiRef);
-    const cacheKey = isAPIRef ? stateOrApiRef.current.instanceId : instanceId != null ? instanceId : DEFAULT_INSTANCE_ID;
+    const cacheKey = isAPIRef ? stateOrApiRef.current.instanceId : instanceId ?? DEFAULT_INSTANCE_ID;
     const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
     if (process.env.NODE_ENV !== 'production') {
       if (cacheKey.id === 'default') {
@@ -83,8 +83,8 @@ export const createSelectorMemoized = (...args) => {
       }
     }
     const cacheArgsInit = cache.get(cacheKey);
-    const cacheArgs = cacheArgsInit != null ? cacheArgsInit : new Map();
-    const cacheFn = cacheArgs == null ? void 0 : cacheArgs.get(args);
+    const cacheArgs = cacheArgsInit ?? new Map();
+    const cacheFn = cacheArgs?.get(args);
     if (cacheArgs && cacheFn) {
       // We pass the cache key because the called selector might have as
       // dependency another selector created with this `createSelector`.

package/utils/domUtils.d.ts

@@ -1,5 +1,7 @@
 /// <reference types="react" />
-import { GridRowId } from '../models/gridRows';
+import { gridClasses } from '../constants/gridClasses';
+import type { GridPrivateApiCommunity } from '../models/api/gridApiCommunity';
+import type { GridRowId } from '../models/gridRows';
 export declare function isOverflown(element: Element): boolean;
 export declare function findParentElementFromClassName(elem: Element, className: string): Element | null;
 export declare function getGridColumnHeaderElement(root: Element, field: string): HTMLDivElement | null;
@@ -10,3 +12,14 @@ export declare function getGridCellElement(root: Element, { id, field }: {
 }): HTMLDivElement | null;
 export declare const getActiveElement: (root?: Document | ShadowRoot) => Element | null;
 export declare function isEventTargetInPortal(event: React.SyntheticEvent): boolean;
+export declare function getFieldFromHeaderElem(colCellEl: Element): string;
+export declare function findHeaderElementFromField(elem: Element, field: string): HTMLDivElement;
+export declare function findGroupHeaderElementsFromField(elem: Element, field: string): Element[];
+export declare function findGridCellElementsFromCol(col: HTMLElement, api: GridPrivateApiCommunity): Element[];
+export declare function findGridElement(api: GridPrivateApiCommunity, klass: keyof typeof gridClasses): HTMLElement;
+export declare function findLeftPinnedCellsAfterCol(api: GridPrivateApiCommunity, col: HTMLElement): HTMLElement[];
+export declare function findRightPinnedCellsBeforeCol(api: GridPrivateApiCommunity, col: HTMLElement): HTMLElement[];
+export declare function findLeftPinnedHeadersAfterCol(api: GridPrivateApiCommunity, col: HTMLElement): HTMLElement[];
+export declare function findRightPinnedHeadersBeforeCol(api: GridPrivateApiCommunity, col: HTMLElement): HTMLElement[];
+export declare function findGridHeader(api: GridPrivateApiCommunity, field: string): Element | null;
+export declare function findGridCells(api: GridPrivateApiCommunity, field: string): Element[];