@mui/x-tree-view-pro 8.23.0 → 8.24.0

package/internals/plugins/lazyLoading/TreeViewLazyLoadingPlugin.js

@@ -0,0 +1,238 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TreeViewLazyLoadingPlugin = exports.TREE_VIEW_LAZY_LOADED_ITEMS_INITIAL_STATE = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _internals = require("@mui/x-tree-view/internals");
+var _utils = require("@mui/x-tree-view/utils");
+var _utils2 = require("./utils");
+const TREE_VIEW_LAZY_LOADED_ITEMS_INITIAL_STATE = exports.TREE_VIEW_LAZY_LOADED_ITEMS_INITIAL_STATE = {
+  loading: {},
+  errors: {}
+};
+class TreeViewLazyLoadingPlugin {
+  nestedDataManager = new _utils2.NestedDataManager(this);
+  constructor(store) {
+    this.store = store;
+    this.cache = store.parameters.dataSourceCache ?? new _utils.DataSourceCacheDefault({});
+    if (store.parameters.dataSource != null) {
+      this.init();
+      store.subscribeEvent('beforeItemToggleExpansion', this.handleBeforeItemToggleExpansion);
+    }
+  }
+  init = () => {
+    const store = this.store;
+    // eslint-disable-next-line consistent-this
+    const plugin = this;
+    const fetchAllExpandedItems = async () => {
+      async function fetchChildrenIfExpanded(parentIds) {
+        const expandedItems = parentIds.filter(id => _internals.expansionSelectors.isItemExpanded(store.state, id));
+        if (expandedItems.length > 0) {
+          const itemsToLazyLoad = expandedItems.filter(id => _internals.itemsSelectors.itemOrderedChildrenIds(store.state, id).length === 0);
+          if (itemsToLazyLoad.length > 0) {
+            await plugin.fetchItems(itemsToLazyLoad);
+          }
+          const childrenIds = expandedItems.flatMap(id => _internals.itemsSelectors.itemOrderedChildrenIds(store.state, id));
+          await fetchChildrenIfExpanded(childrenIds);
+        }
+      }
+      if (store.parameters.items.length) {
+        const newlyExpandableItems = getExpandableItemsFromDataSource(store, store.parameters.dataSource);
+        if (newlyExpandableItems.length > 0) {
+          store.expansion.addExpandableItems(newlyExpandableItems);
+        }
+      } else {
+        await plugin.fetchItemChildren({
+          itemId: null
+        });
+      }
+      await fetchChildrenIfExpanded(_internals.itemsSelectors.itemOrderedChildrenIds(store.state, null));
+    };
+    fetchAllExpandedItems();
+  };
+  handleBeforeItemToggleExpansion = async (eventParameters, event) => {
+    if (!this.store.parameters.dataSource || !eventParameters.shouldBeExpanded) {
+      return;
+    }
+
+    // prevent the default expansion behavior
+    eventParameters.isExpansionPrevented = true;
+    await this.fetchItems([eventParameters.itemId]);
+    const hasError = _internals.lazyLoadingSelectors.itemHasError(this.store.state, eventParameters.itemId);
+    if (!hasError) {
+      this.store.expansion.applyItemExpansion({
+        itemId: eventParameters.itemId,
+        shouldBeExpanded: true,
+        event
+      });
+      if (_internals.selectionSelectors.isItemSelected(this.store.state, eventParameters.itemId)) {
+        // make sure selection propagation works correctly
+        this.store.selection.setItemSelection({
+          event,
+          itemId: eventParameters.itemId,
+          keepExistingSelection: true,
+          shouldBeSelected: true
+        });
+      }
+    }
+  };
+  setItemLoading = (itemId, isLoading) => {
+    if (!this.store.parameters.dataSource || !this.store.state.lazyLoadedItems) {
+      return;
+    }
+    if (_internals.lazyLoadingSelectors.isItemLoading(this.store.state, itemId) === isLoading) {
+      return;
+    }
+    const itemIdWithDefault = itemId ?? _internals.TREE_VIEW_ROOT_PARENT_ID;
+    const loading = (0, _extends2.default)({}, this.store.state.lazyLoadedItems.loading);
+    if (isLoading === false) {
+      delete loading[itemIdWithDefault];
+    } else {
+      loading[itemIdWithDefault] = isLoading;
+    }
+    this.store.set('lazyLoadedItems', (0, _extends2.default)({}, this.store.state.lazyLoadedItems, {
+      loading
+    }));
+  };
+  setItemError = (itemId, error) => {
+    if (!this.store.parameters.dataSource || !this.store.state.lazyLoadedItems) {
+      return;
+    }
+    if (_internals.lazyLoadingSelectors.itemError(this.store.state, itemId) === error) {
+      return;
+    }
+    const itemIdWithDefault = itemId ?? _internals.TREE_VIEW_ROOT_PARENT_ID;
+    const errors = (0, _extends2.default)({}, this.store.state.lazyLoadedItems.errors);
+    if (error === null && errors[itemIdWithDefault] !== undefined) {
+      delete errors[itemIdWithDefault];
+    } else {
+      errors[itemIdWithDefault] = error;
+    }
+    this.store.set('lazyLoadedItems', (0, _extends2.default)({}, this.store.state.lazyLoadedItems, {
+      errors
+    }));
+  };
+  buildPublicAPI = () => {
+    return {
+      updateItemChildren: this.updateItemChildren
+    };
+  };
+
+  /**
+   * Method used for fetching multiple items concurrently.
+   * Only relevant for lazy-loaded tree views.
+   *
+   * @param {TreeViewItemId[]} parentIds The ids of the items to fetch the children of.
+   * @returns {Promise<void>} The promise resolved when the items are fetched.
+   */
+  fetchItems = parentIds => this.nestedDataManager.queue(parentIds);
+
+  /**
+   * Method used for updating an item's children.
+   * Only relevant for lazy-loaded tree views.
+   *
+   * @param {TreeViewItemId | null} itemId The id of the item to update the children of. If null is passed, it will update the root's children.
+   * @returns {Promise<void>} The promise resolved when the items are fetched.
+   */
+  updateItemChildren = itemId => this.fetchItemChildren({
+    itemId,
+    forceRefresh: true
+  });
+
+  /**
+   * Method used for fetching an item's children.
+   * Only relevant for lazy-loaded tree views.
+   *
+   * @param {object} parameters The parameters of the method.
+   * @param {TreeViewItemId} parameters.itemId The The id of the item to fetch the children of.
+   * @param {boolean} [parameters.forceRefresh] Whether to force a refresh of the children when the cache already contains some data.
+   * @returns {Promise<void>} The promise resolved when the items are fetched.
+   */
+  fetchItemChildren = async ({
+    itemId,
+    forceRefresh
+  }) => {
+    if (!this.store.parameters.dataSource) {
+      return;
+    }
+    const {
+      getChildrenCount,
+      getTreeItems
+    } = this.store.parameters.dataSource;
+    // clear the request if the item is not in the tree
+    if (itemId != null && !_internals.itemsSelectors.itemMeta(this.store.state, itemId)) {
+      this.nestedDataManager.clearPendingRequest(itemId);
+      return;
+    }
+
+    // reset the state if we are fetching the root items
+    if (itemId == null && !_internals.lazyLoadingSelectors.isEmpty(this.store.state)) {
+      this.store.set('lazyLoadedItems', TREE_VIEW_LAZY_LOADED_ITEMS_INITIAL_STATE);
+    }
+    const cacheKey = itemId ?? _internals.TREE_VIEW_ROOT_PARENT_ID;
+    if (!forceRefresh) {
+      // reads from the value from the cache
+      const cachedData = this.cache.get(cacheKey);
+      if (cachedData !== undefined && cachedData !== -1) {
+        if (itemId != null) {
+          this.nestedDataManager.setRequestSettled(itemId);
+        }
+        this.store.items.setItemChildren({
+          items: cachedData,
+          parentId: itemId,
+          getChildrenCount
+        });
+        this.setItemLoading(itemId, false);
+        return;
+      }
+
+      // set the item loading status to true
+      this.setItemLoading(itemId, true);
+      if (cachedData === -1) {
+        this.store.items.removeChildren(itemId);
+      }
+    }
+
+    // reset existing error if any
+    if (_internals.lazyLoadingSelectors.itemError(this.store.state, itemId)) {
+      this.setItemError(itemId, null);
+    }
+    try {
+      let response;
+      if (itemId == null) {
+        response = await getTreeItems();
+      } else {
+        response = await getTreeItems(itemId);
+        this.nestedDataManager.setRequestSettled(itemId);
+      }
+      // save the response in the cache
+      this.cache.set(cacheKey, response);
+      // update the items in the state
+      this.store.items.setItemChildren({
+        items: response,
+        parentId: itemId,
+        getChildrenCount
+      });
+    } catch (error) {
+      const childrenFetchError = error;
+      // set the item error in the state
+      this.setItemError(itemId, childrenFetchError);
+      if (forceRefresh) {
+        this.store.items.removeChildren(itemId);
+      }
+    } finally {
+      // set the item loading status to false
+      this.setItemLoading(itemId, false);
+      if (itemId != null) {
+        this.nestedDataManager.setRequestSettled(itemId);
+      }
+    }
+  };
+}
+exports.TreeViewLazyLoadingPlugin = TreeViewLazyLoadingPlugin;
+function getExpandableItemsFromDataSource(store, dataSource) {
+  return Object.values(store.state.itemMetaLookup).filter(itemMeta => !itemMeta.expandable && dataSource.getChildrenCount(store.state.itemModelLookup[itemMeta.id]) !== 0).map(item => item.id);
+}

