@mui/x-data-grid-pro 5.17.5 → 6.0.0-alpha.1

package/node/utils/tree/index.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "getGroupRowIdFromPath", {
   enumerable: true,
   get: function () {
-    return _buildRowTree.getGroupRowIdFromPath;
+    return _utils.getGroupRowIdFromPath;
   }
 });
 
-var _buildRowTree = require("./buildRowTree");
+var _utils = require("./utils");

package/node/utils/tree/insertDataRowInTree.js

@@ -0,0 +1,139 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.insertDataRowInTree = void 0;
+
+var _xDataGrid = require("@mui/x-data-grid");
+
+var _utils = require("./utils");
+
+/**
+ * Inserts a data row in a tree.
+ * For each steps of its path:
+ * - if a node exists with the same partial path, it will register this node as the ancestor of the data row.
+ * - if not, it will create an auto-generated node and register it as ancestor of the data row.
+ */
+const insertDataRowInTree = ({
+  id,
+  path,
+  updatedGroupsManager,
+  tree,
+  treeDepths,
+  onDuplicatePath,
+  isGroupExpandedByDefault,
+  defaultGroupingExpansionDepth
+}) => {
+  let parentNodeId = _xDataGrid.GRID_ROOT_GROUP_ID;
+
+  for (let depth = 0; depth < path.length; depth += 1) {
+    var _childrenFromPath, _childrenFromPath$fie;
+
+    const {
+      key,
+      field
+    } = path[depth];
+    const fieldWithDefaultValue = field != null ? field : '__no_field__';
+    const keyWithDefaultValue = key != null ? key : '__no_key__';
+    const existingNodeIdWithPartialPath = (_childrenFromPath = tree[parentNodeId].childrenFromPath) == null ? void 0 : (_childrenFromPath$fie = _childrenFromPath[fieldWithDefaultValue]) == null ? void 0 : _childrenFromPath$fie[keyWithDefaultValue.toString()]; // When we reach the last step of the path,
+    // We need to create a node for the row passed to `insertNodeInTree`
+
+    if (depth === path.length - 1) {
+      // If no node matches the full path,
+      // We create a leaf node for the data row.
+      if (existingNodeIdWithPartialPath == null) {
+        const leafNode = {
+          type: 'leaf',
+          id,
+          depth,
+          parent: parentNodeId,
+          groupingKey: key
+        };
+        updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(parentNodeId, 'insertChildren');
+        (0, _utils.insertNodeInTree)({
+          node: leafNode,
+          tree,
+          treeDepths
+        });
+      } else {
+        const existingNodeWithPartialPath = tree[existingNodeIdWithPartialPath]; // If we already have an auto-generated group matching the partial path,
+        // We replace it with the node from of data row passed to `insertNodeInTree`
+
+        if (existingNodeWithPartialPath.type === 'group' && existingNodeWithPartialPath.isAutoGenerated) {
+          updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(parentNodeId, 'removeChildren');
+          updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(parentNodeId, 'insertChildren');
+          (0, _utils.updateGroupNodeIdAndAutoGenerated)({
+            tree,
+            treeDepths,
+            node: existingNodeWithPartialPath,
+            updatedNode: {
+              id,
+              isAutoGenerated: false
+            }
+          });
+        } else {
+          // If we have another row matching the partial path, then there is a duplicate in the dataset.
+          // We warn the user and skip the current row.
+          onDuplicatePath == null ? void 0 : onDuplicatePath(existingNodeIdWithPartialPath, id, path);
+        }
+      }
+    } // For the intermediary steps of the path,
+    // We need to make sure that there is a node matching the partial path.
+    //
+    // If no node matches the partial path,
+    // We create an auto-generated group node.
+    else if (existingNodeIdWithPartialPath == null) {
+      const nodeId = (0, _utils.getGroupRowIdFromPath)(path.slice(0, depth + 1));
+      const autoGeneratedGroupNode = {
+        type: 'group',
+        id: nodeId,
+        parent: parentNodeId,
+        depth,
+        isAutoGenerated: true,
+        groupingKey: key,
+        groupingField: field,
+        children: [],
+        childrenFromPath: {}
+      };
+      updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(parentNodeId, 'insertChildren');
+      (0, _utils.insertNodeInTree)({
+        node: (0, _utils.addGroupDefaultExpansion)({
+          node: autoGeneratedGroupNode,
+          defaultGroupingExpansionDepth,
+          isGroupExpandedByDefault
+        }),
+        tree,
+        treeDepths
+      });
+      parentNodeId = nodeId;
+    } // For the intermediary steps of the path
+    // If a node matches the partial path, we use it as parent for the next step
+    else {
+      const currentGroupNode = tree[existingNodeIdWithPartialPath]; // If the node matching the partial path is not a group, we turn it into a group
+
+      if (currentGroupNode.type !== 'group') {
+        const groupNode = {
+          type: 'group',
+          id: currentGroupNode.id,
+          parent: currentGroupNode.parent,
+          depth: currentGroupNode.depth,
+          isAutoGenerated: false,
+          groupingKey: key,
+          groupingField: field,
+          children: [],
+          childrenFromPath: {}
+        };
+        tree[existingNodeIdWithPartialPath] = (0, _utils.addGroupDefaultExpansion)({
+          node: groupNode,
+          defaultGroupingExpansionDepth,
+          isGroupExpandedByDefault
+        });
+      }
+
+      parentNodeId = currentGroupNode.id;
+    }
+  }
+};
+
+exports.insertDataRowInTree = insertDataRowInTree;

