@mui/x-tree-view 8.22.0 → 8.24.0

package/internals/TreeViewProvider/useTreeViewBuildContext.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { TreeViewContextValue, TreeViewItemPluginsRunner, TreeViewStoreInContext } from "./TreeViewProvider.types.js";
+import { TreeViewAnyStore, TreeViewPublicAPI, TreeItemWrapper } from "../models/index.js";
+export declare const useTreeViewBuildContext: <TStore extends TreeViewAnyStore>(parameters: UseTreeViewBuildContextParameters<TStore>) => TreeViewContextValue<TStore>;
+export interface UseTreeViewBuildContextParameters<TStore extends TreeViewAnyStore> {
+  store: TStore;
+  rootRef: React.RefObject<HTMLUListElement | null>;
+  apiRef: React.RefObject<Partial<TreeViewPublicAPI<TStore>> | undefined> | undefined;
+}
+export interface UseTreeViewBuildContextReturnValue<TStore extends TreeViewAnyStore> {
+  publicAPI: TreeViewPublicAPI<TStore>;
+  store: TreeViewStoreInContext<TStore>;
+  rootRef: React.RefObject<HTMLUListElement | null>;
+  wrapItem: TreeItemWrapper<TStore>;
+  runItemPlugins: TreeViewItemPluginsRunner;
+}

package/internals/{useTreeView → TreeViewProvider}/useTreeViewBuildContext.js

@@ -6,24 +6,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useTreeViewBuildContext = void 0;
 var React = _interopRequireWildcard(require("react"));
