@mui/x-tree-view 8.0.0-alpha.0 → 8.0.0-alpha.2

package/internals/corePlugins/useTreeViewId/useTreeViewId.js

@@ -1,14 +1,15 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
+import { useSelector } from "../../hooks/useSelector.js";
+import { selectorTreeViewId } from "./useTreeViewId.selectors.js";
 import { createTreeViewDefaultId } from "./useTreeViewId.utils.js";
 export const useTreeViewId = ({
   params,
-  state,
-  setState
+  store
 }) => {
   React.useEffect(() => {
-    setState(prevState => {
-      if (prevState.id.treeId === params.id && prevState.id.treeId !== undefined) {
+    store.update(prevState => {
+      if (params.id === prevState.id.providedTreeId && prevState.id.treeId !== undefined) {
         return prevState;
       }
       return _extends({}, prevState, {
@@ -17,15 +18,12 @@ export const useTreeViewId = ({
         })
       });
     });
-  }, [setState, params.id]);
-  const treeId = params.id ?? state.id.treeId;
+  }, [store, params.id]);
+  const treeId = useSelector(store, selectorTreeViewId);
   return {
     getRootProps: () => ({
       id: treeId
-    }),
-    contextValue: {
-      treeId
-    }
+    })
   };
 };
 useTreeViewId.params = {
@@ -35,6 +33,7 @@ useTreeViewId.getInitialState = ({
   id
 }) => ({
   id: {
-    treeId: id ?? undefined
+    treeId: undefined,
+    providedTreeId: id
   }
 });

package/internals/corePlugins/useTreeViewId/useTreeViewId.selectors.d.ts

@@ -0,0 +1,36 @@
+import { TreeViewRootSelector } from '../../utils/selectors';
+import { UseTreeViewIdSignature } from './useTreeViewId.types';
+/**
+ * Get the id attribute of the tree view.
+ * @param {TreeViewState<[UseTreeViewIdSignature]>} state The state of the tree view.
+ * @returns {string} The id attribute of the tree view.
+ */
+export declare const selectorTreeViewId: ((state: import("./useTreeViewId.types").UseTreeViewIdState & Partial<{}> & {
+    cacheKey: import("../../models").TreeViewStateCacheKey;
+}) => string | undefined) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+} & {
+    resultFunc: (resultFuncArgs_0: {
+        treeId: string | undefined;
+        providedTreeId: string | undefined;
+    }) => string | undefined;
+    memoizedResultFunc: ((resultFuncArgs_0: {
+        treeId: string | undefined;
+        providedTreeId: string | undefined;
+    }) => string | undefined) & {
+        clearCache: () => void;
+        resultsCount: () => number;
+        resetResultsCount: () => void;
+    };
+    lastResult: () => string | undefined;
+    dependencies: [TreeViewRootSelector<UseTreeViewIdSignature>];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+} & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+};

package/internals/corePlugins/useTreeViewId/useTreeViewId.selectors.js

@@ -0,0 +1,9 @@
+import { createSelector } from "../../utils/selectors.js";
+const selectorTreeViewIdState = state => state.id;
+
+/**
+ * Get the id attribute of the tree view.
+ * @param {TreeViewState<[UseTreeViewIdSignature]>} state The state of the tree view.
+ * @returns {string} The id attribute of the tree view.
+ */
+export const selectorTreeViewId = createSelector(selectorTreeViewIdState, idState => idState.treeId);

package/internals/corePlugins/useTreeViewId/useTreeViewId.types.d.ts

@@ -10,15 +10,11 @@ export type UseTreeViewIdDefaultizedParameters = UseTreeViewIdParameters;
 export interface UseTreeViewIdState {
     id: {
         treeId: string | undefined;
+        providedTreeId: string | undefined;
     };
 }
