@mui/x-tree-view 8.0.0-alpha.12 → 8.0.0-alpha.14

package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts

@@ -0,0 +1,249 @@
+import { TreeViewAnyPluginSignature, TreeViewState } from "../../models/index.js";
+import { TreeViewRootSelector, TreeViewRootSelectorForOptionalPlugin } from "../../utils/selectors.js";
+import { UseTreeViewLazyLoadingSignature } from "./useTreeViewLazyLoading.types.js";
+export type Temp<TSignature extends TreeViewAnyPluginSignature> = <TSignatures extends [], TOptionalSignatures extends [TSignature]>(state: TreeViewState<TSignatures, TOptionalSignatures>) => TSignature['state'][keyof TSignature['state']];
+export declare const selectorDataSourceState: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState & Partial<{}> & {
+  cacheKey: import("../../models").TreeViewStateCacheKey;
+}) => {
+  loading: Record<import("../../..").TreeViewItemId, boolean>;
+  errors: Record<import("../../..").TreeViewItemId, Error | null>;
+}) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    enabled: boolean;
+    dataSource: {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+  }) => {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  };
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    enabled: boolean;
+    dataSource: {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+  }) => {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  }) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  };
+  dependencies: [TreeViewRootSelector<UseTreeViewLazyLoadingSignature>];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Check if lazy loading is enabled.
+ * @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
+ * @returns {boolean} True if lazy loading is enabled, false if it isn't.
+ */
+export declare const selectorIsLazyLoadingEnabled: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & Partial<import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState> & {
+  cacheKey: import("../../models").TreeViewStateCacheKey;
+}) => boolean) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    enabled: boolean;
+    dataSource: {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+  } | undefined) => boolean;
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    enabled: boolean;
+    dataSource: {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+  } | undefined) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => boolean;
+  dependencies: [TreeViewRootSelectorForOptionalPlugin<UseTreeViewLazyLoadingSignature>];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Get the loading state for a tree item.
+ * @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
+ * @param {TreeViewItemId} itemId The id of the item to get the loading state of.
+ * @returns {boolean} The loading state for the Tree Item.
+ */
+export declare const selectorIsItemLoading: ((state: any, itemId: string) => boolean) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  }, resultFuncArgs_1: string) => boolean;
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  }, resultFuncArgs_1: string) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => boolean;
+  dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState & Partial<{}> & {
+    cacheKey: import("../../models").TreeViewStateCacheKey;
+  }) => {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  }) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  } & {
+    resultFunc: (resultFuncArgs_0: {
+      enabled: boolean;
+      dataSource: {
+        loading: Record<import("../../..").TreeViewItemId, boolean>;
+        errors: Record<import("../../..").TreeViewItemId, Error | null>;
+      };
+    }) => {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+    memoizedResultFunc: ((resultFuncArgs_0: {
+      enabled: boolean;
+      dataSource: {
+        loading: Record<import("../../..").TreeViewItemId, boolean>;
+        errors: Record<import("../../..").TreeViewItemId, Error | null>;
+      };
+    }) => {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    }) & {
+      clearCache: () => void;
+      resultsCount: () => number;
+      resetResultsCount: () => void;
+    };
+    lastResult: () => {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+    dependencies: [TreeViewRootSelector<UseTreeViewLazyLoadingSignature>];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+  } & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+  }, (_: any, itemId: string) => string];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Get the error for a tree item.
+ * @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
+ * @param {TreeViewItemId} itemId The id of the item to get the error for.
+ * @returns {boolean} The error for the Tree Item.
+ */
+export declare const selectorGetTreeItemError: ((state: any, itemId: string) => Error | null) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  }, resultFuncArgs_1: string) => Error | null;
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  }, resultFuncArgs_1: string) => Error | null) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => Error | null;
+  dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewLazyLoading.types").UseTreeViewLazyLoadingState & Partial<{}> & {
+    cacheKey: import("../../models").TreeViewStateCacheKey;
+  }) => {
+    loading: Record<import("../../..").TreeViewItemId, boolean>;
+    errors: Record<import("../../..").TreeViewItemId, Error | null>;
+  }) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  } & {
+    resultFunc: (resultFuncArgs_0: {
+      enabled: boolean;
+      dataSource: {
+        loading: Record<import("../../..").TreeViewItemId, boolean>;
+        errors: Record<import("../../..").TreeViewItemId, Error | null>;
+      };
+    }) => {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+    memoizedResultFunc: ((resultFuncArgs_0: {
+      enabled: boolean;
+      dataSource: {
+        loading: Record<import("../../..").TreeViewItemId, boolean>;
+        errors: Record<import("../../..").TreeViewItemId, Error | null>;
+      };
+    }) => {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    }) & {
+      clearCache: () => void;
+      resultsCount: () => number;
+      resetResultsCount: () => void;
+    };
+    lastResult: () => {
+      loading: Record<import("../../..").TreeViewItemId, boolean>;
+      errors: Record<import("../../..").TreeViewItemId, Error | null>;
+    };
+    dependencies: [TreeViewRootSelector<UseTreeViewLazyLoadingSignature>];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+  } & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+  }, (_: any, itemId: string) => string];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};

