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

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

@@ -3,6 +3,7 @@ import * as React from 'react';
 import useLazyRef from '@mui/utils/useLazyRef';
 import { unstable_debounce as debounce } from '@mui/utils';
 import { warnOnce } from '@mui/x-internals/warning';
+import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
 import { GRID_ROOT_GROUP_ID } from "../rows/gridRowsUtils.js";
 import { runIf } from "../../../utils/utils.js";
 import { GridStrategyGroup } from "../../core/strategyProcessing/index.js";
@@ -11,7 +12,7 @@ import { gridPaginationModelSelector } from "../pagination/gridPaginationSelecto
 import { gridGetRowsParamsSelector } from "./gridDataSourceSelector.js";
 import { CacheChunkManager, DataSourceRowsUpdateStrategy } from "./utils.js";
 import { GridDataSourceCacheDefault } from "./cache.js";
-import { GridGetRowsError } from "./gridDataSourceError.js";
+import { GridGetRowsError, GridUpdateRowError } from "./gridDataSourceError.js";
 const noopCache = {
   clear: () => {},
   get: () => undefined,
@@ -67,9 +68,7 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
     try {
       const getRowsResponse = await getRows(fetchParams);
       const cacheResponses = cacheChunkManager.splitResponse(fetchParams, getRowsResponse);
-      cacheResponses.forEach((response, key) => {
-        cache.set(key, response);
-      });
+      cacheResponses.forEach((response, key) => cache.set(key, response));
       if (lastRequestId.current === requestId) {
         apiRef.current.applyStrategyProcessor('dataSourceRowsUpdate', {
           response: getRowsResponse,
@@ -89,7 +88,7 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
             cause: originalError
           }));
         } else if (process.env.NODE_ENV !== 'production') {
-          warnOnce(['MUI X: A call to `dataSource.getRows()` threw an error which was not handled because `unstable_onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid unstable_onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'], 'error');
+          warnOnce(['MUI X: A call to `dataSource.getRows()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'], 'error');
         }
       }
     } finally {
@@ -118,10 +117,42 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
       response
     }, true);
   }, [apiRef]);
+  const dataSourceUpdateRow = props.dataSource?.updateRow;
+  const handleEditRowOption = options.handleEditRow;
+  const editRow = React.useCallback(async params => {
+    if (!dataSourceUpdateRow) {
+      return undefined;
+    }
+    try {
+      const finalRowUpdate = await dataSourceUpdateRow(params);
+      if (typeof handleEditRowOption === 'function') {
+        handleEditRowOption(params, finalRowUpdate);
+        return finalRowUpdate;
+      }
+      apiRef.current.updateNestedRows([finalRowUpdate], []);
+      if (finalRowUpdate && !isDeepEqual(finalRowUpdate, params.previousRow)) {
+        // Reset the outdated cache, only if the row is _actually_ updated
+        apiRef.current.dataSource.cache.clear();
+      }
+      return finalRowUpdate;
+    } catch (errorThrown) {
+      if (typeof onDataSourceErrorProp === 'function') {
+        onDataSourceErrorProp(new GridUpdateRowError({
+          message: errorThrown?.message,
+          params,
+          cause: errorThrown
+        }));
+      } else if (process.env.NODE_ENV !== 'production') {
+        warnOnce(['MUI X: A call to `dataSource.updateRow()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'], 'error');
+      }
+      throw errorThrown; // Let the caller handle the error further
+    }
+  }, [apiRef, dataSourceUpdateRow, onDataSourceErrorProp, handleEditRowOption]);
   const dataSourceApi = {
     dataSource: {
       fetchRows,
-      cache
+      cache,
+      editRow
     }
   };
   const debouncedFetchRows = React.useMemo(() => debounce(fetchRows, 0), [fetchRows]);
@@ -147,6 +178,7 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
     api: {
       public: dataSourceApi
     },
