@mui/x-data-grid 8.0.0-beta.1 → 8.0.0-beta.3

package/modern/constants/gridClasses.js

@@ -2,4 +2,4 @@ import { unstable_generateUtilityClasses as generateUtilityClasses, unstable_gen
 export function getDataGridUtilityClass(slot) {
   return generateUtilityClass('MuiDataGrid', slot);
 }
-export const gridClasses = generateUtilityClasses('MuiDataGrid', ['actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'autoHeight', 'autosizing', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--lastUnpinned', 'columnHeader--siblingFocused', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'container--top', 'container--bottom', 'detailPanel', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--header', 'scrollbarFiller--borderTop', 'scrollbarFiller--borderBottom', 'scrollbarFiller--pinnedRight', 'selectedRowCount', 'sortIcon', 'shadowScrollArea', 'toolbarContainer', 'toolbarFilterList', 'toolbarPromptControl', 'toolbarPromptControl--recording', 'toolbarPromptControlRecordingIndicator', 'toolbarPromptControlRecordButton', 'toolbarPromptControlSendButton', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom']);
+export const gridClasses = generateUtilityClasses('MuiDataGrid', ['actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'autoHeight', 'autosizing', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--lastUnpinned', 'columnHeader--siblingFocused', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'container--top', 'container--bottom', 'detailPanel', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--header', 'scrollbarFiller--borderTop', 'scrollbarFiller--borderBottom', 'scrollbarFiller--pinnedRight', 'selectedRowCount', 'sortIcon', 'shadowScrollArea', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarPromptControl', 'toolbarPromptControl--recording', 'toolbarPromptControlRecordingIndicator', 'toolbarPromptControlRecordButton', 'toolbarPromptControlSendButton', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom']);

package/modern/hooks/core/gridCoreSelector.d.ts

@@ -3,4 +3,4 @@ import { GridStateCommunity } from "../../models/gridStateCommunity.js";
  * Get the theme state
  * @category Core
  */
-export declare const gridIsRtlSelector: import("../..").OutputSelector<GridStateCommunity, unknown, boolean>;
+export declare const gridIsRtlSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, boolean>;

package/modern/hooks/core/gridPropsSelectors.d.ts

@@ -6,4 +6,4 @@ import type { GridRowId } from '../../models/gridRows';
  * @param {GridRowModel} row - The row to get the id for
  * @returns {GridRowId} The row id
  */
-export declare const gridRowIdSelector: import("../..").OutputSelector<GridStateCommunity, import("../..").GridValidRowModel, GridRowId>;
+export declare const gridRowIdSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridValidRowModel, GridRowId>;

package/modern/hooks/features/clipboard/useGridClipboard.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { useGridApiOptionHandler, useGridNativeEventListener } from "../../utils/index.js";
+import { useGridEventPriority, useGridNativeEventListener } from "../../utils/index.js";
 import { gridFocusCellSelector } from "../focus/gridFocusStateSelector.js";
 import { serializeCellValue } from "../export/serializers/csvSerializer.js";
 import { isCopyShortcut } from "../../../utils/keyboardUtils.js";
@@ -93,5 +93,5 @@ export const useGridClipboard = (apiRef, props) => {
     }
   }, [apiRef, ignoreValueFormatter, clipboardCopyCellDelimiter]);
   useGridNativeEventListener(apiRef, () => apiRef.current.rootElementRef.current, 'keydown', handleCopy);
-  useGridApiOptionHandler(apiRef, 'clipboardCopy', props.onClipboardCopy);
+  useGridEventPriority(apiRef, 'clipboardCopy', props.onClipboardCopy);
 };

package/modern/hooks/features/columnGrouping/gridColumnGroupsSelector.d.ts

@@ -3,10 +3,10 @@ import { GridStateCommunity } from "../../../models/gridStateCommunity.js";
  * @category ColumnGrouping
  * @ignore - do not document.
  */
