@mui/x-data-grid-pro 8.18.0 → 8.20.0

package/hooks/features/treeData/utils.js

@@ -0,0 +1,109 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildTreeDataPath = void 0;
+exports.displaySetTreeDataPathWarning = displaySetTreeDataPathWarning;
+exports.removeNodeFromSourceParent = removeNodeFromSourceParent;
+exports.updateGroupHierarchyPaths = updateGroupHierarchyPaths;
+exports.updateLeafPath = updateLeafPath;
+exports.updateNodeParentAndDepth = updateNodeParentAndDepth;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _xDataGrid = require("@mui/x-data-grid");
+var _warning = require("@mui/x-internals/warning");
+var _utils = require("../rowReorder/utils");
+const buildTreeDataPath = (node, tree) => {
+  const path = [];
+  let current = node;
+  while (current && current.id !== _xDataGrid.GRID_ROOT_GROUP_ID) {
+    if ((current.type === 'leaf' || current.type === 'group') && current.groupingKey !== null) {
+      path.unshift(String(current.groupingKey));
+    }
+    current = tree[current.parent];
+  }
+  return path;
+};
+exports.buildTreeDataPath = buildTreeDataPath;
+function displaySetTreeDataPathWarning(operationName) {
+  (0, _warning.warnOnce)(`MUI X: ${operationName} requires \`setTreeDataPath()\` prop to update row data paths. ` + 'Please provide a `setTreeDataPath()` function to enable this feature.', 'warning');
+}
+function removeNodeFromSourceParent(updatedTree, sourceNode) {
+  const sourceParent = updatedTree[sourceNode.parent];
+  const sourceChildren = sourceParent.children.filter(id => id !== sourceNode.id);
+  if (sourceChildren.length === 0) {
+    updatedTree[sourceNode.parent] = (0, _extends2.default)({}, sourceParent, {
+      type: 'leaf',
+      children: undefined
+    });
+  } else {
+    updatedTree[sourceNode.parent] = (0, _extends2.default)({}, sourceParent, {
+      children: sourceChildren
+    });
+  }
+}
+async function updateLeafPath(sourceNode, targetPath, ctx) {
+  const {
+    apiRef,
+    setTreeDataPath,
+    processRowUpdate,
+    onProcessRowUpdateError
+  } = ctx;
+  const dataRowIdToModelLookup = (0, _xDataGrid.gridRowsLookupSelector)(apiRef);
+  const leafKey = sourceNode.type === 'leaf' ? sourceNode.groupingKey : null;
+  const newPath = leafKey !== null ? [...targetPath, String(leafKey)] : targetPath;
+  const originalRow = dataRowIdToModelLookup[sourceNode.id];
+  const updatedRow = setTreeDataPath(newPath, originalRow);
+  const updater = new _utils.BatchRowUpdater(apiRef, processRowUpdate, onProcessRowUpdateError);
+  updater.queueUpdate(sourceNode.id, originalRow, updatedRow);
+  const {
+    successful,
+    updates
+  } = await updater.executeAll();
+  if (successful.length === 0) {
+    return null;
+  }
+  return updates[0];
+}
+async function updateGroupHierarchyPaths(sourceNode, sourceBasePath, targetPath, ctx) {
+  const {
+    apiRef,
+    setTreeDataPath,
+    processRowUpdate,
+    onProcessRowUpdateError
+  } = ctx;
+  const rowTree = (0, _xDataGrid.gridRowTreeSelector)(apiRef);
+  const dataRowIdToModelLookup = (0, _xDataGrid.gridRowsLookupSelector)(apiRef);
+  const nodesToUpdate = (0, _utils.collectAllDescendants)(sourceNode, rowTree);
+  nodesToUpdate.unshift(sourceNode); // Include the group itself
+
+  const sourceDepth = sourceBasePath.length;
+  const updater = new _utils.BatchRowUpdater(apiRef, processRowUpdate, onProcessRowUpdateError);
+  for (const node of nodesToUpdate) {
+    const originalRow = dataRowIdToModelLookup[node.id];
+    const currentPath = buildTreeDataPath(node, rowTree);
+    const relativePath = currentPath.slice(sourceDepth);
+    const newPath = [...targetPath, ...relativePath];
+    const updatedRow = setTreeDataPath(newPath, originalRow);
+    updater.queueUpdate(node.id, originalRow, updatedRow);
+  }
+  const {
+    successful,
+    updates
+  } = await updater.executeAll();
+  if (successful.length === 0) {
+    return [];
+  }
+  return updates;
+}
+function updateNodeParentAndDepth(updatedTree, node, newParentId, newDepth) {
+  updatedTree[node.id] = (0, _extends2.default)({}, node, {
+    parent: newParentId,
+    depth: newDepth
+  });
+  if (node.type === 'group') {
+    const depthDiff = newDepth - node.depth;
+    (0, _utils.updateDescendantDepths)(node, updatedTree, depthDiff);
+  }
+}

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-pro v8.18.0
+ * @mui/x-data-grid-pro v8.20.0
  *
  * @license SEE LICENSE IN LICENSE
  * This source code is licensed under the SEE LICENSE IN LICENSE license found in the

