@mui/x-data-grid-pro 7.7.1 → 7.9.0

package/hooks/features/dataSource/utils.js

@@ -0,0 +1,95 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.runIfServerMode = exports.RequestStatus = exports.NestedDataManager = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+const MAX_CONCURRENT_REQUESTS = Infinity;
+const runIfServerMode = (modeProp, fn) => () => {
+  if (modeProp === 'server') {
+    fn();
+  }
+};
+exports.runIfServerMode = runIfServerMode;
+let RequestStatus = exports.RequestStatus = /*#__PURE__*/function (RequestStatus) {
+  RequestStatus[RequestStatus["QUEUED"] = 0] = "QUEUED";
+  RequestStatus[RequestStatus["PENDING"] = 1] = "PENDING";
+  RequestStatus[RequestStatus["SETTLED"] = 2] = "SETTLED";
+  RequestStatus[RequestStatus["UNKNOWN"] = 3] = "UNKNOWN";
+  return RequestStatus;
+}({});
+/**
+ * Fetches row children from the server with option to limit the number of concurrent requests
+ * Determines the status of a request based on the enum `RequestStatus`
+ * Uses `GridRowId` to uniquely identify a request
+ */
+class NestedDataManager {
+  constructor(privateApiRef, maxConcurrentRequests = MAX_CONCURRENT_REQUESTS) {
+    this.pendingRequests = new Set();
+    this.queuedRequests = new Set();
+    this.settledRequests = new Set();
+    this.api = void 0;
+    this.maxConcurrentRequests = void 0;
+    this.processQueue = async () => {
+      if (this.queuedRequests.size === 0 || this.pendingRequests.size >= this.maxConcurrentRequests) {
+        return;
+      }
+      const loopLength = Math.min(this.maxConcurrentRequests - this.pendingRequests.size, this.queuedRequests.size);
+      if (loopLength === 0) {
+        return;
+      }
+      const fetchQueue = Array.from(this.queuedRequests);
+      for (let i = 0; i < loopLength; i += 1) {
+        const id = fetchQueue[i];
+        this.queuedRequests.delete(id);
+        this.pendingRequests.add(id);
+        this.api.fetchRowChildren(id);
+      }
+    };
+    this.queue = async ids => {
+      const loadingIds = {};
+      ids.forEach(id => {
+        this.queuedRequests.add(id);
+        loadingIds[id] = true;
+      });
+      this.api.setState(state => (0, _extends2.default)({}, state, {
+        dataSource: (0, _extends2.default)({}, state.dataSource, {
+          loading: (0, _extends2.default)({}, state.dataSource.loading, loadingIds)
+        })
+      }));
+      this.processQueue();
+    };
+    this.setRequestSettled = id => {
+      this.pendingRequests.delete(id);
+      this.settledRequests.add(id);
+      this.processQueue();
+    };
+    this.clear = () => {
+      this.queuedRequests.clear();
+      Array.from(this.pendingRequests).forEach(id => this.clearPendingRequest(id));
+    };
+    this.clearPendingRequest = id => {
+      this.api.unstable_dataSource.setChildrenLoading(id, false);
+      this.pendingRequests.delete(id);
+      this.processQueue();
+    };
+    this.getRequestStatus = id => {
+      if (this.pendingRequests.has(id)) {
+        return RequestStatus.PENDING;
+      }
+      if (this.queuedRequests.has(id)) {
+        return RequestStatus.QUEUED;
+      }
+      if (this.settledRequests.has(id)) {
+        return RequestStatus.SETTLED;
+      }
+      return RequestStatus.UNKNOWN;
+    };
+    this.getActiveRequestsCount = () => this.pendingRequests.size + this.queuedRequests.size;
+    this.api = privateApiRef.current;
+    this.maxConcurrentRequests = maxConcurrentRequests;
+  }
+}
+exports.NestedDataManager = NestedDataManager;

package/hooks/features/detailPanel/gridDetailPanelSelector.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { GridRowId } from '@mui/x-data-grid';
 import { GridStatePro } from '../../../models/gridStatePro';
 export declare const gridDetailPanelExpandedRowIdsSelector: (state: GridStatePro) => GridRowId[];