package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.selectorIsLazyLoadingEnabled = exports.selectorIsItemLoading = exports.selectorGetTreeItemError = exports.selectorDataSourceState = void 0;
+var _selectors = require("../../utils/selectors");
+const selectorLazyLoading = state => state.lazyLoading;
+const selectorLazyLoadingOptional = state => state.lazyLoading;
+const selectorDataSourceState = exports.selectorDataSourceState = (0, _selectors.createSelector)([selectorLazyLoading], lazyLoading => lazyLoading.dataSource);
+
+/**
+ * Check if lazy loading is enabled.
+ * @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
+ * @returns {boolean} True if lazy loading is enabled, false if it isn't.
+ */
+const selectorIsLazyLoadingEnabled = exports.selectorIsLazyLoadingEnabled = (0, _selectors.createSelector)([selectorLazyLoadingOptional], lazyLoading => !!lazyLoading?.enabled);
+
+/**
+ * Get the loading state for a tree item.
+ * @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
+ * @param {TreeViewItemId} itemId The id of the item to get the loading state of.
+ * @returns {boolean} The loading state for the Tree Item.
+ */
+const selectorIsItemLoading = exports.selectorIsItemLoading = (0, _selectors.createSelector)([selectorDataSourceState, (_, itemId) => itemId], (dataSourceState, itemId) => dataSourceState.loading[itemId] || false);
+
+/**
+ * Get the error for a tree item.
+ * @param {TreeViewState<[UseTreeViewLazyLoadingSignature]>} state The state of the tree view.
+ * @param {TreeViewItemId} itemId The id of the item to get the error for.
+ * @returns {boolean} The error for the Tree Item.
+ */
+const selectorGetTreeItemError = exports.selectorGetTreeItemError = (0, _selectors.createSelector)([selectorDataSourceState, (_, itemId) => itemId], (dataSourceState, itemId) => dataSourceState.errors[itemId] || null);

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

@@ -0,0 +1,83 @@
+import { DefaultizedProps } from '@mui/x-internals/types';
+import { TreeViewPluginSignature } from "../../models/index.js";
+import { DataSourceCache } from "../../../utils/index.js";
+import { TreeViewItemId } from "../../../models/index.js";
+import { UseTreeViewItemsSignature } from "../useTreeViewItems/index.js";
+import { UseTreeViewExpansionSignature } from "../useTreeViewExpansion/index.js";
+import { UseTreeViewSelectionSignature } from "../useTreeViewSelection/index.js";
+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.
+   * @default (item) => number
+   */
+  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[]>;
+};
+export interface UseTreeViewLazyLoadingPublicAPI {}
+export interface UseTreeViewLazyLoadingInstance extends UseTreeViewLazyLoadingPublicAPI {
+  /**
+   * 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 children of the items.
+   */
+  fetchItems: (parentIds?: TreeViewItemId[]) => Promise<void>;
+  /**
+   * Method used for fetching and item's children.
+   * Only relevant for lazy-loaded tree views.
+   *
+   * @param {TreeViewItemId} itemId The The id of the item to fetch the children of.
+   * @returns { Promise<void>} The children of the item.
+   */
+  fetchItemChildren: (itemId: TreeViewItemId) => Promise<void>;
+  /**
+   * Set the loading state of an item.
+   * @param {TreeViewItemId} itemId The id of the item to set the loading state of.
+   * @param {boolean} isLoading True if the item is loading.
+   */
+  setDataSourceLoading: (itemId: TreeViewItemId, isLoading: boolean) => void;
+  /**
+   * Set the error state of an item.
+   * @param {TreeViewItemId} itemId The id of the item to set the error state of.
+   * @param {Error | null} error The error caught on the item.
+   */
+  setDataSourceError: (itemId: TreeViewItemId, error: Error | null) => void;
+}
+export interface UseTreeViewLazyLoadingParameters<R extends {}> {
+  dataSource?: DataSource<R>;
+  dataSourceCache?: DataSourceCache;
+}
+export type UseTreeViewLazyLoadingDefaultizedParameters<R extends {}> = DefaultizedProps<UseTreeViewLazyLoadingParameters<R>, 'dataSource'>;
+export interface UseTreeViewLazyLoadingState {
+  lazyLoading: {
+    enabled: boolean;
+    dataSource: {
+      loading: Record<TreeViewItemId, boolean>;
+      errors: Record<TreeViewItemId, Error | null>;
+    };
+  };
+}
+export type UseTreeViewLazyLoadingSignature = TreeViewPluginSignature<{
+  params: UseTreeViewLazyLoadingParameters<any>;
+  defaultizedParams: UseTreeViewLazyLoadingDefaultizedParameters<any>;
+  publicAPI: UseTreeViewLazyLoadingPublicAPI;
+  instance: UseTreeViewLazyLoadingInstance;
+  state: UseTreeViewLazyLoadingState;
+  experimentalFeatures: 'lazyLoading';
+  dependencies: [UseTreeViewItemsSignature, UseTreeViewExpansionSignature, UseTreeViewSelectionSignature];
+}>;
+export {};