-export declare const gridColumnGroupingSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState>;
-export declare const gridColumnGroupsUnwrappedModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, {
+export declare const gridColumnGroupingSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, import("@mui/x-data-grid").GridColumnsGroupingState>;
+export declare const gridColumnGroupsUnwrappedModelSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsGroupingState, {
   [columnField: string]: string[];
 }>;
-export declare const gridColumnGroupsLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridColumnGroupLookup>;
-export declare const gridColumnGroupsHeaderStructureSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridGroupingStructure[][]>;
-export declare const gridColumnGroupsHeaderMaxDepthSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, number>;
+export declare const gridColumnGroupsLookupSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridColumnGroupLookup>;
+export declare const gridColumnGroupsHeaderStructureSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridGroupingStructure[][]>;
+export declare const gridColumnGroupsHeaderMaxDepthSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsGroupingState, number>;

package/modern/hooks/features/columnGrouping/gridColumnGroupsUtils.js

@@ -1,5 +1,5 @@
+import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
 import { isLeaf } from "../../../models/gridColumnGrouping.js";
-import { isDeepEqual } from "../../../utils/utils.js";
 // This is the recurrence function that help writing `unwrapGroupingColumnModel()`
 const recurrentUnwrapGroupingColumnModel = (columnGroupNode, parents, unwrappedGroupingModelToComplete) => {
   if (isLeaf(columnGroupNode)) {

package/modern/hooks/features/columnGrouping/useGridColumnGrouping.js

@@ -6,7 +6,7 @@ import { isLeaf } from "../../../models/gridColumnGrouping.js";
 import { gridColumnGroupsLookupSelector, gridColumnGroupsUnwrappedModelSelector } from "./gridColumnGroupsSelector.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { getColumnGroupsHeaderStructure, unwrapGroupingColumnModel } from "./gridColumnGroupsUtils.js";
-import { useGridApiEventHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent } from "../../utils/useGridEvent.js";
 import { gridColumnFieldsSelector, gridVisibleColumnFieldsSelector } from "../columns/index.js";
 const createGroupLookup = columnGroupingModel => {
   let groupLookup = {};
@@ -114,11 +114,11 @@ export const useGridColumnGrouping = (apiRef, props) => {
       });
     });
   }, [apiRef]);