package/hooks/features/detailPanel/useGridDetailPanel.d.ts

@@ -3,4 +3,4 @@ import { GridStateInitializer } from '@mui/x-data-grid/internals';
 import { GridPrivateApiPro } from '../../../models/gridApiPro';
 import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
 export declare const detailPanelStateInitializer: GridStateInitializer<Pick<DataGridProProcessedProps, 'initialState' | 'detailPanelExpandedRowIds'>>;
-export declare const useGridDetailPanel: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, 'getDetailPanelContent' | 'getDetailPanelHeight' | 'detailPanelExpandedRowIds' | 'onDetailPanelExpandedRowIdsChange'>) => void;
+export declare const useGridDetailPanel: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "getDetailPanelContent" | "getDetailPanelHeight" | "detailPanelExpandedRowIds" | "onDetailPanelExpandedRowIdsChange">) => void;

package/hooks/features/index.d.ts

@@ -4,3 +4,5 @@ export * from './rowReorder';
 export * from './treeData';
 export * from './detailPanel';
 export * from './rowPinning';
+export * from './dataSource/interfaces';
+export * from './dataSource/cache';

package/hooks/features/index.js

@@ -68,4 +68,26 @@ Object.keys(_rowPinning).forEach(function (key) {
       return _rowPinning[key];
     }
   });
+});
+var _interfaces = require("./dataSource/interfaces");
+Object.keys(_interfaces).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _interfaces[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _interfaces[key];
+    }
+  });
+});
+var _cache = require("./dataSource/cache");
+Object.keys(_cache).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _cache[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _cache[key];
+    }
+  });
 });

package/hooks/features/infiniteLoader/useGridInfiniteLoader.d.ts

@@ -6,4 +6,4 @@ import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
  * @requires useGridDimensions (method) - can be after
  * @requires useGridScroll (method
  */
-export declare const useGridInfiniteLoader: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, 'onRowsScrollEnd' | 'pagination' | 'paginationMode' | 'rowsLoadingMode' | 'scrollEndThreshold'>) => void;
+export declare const useGridInfiniteLoader: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "onRowsScrollEnd" | "pagination" | "paginationMode" | "rowsLoadingMode" | "scrollEndThreshold">) => void;

package/hooks/features/lazyLoader/useGridLazyLoader.d.ts

@@ -7,4 +7,4 @@ import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
  * @requires useGridDimensions (method) - can be after
  * @requires useGridScroll (method
  */
-export declare const useGridLazyLoader: (privateApiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, 'onFetchRows' | 'rowsLoadingMode' | 'pagination' | 'paginationMode' | 'experimentalFeatures'>) => void;
+export declare const useGridLazyLoader: (privateApiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "onFetchRows" | "rowsLoadingMode" | "pagination" | "paginationMode" | "experimentalFeatures">) => void;

package/hooks/features/lazyLoader/useGridLazyLoaderPreProcessors.d.ts

@@ -2,4 +2,4 @@ import * as React from 'react';
 import { GridPrivateApiPro } from '../../../models/gridApiPro';
 import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
 export declare const GRID_SKELETON_ROW_ROOT_ID = "auto-generated-skeleton-row-root";
-export declare const useGridLazyLoaderPreProcessors: (privateApiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, 'rowCount' | 'rowsLoadingMode' | 'experimentalFeatures'>) => void;
+export declare const useGridLazyLoaderPreProcessors: (privateApiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "rowCount" | "rowsLoadingMode" | "experimentalFeatures">) => void;

package/hooks/features/rowPinning/useGridRowPinning.d.ts

@@ -3,4 +3,4 @@ import { GridStateInitializer } from '@mui/x-data-grid/internals';
 import { GridPrivateApiPro } from '../../../models/gridApiPro';
 import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
 export declare const rowPinningStateInitializer: GridStateInitializer<Pick<DataGridProProcessedProps, 'pinnedRows' | 'getRowId' | 'experimentalFeatures'>>;
-export declare const useGridRowPinning: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, 'pinnedRows' | 'getRowId'>) => void;
+export declare const useGridRowPinning: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "pinnedRows" | "getRowId">) => void;

package/hooks/features/rowPinning/useGridRowPinningPreProcessors.d.ts