package/node/utils/tree/models.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/node/utils/tree/removeDataRowFromTree.js

@@ -0,0 +1,110 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.removeDataRowFromTree = void 0;
+
+var _xDataGrid = require("@mui/x-data-grid");
+
+var _utils = require("./utils");
+
+const removeNodeAndCleanParent = ({
+  node,
+  tree,
+  treeDepths,
+  updatedGroupsManager
+}) => {
+  (0, _utils.removeNodeFromTree)({
+    node,
+    tree,
+    treeDepths
+  });
+
+  if (node.type === 'group' && node.footerId != null) {
+    (0, _utils.removeNodeFromTree)({
+      node: tree[node.footerId],
+      tree,
+      treeDepths
+    });
+  }
+
+  const parentNode = tree[node.parent];
+  updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(parentNode.id, 'removeChildren');
+  const shouldDeleteGroup = parentNode.id !== _xDataGrid.GRID_ROOT_GROUP_ID && parentNode.children.length === 0;
+
+  if (shouldDeleteGroup) {
+    if (parentNode.isAutoGenerated) {
+      removeNodeAndCleanParent({
+        node,
+        tree,
+        treeDepths
+      });
+    } else {
+      tree[parentNode.id] = {
+        type: 'leaf',
+        id: parentNode.id,
+        depth: parentNode.depth,
+        parent: parentNode.parent,
+        groupingKey: parentNode.groupingKey
+      };
+    }
+  }
+};
+
+const replaceDataGroupWithAutoGeneratedGroup = ({
+  node,
+  tree,
+  treeDepths,
+  updatedGroupsManager
+}) => {
+  updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(node.parent, 'removeChildren');
+  updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(node.parent, 'insertChildren');
+  (0, _utils.updateGroupNodeIdAndAutoGenerated)({
+    tree,
+    treeDepths,
+    node,
+    updatedNode: {
+      id: (0, _utils.getGroupRowIdFromPath)((0, _utils.getNodePathInTree)({
+        id: node.id,
+        tree
+      })),
+      isAutoGenerated: true
+    }
+  });
+};
+/**
+ * Removed a data row from the tree.
+ * If the node is a non-empty group, replace it with an auto-generated group to be able to keep displaying its children.
+ * If not, remove it and recursively clean its parent with the following rules:
+ * - An empty auto-generated should be removed from the tree
+ * - An empty non-auto-generated should be turned into a leaf
+ */
+
+
+const removeDataRowFromTree = ({
+  id,
+  tree,
+  treeDepths,
+  updatedGroupsManager
+}) => {
+  const node = tree[id];
+
+  if (node.type === 'group' && node.children.length > 0) {
+    replaceDataGroupWithAutoGeneratedGroup({
+      node,
+      tree,
+      treeDepths,
+      updatedGroupsManager
+    });
+  } else {
+    removeNodeAndCleanParent({
+      node,
+      tree,
+      treeDepths,
+      updatedGroupsManager
+    });
+  }
+};
+
+exports.removeDataRowFromTree = removeDataRowFromTree;