+    debouncedFetchRows,
     strategyProcessor: {
       strategyName: DataSourceRowsUpdateStrategy.Default,
       group: 'dataSourceRowsUpdate',

package/esm/hooks/features/dataSource/utils.d.ts

@@ -1,4 +1,4 @@
-import { GridGetRowsParams, GridGetRowsResponse } from "../../../models/gridDataSource.js";
+import type { GridGetRowsParams, GridGetRowsResponse } from '../../../models/gridDataSource';
 export declare enum DataSourceRowsUpdateStrategy {
   Default = "set-new-rows",
   LazyLoading = "replace-row-range",

package/esm/hooks/features/editing/useGridCellEditing.d.ts

@@ -1,4 +1,4 @@
 import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommunity } from "../../../models/api/gridApiCommunity.js";
 import { DataGridProcessedProps } from "../../../models/props/DataGridProps.js";
-export declare const useGridCellEditing: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "editMode" | "processRowUpdate" | "onCellEditStart" | "onCellEditStop" | "cellModesModel" | "onCellModesModelChange" | "onProcessRowUpdateError" | "signature">) => void;
+export declare const useGridCellEditing: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "editMode" | "processRowUpdate" | "onCellEditStart" | "onCellEditStop" | "cellModesModel" | "onCellModesModelChange" | "onProcessRowUpdateError" | "signature" | "dataSource">) => void;

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

@@ -4,9 +4,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["id", "field"],
   _excluded2 = ["id", "field"];
 import * as React from 'react';
+import { warnOnce } from '@mui/x-internals/warning';
 import useEventCallback from '@mui/utils/useEventCallback';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
-import { warnOnce } from '@mui/x-internals/warning';
 import { useGridEvent, useGridEventPriority } from "../../utils/useGridEvent.js";
 import { GridEditModes, GridCellModes } from "../../../models/gridEditRowModel.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
@@ -317,6 +317,7 @@ export const useGridCellEditing = (apiRef, props) => {
       error,
       isProcessingProps
     } = editingState[id][field];
+    const row = apiRef.current.getRow(id);
     if (error || isProcessingProps) {
       // Attempt to change cell mode to "view" was not successful
       // Update previous mode to allow another attempt
@@ -328,7 +329,30 @@ export const useGridCellEditing = (apiRef, props) => {
       return;
     }
     const rowUpdate = apiRef.current.getRowWithUpdatedValuesFromCellEditing(id, field);
-    if (processRowUpdate) {
+    if (props.dataSource?.updateRow) {
+      if (row[field] === rowUpdate[field]) {
+        finishCellEditMode();
+        return;
+      }
+      const handleError = () => {
+        prevCellModesModel.current[id][field].mode = GridCellModes.Edit;
+        // Revert the mode in the cellModesModel prop back to "edit"
+        updateFieldInCellModesModel(id, field, {
+          mode: GridCellModes.Edit
+        });
+      };
+      const updateRowParams = {
+        rowId: id,
+        updatedRow: rowUpdate,
+        previousRow: row
+      };
+      try {
+        await apiRef.current.dataSource.editRow(updateRowParams);
+        finishCellEditMode();
+      } catch {
+        handleError();
+      }
+    } else if (processRowUpdate) {
       const handleError = errorThrown => {
         prevCellModesModel.current[id][field].mode = GridCellModes.Edit;
         // Revert the mode in the cellModesModel prop back to "edit"
@@ -342,7 +366,6 @@ export const useGridCellEditing = (apiRef, props) => {
         }
       };
       try {
-        const row = apiRef.current.getRow(id);
         Promise.resolve(processRowUpdate(rowUpdate, row, {
           rowId: id
         })).then(finalRowUpdate => {

package/esm/hooks/features/editing/useGridEditing.d.ts

@@ -3,4 +3,4 @@ import { GridPrivateApiCommunity } from "../../../models/api/gridApiCommunity.js
 import { DataGridProcessedProps } from "../../../models/props/DataGridProps.js";
 import { GridStateInitializer } from "../../utils/useGridInitializeState.js";
 export declare const editingStateInitializer: GridStateInitializer;
-export declare const useGridEditing: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "isCellEditable" | "editMode" | "processRowUpdate">) => void;
+export declare const useGridEditing: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "isCellEditable" | "editMode" | "processRowUpdate" | "dataSource" | "onDataSourceError">) => void;

package/esm/hooks/features/editing/useGridRowEditing.d.ts

@@ -1,4 +1,4 @@
 import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommunity } from "../../../models/api/gridApiCommunity.js";
 import { DataGridProcessedProps } from "../../../models/props/DataGridProps.js";
-export declare const useGridRowEditing: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "editMode" | "processRowUpdate" | "onRowEditStart" | "onRowEditStop" | "onProcessRowUpdateError" | "rowModesModel" | "onRowModesModelChange" | "signature">) => void;
+export declare const useGridRowEditing: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "editMode" | "processRowUpdate" | "onRowEditStart" | "onRowEditStop" | "onProcessRowUpdateError" | "rowModesModel" | "onRowModesModelChange" | "signature" | "dataSource">) => void;

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

@@ -7,6 +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 { isDeepEqual } from '@mui/x-internals/isDeepEqual';
 import { useGridEvent, useGridEventPriority } from "../../utils/useGridEvent.js";
 import { GridEditModes, GridRowModes } from "../../../models/gridEditRowModel.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
@@ -370,7 +371,7 @@ export const useGridRowEditing = (apiRef, props) => {
       mode: GridRowModes.View
     }, other));
   }, [throwIfNotInMode, updateRowInRowModesModel]);