@@ -27,8 +27,8 @@ export declare function addPinnedRow({ groupingParams, rowModel, rowId, position
     };
     dataRowIds: GridRowId[];
     additionalRowGroups?: {
-        pinnedRows?: import("@mui/x-data-grid/internals").GridPinnedRowsState | undefined;
-    } | undefined;
+        pinnedRows?: import("@mui/x-data-grid/internals").GridPinnedRowsState;
+    };
 };
 export declare const useGridRowPinningPreProcessors: (apiRef: React.MutableRefObject<GridPrivateApiPro>) => void;
 export {};

package/hooks/features/rowReorder/useGridRowReorder.d.ts

@@ -5,4 +5,4 @@ import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
  * Only available in DataGridPro
  * @requires useGridRows (method)
  */
-export declare const useGridRowReorder: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, 'rowReordering' | 'onRowOrderChange' | 'classes'>) => void;
+export declare const useGridRowReorder: (apiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "rowReordering" | "onRowOrderChange" | "classes">) => void;

package/hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
+import { GridPrivateApiPro } from '../../../models/gridApiPro';
+export declare const useGridDataSourceTreeDataPreProcessors: (privateApiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "treeData" | "groupingColDef" | "disableChildrenSorting" | "disableChildrenFiltering" | "defaultGroupingExpansionDepth" | "isGroupExpandedByDefault" | "unstable_dataSource">) => void;

package/hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors.js