-  useGridApiEventHandler(apiRef, 'columnIndexChange', handleColumnIndexChange);
-  useGridApiEventHandler(apiRef, 'columnsChange', () => {
+  useGridEvent(apiRef, 'columnIndexChange', handleColumnIndexChange);
+  useGridEvent(apiRef, 'columnsChange', () => {
     updateColumnGroupingState(props.columnGroupingModel);
   });
-  useGridApiEventHandler(apiRef, 'columnVisibilityModelChange', () => {
+  useGridEvent(apiRef, 'columnVisibilityModelChange', () => {
     updateColumnGroupingState(props.columnGroupingModel);
   });
 

package/modern/hooks/features/columnHeaders/useGridColumnHeaders.js

@@ -5,7 +5,7 @@ import { styled } from '@mui/material/styles';
 import { useGridSelector } from "../../utils/index.js";
 import { useGridRootProps } from "../../utils/useGridRootProps.js";
 import { useGridPrivateApiContext } from "../../utils/useGridPrivateApiContext.js";
-import { useGridApiEventHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent } from "../../utils/useGridEvent.js";
 import { GridColumnHeaderItem } from "../../../components/columnHeaders/GridColumnHeaderItem.js";
 import { gridColumnsTotalWidthSelector, gridGroupHeaderHeightSelector, gridHasFillerSelector, gridHeaderHeightSelector, gridVerticalScrollbarWidthSelector } from "../dimensions/gridDimensionsSelectors.js";
 import { gridRenderContextColumnsSelector } from "../virtualization/index.js";
@@ -73,10 +73,10 @@ export const useGridColumnHeaders = props => {
       lastColumnIndex: visibleColumns.length
     } : null;
   }, [pinnedColumns.right.length, visibleColumns.length]);
-  useGridApiEventHandler(apiRef, 'columnResizeStart', handleColumnResizeStart);
-  useGridApiEventHandler(apiRef, 'columnResizeStop', handleColumnResizeStop);
-  useGridApiEventHandler(apiRef, 'columnHeaderDragStart', handleColumnReorderStart);
-  useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', handleColumnReorderStop);
+  useGridEvent(apiRef, 'columnResizeStart', handleColumnResizeStart);
+  useGridEvent(apiRef, 'columnResizeStop', handleColumnResizeStop);
+  useGridEvent(apiRef, 'columnHeaderDragStart', handleColumnReorderStart);
+  useGridEvent(apiRef, 'columnHeaderDragEnd', handleColumnReorderStop);
 
   // Helper for computation common between getColumnHeaders and getColumnGroupHeaders
   const getColumnsToRender = params => {

package/modern/hooks/features/columnMenu/columnMenuSelector.d.ts

@@ -1,2 +1,2 @@
 import { GridStateCommunity } from "../../../models/gridStateCommunity.js";
-export declare const gridColumnMenuSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, import("./columnMenuInterfaces").GridColumnMenuState>;
+export declare const gridColumnMenuSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, import("@mui/x-data-grid").GridColumnMenuState>;

package/modern/hooks/features/columnMenu/useGridColumnMenu.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { useGridLogger, useGridApiMethod, useGridApiEventHandler } from "../../utils/index.js";
+import { useGridLogger, useGridApiMethod, useGridEvent } from "../../utils/index.js";
 import { gridColumnMenuSelector } from "./columnMenuSelector.js";
 import { gridColumnLookupSelector, gridColumnVisibilityModelSelector, gridColumnFieldsSelector } from "../columns/gridColumnsSelector.js";
 export const columnMenuStateInitializer = state => _extends({}, state, {
@@ -98,7 +98,7 @@ export const useGridColumnMenu = apiRef => {
     toggleColumnMenu
   };
   useGridApiMethod(apiRef, columnMenuApi, 'public');
-  useGridApiEventHandler(apiRef, 'columnResizeStart', hideColumnMenu);
-  useGridApiEventHandler(apiRef, 'virtualScrollerWheel', apiRef.current.hideColumnMenu);
-  useGridApiEventHandler(apiRef, 'virtualScrollerTouchMove', apiRef.current.hideColumnMenu);
+  useGridEvent(apiRef, 'columnResizeStart', hideColumnMenu);
+  useGridEvent(apiRef, 'virtualScrollerWheel', apiRef.current.hideColumnMenu);
+  useGridEvent(apiRef, 'virtualScrollerTouchMove', apiRef.current.hideColumnMenu);
 };

package/modern/hooks/features/columnResize/columnResizeSelector.d.ts

@@ -1,3 +1,3 @@
 import { GridStateCommunity } from "../../../models/gridStateCommunity.js";
-export declare const gridColumnResizeSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, import("./columnResizeState").GridColumnResizeState>;
-export declare const gridResizingColumnFieldSelector: import("../../..").OutputSelector<GridStateCommunity, import("./columnResizeState").GridColumnResizeState, string>;
+export declare const gridColumnResizeSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, import("@mui/x-data-grid").GridColumnResizeState>;
+export declare const gridResizingColumnFieldSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnResizeState, string>;

package/modern/hooks/features/columnResize/useGridColumnResize.js

@@ -7,7 +7,7 @@ import { useRtl } from '@mui/system/RtlProvider';
 import { findGridCellElementsFromCol, findGridElement, findLeftPinnedCellsAfterCol, findRightPinnedCellsBeforeCol, getFieldFromHeaderElem, findHeaderElementFromField, getFieldsFromGroupHeaderElem, findGroupHeaderElementsFromField, findGridHeader, findGridCells, findParentElementFromClassName, findLeftPinnedHeadersAfterCol, findRightPinnedHeadersBeforeCol, escapeOperandAttributeSelector } from "../../../utils/domUtils.js";
 import { DEFAULT_GRID_AUTOSIZE_OPTIONS } from "./gridColumnResizeApi.js";
 import { gridClasses } from "../../../constants/gridClasses.js";
-import { useGridApiEventHandler, useGridApiMethod, useGridApiOptionHandler, useGridLogger, useGridNativeEventListener, useGridSelector, useOnMount } from "../../utils/index.js";
+import { useGridEvent, useGridApiMethod, useGridEventPriority, useGridLogger, useGridNativeEventListener, useGridSelector, useOnMount } from "../../utils/index.js";
 import { gridVirtualizationColumnEnabledSelector } from "../virtualization/index.js";
 import { createControllablePromise } from "../../../utils/createControllablePromise.js";
 import { clamp } from "../../../utils/utils.js";
@@ -547,12 +547,12 @@ export const useGridColumnResize = (apiRef, props) => {
   useGridApiMethod(apiRef, {
     autosizeColumns
   }, 'public');
-  useGridApiEventHandler(apiRef, 'columnResizeStop', handleResizeStop);
-  useGridApiEventHandler(apiRef, 'columnResizeStart', handleResizeStart);
-  useGridApiEventHandler(apiRef, 'columnSeparatorMouseDown', handleColumnResizeMouseDown);
-  useGridApiEventHandler(apiRef, 'columnSeparatorDoubleClick', handleColumnSeparatorDoubleClick);
-  useGridApiOptionHandler(apiRef, 'columnResize', props.onColumnResize);
-  useGridApiOptionHandler(apiRef, 'columnWidthChange', props.onColumnWidthChange);
+  useGridEvent(apiRef, 'columnResizeStop', handleResizeStop);
+  useGridEvent(apiRef, 'columnResizeStart', handleResizeStart);
+  useGridEvent(apiRef, 'columnSeparatorMouseDown', handleColumnResizeMouseDown);
+  useGridEvent(apiRef, 'columnSeparatorDoubleClick', handleColumnSeparatorDoubleClick);
+  useGridEventPriority(apiRef, 'columnResize', props.onColumnResize);
+  useGridEventPriority(apiRef, 'columnWidthChange', props.onColumnWidthChange);
 };
 function updateProperty(element, property, delta) {
   if (!element) {

package/modern/hooks/features/columns/gridColumnsSelector.d.ts

@@ -4,55 +4,55 @@ import { GridColumnLookup, GridPinnedColumnFields } from "./gridColumnsInterface
  * Get the columns state
  * @category Columns
  */
-export declare const gridColumnsStateSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, import("./gridColumnsInterfaces").GridColumnsState>;
+export declare const gridColumnsStateSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, import("@mui/x-data-grid").GridColumnsState>;
 /**
  * Get an array of column fields in the order rendered on screen.
  * @category Columns
  */
-export declare const gridColumnFieldsSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, string[]>;
+export declare const gridColumnFieldsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsState, string[]>;
 /**
  * Get the columns as a lookup (an object containing the field for keys and the definition for values).
  * @category Columns
  */
-export declare const gridColumnLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, GridColumnLookup>;
+export declare const gridColumnLookupSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsState, GridColumnLookup>;
 /**
  * Get an array of column definitions in the order rendered on screen..
  * @category Columns
  */
-export declare const gridColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, GridColumnLookup, import("../../../internals").GridStateColDef[]>;
+export declare const gridColumnDefinitionsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, GridColumnLookup, import("../../../internals").GridStateColDef[]>;
 /**
  * Get the column visibility model, containing the visibility status of each column.
  * If a column is not registered in the model, it is visible.
  * @category Visible Columns
  */
-export declare const gridColumnVisibilityModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, import("./gridColumnsInterfaces").GridColumnVisibilityModel>;
+export declare const gridColumnVisibilityModelSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsState, import("@mui/x-data-grid").GridColumnVisibilityModel>;
 /**
  * Get the "initial" column visibility model, containing the visibility status of each column.
  * It is updated when the `columns` prop is updated or when `updateColumns` API method is called.
  * If a column is not registered in the model, it is visible.
  * @category Visible Columns
  */
-export declare const gridInitialColumnVisibilityModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, import("./gridColumnsInterfaces").GridColumnVisibilityModel>;
+export declare const gridInitialColumnVisibilityModelSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnsState, import("@mui/x-data-grid").GridColumnVisibilityModel>;
 /**
  * Get the visible columns as a lookup (an object containing the field for keys and the definition for values).
  * @category Visible Columns
  */
-export declare const gridVisibleColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnVisibilityModel, import("../../../internals").GridStateColDef[]>;
+export declare const gridVisibleColumnDefinitionsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridColumnVisibilityModel, import("../../../internals").GridStateColDef[]>;
 /**
  * Get the field of each visible column.
  * @category Visible Columns
  */
-export declare const gridVisibleColumnFieldsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], string[]>;
+export declare const gridVisibleColumnFieldsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], string[]>;
 /**
  * Get the visible pinned columns model.
  * @category Visible Columns
  */
-export declare const gridPinnedColumnsSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, GridPinnedColumnFields>;
+export declare const gridPinnedColumnsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, GridPinnedColumnFields>;
 /**
  * Get the visible pinned columns.
  * @category Visible Columns
  */
-export declare const gridVisiblePinnedColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, boolean, {
+export declare const gridVisiblePinnedColumnDefinitionsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, boolean, {
   left: import("../../../internals").GridStateColDef[];
   right: import("../../../internals").GridStateColDef[];
 }>;
@@ -60,20 +60,20 @@ export declare const gridVisiblePinnedColumnDefinitionsSelector: import("../../.
  * Get the left position in pixel of each visible columns relative to the left of the first column.
  * @category Visible Columns
  */
-export declare const gridColumnPositionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], number[]>;
+export declare const gridColumnPositionsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], number[]>;
 /**
  * Get the filterable columns as an array.
  * @category Columns
  */
-export declare const gridFilterableColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], import("../../../internals").GridStateColDef[]>;
+export declare const gridFilterableColumnDefinitionsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], import("../../../internals").GridStateColDef[]>;
 /**
  * Get the filterable columns as a lookup (an object containing the field for keys and the definition for values).
  * @category Columns
  */
-export declare const gridFilterableColumnLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], GridColumnLookup>;
+export declare const gridFilterableColumnLookupSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], GridColumnLookup>;
 /**
  * Checks if some column has a colSpan field.
  * @category Columns
  * @ignore - Do not document
  */
