@mui/x-tree-view 8.0.0-beta.3 → 8.1.0

package/RichTreeView/RichTreeView.js

@@ -1,13 +1,14 @@
 "use strict";
 'use client';
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.RichTreeViewRoot = exports.RichTreeView = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Alert = _interopRequireDefault(require("@mui/material/Alert"));
@@ -24,6 +25,7 @@ var _RichTreeViewItems = require("../internals/components/RichTreeViewItems");
 var _useSelector = require("../internals/hooks/useSelector");
 var _useTreeViewItems = require("../internals/plugins/useTreeViewItems/useTreeViewItems.selectors");
 var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["slots", "slotProps"];
 const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiRichTreeView');
 const useUtilityClasses = ownerState => {
   const {
@@ -47,8 +49,7 @@ const useUtilityClasses = ownerState => {
 };
 const RichTreeViewRoot = exports.RichTreeViewRoot = (0, _zeroStyled.styled)('ul', {
   name: 'MuiRichTreeView',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({
   padding: 0,
   margin: 0,
@@ -71,6 +72,11 @@ const RichTreeView = exports.RichTreeView = /*#__PURE__*/React.forwardRef(functi
     props: inProps,
     name: 'MuiRichTreeView'
   });
+  const {
+      slots,
+      slotProps
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   if (process.env.NODE_ENV !== 'production') {
     if (props.children != null) {
       (0, _warning.warnOnce)(['MUI X: The Rich Tree View component does not support JSX children.', 'If you want to add items, you need to use the `items` prop.', 'Check the documentation for more details: https://mui.com/x/react-tree-view/rich-tree-view/items/.']);
@@ -82,14 +88,10 @@ const RichTreeView = exports.RichTreeView = /*#__PURE__*/React.forwardRef(functi
   } = (0, _useTreeView.useTreeView)({
     plugins: _RichTreeView.RICH_TREE_VIEW_PLUGINS,
     rootRef: ref,
-    props
+    props: other
   });
   const isLoading = (0, _useSelector.useSelector)(contextValue.store, _useTreeViewItems.selectorIsTreeViewLoading);
   const treeViewError = (0, _useSelector.useSelector)(contextValue.store, _useTreeViewItems.selectorGetTreeViewError);
-  const {
-    slots,
-    slotProps
-  } = props;
   const classes = useUtilityClasses(props);
   const Root = slots?.root ?? RichTreeViewRoot;
   const rootProps = (0, _useSlotProps.default)({
@@ -113,6 +115,8 @@ const RichTreeView = exports.RichTreeView = /*#__PURE__*/React.forwardRef(functi
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TreeViewProvider.TreeViewProvider, {
     contextValue: contextValue,
     classes: classes,
+    slots: slots,
+    slotProps: slotProps,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, rootProps, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RichTreeViewItems.RichTreeViewItems, {
         slots: slots,

package/RichTreeView/RichTreeView.plugins.d.ts

@@ -3,11 +3,8 @@ import { UseTreeViewItemsParameters } from "../internals/plugins/useTreeViewItem
 import { UseTreeViewExpansionParameters } from "../internals/plugins/useTreeViewExpansion/index.js";
 import { UseTreeViewSelectionParameters } from "../internals/plugins/useTreeViewSelection/index.js";
 import { UseTreeViewFocusParameters } from "../internals/plugins/useTreeViewFocus/index.js";
-import { UseTreeViewIconsParameters } from "../internals/plugins/useTreeViewIcons/index.js";
-import { ConvertPluginsIntoSignatures, MergeSignaturesProperty } from "../internals/models/index.js";
+import { ConvertPluginsIntoSignatures } from "../internals/models/index.js";
 import { UseTreeViewLabelParameters } from "../internals/plugins/useTreeViewLabel/index.js";
-export declare const RICH_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewIconsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewLabelSignature>];
+export declare const RICH_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewLabelSignature>];
 export type RichTreeViewPluginSignatures = ConvertPluginsIntoSignatures<typeof RICH_TREE_VIEW_PLUGINS>;
-export type RichTreeViewPluginSlots = MergeSignaturesProperty<RichTreeViewPluginSignatures, 'slots'>;
-export type RichTreeViewPluginSlotProps = MergeSignaturesProperty<RichTreeViewPluginSignatures, 'slotProps'>;
-export interface RichTreeViewPluginParameters<R extends {}, Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, UseTreeViewItemsParameters<R>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewIconsParameters, UseTreeViewLabelParameters<R> {}
+export interface RichTreeViewPluginParameters<R extends {}, Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, UseTreeViewItemsParameters<R>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewLabelParameters<R> {}

package/RichTreeView/RichTreeView.plugins.js

@@ -9,8 +9,7 @@ var _useTreeViewExpansion = require("../internals/plugins/useTreeViewExpansion")
 var _useTreeViewSelection = require("../internals/plugins/useTreeViewSelection");
 var _useTreeViewFocus = require("../internals/plugins/useTreeViewFocus");
 var _useTreeViewKeyboardNavigation = require("../internals/plugins/useTreeViewKeyboardNavigation");
-var _useTreeViewIcons = require("../internals/plugins/useTreeViewIcons");
 var _useTreeViewLabel = require("../internals/plugins/useTreeViewLabel");
-const RICH_TREE_VIEW_PLUGINS = exports.RICH_TREE_VIEW_PLUGINS = [_useTreeViewItems.useTreeViewItems, _useTreeViewExpansion.useTreeViewExpansion, _useTreeViewSelection.useTreeViewSelection, _useTreeViewFocus.useTreeViewFocus, _useTreeViewKeyboardNavigation.useTreeViewKeyboardNavigation, _useTreeViewIcons.useTreeViewIcons, _useTreeViewLabel.useTreeViewLabel];
+const RICH_TREE_VIEW_PLUGINS = exports.RICH_TREE_VIEW_PLUGINS = [_useTreeViewItems.useTreeViewItems, _useTreeViewExpansion.useTreeViewExpansion, _useTreeViewSelection.useTreeViewSelection, _useTreeViewFocus.useTreeViewFocus, _useTreeViewKeyboardNavigation.useTreeViewKeyboardNavigation, _useTreeViewLabel.useTreeViewLabel];
 
 // We can't infer this type from the plugin, otherwise we would lose the generics.

package/RichTreeView/RichTreeView.types.d.ts

@@ -3,17 +3,18 @@ import { Theme } from '@mui/material/styles';
 import { SxProps } from '@mui/system/styleFunctionSx';
 import { SlotComponentProps } from '@mui/utils/types';
 import { RichTreeViewClasses } from "./richTreeViewClasses.js";
-import { RichTreeViewPluginParameters, RichTreeViewPluginSlotProps, RichTreeViewPluginSlots, RichTreeViewPluginSignatures } from "./RichTreeView.plugins.js";
+import { RichTreeViewPluginParameters, RichTreeViewPluginSignatures } from "./RichTreeView.plugins.js";
 import { TreeViewExperimentalFeatures, TreeViewPublicAPI } from "../internals/models/index.js";
 import { RichTreeViewItemsSlotProps, RichTreeViewItemsSlots } from "../internals/components/RichTreeViewItems.js";
-export interface RichTreeViewSlots extends RichTreeViewPluginSlots, RichTreeViewItemsSlots {
+import { TreeViewSlotProps, TreeViewSlots } from "../internals/TreeViewProvider/TreeViewStyleContext.js";
+export interface RichTreeViewSlots extends TreeViewSlots, RichTreeViewItemsSlots {
   /**
    * Element rendered at the root.
    * @default RichTreeViewRoot
    */
   root?: React.ElementType;
 }
-export interface RichTreeViewSlotProps<R extends {}, Multiple extends boolean | undefined> extends RichTreeViewPluginSlotProps, RichTreeViewItemsSlotProps {
+export interface RichTreeViewSlotProps<R extends {}, Multiple extends boolean | undefined> extends TreeViewSlotProps, RichTreeViewItemsSlotProps {
   root?: SlotComponentProps<'ul', {}, RichTreeViewProps<R, Multiple>>;
 }
 export type RichTreeViewApiRef = React.RefObject<TreeViewPublicAPI<RichTreeViewPluginSignatures> | undefined>;

package/RichTreeView/index.d.ts

@@ -2,4 +2,4 @@ export * from "./RichTreeView.js";
 export * from "./richTreeViewClasses.js";
 export type { RichTreeViewProps, RichTreeViewPropsBase, RichTreeViewSlots, RichTreeViewSlotProps } from './RichTreeView.types';
 export { RICH_TREE_VIEW_PLUGINS } from "./RichTreeView.plugins.js";
-export type { RichTreeViewPluginSlots, RichTreeViewPluginSlotProps, RichTreeViewPluginParameters } from './RichTreeView.plugins';
+export type { RichTreeViewPluginParameters } from './RichTreeView.plugins';

package/SimpleTreeView/SimpleTreeView.js

@@ -1,13 +1,14 @@
 "use strict";
 'use client';
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.SimpleTreeViewRoot = exports.SimpleTreeView = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
@@ -19,6 +20,7 @@ var _useTreeView = require("../internals/useTreeView");
 var _TreeViewProvider = require("../internals/TreeViewProvider");
 var _SimpleTreeView = require("./SimpleTreeView.plugins");
 var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["slots", "slotProps"];
 const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiSimpleTreeView');
 const useUtilityClasses = ownerState => {
   const {
@@ -42,8 +44,7 @@ const useUtilityClasses = ownerState => {
 };
 const SimpleTreeViewRoot = exports.SimpleTreeViewRoot = (0, _zeroStyled.styled)('ul', {
   name: 'MuiSimpleTreeView',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({
   padding: 0,
   margin: 0,
@@ -68,7 +69,11 @@ const SimpleTreeView = exports.SimpleTreeView = /*#__PURE__*/React.forwardRef(fu
     props: inProps,
     name: 'MuiSimpleTreeView'
   });
-  const ownerState = props;
+  const {
+      slots,
+      slotProps
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   if (process.env.NODE_ENV !== 'production') {
     if (props.items != null) {
       (0, _warning.warnOnce)(['MUI X: The Simple Tree View component does not support the `items` prop.', 'If you want to add items, you need to pass them as JSX children.', 'Check the documentation for more details: https://mui.com/x/react-tree-view/simple-tree-view/items/.']);
@@ -80,14 +85,10 @@ const SimpleTreeView = exports.SimpleTreeView = /*#__PURE__*/React.forwardRef(fu
   } = (0, _useTreeView.useTreeView)({
     plugins: _SimpleTreeView.SIMPLE_TREE_VIEW_PLUGINS,
     rootRef: ref,
-    props: (0, _extends2.default)({}, props, {
+    props: (0, _extends2.default)({}, other, {
       items: EMPTY_ITEMS
     })
   });
-  const {
-    slots,
-    slotProps
-  } = props;
   const classes = useUtilityClasses(props);
   const Root = slots?.root ?? SimpleTreeViewRoot;
   const rootProps = (0, _useSlotProps.default)({
@@ -95,11 +96,13 @@ const SimpleTreeView = exports.SimpleTreeView = /*#__PURE__*/React.forwardRef(fu
     externalSlotProps: slotProps?.root,
     className: classes.root,
     getSlotProps: getRootProps,
-    ownerState
+    ownerState: props
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TreeViewProvider.TreeViewProvider, {
     contextValue: contextValue,
     classes: classes,
+    slots: slots,
+    slotProps: slotProps,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, rootProps))
   });
 });

package/SimpleTreeView/SimpleTreeView.plugins.d.ts

@@ -3,10 +3,7 @@ import { UseTreeViewItemsParameters } from "../internals/plugins/useTreeViewItem
 import { UseTreeViewExpansionParameters } from "../internals/plugins/useTreeViewExpansion/index.js";
 import { UseTreeViewSelectionParameters } from "../internals/plugins/useTreeViewSelection/index.js";
 import { UseTreeViewFocusParameters } from "../internals/plugins/useTreeViewFocus/index.js";
-import { UseTreeViewIconsParameters } from "../internals/plugins/useTreeViewIcons/index.js";
-import { ConvertPluginsIntoSignatures, MergeSignaturesProperty } from "../internals/models/index.js";
-export declare const SIMPLE_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewIconsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewJSXItemsSignature>];
+import { ConvertPluginsIntoSignatures } from "../internals/models/index.js";
+export declare const SIMPLE_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewJSXItemsSignature>];
 export type SimpleTreeViewPluginSignatures = ConvertPluginsIntoSignatures<typeof SIMPLE_TREE_VIEW_PLUGINS>;
-export type SimpleTreeViewPluginSlots = MergeSignaturesProperty<SimpleTreeViewPluginSignatures, 'slots'>;
-export type SimpleTreeViewPluginSlotProps = MergeSignaturesProperty<SimpleTreeViewPluginSignatures, 'slotProps'>;
-export interface SimpleTreeViewPluginParameters<Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, Omit<UseTreeViewItemsParameters<any>, 'items' | 'isItemDisabled' | 'getItemLabel' | 'getItemId'>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewIconsParameters {}
+export interface SimpleTreeViewPluginParameters<Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, Omit<UseTreeViewItemsParameters<any>, 'items' | 'isItemDisabled' | 'getItemLabel' | 'getItemId'>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple> {}

package/SimpleTreeView/SimpleTreeView.plugins.js

@@ -9,8 +9,7 @@ var _useTreeViewExpansion = require("../internals/plugins/useTreeViewExpansion")
 var _useTreeViewSelection = require("../internals/plugins/useTreeViewSelection");
 var _useTreeViewFocus = require("../internals/plugins/useTreeViewFocus");
 var _useTreeViewKeyboardNavigation = require("../internals/plugins/useTreeViewKeyboardNavigation");
-var _useTreeViewIcons = require("../internals/plugins/useTreeViewIcons");
 var _useTreeViewJSXItems = require("../internals/plugins/useTreeViewJSXItems");
-const SIMPLE_TREE_VIEW_PLUGINS = exports.SIMPLE_TREE_VIEW_PLUGINS = [_useTreeViewItems.useTreeViewItems, _useTreeViewExpansion.useTreeViewExpansion, _useTreeViewSelection.useTreeViewSelection, _useTreeViewFocus.useTreeViewFocus, _useTreeViewKeyboardNavigation.useTreeViewKeyboardNavigation, _useTreeViewIcons.useTreeViewIcons, _useTreeViewJSXItems.useTreeViewJSXItems];
+const SIMPLE_TREE_VIEW_PLUGINS = exports.SIMPLE_TREE_VIEW_PLUGINS = [_useTreeViewItems.useTreeViewItems, _useTreeViewExpansion.useTreeViewExpansion, _useTreeViewSelection.useTreeViewSelection, _useTreeViewFocus.useTreeViewFocus, _useTreeViewKeyboardNavigation.useTreeViewKeyboardNavigation, _useTreeViewJSXItems.useTreeViewJSXItems];
 
 // We can't infer this type from the plugin, otherwise we would lose the generics.

package/SimpleTreeView/SimpleTreeView.types.d.ts

@@ -3,16 +3,17 @@ import { Theme } from '@mui/material/styles';
 import { SlotComponentProps } from '@mui/utils/types';
 import { SxProps } from '@mui/system/styleFunctionSx';
 import { SimpleTreeViewClasses } from "./simpleTreeViewClasses.js";
-import { SimpleTreeViewPluginParameters, SimpleTreeViewPluginSlotProps, SimpleTreeViewPluginSlots, SimpleTreeViewPluginSignatures } from "./SimpleTreeView.plugins.js";
+import { SimpleTreeViewPluginParameters, SimpleTreeViewPluginSignatures } from "./SimpleTreeView.plugins.js";
 import { TreeViewExperimentalFeatures, TreeViewPublicAPI } from "../internals/models/index.js";
-export interface SimpleTreeViewSlots extends SimpleTreeViewPluginSlots {
+import { TreeViewSlotProps, TreeViewSlots } from "../internals/TreeViewProvider/TreeViewStyleContext.js";
+export interface SimpleTreeViewSlots extends TreeViewSlots {
   /**
    * Element rendered at the root.
    * @default SimpleTreeViewRoot
    */
   root?: React.ElementType;
 }
-export interface SimpleTreeViewSlotProps extends SimpleTreeViewPluginSlotProps {
+export interface SimpleTreeViewSlotProps extends TreeViewSlotProps {
   root?: SlotComponentProps<'ul', {}, {}>;
 }
 export type SimpleTreeViewApiRef = React.RefObject<TreeViewPublicAPI<SimpleTreeViewPluginSignatures> | undefined>;

package/TreeItem/TreeItem.js

@@ -34,8 +34,7 @@ const _excluded = ["visible"],
 const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiTreeItem');
 const TreeItemRoot = exports.TreeItemRoot = (0, _zeroStyled.styled)('li', {
   name: 'MuiTreeItem',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({
   listStyle: 'none',
   margin: 0,
@@ -45,7 +44,6 @@ const TreeItemRoot = exports.TreeItemRoot = (0, _zeroStyled.styled)('li', {
 const TreeItemContent = exports.TreeItemContent = (0, _zeroStyled.styled)('div', {
   name: 'MuiTreeItem',
   slot: 'Content',
-  overridesResolver: (props, styles) => styles.content,
   shouldForwardProp: prop => (0, _createStyled.shouldForwardProp)(prop) && prop !== 'status'
 })(({
   theme
@@ -93,7 +91,6 @@ const TreeItemContent = exports.TreeItemContent = (0, _zeroStyled.styled)('div',
 const TreeItemLabel = exports.TreeItemLabel = (0, _zeroStyled.styled)('div', {
   name: 'MuiTreeItem',
   slot: 'Label',
-  overridesResolver: (props, styles) => styles.label,
   shouldForwardProp: prop => (0, _createStyled.shouldForwardProp)(prop) && prop !== 'editable'
 })(({
   theme
@@ -117,8 +114,7 @@ const TreeItemLabel = exports.TreeItemLabel = (0, _zeroStyled.styled)('div', {
 }));
 const TreeItemIconContainer = exports.TreeItemIconContainer = (0, _zeroStyled.styled)('div', {
   name: 'MuiTreeItem',
-  slot: 'IconContainer',
-  overridesResolver: (props, styles) => styles.iconContainer
+  slot: 'IconContainer'
 })({
   width: 16,
   display: 'flex',
@@ -139,8 +135,7 @@ const TreeItemGroupTransition = exports.TreeItemGroupTransition = (0, _zeroStyle
 });
 const TreeItemErrorContainer = exports.TreeItemErrorContainer = (0, _zeroStyled.styled)('div', {
   name: 'MuiTreeItem',
-  slot: 'ErrorIcon',
-  overridesResolver: (props, styles) => styles.errorIcon
+  slot: 'ErrorIcon'
 })({
   position: 'absolute',
   right: -3,
@@ -151,8 +146,7 @@ const TreeItemErrorContainer = exports.TreeItemErrorContainer = (0, _zeroStyled.
 });
 const TreeItemLoadingContainer = exports.TreeItemLoadingContainer = (0, _zeroStyled.styled)(_CircularProgress.default, {
   name: 'MuiTreeItem',
-  slot: 'LoadingIcon',
-  overridesResolver: (props, styles) => styles.loadingIcon
+  slot: 'LoadingIcon'
 })({
   color: 'text.primary'
 });
@@ -169,8 +163,7 @@ const TreeItemCheckbox = exports.TreeItemCheckbox = (0, _zeroStyled.styled)(/*#_
   }));
 }), {
   name: 'MuiTreeItem',
-  slot: 'Checkbox',
-  overridesResolver: (props, styles) => styles.checkbox
+  slot: 'Checkbox'
 })({
   padding: 0
 });

package/TreeItemDragAndDropOverlay/TreeItemDragAndDropOverlay.js

@@ -17,7 +17,6 @@ var _jsxRuntime = require("react/jsx-runtime");
 const TreeItemDragAndDropOverlayRoot = (0, _zeroStyled.styled)('div', {
   name: 'MuiTreeItemDragAndDropOverlay',
   slot: 'Root',
-  overridesResolver: (props, styles) => styles.root,
   shouldForwardProp: prop => (0, _createStyled.shouldForwardProp)(prop) && prop !== 'action'
 })(({
   theme

package/TreeItemIcon/TreeItemIcon.js

@@ -12,21 +12,25 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _resolveComponentProps = _interopRequireDefault(require("@mui/utils/resolveComponentProps"));
 var _useSlotProps = _interopRequireDefault(require("@mui/utils/useSlotProps"));
-var _TreeViewProvider = require("../internals/TreeViewProvider");
+var _TreeViewStyleContext = require("../internals/TreeViewProvider/TreeViewStyleContext");
 var _icons = require("../icons");
 var _jsxRuntime = require("react/jsx-runtime");
 function TreeItemIcon(props) {
   const {
-    slots,
-    slotProps,
+    slots: slotsFromTreeItem,
+    slotProps: slotPropsFromTreeItem,
     status
   } = props;
-  const context = (0, _TreeViewProvider.useTreeViewContext)();
-  const contextIcons = (0, _extends2.default)({}, context.icons.slots, {
-    expandIcon: context.icons.slots.expandIcon ?? _icons.TreeViewExpandIcon,
-    collapseIcon: context.icons.slots.collapseIcon ?? _icons.TreeViewCollapseIcon
-  });
-  const contextIconProps = context.icons.slotProps;
+  const {
+    slots: slotsFromTreeView,
+    slotProps: slotPropsFromTreeView
+  } = (0, _TreeViewStyleContext.useTreeViewStyleContext)();
+  const slots = {
+    collapseIcon: slotsFromTreeItem?.collapseIcon ?? slotsFromTreeView.collapseIcon ?? _icons.TreeViewCollapseIcon,
+    expandIcon: slotsFromTreeItem?.expandIcon ?? slotsFromTreeView.expandIcon ?? _icons.TreeViewExpandIcon,
+    endIcon: slotsFromTreeItem?.endIcon ?? slotsFromTreeView.endIcon,
+    icon: slotsFromTreeItem?.icon
+  };
   let iconName;
   if (slots?.icon) {
     iconName = 'icon';
@@ -39,10 +43,10 @@ function TreeItemIcon(props) {
   } else {
     iconName = 'endIcon';
   }
-  const Icon = slots?.[iconName] ?? contextIcons[iconName];
+  const Icon = slots[iconName];
   const iconProps = (0, _useSlotProps.default)({
     elementType: Icon,
-    externalSlotProps: tempOwnerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(contextIconProps[iconName], tempOwnerState), (0, _resolveComponentProps.default)(slotProps?.[iconName], tempOwnerState)),
+    externalSlotProps: tempOwnerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(slotPropsFromTreeView[iconName], tempOwnerState), (0, _resolveComponentProps.default)(slotPropsFromTreeItem?.[iconName], tempOwnerState)),
     // TODO: Add proper ownerState
     ownerState: {}
   });

package/TreeItemLabelInput/TreeItemLabelInput.js

@@ -12,8 +12,7 @@ var _zeroStyled = require("../internals/zero-styled");
  */
 const TreeItemLabelInput = exports.TreeItemLabelInput = (0, _zeroStyled.styled)('input', {
   name: 'MuiTreeItem',
-  slot: 'LabelInput',
-  overridesResolver: (props, styles) => styles.labelInput
+  slot: 'LabelInput'
 })(({
   theme
 }) => (0, _extends2.default)({}, theme.typography.body1, {

package/esm/RichTreeView/RichTreeView.js

@@ -1,6 +1,8 @@
 'use client';
 
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["slots", "slotProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import Alert from '@mui/material/Alert';
@@ -40,8 +42,7 @@ const useUtilityClasses = ownerState => {
 };
 export const RichTreeViewRoot = styled('ul', {
   name: 'MuiRichTreeView',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({
   padding: 0,
   margin: 0,
@@ -64,6 +65,11 @@ const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps
     props: inProps,
     name: 'MuiRichTreeView'
   });
+  const {
+      slots,
+      slotProps
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   if (process.env.NODE_ENV !== 'production') {
     if (props.children != null) {
       warnOnce(['MUI X: The Rich Tree View component does not support JSX children.', 'If you want to add items, you need to use the `items` prop.', 'Check the documentation for more details: https://mui.com/x/react-tree-view/rich-tree-view/items/.']);
@@ -75,14 +81,10 @@ const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps
   } = useTreeView({
     plugins: RICH_TREE_VIEW_PLUGINS,
     rootRef: ref,
-    props
+    props: other
   });
   const isLoading = useSelector(contextValue.store, selectorIsTreeViewLoading);
   const treeViewError = useSelector(contextValue.store, selectorGetTreeViewError);
-  const {
-    slots,
-    slotProps
-  } = props;
   const classes = useUtilityClasses(props);
   const Root = slots?.root ?? RichTreeViewRoot;
   const rootProps = useSlotProps({
@@ -106,6 +108,8 @@ const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps
   return /*#__PURE__*/_jsx(TreeViewProvider, {
     contextValue: contextValue,
     classes: classes,
+    slots: slots,
+    slotProps: slotProps,
     children: /*#__PURE__*/_jsx(Root, _extends({}, rootProps, {
       children: /*#__PURE__*/_jsx(RichTreeViewItems, {
         slots: slots,

package/esm/RichTreeView/RichTreeView.plugins.d.ts

@@ -3,11 +3,8 @@ import { UseTreeViewItemsParameters } from "../internals/plugins/useTreeViewItem
 import { UseTreeViewExpansionParameters } from "../internals/plugins/useTreeViewExpansion/index.js";
 import { UseTreeViewSelectionParameters } from "../internals/plugins/useTreeViewSelection/index.js";
 import { UseTreeViewFocusParameters } from "../internals/plugins/useTreeViewFocus/index.js";
-import { UseTreeViewIconsParameters } from "../internals/plugins/useTreeViewIcons/index.js";
-import { ConvertPluginsIntoSignatures, MergeSignaturesProperty } from "../internals/models/index.js";
+import { ConvertPluginsIntoSignatures } from "../internals/models/index.js";
 import { UseTreeViewLabelParameters } from "../internals/plugins/useTreeViewLabel/index.js";
-export declare const RICH_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewIconsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewLabelSignature>];
+export declare const RICH_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewLabelSignature>];
 export type RichTreeViewPluginSignatures = ConvertPluginsIntoSignatures<typeof RICH_TREE_VIEW_PLUGINS>;
-export type RichTreeViewPluginSlots = MergeSignaturesProperty<RichTreeViewPluginSignatures, 'slots'>;
-export type RichTreeViewPluginSlotProps = MergeSignaturesProperty<RichTreeViewPluginSignatures, 'slotProps'>;
-export interface RichTreeViewPluginParameters<R extends {}, Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, UseTreeViewItemsParameters<R>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewIconsParameters, UseTreeViewLabelParameters<R> {}
+export interface RichTreeViewPluginParameters<R extends {}, Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, UseTreeViewItemsParameters<R>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewLabelParameters<R> {}

package/esm/RichTreeView/RichTreeView.plugins.js

@@ -3,8 +3,7 @@ import { useTreeViewExpansion } from "../internals/plugins/useTreeViewExpansion/
 import { useTreeViewSelection } from "../internals/plugins/useTreeViewSelection/index.js";
 import { useTreeViewFocus } from "../internals/plugins/useTreeViewFocus/index.js";
 import { useTreeViewKeyboardNavigation } from "../internals/plugins/useTreeViewKeyboardNavigation/index.js";
-import { useTreeViewIcons } from "../internals/plugins/useTreeViewIcons/index.js";
 import { useTreeViewLabel } from "../internals/plugins/useTreeViewLabel/index.js";
-export const RICH_TREE_VIEW_PLUGINS = [useTreeViewItems, useTreeViewExpansion, useTreeViewSelection, useTreeViewFocus, useTreeViewKeyboardNavigation, useTreeViewIcons, useTreeViewLabel];
+export const RICH_TREE_VIEW_PLUGINS = [useTreeViewItems, useTreeViewExpansion, useTreeViewSelection, useTreeViewFocus, useTreeViewKeyboardNavigation, useTreeViewLabel];
 
 // We can't infer this type from the plugin, otherwise we would lose the generics.

package/esm/RichTreeView/RichTreeView.types.d.ts

@@ -3,17 +3,18 @@ import { Theme } from '@mui/material/styles';
 import { SxProps } from '@mui/system/styleFunctionSx';
 import { SlotComponentProps } from '@mui/utils/types';
 import { RichTreeViewClasses } from "./richTreeViewClasses.js";
-import { RichTreeViewPluginParameters, RichTreeViewPluginSlotProps, RichTreeViewPluginSlots, RichTreeViewPluginSignatures } from "./RichTreeView.plugins.js";
+import { RichTreeViewPluginParameters, RichTreeViewPluginSignatures } from "./RichTreeView.plugins.js";
 import { TreeViewExperimentalFeatures, TreeViewPublicAPI } from "../internals/models/index.js";
 import { RichTreeViewItemsSlotProps, RichTreeViewItemsSlots } from "../internals/components/RichTreeViewItems.js";
-export interface RichTreeViewSlots extends RichTreeViewPluginSlots, RichTreeViewItemsSlots {
+import { TreeViewSlotProps, TreeViewSlots } from "../internals/TreeViewProvider/TreeViewStyleContext.js";
+export interface RichTreeViewSlots extends TreeViewSlots, RichTreeViewItemsSlots {
   /**
    * Element rendered at the root.
    * @default RichTreeViewRoot
    */
   root?: React.ElementType;
 }
-export interface RichTreeViewSlotProps<R extends {}, Multiple extends boolean | undefined> extends RichTreeViewPluginSlotProps, RichTreeViewItemsSlotProps {
+export interface RichTreeViewSlotProps<R extends {}, Multiple extends boolean | undefined> extends TreeViewSlotProps, RichTreeViewItemsSlotProps {
   root?: SlotComponentProps<'ul', {}, RichTreeViewProps<R, Multiple>>;
 }
 export type RichTreeViewApiRef = React.RefObject<TreeViewPublicAPI<RichTreeViewPluginSignatures> | undefined>;

package/esm/RichTreeView/index.d.ts

@@ -2,4 +2,4 @@ export * from "./RichTreeView.js";
 export * from "./richTreeViewClasses.js";
 export type { RichTreeViewProps, RichTreeViewPropsBase, RichTreeViewSlots, RichTreeViewSlotProps } from './RichTreeView.types';
 export { RICH_TREE_VIEW_PLUGINS } from "./RichTreeView.plugins.js";
-export type { RichTreeViewPluginSlots, RichTreeViewPluginSlotProps, RichTreeViewPluginParameters } from './RichTreeView.plugins';
+export type { RichTreeViewPluginParameters } from './RichTreeView.plugins';

package/esm/SimpleTreeView/SimpleTreeView.js

@@ -1,6 +1,8 @@
 'use client';
 
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["slots", "slotProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import composeClasses from '@mui/utils/composeClasses';
@@ -35,8 +37,7 @@ const useUtilityClasses = ownerState => {
 };
 export const SimpleTreeViewRoot = styled('ul', {
   name: 'MuiSimpleTreeView',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({
   padding: 0,
   margin: 0,
@@ -61,7 +62,11 @@ const SimpleTreeView = /*#__PURE__*/React.forwardRef(function SimpleTreeView(inP
     props: inProps,
     name: 'MuiSimpleTreeView'
   });
-  const ownerState = props;
+  const {
+      slots,
+      slotProps
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   if (process.env.NODE_ENV !== 'production') {
     if (props.items != null) {
       warnOnce(['MUI X: The Simple Tree View component does not support the `items` prop.', 'If you want to add items, you need to pass them as JSX children.', 'Check the documentation for more details: https://mui.com/x/react-tree-view/simple-tree-view/items/.']);
@@ -73,14 +78,10 @@ const SimpleTreeView = /*#__PURE__*/React.forwardRef(function SimpleTreeView(inP
   } = useTreeView({
     plugins: SIMPLE_TREE_VIEW_PLUGINS,
     rootRef: ref,
-    props: _extends({}, props, {
+    props: _extends({}, other, {
       items: EMPTY_ITEMS
     })
   });
-  const {
-    slots,
-    slotProps
-  } = props;
   const classes = useUtilityClasses(props);
   const Root = slots?.root ?? SimpleTreeViewRoot;
   const rootProps = useSlotProps({
@@ -88,11 +89,13 @@ const SimpleTreeView = /*#__PURE__*/React.forwardRef(function SimpleTreeView(inP
     externalSlotProps: slotProps?.root,
     className: classes.root,
     getSlotProps: getRootProps,
-    ownerState
+    ownerState: props
   });
   return /*#__PURE__*/_jsx(TreeViewProvider, {
     contextValue: contextValue,
     classes: classes,
+    slots: slots,
+    slotProps: slotProps,
     children: /*#__PURE__*/_jsx(Root, _extends({}, rootProps))
   });
 });

package/esm/SimpleTreeView/SimpleTreeView.plugins.d.ts

@@ -3,10 +3,7 @@ import { UseTreeViewItemsParameters } from "../internals/plugins/useTreeViewItem
 import { UseTreeViewExpansionParameters } from "../internals/plugins/useTreeViewExpansion/index.js";
 import { UseTreeViewSelectionParameters } from "../internals/plugins/useTreeViewSelection/index.js";
 import { UseTreeViewFocusParameters } from "../internals/plugins/useTreeViewFocus/index.js";
-import { UseTreeViewIconsParameters } from "../internals/plugins/useTreeViewIcons/index.js";
-import { ConvertPluginsIntoSignatures, MergeSignaturesProperty } from "../internals/models/index.js";
-export declare const SIMPLE_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewIconsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewJSXItemsSignature>];
+import { ConvertPluginsIntoSignatures } from "../internals/models/index.js";
+export declare const SIMPLE_TREE_VIEW_PLUGINS: readonly [import("../internals").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals").TreeViewPlugin<import("../internals").UseTreeViewJSXItemsSignature>];
 export type SimpleTreeViewPluginSignatures = ConvertPluginsIntoSignatures<typeof SIMPLE_TREE_VIEW_PLUGINS>;
-export type SimpleTreeViewPluginSlots = MergeSignaturesProperty<SimpleTreeViewPluginSignatures, 'slots'>;
-export type SimpleTreeViewPluginSlotProps = MergeSignaturesProperty<SimpleTreeViewPluginSignatures, 'slotProps'>;
-export interface SimpleTreeViewPluginParameters<Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, Omit<UseTreeViewItemsParameters<any>, 'items' | 'isItemDisabled' | 'getItemLabel' | 'getItemId'>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewIconsParameters {}
+export interface SimpleTreeViewPluginParameters<Multiple extends boolean | undefined> extends TreeViewCorePluginParameters, Omit<UseTreeViewItemsParameters<any>, 'items' | 'isItemDisabled' | 'getItemLabel' | 'getItemId'>, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple> {}

package/esm/SimpleTreeView/SimpleTreeView.plugins.js

@@ -3,8 +3,7 @@ import { useTreeViewExpansion } from "../internals/plugins/useTreeViewExpansion/
 import { useTreeViewSelection } from "../internals/plugins/useTreeViewSelection/index.js";
 import { useTreeViewFocus } from "../internals/plugins/useTreeViewFocus/index.js";
 import { useTreeViewKeyboardNavigation } from "../internals/plugins/useTreeViewKeyboardNavigation/index.js";
-import { useTreeViewIcons } from "../internals/plugins/useTreeViewIcons/index.js";
 import { useTreeViewJSXItems } from "../internals/plugins/useTreeViewJSXItems/index.js";
-export const SIMPLE_TREE_VIEW_PLUGINS = [useTreeViewItems, useTreeViewExpansion, useTreeViewSelection, useTreeViewFocus, useTreeViewKeyboardNavigation, useTreeViewIcons, useTreeViewJSXItems];
+export const SIMPLE_TREE_VIEW_PLUGINS = [useTreeViewItems, useTreeViewExpansion, useTreeViewSelection, useTreeViewFocus, useTreeViewKeyboardNavigation, useTreeViewJSXItems];
 
 // We can't infer this type from the plugin, otherwise we would lose the generics.