@mui/x-data-grid 5.8.0 → 5.11.0

package/node/components/cell/GridEditDateCell.js

@@ -14,6 +14,8 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 
 var React = _interopRequireWildcard(require("react"));
 
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _material = require("@mui/material");
 
 var _utils = require("@mui/material/utils");
@@ -26,7 +28,7 @@ var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "getValue", "inputProps", "isValidating", "isProcessingProps"];
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "getValue", "inputProps", "isValidating", "isProcessingProps", "onValueChange"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -50,7 +52,8 @@ function GridEditDateCell(props) {
     field,
     colDef,
     hasFocus,
-    inputProps
+    inputProps,
+    onValueChange
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const isDateTime = colDef.type === 'dateTime';
@@ -86,7 +89,7 @@ function GridEditDateCell(props) {
     classes: rootProps.classes
   };
   const classes = useUtilityClasses(ownerState);
-  const handleChange = React.useCallback(event => {
+  const handleChange = React.useCallback(async event => {
     const newFormattedDate = event.target.value;
     let newParsedDate;
 
@@ -105,6 +108,10 @@ function GridEditDateCell(props) {
       }
     }
 
+    if (onValueChange) {
+      await onValueChange(event, newParsedDate);
+    }
+
     setValueState({
       parsed: newParsedDate,
       formatted: newFormattedDate
@@ -114,7 +121,7 @@ function GridEditDateCell(props) {
       field,
       value: newParsedDate
     }, event);
-  }, [api, field, id]);
+  }, [api, field, id, onValueChange]);
   React.useEffect(() => {
     setValueState(state => {
       var _valueTransformed$par, _state$parsed;
@@ -144,6 +151,93 @@ function GridEditDateCell(props) {
   }, other));
 }
 
+process.env.NODE_ENV !== "production" ? GridEditDateCell.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+
+  /**
+   * GridApi that let you manipulate the grid.
+   * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)
+   */
+  api: _propTypes.default.any.isRequired,
+
+  /**
+   * The mode of the cell.
+   */
+  cellMode: _propTypes.default.oneOf(['edit', 'view']).isRequired,
+
+  /**
+   * The column of the row that the current cell belongs to.
+   */
+  colDef: _propTypes.default.object.isRequired,
+
+  /**
+   * The column field of the cell that triggered the event.
+   */
+  field: _propTypes.default.string.isRequired,
+
+  /**
+   * The cell value formatted with the column valueFormatter.
+   */
+  formattedValue: _propTypes.default.any,
+
+  /**
+   * Get the cell value of a row and field.
+   * @param {GridRowId} id The row id.
+   * @param {string} field The field.
+   * @returns {any} The cell value.
+   * @deprecated Use `params.row` to directly access the fields you want instead.
+   */
+  getValue: _propTypes.default.func.isRequired,
+
+  /**
+   * If true, the cell is the active element.
+   */
+  hasFocus: _propTypes.default.bool.isRequired,
+
+  /**
+   * The grid row id.
+   */
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
+
+  /**
+   * If true, the cell is editable.
+   */
+  isEditable: _propTypes.default.bool,
+  isProcessingProps: _propTypes.default.bool,
+  isValidating: _propTypes.default.bool,
+
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: _propTypes.default.func,
+
+  /**
+   * The row model of the row that the current cell belongs to.
+   */
+  row: _propTypes.default.object.isRequired,
+
+  /**
+   * The node of the row that the current cell belongs to.
+   */
+  rowNode: _propTypes.default.object.isRequired,
+
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: _propTypes.default.oneOf([-1, 0]).isRequired,
+
+  /**
+   * The cell value, but if the column has valueGetter, use getValue.
+   */
+  value: _propTypes.default.any
+} : void 0;
+
 const renderEditDateCell = params => /*#__PURE__*/(0, _jsxRuntime.jsx)(GridEditDateCell, (0, _extends2.default)({}, params));
 
 exports.renderEditDateCell = renderEditDateCell;

package/node/components/cell/GridEditInputCell.js

@@ -34,7 +34,7 @@ var _GridFilterInputValue = require("../panel/filterPanel/GridFilterInputValue")
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "getValue", "isValidating", "debounceMs", "isProcessingProps"];
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "getValue", "isValidating", "debounceMs", "isProcessingProps", "onValueChange"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -76,7 +76,8 @@ function GridEditInputCell(props) {
     colDef,
     hasFocus,
     debounceMs = (_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.newEditingApi ? 200 : _GridFilterInputValue.SUBMIT_FILTER_STROKE_TIME,
-    isProcessingProps
+    isProcessingProps,
+    onValueChange
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const inputRef = React.useRef();
@@ -85,8 +86,13 @@ function GridEditInputCell(props) {
     classes: rootProps.classes
   };
   const classes = useUtilityClasses(ownerState);
-  const handleChange = React.useCallback(event => {
+  const handleChange = React.useCallback(async event => {
     const newValue = event.target.value;
+
+    if (onValueChange) {
+      await onValueChange(event, newValue);
+    }
+
     setValueState(newValue);
     api.setEditCellValue({
       id,
@@ -94,7 +100,7 @@ function GridEditInputCell(props) {
       value: newValue,
       debounceMs
     }, event);
-  }, [api, debounceMs, field, id]);
+  }, [api, debounceMs, field, id, onValueChange]);
   React.useEffect(() => {
     setValueState(value);
   }, [value]);
@@ -145,7 +151,7 @@ process.env.NODE_ENV !== "production" ? GridEditInputCell.propTypes = {
   /**
    * The cell value formatted with the column valueFormatter.
    */
-  formattedValue: _propTypes.default.any.isRequired,
+  formattedValue: _propTypes.default.any,
 
   /**
    * Get the cell value of a row and field.
@@ -173,6 +179,14 @@ process.env.NODE_ENV !== "production" ? GridEditInputCell.propTypes = {
   isProcessingProps: _propTypes.default.bool,
   isValidating: _propTypes.default.bool,
 
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: _propTypes.default.func,
+
   /**
    * The row model of the row that the current cell belongs to.
    */
@@ -181,7 +195,17 @@ process.env.NODE_ENV !== "production" ? GridEditInputCell.propTypes = {
   /**
    * The node of the row that the current cell belongs to.
    */
-  rowNode: _propTypes.default.object.isRequired
+  rowNode: _propTypes.default.object.isRequired,
+
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: _propTypes.default.oneOf([-1, 0]).isRequired,
+
+  /**
+   * The cell value, but if the column has valueGetter, use getValue.
+   */
+  value: _propTypes.default.any
 } : void 0;
 
 const renderEditInputCell = params => /*#__PURE__*/(0, _jsxRuntime.jsx)(GridEditInputCell, (0, _extends2.default)({}, params));

package/node/components/cell/GridEditSingleSelectCell.js

@@ -26,26 +26,29 @@ var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 
 var _gridEditRowModel = require("../../models/gridEditRowModel");
 
-var _gridEvents = require("../../models/events/gridEvents");
+var _filterPanelUtils = require("../panel/filterPanel/filterPanelUtils");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "getValue", "hasFocus", "isValidating", "isProcessingProps", "error"];
+const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "getValue", "hasFocus", "isValidating", "isProcessingProps", "error", "onValueChange"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const renderSingleSelectOptions = option => typeof option === 'object' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.default, {
-  value: option.value,
-  children: option.label
-}, option.value) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.default, {
-  value: option,
-  children: option
-}, option);
+const renderSingleSelectOptions = (option, OptionComponent) => {
+  const isOptionTypeObject = typeof option === 'object';
+  const key = isOptionTypeObject ? option.value : option;
+  const value = isOptionTypeObject ? option.value : option;
+  const content = isOptionTypeObject ? option.label : option;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(OptionComponent, {
+    value: value,
+    children: content
+  }, key);
+};
 
 function GridEditSingleSelectCell(props) {
-  var _rootProps$components;
+  var _rootProps$components, _baseSelectProps$nati, _rootProps$components2;
 
   const {
     id,
@@ -55,13 +58,16 @@ function GridEditSingleSelectCell(props) {
     row,
     colDef,
     hasFocus,
-    error
+    error,
+    onValueChange
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const ref = React.useRef();
   const inputRef = React.useRef();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const [open, setOpen] = React.useState(rootProps.editMode === 'cell');
+  const baseSelectProps = ((_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseSelect) || {};
+  const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : false;
   let valueOptionsFormatted;
 
   if (typeof colDef.valueOptions === 'function') {
@@ -96,11 +102,18 @@ function GridEditSingleSelectCell(props) {
     var _rootProps$experiment;
 
     setOpen(false);
-    const target = event.target;
+    const target = event.target; // NativeSelect casts the value to a string.
+
+    const formattedTargetValue = (0, _filterPanelUtils.getValueFromValueOptions)(target.value, valueOptionsFormatted);
+
+    if (onValueChange) {
+      await onValueChange(event, formattedTargetValue);
+    }
+
     const isValid = await api.setEditCellValue({
       id,
       field,
-      value: target.value
+      value: formattedTargetValue
     }, event);
 
     if ((_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.newEditingApi) {
@@ -123,7 +136,7 @@ function GridEditSingleSelectCell(props) {
       if (event.key) {
         // TODO v6: remove once we stop ignoring events fired from portals
         const params = api.getCellParams(id, field);
-        api.publishEvent(_gridEvents.GridEvents.cellNavigationKeyDown, params, event);
+        api.publishEvent('cellNavigationKeyDown', params, event);
       }
     }
   };
@@ -169,9 +182,10 @@ function GridEditSingleSelectCell(props) {
       onClose: handleClose
     },
     error: error,
+    native: isSelectNative,
     fullWidth: true
-  }, other, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseSelect, {
-    children: valueOptionsFormatted.map(renderSingleSelectOptions)
+  }, other, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.baseSelect, {
+    children: valueOptionsFormatted.map(valueOptions => renderSingleSelectOptions(valueOptions, isSelectNative ? 'option' : _MenuItem.default))
   }));
 }
 
@@ -205,7 +219,7 @@ process.env.NODE_ENV !== "production" ? GridEditSingleSelectCell.propTypes = {
   /**
    * The cell value formatted with the column valueFormatter.
    */
-  formattedValue: _propTypes.default.any.isRequired,
+  formattedValue: _propTypes.default.any,
 
   /**
    * Get the cell value of a row and field.
@@ -233,6 +247,14 @@ process.env.NODE_ENV !== "production" ? GridEditSingleSelectCell.propTypes = {
   isProcessingProps: _propTypes.default.bool,
   isValidating: _propTypes.default.bool,
 
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {SelectChangeEvent<any>} event The event source of the callback.
+   * @param {any} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: _propTypes.default.func,
+
   /**
    * The row model of the row that the current cell belongs to.
    */
@@ -241,7 +263,17 @@ process.env.NODE_ENV !== "production" ? GridEditSingleSelectCell.propTypes = {
   /**
    * The node of the row that the current cell belongs to.
    */
-  rowNode: _propTypes.default.object.isRequired
+  rowNode: _propTypes.default.object.isRequired,
+
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: _propTypes.default.oneOf([-1, 0]).isRequired,
+
+  /**
+   * The cell value, but if the column has valueGetter, use getValue.
+   */
+  value: _propTypes.default.any
 } : void 0;
 
 const renderEditSingleSelectCell = params => /*#__PURE__*/(0, _jsxRuntime.jsx)(GridEditSingleSelectCell, (0, _extends2.default)({}, params));

package/node/components/cell/index.js

@@ -17,6 +17,32 @@ Object.keys(_GridCell).forEach(function (key) {
   });
 });
 
+var _GridEditBooleanCell = require("./GridEditBooleanCell");
+
+Object.keys(_GridEditBooleanCell).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _GridEditBooleanCell[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _GridEditBooleanCell[key];
+    }
+  });
+});
+
+var _GridEditDateCell = require("./GridEditDateCell");
+
+Object.keys(_GridEditDateCell).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _GridEditDateCell[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _GridEditDateCell[key];
+    }
+  });
+});
+
 var _GridEditInputCell = require("./GridEditInputCell");
 
 Object.keys(_GridEditInputCell).forEach(function (key) {

package/node/components/columnHeaders/GridColumnHeaderItem.js

@@ -19,8 +19,6 @@ var _material = require("@mui/material");
 
 var _utils = require("@mui/material/utils");
 
-var _events = require("../../models/events");
-
 var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
 
 var _GridColumnHeaderSortIcon = require("./GridColumnHeaderSortIcon");
@@ -114,25 +112,25 @@ function GridColumnHeaderItem(props) {
     apiRef.current.publishEvent(eventName, apiRef.current.getColumnHeaderParams(column.field), event);
   }, [apiRef, column.field]);
   const mouseEventsHandlers = {
-    onClick: publish(_events.GridEvents.columnHeaderClick),
-    onDoubleClick: publish(_events.GridEvents.columnHeaderDoubleClick),
-    onMouseOver: publish(_events.GridEvents.columnHeaderOver),
+    onClick: publish('columnHeaderClick'),
+    onDoubleClick: publish('columnHeaderDoubleClick'),
+    onMouseOver: publish('columnHeaderOver'),
     // TODO remove as it's not used
-    onMouseOut: publish(_events.GridEvents.columnHeaderOut),
+    onMouseOut: publish('columnHeaderOut'),
     // TODO remove as it's not used
-    onMouseEnter: publish(_events.GridEvents.columnHeaderEnter),
+    onMouseEnter: publish('columnHeaderEnter'),
     // TODO remove as it's not used
-    onMouseLeave: publish(_events.GridEvents.columnHeaderLeave),
+    onMouseLeave: publish('columnHeaderLeave'),
     // TODO remove as it's not used
-    onKeyDown: publish(_events.GridEvents.columnHeaderKeyDown),
-    onFocus: publish(_events.GridEvents.columnHeaderFocus),
-    onBlur: publish(_events.GridEvents.columnHeaderBlur)
+    onKeyDown: publish('columnHeaderKeyDown'),
+    onFocus: publish('columnHeaderFocus'),
+    onBlur: publish('columnHeaderBlur')
   };
   const draggableEventHandlers = {
-    onDragStart: publish(_events.GridEvents.columnHeaderDragStart),
-    onDragEnter: publish(_events.GridEvents.columnHeaderDragEnter),
-    onDragOver: publish(_events.GridEvents.columnHeaderDragOver),
-    onDragEnd: publish(_events.GridEvents.columnHeaderDragEnd)
+    onDragStart: publish('columnHeaderDragStart'),
+    onDragEnter: publish('columnHeaderDragEnter'),
+    onDragOver: publish('columnHeaderDragOver'),
+    onDragEnd: publish('columnHeaderDragEnd')
   };
   const removeLastBorderRight = isLastColumn && hasScrollX && !hasScrollY;
   const showRightBorder = !isLastColumn ? rootProps.showColumnRightBorder : !removeLastBorderRight && !extendRowFullWidth;
@@ -142,7 +140,7 @@ function GridColumnHeaderItem(props) {
   });
   const classes = useUtilityClasses(ownerState);
   const width = column.computedWidth;