@@ -0,0 +1,158 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridDataSourceTreeDataPreProcessors = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _xDataGrid = require("@mui/x-data-grid");
+var _internals = require("@mui/x-data-grid/internals");
+var _gridTreeDataGroupColDef = require("../treeData/gridTreeDataGroupColDef");
+var _utils = require("./utils");
+var _GridDataSourceTreeDataGroupingCell = require("../../../components/GridDataSourceTreeDataGroupingCell");
+var _createRowTree = require("../../../utils/tree/createRowTree");
+var _updateRowTree = require("../../../utils/tree/updateRowTree");
+var _utils2 = require("../../../utils/tree/utils");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["hideDescendantCount"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const DATA_SOURCE_TREE_DATA_STRATEGY = 'dataSourceTreeData';
+const useGridDataSourceTreeDataPreProcessors = (privateApiRef, props) => {
+  const setStrategyAvailability = React.useCallback(() => {
+    privateApiRef.current.setStrategyAvailability('rowTree', DATA_SOURCE_TREE_DATA_STRATEGY, props.treeData && props.unstable_dataSource ? () => true : () => false);
+  }, [privateApiRef, props.treeData, props.unstable_dataSource]);
+  const getGroupingColDef = React.useCallback(() => {
+    const groupingColDefProp = props.groupingColDef;
+    let colDefOverride;
+    if (typeof groupingColDefProp === 'function') {
+      const params = {
+        groupingName: DATA_SOURCE_TREE_DATA_STRATEGY,
+        fields: []
+      };
+      colDefOverride = groupingColDefProp(params);
+    } else {
+      colDefOverride = groupingColDefProp;
+    }
+    const _ref = colDefOverride ?? {},
+      {
+        hideDescendantCount
+      } = _ref,
+      colDefOverrideProperties = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+    const commonProperties = (0, _extends2.default)({}, _gridTreeDataGroupColDef.GRID_TREE_DATA_GROUPING_COL_DEF, {
+      renderCell: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridDataSourceTreeDataGroupingCell.GridDataSourceTreeDataGroupingCell, (0, _extends2.default)({}, params, {
+        hideDescendantCount: hideDescendantCount
+      })),
+      headerName: privateApiRef.current.getLocaleText('treeDataGroupingHeaderName')
+    });
+    return (0, _extends2.default)({}, commonProperties, colDefOverrideProperties, _gridTreeDataGroupColDef.GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES);
+  }, [privateApiRef, props.groupingColDef]);
+  const updateGroupingColumn = React.useCallback(columnsState => {
+    if (!props.unstable_dataSource) {
+      return columnsState;
+    }
+    const groupingColDefField = _gridTreeDataGroupColDef.GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES.field;
+    const shouldHaveGroupingColumn = props.treeData;
+    const prevGroupingColumn = columnsState.lookup[groupingColDefField];
+    if (shouldHaveGroupingColumn) {
+      const newGroupingColumn = getGroupingColDef();
+      if (prevGroupingColumn) {
+        newGroupingColumn.width = prevGroupingColumn.width;
+        newGroupingColumn.flex = prevGroupingColumn.flex;
+      }
+      columnsState.lookup[groupingColDefField] = newGroupingColumn;
+      if (prevGroupingColumn == null) {
+        const index = columnsState.orderedFields[0] === _xDataGrid.GRID_CHECKBOX_SELECTION_FIELD ? 1 : 0;
+        columnsState.orderedFields = [...columnsState.orderedFields.slice(0, index), groupingColDefField, ...columnsState.orderedFields.slice(index)];
+      }
+    } else if (!shouldHaveGroupingColumn && prevGroupingColumn) {
+      delete columnsState.lookup[groupingColDefField];
+      columnsState.orderedFields = columnsState.orderedFields.filter(field => field !== groupingColDefField);
+    }
+    return columnsState;
+  }, [props.treeData, props.unstable_dataSource, getGroupingColDef]);
+  const createRowTreeForTreeData = React.useCallback(params => {
+    const getGroupKey = props.unstable_dataSource?.getGroupKey;
+    if (!getGroupKey) {
+      throw new Error('MUI X: No `getGroupKey` method provided with the dataSource.');
+    }
+    const getChildrenCount = props.unstable_dataSource?.getChildrenCount;
+    if (!getChildrenCount) {
+      throw new Error('MUI X: No `getChildrenCount` method provided with the dataSource.');
+    }
+    const parentPath = params.updates.groupKeys ?? [];
+    const getRowTreeBuilderNode = rowId => {
+      const count = getChildrenCount(params.dataRowIdToModelLookup[rowId]);
+      return {
+        id: rowId,
+        path: [...parentPath, getGroupKey(params.dataRowIdToModelLookup[rowId])].map(key => ({
+          key,
+          field: null
+        })),
+        hasServerChildren: !!count && count !== 0
+      };
+    };
+    const onDuplicatePath = (firstId, secondId, path) => {
+      throw new Error(['MUI X: The values returned by `getGroupKey` for all the sibling rows should be unique.', `The rows with id #${firstId} and #${secondId} have the same.`, `Path: ${JSON.stringify(path.map(step => step.key))}.`].join('\n'));
+    };
+    if (params.updates.type === 'full') {
+      return (0, _createRowTree.createRowTree)({
+        previousTree: params.previousTree,
+        nodes: params.updates.rows.map(getRowTreeBuilderNode),
+        defaultGroupingExpansionDepth: props.defaultGroupingExpansionDepth,
+        isGroupExpandedByDefault: props.isGroupExpandedByDefault,
+        groupingName: DATA_SOURCE_TREE_DATA_STRATEGY,
+        onDuplicatePath
+      });
+    }
+    return (0, _updateRowTree.updateRowTree)({
+      nodes: {
+        inserted: params.updates.actions.insert.map(getRowTreeBuilderNode),
+        modified: params.updates.actions.modify.map(getRowTreeBuilderNode),
+        removed: params.updates.actions.remove
+      },
+      previousTree: params.previousTree,
+      previousGroupsToFetch: params.previousGroupsToFetch,
+      previousTreeDepth: params.previousTreeDepths,
+      defaultGroupingExpansionDepth: props.defaultGroupingExpansionDepth,
+      isGroupExpandedByDefault: props.isGroupExpandedByDefault,
+      groupingName: DATA_SOURCE_TREE_DATA_STRATEGY
+    });
+  }, [props.unstable_dataSource, props.defaultGroupingExpansionDepth, props.isGroupExpandedByDefault]);
+  const filterRows = React.useCallback(() => {
+    const rowTree = (0, _xDataGrid.gridRowTreeSelector)(privateApiRef);
+    return (0, _utils.skipFiltering)(rowTree);
+  }, [privateApiRef]);
+  const sortRows = React.useCallback(() => {
+    const rowTree = (0, _xDataGrid.gridRowTreeSelector)(privateApiRef);
+    return (0, _utils.skipSorting)(rowTree);
+  }, [privateApiRef]);
+  (0, _internals.useGridRegisterPipeProcessor)(privateApiRef, 'hydrateColumns', updateGroupingColumn);
+  (0, _internals.useGridRegisterStrategyProcessor)(privateApiRef, DATA_SOURCE_TREE_DATA_STRATEGY, 'rowTreeCreation', createRowTreeForTreeData);
+  (0, _internals.useGridRegisterStrategyProcessor)(privateApiRef, DATA_SOURCE_TREE_DATA_STRATEGY, 'filtering', filterRows);
+  (0, _internals.useGridRegisterStrategyProcessor)(privateApiRef, DATA_SOURCE_TREE_DATA_STRATEGY, 'sorting', sortRows);
+  (0, _internals.useGridRegisterStrategyProcessor)(privateApiRef, DATA_SOURCE_TREE_DATA_STRATEGY, 'visibleRowsLookupCreation', _utils2.getVisibleRowsLookup);
+
+  /**
+   * 1ST RENDER
+   */
+  (0, _xDataGrid.useFirstRender)(() => {
+    setStrategyAvailability();
+  });
+
+  /**
+   * EFFECTS
+   */
+  const isFirstRender = React.useRef(true);
+  React.useEffect(() => {
+    if (!isFirstRender.current) {
+      setStrategyAvailability();
+    } else {
+      isFirstRender.current = false;
+    }
+  }, [setStrategyAvailability]);
+};
+exports.useGridDataSourceTreeDataPreProcessors = useGridDataSourceTreeDataPreProcessors;