package/internals/index.d.ts

@@ -12,6 +12,7 @@ export { useGridDetailPanel, detailPanelStateInitializer } from "../hooks/featur
 export { useGridDetailPanelPreProcessors } from "../hooks/features/detailPanel/useGridDetailPanelPreProcessors.js";
 export { useGridInfiniteLoader } from "../hooks/features/infiniteLoader/useGridInfiniteLoader.js";
 export { useGridRowReorder, rowReorderStateInitializer } from "../hooks/features/rowReorder/useGridRowReorder.js";
+export { useGridRowsOverridableMethods as useGridRowsOverridableMethodsPro } from "../hooks/features/rows/useGridRowsOverridableMethods.js";
 export { useGridRowReorderPreProcessors } from "../hooks/features/rowReorder/useGridRowReorderPreProcessors.js";
 export type { GridRowReorderPrivateApi } from "../models/gridRowReorderApi.js";
 export { useGridTreeData } from "../hooks/features/treeData/useGridTreeData.js";
@@ -38,4 +39,11 @@ export declare enum RowGroupingStrategy {
   Default = "grouping-columns",
   DataSource = "grouping-columns-data-source",
 }
+export { RowReorderValidator } from "../hooks/features/rowReorder/reorderValidator.js";
+export type { ValidationRule } from "../hooks/features/rowReorder/reorderValidator.js";
+export { RowReorderExecutor, BaseReorderOperation } from "../hooks/features/rowReorder/reorderExecutor.js";
+export { SameParentSwapOperation } from "../hooks/features/treeData/treeDataReorderExecutor.js";
+export type { ReorderExecutionContext, ReorderOperation, ReorderOperationType } from "../hooks/features/rowReorder/types.js";
+export { commonReorderConditions } from "../hooks/features/rowReorder/commonReorderConditions.js";
+export * as rowReorderUtils from "../hooks/features/rowReorder/utils.js";
 export * from "./propValidation.js";

