@mui/x-data-grid 8.0.0-beta.2 → 8.0.0

package/esm/hooks/features/rows/useGridRows.js

@@ -4,17 +4,18 @@ import useLazyRef from '@mui/utils/useLazyRef';
 import { isObjectEmpty } from '@mui/x-internals/isObjectEmpty';
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { useGridLogger } from "../../utils/useGridLogger.js";
-import { gridRowCountSelector, gridRowsLookupSelector, gridRowTreeSelector, gridRowGroupingNameSelector, gridRowTreeDepthsSelector, gridDataRowIdsSelector, gridRowMaximumTreeDepthSelector, gridRowGroupsToFetchSelector, gridRowNodeSelector } from "./gridRowsSelector.js";
+import { gridRowCountSelector, gridRowsLookupSelector, gridRowTreeSelector, gridRowGroupingNameSelector, gridRowTreeDepthsSelector, gridDataRowIdsSelector, gridRowMaximumTreeDepthSelector, gridRowGroupsToFetchSelector, gridRowNodeSelector, gridDataRowsSelector } from "./gridRowsSelector.js";
 import { gridRowIdSelector } from "../../core/gridPropsSelectors.js";
 import { useTimeout } from "../../utils/useTimeout.js";
 import { GridSignature } from "../../../constants/signature.js";
-import { useGridApiEventHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent } from "../../utils/useGridEvent.js";
 import { getVisibleRows } from "../../utils/useGridVisibleRows.js";
 import { gridSortedRowIdsSelector } from "../sorting/gridSortingSelector.js";
 import { gridFilteredRowsLookupSelector } from "../filter/gridFilterSelector.js";
 import { getTreeNodeDescendants, createRowsInternalCache, getRowsStateFromCache, isAutogeneratedRowNode, GRID_ROOT_GROUP_ID, GRID_ID_AUTOGENERATED, updateCacheWithNewRows, getTopLevelRowCount, getRowIdFromRowModel, computeRowsUpdates } from "./gridRowsUtils.js";
 import { useGridRegisterPipeApplier } from "../../core/pipeProcessing/index.js";
 import { GridStrategyGroup } from "../../core/strategyProcessing/index.js";