-  let ariaSort;
+  let ariaSort = 'none';
 
   if (sortDirection != null) {
     ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
@@ -179,14 +177,11 @@ function GridColumnHeaderItem(props) {
 
     if (hasFocus && !columnMenuState.open) {
       const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
-
-      if (focusableElement) {
-        focusableElement.focus();
-      } else {
-        headerCellRef.current.focus();
-      }
+      const elementToFocus = focusableElement || headerCellRef.current;
+      elementToFocus == null ? void 0 : elementToFocus.focus();
+      apiRef.current.columnHeadersContainerElementRef.current.scrollLeft = 0;
     }
-  });
+  }, [apiRef, hasFocus]);
   const headerClassName = typeof column.headerClassName === 'function' ? column.headerClassName({
     field: column.field,
     colDef: column
@@ -224,7 +219,7 @@ function GridColumnHeaderItem(props) {
       resizable: !rootProps.disableColumnResize && !!column.resizable,
       resizing: isResizing,
       height: headerHeight,
-      onMouseDown: publish(_events.GridEvents.columnSeparatorMouseDown),
+      onMouseDown: publish('columnSeparatorMouseDown'),
       side: separatorSide
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridColumnHeaderMenu.GridColumnHeaderMenu, {
       columnMenuId: columnMenuId,

package/node/components/columnHeaders/GridColumnHeaders.js

@@ -25,7 +25,7 @@ var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["innerRef", "className"];
+const _excluded = ["className"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 

package/node/components/columnSelection/GridCellCheckboxRenderer.js

@@ -19,8 +19,6 @@ var _material = require("@mui/material");
 
 var _utils = require("@mui/material/utils");
 
-var _events = require("../../models/events");
-
 var _keyboardUtils = require("../../utils/keyboardUtils");
 
 var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
@@ -31,7 +29,7 @@ var _gridClasses = require("../../constants/gridClasses");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["field", "id", "value", "formattedValue", "row", "rowNode", "colDef", "isEditable", "cellMode", "hasFocus", "tabIndex", "getValue"];
+const _excluded = ["field", "id", "value", "formattedValue", "row", "rowNode", "colDef", "isEditable", "cellMode", "hasFocus", "tabIndex", "getValue", "api"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -74,7 +72,7 @@ const GridCellCheckboxForwardRef = /*#__PURE__*/React.forwardRef(function GridCe
       value: event.target.checked,
       id
     };
-    apiRef.current.publishEvent(_events.GridEvents.rowSelectionCheckboxChange, params, event);
+    apiRef.current.publishEvent('rowSelectionCheckboxChange', params, event);
   };
 
   React.useLayoutEffect(() => {
@@ -99,7 +97,7 @@ const GridCellCheckboxForwardRef = /*#__PURE__*/React.forwardRef(function GridCe
     }
 
     if ((0, _keyboardUtils.isNavigationKey)(event.key) && !event.shiftKey) {
-      apiRef.current.publishEvent(_events.GridEvents.cellNavigationKeyDown, props, event);
+      apiRef.current.publishEvent('cellNavigationKeyDown', props, event);
     }
   }, [apiRef, props]);
   const isSelectable = !rootProps.isRowSelectable || rootProps.isRowSelectable(apiRef.current.getRowParams(id));
@@ -126,6 +124,12 @@ process.env.NODE_ENV !== "production" ? GridCellCheckboxForwardRef.propTypes = {
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
 
+  /**
+   * GridApi that let you manipulate the grid.
+   * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)
+   */
+  api: _propTypes.default.any.isRequired,
+
   /**
    * The mode of the cell.
    */
@@ -141,10 +145,21 @@ process.env.NODE_ENV !== "production" ? GridCellCheckboxForwardRef.propTypes = {
    */
   field: _propTypes.default.string.isRequired,
 
+  /**
+   * A ref allowing to set imperative focus.
+   * It can be passed to the element that should receive focus.
+   * @ignore - do not document.
+   */
+  focusElementRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
+    current: _propTypes.default.shape({
+      focus: _propTypes.default.func.isRequired
+    })
+  })]),
+
   /**
    * The cell value formatted with the column valueFormatter.
    */
-  formattedValue: _propTypes.default.any.isRequired,
+  formattedValue: _propTypes.default.any,
 
   /**
    * Get the cell value of a row and field.
@@ -188,7 +203,7 @@ process.env.NODE_ENV !== "production" ? GridCellCheckboxForwardRef.propTypes = {
   /**
    * The cell value, but if the column has valueGetter, use getValue.
    */
-  value: _propTypes.default.any.isRequired
+  value: _propTypes.default.any
 } : void 0;
 const GridCellCheckboxRenderer = /*#__PURE__*/React.memo(GridCellCheckboxForwardRef);
 exports.GridCellCheckboxRenderer = GridCellCheckboxRenderer;

package/node/components/columnSelection/GridHeaderCheckbox.js

@@ -17,8 +17,6 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _material = require("@mui/material");
 
-var _events = require("../../models/events");
-
 var _useGridSelector = require("../../hooks/utils/useGridSelector");
 
 var _gridFocusStateSelector = require("../../hooks/features/focus/gridFocusStateSelector");
@@ -103,7 +101,7 @@ const GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderChec
     const params = {
       value: event.target.checked
     };
-    apiRef.current.publishEvent(_events.GridEvents.headerSelectionCheckboxChange, params);
+    apiRef.current.publishEvent('headerSelectionCheckboxChange', params);
   };
 
   const tabIndex = tabIndexState !== null && tabIndexState.field === props.field ? 0 : -1;
@@ -117,21 +115,21 @@ const GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderChec
   const handleKeyDown = React.useCallback(event => {
     if (event.key === ' ') {
       // imperative toggle the checkbox because Space is disable by some preventDefault
-      apiRef.current.publishEvent(_events.GridEvents.headerSelectionCheckboxChange, {
+      apiRef.current.publishEvent('headerSelectionCheckboxChange', {
         value: !isChecked
       });
     } // TODO v6 remove columnHeaderNavigationKeyDown events which are not used internally anymore
 
 
     if ((0, _keyboardUtils.isNavigationKey)(event.key) && !event.shiftKey) {
-      apiRef.current.publishEvent(_events.GridEvents.columnHeaderNavigationKeyDown, props, event);
+      apiRef.current.publishEvent('columnHeaderNavigationKeyDown', props, event);
     }
   }, [apiRef, props, isChecked]);
   const handleSelectionChange = React.useCallback(() => {
     forceUpdate(p => !p);
   }, []);
   React.useEffect(() => {
-    return apiRef.current.subscribeEvent(_events.GridEvents.selectionChange, handleSelectionChange);
+    return apiRef.current.subscribeEvent('selectionChange', handleSelectionChange);
   }, [apiRef, handleSelectionChange]);
   const label = apiRef.current.getLocaleText(isChecked ? 'checkboxSelectionUnselectAllRows' : 'checkboxSelectionSelectAllRows');
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.components.BaseCheckbox, (0, _extends2.default)({

package/node/components/containers/GridFooterContainer.js

@@ -13,6 +13,8 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 
 var React = _interopRequireWildcard(require("react"));
 
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _clsx = _interopRequireDefault(require("clsx"));
 
 var _material = require("@mui/material");
@@ -73,4 +75,11 @@ const GridFooterContainer = /*#__PURE__*/React.forwardRef(function GridFooterCon
     className: (0, _clsx.default)(classes.root, className)
   }, other));
 });
-exports.GridFooterContainer = GridFooterContainer;
+exports.GridFooterContainer = GridFooterContainer;
+process.env.NODE_ENV !== "production" ? GridFooterContainer.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object])
+} : void 0;