package/internals/plugins/lazyLoading/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./TreeViewLazyLoadingPlugin.js";
+export * from "./types.js";

package/internals/plugins/lazyLoading/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _TreeViewLazyLoadingPlugin = require("./TreeViewLazyLoadingPlugin");
+Object.keys(_TreeViewLazyLoadingPlugin).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _TreeViewLazyLoadingPlugin[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _TreeViewLazyLoadingPlugin[key];
+    }
+  });
+});
+var _types = require("./types");
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _types[key];
+    }
+  });
+});

package/internals/plugins/lazyLoading/types.d.ts

@@ -0,0 +1,21 @@
+import { TreeViewItemId } from '@mui/x-tree-view/models';
+export type DataSource<R extends {}> = {
+  /**
+   * Used to determine the number of children the item has.
+   * Only relevant for lazy-loaded trees.
+   *
+   * @template R
+   * @param {R} item The item to check.
+   * @returns {number} The number of children.
+   */
+  getChildrenCount: (item: R) => number;
+  /**
+   * Method used for fetching the items.
+   * Only relevant for lazy-loaded tree views.
+   *
+   * @template R
+   * @param {TreeViewItemId} parentId The id of the item the children belong to.
+   * @returns { Promise<R[]>} The children of the item.
+   */
+  getTreeItems: (parentId?: TreeViewItemId) => Promise<R[]>;
+};