-interface UseTreeViewIdContextValue {
-    treeId: string | undefined;
-}
 export type UseTreeViewIdSignature = TreeViewPluginSignature<{
     params: UseTreeViewIdParameters;
     defaultizedParams: UseTreeViewIdDefaultizedParameters;
     state: UseTreeViewIdState;
-    contextValue: UseTreeViewIdContextValue;
 }>;
-export {};

package/internals/hooks/useSelector.d.ts

@@ -0,0 +1,4 @@
+import { TreeViewAnyPluginSignature, TreeViewState } from '../models';
+import { TreeViewStore } from '../utils/TreeViewStore';
+import { TreeViewSelector } from '../utils/selectors';
+export declare const useSelector: <TSignatures extends readonly TreeViewAnyPluginSignature[], TArgs, TValue>(store: TreeViewStore<TSignatures>, selector: TreeViewSelector<TreeViewState<TSignatures>, TArgs, TValue>, args?: TArgs, equals?: (a: TValue, b: TValue) => boolean) => TValue;

package/internals/hooks/useSelector.js

@@ -0,0 +1,6 @@
+import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector';
+const defaultCompare = Object.is;
+export const useSelector = (store, selector, args = undefined, equals = defaultCompare) => {
+  const selectorWithArgs = state => selector(state, args);
+  return useSyncExternalStoreWithSelector(store.subscribe, store.getSnapshot, store.getSnapshot, selectorWithArgs, equals);
+};

package/internals/index.d.ts

@@ -1,8 +1,10 @@
 export { useTreeView } from './useTreeView';
 export { TreeViewProvider, useTreeViewContext } from './TreeViewProvider';
 export { RichTreeViewItems } from './components/RichTreeViewItems';
+export type { RichTreeViewItemsSlots, RichTreeViewItemsSlotProps, } from './components/RichTreeViewItems';
 export { unstable_resetCleanupTracking } from './hooks/useInstanceEventHandler';
-export type { TreeViewPlugin, TreeViewPluginSignature, ConvertPluginsIntoSignatures, MergeSignaturesProperty, TreeViewPublicAPI, TreeViewExperimentalFeatures, TreeViewItemMeta, TreeViewInstance, TreeViewItemPlugin, } from './models';
+export { useSelector } from './hooks/useSelector';
+export type { TreeViewPlugin, TreeViewPluginSignature, ConvertPluginsIntoSignatures, MergeSignaturesProperty, TreeViewPublicAPI, TreeViewState, TreeViewExperimentalFeatures, TreeViewItemMeta, TreeViewInstance, TreeViewItemPlugin, TreeViewUsedStore, } from './models';
 export type { TreeViewCorePluginParameters } from './corePlugins';
 export { useTreeViewExpansion } from './plugins/useTreeViewExpansion';
 export type { UseTreeViewExpansionSignature, UseTreeViewExpansionParameters, } from './plugins/useTreeViewExpansion';
@@ -15,9 +17,12 @@ export type { UseTreeViewKeyboardNavigationSignature } from './plugins/useTreeVi
 export { useTreeViewIcons } from './plugins/useTreeViewIcons';
 export type { UseTreeViewIconsSignature, UseTreeViewIconsParameters, } from './plugins/useTreeViewIcons';
 export { useTreeViewItems, buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID, } from './plugins/useTreeViewItems';
+export { selectorItemMetaLookup, selectorItemMeta, selectorItemIndex, selectorItemOrderedChildrenIds, } from './plugins/useTreeViewItems/useTreeViewItems.selectors';
 export type { UseTreeViewItemsSignature, UseTreeViewItemsParameters, UseTreeViewItemsState, } from './plugins/useTreeViewItems';
 export { useTreeViewLabel } from './plugins/useTreeViewLabel';
 export type { UseTreeViewLabelSignature, UseTreeViewLabelParameters, } from './plugins/useTreeViewLabel';
 export { useTreeViewJSXItems } from './plugins/useTreeViewJSXItems';
 export type { UseTreeViewJSXItemsSignature, UseTreeViewJSXItemsParameters, } from './plugins/useTreeViewJSXItems';
