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

package/esm/components/export/ExportExcel.js

@@ -47,113 +47,9 @@ process.env.NODE_ENV !== "production" ? ExportExcel.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
   // ----------------------------------------------------------------------
-  /**
-   * A ref for imperative actions.
-   * It currently only supports `focusVisible()` action.
-   */
-  action: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
-    current: PropTypes.shape({
-      focusVisible: PropTypes.func.isRequired
-    })
-  })]),
-  /**
-   * If `true`, the ripples are centered.
-   * They won't start at the cursor interaction position.
-   * @default false
-   */
-  centerRipple: PropTypes.bool,
   className: PropTypes.string,
-  /**
-   * The color of the component.
-   * It supports both default and custom theme colors, which can be added as shown in the
-   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
-   * @default 'primary'
-   */
-  color: PropTypes.oneOf(['error', 'info', 'inherit', 'primary', 'secondary', 'success', 'warning']),
-  component: PropTypes.elementType,
-  /**
-   * If `true`, the component is disabled.
-   */
   disabled: PropTypes.bool,
-  /**
-   * If `true`, no elevation is used.
-   * @default false
-   */
-  disableElevation: PropTypes.bool,
-  /**
-   * If `true`, the  keyboard focus ripple is disabled.
-   * @default false
-   */
-  disableFocusRipple: PropTypes.bool,
-  /**
-   * If `true`, the ripple effect is disabled.
-   *
-   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
-   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
-   * @default false
-   */
-  disableRipple: PropTypes.bool,
-  /**
-   * If `true`, the touch ripple effect is disabled.
-   * @default false
-   */
-  disableTouchRipple: PropTypes.bool,
-  /**
-   * Element placed after the children.
-   */
-  endIcon: PropTypes.node,
-  /**
-   * If `true`, the base button will have a keyboard focus ripple.
-   * @default false
-   */
-  focusRipple: PropTypes.bool,
-  /**
-   * This prop can help identify which element has keyboard focus.
-   * The class name will be applied when the element gains the focus through keyboard interaction.
-   * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
-   * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
-   * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
-   * if needed.
-   */
-  focusVisibleClassName: PropTypes.string,
-  /**
-   * If `true`, the button will take up the full width of its container.
-   * @default false
-   */
-  fullWidth: PropTypes.bool,
-  /**
-   * The URL to link to when the button is clicked.
-   * If defined, an `a` element will be used as the root node.
-   */
-  href: PropTypes.string,
-  /**
-   * The component used to render a link when the `href` prop is provided.
-   * @default 'a'
-   */
-  LinkComponent: PropTypes.elementType,
-  /**
-   * If `true`, the loading indicator is visible and the button is disabled.
-   * If `true | false`, the loading wrapper is always rendered before the children to prevent [Google Translation Crash](https://github.com/mui/material-ui/issues/27853).
-   * @default null
-   */
-  loading: PropTypes.bool,
-  /**
-   * Element placed before the children if the button is in loading state.
-   * The node should contain an element with `role="progressbar"` with an accessible name.
-   * By default, it renders a `CircularProgress` that is labeled by the button itself.
-   * @default <CircularProgress color="inherit" size={16} />
-   */
-  loadingIndicator: PropTypes.node,
-  /**
-   * The loading indicator can be positioned on the start, end, or the center of the button.
-   * @default 'center'
-   */
-  loadingPosition: PropTypes.oneOf(['center', 'end', 'start']),
-  /**
-   * Callback fired when the component is focused with a keyboard.
-   * We trigger a `onFocus` callback too.
-   */
-  onFocusVisible: PropTypes.func,
+  id: PropTypes.string,
   /**
    * The options to apply on the Excel export.
    * @demos
@@ -177,33 +73,12 @@ process.env.NODE_ENV !== "production" ? ExportExcel.propTypes = {
    * A function to customize rendering of the component.
    */
   render: PropTypes.oneOfType([PropTypes.element, PropTypes.func]),
-  /**
-   * The size of the component.
-   * `small` is equivalent to the dense button styling.
-   */
+  role: PropTypes.string,
   size: PropTypes.oneOf(['large', 'medium', 'small']),
-  /**
-   * Element placed before the children.
-   */
   startIcon: PropTypes.node,
   style: PropTypes.object,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   tabIndex: PropTypes.number,