package/internals/plugins/lazyLoading/types.js

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

package/{esm/internals/plugins/useTreeViewLazyLoading → internals/plugins/lazyLoading}/utils.d.ts

@@ -1,15 +1,11 @@
-import { TreeViewInstance, UseTreeViewLazyLoadingSignature } from '@mui/x-tree-view/internals';
 import { TreeViewItemId } from '@mui/x-tree-view/models';
+import { TreeViewLazyLoadingPlugin } from "./TreeViewLazyLoadingPlugin.js";
 export declare enum RequestStatus {
   QUEUED = 0,
   PENDING = 1,
   SETTLED = 2,
   UNKNOWN = 3,
 }
-/**
- * Plugins that the `NestedDataManager` class can use if they are present, but are not required.
- */
-export type NestedDataManagerOptionalPlugins = readonly [];
 /**
  * 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`
@@ -19,9 +15,9 @@ export declare class NestedDataManager {
   private pendingRequests;
   private queuedRequests;
   private settledRequests;
-  private instance;
+  private lazyLoadingPlugin;
   private maxConcurrentRequests;
-  constructor(instance: TreeViewInstance<[UseTreeViewLazyLoadingSignature]>, maxConcurrentRequests?: number);
+  constructor(lazyLoadingPlugin: TreeViewLazyLoadingPlugin, maxConcurrentRequests?: number);
   private processQueue;
   queue: (ids: TreeViewItemId[]) => Promise<void>;
   setRequestSettled: (id: TreeViewItemId) => Promise<void>;

package/internals/plugins/{useTreeViewLazyLoading → lazyLoading}/utils.js

@@ -12,12 +12,6 @@ let RequestStatus = exports.RequestStatus = /*#__PURE__*/function (RequestStatus
   RequestStatus[RequestStatus["UNKNOWN"] = 3] = "UNKNOWN";
   return RequestStatus;
 }({});
