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

package/hooks/features/rowReorder/useGridRowReorder.js

@@ -141,10 +141,10 @@ const useGridRowReorder = (apiRef, props) => {
     }
     setDragRowId('');
   }, [apiRef, dragRowId, isRowReorderDisabled, logger, sortedRowIndexLookup]);
-  (0, _xDataGrid.useGridApiEventHandler)(apiRef, 'rowDragStart', handleDragStart);
-  (0, _xDataGrid.useGridApiEventHandler)(apiRef, 'rowDragOver', handleDragOver);
-  (0, _xDataGrid.useGridApiEventHandler)(apiRef, 'rowDragEnd', handleDragEnd);
-  (0, _xDataGrid.useGridApiEventHandler)(apiRef, 'cellDragOver', handleDragOver);
-  (0, _xDataGrid.useGridApiOptionHandler)(apiRef, 'rowOrderChange', props.onRowOrderChange);
+  (0, _xDataGrid.useGridEvent)(apiRef, 'rowDragStart', handleDragStart);
+  (0, _xDataGrid.useGridEvent)(apiRef, 'rowDragOver', handleDragOver);
+  (0, _xDataGrid.useGridEvent)(apiRef, 'rowDragEnd', handleDragEnd);
+  (0, _xDataGrid.useGridEvent)(apiRef, 'cellDragOver', handleDragOver);
+  (0, _xDataGrid.useGridEventPriority)(apiRef, 'rowOrderChange', props.onRowOrderChange);
 };
 exports.useGridRowReorder = useGridRowReorder;

package/hooks/features/serverSideLazyLoader/useGridDataSourceLazyLoader.js