package/node/utils/tree/sortRowTree.js

@@ -5,62 +5,69 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.sortRowTree = void 0;
 
+var _xDataGrid = require("@mui/x-data-grid");
+
 const sortRowTree = params => {
   const {
-    rowIds,
     rowTree,
     disableChildrenSorting,
-    sortRowList
+    sortRowList,
+    shouldRenderGroupBelowLeaves
   } = params;
-  let sortedRows = []; // Group the rows by parent
-
-  const groupedByParentRows = new Map([[null, {
-    body: [],
-    footer: null
-  }]]);
-
-  for (let i = 0; i < rowIds.length; i += 1) {
-    const rowId = rowIds[i];
-    const node = rowTree[rowId];
-    let group = groupedByParentRows.get(node.parent);
-
-    if (!group) {
-      group = {
-        body: [],
-        footer: null
-      };
-      groupedByParentRows.set(node.parent, group);
-    }
+  let sortedRows = [];
+  const sortedGroupedByParentRows = new Map();
 
-    if (node.position === 'footer') {
-      group.footer = node;
-    } else {
-      group.body.push(node);
-    }
-  } // Apply the sorting to each list of children
+  const sortGroup = node => {
+    const shouldSortGroup = !!sortRowList && (!disableChildrenSorting || node.depth === -1);
+    let sortedRowIds;
 
+    if (shouldSortGroup) {
+      for (let i = 0; i < node.children.length; i += 1) {
+        const childNode = rowTree[node.children[i]];
 
-  const sortedGroupedByParentRows = new Map();
-  groupedByParentRows.forEach((group, parent) => {
-    if (group.body.length === 0) {
-      sortedGroupedByParentRows.set(parent, []);
-    } else {
-      let groupSortedRows;
-      const depth = group.body[0].depth;
+        if (childNode.type === 'group') {
+          sortGroup(childNode);
+        }
+      }
+
+      sortedRowIds = sortRowList(node.children.map(childId => rowTree[childId]));
+    } else if (shouldRenderGroupBelowLeaves) {
+      const childrenLeaves = [];
+      const childrenGroups = [];
 
-      if (depth > 0 && disableChildrenSorting || !sortRowList) {
-        groupSortedRows = group.body.map(row => row.id);
-      } else {
-        groupSortedRows = sortRowList(group.body);
+      for (let i = 0; i < node.children.length; i += 1) {
+        const childId = node.children[i];
+        const childNode = rowTree[childId];
+
+        if (childNode.type === 'group') {
+          sortGroup(childNode);
+          childrenGroups.push(childId);
+        } else if (childNode.type === 'leaf') {
+          childrenLeaves.push(childId);
+        }
       }
 
-      if (group.footer != null) {
-        groupSortedRows.push(group.footer.id);
+      sortedRowIds = [...childrenLeaves, ...childrenGroups];
+    } else {
+      for (let i = 0; i < node.children.length; i += 1) {
+        const childNode = rowTree[node.children[i]];
+
+        if (childNode.type === 'group') {
+          sortGroup(childNode);
+        }
       }
 
-      sortedGroupedByParentRows.set(parent, groupSortedRows);
+      sortedRowIds = [...node.children];
+    }
+
+    if (node.footerId != null) {
+      sortedRowIds.push(node.footerId);
     }
-  }); // Flatten the sorted lists to have children just after their parent
+
+    sortedGroupedByParentRows.set(node.id, sortedRowIds);
+  };
+
+  sortGroup(rowTree[_xDataGrid.GRID_ROOT_GROUP_ID]); // Flatten the sorted lists to have children just after their parent
 
   const insertRowListIntoSortedRows = (startIndex, rowList) => {
     sortedRows = [...sortedRows.slice(0, startIndex), ...rowList, ...sortedRows.slice(startIndex)];
@@ -77,7 +84,7 @@ const sortRowTree = params => {
     return treeSize;
   };
 
-  insertRowListIntoSortedRows(0, sortedGroupedByParentRows.get(null));
+  insertRowListIntoSortedRows(0, sortedGroupedByParentRows.get(_xDataGrid.GRID_ROOT_GROUP_ID));
   return sortedRows;
 };
 

package/node/utils/tree/updateRowTree.js

@@ -0,0 +1,98 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateRowTree = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _xDataGrid = require("@mui/x-data-grid");
+
+var _internals = require("@mui/x-data-grid/internals");
+
+var _insertDataRowInTree = require("./insertDataRowInTree");
+
+var _removeDataRowFromTree = require("./removeDataRowFromTree");
+
+var _utils = require("./utils");
+
+const updateRowTree = params => {
+  const tree = (0, _extends2.default)({}, params.previousTree);
+  const treeDepths = (0, _extends2.default)({}, params.previousTreeDepth);
+  const updatedGroupsManager = (0, _utils.createUpdatedGroupsManager)();
+
+  for (let i = 0; i < params.nodes.inserted.length; i += 1) {
+    const {
+      id,
+      path
+    } = params.nodes.inserted[i];
+    (0, _insertDataRowInTree.insertDataRowInTree)({
+      tree,
+      treeDepths,
+      updatedGroupsManager,
+      id,
+      path,
+      onDuplicatePath: params.onDuplicatePath,
+      isGroupExpandedByDefault: params.isGroupExpandedByDefault,
+      defaultGroupingExpansionDepth: params.defaultGroupingExpansionDepth
+    });
+  }
+
+  for (let i = 0; i < params.nodes.removed.length; i += 1) {
+    const nodeId = params.nodes.removed[i];
+    (0, _removeDataRowFromTree.removeDataRowFromTree)({
+      tree,
+      treeDepths,
+      updatedGroupsManager,
+      id: nodeId
+    });
+  }
+
+  for (let i = 0; i < params.nodes.modified.length; i += 1) {
+    const {
+      id,
+      path
+    } = params.nodes.modified[i];
+    const pathInPreviousTree = (0, _utils.getNodePathInTree)({
+      tree,
+      id
+    });
+    const isInSameGroup = (0, _internals.isDeepEqual)(pathInPreviousTree, path);
+
+    if (!isInSameGroup) {
+      (0, _removeDataRowFromTree.removeDataRowFromTree)({
+        tree,
+        treeDepths,
+        updatedGroupsManager,
+        id
+      });
+      (0, _insertDataRowInTree.insertDataRowInTree)({
+        tree,
+        treeDepths,
+        updatedGroupsManager,
+        id,
+        path,
+        onDuplicatePath: params.onDuplicatePath,
+        isGroupExpandedByDefault: params.isGroupExpandedByDefault,
+        defaultGroupingExpansionDepth: params.defaultGroupingExpansionDepth
+      });
+    } else {
+      updatedGroupsManager == null ? void 0 : updatedGroupsManager.addAction(tree[id].parent, 'modifyChildren');
+    }
+  } // TODO rows v6: Avoid walking the whole tree, we should be able to generate the new list only using slices.
+
+
+  const dataRowIds = (0, _internals.getTreeNodeDescendants)(tree, _xDataGrid.GRID_ROOT_GROUP_ID, true);
+  return {
+    tree,
+    treeDepths,
+    groupingName: params.groupingName,
+    dataRowIds,
+    updatedGroupsManager
+  };
+};
+
+exports.updateRowTree = updateRowTree;

package/node/utils/tree/utils.js

@@ -0,0 +1,217 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateGroupNodeIdAndAutoGenerated = exports.removeNodeFromTree = exports.insertNodeInTree = exports.getNodePathInTree = exports.getGroupRowIdFromPath = exports.createUpdatedGroupsManager = exports.addGroupDefaultExpansion = void 0;
+
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
+var _toPropertyKey2 = _interopRequireDefault(require("@babel/runtime/helpers/toPropertyKey"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _xDataGrid = require("@mui/x-data-grid");
+
+const getGroupRowIdFromPath = path => {
+  const pathStr = path.map(groupingCriteria => `${groupingCriteria.field}/${groupingCriteria.key}`).join('-');
+  return `auto-generated-row-${pathStr}`;
+};
+
+exports.getGroupRowIdFromPath = getGroupRowIdFromPath;
+
+const getNodePathInTree = ({
+  id,
+  tree
+}) => {
+  const path = [];
+  let node = tree[id];
+
+  while (node.id !== _xDataGrid.GRID_ROOT_GROUP_ID) {
+    path.push({
+      field: node.groupingField,
+      key: node.groupingKey
+    });
+    node = tree[node.parent];
+  }
+
+  return path;
+};
+
+exports.getNodePathInTree = getNodePathInTree;
+
+const addGroupDefaultExpansion = ({
+  node,
+  isGroupExpandedByDefault,
+  defaultGroupingExpansionDepth
+}) => {
+  let childrenExpanded;
+
+  if (node.id === _xDataGrid.GRID_ROOT_GROUP_ID) {
+    childrenExpanded = true;
+  } else if (isGroupExpandedByDefault) {
+    childrenExpanded = isGroupExpandedByDefault(node);
+  } else {
+    childrenExpanded = defaultGroupingExpansionDepth === -1 || defaultGroupingExpansionDepth > node.depth;
+  }
+
+  return (0, _extends2.default)({}, node, {
+    childrenExpanded
+  });
+};
+/**
+ * Insert a node in the tree
+ */
+
+
+exports.addGroupDefaultExpansion = addGroupDefaultExpansion;
+
+const insertNodeInTree = ({
+  node,
+  tree,
+  treeDepths
+}) => {
+  var _treeDepths$node$dept;
+
+  // 1. Insert node in the tree.
+  tree[node.id] = node; // 2. Increment the `treeDepths` object for the node's depth.
+
+  treeDepths[node.depth] = ((_treeDepths$node$dept = treeDepths[node.depth]) != null ? _treeDepths$node$dept : 0) + 1; // 3. Register the new node in its parent.
+
+  const parentNode = tree[node.parent];
+
+  if (node.type === 'footer') {
+    // For footers,
+    // Register the node from its parent `footerId` property.
+    tree[node.parent] = (0, _extends2.default)({}, parentNode, {
+      footerId: node.id
+    });
+  } else if (node.type === 'group' || node.type === 'leaf') {
+    var _groupingField, _groupingKey, _parentNode$childrenF;
+
+    // For groups and leaves,
+    // Register the node from its parents `children` and `childrenFromPath` properties.
+    const groupingField = (_groupingField = node.groupingField) != null ? _groupingField : '__no_field__';
+    const groupingKey = (_groupingKey = node.groupingKey) != null ? _groupingKey : '__no_key__';
+    tree[node.parent] = (0, _extends2.default)({}, parentNode, {
+      childrenFromPath: (0, _extends2.default)({}, parentNode.childrenFromPath, {
+        [groupingField]: (0, _extends2.default)({}, (_parentNode$childrenF = parentNode.childrenFromPath) == null ? void 0 : _parentNode$childrenF[groupingField], {
+          [groupingKey.toString()]: node.id
+        })
+      }),
+      children: [...parentNode.children, node.id]
+    });
+  }
+};
+/**
+ * Removes a node from the tree
+ */
+
+
+exports.insertNodeInTree = insertNodeInTree;
+
+const removeNodeFromTree = ({
+  node,
+  tree,
+  treeDepths
+}) => {
+  // 1. Remove node from the tree.
+  delete tree[node.id]; // 2. Decrement the `treeDepths` object for the node's depth.
+
+  const nodeDepth = node.depth;
+  const currentNodeCount = treeDepths[nodeDepth];
+
+  if (currentNodeCount === 1) {
+    delete treeDepths[nodeDepth];
+  } else {
+    treeDepths[nodeDepth] = currentNodeCount - 1;
+  } // 3. Unregister the new node in its parent.
+
+
+  const parentNode = tree[node.parent]; // For footers,
+  // Unregister the node from its parent `footerId` property.
+
+  if (node.type === 'footer') {
+    tree[parentNode.id] = (0, _extends2.default)({}, parentNode, {
+      footerId: null
+    });
+  } // For groups and leaves,
+  // Unregister the node from its parents `children` and `childrenFromPath` properties.
+  else {
+    var _groupingField2, _groupingKey2, _parentNode$childrenF2, _parentNode$childrenF3;
+
+    const groupingField = (_groupingField2 = node.groupingField) != null ? _groupingField2 : '__no_field__';
+    const groupingKey = (_groupingKey2 = node.groupingKey) != null ? _groupingKey2 : '__no_key__';
+
+    const _ref = (_parentNode$childrenF2 = (_parentNode$childrenF3 = parentNode.childrenFromPath) == null ? void 0 : _parentNode$childrenF3[groupingField]) != null ? _parentNode$childrenF2 : {},
+          _groupingKey$toString = groupingKey.toString(),
+          newChildrenFromPathWithField = (0, _objectWithoutPropertiesLoose2.default)(_ref, [_groupingKey$toString].map(_toPropertyKey2.default)); // TODO rows v6: Can we avoid this linear complexity ?
+
+
+    const children = parentNode.children.filter(childId => childId !== node.id);
+    const childrenFromPath = (0, _extends2.default)({}, parentNode.childrenFromPath);
+
+    if (Object.keys(newChildrenFromPathWithField).length === 0) {
+      delete childrenFromPath[groupingField];
+    } else {
+      childrenFromPath[groupingField] = newChildrenFromPathWithField;
+    }
+
+    tree[parentNode.id] = (0, _extends2.default)({}, parentNode, {
+      children,
+      childrenFromPath
+    });
+  }
+};
+/**
+ * Updates the `id` and `isAutoGenerated` properties of a group node.
+ */
+
+
+exports.removeNodeFromTree = removeNodeFromTree;
+
+const updateGroupNodeIdAndAutoGenerated = ({
+  node,
+  updatedNode,
+  tree,
+  treeDepths
+}) => {
+  // 1. Set the new parent for all children from the old group
+  node.children.forEach(childId => {
+    tree[childId] = (0, _extends2.default)({}, tree[childId], {
+      parent: updatedNode.id
+    });
+  }); // 2. Remove the old group from the tree
+
+  removeNodeFromTree({
+    node,
+    tree,
+    treeDepths
+  }); // 3. Add the new group in the tree
+
+  const groupNode = (0, _extends2.default)({}, node, updatedNode);
+  insertNodeInTree({
+    node: groupNode,
+    tree,
+    treeDepths
+  });
+};
+
+exports.updateGroupNodeIdAndAutoGenerated = updateGroupNodeIdAndAutoGenerated;
+
+const createUpdatedGroupsManager = () => ({
+  value: {},
+
+  addAction(groupId, action) {
+    if (!this.value[groupId]) {
+      this.value[groupId] = {};
+    }
+
+    this.value[groupId][action] = true;
+  }
+
+});
+
+exports.createUpdatedGroupsManager = createUpdatedGroupsManager;