-  const updateStateToStopRowEditMode = useEventCallback(params => {
+  const updateStateToStopRowEditMode = useEventCallback(async params => {
     const {
       id,
       ignoreModifications,
@@ -406,7 +407,30 @@ export const useGridRowEditing = (apiRef, props) => {
       return;
     }
     const rowUpdate = apiRef.current.getRowWithUpdatedValuesFromRowEditing(id);
-    if (processRowUpdate) {
+    if (props.dataSource?.updateRow) {
+      if (isDeepEqual(row, rowUpdate)) {
+        finishRowEditMode();
+        return;
+      }
+      const handleError = () => {
+        prevRowModesModel.current[id].mode = GridRowModes.Edit;
+        // Revert the mode in the rowModesModel prop back to "edit"
+        updateRowInRowModesModel(id, {
+          mode: GridRowModes.Edit
+        });
+      };
+      const updateRowParams = {
+        rowId: id,
+        updatedRow: rowUpdate,
+        previousRow: row
+      };
+      try {
+        await apiRef.current.dataSource.editRow(updateRowParams);
+        finishRowEditMode();
+      } catch {
+        handleError();
+      }
+    } else if (processRowUpdate) {
       const handleError = errorThrown => {
         // The row might have been deleted
         if (prevRowModesModel.current[id]) {

package/esm/hooks/features/keyboardNavigation/useGridKeyboardNavigation.d.ts

@@ -10,4 +10,4 @@ import { DataGridProcessedProps } from "../../../models/props/DataGridProps.js";
  * @requires useGridScroll (method) - can be after
  * @requires useGridColumnSpanning (method) - can be after
  */
-export declare const useGridKeyboardNavigation: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "pagination" | "paginationMode" | "getRowId" | "experimentalFeatures" | "signature" | "headerFilters" | "listView">) => void;
+export declare const useGridKeyboardNavigation: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "pagination" | "paginationMode" | "getRowId" | "signature" | "headerFilters" | "listView">) => void;

package/esm/hooks/features/overlays/useGridOverlays.d.ts

@@ -8,7 +8,7 @@ import type { GridOverlayType } from '../../../components/base/GridOverlays';
 export declare const useGridOverlays: () => {
   getOverlay: () => React.JSX.Element | null;
   overlaysProps: {
-    overlayType: GridOverlayType;
+    overlayType: NonNullable<GridOverlayType>;
     loadingOverlayVariant: GridLoadingOverlayVariant | null;
   };
 };

package/esm/hooks/features/overlays/useGridOverlays.js

@@ -8,6 +8,7 @@ import { gridRowCountSelector, gridRowsLoadingSelector } from "../rows/index.js"
 import { gridPinnedRowsCountSelector } from "../rows/gridRowsSelector.js";
 import { GridOverlayWrapper } from "../../../components/base/GridOverlays.js";
 import { gridVisibleColumnDefinitionsSelector } from "../columns/index.js";
+import { gridPivotActiveSelector } from "../pivoting/index.js";
 
 /**
  * Uses the grid state to determine which overlay to display.
@@ -23,16 +24,21 @@ export const useGridOverlays = () => {
   const visibleColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);
   const noRows = totalRowCount === 0 && pinnedRowsCount === 0;
   const loading = useGridSelector(apiRef, gridRowsLoadingSelector);
+  const pivotActive = useGridSelector(apiRef, gridPivotActiveSelector);
   const showNoRowsOverlay = !loading && noRows;
   const showNoResultsOverlay = !loading && totalRowCount > 0 && visibleRowCount === 0;
   const showNoColumnsOverlay = !loading && visibleColumns.length === 0;
+  const showEmptyPivotOverlay = showNoRowsOverlay && pivotActive;
   let overlayType = null;
   let loadingOverlayVariant = null;
+  if (showNoRowsOverlay) {
+    overlayType = 'noRowsOverlay';
+  }
   if (showNoColumnsOverlay) {
     overlayType = 'noColumnsOverlay';
   }
-  if (showNoRowsOverlay) {
-    overlayType = 'noRowsOverlay';
+  if (showEmptyPivotOverlay) {
+    overlayType = 'emptyPivotOverlay';
   }
   if (showNoResultsOverlay) {
     overlayType = 'noResultsOverlay';
@@ -42,7 +48,7 @@ export const useGridOverlays = () => {
     loadingOverlayVariant = rootProps.slotProps?.loadingOverlay?.[noRows ? 'noRowsVariant' : 'variant'] ?? (noRows ? 'skeleton' : 'linear-progress');
   }
   const overlaysProps = {
-    overlayType,
+    overlayType: overlayType,
     loadingOverlayVariant
   };
   const getOverlay = () => {

package/esm/hooks/features/pivoting/gridPivotingInterfaces.d.ts

@@ -0,0 +1,11 @@
+import type { GridRowModelUpdate } from '@mui/x-data-grid';
+import type { GridColDef } from '../../../models/colDef';
+export interface GridPivotingStatePartial {
+  active: boolean;
+  panelOpen: boolean;
+  initialColumns: Map<string, GridColDef> | undefined;
+}
+export interface GridPivotingPrivateApiCommunity {
+  updateNonPivotRows: (rows: readonly GridRowModelUpdate[], keepPreviousRows?: boolean) => void;
+  updateNonPivotColumns: (columns: readonly GridColDef[], keepPreviousColumns?: boolean) => void;
+}

package/esm/hooks/features/pivoting/gridPivotingSelectors.d.ts

@@ -0,0 +1,6 @@
+import type { GridColDef } from '../../../models/colDef';
+import type { GridStateCommunity } from '../../../models/gridStateCommunity';
+import type { GridPivotingStatePartial } from './gridPivotingInterfaces';
+export declare const gridPivotActiveSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, GridPivotingStatePartial, boolean>;
+export declare const gridPivotInitialColumnsSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, GridPivotingStatePartial, Map<string, GridColDef>>;
+export declare const gridPivotPanelOpenSelector: import("@mui/x-data-grid").OutputSelector<GridStateCommunity, GridPivotingStatePartial, boolean>;

package/esm/hooks/features/pivoting/gridPivotingSelectors.js

@@ -0,0 +1,8 @@
+import { createSelector, createRootSelector } from "../../../utils/createSelector.js";
+const gridPivotingStateSelector = createRootSelector(
+// @ts-ignore
+state => state.pivoting);
+export const gridPivotActiveSelector = createSelector(gridPivotingStateSelector, pivoting => pivoting?.active);
+const emptyColumns = new Map();
+export const gridPivotInitialColumnsSelector = createSelector(gridPivotingStateSelector, pivoting => pivoting?.initialColumns || emptyColumns);
+export const gridPivotPanelOpenSelector = createSelector(gridPivotingStateSelector, pivoting => pivoting?.panelOpen);

package/esm/hooks/features/pivoting/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./gridPivotingInterfaces.js";
+export * from "./gridPivotingSelectors.js";

package/esm/hooks/features/pivoting/index.js

@@ -0,0 +1,2 @@
+export * from "./gridPivotingInterfaces.js";
+export * from "./gridPivotingSelectors.js";

package/esm/hooks/features/preferencesPanel/gridPreferencePanelsValue.d.ts

@@ -1,5 +1,6 @@
 declare enum GridPreferencePanelsValue {
   filters = "filters",
   columns = "columns",
+  aiAssistant = "aiAssistant",
 }
 export { GridPreferencePanelsValue };

package/esm/hooks/features/preferencesPanel/gridPreferencePanelsValue.js

@@ -1,6 +1,7 @@
 var GridPreferencePanelsValue = /*#__PURE__*/function (GridPreferencePanelsValue) {
   GridPreferencePanelsValue["filters"] = "filters";
   GridPreferencePanelsValue["columns"] = "columns";
+  GridPreferencePanelsValue["aiAssistant"] = "aiAssistant";
   return GridPreferencePanelsValue;
 }(GridPreferencePanelsValue || {});
 export { GridPreferencePanelsValue };

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

@@ -15,6 +15,7 @@ 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
   };
 
   /**

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

@@ -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/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/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.3
+ * @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";