@@ -95,6 +95,7 @@ const useGridDataSourceLazyLoader = (privateApiRef, props) => {
   }, [privateApiRef, resetGrid]);
   const addSkeletonRows = React.useCallback(() => {
     const tree = privateApiRef.current.state.rows.tree;
+    const dataRowIdToModelLookup = privateApiRef.current.state.rows.dataRowIdToModelLookup;
     const rootGroup = tree[_xDataGrid.GRID_ROOT_GROUP_ID];
     const rootGroupChildren = [...rootGroup.children];
     const pageRowCount = privateApiRef.current.state.pagination.rowCount;
@@ -102,18 +103,28 @@ const useGridDataSourceLazyLoader = (privateApiRef, props) => {
 
     /**
      * Do nothing if
-     * - rowCount is unknown
      * - children count is 0
-     * - children count is equal to rowCount
      */
-    if (pageRowCount === -1 || pageRowCount === undefined || rootChildrenCount === 0 || rootChildrenCount === pageRowCount) {
+    if (rootChildrenCount === 0) {
       return;
     }
-
-    // fill the grid with skeleton rows
-    for (let i = 0; i < pageRowCount - rootChildrenCount; i += 1) {
-      const skeletonId = getSkeletonRowId(i + rootChildrenCount); // to avoid duplicate keys on rebuild
-      rootGroupChildren.push(skeletonId);
+    const pageToSkip = adjustRowParams({
+      start: renderedRowsIntervalCache.current.firstRowToRender,
+      end: renderedRowsIntervalCache.current.lastRowToRender
+    });
+    let hasChanged = false;
+    const isInitialPage = renderedRowsIntervalCache.current.firstRowToRender === 0 && renderedRowsIntervalCache.current.lastRowToRender === 0;
+    for (let i = 0; i < rootChildrenCount; i += 1) {
+      if (isInitialPage) {
+        break;
+      }
+      // replace the rows not in the viewport with skeleton rows
+      if (pageToSkip.start <= i && i <= pageToSkip.end || tree[rootGroupChildren[i]]?.type === 'skeletonRow') {
+        continue;
+      }
+      const skeletonId = getSkeletonRowId(i); // to avoid duplicate keys on rebuild
+      const removedRow = rootGroupChildren[i];
+      rootGroupChildren[i] = skeletonId;
       const skeletonRowNode = {
         type: 'skeletonRow',
         id: skeletonId,
@@ -121,16 +132,40 @@ const useGridDataSourceLazyLoader = (privateApiRef, props) => {
         depth: 0
       };
       tree[skeletonId] = skeletonRowNode;
+      delete tree[removedRow];
+      delete dataRowIdToModelLookup[removedRow];
+      hasChanged = true;
+    }
+
+    // Should only happen with VIEWPORT loading trigger
+    if (loadingTrigger.current === LoadingTrigger.VIEWPORT) {
+      // fill the grid with skeleton rows
+      for (let i = 0; i < pageRowCount - rootChildrenCount; i += 1) {
+        const skeletonId = getSkeletonRowId(i + rootChildrenCount); // to avoid duplicate keys on rebuild
+        rootGroupChildren.push(skeletonId);
+        const skeletonRowNode = {
+          type: 'skeletonRow',
+          id: skeletonId,
+          parent: _xDataGrid.GRID_ROOT_GROUP_ID,
+          depth: 0
+        };
+        tree[skeletonId] = skeletonRowNode;
+        hasChanged = true;
+      }
+    }
+    if (!hasChanged) {
+      return;
     }
     tree[_xDataGrid.GRID_ROOT_GROUP_ID] = (0, _extends2.default)({}, rootGroup, {
       children: rootGroupChildren
     });
     privateApiRef.current.setState(state => (0, _extends2.default)({}, state, {
       rows: (0, _extends2.default)({}, state.rows, {
-        tree
+        tree,
+        dataRowIdToModelLookup
       })
     }), 'addSkeletonRows');
-  }, [privateApiRef]);
+  }, [privateApiRef, adjustRowParams]);
   const updateLoadingTrigger = React.useCallback(rowCount => {
     const newLoadingTrigger = rowCount === -1 ? LoadingTrigger.SCROLL_END : LoadingTrigger.VIEWPORT;
     if (loadingTrigger.current !== null) {
@@ -149,6 +184,8 @@ const useGridDataSourceLazyLoader = (privateApiRef, props) => {
       fetchParams
     } = params;
     const pageRowCount = privateApiRef.current.state.pagination.rowCount;
+    const tree = privateApiRef.current.state.rows.tree;
+    const dataRowIdToModelLookup = privateApiRef.current.state.rows.dataRowIdToModelLookup;
     if (response.rowCount !== undefined || pageRowCount === undefined) {
       privateApiRef.current.setRowCount(response.rowCount === undefined ? -1 : response.rowCount);
     }
@@ -161,8 +198,43 @@ const useGridDataSourceLazyLoader = (privateApiRef, props) => {
       // the rows can safely be replaced. skeleton rows will be added later
       privateApiRef.current.setRows(response.rows);
     } else {
+      const rootGroup = tree[_xDataGrid.GRID_ROOT_GROUP_ID];
+      const rootGroupChildren = [...rootGroup.children];
       const filteredSortedRowIds = (0, _xDataGrid.gridFilteredSortedRowIdsSelector)(privateApiRef);
       const startingIndex = typeof fetchParams.start === 'string' ? Math.max(filteredSortedRowIds.indexOf(fetchParams.start), 0) : fetchParams.start;
+
+      // Check for duplicate rows
+      let duplicateRowCount = 0;
+      response.rows.forEach(row => {
+        const rowId = (0, _xDataGrid.gridRowIdSelector)(privateApiRef, row);
+        if (tree[rowId] || dataRowIdToModelLookup[rowId]) {
+          const index = rootGroupChildren.indexOf(rowId);
+          if (index !== -1) {
+            const skeletonId = getSkeletonRowId(index);
+            rootGroupChildren[index] = skeletonId;
+            tree[skeletonId] = {
+              type: 'skeletonRow',
+              id: skeletonId,
+              parent: _xDataGrid.GRID_ROOT_GROUP_ID,
+              depth: 0
+            };
+          }
+          delete tree[rowId];
+          delete dataRowIdToModelLookup[rowId];
+          duplicateRowCount += 1;
+        }
+      });
+      if (duplicateRowCount > 0) {
+        tree[_xDataGrid.GRID_ROOT_GROUP_ID] = (0, _extends2.default)({}, rootGroup, {
+          children: rootGroupChildren
+        });
+        privateApiRef.current.setState(state => (0, _extends2.default)({}, state, {
+          rows: (0, _extends2.default)({}, state.rows, {
+            tree,
+            dataRowIdToModelLookup
+          })
+        }));
+      }
       privateApiRef.current.unstable_replaceRows(startingIndex, response.rows);
     }
     rowsStale.current = false;
@@ -212,7 +284,7 @@ const useGridDataSourceLazyLoader = (privateApiRef, props) => {
     }
   }, [privateApiRef, props.scrollEndThreshold, adjustRowParams, fetchRows]);
   const handleRenderedRowsIntervalChange = React.useCallback(params => {
-    if (rowsStale.current || loadingTrigger.current !== LoadingTrigger.VIEWPORT) {
+    if (rowsStale.current) {
       return;
     }
     const sortModel = (0, _xDataGrid.gridSortModelSelector)(privateApiRef);
@@ -286,12 +358,12 @@ const useGridDataSourceLazyLoader = (privateApiRef, props) => {
     setLazyLoadingRowsUpdateStrategyActive(privateApiRef.current.getActiveStrategy(_internals.GridStrategyGroup.DataSource) === _internals.DataSourceRowsUpdateStrategy.LazyLoading);
   }, [privateApiRef]);
   (0, _internals.useGridRegisterStrategyProcessor)(privateApiRef, _internals.DataSourceRowsUpdateStrategy.LazyLoading, 'dataSourceRowsUpdate', handleDataUpdate);
-  (0, _xDataGrid.useGridApiEventHandler)(privateApiRef, 'strategyAvailabilityChange', handleStrategyActivityChange);
-  (0, _xDataGrid.useGridApiEventHandler)(privateApiRef, 'rowCountChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleRowCountChange));
-  (0, _xDataGrid.useGridApiEventHandler)(privateApiRef, 'scrollPositionChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleScrolling));
-  (0, _xDataGrid.useGridApiEventHandler)(privateApiRef, 'renderedRowsIntervalChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, throttledHandleRenderedRowsIntervalChange));
-  (0, _xDataGrid.useGridApiEventHandler)(privateApiRef, 'sortModelChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleGridSortModelChange));
-  (0, _xDataGrid.useGridApiEventHandler)(privateApiRef, 'filterModelChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleGridFilterModelChange));
+  (0, _xDataGrid.useGridEvent)(privateApiRef, 'strategyAvailabilityChange', handleStrategyActivityChange);
+  (0, _xDataGrid.useGridEvent)(privateApiRef, 'rowCountChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleRowCountChange));
+  (0, _xDataGrid.useGridEvent)(privateApiRef, 'scrollPositionChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleScrolling));
+  (0, _xDataGrid.useGridEvent)(privateApiRef, 'renderedRowsIntervalChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, throttledHandleRenderedRowsIntervalChange));
+  (0, _xDataGrid.useGridEvent)(privateApiRef, 'sortModelChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleGridSortModelChange));
+  (0, _xDataGrid.useGridEvent)(privateApiRef, 'filterModelChange', (0, _internals.runIf)(lazyLoadingRowsUpdateStrategyActive, handleGridFilterModelChange));
   React.useEffect(() => {
     setStrategyAvailability();
   }, [setStrategyAvailability]);

package/hooks/features/treeData/useGridTreeData.js

@@ -25,6 +25,6 @@ const useGridTreeData = (apiRef, props) => {
       apiRef.current.setRowChildrenExpansion(params.id, !params.rowNode.childrenExpanded);
     }
   }, [apiRef, props.dataSource]);
-  (0, _xDataGrid.useGridApiEventHandler)(apiRef, 'cellKeyDown', handleCellKeyDown);
+  (0, _xDataGrid.useGridEvent)(apiRef, 'cellKeyDown', handleCellKeyDown);
 };
 exports.useGridTreeData = useGridTreeData;

package/index.js

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

package/internals/index.d.ts

@@ -23,6 +23,7 @@ export { useGridDataSourceLazyLoader } from "../hooks/features/serverSideLazyLoa
 export { dataSourceStateInitializer } from "../hooks/features/dataSource/useGridDataSourcePro.js";
 export { useGridDataSourceBasePro } from "../hooks/features/dataSource/useGridDataSourceBasePro.js";
 export { gridDataSourceErrorSelector, gridDataSourceLoadingIdSelector } from "../hooks/features/dataSource/gridDataSourceSelector.js";
+export { getGroupKeys } from "../hooks/features/dataSource/utils.js";
 export type { GridExperimentalProFeatures, DataGridProPropsWithoutDefaultValue, DataGridProPropsWithDefaultValue } from '../models/dataGridProProps';
 export { createRowTree } from "../utils/tree/createRowTree.js";
 export { updateRowTree } from "../utils/tree/updateRowTree.js";

package/internals/index.js

@@ -34,6 +34,7 @@ var _exportNames = {
   useGridDataSourceBasePro: true,
   gridDataSourceErrorSelector: true,
   gridDataSourceLoadingIdSelector: true,
+  getGroupKeys: true,
   createRowTree: true,
   updateRowTree: true,
   sortRowTree: true,
@@ -91,10 +92,16 @@ Object.defineProperty(exports, "detailPanelStateInitializer", {
     return _useGridDetailPanel.detailPanelStateInitializer;
   }
 });
+Object.defineProperty(exports, "getGroupKeys", {
+  enumerable: true,
+  get: function () {
+    return _utils.getGroupKeys;
+  }
+});
 Object.defineProperty(exports, "getVisibleRowsLookup", {
   enumerable: true,
   get: function () {
-    return _utils.getVisibleRowsLookup;
+    return _utils2.getVisibleRowsLookup;
   }
 });
 Object.defineProperty(exports, "gridDataSourceErrorSelector", {
@@ -112,13 +119,13 @@ Object.defineProperty(exports, "gridDataSourceLoadingIdSelector", {
 Object.defineProperty(exports, "insertNodeInTree", {
   enumerable: true,
   get: function () {
-    return _utils.insertNodeInTree;
+    return _utils2.insertNodeInTree;
   }
 });
 Object.defineProperty(exports, "removeNodeFromTree", {
   enumerable: true,
   get: function () {
-    return _utils.removeNodeFromTree;
+    return _utils2.removeNodeFromTree;
   }
 });
 Object.defineProperty(exports, "rowPinningStateInitializer", {
@@ -130,13 +137,13 @@ Object.defineProperty(exports, "rowPinningStateInitializer", {
 Object.defineProperty(exports, "skipFiltering", {
   enumerable: true,
   get: function () {
-    return _utils2.skipFiltering;
+    return _utils3.skipFiltering;
   }
 });
 Object.defineProperty(exports, "skipSorting", {
   enumerable: true,
   get: function () {
-    return _utils2.skipSorting;
+    return _utils3.skipSorting;
   }
 });
 Object.defineProperty(exports, "sortRowTree", {
@@ -307,11 +314,12 @@ var _useGridDataSourceLazyLoader = require("../hooks/features/serverSideLazyLoad
 var _useGridDataSourcePro = require("../hooks/features/dataSource/useGridDataSourcePro");
 var _useGridDataSourceBasePro = require("../hooks/features/dataSource/useGridDataSourceBasePro");
 var _gridDataSourceSelector = require("../hooks/features/dataSource/gridDataSourceSelector");
+var _utils = require("../hooks/features/dataSource/utils");
 var _createRowTree = require("../utils/tree/createRowTree");
 var _updateRowTree = require("../utils/tree/updateRowTree");
 var _sortRowTree = require("../utils/tree/sortRowTree");
-var _utils = require("../utils/tree/utils");
-var _utils2 = require("../hooks/features/serverSideTreeData/utils");
+var _utils2 = require("../utils/tree/utils");
+var _utils3 = require("../hooks/features/serverSideTreeData/utils");
 var _propValidation = require("./propValidation");
 Object.keys(_propValidation).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/material/icons.d.ts

@@ -1,6 +1,3 @@
-export declare const GridPushPinRightIcon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
-  muiName: string;
-};
-export declare const GridPushPinLeftIcon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
-  muiName: string;
-};
+import * as React from 'react';
+export declare const GridPushPinRightIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
+export declare const GridPushPinLeftIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;

package/material/icons.js

@@ -6,16 +6,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.GridPushPinRightIcon = exports.GridPushPinLeftIcon = void 0;
 var React = _interopRequireWildcard(require("react"));
-var _utils = require("@mui/material/utils");
+var _internals = require("@mui/x-data-grid/internals");
 var _jsxRuntime = require("react/jsx-runtime");
-const GridPushPinRightIcon = exports.GridPushPinRightIcon = (0, _utils.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+const GridPushPinRightIcon = exports.GridPushPinRightIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
   transform: "rotate(-30 15 10)",
   children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
     d: "M16,9V4l1,0c0.55,0,1-0.45,1-1v0c0-0.55-0.45-1-1-1H7C6.45,2,6,2.45,6,3v0 c0,0.55,0.45,1,1,1l1,0v5c0,1.66-1.34,3-3,3h0v2h5.97v7l1,1l1-1v-7H19v-2h0C17.34,12,16,10.66,16,9z",
     fillRule: "evenodd"
   })
 }), 'PushPinRight');
-const GridPushPinLeftIcon = exports.GridPushPinLeftIcon = (0, _utils.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+const GridPushPinLeftIcon = exports.GridPushPinLeftIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
   transform: "rotate(30 8 12)",
   children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
     d: "M16,9V4l1,0c0.55,0,1-0.45,1-1v0c0-0.55-0.45-1-1-1H7C6.45,2,6,2.45,6,3v0 c0,0.55,0.45,1,1,1l1,0v5c0,1.66-1.34,3-3,3h0v2h5.97v7l1,1l1-1v-7H19v-2h0C17.34,12,16,10.66,16,9z",

package/material/index.d.ts

@@ -1,5 +1,5 @@
 declare const materialSlots: {
-  columnMenuPinLeftIcon: React.JSXElementConstructor<any>;
-  columnMenuPinRightIcon: React.JSXElementConstructor<any>;
+  columnMenuPinLeftIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  columnMenuPinRightIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
 };
 export default materialSlots;

package/models/dataGridProProps.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { RefObject } from '@mui/x-internals/types';
-import { GridEventListener, GridCallbackDetails, GridRowParams, GridRowId, GridValidRowModel, GridGroupNode, GridFeatureMode, GridListColDef, GridGetRowsError, GridUpdateRowError } from '@mui/x-data-grid';
+import { GridEventListener, GridCallbackDetails, GridRowParams, GridRowId, GridValidRowModel, GridGroupNode, GridFeatureMode, GridListViewColDef, GridGetRowsError, GridUpdateRowError } from '@mui/x-data-grid';
 import type { GridExperimentalFeatures, DataGridPropsWithoutDefaultValue, DataGridPropsWithDefaultValues, DataGridPropsWithComplexDefaultValueAfterProcessing, DataGridPropsWithComplexDefaultValueBeforeProcessing, GridPinnedColumnFields, DataGridProSharedPropsWithDefaultValue, DataGridProSharedPropsWithoutDefaultValue } from '@mui/x-data-grid/internals';
 import type { GridPinnedRowsProp } from '../hooks/features/rowPinning';
 import { GridApiPro } from "./gridApiPro.js";
@@ -90,7 +90,7 @@ export interface DataGridProPropsWithDefaultValue<R extends GridValidRowModel =
    * Set it to 'client' if you would like enable infnite loading.
    * Set it to 'server' if you would like to enable lazy loading.
    * @default "client"
-   * @deprecated Use the {@link https://next.mui.com/x/react-data-grid/server-side-data/lazy-loading/#viewport-loading Server-side data-Viewport loading} instead.
+   * @deprecated Use the {@link https://mui.com/x/react-data-grid/server-side-data/lazy-loading/#viewport-loading Server-side data-Viewport loading} instead.
    */
   rowsLoadingMode: GridFeatureMode;
   /**
@@ -113,9 +113,9 @@ export interface DataGridProPropsWithDefaultValue<R extends GridValidRowModel =
   lazyLoadingRequestThrottleMs: number;
   /**
    * If `true`, displays the data in a list view.
-   * Use in combination with `unstable_listColumn`.
+   * Use in combination with `listViewColumn`.
    */
-  unstable_listView: boolean;
+  listView: boolean;
 }
 interface DataGridProRegularProps<R extends GridValidRowModel> {
   /**
@@ -149,7 +149,7 @@ export interface DataGridProPropsWithoutDefaultValue<R extends GridValidRowModel
    * @param {GridRowScrollEndParams} params With all properties from [[GridRowScrollEndParams]].
    * @param {MuiEvent<{}>} event The event object.
    * @param {GridCallbackDetails} details Additional details for this callback.
-   * @deprecated Use the {@link https://next.mui.com/x/react-data-grid/server-side-data/lazy-loading/#infinite-loading Server-side data-Infinite loading} instead.
+   * @deprecated Use the {@link https://mui.com/x/react-data-grid/server-side-data/lazy-loading/#infinite-loading Server-side data-Infinite loading} instead.
    */
   onRowsScrollEnd?: GridEventListener<'rowsScrollEnd'>;
   /**
@@ -194,7 +194,7 @@ export interface DataGridProPropsWithoutDefaultValue<R extends GridValidRowModel
    * @param {GridFetchRowsParams} params With all properties from [[GridFetchRowsParams]].
    * @param {MuiEvent<{}>} event The event object.
    * @param {GridCallbackDetails} details Additional details for this callback.
-   * @deprecated Use the {@link https://next.mui.com/x/react-data-grid/server-side-data/lazy-loading/#viewport-loading Server-side data-Viewport loading} instead.
+   * @deprecated Use the {@link https://mui.com/x/react-data-grid/server-side-data/lazy-loading/#viewport-loading Server-side data-Viewport loading} instead.
    */
   onFetchRows?: GridEventListener<'fetchRows'>;
   /**
@@ -206,9 +206,9 @@ export interface DataGridProPropsWithoutDefaultValue<R extends GridValidRowModel
    */
   slotProps?: GridProSlotProps;
   /**
-   * Definition of the column rendered when the `unstable_listView` prop is enabled.
+   * Definition of the column rendered when the `listView` prop is enabled.
    */
-  unstable_listColumn?: GridListColDef<R>;
+  listViewColumn?: GridListViewColDef<R>;
   /**
    * The data source of the Data Grid Pro.
    */

package/models/gridProIconSlotsComponent.d.ts

@@ -1,13 +1,16 @@
 import * as React from 'react';
+import { BaseSlots } from '@mui/x-data-grid/internals';
+type IconProps = BaseSlots.IconProps;
 export interface GridProIconSlotsComponent {
   /**
    * Icon displayed in column menu for left pinning
    * @default GridPushPinLeftIcon
    */
-  columnMenuPinLeftIcon: React.JSXElementConstructor<any>;
+  columnMenuPinLeftIcon: React.JSXElementConstructor<IconProps>;
   /**
    * Icon displayed in column menu for right pinning
    * @default GridPushPinRightIcon
    */
-  columnMenuPinRightIcon: React.JSXElementConstructor<any>;
-}
+  columnMenuPinRightIcon: React.JSXElementConstructor<IconProps>;
+}
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-pro",
-  "version": "8.0.0-beta.2",
+  "version": "8.0.0",
   "description": "The Pro plan edition of the Data Grid components (MUI X).",
   "author": "MUI Team",
   "main": "./index.js",
@@ -9,7 +9,9 @@
     "url": "https://github.com/mui/mui-x/issues"
   },
   "homepage": "https://mui.com/x/react-data-grid/",
-  "sideEffects": false,
+  "sideEffects": [
+    "**/*.css"
+  ],
   "publishConfig": {
     "access": "public",
     "directory": "build"
@@ -33,21 +35,21 @@
     "directory": "packages/x-data-grid-pro"
   },
   "dependencies": {
-    "@babel/runtime": "^7.26.10",
-    "@mui/utils": "^7.0.0 || ^7.0.0-beta",
+    "@babel/runtime": "^7.27.0",
+    "@mui/utils": "^7.0.2",
     "@types/format-util": "^1.0.4",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "reselect": "^5.1.1",
-    "@mui/x-license": "8.0.0-beta.2",
-    "@mui/x-internals": "8.0.0-beta.2",
-    "@mui/x-data-grid": "8.0.0-beta.2"
+    "@mui/x-internals": "8.0.0",
+    "@mui/x-license": "8.0.0",
+    "@mui/x-data-grid": "8.0.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",
     "@emotion/styled": "^11.8.1",
-    "@mui/material": "^5.15.14 || ^6.0.0 || ^7.0.0 || ^7.0.0-beta",
-    "@mui/system": "^5.15.14 || ^6.0.0 || ^7.0.0 || ^7.0.0-beta",
+    "@mui/material": "^5.15.14 || ^6.0.0 || ^7.0.0",
+    "@mui/system": "^5.15.14 || ^6.0.0 || ^7.0.0",
     "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
   },
@@ -74,10 +76,6 @@
       "import": {
         "types": "./esm/index.d.ts",
         "default": "./esm/index.js"
-      },
-      "mui-modern": {
-        "types": "./modern/index.d.ts",
-        "default": "./modern/index.js"
       }
     },
     "./*": {
@@ -88,10 +86,6 @@
       "import": {
         "types": "./esm/*/index.d.ts",
         "default": "./esm/*/index.js"
-      },
-      "mui-modern": {
-        "types": "./modern/*/index.d.ts",
-        "default": "./modern/*/index.js"
       }
     },
     "./esm": null,

package/esm/utils/releaseInfo.d.ts

@@ -1 +0,0 @@
-export declare const getReleaseInfo: () => any;

package/esm/utils/releaseInfo.js

@@ -1,13 +0,0 @@
-import { ponyfillGlobal } from '@mui/utils';
-export const getReleaseInfo = () => {
-  const releaseInfo = "MTc0MzExMjgwMDAwMA==";
-  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
-    if (releaseInfo === '__RELEASE' + '_INFO__') {
-      // eslint-disable-next-line no-underscore-dangle
-      return ponyfillGlobal.__MUI_RELEASE_INFO__;
-    }
-  }
-  return releaseInfo;
-};

package/modern/DataGridPro/DataGrid.d.ts

@@ -1,8 +0,0 @@
-/**
- * @deprecated Import DataGridPro instead.
- */
-export declare function DataGrid(): null;
-/**
- * @deprecated Import DataGridPro instead.
- */
-export declare function DataGridPremium(): null;

package/modern/DataGridPro/DataGrid.js

@@ -1,19 +0,0 @@
-/**
- * @deprecated Import DataGridPro instead.
- */
-export function DataGrid() {
-  if (process.env.NODE_ENV === 'production') {
-    return null;
-  }
-  throw new Error(["You try to import Data Grid from @mui/x-data-grid-pro but this module isn't exported from this npm package.", '', "Instead, you can do `import { DataGridPro } from '@mui/x-data-grid-pro'`.", ''].join('\n'));
-}
-
-/**
- * @deprecated Import DataGridPro instead.
- */
-export function DataGridPremium() {
-  if (process.env.NODE_ENV === 'production') {
-    return null;
-  }
-  throw new Error(["You try to import Data Grid Premium from @mui/x-data-grid-pro but this module isn't exported from this npm package.", '', 'Instead, if you have a Premium plan license or want to try Premium, you can do this:', `import { DataGridPremium } from '@mui/x-data-grid-premium'`, '', "Otherwise, you can stay on the Pro plan: `import { DataGridPro } from '@mui/x-data-grid-pro'`.", ''].join('\n'));
-}

package/modern/DataGridPro/DataGridPro.d.ts

@@ -1,16 +0,0 @@
-import * as React from 'react';
-import { GridValidRowModel } from '@mui/x-data-grid';
-import { DataGridProProps } from "../models/dataGridProProps.js";
-export type { GridProSlotsComponent as GridSlots } from '../models';
-interface DataGridProComponent {
-  <R extends GridValidRowModel = any>(props: DataGridProProps<R> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
-  propTypes?: any;
-}
-/**
- * Features:
- * - [DataGridPro](https://mui.com/x/react-data-grid/features/)
- *
- * API:
- * - [DataGridPro API](https://mui.com/x/api/data-grid/data-grid-pro/)
- */
-export declare const DataGridPro: DataGridProComponent;