-export declare const gridHasColSpanSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], boolean>;
+export declare const gridHasColSpanSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], boolean>;

package/modern/hooks/features/columns/gridColumnsUtils.d.ts

@@ -71,4 +71,4 @@ export declare function getFirstNonSpannedColumnToRender({
   lastRowToRender: number;
   visibleRows: GridRowEntry[];
 }): number;
-export declare function getTotalHeaderHeight(apiRef: RefObject<GridApiCommunity>, props: Pick<DataGridProcessedProps, 'columnHeaderHeight' | 'headerFilterHeight' | 'unstable_listView' | 'columnGroupHeaderHeight'>): number;
+export declare function getTotalHeaderHeight(apiRef: RefObject<GridApiCommunity>, props: Pick<DataGridProcessedProps, 'columnHeaderHeight' | 'headerFilterHeight' | 'listView' | 'columnGroupHeaderHeight'>): number;

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

@@ -315,7 +315,7 @@ export function getFirstNonSpannedColumnToRender({
   return firstNonSpannedColumnToRender;
 }
 export function getTotalHeaderHeight(apiRef, props) {
-  if (props.unstable_listView) {
+  if (props.listView) {
     return 0;
   }
   const densityFactor = gridDensityFactorSelector(apiRef);

package/modern/hooks/features/columns/useGridColumnSpanning.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
-import { useGridApiEventHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent } from "../../utils/useGridEvent.js";
 /**
  * @requires useGridColumns (method, event)
  * @requires useGridParamsApi (method)
@@ -45,7 +45,7 @@ export const useGridColumnSpanning = apiRef => {
   };
   useGridApiMethod(apiRef, columnSpanningPublicApi, 'public');
   useGridApiMethod(apiRef, columnSpanningPrivateApi, 'private');
-  useGridApiEventHandler(apiRef, 'columnOrderChange', resetColSpan);
+  useGridEvent(apiRef, 'columnOrderChange', resetColSpan);
 };
 function calculateCellColSpan(params) {
   const {

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

@@ -4,7 +4,7 @@ import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { useGridLogger } from "../../utils/useGridLogger.js";
 import { gridColumnFieldsSelector, gridColumnDefinitionsSelector, gridColumnLookupSelector, gridColumnsStateSelector, gridColumnVisibilityModelSelector, gridVisibleColumnDefinitionsSelector, gridColumnPositionsSelector } from "./gridColumnsSelector.js";
 import { GridSignature } from "../../../constants/signature.js";
-import { useGridApiEventHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent } from "../../utils/useGridEvent.js";
 import { useGridRegisterPipeProcessor, useGridRegisterPipeApplier } from "../../core/pipeProcessing/index.js";
 import { EMPTY_PINNED_COLUMN_FIELDS } from "./gridColumnsInterfaces.js";
 import { hydrateColumnsWidth, createColumnsState, COLUMNS_DIMENSION_PROPERTIES } from "./gridColumnsUtils.js";
@@ -45,7 +45,6 @@ export function useGridColumns(apiRef, props) {
     logger.debug('Updating columns state.');
     apiRef.current.setState(mergeColumnsState(columnsState));
     apiRef.current.publishEvent('columnsChange', columnsState.orderedFields);
-    apiRef.current.updateRenderContext?.();
   }, [logger, apiRef]);
 
   /**
@@ -252,7 +251,7 @@ export function useGridColumns(apiRef, props) {
       setGridColumnsState(hydrateColumnsWidth(gridColumnsStateSelector(apiRef), apiRef.current.getRootDimensions()));
     }
   };
-  useGridApiEventHandler(apiRef, 'viewportInnerSizeChange', handleGridSizeChange);
+  useGridEvent(apiRef, 'viewportInnerSizeChange', handleGridSizeChange);
 
   /**
    * APPLIERS

package/modern/hooks/features/dataSource/gridDataSourceSelector.d.ts

@@ -1,8 +1,8 @@
-export declare const gridGetRowsParamsSelector: import("../../..").OutputSelector<import("../../../models/gridStateCommunity").GridStateCommunity, import("../../..").GridPaginationModel, {
+export declare const gridGetRowsParamsSelector: import("@mui/x-data-grid").OutputSelector<import("../../../models/gridStateCommunity").GridStateCommunity, import("@mui/x-data-grid").GridPaginationModel, {
   groupKeys: never[];
-  paginationModel: import("../../..").GridPaginationModel;
-  sortModel: import("../../..").GridSortModel;
-  filterModel: import("../../..").GridFilterModel;
+  paginationModel: import("@mui/x-data-grid").GridPaginationModel;
+  sortModel: import("@mui/x-data-grid").GridSortModel;
+  filterModel: import("@mui/x-data-grid").GridFilterModel;
   start: number;
   end: number;
 }>;

package/modern/hooks/features/dataSource/useGridDataSource.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { useGridRegisterStrategyProcessor } from "../../core/strategyProcessing/useGridRegisterStrategyProcessor.js";
-import { useGridApiEventHandler as addEventHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent as addEventHandler } from "../../utils/useGridEvent.js";
 import { useGridDataSourceBase } from "./useGridDataSourceBase.js";
 /**
  * Community version of the data source hook. Contains implementation of the `useGridDataSourceBase` hook.

package/modern/hooks/features/density/densitySelector.d.ts

@@ -2,5 +2,5 @@ import { GridStateCommunity } from "../../../models/gridStateCommunity.js";
 import { GridDensity } from "../../../models/gridDensity.js";
 export declare const COMPACT_DENSITY_FACTOR = 0.7;
 export declare const COMFORTABLE_DENSITY_FACTOR = 1.3;
-export declare const gridDensitySelector: import("../../..").OutputSelector<GridStateCommunity, unknown, GridDensity>;
-export declare const gridDensityFactorSelector: import("../../..").OutputSelector<GridStateCommunity, GridDensity, number>;
+export declare const gridDensitySelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, GridDensity>;
+export declare const gridDensityFactorSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, GridDensity, number>;

package/modern/hooks/features/dimensions/gridDimensionsSelectors.d.ts

@@ -1,18 +1,18 @@
 import { GridStateCommunity } from "../../../models/gridStateCommunity.js";
-export declare const gridDimensionsSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, import("./gridDimensionsApi").GridDimensions>;
+export declare const gridDimensionsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, import("@mui/x-data-grid").GridDimensions>;
 /**
  * Get the summed width of all the visible columns.
  * @category Visible Columns
  */
-export declare const gridColumnsTotalWidthSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridRowHeightSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridContentHeightSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridHasScrollXSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, boolean>;
-export declare const gridHasScrollYSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, boolean>;
-export declare const gridHasFillerSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, boolean>;
-export declare const gridHeaderHeightSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridGroupHeaderHeightSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridHeaderFilterHeightSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridHorizontalScrollbarHeightSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridVerticalScrollbarWidthSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridDimensionsApi").GridDimensions, number>;
-export declare const gridHasBottomFillerSelector: import("../../..").OutputSelector<GridStateCommunity, number, boolean>;
+export declare const gridColumnsTotalWidthSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridRowHeightSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridContentHeightSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridHasScrollXSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, boolean>;
+export declare const gridHasScrollYSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, boolean>;
+export declare const gridHasFillerSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, boolean>;
+export declare const gridHeaderHeightSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridGroupHeaderHeightSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridHeaderFilterHeightSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridHorizontalScrollbarHeightSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridVerticalScrollbarWidthSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridDimensions, number>;
+export declare const gridHasBottomFillerSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, number, boolean>;

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

@@ -4,7 +4,8 @@ import useEventCallback from '@mui/utils/useEventCallback';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import ownerDocument from '@mui/utils/ownerDocument';
 import { throttle } from '@mui/x-internals/throttle';
-import { useGridApiOptionHandler } from "../../utils/useGridApiEventHandler.js";
+import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
+import { useGridEventPriority } from "../../utils/useGridEvent.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { createSelector } from "../../../utils/createSelector.js";
 import { useGridLogger } from "../../utils/useGridLogger.js";
@@ -20,7 +21,6 @@ import { getTotalHeaderHeight } from "../columns/gridColumnsUtils.js";
 import { DATA_GRID_PROPS_DEFAULT_VALUES } from "../../../constants/dataGridPropsDefaultValues.js";
 import { roundToDecimalPlaces } from "../../../utils/roundToDecimalPlaces.js";
 import { isJSDOM } from "../../../utils/isJSDOM.js";
-import { isDeepEqual } from "../../../utils/utils.js";
 const EMPTY_SIZE = {
   width: 0,
   height: 0
@@ -237,9 +237,9 @@ export function useGridDimensions(apiRef, props) {
     }
     debouncedUpdateDimensions();
   }, [updateDimensions, props.autoHeight, debouncedUpdateDimensions, logger]);
-  useGridApiOptionHandler(apiRef, 'rootMount', handleRootMount);
-  useGridApiOptionHandler(apiRef, 'resize', handleResize);
-  useGridApiOptionHandler(apiRef, 'debouncedResize', props.onResize);
+  useGridEventPriority(apiRef, 'rootMount', handleRootMount);
+  useGridEventPriority(apiRef, 'resize', handleResize);
+  useGridEventPriority(apiRef, 'debouncedResize', props.onResize);
 }
 function setCSSVariables(root, dimensions) {
   const set = (k, v) => root.style.setProperty(k, v);

package/modern/hooks/features/editing/gridEditingSelectors.d.ts

@@ -4,12 +4,12 @@ import { GridEditMode } from "../../../models/gridEditRowModel.js";
 /**
  * Select the row editing state.
  */
-export declare const gridEditRowsStateSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, import("../../..").GridEditingState>;
-export declare const gridRowIsEditingSelector: import("../../..").OutputSelector<GridStateCommunity, {
+export declare const gridEditRowsStateSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, import("@mui/x-data-grid").GridEditingState>;
+export declare const gridRowIsEditingSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, {
   rowId: GridRowId;
   editMode: GridEditMode;
 }, boolean>;
-export declare const gridEditCellStateSelector: import("../../..").OutputSelector<GridStateCommunity, {
+export declare const gridEditCellStateSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, {
   rowId: GridRowId;
   field: string;
-}, import("../../..").GridEditCellProps<any>>;
+}, import("@mui/x-data-grid").GridEditCellProps<any>>;

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

@@ -7,7 +7,7 @@ import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { warnOnce } from '@mui/x-internals/warning';
-import { useGridApiEventHandler, useGridApiOptionHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent, useGridEventPriority } from "../../utils/useGridEvent.js";
 import { GridEditModes, GridCellModes } from "../../../models/gridEditRowModel.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { gridEditRowsStateSelector } from "./gridEditingSelectors.js";
@@ -167,13 +167,13 @@ export const useGridCellEditing = (apiRef, props) => {
       }
     }
   };
-  useGridApiEventHandler(apiRef, 'cellDoubleClick', runIfEditModeIsCell(handleCellDoubleClick));
-  useGridApiEventHandler(apiRef, 'cellFocusOut', runIfEditModeIsCell(handleCellFocusOut));
-  useGridApiEventHandler(apiRef, 'cellKeyDown', runIfEditModeIsCell(handleCellKeyDown));
-  useGridApiEventHandler(apiRef, 'cellEditStart', runIfEditModeIsCell(handleCellEditStart));
-  useGridApiEventHandler(apiRef, 'cellEditStop', runIfEditModeIsCell(handleCellEditStop));
-  useGridApiOptionHandler(apiRef, 'cellEditStart', props.onCellEditStart);
-  useGridApiOptionHandler(apiRef, 'cellEditStop', runIfNoFieldErrors(props.onCellEditStop));
+  useGridEvent(apiRef, 'cellDoubleClick', runIfEditModeIsCell(handleCellDoubleClick));
+  useGridEvent(apiRef, 'cellFocusOut', runIfEditModeIsCell(handleCellFocusOut));
+  useGridEvent(apiRef, 'cellKeyDown', runIfEditModeIsCell(handleCellKeyDown));
+  useGridEvent(apiRef, 'cellEditStart', runIfEditModeIsCell(handleCellEditStart));
+  useGridEvent(apiRef, 'cellEditStop', runIfEditModeIsCell(handleCellEditStop));
+  useGridEventPriority(apiRef, 'cellEditStart', props.onCellEditStart);
+  useGridEventPriority(apiRef, 'cellEditStop', runIfNoFieldErrors(props.onCellEditStop));
   const getCellMode = React.useCallback((id, field) => {
     const editingState = gridEditRowsStateSelector(apiRef);
     const isEditing = editingState[id] && editingState[id][field];

package/modern/hooks/features/editing/useGridRowEditing.js

@@ -7,7 +7,7 @@ import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { warnOnce } from '@mui/x-internals/warning';
-import { useGridApiEventHandler, useGridApiOptionHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent, useGridEventPriority } from "../../utils/useGridEvent.js";
 import { GridEditModes, GridRowModes } from "../../../models/gridEditRowModel.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { gridEditRowsStateSelector, gridRowIsEditingSelector } from "./gridEditingSelectors.js";
@@ -225,14 +225,14 @@ export const useGridRowEditing = (apiRef, props) => {
       cellToFocusAfter
     });
   }, [apiRef]);