package/internals/index.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -22,6 +23,7 @@ var _exportNames = {
   useGridInfiniteLoader: true,
   useGridRowReorder: true,
   rowReorderStateInitializer: true,
+  useGridRowsOverridableMethodsPro: true,
   useGridRowReorderPreProcessors: true,
   useGridTreeData: true,
   useGridTreeDataPreProcessors: true,
@@ -46,8 +48,20 @@ var _exportNames = {
   getVisibleRowsLookup: true,
   skipSorting: true,
   skipFiltering: true,
-  getParentPath: true
+  getParentPath: true,
+  RowReorderValidator: true,
+  RowReorderExecutor: true,
+  BaseReorderOperation: true,
+  SameParentSwapOperation: true,
+  commonReorderConditions: true,
+  rowReorderUtils: true
 };
+Object.defineProperty(exports, "BaseReorderOperation", {
+  enumerable: true,
+  get: function () {
+    return _reorderExecutor.BaseReorderOperation;
+  }
+});
 Object.defineProperty(exports, "DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS", {
   enumerable: true,
   get: function () {
@@ -61,6 +75,24 @@ Object.defineProperty(exports, "GridColumnHeaders", {
   }
 });
 exports.RowGroupingStrategy = void 0;
+Object.defineProperty(exports, "RowReorderExecutor", {
+  enumerable: true,
+  get: function () {
+    return _reorderExecutor.RowReorderExecutor;
+  }
+});
+Object.defineProperty(exports, "RowReorderValidator", {
+  enumerable: true,
+  get: function () {
+    return _reorderValidator.RowReorderValidator;
+  }
+});
+Object.defineProperty(exports, "SameParentSwapOperation", {
+  enumerable: true,
+  get: function () {
+    return _treeDataReorderExecutor.SameParentSwapOperation;
+  }
+});
 Object.defineProperty(exports, "addPinnedRow", {
   enumerable: true,
   get: function () {
@@ -79,6 +111,12 @@ Object.defineProperty(exports, "columnReorderStateInitializer", {
     return _useGridColumnReorder.columnReorderStateInitializer;
   }
 });
+Object.defineProperty(exports, "commonReorderConditions", {
+  enumerable: true,
+  get: function () {
+    return _commonReorderConditions.commonReorderConditions;
+  }
+});
 Object.defineProperty(exports, "createRowTree", {
   enumerable: true,
   get: function () {
@@ -151,6 +189,7 @@ Object.defineProperty(exports, "rowReorderStateInitializer", {
     return _useGridRowReorder.rowReorderStateInitializer;
   }
 });
+exports.rowReorderUtils = void 0;
 Object.defineProperty(exports, "skipFiltering", {
   enumerable: true,
   get: function () {
@@ -289,6 +328,12 @@ Object.defineProperty(exports, "useGridRowReorderPreProcessors", {
     return _useGridRowReorderPreProcessors.useGridRowReorderPreProcessors;
   }
 });
+Object.defineProperty(exports, "useGridRowsOverridableMethodsPro", {
+  enumerable: true,
+  get: function () {
+    return _useGridRowsOverridableMethods.useGridRowsOverridableMethods;
+  }
+});
 Object.defineProperty(exports, "useGridTreeData", {
   enumerable: true,
   get: function () {
@@ -326,6 +371,7 @@ var _useGridDetailPanel = require("../hooks/features/detailPanel/useGridDetailPa
 var _useGridDetailPanelPreProcessors = require("../hooks/features/detailPanel/useGridDetailPanelPreProcessors");
 var _useGridInfiniteLoader = require("../hooks/features/infiniteLoader/useGridInfiniteLoader");
 var _useGridRowReorder = require("../hooks/features/rowReorder/useGridRowReorder");
+var _useGridRowsOverridableMethods = require("../hooks/features/rows/useGridRowsOverridableMethods");
 var _useGridRowReorderPreProcessors = require("../hooks/features/rowReorder/useGridRowReorderPreProcessors");
 var _useGridTreeData = require("../hooks/features/treeData/useGridTreeData");
 var _useGridTreeDataPreProcessors = require("../hooks/features/treeData/useGridTreeDataPreProcessors");
@@ -344,6 +390,12 @@ var _updateRowTree = require("../utils/tree/updateRowTree");
 var _sortRowTree = require("../utils/tree/sortRowTree");
 var _utils2 = require("../utils/tree/utils");
 var _utils3 = require("../hooks/features/serverSideTreeData/utils");
+var _reorderValidator = require("../hooks/features/rowReorder/reorderValidator");
+var _reorderExecutor = require("../hooks/features/rowReorder/reorderExecutor");
+var _treeDataReorderExecutor = require("../hooks/features/treeData/treeDataReorderExecutor");
+var _commonReorderConditions = require("../hooks/features/rowReorder/commonReorderConditions");
+var _rowReorderUtils = _interopRequireWildcard(require("../hooks/features/rowReorder/utils"));
+exports.rowReorderUtils = _rowReorderUtils;
 var _propValidation = require("./propValidation");
 Object.keys(_propValidation).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/models/dataGridProProps.d.ts

@@ -3,12 +3,14 @@ import { RefObject } from '@mui/x-internals/types';
 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/index.js";
-import { GridApiPro } from "./gridApiPro.js";
+import type { GridApiPro } from "./gridApiPro.js";
 import { GridGroupingColDefOverride, GridGroupingColDefOverrideParams } from "./gridGroupingColDefOverride.js";
-import { GridInitialStatePro } from "./gridStatePro.js";
-import { GridProSlotsComponent } from "./gridProSlotsComponent.js";
+import type { GridInitialStatePro } from "./gridStatePro.js";
+import type { GridProSlotsComponent } from "./gridProSlotsComponent.js";
 import type { GridProSlotProps } from "./gridProSlotProps.js";
-import { GridDataSourcePro as GridDataSource, GridGetRowsParamsPro as GridGetRowsParams } from "../hooks/features/dataSource/models.js";
+import type { GridDataSourcePro as GridDataSource, GridGetRowsParamsPro as GridGetRowsParams } from "../hooks/features/dataSource/models.js";
+import type { ReorderValidationContext } from "../hooks/features/rowReorder/models.js";
+import type { IsRowReorderableParams } from "../hooks/features/rowReorder/index.js";
 export interface GridExperimentalProFeatures extends GridExperimentalFeatures {}
 interface DataGridProPropsWithComplexDefaultValueBeforeProcessing extends Omit<DataGridPropsWithComplexDefaultValueBeforeProcessing, 'components'> {
   /**
@@ -127,6 +129,15 @@ interface DataGridProRegularProps<R extends GridValidRowModel> {
    * @returns {string[]} The path to the row.
    */
   getTreeDataPath?: (row: R) => readonly string[];
+  /**
+   * Updates the tree path in a row model.
+   * Used when reordering rows across different parents in tree data.
+   * @template R
+   * @param {string[]} path The new path for the row.
+   * @param {R} row The row model to update.
+   * @returns {R} The updated row model with the new path.
+   */
+  setTreeDataPath?: (path: string[], row: R) => R;
 }
 export interface DataGridProPropsWithoutDefaultValue<R extends GridValidRowModel = any> extends Omit<DataGridPropsWithoutDefaultValue<R>, 'initialState' | 'componentsProps' | 'slotProps' | 'dataSource' | 'onDataSourceError'>, DataGridProRegularProps<R>, DataGridProSharedPropsWithoutDefaultValue {
   /**
@@ -218,5 +229,22 @@ export interface DataGridProPropsWithoutDefaultValue<R extends GridValidRowModel
    * @param {GridGetRowsError | GridUpdateRowError} error The data source error object.
    */
   onDataSourceError?: (error: GridGetRowsError<GridGetRowsParams> | GridUpdateRowError) => void;
+  /**
+   * Indicates whether a row is reorderable.
+   * @param {object} params With all properties from the row.
+   * @param {R} params.row The row model of the row that the current cell belongs to.
+   * @param {GridTreeNode} params.rowNode The node of the row that the current cell belongs to.
+   * @returns {boolean} A boolean indicating if the row is reorderable.
+   */
+  isRowReorderable?: (params: IsRowReorderableParams) => boolean;
+  /**
+   * Indicates if a row reorder attempt is valid.
+   * Can be used to disable certain row reorder operations based on the context.
+   * The internal validation is still applied, preventing unsupported use-cases.
+   * Use `isValidRowReorder()` to add additional validation rules to the default ones.
+   * @param {ReorderValidationContext} context The context object containing all information about the reorder operation.
+   * @returns {boolean} A boolean indicating if the reorder operation should go through.
+   */
+  isValidRowReorder?: (context: ReorderValidationContext) => boolean;
 }
 export {};

package/models/gridRowOrderChangeParams.d.ts

@@ -1,18 +1,42 @@
-import { GridRowModel } from '@mui/x-data-grid';
+import { GridRowModel, GridRowId } from '@mui/x-data-grid';
 /**
  * Object passed as parameter of the row order change event.
+ * @demos
+ *   - [Flat row reordering](/x/react-data-grid/row-ordering/#implementing-row-reordering)
+ *   - [Tree data reordering](/x/react-data-grid/tree-data/#drag-and-drop-tree-data-reordering)
+ *   - [Row grouping reordering](/x/react-data-grid/row-grouping/#drag-and-drop-group-reordering)
  */
 export interface GridRowOrderChangeParams {
   /**
-   * The row data.
+   * The row data of the primary row being moved.
+   * For group moves, this represents the group row itself.
+   * Descendants move should be handled as data updates. e.g. using `processRowUpdate()`
    */
   row: GridRowModel;
   /**
-   * The target row index.
+   * The old index of the row.
+   * - For flat data: Position in the flat array.
+   * - For nested data: Position within oldParent's children array (0-based).
+   */
+  oldIndex: number;
+  /**
+   * The target index of the row.
+   * - For flat data: New position in the flat array.
+   * - For nested data: Position within newParent's children array (0-based).
    */
   targetIndex: number;
   /**
-   * The old row index.
+   * The parent row ID before the move.
+   * - For flat data: `null`
+   * - For nested row at root level: `null`.
+   * - For nested row at levels below root: Parent row's ID.
    */
-  oldIndex: number;
+  oldParent: GridRowId | null;
+  /**
+   * The parent row ID after the move.
+   * - For flat data: `null`.
+   * - For nested row at root level: `null`.
+   * - For nested row at levels below root: Parent row's ID.
+   */
+  newParent: GridRowId | null;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-pro",
-  "version": "8.18.0",
+  "version": "8.20.0",
   "author": "MUI Team",
   "description": "The Pro plan edition of the MUI X Data Grid components.",
   "license": "SEE LICENSE IN LICENSE",
@@ -37,9 +37,9 @@
     "@mui/utils": "^7.3.5",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
-    "@mui/x-data-grid": "8.18.0",
-    "@mui/x-license": "8.18.0",
-    "@mui/x-internals": "8.18.0"
+    "@mui/x-data-grid": "8.20.0",
+    "@mui/x-internals": "8.19.0",
+    "@mui/x-license": "8.19.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",