+import { gridPivotActiveSelector } from "../pivoting/index.js";
 export const rowsStateInitializer = (state, props, apiRef) => {
   const isDataSourceAvailable = !!props.dataSource;
   apiRef.current.caches.rows = createRowsInternalCache({
@@ -97,6 +98,10 @@ export const useGridRows = (apiRef, props) => {
    */
   const setRows = React.useCallback(rows => {
     logger.debug(`Updating all rows, new length ${rows.length}`);
+    if (gridPivotActiveSelector(apiRef)) {
+      apiRef.current.updateNonPivotRows(rows, false);
+      return;
+    }
     const cache = createRowsInternalCache({
       rows,
       getRowId: props.getRowId,
@@ -114,6 +119,10 @@ export const useGridRows = (apiRef, props) => {
     if (props.signature === GridSignature.DataGrid && updates.length > 1) {
       throw new Error(['MUI X: You cannot update several rows at once in `apiRef.current.updateRows` on the DataGrid.', 'You need to upgrade to DataGridPro or DataGridPremium component to unlock this feature.'].join('\n'));
     }
+    if (gridPivotActiveSelector(apiRef)) {
+      apiRef.current.updateNonPivotRows(updates);
+      return;
+    }
     const nonPinnedRowsUpdates = computeRowsUpdates(apiRef, updates, props.getRowId);
     const cache = updateCacheWithNewRows({
       updates: nonPinnedRowsUpdates,
@@ -125,7 +134,7 @@ export const useGridRows = (apiRef, props) => {
       throttle: true
     });
   }, [props.signature, props.getRowId, throttledRowsChange, apiRef]);
-  const updateServerRows = React.useCallback((updates, groupKeys) => {
+  const updateNestedRows = React.useCallback((updates, groupKeys) => {
     const nonPinnedRowsUpdates = computeRowsUpdates(apiRef, updates, props.getRowId);
     const cache = updateCacheWithNewRows({
       updates: nonPinnedRowsUpdates,
@@ -139,9 +148,6 @@ export const useGridRows = (apiRef, props) => {
     });
   }, [props.getRowId, throttledRowsChange, apiRef]);
   const setLoading = React.useCallback(loading => {
-    if (loading === props.loading) {
-      return;
-    }
     logger.debug(`Setting loading to ${loading}`);
     apiRef.current.setState(state => _extends({}, state, {
       rows: _extends({}, state.rows, {
@@ -149,7 +155,7 @@ export const useGridRows = (apiRef, props) => {
       })
     }));
     apiRef.current.caches.rows.loadingPropBeforePartialUpdates = loading;
-  }, [props.loading, apiRef, logger]);
+  }, [apiRef, logger]);
   const getRowModels = React.useCallback(() => {
     const dataRows = gridDataRowIdsSelector(apiRef);
     const idRowsLookup = gridRowsLookupSelector(apiRef);
@@ -322,7 +328,7 @@ export const useGridRows = (apiRef, props) => {
     getRowGroupChildren
   };
   const rowProPrivateApi = {
-    updateServerRows
+    updateNestedRows
   };
 
   /**
@@ -373,8 +379,8 @@ export const useGridRows = (apiRef, props) => {
       groupRows();
     }
   }, [apiRef, groupRows]);
-  useGridApiEventHandler(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);
-  useGridApiEventHandler(apiRef, 'strategyAvailabilityChange', handleStrategyActivityChange);
+  useGridEvent(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);
+  useGridEvent(apiRef, 'strategyAvailabilityChange', handleStrategyActivityChange);
 
   /**
    * APPLIERS
@@ -416,7 +422,7 @@ export const useGridRows = (apiRef, props) => {
       isRowCountPropUpdated = true;
       lastRowCount.current = props.rowCount;
     }
-    const currentRows = props.dataSource ? Array.from(apiRef.current.getRowModels().values()) : props.rows;
+    const currentRows = props.dataSource ? gridDataRowsSelector(apiRef) : props.rows;
     const areNewRowsAlreadyInState = apiRef.current.caches.rows.rowsBeforePartialUpdates === currentRows;
     const isNewLoadingAlreadyInState = apiRef.current.caches.rows.loadingPropBeforePartialUpdates === props.loading;
     const isNewRowCountAlreadyInState = apiRef.current.caches.rows.rowCountPropBeforePartialUpdates === props.rowCount;

package/esm/hooks/features/scroll/useGridScroll.d.ts

@@ -9,4 +9,4 @@ import { DataGridProcessedProps } from "../../../models/props/DataGridProps.js";
  * @requires useGridFilter (state)
  * @requires useGridColumnSpanning (method)
  */
-export declare const useGridScroll: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "pagination" | "unstable_listView">) => void;
+export declare const useGridScroll: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "pagination" | "listView">) => void;

package/esm/hooks/features/scroll/useGridScroll.js

@@ -52,7 +52,7 @@ export const useGridScroll = (apiRef, props) => {
   const scrollToIndexes = React.useCallback(params => {
     const dimensions = gridDimensionsSelector(apiRef);
     const totalRowCount = gridRowCountSelector(apiRef);
-    const visibleColumns = props.unstable_listView ? [gridListColumnSelector(apiRef)] : gridVisibleColumnDefinitionsSelector(apiRef);
+    const visibleColumns = props.listView ? [gridListColumnSelector(apiRef)] : gridVisibleColumnDefinitionsSelector(apiRef);
     const scrollToHeader = params.rowIndex == null;
     if (!scrollToHeader && totalRowCount === 0 || visibleColumns.length === 0) {
       return false;
@@ -99,7 +99,7 @@ export const useGridScroll = (apiRef, props) => {
       return true;
     }
     return false;
-  }, [logger, apiRef, virtualScrollerRef, props.pagination, visibleSortedRows, props.unstable_listView]);
+  }, [logger, apiRef, virtualScrollerRef, props.pagination, visibleSortedRows, props.listView]);
   const scroll = React.useCallback(params => {
     if (virtualScrollerRef.current && params.left !== undefined && colRef.current) {
       const direction = isRtl ? -1 : 1;

package/esm/hooks/features/sorting/gridSortingSelector.d.ts

@@ -5,17 +5,17 @@ import { GridStateCommunity } from "../../../models/gridStateCommunity.js";
  * Get the id of the rows after the sorting process.
  * @category Sorting
  */
-export declare const gridSortedRowIdsSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridSortingState").GridSortingState, GridRowId[]>;
+export declare const gridSortedRowIdsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridSortingState, GridRowId[]>;
 /**
  * Get the id and the model of the rows after the sorting process.
  * @category Sorting
  */
-export declare const gridSortedRowEntriesSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../..").GridRowTreeConfig, GridRowEntry<GridValidRowModel>[]>;
+export declare const gridSortedRowEntriesSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridRowTreeConfig, GridRowEntry<GridValidRowModel>[]>;
 /**
  * Get the current sorting model.
  * @category Sorting
  */
-export declare const gridSortModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridSortingState").GridSortingState, GridSortModel>;
+export declare const gridSortModelSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridSortingState, GridSortModel>;
 export type GridSortColumnLookup = Record<string, {
   sortDirection: GridSortDirection;
   sortIndex?: number;
@@ -24,9 +24,9 @@ export type GridSortColumnLookup = Record<string, {
  * @category Sorting
  * @ignore - do not document.
  */
-export declare const gridSortColumnLookupSelector: import("../../..").OutputSelector<GridStateCommunity, GridSortModel, GridSortColumnLookup>;
+export declare const gridSortColumnLookupSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, GridSortModel, GridSortColumnLookup>;
 /**
  * @category Sorting
  * @ignore - do not document.
  */
-export declare const gridSortedRowIndexLookupSelector: import("../../..").OutputSelector<GridStateCommunity, GridRowId[], Record<GridRowId, number>>;
+export declare const gridSortedRowIndexLookupSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, GridRowId[], Record<GridRowId, number>>;

package/esm/hooks/features/sorting/useGridSorting.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
-import { useGridApiEventHandler } from "../../utils/useGridApiEventHandler.js";
+import { useGridEvent } from "../../utils/useGridEvent.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 import { useGridLogger } from "../../utils/useGridLogger.js";
 import { gridColumnLookupSelector } from "../columns/gridColumnsSelector.js";
@@ -226,11 +226,11 @@ export const useGridSorting = (apiRef, props) => {
     }
   }, [apiRef]);
   useGridRegisterPipeProcessor(apiRef, 'columnMenu', addColumnMenuItem);
-  useGridApiEventHandler(apiRef, 'columnHeaderClick', handleColumnHeaderClick);
-  useGridApiEventHandler(apiRef, 'columnHeaderKeyDown', handleColumnHeaderKeyDown);
-  useGridApiEventHandler(apiRef, 'rowsSet', apiRef.current.applySorting);
-  useGridApiEventHandler(apiRef, 'columnsChange', handleColumnsChange);
-  useGridApiEventHandler(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);
+  useGridEvent(apiRef, 'columnHeaderClick', handleColumnHeaderClick);
+  useGridEvent(apiRef, 'columnHeaderKeyDown', handleColumnHeaderKeyDown);
+  useGridEvent(apiRef, 'rowsSet', apiRef.current.applySorting);
+  useGridEvent(apiRef, 'columnsChange', handleColumnsChange);
+  useGridEvent(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);
 
   /**
    * 1ST RENDER

package/esm/hooks/features/virtualization/gridFocusedVirtualCellSelector.d.ts

@@ -1,6 +1,6 @@
-export declare const gridFocusedVirtualCellSelector: import("../../..").OutputSelector<import("../../../models/gridStateCommunity").GridStateCommunity, import("../../..").GridCellCoordinates | null, {
+export declare const gridFocusedVirtualCellSelector: import("@mui/x-data-grid").OutputSelector<import("../../../models/gridStateCommunity").GridStateCommunity, import("@mui/x-data-grid").GridCellCoordinates | null, {
   rowIndex: number;
   columnIndex: number;
-  id?: import("../../..").GridRowId | undefined;
+  id?: import("@mui/x-data-grid").GridRowId | undefined;
   field?: string | undefined;
 } | null>;

package/esm/hooks/features/virtualization/gridVirtualizationSelectors.d.ts

@@ -4,33 +4,33 @@ import { GridStateCommunity } from "../../../models/gridStateCommunity.js";
  * Get the columns state
  * @category Virtualization
  */
-export declare const gridVirtualizationSelector: import("../../..").OutputSelector<GridStateCommunity, unknown, import("./useGridVirtualization").GridVirtualizationState>;
+export declare const gridVirtualizationSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, unknown, import("@mui/x-data-grid").GridVirtualizationState>;
 /**
  * Get the enabled state for virtualization
  * @category Virtualization
  * @deprecated Use `gridVirtualizationColumnEnabledSelector` and `gridVirtualizationRowEnabledSelector`
  */
-export declare const gridVirtualizationEnabledSelector: import("../../..").OutputSelector<GridStateCommunity, import("./useGridVirtualization").GridVirtualizationState, boolean>;
+export declare const gridVirtualizationEnabledSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridVirtualizationState, boolean>;
 /**
  * Get the enabled state for column virtualization
  * @category Virtualization
  */
-export declare const gridVirtualizationColumnEnabledSelector: import("../../..").OutputSelector<GridStateCommunity, import("./useGridVirtualization").GridVirtualizationState, boolean>;
+export declare const gridVirtualizationColumnEnabledSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridVirtualizationState, boolean>;
 /**
  * Get the enabled state for row virtualization
  * @category Virtualization
  */
-export declare const gridVirtualizationRowEnabledSelector: import("../../..").OutputSelector<GridStateCommunity, import("./useGridVirtualization").GridVirtualizationState, boolean>;
+export declare const gridVirtualizationRowEnabledSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridVirtualizationState, boolean>;
 /**
  * Get the render context
  * @category Virtualization
  * @ignore - do not document.
  */
-export declare const gridRenderContextSelector: import("../../..").OutputSelector<GridStateCommunity, import("./useGridVirtualization").GridVirtualizationState, import("../../..").GridRenderContext>;
+export declare const gridRenderContextSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, import("@mui/x-data-grid").GridVirtualizationState, import("@mui/x-data-grid").GridRenderContext>;
 /**
  * Get the render context, with only columns filled in.
  * This is cached, so it can be used to only re-render when the column interval changes.
  * @category Virtualization
  * @ignore - do not document.
  */
-export declare const gridRenderContextColumnsSelector: import("../../..").OutputSelector<GridStateCommunity, number, GridColumnsRenderContext>;
+export declare const gridRenderContextColumnsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, number, GridColumnsRenderContext>;

package/esm/hooks/features/virtualization/useGridVirtualScroller.js

@@ -15,7 +15,7 @@ import { useRunOnce } from "../../utils/useRunOnce.js";
 import { gridVisibleColumnDefinitionsSelector, gridVisiblePinnedColumnDefinitionsSelector, gridColumnPositionsSelector, gridHasColSpanSelector } from "../columns/gridColumnsSelector.js";
 import { gridPinnedRowsSelector, gridRowTreeSelector } from "../rows/gridRowsSelector.js";
 import { useGridVisibleRows, getVisibleRows } from "../../utils/useGridVisibleRows.js";
-import { useGridApiOptionHandler } from "../../utils/index.js";
+import { useGridEventPriority } from "../../utils/index.js";
 import * as platform from "../../../utils/platform.js";
 import { clamp, range } from "../../../utils/utils.js";
 import { gridRowsMetaSelector } from "../rows/gridRowsMetaSelector.js";
@@ -53,7 +53,7 @@ export const useGridVirtualScroller = () => {
   const apiRef = useGridPrivateApiContext();
   const rootProps = useGridRootProps();
   const {
-    unstable_listView: listView
+    listView
   } = rootProps;
   const visibleColumns = useGridSelector(apiRef, () => listView ? [gridListColumnSelector(apiRef)] : gridVisibleColumnDefinitionsSelector(apiRef));
   const enabledForRows = useGridSelector(apiRef, gridVirtualizationRowEnabledSelector) && !isJSDOM;
@@ -500,9 +500,9 @@ export const useGridVirtualScroller = () => {
   apiRef.current.register('private', {
     updateRenderContext: forceUpdateRenderContext
   });
-  useGridApiOptionHandler(apiRef, 'sortedRowsSet', forceUpdateRenderContext);
-  useGridApiOptionHandler(apiRef, 'paginationModelChange', forceUpdateRenderContext);
-  useGridApiOptionHandler(apiRef, 'columnsChange', forceUpdateRenderContext);
+  useGridEventPriority(apiRef, 'sortedRowsSet', forceUpdateRenderContext);
+  useGridEventPriority(apiRef, 'paginationModelChange', forceUpdateRenderContext);
+  useGridEventPriority(apiRef, 'columnsChange', forceUpdateRenderContext);
   return {
     renderContext,
     setPanels,
@@ -549,7 +549,7 @@ function needsHorizontalScrollbarSelector(apiRef) {
 function inputsSelector(apiRef, rootProps, enabledForRows, enabledForColumns) {
   const dimensions = gridDimensionsSelector(apiRef);
   const currentPage = getVisibleRows(apiRef, rootProps);
-  const visibleColumns = rootProps.unstable_listView ? [gridListColumnSelector(apiRef)] : gridVisibleColumnDefinitionsSelector(apiRef);
+  const visibleColumns = rootProps.listView ? [gridListColumnSelector(apiRef)] : gridVisibleColumnDefinitionsSelector(apiRef);
   const hiddenCellsOriginMap = gridRowSpanningHiddenCellsOriginMapSelector(apiRef);
   const lastRowId = apiRef.current.state.rows.dataRowIds.at(-1);
   const lastColumn = visibleColumns.at(-1);
@@ -573,7 +573,7 @@ function inputsSelector(apiRef, rootProps, enabledForRows, enabledForColumns) {
     pinnedColumns: gridVisiblePinnedColumnDefinitionsSelector(apiRef),
     visibleColumns,
     hiddenCellsOriginMap,
-    listView: rootProps.unstable_listView ?? false,
+    listView: rootProps.listView ?? false,
     virtualizeColumnsWithAutoRowHeight: rootProps.virtualizeColumnsWithAutoRowHeight
   };
 }
@@ -584,11 +584,6 @@ function computeRenderContext(inputs, scrollPosition, scrollCache) {
     firstColumnIndex: 0,
     lastColumnIndex: inputs.visibleColumns.length
   };
-  if (inputs.listView) {
-    return _extends({}, renderContext, {
-      lastColumnIndex: 1
-    });
-  }
   const {
     top,
     left
@@ -613,6 +608,11 @@ function computeRenderContext(inputs, scrollPosition, scrollCache) {
     renderContext.firstRowIndex = firstRowIndex;
     renderContext.lastRowIndex = lastRowIndex;
   }
+  if (inputs.listView) {
+    return _extends({}, renderContext, {
+      lastColumnIndex: 1
+    });
+  }
   if (inputs.enabledForColumns) {
     let firstColumnIndex = 0;
     let lastColumnIndex = inputs.columnPositions.length;

package/esm/hooks/utils/index.d.ts

@@ -1,4 +1,4 @@
-export { useGridApiEventHandler, useGridApiOptionHandler, unstable_resetCleanupTracking } from "./useGridApiEventHandler.js";
+export { useGridEvent, useGridEventPriority, unstable_resetCleanupTracking } from "./useGridEvent.js";
 export * from "./useGridApiMethod.js";
 export * from "./useGridLogger.js";
 export { useGridSelector } from "./useGridSelector.js";

package/esm/hooks/utils/index.js

@@ -1,4 +1,4 @@
-export { useGridApiEventHandler, useGridApiOptionHandler, unstable_resetCleanupTracking } from "./useGridApiEventHandler.js";
+export { useGridEvent, useGridEventPriority, unstable_resetCleanupTracking } from "./useGridEvent.js";
 export * from "./useGridApiMethod.js";
 export * from "./useGridLogger.js";
 export { useGridSelector } from "./useGridSelector.js";

package/esm/hooks/utils/useGridAriaAttributes.js

@@ -13,8 +13,14 @@ export const useGridAriaAttributes = () => {
   const accessibleRowCount = useGridSelector(apiRef, gridExpandedRowCountSelector);
   const headerGroupingMaxDepth = useGridSelector(apiRef, gridColumnGroupsHeaderMaxDepthSelector);
   const pinnedRowsCount = useGridSelector(apiRef, gridPinnedRowsCountSelector);
+  const ariaLabel = rootProps['aria-label'];
+  const ariaLabelledby = rootProps['aria-labelledby'];
+  // `aria-label` and `aria-labelledby` should take precedence over `label`
+  const shouldUseLabelAsAriaLabel = !ariaLabel && !ariaLabelledby && rootProps.label;
   return {
     role: 'grid',
+    'aria-label': shouldUseLabelAsAriaLabel ? rootProps.label : ariaLabel,
+    'aria-labelledby': ariaLabelledby,
     'aria-colcount': visibleColumns.length,
     'aria-rowcount': headerGroupingMaxDepth + 1 + pinnedRowsCount + accessibleRowCount,
     'aria-multiselectable': isMultipleRowSelectionEnabled(rootProps)

package/esm/hooks/utils/{useGridApiEventHandler.d.ts → useGridEvent.d.ts}

@@ -4,8 +4,8 @@ import { GridEventListener, GridEvents } from "../../models/events/index.js";
 import { TimerBasedCleanupTracking } from "../../utils/cleanupTracking/TimerBasedCleanupTracking.js";
 import { FinalizationRegistryBasedCleanupTracking } from "../../utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js";
 import type { GridApiCommon } from '../../models';
-export declare function useGridApiEventHandler<Api extends GridApiCommon, E extends GridEvents>(apiRef: RefObject<Api>, eventName: E, handler?: GridEventListener<E>, options?: EventListenerOptions): void;
-export declare function useGridApiOptionHandler<Api extends GridApiCommon, E extends GridEvents>(apiRef: RefObject<Api>, eventName: E, handler?: GridEventListener<E>): void;
+export declare function useGridEvent<Api extends GridApiCommon, E extends GridEvents>(apiRef: RefObject<Api>, eventName: E, handler?: GridEventListener<E>, options?: EventListenerOptions): void;
+export declare function useGridEventPriority<Api extends GridApiCommon, E extends GridEvents>(apiRef: RefObject<Api>, eventName: E, handler?: GridEventListener<E>): void;
 export declare function unstable_resetCleanupTracking(): void;
 export declare const internal_registryContainer: {
   current: TimerBasedCleanupTracking | FinalizationRegistryBasedCleanupTracking;

package/esm/hooks/utils/{useGridApiEventHandler.js → useGridEvent.js}

@@ -14,7 +14,7 @@ const registryContainer = {
   current: createRegistry()
 };
 let cleanupTokensCounter = 0;
-export function useGridApiEventHandler(apiRef, eventName, handler, options) {
+export function useGridEvent(apiRef, eventName, handler, options) {
   const objectRetainedByReact = React.useState(ObjectToBeRetainedByReact.create)[0];
   const subscription = React.useRef(null);
   const handlerRef = React.useRef(null);
@@ -70,8 +70,8 @@ export function useGridApiEventHandler(apiRef, eventName, handler, options) {
 const OPTIONS_IS_FIRST = {
   isFirst: true
 };
-export function useGridApiOptionHandler(apiRef, eventName, handler) {
-  useGridApiEventHandler(apiRef, eventName, handler, OPTIONS_IS_FIRST);
+export function useGridEventPriority(apiRef, eventName, handler) {
+  useGridEvent(apiRef, eventName, handler, OPTIONS_IS_FIRST);
 }
 
 // TODO: move to @mui/x-data-grid/internals

package/esm/hooks/utils/useGridNativeEventListener.js

@@ -1,8 +1,8 @@
 import { useGridLogger } from "./useGridLogger.js";
-import { useGridApiOptionHandler } from "./useGridApiEventHandler.js";
+import { useGridEventPriority } from "./useGridEvent.js";
 export const useGridNativeEventListener = (apiRef, ref, eventName, handler, options) => {
   const logger = useGridLogger(apiRef, 'useNativeEventListener');
-  useGridApiOptionHandler(apiRef, 'rootMount', () => {
+  useGridEventPriority(apiRef, 'rootMount', () => {
     const targetElement = ref();
     if (!targetElement || !eventName) {
       return undefined;

package/esm/hooks/utils/useGridSelector.js

@@ -1,10 +1,7 @@
 import * as React from 'react';
 import { fastObjectShallowCompare } from '@mui/x-internals/fastObjectShallowCompare';
 import { warnOnce } from '@mui/x-internals/warning';
-// use-sync-external-store has no exports field defined
-// See https://github.com/facebook/react/issues/30698
-// eslint-disable-next-line import/extensions
-import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
 import { useLazyRef } from "./useLazyRef.js";
 const defaultCompare = Object.is;
 export const objectShallowCompare = fastObjectShallowCompare;

package/esm/hooks/utils/useGridVisibleRows.d.ts

@@ -2,12 +2,12 @@ import { RefObject } from '@mui/x-internals/types';
 import { DataGridProcessedProps } from "../../models/props/DataGridProps.js";
 import type { GridApiCommon } from '../../models';
 export declare const getVisibleRows: <Api extends GridApiCommon>(apiRef: RefObject<Api>, props?: Pick<DataGridProcessedProps, "pagination" | "paginationMode">) => {
-  rows: import("../..").GridRowEntry<import("../..").GridValidRowModel>[];
+  rows: import("@mui/x-data-grid").GridRowEntry<import("@mui/x-data-grid").GridValidRowModel>[];
   range: {
     firstRowIndex: number;
     lastRowIndex: number;
   } | null;
-  rowIdToIndexMap: Map<import("../..").GridRowId, number>;
+  rowIdToIndexMap: Map<import("@mui/x-data-grid").GridRowId, number>;
 };
 /**
  * Computes the list of rows that are reachable by scroll.
@@ -17,10 +17,10 @@ export declare const getVisibleRows: <Api extends GridApiCommon>(apiRef: RefObje
  * - If the row tree is flat, it only contains up to `state.pageSize` rows.
  */
 export declare const useGridVisibleRows: <Api extends GridApiCommon>(apiRef: RefObject<Api>, props?: Pick<DataGridProcessedProps, "pagination" | "paginationMode">) => {
-  rows: import("../..").GridRowEntry<import("../..").GridValidRowModel>[];
+  rows: import("@mui/x-data-grid").GridRowEntry<import("@mui/x-data-grid").GridValidRowModel>[];
   range: {
     firstRowIndex: number;
     lastRowIndex: number;
   } | null;
-  rowIdToIndexMap: Map<import("../..").GridRowId, number>;
+  rowIdToIndexMap: Map<import("@mui/x-data-grid").GridRowId, number>;
 };

package/esm/hooks/utils/useIsSSR.js

@@ -1,7 +1,4 @@
-// use-sync-external-store has no exports field defined
-// See https://github.com/facebook/react/issues/30698
-// eslint-disable-next-line import/extensions
-import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
 const emptySubscribe = () => () => {};
 const clientSnapshot = () => false;
 const serverSnapshot = () => true;

package/esm/index.css

@@ -0,0 +1,5 @@
+/* Placeholder file to ensure CSS imports are working */
+
+.MuiDataGrid {
+  display: block;
+}

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v8.0.0-beta.2
+ * @mui/x-data-grid v8.0.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/esm/internals/index.d.ts

@@ -5,8 +5,9 @@ export { GridVirtualScrollerRenderZone } from "../components/virtualization/Grid
 export type { GridDetailPanelsProps } from '../components/GridDetailPanels';
 export type { GridPinnedRowsProps } from '../components/GridPinnedRows';
 export { GridHeaders } from "../components/GridHeaders.js";
-export { GridToolbar } from "../components/toolbarV8/GridToolbar.js";
+export { GridToolbar, GridToolbarDivider } from "../components/toolbarV8/GridToolbar.js";
 export type { GridToolbarProps } from '../components/toolbarV8/GridToolbar';
+export { GridColumnSortButton } from "../components/GridColumnSortButton.js";
 export { GridBaseColumnHeaders } from "../components/columnHeaders/GridBaseColumnHeaders.js";
 export { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from "../constants/defaultGridSlotsComponents.js";
 export * from "../constants/signature.js";
@@ -19,7 +20,7 @@ export type { GridPipeProcessor } from '../hooks/core/pipeProcessing';
 export { GridStrategyGroup, useGridRegisterStrategyProcessor, GRID_DEFAULT_STRATEGY } from "../hooks/core/strategyProcessing/index.js";
 export type { GridStrategyProcessor, GridStrategyProcessorName } from '../hooks/core/strategyProcessing';
 export { useGridInitialization } from "../hooks/core/useGridInitialization.js";
-export { unwrapPrivateAPI } from "../hooks/core/useGridApiInitialization.js";
+export { unwrapPrivateAPI, useGridApiInitialization } from "../hooks/core/useGridApiInitialization.js";
 export { useGridClipboard } from "../hooks/features/clipboard/useGridClipboard.js";
 export * from "../hooks/features/columnHeaders/useGridColumnHeaders.js";
 export { gridHeaderFilteringEditFieldSelector, gridHeaderFilteringMenuSelector } from "../hooks/features/headerFiltering/gridHeaderFilteringSelectors.js";
@@ -81,8 +82,9 @@ export { useTimeout } from "../hooks/utils/useTimeout.js";
 export { useGridVisibleRows, getVisibleRows } from "../hooks/utils/useGridVisibleRows.js";
 export { useGridInitializeState } from "../hooks/utils/useGridInitializeState.js";
 export type { GridStateInitializer } from '../hooks/utils/useGridInitializeState';
+export type * as BaseSlots from '../models/gridBaseSlots';
 export type * from '../models/props/DataGridProps';
-export type { GridDataSourceApiBase, GridDataSourceApi } from '../hooks/features/dataSource/models';
+export type { GridDataSourceApiBase, GridDataSourceApi, GridDataSourceBaseOptions } from '../hooks/features/dataSource/models';
 export { DataSourceRowsUpdateStrategy } from "../hooks/features/dataSource/utils.js";
 export { useGridDataSourceBase } from "../hooks/features/dataSource/useGridDataSourceBase.js";
 export { CacheChunkManager } from "../hooks/features/dataSource/utils.js";
@@ -90,6 +92,7 @@ export { gridGetRowsParamsSelector } from "../hooks/features/dataSource/gridData
 export { getColumnsToExport, defaultGetRowsToExport } from "../hooks/features/export/utils.js";
 export * from "../utils/createControllablePromise.js";
 export * from "../utils/rtlFlipSide.js";
+export { NotRendered } from "../utils/assert.js";
 export { createSelector, createRootSelector, createSelectorMemoized } from "../utils/createSelector.js";
 export { gridRowGroupsToFetchSelector } from "../hooks/features/rows/gridRowsSelector.js";
 export { findParentElementFromClassName, getActiveElement, isEventTargetInPortal } from "../utils/domUtils.js";
@@ -109,4 +112,8 @@ export * from "./utils/index.js";
 export * from "./constants.js";
 export type { Localization } from '../utils/getGridLocalization';
 export * from "./demo/index.js";
-export { GridSkeletonLoadingOverlayInner } from "../components/GridSkeletonLoadingOverlay.js";
+export { GridSkeletonLoadingOverlayInner } from "../components/GridSkeletonLoadingOverlay.js";
+export type { GridConfiguration } from '../models/configuration/gridConfiguration';
+export * from "../hooks/features/pivoting/index.js";
+export { createSvgIcon } from "../material/icons/createSvgIcon.js";
+export { useGridPanelContext } from "../components/panel/GridPanelContext.js";

package/esm/internals/index.js

@@ -2,7 +2,8 @@ export { GridVirtualScroller } from "../components/virtualization/GridVirtualScr
 export { GridVirtualScrollerContent } from "../components/virtualization/GridVirtualScrollerContent.js";
 export { GridVirtualScrollerRenderZone } from "../components/virtualization/GridVirtualScrollerRenderZone.js";
 export { GridHeaders } from "../components/GridHeaders.js";
-export { GridToolbar } from "../components/toolbarV8/GridToolbar.js";
+export { GridToolbar, GridToolbarDivider } from "../components/toolbarV8/GridToolbar.js";
+export { GridColumnSortButton } from "../components/GridColumnSortButton.js";
 export { GridBaseColumnHeaders } from "../components/columnHeaders/GridBaseColumnHeaders.js";
 export { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from "../constants/defaultGridSlotsComponents.js";
 export * from "../constants/signature.js";
@@ -13,7 +14,7 @@ export { getValueOptions } from "../components/panel/filterPanel/filterPanelUtil
 export { useGridRegisterPipeProcessor } from "../hooks/core/pipeProcessing/index.js";
 export { GridStrategyGroup, useGridRegisterStrategyProcessor, GRID_DEFAULT_STRATEGY } from "../hooks/core/strategyProcessing/index.js";
 export { useGridInitialization } from "../hooks/core/useGridInitialization.js";
-export { unwrapPrivateAPI } from "../hooks/core/useGridApiInitialization.js";
+export { unwrapPrivateAPI, useGridApiInitialization } from "../hooks/core/useGridApiInitialization.js";
 export { useGridClipboard } from "../hooks/features/clipboard/useGridClipboard.js";
 export * from "../hooks/features/columnHeaders/useGridColumnHeaders.js";
 export { gridHeaderFilteringEditFieldSelector, gridHeaderFilteringMenuSelector } from "../hooks/features/headerFiltering/gridHeaderFilteringSelectors.js";
@@ -73,6 +74,7 @@ export { gridGetRowsParamsSelector } from "../hooks/features/dataSource/gridData
 export { getColumnsToExport, defaultGetRowsToExport } from "../hooks/features/export/utils.js";
 export * from "../utils/createControllablePromise.js";
 export * from "../utils/rtlFlipSide.js";
+export { NotRendered } from "../utils/assert.js";
 export { createSelector, createRootSelector, createSelectorMemoized } from "../utils/createSelector.js";
 export { gridRowGroupsToFetchSelector } from "../hooks/features/rows/gridRowsSelector.js";
 export { findParentElementFromClassName, getActiveElement, isEventTargetInPortal } from "../utils/domUtils.js";
@@ -87,4 +89,7 @@ export { serializeCellValue } from "../hooks/features/export/serializers/csvSeri
 export * from "./utils/index.js";
 export * from "./constants.js";
 export * from "./demo/index.js";
-export { GridSkeletonLoadingOverlayInner } from "../components/GridSkeletonLoadingOverlay.js";
+export { GridSkeletonLoadingOverlayInner } from "../components/GridSkeletonLoadingOverlay.js";
+export * from "../hooks/features/pivoting/index.js";
+export { createSvgIcon } from "../material/icons/createSvgIcon.js";
+export { useGridPanelContext } from "../components/panel/GridPanelContext.js";