-/**
- * Plugins that need to be present in the Tree View in order for the `NestedDataManager` class to work correctly.
- */
-/**
- * Plugins that the `NestedDataManager` class can use if they are present, but are not required.
- */
 /**
  * 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`
@@ -27,8 +21,8 @@ class NestedDataManager {
   pendingRequests = new Set();
   queuedRequests = new Set();
   settledRequests = new Set();
-  constructor(instance, maxConcurrentRequests = MAX_CONCURRENT_REQUESTS) {
-    this.instance = instance;
+  constructor(lazyLoadingPlugin, maxConcurrentRequests = MAX_CONCURRENT_REQUESTS) {
+    this.lazyLoadingPlugin = lazyLoadingPlugin;
     this.maxConcurrentRequests = maxConcurrentRequests;
   }
   processQueue = async () => {
@@ -45,7 +39,7 @@ class NestedDataManager {
       const id = fetchQueue[i];
       this.queuedRequests.delete(id);
       this.pendingRequests.add(id);
-      fetchPromises.push(this.instance.fetchItemChildren({
+      fetchPromises.push(this.lazyLoadingPlugin.fetchItemChildren({
         itemId: id
       }));
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-tree-view-pro",
-  "version": "8.23.0",
+  "version": "8.24.0",
   "author": "MUI Team",
   "description": "The Pro plan edition of the MUI X Tree View components.",
   "license": "SEE LICENSE IN LICENSE",
@@ -40,9 +40,9 @@
     "react-transition-group": "^4.4.5",
     "reselect": "^5.1.1",
     "use-sync-external-store": "^1.6.0",
-    "@mui/x-internals": "8.23.0",
-    "@mui/x-license": "8.23.0",
-    "@mui/x-tree-view": "8.23.0"
+    "@mui/x-internals": "8.24.0",
+    "@mui/x-tree-view": "8.24.0",
+    "@mui/x-license": "8.24.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",

package/RichTreeViewPro/RichTreeViewPro.plugins.d.ts

@@ -1,5 +0,0 @@
-import { UseTreeViewItemsParameters, UseTreeViewExpansionParameters, UseTreeViewSelectionParameters, UseTreeViewFocusParameters, ConvertPluginsIntoSignatures, TreeViewCorePluginParameters, UseTreeViewLabelParameters, UseTreeViewLazyLoadingParameters } from '@mui/x-tree-view/internals';
-import { UseTreeViewItemsReorderingParameters } from "../internals/plugins/useTreeViewItemsReordering/index.js";
-export declare const RICH_TREE_VIEW_PRO_PLUGINS: readonly [import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewItemsSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewExpansionSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewSelectionSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewFocusSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewKeyboardNavigationSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewLabelSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewLazyLoadingSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("../internals/index.js").UseTreeViewItemsReorderingSignature>];
-export type RichTreeViewProPluginSignatures = ConvertPluginsIntoSignatures<typeof RICH_TREE_VIEW_PRO_PLUGINS>;
-export interface RichTreeViewProPluginParameters<R extends {}, Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, UseTreeViewItemsParameters<R>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewLabelParameters<R>, UseTreeViewLazyLoadingParameters<R>, UseTreeViewItemsReorderingParameters {}

package/RichTreeViewPro/RichTreeViewPro.plugins.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.RICH_TREE_VIEW_PRO_PLUGINS = void 0;
-var _internals = require("@mui/x-tree-view/internals");
-var _useTreeViewItemsReordering = require("../internals/plugins/useTreeViewItemsReordering");
-var _useTreeViewLazyLoading = require("../internals/plugins/useTreeViewLazyLoading");
-const RICH_TREE_VIEW_PRO_PLUGINS = exports.RICH_TREE_VIEW_PRO_PLUGINS = [_internals.useTreeViewItems, _internals.useTreeViewExpansion, _internals.useTreeViewSelection, _internals.useTreeViewFocus, _internals.useTreeViewKeyboardNavigation, _internals.useTreeViewLabel, _useTreeViewLazyLoading.useTreeViewLazyLoading, _useTreeViewItemsReordering.useTreeViewItemsReordering];
-
-// We can't infer this type from the plugin, otherwise we would lose the generics.

package/esm/RichTreeViewPro/RichTreeViewPro.plugins.d.ts

@@ -1,5 +0,0 @@
-import { UseTreeViewItemsParameters, UseTreeViewExpansionParameters, UseTreeViewSelectionParameters, UseTreeViewFocusParameters, ConvertPluginsIntoSignatures, TreeViewCorePluginParameters, UseTreeViewLabelParameters, UseTreeViewLazyLoadingParameters } from '@mui/x-tree-view/internals';
-import { UseTreeViewItemsReorderingParameters } from "../internals/plugins/useTreeViewItemsReordering/index.js";
-export declare const RICH_TREE_VIEW_PRO_PLUGINS: readonly [import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewItemsSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewExpansionSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewSelectionSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewFocusSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewKeyboardNavigationSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewLabelSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("@mui/x-tree-view/internals").UseTreeViewLazyLoadingSignature>, import("@mui/x-tree-view/internals").TreeViewPlugin<import("../internals/index.js").UseTreeViewItemsReorderingSignature>];
-export type RichTreeViewProPluginSignatures = ConvertPluginsIntoSignatures<typeof RICH_TREE_VIEW_PRO_PLUGINS>;
-export interface RichTreeViewProPluginParameters<R extends {}, Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, UseTreeViewItemsParameters<R>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewLabelParameters<R>, UseTreeViewLazyLoadingParameters<R>, UseTreeViewItemsReorderingParameters {}

package/esm/RichTreeViewPro/RichTreeViewPro.plugins.js

@@ -1,6 +0,0 @@
-import { useTreeViewItems, useTreeViewExpansion, useTreeViewSelection, useTreeViewFocus, useTreeViewKeyboardNavigation, useTreeViewLabel } from '@mui/x-tree-view/internals';
-import { useTreeViewItemsReordering } from "../internals/plugins/useTreeViewItemsReordering/index.js";
-import { useTreeViewLazyLoading } from "../internals/plugins/useTreeViewLazyLoading/index.js";
-export const RICH_TREE_VIEW_PRO_PLUGINS = [useTreeViewItems, useTreeViewExpansion, useTreeViewSelection, useTreeViewFocus, useTreeViewKeyboardNavigation, useTreeViewLabel, useTreeViewLazyLoading, useTreeViewItemsReordering];
-
-// We can't infer this type from the plugin, otherwise we would lose the generics.

package/esm/internals/index.d.ts

@@ -1 +0,0 @@
-export type { UseTreeViewItemsReorderingSignature } from "./plugins/useTreeViewItemsReordering/index.js";

package/esm/internals/plugins/useTreeViewItemsReordering/index.d.ts

@@ -1,3 +0,0 @@
-export { useTreeViewItemsReordering } from "./useTreeViewItemsReordering.js";
-export type { UseTreeViewItemsReorderingSignature, UseTreeViewItemsReorderingParameters, UseTreeViewItemsReorderingParametersWithDefaults, TreeViewItemReorderPosition } from "./useTreeViewItemsReordering.types.js";
-export { itemsReorderingSelectors } from "./useTreeViewItemsReordering.selectors.js";

package/esm/internals/plugins/useTreeViewItemsReordering/index.js

@@ -1,2 +0,0 @@
-export { useTreeViewItemsReordering } from "./useTreeViewItemsReordering.js";
-export { itemsReorderingSelectors } from "./useTreeViewItemsReordering.selectors.js";

package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.d.ts

@@ -1,3 +0,0 @@
-import { TreeViewPlugin } from '@mui/x-tree-view/internals';
-import { UseTreeViewItemsReorderingSignature } from "./useTreeViewItemsReordering.types.js";
-export declare const useTreeViewItemsReordering: TreeViewPlugin<UseTreeViewItemsReorderingSignature>;

package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.js

@@ -1,196 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
-import { itemsSelectors, labelSelectors } from '@mui/x-tree-view/internals';
-import { chooseActionToApply, isAncestor, moveItemInTree } from "./useTreeViewItemsReordering.utils.js";
-import { useTreeViewItemsReorderingItemPlugin } from "./itemPlugin.js";
-import { itemsReorderingSelectors } from "./useTreeViewItemsReordering.selectors.js";
-export const useTreeViewItemsReordering = ({
-  params,
-  store
-}) => {
-  const getDroppingTargetValidActions = React.useCallback(itemId => {
-    const currentReorder = itemsReorderingSelectors.currentReorder(store.state);
-    if (!currentReorder) {
-      throw new Error('There is no ongoing reordering.');
-    }
-    if (itemId === currentReorder.draggedItemId) {
-      return {};
-    }
-    const canMoveItemToNewPosition = params.canMoveItemToNewPosition;
-    const targetItemMeta = itemsSelectors.itemMeta(store.state, itemId);
-    const targetItemIndex = itemsSelectors.itemIndex(store.state, targetItemMeta.id);
-    const draggedItemMeta = itemsSelectors.itemMeta(store.state, currentReorder.draggedItemId);
-    const draggedItemIndex = itemsSelectors.itemIndex(store.state, draggedItemMeta.id);
-    const isTargetLastSibling = targetItemIndex === itemsSelectors.itemOrderedChildrenIds(store.state, targetItemMeta.parentId).length - 1;
-    const oldPosition = {
-      parentId: draggedItemMeta.parentId,
-      index: draggedItemIndex
-    };
-    const checkIfPositionIsValid = positionAfterAction => {
-      let isValid;
-      // If the new position is equal to the old one, we don't want to show any dropping UI.
-      if (positionAfterAction.parentId === oldPosition.parentId && positionAfterAction.index === oldPosition.index) {
-        isValid = false;
-      } else if (canMoveItemToNewPosition) {
-        isValid = canMoveItemToNewPosition({
-          itemId: currentReorder.draggedItemId,
-          oldPosition,
-          newPosition: positionAfterAction
-        });
-      } else {
-        isValid = true;
-      }
-      return isValid;
-    };
-    const positionsAfterAction = {
-      'make-child': {
-        parentId: targetItemMeta.id,
-        index: 0
-      },
-      'reorder-above': {
-        parentId: targetItemMeta.parentId,
-        index: targetItemMeta.parentId === draggedItemMeta.parentId && targetItemIndex > draggedItemIndex ? targetItemIndex - 1 : targetItemIndex
-      },
-      'reorder-below': !targetItemMeta.expandable || isTargetLastSibling ? {
-        parentId: targetItemMeta.parentId,
-        index: targetItemMeta.parentId === draggedItemMeta.parentId && targetItemIndex > draggedItemIndex ? targetItemIndex : targetItemIndex + 1
-      } : null,
-      'move-to-parent': targetItemMeta.parentId == null ? null : {
-        parentId: targetItemMeta.parentId,
-        index: itemsSelectors.itemOrderedChildrenIds(store.state, targetItemMeta.parentId).length
-      }
-    };
-    const validActions = {};
-    Object.keys(positionsAfterAction).forEach(action => {
-      const positionAfterAction = positionsAfterAction[action];
-      if (positionAfterAction != null && checkIfPositionIsValid(positionAfterAction)) {
-        validActions[action] = positionAfterAction;
-      }
-    });
-    return validActions;
-  }, [store, params.canMoveItemToNewPosition]);
-  const startDraggingItem = React.useCallback(itemId => {
-    const isItemBeingEdited = labelSelectors.isItemBeingEdited(store.state, itemId);
-    if (isItemBeingEdited) {
-      return;
-    }
-    store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
-      currentReorder: {
-        targetItemId: itemId,
-        draggedItemId: itemId,
-        action: null,
-        newPosition: null
-      }
-    }));
-  }, [store]);
-  const cancelDraggingItem = React.useCallback(() => {
-    const currentReorder = itemsReorderingSelectors.currentReorder(store.state);
-    if (currentReorder == null) {
-      return;
-    }
-    store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
-      currentReorder: null
-    }));
-  }, [store]);
-  const completeDraggingItem = React.useCallback(itemId => {
-    const currentReorder = itemsReorderingSelectors.currentReorder(store.state);
-    if (currentReorder == null || currentReorder.draggedItemId !== itemId) {
-      return;
-    }
-    if (currentReorder.draggedItemId === currentReorder.targetItemId || currentReorder.action == null || currentReorder.newPosition == null) {
-      store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
-        currentReorder: null
-      }));
-      return;
-    }
-    const draggedItemMeta = itemsSelectors.itemMeta(store.state, currentReorder.draggedItemId);
-    const oldPosition = {
-      parentId: draggedItemMeta.parentId,
-      index: itemsSelectors.itemIndex(store.state, draggedItemMeta.id)
-    };
-    const newPosition = currentReorder.newPosition;
-    store.update({
-      itemsReordering: _extends({}, store.state.itemsReordering, {
-        currentReorder: null
-      }),
-      items: moveItemInTree({
-        itemToMoveId: itemId,
-        newPosition,
-        oldPosition,
-        prevState: store.state.items
-      })
-    });
-    const onItemPositionChange = params.onItemPositionChange;
-    onItemPositionChange?.({
-      itemId,
-      newPosition,
-      oldPosition
-    });
-  }, [store, params.onItemPositionChange]);
-  const setDragTargetItem = React.useCallback(({
-    itemId,
-    validActions,
-    targetHeight,
-    cursorY,
-    cursorX,
-    contentElement
-  }) => {
-    const prevItemReorder = store.state.itemsReordering.currentReorder;
-    if (prevItemReorder == null || isAncestor(store, itemId, prevItemReorder.draggedItemId)) {
-      return;
-    }
-    const action = chooseActionToApply({
-      itemChildrenIndentation: params.itemChildrenIndentation,
-      validActions,
-      targetHeight,
-      targetDepth: store.state.items.itemMetaLookup[itemId].depth,
-      cursorY,
-      cursorX,
-      contentElement
-    });
-    const newPosition = action == null ? null : validActions[action];
-    if (prevItemReorder.targetItemId === itemId && prevItemReorder.action === action && prevItemReorder.newPosition?.parentId === newPosition?.parentId && prevItemReorder.newPosition?.index === newPosition?.index) {
-      return;
-    }
-    store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
-      currentReorder: _extends({}, prevItemReorder, {
-        targetItemId: itemId,
-        newPosition,
-        action
-      })
-    }));
-  }, [store, params.itemChildrenIndentation]);
-  useIsoLayoutEffect(() => {
-    store.set('itemsReordering', _extends({}, store.state.itemsReordering, {
-      isItemReorderable: params.itemsReordering ? params.isItemReorderable ?? (() => true) : () => false
-    }));
-  }, [store, params.itemsReordering, params.isItemReorderable]);
-  return {
-    instance: {
-      getDroppingTargetValidActions,
-      startDraggingItem,
-      cancelDraggingItem,
-      completeDraggingItem,
-      setDragTargetItem
-    }
-  };
-};
-useTreeViewItemsReordering.itemPlugin = useTreeViewItemsReorderingItemPlugin;
-useTreeViewItemsReordering.applyDefaultValuesToParams = ({
-  params
-}) => _extends({}, params, {
-  itemsReordering: params.itemsReordering ?? false
-});
-useTreeViewItemsReordering.getInitialState = params => ({
-  itemsReordering: {
-    currentReorder: null,
-    isItemReorderable: params.itemsReordering ? params.isItemReorderable ?? (() => true) : () => false
-  }
-});
-useTreeViewItemsReordering.params = {
-  itemsReordering: true,
-  isItemReorderable: true,
-  canMoveItemToNewPosition: true,
-  onItemPositionChange: true
-};

package/esm/internals/plugins/useTreeViewItemsReordering/useTreeViewItemsReordering.selectors.d.ts

@@ -1,30 +0,0 @@
-import { TreeViewState } from '@mui/x-tree-view/internals';
-import { TreeViewItemId } from '@mui/x-tree-view/models';
-import { UseTreeViewItemsReorderingSignature } from "./useTreeViewItemsReordering.types.js";
-export declare const itemsReorderingSelectors: {
-  /**
-   * Gets the properties of the current reordering.
-   */
-  currentReorder: (state: TreeViewState<[UseTreeViewItemsReorderingSignature]>) => {
-    draggedItemId: TreeViewItemId;
-    targetItemId: TreeViewItemId;
-    newPosition: import("./useTreeViewItemsReordering.types.js").TreeViewItemReorderPosition | null;
-    action: import("@mui/x-tree-view").TreeViewItemsReorderingAction | null;
-  } | null;
-  /**
-   * Gets the properties of the dragged item.
-   */
-  draggedItemProperties: (args_0: import("@mui/x-tree-view/internals/corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("@mui/x-tree-view/internals").UseTreeViewItemsState<import("@mui/x-tree-view").TreeViewDefaultItemModelProperties> & Partial<{}>, itemId: string) => {
-    newPosition: import("./useTreeViewItemsReordering.types.js").TreeViewItemReorderPosition | null;
-    action: import("@mui/x-tree-view").TreeViewItemsReorderingAction;
-    targetDepth: number;
-  } | null;
-  /**
-   * Checks whether an item is being dragged.
-   */
-  isDragging: (state: TreeViewState<[UseTreeViewItemsReorderingSignature]>) => boolean;
-  /**
-   * Checks whether an item can be reordered.
-   */
-  canItemBeReordered: (args_0: import("@mui/x-tree-view/internals/corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewItemsReordering.types.js").UseTreeViewItemsReorderingState & Partial<{}>, itemId: string) => boolean;
-};