package/hooks/features/serverSideTreeData/utils.d.ts

@@ -0,0 +1,6 @@
+import { GridRowId, GridRowTreeConfig } from '@mui/x-data-grid';
+export declare function skipFiltering(rowTree: GridRowTreeConfig): {
+    filteredRowsLookup: Record<GridRowId, boolean>;
+    filteredDescendantCountLookup: Record<GridRowId, number>;
+};
+export declare function skipSorting(rowTree: GridRowTreeConfig): GridRowId[];

package/hooks/features/serverSideTreeData/utils.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.skipFiltering = skipFiltering;
+exports.skipSorting = skipSorting;
+var _xDataGrid = require("@mui/x-data-grid");
+var _internals = require("@mui/x-data-grid/internals");
+function skipFiltering(rowTree) {
+  const filteredRowsLookup = {};
+  const filteredDescendantCountLookup = {};
+  const nodes = Object.values(rowTree);
+  for (let i = 0; i < nodes.length; i += 1) {
+    const node = nodes[i];
+    filteredRowsLookup[node.id] = true;
+  }
+  return {
+    filteredRowsLookup,
+    filteredDescendantCountLookup
+  };
+}
+function skipSorting(rowTree) {
+  return (0, _internals.getTreeNodeDescendants)(rowTree, _xDataGrid.GRID_ROOT_GROUP_ID, false);
+}

package/hooks/features/treeData/gridTreeDataUtils.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { GridRowTreeConfig, GridFilterState, GridFilterModel } from '@mui/x-data-grid';
 import { GridAggregatedFilterItemApplier } from '@mui/x-data-grid/internals';
 import type { GridPrivateApiPro } from '../../../models/gridApiPro';
@@ -15,5 +14,5 @@ export declare const TREE_DATA_STRATEGY = "tree-data";
  * - One of its children is passing the filter
  * - It is passing the filter
  */
-export declare const filterRowTreeFromTreeData: (params: FilterRowTreeFromTreeDataParams) => Omit<GridFilterState, 'filterModel'>;
+export declare const filterRowTreeFromTreeData: (params: FilterRowTreeFromTreeDataParams) => Omit<GridFilterState, "filterModel">;
 export {};

package/hooks/features/treeData/useGridTreeData.d.ts

@@ -1,3 +1,4 @@
 import * as React from 'react';
 import { GridApiPro } from '../../../models/gridApiPro';
-export declare const useGridTreeData: (apiRef: React.MutableRefObject<GridApiPro>) => void;
+import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
+export declare const useGridTreeData: (apiRef: React.MutableRefObject<GridApiPro>, props: Pick<DataGridProProcessedProps, "unstable_dataSource">) => void;