-  /**
-   * Props applied to the `TouchRipple` element.
-   */
-  TouchRippleProps: PropTypes.object,
-  /**
-   * A ref that points to the `TouchRipple` element.
-   */
-  touchRippleRef: PropTypes.any,
-  /**
-   * The variant to use.
-   * @default 'text'
-   */
-  variant: PropTypes.oneOf(['contained', 'outlined', 'text'])
+  title: PropTypes.string,
+  touchRippleRef: PropTypes.any
 } : void 0;
 export { ExportExcel };

package/esm/hooks/features/aggregation/gridAggregationUtils.js

@@ -2,7 +2,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { GRID_ID_AUTOGENERATED } from '@mui/x-data-grid/internals';
 import { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid-pro';
-import { addPinnedRow, isDeepEqual, insertNodeInTree, removeNodeFromTree } from '@mui/x-data-grid-pro/internals';
+import { addPinnedRow, insertNodeInTree, removeNodeFromTree } from '@mui/x-data-grid-pro/internals';
+import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
 export const GRID_AGGREGATION_ROOT_FOOTER_ROW_ID = 'auto-generated-group-footer-root';
 export const getAggregationFooterRowIdFromGroupId = groupId => {
   if (groupId == null) {

package/esm/hooks/features/aggregation/useGridAggregation.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { gridColumnLookupSelector, useGridApiEventHandler, useGridApiMethod } from '@mui/x-data-grid-pro';
+import { gridColumnLookupSelector, useGridEvent, useGridApiMethod } from '@mui/x-data-grid-pro';
 import { useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';
 import { gridAggregationModelSelector } from "./gridAggregationSelectors.js";
 import { getAggregationRules, mergeStateWithAggregationModel, areAggregationRulesEqual } from "./gridAggregationUtils.js";
@@ -88,9 +88,9 @@ export const useGridAggregation = (apiRef, props) => {
       apiRef.current.requestPipeProcessorsApplication('hydrateColumns');
     }
   }, [apiRef, applyAggregation, props.aggregationFunctions, props.disableAggregation, props.dataSource]);
-  useGridApiEventHandler(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);
-  useGridApiEventHandler(apiRef, 'columnsChange', checkAggregationRulesDiff);
-  useGridApiEventHandler(apiRef, 'filteredRowsSet', applyAggregation);
+  useGridEvent(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);
+  useGridEvent(apiRef, 'columnsChange', checkAggregationRulesDiff);
+  useGridEvent(apiRef, 'filteredRowsSet', applyAggregation);
 
   /**
    * EFFECTS

package/esm/hooks/features/cellSelection/useGridCellSelection.js

@@ -3,7 +3,7 @@ import * as React from 'react';
 import ownerDocument from '@mui/utils/ownerDocument';
 import useEventCallback from '@mui/utils/useEventCallback';
 import { getTotalHeaderHeight, getVisibleRows, isNavigationKey, serializeCellValue, useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';
-import { useGridApiEventHandler, useGridApiMethod, GRID_ACTIONS_COLUMN_TYPE, GRID_CHECKBOX_SELECTION_COL_DEF, GRID_DETAIL_PANEL_TOGGLE_FIELD, gridClasses, gridFocusCellSelector, GRID_REORDER_COL_DEF, gridSortedRowIdsSelector, gridDimensionsSelector } from '@mui/x-data-grid-pro';
+import { useGridEvent, useGridApiMethod, GRID_ACTIONS_COLUMN_TYPE, GRID_CHECKBOX_SELECTION_COL_DEF, GRID_DETAIL_PANEL_TOGGLE_FIELD, gridClasses, gridFocusCellSelector, GRID_REORDER_COL_DEF, gridSortedRowIdsSelector, gridDimensionsSelector } from '@mui/x-data-grid-pro';
 import { gridCellSelectionStateSelector } from "./gridCellSelectionSelector.js";
 export const cellSelectionStateInitializer = (state, props) => _extends({}, state, {
   cellSelection: _extends({}, props.cellSelectionModel ?? props.initialState?.cellSelection)
@@ -354,11 +354,11 @@ export const useGridCellSelection = (apiRef, props) => {
       field
     }, cellWithVirtualFocus.current);
   });
-  useGridApiEventHandler(apiRef, 'cellClick', runIfCellSelectionIsEnabled(handleCellClick));
-  useGridApiEventHandler(apiRef, 'cellFocusIn', runIfCellSelectionIsEnabled(handleCellFocusIn));
-  useGridApiEventHandler(apiRef, 'cellKeyDown', runIfCellSelectionIsEnabled(handleCellKeyDown));
-  useGridApiEventHandler(apiRef, 'cellMouseDown', runIfCellSelectionIsEnabled(handleCellMouseDown));
-  useGridApiEventHandler(apiRef, 'cellMouseOver', runIfCellSelectionIsEnabled(handleCellMouseOver));
+  useGridEvent(apiRef, 'cellClick', runIfCellSelectionIsEnabled(handleCellClick));
+  useGridEvent(apiRef, 'cellFocusIn', runIfCellSelectionIsEnabled(handleCellFocusIn));
+  useGridEvent(apiRef, 'cellKeyDown', runIfCellSelectionIsEnabled(handleCellKeyDown));
+  useGridEvent(apiRef, 'cellMouseDown', runIfCellSelectionIsEnabled(handleCellMouseDown));
+  useGridEvent(apiRef, 'cellMouseOver', runIfCellSelectionIsEnabled(handleCellMouseOver));
   React.useEffect(() => {
     if (props.cellSelectionModel) {
       apiRef.current.setCellSelectionModel(props.cellSelectionModel);

package/esm/hooks/features/clipboard/useGridClipboardImport.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { GRID_CHECKBOX_SELECTION_FIELD, gridFocusCellSelector, gridVisibleColumnFieldsSelector, useGridApiOptionHandler, useGridApiEventHandler, gridPaginatedVisibleSortedGridRowIdsSelector, gridExpandedSortedRowIdsSelector, gridRowSelectionIdsSelector, gridRowSelectionCountSelector } from '@mui/x-data-grid';
+import { GRID_CHECKBOX_SELECTION_FIELD, gridFocusCellSelector, gridVisibleColumnFieldsSelector, useGridEventPriority, useGridEvent, gridPaginatedVisibleSortedGridRowIdsSelector, gridExpandedSortedRowIdsSelector, gridRowSelectionIdsSelector, gridRowSelectionCountSelector } from '@mui/x-data-grid';
 import { getRowIdFromRowModel, getActiveElement, useGridRegisterPipeProcessor, getPublicApiRef, isPasteShortcut, useGridLogger } from '@mui/x-data-grid/internals';
 import { warnOnce } from '@mui/x-internals/warning';
 import { GRID_DETAIL_PANEL_TOGGLE_FIELD, GRID_REORDER_COL_DEF } from '@mui/x-data-grid-pro';
@@ -328,8 +328,8 @@ export const useGridClipboardImport = (apiRef, props) => {
     }
     return initialValue;
   }, [enableClipboardPaste]);
-  useGridApiEventHandler(apiRef, 'cellKeyDown', handlePaste);
-  useGridApiOptionHandler(apiRef, 'clipboardPasteStart', props.onClipboardPasteStart);
-  useGridApiOptionHandler(apiRef, 'clipboardPasteEnd', props.onClipboardPasteEnd);
+  useGridEvent(apiRef, 'cellKeyDown', handlePaste);
+  useGridEventPriority(apiRef, 'clipboardPasteStart', props.onClipboardPasteStart);
+  useGridEventPriority(apiRef, 'clipboardPasteEnd', props.onClipboardPasteEnd);
   useGridRegisterPipeProcessor(apiRef, 'canStartEditing', checkIfCanStartEditing);
 };

package/esm/hooks/features/dataSource/useGridDataSourcePremium.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { useGridApiEventHandler as addEventHandler, useGridApiMethod, GRID_ROOT_GROUP_ID } from '@mui/x-data-grid-pro';
+import { useGridEvent as addEventHandler, useGridApiMethod, GRID_ROOT_GROUP_ID } from '@mui/x-data-grid-pro';
 import { useGridDataSourceBasePro, useGridRegisterStrategyProcessor, useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';
 function getKeyPremium(params) {
   return JSON.stringify([params.filterModel, params.sortModel, params.groupKeys, params.groupFields, params.start, params.end, params.aggregationModel]);

package/esm/hooks/features/export/useGridExcelExport.js

@@ -1,7 +1,7 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["worker", "exceljsPostProcess", "exceljsPreProcess", "columnsStyles", "includeHeaders", "getRowsToExport", "valueOptionsSheetName"];
 import * as React from 'react';
-import { useGridApiMethod, useGridLogger, useGridApiOptionHandler } from '@mui/x-data-grid';
+import { useGridApiMethod, useGridLogger, useGridEventPriority } from '@mui/x-data-grid';
 import { useGridRegisterPipeProcessor, exportAs, getColumnsToExport, defaultGetRowsToExport } from '@mui/x-data-grid/internals';
 import { buildExcel, getDataForValueOptionsSheet, serializeColumns, serializeRowUnsafe } from "./serializer/excelSerializer.js";
 import { GridExcelExportMenuItem } from "../../../components/index.js";
@@ -135,5 +135,5 @@ export const useGridExcelExport = (apiRef, props) => {
     }];
   }, []);
   useGridRegisterPipeProcessor(apiRef, 'exportMenu', addExportMenuButtons);
-  useGridApiOptionHandler(apiRef, 'excelExportStateChange', props.onExcelExportStateChange);
+  useGridEventPriority(apiRef, 'excelExportStateChange', props.onExcelExportStateChange);
 };

package/esm/hooks/features/rowGrouping/useGridRowGrouping.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { useGridApiEventHandler, useGridApiMethod, gridColumnLookupSelector } from '@mui/x-data-grid-pro';
+import { useGridEvent, useGridApiMethod, gridColumnLookupSelector } from '@mui/x-data-grid-pro';
 import { useGridRegisterPipeProcessor, GridStrategyGroup } from '@mui/x-data-grid-pro/internals';
 import { gridRowGroupingModelSelector, gridRowGroupingSanitizedModelSelector } from "./gridRowGroupingSelector.js";
 import { getRowGroupingFieldFromGroupingCriteria, RowGroupingStrategy, isGroupingColumn, mergeStateWithRowGroupingModel, setStrategyAvailability, getGroupingRules, areGroupingRulesEqual } from "./gridRowGroupingUtils.js";
@@ -166,10 +166,10 @@ export const useGridRowGrouping = (apiRef, props) => {
       }
     }
   }, [apiRef, props.disableRowGrouping]);
-  useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);
-  useGridApiEventHandler(apiRef, 'columnsChange', checkGroupingColumnsModelDiff);
-  useGridApiEventHandler(apiRef, 'rowGroupingModelChange', checkGroupingColumnsModelDiff);
-  useGridApiEventHandler(apiRef, 'rowGroupingModelChange', () => apiRef.current.dataSource.fetchRows());
+  useGridEvent(apiRef, 'cellKeyDown', handleCellKeyDown);
+  useGridEvent(apiRef, 'columnsChange', checkGroupingColumnsModelDiff);
+  useGridEvent(apiRef, 'rowGroupingModelChange', checkGroupingColumnsModelDiff);
+  useGridEvent(apiRef, 'rowGroupingModelChange', () => apiRef.current.dataSource.fetchRows());
 
   /*
    * EFFECTS

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v8.0.0-beta.1
+ * @mui/x-data-grid-premium v8.0.0-beta.3
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/esm/utils/releaseInfo.js

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

package/hooks/features/aggregation/gridAggregationUtils.js

@@ -10,6 +10,7 @@ var _utils = require("@mui/utils");
 var _internals = require("@mui/x-data-grid/internals");
 var _xDataGridPro = require("@mui/x-data-grid-pro");
 var _internals2 = require("@mui/x-data-grid-pro/internals");
+var _isDeepEqual = require("@mui/x-internals/isDeepEqual");
 const GRID_AGGREGATION_ROOT_FOOTER_ROW_ID = exports.GRID_AGGREGATION_ROOT_FOOTER_ROW_ID = 'auto-generated-group-footer-root';
 const getAggregationFooterRowIdFromGroupId = groupId => {
   if (groupId == null) {
@@ -162,7 +163,7 @@ exports.addFooterRows = addFooterRows;
 const areAggregationRulesEqual = (previousValue, newValue) => {
   const previousFields = Object.keys(previousValue ?? {});
   const newFields = Object.keys(newValue);
-  if (!(0, _internals2.isDeepEqual)(previousFields, newFields)) {
+  if (!(0, _isDeepEqual.isDeepEqual)(previousFields, newFields)) {
     return false;
   }
   return newFields.every(field => {

package/hooks/features/aggregation/useGridAggregation.js

@@ -97,9 +97,9 @@ const useGridAggregation = (apiRef, props) => {
       apiRef.current.requestPipeProcessorsApplication('hydrateColumns');
     }
   }, [apiRef, applyAggregation, props.aggregationFunctions, props.disableAggregation, props.dataSource]);
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'columnsChange', checkAggregationRulesDiff);
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'filteredRowsSet', applyAggregation);
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'columnsChange', checkAggregationRulesDiff);
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'filteredRowsSet', applyAggregation);
 
   /**
    * EFFECTS

package/hooks/features/cellSelection/useGridCellSelection.js

@@ -363,11 +363,11 @@ const useGridCellSelection = (apiRef, props) => {
       field
     }, cellWithVirtualFocus.current);
   });
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'cellClick', runIfCellSelectionIsEnabled(handleCellClick));
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'cellFocusIn', runIfCellSelectionIsEnabled(handleCellFocusIn));
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'cellKeyDown', runIfCellSelectionIsEnabled(handleCellKeyDown));
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'cellMouseDown', runIfCellSelectionIsEnabled(handleCellMouseDown));
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'cellMouseOver', runIfCellSelectionIsEnabled(handleCellMouseOver));
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'cellClick', runIfCellSelectionIsEnabled(handleCellClick));
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'cellFocusIn', runIfCellSelectionIsEnabled(handleCellFocusIn));
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'cellKeyDown', runIfCellSelectionIsEnabled(handleCellKeyDown));
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'cellMouseDown', runIfCellSelectionIsEnabled(handleCellMouseDown));
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'cellMouseOver', runIfCellSelectionIsEnabled(handleCellMouseOver));
   React.useEffect(() => {
     if (props.cellSelectionModel) {
       apiRef.current.setCellSelectionModel(props.cellSelectionModel);

package/hooks/features/clipboard/useGridClipboardImport.js

@@ -336,9 +336,9 @@ const useGridClipboardImport = (apiRef, props) => {
     }
     return initialValue;
   }, [enableClipboardPaste]);
-  (0, _xDataGrid.useGridApiEventHandler)(apiRef, 'cellKeyDown', handlePaste);
-  (0, _xDataGrid.useGridApiOptionHandler)(apiRef, 'clipboardPasteStart', props.onClipboardPasteStart);
-  (0, _xDataGrid.useGridApiOptionHandler)(apiRef, 'clipboardPasteEnd', props.onClipboardPasteEnd);
+  (0, _xDataGrid.useGridEvent)(apiRef, 'cellKeyDown', handlePaste);
+  (0, _xDataGrid.useGridEventPriority)(apiRef, 'clipboardPasteStart', props.onClipboardPasteStart);
+  (0, _xDataGrid.useGridEventPriority)(apiRef, 'clipboardPasteEnd', props.onClipboardPasteEnd);
   (0, _internals.useGridRegisterPipeProcessor)(apiRef, 'canStartEditing', checkIfCanStartEditing);
 };
 exports.useGridClipboardImport = useGridClipboardImport;

package/hooks/features/dataSource/useGridDataSourcePremium.js

@@ -59,7 +59,7 @@ const useGridDataSourcePremium = (apiRef, props) => {
   (0, _internals.useGridRegisterStrategyProcessor)(apiRef, strategyProcessor.strategyName, strategyProcessor.group, strategyProcessor.processor);
   (0, _internals.useGridRegisterPipeProcessor)(apiRef, 'processDataSourceRows', processDataSourceRows);
   Object.entries(events).forEach(([event, handler]) => {
-    (0, _xDataGridPro.useGridApiEventHandler)(apiRef, event, handler);
+    (0, _xDataGridPro.useGridEvent)(apiRef, event, handler);
   });
   React.useEffect(() => {
     setStrategyAvailability();

package/hooks/features/export/useGridExcelExport.js

@@ -143,6 +143,6 @@ const useGridExcelExport = (apiRef, props) => {
     }];
   }, []);
   (0, _internals.useGridRegisterPipeProcessor)(apiRef, 'exportMenu', addExportMenuButtons);
-  (0, _xDataGrid.useGridApiOptionHandler)(apiRef, 'excelExportStateChange', props.onExcelExportStateChange);
+  (0, _xDataGrid.useGridEventPriority)(apiRef, 'excelExportStateChange', props.onExcelExportStateChange);
 };
 exports.useGridExcelExport = useGridExcelExport;

package/hooks/features/rowGrouping/useGridRowGrouping.js

@@ -175,10 +175,10 @@ const useGridRowGrouping = (apiRef, props) => {
       }
     }
   }, [apiRef, props.disableRowGrouping]);
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'cellKeyDown', handleCellKeyDown);
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'columnsChange', checkGroupingColumnsModelDiff);
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'rowGroupingModelChange', checkGroupingColumnsModelDiff);
-  (0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'rowGroupingModelChange', () => apiRef.current.dataSource.fetchRows());
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'cellKeyDown', handleCellKeyDown);
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'columnsChange', checkGroupingColumnsModelDiff);
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'rowGroupingModelChange', checkGroupingColumnsModelDiff);
+  (0, _xDataGridPro.useGridEvent)(apiRef, 'rowGroupingModelChange', () => apiRef.current.dataSource.fetchRows());
 
   /*
    * EFFECTS

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v8.0.0-beta.1
+ * @mui/x-data-grid-premium v8.0.0-beta.3
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/modern/DataGridPremium/DataGridPremium.js

@@ -79,11 +79,11 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
     current: PropTypes.object
   }),
   /**
-   * The label of the Data Grid.
+   * The `aria-label` of the Data Grid.
    */
   'aria-label': PropTypes.string,
   /**
-   * The id of the element containing a label for the Data Grid.
+   * The `id` of the element containing a label for the Data Grid.
    */
   'aria-labelledby': PropTypes.string,
   /**
@@ -145,6 +145,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * Override or extend the styles applied to the component.
    */
   classes: PropTypes.object,
+  className: PropTypes.string,
   /**
    * The character used to separate cell values when copying to the clipboard.
    * @default '\t'
@@ -507,6 +508,12 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @default false
    */
   keepNonExistentRowsSelected: PropTypes.bool,
+  /**
+   * The label of the Data Grid.
+   * If the `showToolbar` prop is `true`, the label will be displayed in the toolbar and applied to the `aria-label` attribute of the grid.
+   * If the `showToolbar` prop is `false`, the label will not be visible but will be applied to the `aria-label` attribute of the grid.
+   */
+  label: PropTypes.string,
   /**
    * Used together with `dataSource` to enable lazy loading.
    * If enabled, the grid stops adding `paginationModel` to the data requests (`getRows`)
@@ -519,6 +526,21 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @default 500
    */
   lazyLoadingRequestThrottleMs: PropTypes.number,
+  /**
+   * If `true`, displays the data in a list view.
+   * Use in combination with `listViewColumn`.
+   */
+  listView: PropTypes.bool,
+  /**
+   * Definition of the column rendered when the `listView` prop is enabled.
+   */
+  listViewColumn: PropTypes.shape({
+    align: PropTypes.oneOf(['center', 'left', 'right']),
+    cellClassName: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+    display: PropTypes.oneOf(['flex', 'text']),
+    field: PropTypes.string.isRequired,
+    renderCell: PropTypes.func
+  }),
   /**
    * If `true`, a loading overlay is displayed.
    * @default false
@@ -1070,6 +1092,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @default (pastedText) => { const text = pastedText.replace(/\r?\n$/, ''); return text.split(/\r\n|\n|\r/).map((row) => row.split('\t')); }
    */
   splitClipboardPastedText: PropTypes.func,
+  style: PropTypes.object,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
@@ -1085,21 +1108,6 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @default false
    */
   treeData: PropTypes.bool,
-  /**
-   * Definition of the column rendered when the `unstable_listView` prop is enabled.
-   */
-  unstable_listColumn: PropTypes.shape({
-    align: PropTypes.oneOf(['center', 'left', 'right']),
-    cellClassName: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
-    display: PropTypes.oneOf(['flex', 'text']),
-    field: PropTypes.string.isRequired,
-    renderCell: PropTypes.func
-  }),
-  /**
-   * If `true`, displays the data in a list view.
-   * Use in combination with `unstable_listColumn`.
-   */
-  unstable_listView: PropTypes.bool,
   /**
    * If `true`, the Data Grid enables column virtualization when `getRowHeight` is set to `() => 'auto'`.
    * By default, column virtualization is disabled when dynamic row height is enabled to measure the row height correctly.

package/modern/components/GridDataSourceGroupingCriteriaCell.js

@@ -49,7 +49,7 @@ function GridGroupingCriteriaCellIcon(props) {
       })
     });
   }
-  return descendantCount > 0 ? /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
+  return descendantCount === -1 || descendantCount > 0 ? /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
     size: "small",
     onClick: handleClick,
     tabIndex: -1,
@@ -82,7 +82,7 @@ export function GridDataSourceGroupingCriteriaCell(props) {
   const classes = useUtilityClasses(rootProps);
   let descendantCount = 0;
   if (row) {
-    descendantCount = Math.max(rootProps.dataSource?.getChildrenCount?.(row) ?? 0, 0);
+    descendantCount = rootProps.dataSource?.getChildrenCount?.(row) ?? 0;
   }
   let cellContent;
   const colDef = apiRef.current.getColumn(rowNode.groupingField);