+export { createSelector } from './utils/selectors';
 export { isTargetInDescendants } from './utils/tree';
+export { TreeViewStore } from './utils/TreeViewStore';

package/internals/index.js

@@ -2,6 +2,7 @@ export { useTreeView } from "./useTreeView/index.js";
 export { TreeViewProvider, useTreeViewContext } from "./TreeViewProvider/index.js";
 export { RichTreeViewItems } from "./components/RichTreeViewItems.js";
 export { unstable_resetCleanupTracking } from "./hooks/useInstanceEventHandler.js";
+export { useSelector } from "./hooks/useSelector.js";
 
 // Core plugins
 
@@ -12,6 +13,9 @@ export { useTreeViewFocus } from "./plugins/useTreeViewFocus/index.js";
 export { useTreeViewKeyboardNavigation } from "./plugins/useTreeViewKeyboardNavigation/index.js";
 export { useTreeViewIcons } from "./plugins/useTreeViewIcons/index.js";
 export { useTreeViewItems, buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "./plugins/useTreeViewItems/index.js";
+export { selectorItemMetaLookup, selectorItemMeta, selectorItemIndex, selectorItemOrderedChildrenIds } from "./plugins/useTreeViewItems/useTreeViewItems.selectors.js";
 export { useTreeViewLabel } from "./plugins/useTreeViewLabel/index.js";
 export { useTreeViewJSXItems } from "./plugins/useTreeViewJSXItems/index.js";
-export { isTargetInDescendants } from "./utils/tree.js";
+export { createSelector } from "./utils/selectors.js";
+export { isTargetInDescendants } from "./utils/tree.js";
+export { TreeViewStore } from "./utils/TreeViewStore.js";

package/internals/models/itemPlugin.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { EventHandlers } from '@mui/utils';
-import type { TreeItemProps } from '../../TreeItem';
+import { EventHandlers } from '@mui/utils/types';
 import type { UseTreeItemContentSlotOwnProps, UseTreeItemDragAndDropOverlaySlotOwnProps, UseTreeItemLabelInputSlotOwnProps, UseTreeItemRootSlotOwnProps, UseTreeItemCheckboxSlotOwnProps, UseTreeItemStatus } from '../../useTreeItem';
 import type { UseTreeItemInteractions } from '../../hooks/useTreeItemUtils/useTreeItemUtils';
+import type { TreeItemProps } from '../../TreeItem/TreeItem.types';
 export interface TreeViewItemPluginSlotPropsEnhancerParams {
     rootRefObject: React.MutableRefObject<HTMLLIElement | null>;
     contentRefObject: React.MutableRefObject<HTMLDivElement | null>;
@@ -36,8 +36,8 @@ export interface TreeViewItemPluginResponse {
      */
     propsEnhancers?: TreeViewItemPluginSlotPropsEnhancers;
 }
-export interface TreeViewItemPluginOptions<TProps extends {}> extends Omit<TreeViewItemPluginResponse, 'propsEnhancers'> {
-    props: TProps;
+export interface TreeViewItemPluginOptions extends Omit<TreeViewItemPluginResponse, 'propsEnhancers'> {
+    props: TreeItemProps;
 }
-export type TreeViewItemPlugin = (options: TreeViewItemPluginOptions<TreeItemProps>) => void | TreeViewItemPluginResponse;
+export type TreeViewItemPlugin = (options: TreeViewItemPluginOptions) => void | TreeViewItemPluginResponse;
 export {};

package/internals/models/plugin.d.ts

@@ -1,20 +1,20 @@
 import * as React from 'react';
-import { EventHandlers } from '@mui/utils';
+import { EventHandlers } from '@mui/utils/types';
 import { TreeViewExperimentalFeatures, TreeViewInstance, TreeViewModel } from './treeView';
 import type { MergeSignaturesProperty, OptionalIfEmpty } from './helpers';
 import { TreeViewEventLookupElement } from './events';
 import type { TreeViewCorePluginSignatures } from '../corePlugins';
 import { TreeViewItemPlugin } from './itemPlugin';
 import { TreeViewItemId } from '../../models';
+import { TreeViewStore } from '../utils/TreeViewStore';
 export interface TreeViewPluginOptions<TSignature extends TreeViewAnyPluginSignature> {
     instance: TreeViewUsedInstance<TSignature>;
     params: TreeViewUsedDefaultizedParams<TSignature>;
-    state: TreeViewUsedState<TSignature>;
     slots: TSignature['slots'];
     slotProps: TSignature['slotProps'];
     experimentalFeatures: TreeViewUsedExperimentalFeatures<TSignature>;
     models: TreeViewUsedModels<TSignature>;
-    setState: React.Dispatch<React.SetStateAction<TreeViewUsedState<TSignature>>>;
+    store: TreeViewUsedStore<TSignature>;
     rootRef: React.RefObject<HTMLUListElement>;
     plugins: TreeViewPlugin<TreeViewAnyPluginSignature>[];
 }
@@ -35,6 +35,7 @@ export type TreeViewPluginSignature<T extends {
         [key in keyof T['events']]: TreeViewEventLookupElement;
     };
     state?: {};
+    cache?: {};
     contextValue?: {};
     slots?: {
         [key in keyof T['slots']]: React.ElementType;
@@ -65,6 +66,9 @@ export type TreeViewPluginSignature<T extends {
     state: T extends {
         state: {};
     } ? T['state'] : {};
+    cache: T extends {
+        cache: {};
+    } ? T['cache'] : {};
     contextValue: T extends {
         contextValue: {};
     } ? T['contextValue'] : {};
@@ -93,6 +97,7 @@ export type TreeViewPluginSignature<T extends {
     } ? T['optionalDependencies'] : [];
 };
 export type TreeViewAnyPluginSignature = {
+    cache: any;
     state: any;
     instance: any;
     params: any;
@@ -120,8 +125,14 @@ export type TreeViewUsedInstance<TSignature extends TreeViewAnyPluginSignature>
      */
     $$signature: TSignature;
 };
-type TreeViewUsedState<TSignature extends TreeViewAnyPluginSignature> = PluginPropertyWithDependencies<TSignature, 'state'>;
-type TreeViewUsedExperimentalFeatures<TSignature extends TreeViewAnyPluginSignature> = TreeViewExperimentalFeatures<[TSignature, ...TSignature['dependencies']]>;
+export type TreeViewUsedStore<TSignature extends TreeViewAnyPluginSignature> = TreeViewStore<[
+    TSignature,
+    ...TSignature['dependencies']
+]>;
+type TreeViewUsedExperimentalFeatures<TSignature extends TreeViewAnyPluginSignature> = TreeViewExperimentalFeatures<[
+    TSignature,
+    ...TSignature['dependencies']
+], TSignature['optionalDependencies']>;
 type RemoveSetValue<Models extends Record<string, TreeViewModel<any>>> = {
     [K in keyof Models]: Omit<Models[K], 'setValue'>;
 };
@@ -131,10 +142,10 @@ export type TreeItemWrapper<TSignatures extends readonly TreeViewAnyPluginSignat
     itemId: TreeViewItemId;
     children: React.ReactNode;
     instance: TreeViewInstance<TSignatures>;
+    idAttribute: string;
 }) => React.ReactNode;
-export type TreeRootWrapper<TSignatures extends readonly TreeViewAnyPluginSignature[]> = (params: {
+export type TreeRootWrapper = (params: {
     children: React.ReactNode;
-    instance: TreeViewInstance<TSignatures>;
 }) => React.ReactNode;
 export type TreeViewPlugin<TSignature extends TreeViewAnyPluginSignature> = {
     (options: TreeViewPluginOptions<TSignature>): TreeViewResponse<TSignature>;
@@ -143,6 +154,7 @@ export type TreeViewPlugin<TSignature extends TreeViewAnyPluginSignature> = {
         experimentalFeatures: TreeViewUsedExperimentalFeatures<TSignature>;
     }) => TSignature['defaultizedParams'];
     getInitialState?: (params: TreeViewUsedDefaultizedParams<TSignature>) => TSignature['state'];
+    getInitialCache?: () => TSignature['cache'];
     models?: TreeViewModelsInitializer<TSignature>;
     params: Record<keyof TSignature['params'], true>;
     itemPlugin?: TreeViewItemPlugin;
@@ -157,6 +169,6 @@ export type TreeViewPlugin<TSignature extends TreeViewAnyPluginSignature> = {
      * @param {{ children: React.ReactNode; }} params The params of the root.
      * @returns {React.ReactNode} The wrapped root.
      */
-    wrapRoot?: TreeRootWrapper<[TSignature, ...TSignature['dependencies']]>;
+    wrapRoot?: TreeRootWrapper;
 };
 export {};

package/internals/models/treeView.d.ts

@@ -24,3 +24,9 @@ export interface TreeViewModel<TValue> {
 export type TreeViewInstance<TSignatures extends readonly TreeViewAnyPluginSignature[], TOptionalSignatures extends readonly TreeViewAnyPluginSignature[] = []> = MergeSignaturesProperty<[...TreeViewCorePluginSignatures, ...TSignatures], 'instance'> & Partial<MergeSignaturesProperty<TOptionalSignatures, 'instance'>>;
 export type TreeViewPublicAPI<TSignatures extends readonly TreeViewAnyPluginSignature[], TOptionalSignatures extends readonly TreeViewAnyPluginSignature[] = []> = MergeSignaturesProperty<[...TreeViewCorePluginSignatures, ...TSignatures], 'publicAPI'> & Partial<MergeSignaturesProperty<TOptionalSignatures, 'instance'>>;
 export type TreeViewExperimentalFeatures<TSignatures extends readonly TreeViewAnyPluginSignature[], TOptionalSignatures extends readonly TreeViewAnyPluginSignature[] = []> = MergeSignaturesProperty<[...TSignatures, ...TOptionalSignatures], 'experimentalFeatures'>;
+export type TreeViewStateCacheKey = {
+    id: number;
+};
+export type TreeViewState<TSignatures extends readonly TreeViewAnyPluginSignature[], TOptionalSignatures extends readonly TreeViewAnyPluginSignature[] = []> = MergeSignaturesProperty<[...TreeViewCorePluginSignatures, ...TSignatures], 'state'> & Partial<MergeSignaturesProperty<TOptionalSignatures, 'state'>> & {
+    cacheKey: TreeViewStateCacheKey;
+};

package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js

@@ -1,30 +1,35 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
+import { selectorIsItemExpandable, selectorIsItemExpanded } from "./useTreeViewExpansion.selectors.js";
+import { createExpandedItemsMap } from "./useTreeViewExpansion.utils.js";
+import { selectorItemMeta, selectorItemOrderedChildrenIds } from "../useTreeViewItems/useTreeViewItems.selectors.js";
 export const useTreeViewExpansion = ({
   instance,
+  store,
   params,
-  models
+  models,
+  experimentalFeatures
 }) => {
-  const expandedItemsMap = React.useMemo(() => {
-    const temp = new Map();
-    models.expandedItems.value.forEach(id => {
-      temp.set(id, true);
-    });
-    return temp;
-  }, [models.expandedItems.value]);
+  const isTreeViewEditable = Boolean(params.isItemEditable) && !!experimentalFeatures.labelEditing;
+  useEnhancedEffect(() => {
+    store.update(prevState => _extends({}, prevState, {
+      expansion: {
+        expandedItemsMap: createExpandedItemsMap(models.expandedItems.value)
+      }
+    }));
+  }, [store, models.expandedItems.value]);
   const setExpandedItems = (event, value) => {
     params.onExpandedItemsChange?.(event, value);
     models.expandedItems.setControlledValue(value);
   };
-  const isItemExpanded = React.useCallback(itemId => expandedItemsMap.has(itemId), [expandedItemsMap]);
-  const isItemExpandable = React.useCallback(itemId => !!instance.getItemMeta(itemId)?.expandable, [instance]);
   const toggleItemExpansion = useEventCallback((event, itemId) => {
-    const isExpandedBefore = instance.isItemExpanded(itemId);
+    const isExpandedBefore = selectorIsItemExpanded(store.value, itemId);
     instance.setItemExpansion(event, itemId, !isExpandedBefore);
   });
   const setItemExpansion = useEventCallback((event, itemId, isExpanded) => {
-    const isExpandedBefore = instance.isItemExpanded(itemId);
+    const isExpandedBefore = selectorIsItemExpanded(store.value, itemId);
     if (isExpandedBefore === isExpanded) {
       return;
     }
@@ -40,9 +45,12 @@ export const useTreeViewExpansion = ({
     setExpandedItems(event, newExpanded);
   });
   const expandAllSiblings = (event, itemId) => {
-    const itemMeta = instance.getItemMeta(itemId);
-    const siblings = instance.getItemOrderedChildrenIds(itemMeta.parentId);
-    const diff = siblings.filter(child => instance.isItemExpandable(child) && !instance.isItemExpanded(child));
+    const itemMeta = selectorItemMeta(store.value, itemId);
+    if (itemMeta == null) {
+      return;
+    }
+    const siblings = selectorItemOrderedChildrenIds(store.value, itemMeta.parentId);
+    const diff = siblings.filter(child => selectorIsItemExpandable(store.value, child) && !selectorIsItemExpanded(store.value, child));
     const newExpanded = models.expandedItems.value.concat(diff);
     if (diff.length > 0) {
       if (params.onItemExpansionToggle) {
@@ -57,27 +65,26 @@ export const useTreeViewExpansion = ({
     if (params.expansionTrigger) {
       return params.expansionTrigger;
     }
-    if (instance.isTreeViewEditable) {
+    if (isTreeViewEditable) {
       return 'iconContainer';
     }
     return 'content';
-  }, [params.expansionTrigger, instance.isTreeViewEditable]);
+  }, [params.expansionTrigger, isTreeViewEditable]);
+  const pluginContextValue = React.useMemo(() => ({
+    expansion: {
+      expansionTrigger
+    }
+  }), [expansionTrigger]);
   return {
     publicAPI: {
       setItemExpansion
     },
     instance: {
-      isItemExpanded,
-      isItemExpandable,
       setItemExpansion,
       toggleItemExpansion,
       expandAllSiblings
     },
-    contextValue: {
-      expansion: {
-        expansionTrigger
-      }
-    }
+    contextValue: pluginContextValue
   };
 };
 useTreeViewExpansion.models = {
@@ -91,6 +98,11 @@ useTreeViewExpansion.getDefaultizedParams = ({
 }) => _extends({}, params, {
   defaultExpandedItems: params.defaultExpandedItems ?? DEFAULT_EXPANDED_ITEMS
 });
+useTreeViewExpansion.getInitialState = params => ({
+  expansion: {
+    expandedItemsMap: createExpandedItemsMap(params.expandedItems === undefined ? params.defaultExpandedItems : params.expandedItems)
+  }
+});
 useTreeViewExpansion.params = {
   expandedItems: true,
   defaultExpandedItems: true,

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

@@ -0,0 +1,124 @@
+import { TreeViewRootSelector } from '../../utils/selectors';
+import { UseTreeViewExpansionSignature } from './useTreeViewExpansion.types';
+/**
+ * Check if an item is expanded.
+ * @param {TreeViewState<[UseTreeViewExpansionSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expanded, `false` otherwise.
+ */
+export declare const selectorIsItemExpanded: ((state: any, itemId: string) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+} & {
+    resultFunc: (resultFuncArgs_0: {
+        expandedItemsMap: Map<string, true>;
+    }, resultFuncArgs_1: string) => boolean;
+    memoizedResultFunc: ((resultFuncArgs_0: {
+        expandedItemsMap: Map<string, true>;
+    }, resultFuncArgs_1: string) => boolean) & {
+        clearCache: () => void;
+        resultsCount: () => number;
+        resetResultsCount: () => void;
+    };
+    lastResult: () => boolean;
+    dependencies: [TreeViewRootSelector<UseTreeViewExpansionSignature>, (_: any, itemId: string) => string];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+} & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Check if an item is expandable.
+ * @param {TreeViewState<[UseTreeViewItemsSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expandable, `false` otherwise.
+ */
+export declare const selectorIsItemExpandable: ((state: any, itemId: string | null) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+} & {
+    resultFunc: (resultFuncArgs_0: import("../..").TreeViewItemMeta | null) => boolean;
+    memoizedResultFunc: ((resultFuncArgs_0: import("../..").TreeViewItemMeta | null) => boolean) & {
+        clearCache: () => void;
+        resultsCount: () => number;
+        resetResultsCount: () => void;
+    };
+    lastResult: () => boolean;
+    dependencies: [((state: any, itemId: string | null) => import("../..").TreeViewItemMeta | null) & {
+        clearCache: () => void;
+        resultsCount: () => number;
+        resetResultsCount: () => void;
+    } & {
+        resultFunc: (resultFuncArgs_0: import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup, resultFuncArgs_1: string | null) => import("../..").TreeViewItemMeta | null;
+        memoizedResultFunc: ((resultFuncArgs_0: import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup, resultFuncArgs_1: string | null) => import("../..").TreeViewItemMeta | null) & {
+            clearCache: () => void;
+            resultsCount: () => number;
+            resetResultsCount: () => void;
+        };
+        lastResult: () => import("../..").TreeViewItemMeta | null;
+        dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("../useTreeViewItems").UseTreeViewItemsState<import("../../..").TreeViewDefaultItemModelProperties> & Partial<{}> & {
+            cacheKey: import("../../models").TreeViewStateCacheKey;
+        }) => import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup) & {
+            clearCache: () => void;
+            resultsCount: () => number;
+            resetResultsCount: () => void;
+        } & {
+            resultFunc: (resultFuncArgs_0: {
+                disabledItemsFocusable: boolean;
+                itemModelLookup: import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemModelLookup<import("../../..").TreeViewDefaultItemModelProperties>;
+                itemMetaLookup: import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup;
+                itemOrderedChildrenIdsLookup: {
+                    [parentItemId: string]: string[];
+                };
+                itemChildrenIndexesLookup: {
+                    [parentItemId: string]: {
+                        [itemId: string]: number;
+                    };
+                };
+            }) => import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup;
+            memoizedResultFunc: ((resultFuncArgs_0: {
+                disabledItemsFocusable: boolean;
+                itemModelLookup: import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemModelLookup<import("../../..").TreeViewDefaultItemModelProperties>;
+                itemMetaLookup: import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup;
+                itemOrderedChildrenIdsLookup: {
+                    [parentItemId: string]: string[];
+                };
+                itemChildrenIndexesLookup: {
+                    [parentItemId: string]: {
+                        [itemId: string]: number;
+                    };
+                };
+            }) => import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup) & {
+                clearCache: () => void;
+                resultsCount: () => number;
+                resetResultsCount: () => void;
+            };
+            lastResult: () => import("../useTreeViewItems/useTreeViewItems.types").TreeViewItemMetaLookup;
+            dependencies: [TreeViewRootSelector<import("../useTreeViewItems").UseTreeViewItemsSignature>];
+            recomputations: () => number;
+            resetRecomputations: () => void;
+            dependencyRecomputations: () => number;
+            resetDependencyRecomputations: () => void;
+        } & {
+            argsMemoize: typeof import("reselect").weakMapMemoize;
+            memoize: typeof import("reselect").weakMapMemoize;
+        }, (_: any, itemId: string | null) => string | null];
+        recomputations: () => number;
+        resetRecomputations: () => void;
+        dependencyRecomputations: () => number;
+        resetDependencyRecomputations: () => void;
+    } & {
+        argsMemoize: typeof import("reselect").weakMapMemoize;
+        memoize: typeof import("reselect").weakMapMemoize;
+    }];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+} & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+};

package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.js

@@ -0,0 +1,17 @@
+import { createSelector } from "../../utils/selectors.js";
+import { selectorItemMeta } from "../useTreeViewItems/useTreeViewItems.selectors.js";
+const selectorExpansion = state => state.expansion;
+
+/**
+ * Check if an item is expanded.
+ * @param {TreeViewState<[UseTreeViewExpansionSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expanded, `false` otherwise.
+ */
+export const selectorIsItemExpanded = createSelector([selectorExpansion, (_, itemId) => itemId], (expansionState, itemId) => expansionState.expandedItemsMap.has(itemId));
+
+/**
+ * Check if an item is expandable.
+ * @param {TreeViewState<[UseTreeViewItemsSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expandable, `false` otherwise.
+ */
+export const selectorIsItemExpandable = createSelector([selectorItemMeta], itemMeta => itemMeta?.expandable ?? false);

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

@@ -14,20 +14,6 @@ export interface UseTreeViewExpansionPublicAPI {
     setItemExpansion: (event: React.SyntheticEvent, itemId: string, isExpanded: boolean) => void;
 }
 export interface UseTreeViewExpansionInstance extends UseTreeViewExpansionPublicAPI {
-    /**
-     * Check if an item is expanded.
-     * @param {TreeViewItemId} itemId The id of the item to check.
-     * @returns {boolean} `true` if the item is expanded, `false` otherwise.
-     */
-    isItemExpanded: (itemId: TreeViewItemId) => boolean;
-    /**
-     * Check if an item is expandable.
-     * Currently, an item is expandable if it has children.
-     * In the future, the user should be able to flag an item as expandable even if it has no loaded children to support children lazy loading.
-     * @param {TreeViewItemId} itemId The id of the item to check.
-     * @returns {boolean} `true` if the item can be expanded, `false` otherwise.
-     */
-    isItemExpandable: (itemId: TreeViewItemId) => boolean;
     /**
      * Toggle the current expansion of an item.
      * If it is expanded, it will be collapsed, and vice versa.
@@ -74,6 +60,11 @@ export interface UseTreeViewExpansionParameters {
     expansionTrigger?: 'content' | 'iconContainer';
 }
 export type UseTreeViewExpansionDefaultizedParameters = DefaultizedProps<UseTreeViewExpansionParameters, 'defaultExpandedItems'>;
+export interface UseTreeViewExpansionState {
+    expansion: {
+        expandedItemsMap: Map<string, true>;
+    };
+}
 interface UseTreeViewExpansionContextValue {
     expansion: Pick<UseTreeViewExpansionParameters, 'expansionTrigger'>;
 }
@@ -83,6 +74,7 @@ export type UseTreeViewExpansionSignature = TreeViewPluginSignature<{
     instance: UseTreeViewExpansionInstance;
     publicAPI: UseTreeViewExpansionPublicAPI;
     modelNames: 'expandedItems';
+    state: UseTreeViewExpansionState;
     contextValue: UseTreeViewExpansionContextValue;
     dependencies: [UseTreeViewItemsSignature];
     optionalDependencies: [UseTreeViewLabelSignature];

package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.utils.d.ts

@@ -0,0 +1 @@
+export declare const createExpandedItemsMap: (expandedItems: string[]) => Map<string, true>;

package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.utils.js

@@ -0,0 +1,7 @@
+export const createExpandedItemsMap = expandedItems => {
+  const expandedItemsMap = new Map();
+  expandedItems.forEach(id => {
+    expandedItemsMap.set(id, true);
+  });
+  return expandedItemsMap;
+};