package/hooks/features/treeData/useGridTreeData.js

@@ -9,7 +9,7 @@ var _xDataGrid = require("@mui/x-data-grid");
 var _gridTreeDataGroupColDef = require("./gridTreeDataGroupColDef");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useGridTreeData = apiRef => {
+const useGridTreeData = (apiRef, props) => {
   /**
    * EVENTS
    */
@@ -19,9 +19,13 @@ const useGridTreeData = apiRef => {
       if (params.rowNode.type !== 'group') {
         return;
       }
+      if (props.unstable_dataSource && !params.rowNode.childrenExpanded) {
+        apiRef.current.unstable_dataSource.fetchRows(params.id);
+        return;
+      }
       apiRef.current.setRowChildrenExpansion(params.id, !params.rowNode.childrenExpanded);
     }
-  }, [apiRef]);
+  }, [apiRef, props.unstable_dataSource]);
   (0, _xDataGrid.useGridApiEventHandler)(apiRef, 'cellKeyDown', handleCellKeyDown);
 };
 exports.useGridTreeData = useGridTreeData;

package/hooks/features/treeData/useGridTreeDataPreProcessors.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
 import { DataGridProProcessedProps } from '../../../models/dataGridProProps';
 import { GridPrivateApiPro } from '../../../models/gridApiPro';
-export declare const useGridTreeDataPreProcessors: (privateApiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, 'treeData' | 'groupingColDef' | 'getTreeDataPath' | 'disableChildrenSorting' | 'disableChildrenFiltering' | 'defaultGroupingExpansionDepth' | 'isGroupExpandedByDefault'>) => void;
+export declare const useGridTreeDataPreProcessors: (privateApiRef: React.MutableRefObject<GridPrivateApiPro>, props: Pick<DataGridProProcessedProps, "treeData" | "groupingColDef" | "getTreeDataPath" | "disableChildrenSorting" | "disableChildrenFiltering" | "defaultGroupingExpansionDepth" | "isGroupExpandedByDefault" | "unstable_dataSource">) => void;

package/hooks/features/treeData/useGridTreeDataPreProcessors.js