-  useGridApiEventHandler(apiRef, 'cellDoubleClick', runIfEditModeIsRow(handleCellDoubleClick));
-  useGridApiEventHandler(apiRef, 'cellFocusIn', runIfEditModeIsRow(handleCellFocusIn));
-  useGridApiEventHandler(apiRef, 'cellFocusOut', runIfEditModeIsRow(handleCellFocusOut));
-  useGridApiEventHandler(apiRef, 'cellKeyDown', runIfEditModeIsRow(handleCellKeyDown));
-  useGridApiEventHandler(apiRef, 'rowEditStart', runIfEditModeIsRow(handleRowEditStart));
-  useGridApiEventHandler(apiRef, 'rowEditStop', runIfEditModeIsRow(handleRowEditStop));
-  useGridApiOptionHandler(apiRef, 'rowEditStart', props.onRowEditStart);
-  useGridApiOptionHandler(apiRef, 'rowEditStop', props.onRowEditStop);
+  useGridEvent(apiRef, 'cellDoubleClick', runIfEditModeIsRow(handleCellDoubleClick));
+  useGridEvent(apiRef, 'cellFocusIn', runIfEditModeIsRow(handleCellFocusIn));
+  useGridEvent(apiRef, 'cellFocusOut', runIfEditModeIsRow(handleCellFocusOut));
+  useGridEvent(apiRef, 'cellKeyDown', runIfEditModeIsRow(handleCellKeyDown));
+  useGridEvent(apiRef, 'rowEditStart', runIfEditModeIsRow(handleRowEditStart));
+  useGridEvent(apiRef, 'rowEditStop', runIfEditModeIsRow(handleRowEditStop));
+  useGridEventPriority(apiRef, 'rowEditStart', props.onRowEditStart);
+  useGridEventPriority(apiRef, 'rowEditStop', props.onRowEditStop);
   const getRowMode = React.useCallback(id => {
     const isEditing = gridRowIsEditingSelector(apiRef, {
       rowId: id,

package/modern/hooks/features/events/useGridEvents.js

@@ -1,24 +1,24 @@
-import { useGridApiOptionHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEventPriority } from "../../utils/useGridEvent.js";
 /**
  * @requires useGridFocus (event) - can be after, async only
  * @requires useGridColumns (event) - can be after, async only
  */
 export function useGridEvents(apiRef, props) {
-  useGridApiOptionHandler(apiRef, 'columnHeaderClick', props.onColumnHeaderClick);
-  useGridApiOptionHandler(apiRef, 'columnHeaderContextMenu', props.onColumnHeaderContextMenu);
-  useGridApiOptionHandler(apiRef, 'columnHeaderDoubleClick', props.onColumnHeaderDoubleClick);
-  useGridApiOptionHandler(apiRef, 'columnHeaderOver', props.onColumnHeaderOver);
-  useGridApiOptionHandler(apiRef, 'columnHeaderOut', props.onColumnHeaderOut);
-  useGridApiOptionHandler(apiRef, 'columnHeaderEnter', props.onColumnHeaderEnter);
-  useGridApiOptionHandler(apiRef, 'columnHeaderLeave', props.onColumnHeaderLeave);
-  useGridApiOptionHandler(apiRef, 'cellClick', props.onCellClick);
-  useGridApiOptionHandler(apiRef, 'cellDoubleClick', props.onCellDoubleClick);
-  useGridApiOptionHandler(apiRef, 'cellKeyDown', props.onCellKeyDown);
-  useGridApiOptionHandler(apiRef, 'preferencePanelClose', props.onPreferencePanelClose);
-  useGridApiOptionHandler(apiRef, 'preferencePanelOpen', props.onPreferencePanelOpen);
-  useGridApiOptionHandler(apiRef, 'menuOpen', props.onMenuOpen);
-  useGridApiOptionHandler(apiRef, 'menuClose', props.onMenuClose);
-  useGridApiOptionHandler(apiRef, 'rowDoubleClick', props.onRowDoubleClick);
-  useGridApiOptionHandler(apiRef, 'rowClick', props.onRowClick);
-  useGridApiOptionHandler(apiRef, 'stateChange', props.onStateChange);
+  useGridEventPriority(apiRef, 'columnHeaderClick', props.onColumnHeaderClick);
+  useGridEventPriority(apiRef, 'columnHeaderContextMenu', props.onColumnHeaderContextMenu);
+  useGridEventPriority(apiRef, 'columnHeaderDoubleClick', props.onColumnHeaderDoubleClick);
+  useGridEventPriority(apiRef, 'columnHeaderOver', props.onColumnHeaderOver);
+  useGridEventPriority(apiRef, 'columnHeaderOut', props.onColumnHeaderOut);
+  useGridEventPriority(apiRef, 'columnHeaderEnter', props.onColumnHeaderEnter);
+  useGridEventPriority(apiRef, 'columnHeaderLeave', props.onColumnHeaderLeave);
+  useGridEventPriority(apiRef, 'cellClick', props.onCellClick);
+  useGridEventPriority(apiRef, 'cellDoubleClick', props.onCellDoubleClick);
+  useGridEventPriority(apiRef, 'cellKeyDown', props.onCellKeyDown);
+  useGridEventPriority(apiRef, 'preferencePanelClose', props.onPreferencePanelClose);
+  useGridEventPriority(apiRef, 'preferencePanelOpen', props.onPreferencePanelOpen);
+  useGridEventPriority(apiRef, 'menuOpen', props.onMenuOpen);
+  useGridEventPriority(apiRef, 'menuClose', props.onMenuClose);
+  useGridEventPriority(apiRef, 'rowDoubleClick', props.onRowDoubleClick);
+  useGridEventPriority(apiRef, 'rowClick', props.onRowClick);
+  useGridEventPriority(apiRef, 'stateChange', props.onStateChange);
 }