+var _useRefWithInit = require("@base-ui/utils/useRefWithInit");
 const useTreeViewBuildContext = parameters => {
   const {
-    plugins,
-    instance,
-    publicAPI,
     store,
+    apiRef,
     rootRef
   } = parameters;
+  const publicAPI = (0, _useRefWithInit.useRefWithInit)(() => store.buildPublicAPI()).current;
+  initializeInputApiRef(publicAPI, apiRef);
   const runItemPlugins = React.useCallback(itemPluginProps => {
     let finalRootRef = null;
     let finalContentRef = null;
     const pluginPropEnhancers = [];
     const pluginPropEnhancersNames = {};
-    plugins.forEach(plugin => {
-      if (!plugin.itemPlugin) {
-        return;
-      }
-      const itemPluginResponse = plugin.itemPlugin({
+    store.itemPluginManager.listPlugins().forEach(itemPlugin => {
+      const itemPluginResponse = itemPlugin({
         props: itemPluginProps,
         rootRef: finalRootRef,
         contentRef: finalContentRef
@@ -59,50 +57,38 @@ const useTreeViewBuildContext = parameters => {
       rootRef: finalRootRef,
       propsEnhancers
     };
-  }, [plugins]);
+  }, [store]);
   const wrapItem = React.useCallback(({
     itemId,
     children,
     idAttribute
   }) => {
     let finalChildren = children;
+    const itemsWrapper = store.itemPluginManager.listWrappers();
+
     // The wrappers are reversed to ensure that the first wrapper is the outermost one.
-    for (let i = plugins.length - 1; i >= 0; i -= 1) {
-      const plugin = plugins[i];
-      if (plugin.wrapItem) {
-        finalChildren = plugin.wrapItem({
-          instance,
-          itemId,
-          children: finalChildren,
-          idAttribute
-        });
-      }
-    }
-    return finalChildren;
-  }, [plugins, instance]);
-  const wrapRoot = React.useCallback(({
-    children
-  }) => {
-    let finalChildren = children;
-    // The wrappers are reversed to ensure that the first wrapper is the outermost one.
-    for (let i = plugins.length - 1; i >= 0; i -= 1) {
-      const plugin = plugins[i];
-      if (plugin.wrapRoot) {
-        finalChildren = plugin.wrapRoot({
-          children: finalChildren
-        });
-      }
+    for (let i = itemsWrapper.length - 1; i >= 0; i -= 1) {
+      const itemWrapper = itemsWrapper[i];
+      finalChildren = itemWrapper({
+        store: store,
+        itemId,
+        children: finalChildren,
+        idAttribute
+      });
     }
     return finalChildren;
-  }, [plugins]);
+  }, [store]);
   return React.useMemo(() => ({
     runItemPlugins,
     wrapItem,
-    wrapRoot,
-    instance,
     publicAPI,
     store,
     rootRef
-  }), [runItemPlugins, wrapItem, wrapRoot, instance, publicAPI, store, rootRef]);
+  }), [runItemPlugins, wrapItem, publicAPI, store, rootRef]);
 };
-exports.useTreeViewBuildContext = useTreeViewBuildContext;
+exports.useTreeViewBuildContext = useTreeViewBuildContext;
+function initializeInputApiRef(publicAPI, apiRef) {
+  if (apiRef != null && apiRef.current == null) {
+    apiRef.current = publicAPI;
+  }
+}

package/internals/components/RichTreeViewItems.js

@@ -10,20 +10,20 @@ exports.RichTreeViewItems = RichTreeViewItems;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
+var _empty = require("@base-ui/utils/empty");
 var _store = require("@mui/x-internals/store");
 var _useSlotProps2 = _interopRequireDefault(require("@mui/utils/useSlotProps"));
 var _fastObjectShallowCompare = require("@mui/x-internals/fastObjectShallowCompare");
 var _TreeItem = require("../../TreeItem");
-var _useTreeViewItems = require("../plugins/useTreeViewItems");
+var _items = require("../plugins/items");
 var _TreeViewProvider = require("../TreeViewProvider");
-var _useTreeViewExpansion = require("../plugins/useTreeViewExpansion");
+var _expansion = require("../plugins/expansion");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["ownerState"];
 const RichTreeViewItemsContext = /*#__PURE__*/React.createContext(null);
 if (process.env.NODE_ENV !== "production") RichTreeViewItemsContext.displayName = "RichTreeViewItemsContext";
-const EMPTY_ARRAY = [];
-const selectorNoChildren = () => EMPTY_ARRAY;
-const selectorChildrenIdsNull = state => _useTreeViewItems.itemsSelectors.itemOrderedChildrenIds(state, null);
+const selectorNoChildren = () => _empty.EMPTY_ARRAY;
+const selectorChildrenIdsNull = state => _items.itemsSelectors.itemOrderedChildrenIds(state, null);
 const WrappedTreeItem = /*#__PURE__*/React.memo(function WrappedTreeItem({
   itemSlot,
   itemSlotProps,
@@ -34,8 +34,8 @@ const WrappedTreeItem = /*#__PURE__*/React.memo(function WrappedTreeItem({
   const {
     store
   } = (0, _TreeViewProvider.useTreeViewContext)();
-  const itemMeta = (0, _store.useStore)(store, _useTreeViewItems.itemsSelectors.itemMeta, itemId);
-  const children = (0, _store.useStore)(store, skipChildren ? selectorNoChildren : _useTreeViewItems.itemsSelectors.itemOrderedChildrenIds, itemId);
+  const itemMeta = (0, _store.useStore)(store, _items.itemsSelectors.itemMeta, itemId);
+  const children = (0, _store.useStore)(store, skipChildren ? selectorNoChildren : _items.itemsSelectors.itemOrderedChildrenIds, itemId);
   const Item = itemSlot ?? _TreeItem.TreeItem;
   const _useSlotProps = (0, _useSlotProps2.default)({
       elementType: Item,
@@ -66,8 +66,8 @@ function RichTreeViewItems(props) {
   } = (0, _TreeViewProvider.useTreeViewContext)();
   const itemSlot = slots?.item;
   const itemSlotProps = slotProps?.item;
-  const domStructure = (0, _store.useStore)(store, _useTreeViewItems.itemsSelectors.domStructure);
-  const items = (0, _store.useStore)(store, domStructure === 'flat' ? _useTreeViewExpansion.expansionSelectors.flatList : selectorChildrenIdsNull);
+  const domStructure = (0, _store.useStore)(store, _items.itemsSelectors.domStructure);
+  const items = (0, _store.useStore)(store, domStructure === 'flat' ? _expansion.expansionSelectors.flatList : selectorChildrenIdsNull);
   const skipChildren = domStructure === 'flat';
   const renderItem = React.useCallback(itemId => {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedTreeItem, {

package/internals/hooks/useTreeViewRootProps.d.ts

@@ -0,0 +1,287 @@
+import * as React from 'react';
+import { EventHandlers } from '@mui/utils/types';
+import { TreeViewCancellableEvent } from "../../models/index.js";
+import { TreeViewAnyStore } from "../models/index.js";
+export declare function useTreeViewRootProps<TStore extends TreeViewAnyStore>(store: TStore, forwardedProps: React.HTMLAttributes<HTMLUListElement>, ref: React.Ref<HTMLUListElement | null> | undefined): (otherHandlers: EventHandlers) => {
+  style: React.CSSProperties;
+  onFocus: (event: React.FocusEvent<HTMLUListElement> & TreeViewCancellableEvent) => void;
+  onBlur: (event: React.FocusEvent<HTMLUListElement> & TreeViewCancellableEvent) => void;
+  defaultChecked?: boolean | undefined;
+  defaultValue?: string | number | readonly string[] | undefined;
+  suppressContentEditableWarning?: boolean | undefined;
+  suppressHydrationWarning?: boolean | undefined;
+  accessKey?: string | undefined;
+  autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
+  autoFocus?: boolean | undefined;
+  className?: string | undefined;
+  contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+  contextMenu?: string | undefined;
+  dir?: string | undefined;
+  draggable?: (boolean | "true" | "false") | undefined;
+  enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
+  hidden?: boolean | undefined;
+  id: string | undefined;
+  lang?: string | undefined;
+  nonce?: string | undefined;
+  slot?: string | undefined;
+  spellCheck?: (boolean | "true" | "false") | undefined;
+  tabIndex?: number | undefined;
+  title?: string | undefined;
+  translate?: "yes" | "no" | undefined;
+  radioGroup?: string | undefined;
+  role: string;
+  about?: string | undefined;
+  content?: string | undefined;
+  datatype?: string | undefined;
+  inlist?: any;
+  prefix?: string | undefined;
+  property?: string | undefined;
+  rel?: string | undefined;
+  resource?: string | undefined;
+  rev?: string | undefined;
+  typeof?: string | undefined;
+  vocab?: string | undefined;
+  autoCorrect?: string | undefined;
+  autoSave?: string | undefined;
+  color?: string | undefined;
+  itemProp?: string | undefined;
+  itemScope?: boolean | undefined;
+  itemType?: string | undefined;
+  itemID?: string | undefined;
+  itemRef?: string | undefined;
+  results?: number | undefined;
+  security?: string | undefined;
+  unselectable?: "on" | "off" | undefined;
+  popover?: "" | "auto" | "manual" | "hint" | undefined;
+  popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
+  popoverTarget?: string | undefined;
+  inert?: boolean | undefined;
+  inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
+  is?: string | undefined;
+  exportparts?: string | undefined;
+  part?: string | undefined;
+  "aria-activedescendant"?: string | undefined;
+  "aria-atomic"?: (boolean | "true" | "false") | undefined;
+  "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
+  "aria-braillelabel"?: string | undefined;
+  "aria-brailleroledescription"?: string | undefined;
+  "aria-busy"?: (boolean | "true" | "false") | undefined;
+  "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
+  "aria-colcount"?: number | undefined;
+  "aria-colindex"?: number | undefined;
+  "aria-colindextext"?: string | undefined;
+  "aria-colspan"?: number | undefined;
+  "aria-controls"?: string | undefined;
+  "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
+  "aria-describedby"?: string | undefined;
+  "aria-description"?: string | undefined;
+  "aria-details"?: string | undefined;
+  "aria-disabled"?: (boolean | "true" | "false") | undefined;
+  "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
+  "aria-errormessage"?: string | undefined;
+  "aria-expanded"?: (boolean | "true" | "false") | undefined;
+  "aria-flowto"?: string | undefined;
+  "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+  "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
+  "aria-hidden"?: (boolean | "true" | "false") | undefined;
+  "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+  "aria-keyshortcuts"?: string | undefined;
+  "aria-label"?: string | undefined;
+  "aria-labelledby"?: string | undefined;
+  "aria-level"?: number | undefined;
+  "aria-live"?: "off" | "assertive" | "polite" | undefined;
+  "aria-modal"?: (boolean | "true" | "false") | undefined;
+  "aria-multiline"?: (boolean | "true" | "false") | undefined;
+  "aria-multiselectable": boolean | "true" | "false";
+  "aria-orientation"?: "horizontal" | "vertical" | undefined;
+  "aria-owns"?: string | undefined;
+  "aria-placeholder"?: string | undefined;
+  "aria-posinset"?: number | undefined;
+  "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
+  "aria-readonly"?: (boolean | "true" | "false") | undefined;
+  "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
+  "aria-required"?: (boolean | "true" | "false") | undefined;
+  "aria-roledescription"?: string | undefined;
+  "aria-rowcount"?: number | undefined;
+  "aria-rowindex"?: number | undefined;
+  "aria-rowindextext"?: string | undefined;
+  "aria-rowspan"?: number | undefined;
+  "aria-selected"?: (boolean | "true" | "false") | undefined;
+  "aria-setsize"?: number | undefined;
+  "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+  "aria-valuemax"?: number | undefined;
+  "aria-valuemin"?: number | undefined;
+  "aria-valuenow"?: number | undefined;
+  "aria-valuetext"?: string | undefined;
+  children?: React.ReactNode | undefined;
+  dangerouslySetInnerHTML?: {
+    __html: string | TrustedHTML;
+  } | undefined;
+  onCopy?: React.ClipboardEventHandler<HTMLUListElement> | undefined;
+  onCopyCapture?: React.ClipboardEventHandler<HTMLUListElement> | undefined;
+  onCut?: React.ClipboardEventHandler<HTMLUListElement> | undefined;
+  onCutCapture?: React.ClipboardEventHandler<HTMLUListElement> | undefined;
+  onPaste?: React.ClipboardEventHandler<HTMLUListElement> | undefined;
+  onPasteCapture?: React.ClipboardEventHandler<HTMLUListElement> | undefined;
+  onCompositionEnd?: React.CompositionEventHandler<HTMLUListElement> | undefined;
+  onCompositionEndCapture?: React.CompositionEventHandler<HTMLUListElement> | undefined;
+  onCompositionStart?: React.CompositionEventHandler<HTMLUListElement> | undefined;
+  onCompositionStartCapture?: React.CompositionEventHandler<HTMLUListElement> | undefined;
+  onCompositionUpdate?: React.CompositionEventHandler<HTMLUListElement> | undefined;
+  onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLUListElement> | undefined;
+  onFocusCapture?: React.FocusEventHandler<HTMLUListElement> | undefined;
+  onBlurCapture?: React.FocusEventHandler<HTMLUListElement> | undefined;
+  onChange?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onChangeCapture?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onBeforeInput?: React.InputEventHandler<HTMLUListElement> | undefined;
+  onBeforeInputCapture?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onInput?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onInputCapture?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onReset?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onResetCapture?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onSubmit?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onSubmitCapture?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onInvalid?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onInvalidCapture?: React.FormEventHandler<HTMLUListElement> | undefined;
+  onLoad?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onLoadCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onError?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onErrorCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onKeyDown?: React.KeyboardEventHandler<HTMLUListElement> | undefined;
+  onKeyDownCapture?: React.KeyboardEventHandler<HTMLUListElement> | undefined;
+  onKeyPress?: React.KeyboardEventHandler<HTMLUListElement> | undefined;
+  onKeyPressCapture?: React.KeyboardEventHandler<HTMLUListElement> | undefined;
+  onKeyUp?: React.KeyboardEventHandler<HTMLUListElement> | undefined;
+  onKeyUpCapture?: React.KeyboardEventHandler<HTMLUListElement> | undefined;
+  onAbort?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onAbortCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onCanPlay?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onCanPlayCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onCanPlayThrough?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onCanPlayThroughCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onDurationChange?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onDurationChangeCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onEmptied?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onEmptiedCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onEncrypted?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onEncryptedCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onEnded?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onEndedCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onLoadedData?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onLoadedDataCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onLoadedMetadata?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onLoadedMetadataCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onLoadStart?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onLoadStartCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onPause?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onPauseCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onPlay?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onPlayCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onPlaying?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onPlayingCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onProgress?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onProgressCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onRateChange?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onRateChangeCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onSeeked?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onSeekedCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onSeeking?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onSeekingCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onStalled?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onStalledCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onSuspend?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onSuspendCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onTimeUpdate?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onTimeUpdateCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onVolumeChange?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onVolumeChangeCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onWaiting?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onWaitingCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onAuxClick?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onAuxClickCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onClick?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onClickCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onContextMenu?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onContextMenuCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onDoubleClick?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onDoubleClickCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onDrag?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragEnd?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragEndCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragEnter?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragEnterCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragExit?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragExitCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragLeave?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragLeaveCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragOver?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragOverCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragStart?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDragStartCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDrop?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onDropCapture?: React.DragEventHandler<HTMLUListElement> | undefined;
+  onMouseDown?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseDownCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseEnter?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseLeave?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseMove?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseMoveCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseOut?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseOutCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseOver?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseOverCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseUp?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onMouseUpCapture?: React.MouseEventHandler<HTMLUListElement> | undefined;
+  onSelect?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onSelectCapture?: React.ReactEventHandler<HTMLUListElement> | undefined;
+  onTouchCancel?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onTouchCancelCapture?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onTouchEnd?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onTouchEndCapture?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onTouchMove?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onTouchMoveCapture?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onTouchStart?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onTouchStartCapture?: React.TouchEventHandler<HTMLUListElement> | undefined;
+  onPointerDown?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerDownCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerMove?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerMoveCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerUp?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerUpCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerCancel?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerCancelCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerEnter?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerLeave?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerOver?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerOverCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerOut?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onPointerOutCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onGotPointerCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onLostPointerCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLUListElement> | undefined;
+  onScroll?: React.UIEventHandler<HTMLUListElement> | undefined;
+  onScrollCapture?: React.UIEventHandler<HTMLUListElement> | undefined;
+  onScrollEnd?: React.UIEventHandler<HTMLUListElement> | undefined;
+  onScrollEndCapture?: React.UIEventHandler<HTMLUListElement> | undefined;
+  onWheel?: React.WheelEventHandler<HTMLUListElement> | undefined;
+  onWheelCapture?: React.WheelEventHandler<HTMLUListElement> | undefined;
+  onAnimationStart?: React.AnimationEventHandler<HTMLUListElement> | undefined;
+  onAnimationStartCapture?: React.AnimationEventHandler<HTMLUListElement> | undefined;
+  onAnimationEnd?: React.AnimationEventHandler<HTMLUListElement> | undefined;
+  onAnimationEndCapture?: React.AnimationEventHandler<HTMLUListElement> | undefined;
+  onAnimationIteration?: React.AnimationEventHandler<HTMLUListElement> | undefined;
+  onAnimationIterationCapture?: React.AnimationEventHandler<HTMLUListElement> | undefined;
+  onToggle?: React.ToggleEventHandler<HTMLUListElement> | undefined;
+  onBeforeToggle?: React.ToggleEventHandler<HTMLUListElement> | undefined;
+  onTransitionCancel?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  onTransitionCancelCapture?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  onTransitionEnd?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  onTransitionEndCapture?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  onTransitionRun?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  onTransitionRunCapture?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  onTransitionStart?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  onTransitionStartCapture?: React.TransitionEventHandler<HTMLUListElement> | undefined;
+  ref: React.Ref<HTMLUListElement | null> | undefined;
+};

package/internals/hooks/useTreeViewRootProps.js

@@ -0,0 +1,36 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTreeViewRootProps = useTreeViewRootProps;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _store = require("@mui/x-internals/store");
+var _id = require("../plugins/id");
+var _selection = require("../plugins/selection");
+var _items = require("../plugins/items");
+function useTreeViewRootProps(store, forwardedProps, ref) {
+  const treeId = (0, _store.useStore)(store, _id.idSelectors.treeId);
+  const itemChildrenIndentation = (0, _store.useStore)(store, _items.itemsSelectors.itemChildrenIndentation);
+  const isMultiSelectEnabled = (0, _store.useStore)(store, _selection.selectionSelectors.isMultiSelectEnabled);
+  return otherHandlers => (0, _extends2.default)({
+    ref,
+    role: 'tree',
+    id: treeId,
+    'aria-multiselectable': isMultiSelectEnabled
+  }, forwardedProps, otherHandlers, {
+    style: (0, _extends2.default)({}, forwardedProps.style, {
+      '--TreeView-itemChildrenIndentation': typeof itemChildrenIndentation === 'number' ? `${itemChildrenIndentation}px` : itemChildrenIndentation
+    }),
+    onFocus: event => {
+      otherHandlers.onFocus?.(event);
+      store.focus.handleRootFocus(event);
+    },
+    onBlur: event => {
+      otherHandlers.onBlur?.(event);
+      store.focus.handleRootBlur(event);
+    }
+  });
+}

package/internals/hooks/useTreeViewStore.d.ts

@@ -0,0 +1,10 @@
+import { TreeViewAnyStore } from "../models/index.js";
+interface ValidTreeViewStoreConstructor<TStore extends TreeViewAnyStore> {
+  new (parameters: TStore['parameters']): TStore;
+}
+export type UseTreeViewStoreParameters<TStore extends TreeViewAnyStore> = Omit<Parameters<TStore['updateStateFromParameters']>[0], 'isRtl'>;
+/**
+ * Creates a Tree View store and keep it in sync with the provided parameters.
+ */
+export declare function useTreeViewStore<TStore extends TreeViewAnyStore>(StoreClass: ValidTreeViewStoreConstructor<TStore>, parameters: UseTreeViewStoreParameters<TStore>): TStore;
+export {};

package/internals/hooks/useTreeViewStore.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTreeViewStore = useTreeViewStore;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _useRefWithInit = require("@base-ui/utils/useRefWithInit");
+var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
+var _useOnMount = require("@base-ui/utils/useOnMount");
+var _RtlProvider = require("@mui/system/RtlProvider");
+/**
+ * Creates a Tree View store and keep it in sync with the provided parameters.
+ */
+function useTreeViewStore(StoreClass, parameters) {
+  const isRtl = (0, _RtlProvider.useRtl)();
+  const store = (0, _useRefWithInit.useRefWithInit)(() => new StoreClass((0, _extends2.default)({}, parameters, {
+    isRtl
+  }))).current;
+  (0, _useIsoLayoutEffect.useIsoLayoutEffect)(() => store.updateStateFromParameters((0, _extends2.default)({}, parameters, {
+    isRtl
+  })), [store, isRtl, parameters]);
+  (0, _useOnMount.useOnMount)(store.disposeEffect);
+  return store;
+}

package/internals/index.d.ts

@@ -1,25 +1,19 @@
-export { useTreeView } from "./useTreeView/index.js";
 export { TreeViewProvider, useTreeViewContext } from "./TreeViewProvider/index.js";
 export { RichTreeViewItems } from "./components/RichTreeViewItems.js";
 export type { RichTreeViewItemsSlots, RichTreeViewItemsSlotProps } from "./components/RichTreeViewItems.js";
-export { unstable_resetCleanupTracking, useInstanceEventHandler } from "./hooks/useInstanceEventHandler.js";
-export type { TreeViewPlugin, TreeViewPluginSignature, ConvertPluginsIntoSignatures, MergeSignaturesProperty, TreeViewPublicAPI, TreeViewState, TreeViewItemMeta, TreeViewInstance, TreeViewItemPlugin, TreeViewUsedStore, TreeViewUsedInstance, TreeViewUsedParamsWithDefaults } from "./models/index.js";
-export type { TreeViewCorePluginParameters } from "./corePlugins/index.js";
-export { useTreeViewExpansion, expansionSelectors } from "./plugins/useTreeViewExpansion/index.js";
-export type { UseTreeViewExpansionSignature, UseTreeViewExpansionParameters } from "./plugins/useTreeViewExpansion/index.js";
-export { useTreeViewSelection, selectionSelectors } from "./plugins/useTreeViewSelection/index.js";
-export type { UseTreeViewSelectionSignature, UseTreeViewSelectionParameters } from "./plugins/useTreeViewSelection/index.js";
-export { useTreeViewFocus } from "./plugins/useTreeViewFocus/index.js";
-export type { UseTreeViewFocusSignature, UseTreeViewFocusParameters } from "./plugins/useTreeViewFocus/index.js";
-export { useTreeViewKeyboardNavigation } from "./plugins/useTreeViewKeyboardNavigation/index.js";
-export type { UseTreeViewKeyboardNavigationSignature } from "./plugins/useTreeViewKeyboardNavigation/index.js";
-export { useTreeViewItems, buildSiblingIndexes, itemsSelectors, TREE_VIEW_ROOT_PARENT_ID } from "./plugins/useTreeViewItems/index.js";
-export type { UseTreeViewItemsSignature, UseTreeViewItemsParameters, UseTreeViewItemsState } from "./plugins/useTreeViewItems/index.js";
-export { useTreeViewLabel, labelSelectors } from "./plugins/useTreeViewLabel/index.js";
-export type { UseTreeViewLabelSignature, UseTreeViewLabelParameters } from "./plugins/useTreeViewLabel/index.js";
-export type { UseTreeViewLazyLoadingSignature, UseTreeViewLazyLoadingParameters, UseTreeViewLazyLoadingInstance, DataSource } from "./plugins/useTreeViewLazyLoading/index.js";
-export { lazyLoadingSelectors } from "./plugins/useTreeViewLazyLoading/index.js";
-export { useTreeViewJSXItems } from "./plugins/useTreeViewJSXItems/index.js";
-export type { UseTreeViewJSXItemsSignature, UseTreeViewJSXItemsParameters } from "./plugins/useTreeViewJSXItems/index.js";
+export { useTreeViewRootProps } from "./hooks/useTreeViewRootProps.js";
+export { useTreeViewStore } from "./hooks/useTreeViewStore.js";
+export type { UseTreeViewStoreParameters } from "./hooks/useTreeViewStore.js";
+export type { TreeViewItemMeta, TreeViewItemPlugin, TreeViewEventParameters, TreeViewEventEvent, TreeViewPublicAPI } from "./models/index.js";
+export { expansionSelectors } from "./plugins/expansion/index.js";
+export { selectionSelectors } from "./plugins/selection/index.js";
+export { buildSiblingIndexes, itemsSelectors, TREE_VIEW_ROOT_PARENT_ID } from "./plugins/items/index.js";
+export { labelSelectors } from "./plugins/labelEditing/index.js";
+export { lazyLoadingSelectors } from "./plugins/lazyLoading/index.js";
 export { isTargetInDescendants } from "./utils/tree.js";
-export type { TreeViewClasses, TreeViewSlots, TreeViewSlotProps } from "./TreeViewProvider/TreeViewStyleContext.js";
+export type { TreeViewClasses, TreeViewSlots, TreeViewSlotProps } from "./TreeViewProvider/TreeViewStyleContext.js";
+export { MinimalTreeViewStore } from "./MinimalTreeViewStore/index.js";
+export type { TreeViewParametersToStateMapper } from "./MinimalTreeViewStore/index.js";
+export { ExtendableRichTreeViewStore } from "./RichTreeViewStore/index.js";
+export type { RichTreeViewState, RichTreeViewStoreParameters } from "./RichTreeViewStore/index.js";
+export { TreeViewItemDepthContext } from "./TreeViewItemDepthContext/index.js";