@@ -23,8 +23,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useGridTreeDataPreProcessors = (privateApiRef, props) => {
   const setStrategyAvailability = React.useCallback(() => {
-    privateApiRef.current.setStrategyAvailability('rowTree', _gridTreeDataUtils.TREE_DATA_STRATEGY, props.treeData ? () => true : () => false);
-  }, [privateApiRef, props.treeData]);
+    privateApiRef.current.setStrategyAvailability('rowTree', _gridTreeDataUtils.TREE_DATA_STRATEGY, props.treeData && !props.unstable_dataSource ? () => true : () => false);
+  }, [privateApiRef, props.treeData, props.unstable_dataSource]);
   const getGroupingColDef = React.useCallback(() => {
     const groupingColDefProp = props.groupingColDef;
     let colDefOverride;
@@ -51,6 +51,9 @@ const useGridTreeDataPreProcessors = (privateApiRef, props) => {
     return (0, _extends2.default)({}, commonProperties, colDefOverrideProperties, _gridTreeDataGroupColDef.GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES);
   }, [privateApiRef, props.groupingColDef]);
   const updateGroupingColumn = React.useCallback(columnsState => {
+    if (props.unstable_dataSource) {
+      return columnsState;
+    }
     const groupingColDefField = _gridTreeDataGroupColDef.GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES.field;
     const shouldHaveGroupingColumn = props.treeData;
     const prevGroupingColumn = columnsState.lookup[groupingColDefField];
@@ -70,7 +73,7 @@ const useGridTreeDataPreProcessors = (privateApiRef, props) => {
       columnsState.orderedFields = columnsState.orderedFields.filter(field => field !== groupingColDefField);
     }
     return columnsState;
-  }, [props.treeData, getGroupingColDef]);
+  }, [props.treeData, props.unstable_dataSource, getGroupingColDef]);
   const createRowTreeForTreeData = React.useCallback(params => {
     if (!props.getTreeDataPath) {
       throw new Error('MUI X: No getTreeDataPath given.');

package/hooks/utils/useGridApiContext.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { GridApiPro } from '../../models/gridApiPro';
 export declare const useGridApiContext: () => import("react").MutableRefObject<GridApiPro>;

package/hooks/utils/useGridApiRef.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { GridApiPro } from '../../models/gridApiPro';
 export declare const useGridApiRef: () => import("react").MutableRefObject<GridApiPro>;

package/hooks/utils/useGridPrivateApiContext.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { GridPrivateApiPro } from '../../models/gridApiPro';
 export declare const useGridPrivateApiContext: () => import("react").MutableRefObject<GridPrivateApiPro>;

package/index.js

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

package/internals/index.d.ts

@@ -5,6 +5,7 @@ export { useGridColumnHeaders } from '../hooks/features/columnHeaders/useGridCol
 export { useGridColumnPinning, columnPinningStateInitializer, } from '../hooks/features/columnPinning/useGridColumnPinning';
 export { useGridColumnPinningPreProcessors } from '../hooks/features/columnPinning/useGridColumnPinningPreProcessors';
 export { useGridColumnReorder, columnReorderStateInitializer, } from '../hooks/features/columnReorder/useGridColumnReorder';
+export { useGridDataSourceTreeDataPreProcessors } from '../hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors';
 export { useGridDetailPanel, detailPanelStateInitializer, } from '../hooks/features/detailPanel/useGridDetailPanel';
 export { useGridDetailPanelPreProcessors } from '../hooks/features/detailPanel/useGridDetailPanelPreProcessors';
 export { useGridInfiniteLoader } from '../hooks/features/infiniteLoader/useGridInfiniteLoader';
@@ -17,6 +18,7 @@ export { useGridRowPinning, rowPinningStateInitializer, } from '../hooks/feature
 export { useGridRowPinningPreProcessors, addPinnedRow, } from '../hooks/features/rowPinning/useGridRowPinningPreProcessors';
 export { useGridLazyLoader } from '../hooks/features/lazyLoader/useGridLazyLoader';
 export { useGridLazyLoaderPreProcessors } from '../hooks/features/lazyLoader/useGridLazyLoaderPreProcessors';
+export { useGridDataSource, dataSourceStateInitializer, } from '../hooks/features/dataSource/useGridDataSource';
 export type { GridExperimentalProFeatures, DataGridProPropsWithoutDefaultValue, DataGridProPropsWithDefaultValue, } from '../models/dataGridProProps';
 export { createRowTree } from '../utils/tree/createRowTree';
 export { updateRowTree } from '../utils/tree/updateRowTree';

package/internals/index.js

@@ -12,6 +12,7 @@ var _exportNames = {
   useGridColumnPinningPreProcessors: true,
   useGridColumnReorder: true,
   columnReorderStateInitializer: true,
+  useGridDataSourceTreeDataPreProcessors: true,
   useGridDetailPanel: true,
   detailPanelStateInitializer: true,
   useGridDetailPanelPreProcessors: true,
@@ -27,6 +28,8 @@ var _exportNames = {
   addPinnedRow: true,
   useGridLazyLoader: true,
   useGridLazyLoaderPreProcessors: true,
+  useGridDataSource: true,
+  dataSourceStateInitializer: true,
   createRowTree: true,
   updateRowTree: true,
   sortRowTree: true,
@@ -76,6 +79,12 @@ Object.defineProperty(exports, "createRowTree", {
     return _createRowTree.createRowTree;
   }
 });
+Object.defineProperty(exports, "dataSourceStateInitializer", {
+  enumerable: true,
+  get: function () {
+    return _useGridDataSource.dataSourceStateInitializer;
+  }
+});
 Object.defineProperty(exports, "detailPanelStateInitializer", {
   enumerable: true,
   get: function () {
@@ -142,6 +151,18 @@ Object.defineProperty(exports, "useGridColumnReorder", {
     return _useGridColumnReorder.useGridColumnReorder;
   }
 });
+Object.defineProperty(exports, "useGridDataSource", {
+  enumerable: true,
+  get: function () {
+    return _useGridDataSource.useGridDataSource;
+  }
+});
+Object.defineProperty(exports, "useGridDataSourceTreeDataPreProcessors", {
+  enumerable: true,
+  get: function () {
+    return _useGridDataSourceTreeDataPreProcessors.useGridDataSourceTreeDataPreProcessors;
+  }
+});
 Object.defineProperty(exports, "useGridDetailPanel", {
   enumerable: true,
   get: function () {
@@ -226,6 +247,7 @@ var _useGridColumnHeaders = require("../hooks/features/columnHeaders/useGridColu
 var _useGridColumnPinning = require("../hooks/features/columnPinning/useGridColumnPinning");
 var _useGridColumnPinningPreProcessors = require("../hooks/features/columnPinning/useGridColumnPinningPreProcessors");
 var _useGridColumnReorder = require("../hooks/features/columnReorder/useGridColumnReorder");
+var _useGridDataSourceTreeDataPreProcessors = require("../hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors");
 var _useGridDetailPanel = require("../hooks/features/detailPanel/useGridDetailPanel");
 var _useGridDetailPanelPreProcessors = require("../hooks/features/detailPanel/useGridDetailPanelPreProcessors");
 var _useGridInfiniteLoader = require("../hooks/features/infiniteLoader/useGridInfiniteLoader");
@@ -238,6 +260,7 @@ var _useGridRowPinning = require("../hooks/features/rowPinning/useGridRowPinning
 var _useGridRowPinningPreProcessors = require("../hooks/features/rowPinning/useGridRowPinningPreProcessors");
 var _useGridLazyLoader = require("../hooks/features/lazyLoader/useGridLazyLoader");
 var _useGridLazyLoaderPreProcessors = require("../hooks/features/lazyLoader/useGridLazyLoaderPreProcessors");
+var _useGridDataSource = require("../hooks/features/dataSource/useGridDataSource");
 var _createRowTree = require("../utils/tree/createRowTree");
 var _updateRowTree = require("../utils/tree/updateRowTree");
 var _sortRowTree = require("../utils/tree/sortRowTree");

package/internals/propValidation.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.propValidatorsDataGridPro = void 0;
 var _internals = require("@mui/x-data-grid/internals");
-const propValidatorsDataGridPro = exports.propValidatorsDataGridPro = [..._internals.propValidatorsDataGrid, props => props.pagination && props.hideFooterRowCount && 'MUI X: The `hideFooterRowCount` prop has no effect when the pagination is enabled.' || undefined, props => props.treeData && props.filterMode === 'server' && 'MUI X: The `filterMode="server"` prop is not available when the `treeData` is enabled.' || undefined, props => !props.pagination && props.checkboxSelectionVisibleOnly && 'MUI X: The `checkboxSelectionVisibleOnly` prop has no effect when the pagination is not enabled.' || undefined, props => props.signature !== _internals.GridSignature.DataGrid && props.paginationMode === 'client' && props.rowsLoadingMode !== 'server' && (0, _internals.isNumber)(props.rowCount) && 'MUI X: Usage of the `rowCount` prop with client side pagination (`paginationMode="client"`) has no effect. `rowCount` is only meant to be used with `paginationMode="server"`.' || undefined];
+const propValidatorsDataGridPro = exports.propValidatorsDataGridPro = [..._internals.propValidatorsDataGrid, props => props.pagination && props.hideFooterRowCount && 'MUI X: The `hideFooterRowCount` prop has no effect when the pagination is enabled.' || undefined, props => props.treeData && props.filterMode === 'server' && !props.unstable_dataSource && 'MUI X: The `filterMode="server"` prop is not available when the `treeData` is enabled.' || undefined, props => !props.pagination && props.checkboxSelectionVisibleOnly && 'MUI X: The `checkboxSelectionVisibleOnly` prop has no effect when the pagination is not enabled.' || undefined, props => props.signature !== _internals.GridSignature.DataGrid && props.paginationMode === 'client' && props.rowsLoadingMode !== 'server' && (0, _internals.isNumber)(props.rowCount) && 'MUI X: Usage of the `rowCount` prop with client side pagination (`paginationMode="client"`) has no effect. `rowCount` is only meant to be used with `paginationMode="server"`.' || undefined];

package/material/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const materialSlots: {
     columnMenuPinLeftIcon: import("react").JSXElementConstructor<any>;
     columnMenuPinRightIcon: import("react").JSXElementConstructor<any>;