package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js

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

package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js

@@ -69,9 +69,9 @@ const useTreeViewSelection = ({
     }
     models.selectedItems.setControlledValue(cleanModel);
   };
-  const selectItem = ({
-    event,
+  const setItemSelection = ({
     itemId,
+    event = null,
     keepExistingSelection = false,
     shouldBeSelected
   }) => {
@@ -185,10 +185,10 @@ const useTreeViewSelection = ({
       'aria-multiselectable': params.multiSelect
     }),
     publicAPI: {
-      selectItem
+      setItemSelection
     },
     instance: {
-      selectItem,
+      setItemSelection,
       selectAllNavigableItems,
       expandSelectionRange,
       selectRangeFromStartToItem,

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

@@ -7,17 +7,17 @@ import { TreeViewSelectionPropagation, TreeViewCancellableEventHandler } from ".
 export interface UseTreeViewSelectionPublicAPI {
   /**
    * Select or deselect an item.
-   * @param {object} params The params of the method.
-   * @param {React.SyntheticEvent} params.event The DOM event that triggered the change.
-   * @param {string} params.itemId The id of the item to select or deselect.
-   * @param {boolean} params.keepExistingSelection If `true`, the other already selected items will remain selected, otherwise, they will be deselected. This parameter is only relevant when `multiSelect` is `true`
-   * @param {boolean | undefined} params.shouldBeSelected If `true` the item will be selected. If `false` the item will be deselected. If not defined, the item's new selection status will be the opposite of its current one.
+   * @param {object} parameters The parameters of the method.
+   * @param {string} parameters.itemId The id of the item to select or deselect.
+   * @param {React.SyntheticEvent} parameters.event The DOM event that triggered the change.
+   * @param {boolean} parameters.keepExistingSelection If `true`, the other already selected items will remain selected, otherwise, they will be deselected. This parameter is only relevant when `multiSelect` is `true`
+   * @param {boolean | undefined} parameters.shouldBeSelected If `true` the item will be selected. If `false` the item will be deselected. If not defined, the item's selection status will be toggled.
    */
-  selectItem: (params: {
-    event: React.SyntheticEvent;
+  setItemSelection: (parameters: {
     itemId: string;
-    keepExistingSelection?: boolean;
+    event?: React.SyntheticEvent;
     shouldBeSelected?: boolean;
+    keepExistingSelection?: boolean;
   }) => void;
 }
 export interface UseTreeViewSelectionInstance extends UseTreeViewSelectionPublicAPI {
@@ -99,18 +99,18 @@ export interface UseTreeViewSelectionParameters<Multiple extends boolean | undef
   selectionPropagation?: TreeViewSelectionPropagation;
   /**
    * Callback fired when Tree Items are selected/deselected.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
    * @param {string[] | string} itemIds The ids of the selected items.
    * When `multiSelect` is `true`, this is an array of strings; when false (default) a string.
    */
-  onSelectedItemsChange?: (event: React.SyntheticEvent, itemIds: TreeViewSelectionValue<Multiple>) => void;
+  onSelectedItemsChange?: (event: React.SyntheticEvent | null, itemIds: TreeViewSelectionValue<Multiple>) => void;
   /**
    * Callback fired when a Tree Item is selected or deselected.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
    * @param {array} itemId The itemId of the modified item.
    * @param {array} isSelected `true` if the item has just been selected, `false` if it has just been deselected.
    */
-  onItemSelectionToggle?: (event: React.SyntheticEvent, itemId: string, isSelected: boolean) => void;
+  onItemSelectionToggle?: (event: React.SyntheticEvent | null, itemId: string, isSelected: boolean) => void;
 }
 export type UseTreeViewSelectionDefaultizedParameters<Multiple extends boolean> = DefaultizedProps<UseTreeViewSelectionParameters<Multiple>, 'disableSelection' | 'defaultSelectedItems' | 'multiSelect' | 'checkboxSelection' | 'selectionPropagation'>;
 export interface UseTreeViewSelectionState {

package/internals/utils/selectors.d.ts

@@ -1,6 +1,13 @@
 import { CreateSelectorFunction } from 'reselect';
 import { TreeViewAnyPluginSignature, TreeViewState } from "../models/index.js";
+/**
+ * Type of a selector that take the whole tree view state as input and returns a value based on a required plugin.
+ */
 export type TreeViewRootSelector<TSignature extends TreeViewAnyPluginSignature> = <TSignatures extends [TSignature]>(state: TreeViewState<TSignatures>) => TSignature['state'][keyof TSignature['state']];
+/**
+ * Type of a selector that take the whole tree view state as input and returns a value based on an optional plugin.
+ */
+export type TreeViewRootSelectorForOptionalPlugin<TSignature extends TreeViewAnyPluginSignature> = <TSignatures extends [], TOptionalSignatures extends [TSignature]>(state: TreeViewState<TSignatures, TOptionalSignatures>) => TSignature['state'][keyof TSignature['state']] | undefined;
 export type TreeViewSelector<TState, TArgs, TResult> = (state: TState, args: TArgs) => TResult;
 /**
  * Method wrapping reselect's createSelector to provide caching for tree view instances.

package/internals/utils/selectors.js

@@ -13,6 +13,15 @@ const reselectCreateSelector = (0, _reselect.createSelectorCreator)({
   }
 });
 const cache = new WeakMap();
+
+/**
+ * Type of a selector that take the whole tree view state as input and returns a value based on a required plugin.
+ */
+
+/**
+ * Type of a selector that take the whole tree view state as input and returns a value based on an optional plugin.
+ */
+
 /**
  * Method wrapping reselect's createSelector to provide caching for tree view instances.
  *

package/modern/RichTreeView/RichTreeView.js

@@ -3,6 +3,8 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
+import Alert from '@mui/material/Alert';
+import Typography from '@mui/material/Typography';
 import composeClasses from '@mui/utils/composeClasses';
 import useSlotProps from '@mui/utils/useSlotProps';
 import { warnOnce } from '@mui/x-internals/warning';
@@ -12,6 +14,8 @@ import { useTreeView } from "../internals/useTreeView/index.js";
 import { TreeViewProvider } from "../internals/TreeViewProvider/index.js";
 import { RICH_TREE_VIEW_PLUGINS } from "./RichTreeView.plugins.js";
 import { RichTreeViewItems } from "../internals/components/RichTreeViewItems.js";
+import { useSelector } from "../internals/hooks/useSelector.js";
+import { selectorGetTreeViewError, selectorIsTreeViewLoading } from "../internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useThemeProps = createUseThemeProps('MuiRichTreeView');
 const useUtilityClasses = ownerState => {
@@ -62,6 +66,8 @@ const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps
     rootRef: ref,
     props
   });
+  const isLoading = useSelector(contextValue.store, selectorIsTreeViewLoading);
+  const treeViewError = useSelector(contextValue.store, selectorGetTreeViewError);
   const {
     slots,
     slotProps
@@ -75,6 +81,17 @@ const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps
     getSlotProps: getRootProps,
     ownerState: props
   });
+  if (isLoading) {
+    return /*#__PURE__*/_jsx(Typography, {
+      children: "Loading..."
+    });
+  }
+  if (treeViewError) {
+    return /*#__PURE__*/_jsx(Alert, {
+      severity: "error",
+      children: treeViewError.message
+    });
+  }
   return /*#__PURE__*/_jsx(TreeViewProvider, {
     value: contextValue,
     children: /*#__PURE__*/_jsx(Root, _extends({}, rootProps, {
@@ -100,8 +117,10 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
       getItemDOMElement: PropTypes.func.isRequired,
       getItemOrderedChildrenIds: PropTypes.func.isRequired,
       getItemTree: PropTypes.func.isRequired,
-      selectItem: PropTypes.func.isRequired,
+      getParentId: PropTypes.func.isRequired,
+      setIsItemDisabled: PropTypes.func.isRequired,
       setItemExpansion: PropTypes.func.isRequired,
+      setItemSelection: PropTypes.func.isRequired,
       updateItemLabel: PropTypes.func.isRequired
     })
   }),
@@ -205,7 +224,7 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
   multiSelect: PropTypes.bool,
   /**
    * Callback fired when Tree Items are expanded/collapsed.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
    * @param {array} itemIds The ids of the expanded items.
    */
   onExpandedItemsChange: PropTypes.func,
@@ -217,7 +236,7 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
   onItemClick: PropTypes.func,
   /**
    * Callback fired when a Tree Item is expanded or collapsed.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent | null} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
    * @param {array} itemId The itemId of the modified item.
    * @param {array} isExpanded `true` if the item has just been expanded, `false` if it has just been collapsed.
    */
@@ -236,14 +255,14 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
   onItemLabelChange: PropTypes.func,
   /**
    * Callback fired when a Tree Item is selected or deselected.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
    * @param {array} itemId The itemId of the modified item.
    * @param {array} isSelected `true` if the item has just been selected, `false` if it has just been deselected.
    */
   onItemSelectionToggle: PropTypes.func,
   /**
    * Callback fired when Tree Items are selected/deselected.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
    * @param {string[] | string} itemIds The ids of the selected items.
    * When `multiSelect` is `true`, this is an array of strings; when false (default) a string.
    */

package/modern/SimpleTreeView/SimpleTreeView.js

@@ -99,8 +99,10 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
       getItemDOMElement: PropTypes.func.isRequired,
       getItemOrderedChildrenIds: PropTypes.func.isRequired,
       getItemTree: PropTypes.func.isRequired,
-      selectItem: PropTypes.func.isRequired,
-      setItemExpansion: PropTypes.func.isRequired
+      getParentId: PropTypes.func.isRequired,
+      setIsItemDisabled: PropTypes.func.isRequired,
+      setItemExpansion: PropTypes.func.isRequired,
+      setItemSelection: PropTypes.func.isRequired
     })
   }),
   /**
@@ -173,7 +175,7 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
   multiSelect: PropTypes.bool,
   /**
    * Callback fired when Tree Items are expanded/collapsed.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
    * @param {array} itemIds The ids of the expanded items.
    */
   onExpandedItemsChange: PropTypes.func,
@@ -185,7 +187,7 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
   onItemClick: PropTypes.func,
   /**
    * Callback fired when a Tree Item is expanded or collapsed.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent | null} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
    * @param {array} itemId The itemId of the modified item.
    * @param {array} isExpanded `true` if the item has just been expanded, `false` if it has just been collapsed.
    */
@@ -198,14 +200,14 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
   onItemFocus: PropTypes.func,
   /**
    * Callback fired when a Tree Item is selected or deselected.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
    * @param {array} itemId The itemId of the modified item.
    * @param {array} isSelected `true` if the item has just been selected, `false` if it has just been deselected.
    */
   onItemSelectionToggle: PropTypes.func,
   /**
    * Callback fired when Tree Items are selected/deselected.
-   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
    * @param {string[] | string} itemIds The ids of the selected items.
    * When `multiSelect` is `true`, this is an array of strings; when false (default) a string.
    */

package/modern/TreeItem/TreeItem.d.ts

@@ -11,6 +11,8 @@ export declare const TreeItemLabel: import("@emotion/styled").StyledComponent<im
 }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const TreeItemIconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const TreeItemGroupTransition: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").CollapseProps, keyof import("@mui/material").CollapseProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const TreeItemErrorContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const TreeItemLoadingContainer: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").CircularProgressProps, keyof import("@mui/material").CircularProgressProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const TreeItemCheckbox: import("@emotion/styled").StyledComponent<Pick<Omit<CheckboxProps & {
   visible?: boolean;
 }, "ref"> & React.RefAttributes<HTMLButtonElement>, "hidden" | "visible" | "color" | "content" | "size" | "style" | "icon" | "translate" | "disabled" | "form" | "slot" | "title" | "action" | "checked" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "readOnly" | "required" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "component" | "sx" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "checkedIcon" | "inputProps" | "inputRef" | "indeterminate" | "indeterminateIcon" | keyof React.RefAttributes<HTMLButtonElement>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;