@mui/x-tree-view 7.1.0 → 7.1.1

package/CHANGELOG.md

@@ -3,6 +3,107 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 7.1.1
+
+_Apr 5, 2024_
+
+We'd like to offer a big thanks to the 19 contributors who made this release possible. Here are some highlights ✨:
+
+- 🚀 Add `setItemExpansion` Tree View API method (#12595) @flaviendelangle
+- 🌍 Improve Persian (fa-IR), Portuguese (pt-BR), and Spanish (es-ES) locale on the Data Grid
+- 🌍 Improve Persian (fa-IR), Portuguese (pt-BR), and Ukrainian (uk-UA) locale on the Pickers
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.1.1`
+
+- [DataGrid] Allow higher packages' props to be used in MIT (#12365) @MBilalShafi
+- [DataGrid] Fix RTL mode (#12583) @romgrk
+- [DataGrid] Fix `ColDefChangesGridNoSnap` demo crash (#12663) @MBilalShafi
+- [DataGrid] Fix server-side filter demo not working (#12662) @MBilalShafi
+- [DataGrid] Log error if `rowCount` is used with client-side pagination (#12448) @michelengelen
+- [DataGrid] Remove `GridFormatterParams` completely (#12660) @romgrk
+- [DataGrid] Restore main slot (#12657) @romgrk
+- [l10n] Improve Persian (fa-IR) locale (#12630) @amirhosseinzf
+- [l10n] Improve Portuguese (pt-BR) locale (#12618) @hugoalkimim
+- [l10n] Improve Spanish (es-ES) locale (#12606) @aitor40
+
+#### `@mui/x-data-grid-pro@7.1.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@7.1.1`.
+
+#### `@mui/x-data-grid-premium@7.1.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@7.1.1`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@7.1.1`
+
+- [fields] Fix `readOnly` behavior (#12609) @LukasTy
+- [l10n] Improve Persian (fa-IR) locale (#12632) @misafari
+- [l10n] Improve Portuguese (pt-BR) locale (#12613) @cnHealth
+- [l10n] Improve Ukrainian (uk-UA) locale (#12627) @alexkobylansky
+
+#### `@mui/x-date-pickers-pro@7.1.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@7.1.1`, plus:
+
+- [DateTimeRangePicker] Fix selection on same day (#12604) @LukasTy
+
+### Charts
+
+#### `@mui/x-charts@7.1.1`
+
+- [charts] Fix `tickInterval` usage for y-axis (#12592) @alexfauquette
+- [charts] Fix Scatter series highlight when `id` is a `number` (#12677) @JCQuintas
+- [charts] Fix TS error when using `sx` property on `ChartsTooltip` (#12659) @JCQuintas
+
+### Tree View
+
+#### `@mui/x-tree-view@7.1.1`
+
+- [TreeView] Add JSDoc to all `publicAPI` methods (#12649) @flaviendelangle
+- [TreeView] Create `RichTreeViewPro` component (not released yet) (#12610) @flaviendelangle
+- [TreeView] Create pro package (not released yet) (#12240) @flaviendelangle
+- [TreeView] Fix typo in errors (#12623) @alissa-tung
+- [TreeView] New API method: `setItemExpansion` (#12595) @flaviendelangle
+
+### Docs
+
+- [docs] Add a recipe for the `checkboxSelectionVisibleOnly` prop (#12646) @michelengelen
+- [docs] Explain the use of `_action: 'delete'` in `processRowUpdate` (#12670) @michelengelen
+- [docs] Fix formatting and typo on migration guide @oliviertassinari
+- [docs] Fix formatting in changelog @oliviertassinari
+- [docs] Fix grammar in TreeView migration doc (#12615) @joshkel
+- [docs] Fix missing closing props in `PieShapeNoSnap` demo (#12636) @alp-ex
+- [docs] Fix type arguments in Custom Field page (#12619) @Juneezee
+- [docs] Fix typo in `getItemId` prop description (#12637) @flaviendelangle
+- [docs] Make the Charts `margin` usage more visible (#12591) @alexfauquette
+- [docs] Match IE 11 spacing with Material UI @oliviertassinari
+- [docs] Move data grid interfaces to standard API page layout (#12016) @alexfauquette
+- [docs] Remove ` around @default values (#12158) @alexfauquette
+- [docs] Remove `day` from the default `dayOfWeekFormatter` function params (#12644) @LukasTy
+- [docs] Use `TreeItem2` for icon expansion example on `RichTreeView` (#12563) @flaviendelangle
+
+### Core
+
+- [core] Add cherry-pick `master` to `v6` action (#12648) @LukasTy
+- [core] Fix typo in `@mui/x-tree-view-pro/themeAugmentation` (#12674) @flaviendelangle
+- [core] Introduce `describeTreeView` to run test on `SimpleTreeView` and `RichTreeView`, using `TreeItem` and `TreeItem2` + migrate expansion tests (#12428) @flaviendelangle
+- [core] Limit `test-types` CI step allowed memory (#12651) @LukasTy
+- [core] Remove explicit `express` package (#12602) @LukasTy
+- [core] Update to new embedded translations in the docs package (#12232) @Janpot
+- [core] Use PR labels to identify the package a `l10n` PR belongs to (#12639) @LukasTy
+- [core] Use `describeTreeView` for selection tests (#12647) @flaviendelangle
+- [docs-infra] Adjust the links to search for issues (#11995) @michelengelen
+- [infra] Polish support survey experience (#12624) @oliviertassinari
+- [support-infra] Replace author association with a permission check in survey action (#12068) @michelengelen
+- [support-infra] Fix user permission check (#12669) @michelengelen
+- [test] Fix Tree View test import (#12668) @LukasTy
+
 ## 7.1.0
 
 _Mar 28, 2024_
@@ -74,7 +175,7 @@ Same changes as in `@mui/x-date-pickers@7.1.0`, plus:
 - [core] Include `DateTimeRangePicker` tag in `releaseChangelog` (#12526) @LukasTy
 - [core] Upgrade monorepo (#12536) @cherniavskii
 
-## v7.0.0
+## 7.0.0
 
 _Mar 22, 2024_
 
@@ -530,13 +631,13 @@ We'd like to offer a big thanks to the 10 contributors who made this release pos
 
 - 🎁 Introduce a new DOM structure for the field components that provides a better accessibility
 - 🚀 Simplify Data Grid DOM structure for improved performance (#12013) @romgrk
-- 🕥 The support for IE11 has been removed (#12151) @flaviendelangle
+- 🕥 The support for IE 11 has been removed (#12151) @flaviendelangle
 - 🐞 Bugfixes
 - 📚 Documentation improvements
 
 ### Breaking changes
 
-- The support for IE11 has been removed from all MUI X packages. The `legacy` bundle that used to support old browsers like IE11 is no longer included.
+- The support for IE 11 has been removed from all MUI X packages. The `legacy` bundle that used to support old browsers like IE 11 is no longer included.
 
 ### Data Grid
 
@@ -641,7 +742,7 @@ These components are no longer exported from `@mui/x-charts`:
 
 ### Tree View / `@mui/x-tree-view@7.0.0-beta.4`
 
-- [TreeView] Stop using custom `findIndex` to support IE11 (#12129) @flaviendelangle
+- [TreeView] Stop using custom `findIndex` to support IE 11 (#12129) @flaviendelangle
 
 ### Docs
 
@@ -2871,6 +2972,76 @@ Here is an example of the renaming for the `<ChartsTooltip />` component.
 - [core] Update release instructions as per v7 configuration (#10962) @MBilalShafi
 - [license] Correctly throw errors (#10924) @oliviertassinari
 
+## 6.19.9
+
+_Apr 5, 2024_
+
+We'd like to offer a big thanks to the 3 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@6.19.9`
+
+- [DataGrid] Remove legacy editing API event: `rowEditCommit` (#12087) @MBilalShafi
+
+#### `@mui/x-data-grid-pro@6.19.9` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@6.19.9`.
+
+#### `@mui/x-data-grid-premium@6.19.9` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@6.19.9`.
+
+### Date Pickers
+
+#### `@mui/x-date-pickers@6.19.9`
+
+No changes.
+
+#### `@mui/x-date-pickers-pro@6.19.9` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+- [DateRangePicker] Fix selection behavior with single input field when `readOnly` (#12605) @LukasTy
+
+### Docs
+
+- [docs] Add a recipe for the `checkboxSelectionVisibleOnly` prop (#12667) @michelengelen
+- [docs] Explain the use of `_action: 'delete'` in `processRowUpdate` (#12673) @michelengelen
+
+### Core
+
+- [core] Use Circle CI context (#12607) @cherniavskii
+
+## 6.19.8
+
+_Mar 20, 2024_
+
+We'd like to offer a big thanks to the 3 contributors who made this release possible.
+
+### Data Grid
+
+#### `@mui/x-data-grid@6.19.8`
+
+- [DataGrid] Fix `ElementType` usage (#12505) @cherniavskii
+- [DataGrid] Fix cell value formatting on copy (#12483) @sai6855
+- [DataGrid] Fix checkbox selection when filtering (#12485) @g1mishra
+
+#### `@mui/x-data-grid-pro@6.19.8` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@6.19.8`.
+
+#### `@mui/x-data-grid-premium@6.19.8` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@6.19.8`, plus:
+
+- [DataGridPremium] Add support for confirmation before clipboard paste (#12466) @cherniavskii
+
+### Docs
+
+- [docs] Update links to v7 (#12495) @cherniavskii
+
 ## 6.19.7
 
 _Mar 14, 2024_

package/README.md

@@ -1,6 +1,6 @@
 # MUI X Tree View
 
-This package is the community edition of the tree view components.
+This package is the Community plan edition of the Tree View components.
 It's part of [MUI X](https://mui.com/x/), an open-core extension of MUI Core, with advanced components.
 
 ## Installation

package/RichTreeView/RichTreeView.d.ts

@@ -3,7 +3,7 @@ import { RichTreeViewProps } from './RichTreeView.types';
 export declare const RichTreeViewRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     ownerState: RichTreeViewProps<any, any>;
 }, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, keyof React.ClassAttributes<HTMLUListElement> | keyof React.HTMLAttributes<HTMLUListElement>>, {}>;
-type TreeViewComponent = (<R extends {}, Multiple extends boolean | undefined = undefined>(props: RichTreeViewProps<R, Multiple> & React.RefAttributes<HTMLUListElement>) => React.JSX.Element) & {
+type RichTreeViewComponent = (<R extends {}, Multiple extends boolean | undefined = undefined>(props: RichTreeViewProps<R, Multiple> & React.RefAttributes<HTMLUListElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**
@@ -16,5 +16,5 @@ type TreeViewComponent = (<R extends {}, Multiple extends boolean | undefined =
  *
  * - [RichTreeView API](https://mui.com/x/api/tree-view/rich-tree-view/)
  */
-declare const RichTreeView: TreeViewComponent;
+declare const RichTreeView: RichTreeViewComponent;
 export { RichTreeView };

package/RichTreeView/RichTreeView.js

@@ -29,7 +29,8 @@ export const RichTreeViewRoot = styled('ul', {
   padding: 0,
   margin: 0,
   listStyle: 'none',
-  outline: 0
+  outline: 0,
+  position: 'relative'
 });
 function WrappedTreeItem({
   slots,
@@ -138,7 +139,8 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
   apiRef: PropTypes.shape({
     current: PropTypes.shape({
       focusItem: PropTypes.func.isRequired,
-      getItem: PropTypes.func.isRequired
+      getItem: PropTypes.func.isRequired,
+      setItemExpansion: PropTypes.func.isRequired
     })
   }),
   /**
@@ -174,12 +176,12 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
    */
   expandedItems: PropTypes.arrayOf(PropTypes.string),
   /**
-   * Used to determine the string label for a given item.
+   * Used to determine the id of a given item.
    *
    * @template R
    * @param {R} item The item to check.
    * @returns {string} The id of the item.
-   * @default `(item) => item.id`
+   * @default (item) => item.id
    */
   getItemId: PropTypes.func,
   /**
@@ -188,7 +190,7 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
    * @template R
    * @param {R} item The item to check.
    * @returns {string} The label of the item.
-   * @default `(item) => item.label`
+   * @default (item) => item.label
    */
   getItemLabel: PropTypes.func,
   /**

package/SimpleTreeView/SimpleTreeView.js

@@ -28,7 +28,8 @@ export const SimpleTreeViewRoot = styled('ul', {
   padding: 0,
   margin: 0,
   listStyle: 'none',
-  outline: 0
+  outline: 0,
+  position: 'relative'
 });
 const EMPTY_ITEMS = [];
 const itemsPropWarning = buildWarning(['MUI X: The `SimpleTreeView` 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/']);
@@ -96,7 +97,8 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
   apiRef: PropTypes.shape({
     current: PropTypes.shape({
       focusItem: PropTypes.func.isRequired,
-      getItem: PropTypes.func.isRequired
+      getItem: PropTypes.func.isRequired,
+      setItemExpansion: PropTypes.func.isRequired
     })
   }),
   /**

package/TreeView/TreeView.js

@@ -70,7 +70,8 @@ process.env.NODE_ENV !== "production" ? TreeView.propTypes = {
   apiRef: PropTypes.shape({
     current: PropTypes.shape({
       focusItem: PropTypes.func.isRequired,
-      getItem: PropTypes.func.isRequired
+      getItem: PropTypes.func.isRequired,
+      setItemExpansion: PropTypes.func.isRequired
     })
   }),
   /**

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-tree-view v7.1.0
+ * @mui/x-tree-view v7.1.1
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/index.d.ts

@@ -1,15 +1,25 @@
 export { useTreeView } from './useTreeView';
 export { TreeViewProvider } from './TreeViewProvider';
-export type { TreeViewPlugin, TreeViewPluginSignature } from './models';
+export { unstable_resetCleanupTracking } from './hooks/useInstanceEventHandler';
+export type { TreeViewPlugin, TreeViewPluginSignature, ConvertPluginsIntoSignatures, MergePluginsProperty, TreeViewPublicAPI, } from './models';
 export { DEFAULT_TREE_VIEW_PLUGINS } from './plugins/defaultPlugins';
 export type { DefaultTreeViewPlugins, DefaultTreeViewPluginSlots, DefaultTreeViewPluginSlotProps, } from './plugins/defaultPlugins';
 export type { DefaultTreeViewPluginParameters } from './plugins/defaultPlugins';
-export type { UseTreeViewExpansionSignature } from './plugins/useTreeViewExpansion';
-export type { UseTreeViewSelectionSignature } from './plugins/useTreeViewSelection';
-export type { UseTreeViewFocusSignature } from './plugins/useTreeViewFocus';
+export { useTreeViewExpansion } from './plugins/useTreeViewExpansion';
+export type { UseTreeViewExpansionSignature, UseTreeViewExpansionParameters, } from './plugins/useTreeViewExpansion';
+export { useTreeViewSelection } from './plugins/useTreeViewSelection';
+export type { UseTreeViewSelectionSignature, UseTreeViewSelectionParameters, } from './plugins/useTreeViewSelection';
+export { useTreeViewFocus } from './plugins/useTreeViewFocus';
+export type { UseTreeViewFocusSignature, UseTreeViewFocusParameters, } from './plugins/useTreeViewFocus';
+export { useTreeViewKeyboardNavigation } from './plugins/useTreeViewKeyboardNavigation';
 export type { UseTreeViewKeyboardNavigationSignature } from './plugins/useTreeViewKeyboardNavigation';
-export type { UseTreeViewIdSignature } from './plugins/useTreeViewId';
-export type { UseTreeViewIconsSignature } from './plugins/useTreeViewIcons';
-export type { UseTreeViewItemsSignature } from './plugins/useTreeViewItems';
-export type { UseTreeViewJSXItemsSignature } from './plugins/useTreeViewJSXItems';
+export { useTreeViewId } from './plugins/useTreeViewId';
+export type { UseTreeViewIdSignature, UseTreeViewIdParameters } from './plugins/useTreeViewId';
+export { useTreeViewIcons } from './plugins/useTreeViewIcons';
+export type { UseTreeViewIconsSignature, UseTreeViewIconsParameters, } from './plugins/useTreeViewIcons';
+export { useTreeViewItems } from './plugins/useTreeViewItems';
+export type { UseTreeViewItemsSignature, UseTreeViewItemsParameters, } from './plugins/useTreeViewItems';
+export { useTreeViewJSXItems } from './plugins/useTreeViewJSXItems';
+export type { UseTreeViewJSXItemsSignature, UseTreeViewJSXItemsParameters, } from './plugins/useTreeViewJSXItems';
+export { buildWarning } from './utils/warning';
 export { extractPluginParamsFromProps } from './utils/extractPluginParamsFromProps';

package/internals/index.js

@@ -1,4 +1,15 @@
 export { useTreeView } from './useTreeView';
 export { TreeViewProvider } from './TreeViewProvider';
+export { unstable_resetCleanupTracking } from './hooks/useInstanceEventHandler';
+// Plugins
 export { DEFAULT_TREE_VIEW_PLUGINS } from './plugins/defaultPlugins';
+export { useTreeViewExpansion } from './plugins/useTreeViewExpansion';
+export { useTreeViewSelection } from './plugins/useTreeViewSelection';
+export { useTreeViewFocus } from './plugins/useTreeViewFocus';
+export { useTreeViewKeyboardNavigation } from './plugins/useTreeViewKeyboardNavigation';
+export { useTreeViewId } from './plugins/useTreeViewId';
+export { useTreeViewIcons } from './plugins/useTreeViewIcons';
+export { useTreeViewItems } from './plugins/useTreeViewItems';
+export { useTreeViewJSXItems } from './plugins/useTreeViewJSXItems';
+export { buildWarning } from './utils/warning';
 export { extractPluginParamsFromProps } from './utils/extractPluginParamsFromProps';

package/internals/models/plugin.d.ts

@@ -97,7 +97,7 @@ type TreeViewUsedPlugins<TSignature extends TreeViewAnyPluginSignature> = [
     TreeViewCorePluginsSignature,
     ...TSignature['dependantPlugins']
 ];
-type TreeViewUsedParams<TSignature extends TreeViewAnyPluginSignature> = TSignature['params'] & MergePluginsProperty<TreeViewUsedPlugins<TSignature>, 'params'>;
+export type TreeViewUsedParams<TSignature extends TreeViewAnyPluginSignature> = TSignature['params'] & MergePluginsProperty<TreeViewUsedPlugins<TSignature>, 'params'>;
 type TreeViewUsedDefaultizedParams<TSignature extends TreeViewAnyPluginSignature> = TSignature['defaultizedParams'] & MergePluginsProperty<TreeViewUsedPlugins<TSignature>, 'defaultizedParams'>;
 export type TreeViewUsedInstance<TSignature extends TreeViewAnyPluginSignature> = TSignature['instance'] & MergePluginsProperty<TreeViewUsedPlugins<TSignature>, 'instance'> & {
     /**

package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js

@@ -1,33 +1,43 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
-import { populateInstance } from '../../useTreeView/useTreeView.utils';
+import { populateInstance, populatePublicAPI } from '../../useTreeView/useTreeView.utils';
 export const useTreeViewExpansion = ({
   instance,
+  publicAPI,
   params,
   models
 }) => {
+  const expandedItemsMap = React.useMemo(() => {
+    const temp = new Map();
+    models.expandedItems.value.forEach(id => {
+      temp.set(id, true);
+    });
+    return temp;
+  }, [models.expandedItems.value]);
   const setExpandedItems = (event, value) => {
     params.onExpandedItemsChange?.(event, value);
     models.expandedItems.setControlledValue(value);
   };
-  const isItemExpanded = React.useCallback(itemId => {
-    return Array.isArray(models.expandedItems.value) ? models.expandedItems.value.indexOf(itemId) !== -1 : false;
-  }, [models.expandedItems.value]);
+  const isItemExpanded = React.useCallback(itemId => expandedItemsMap.has(itemId), [expandedItemsMap]);
   const isItemExpandable = React.useCallback(itemId => !!instance.getNode(itemId)?.expandable, [instance]);
   const toggleItemExpansion = useEventCallback((event, itemId) => {
-    if (itemId == null) {
+    const isExpandedBefore = instance.isItemExpanded(itemId);
+    instance.setItemExpansion(event, itemId, !isExpandedBefore);
+  });
+  const setItemExpansion = useEventCallback((event, itemId, isExpanded) => {
+    const isExpandedBefore = instance.isItemExpanded(itemId);
+    if (isExpandedBefore === isExpanded) {
       return;
     }
-    const isExpandedBefore = models.expandedItems.value.indexOf(itemId) !== -1;
     let newExpanded;
-    if (isExpandedBefore) {
-      newExpanded = models.expandedItems.value.filter(id => id !== itemId);
-    } else {
+    if (isExpanded) {
       newExpanded = [itemId].concat(models.expandedItems.value);
+    } else {
+      newExpanded = models.expandedItems.value.filter(id => id !== itemId);
     }
     if (params.onItemExpansionToggle) {
-      params.onItemExpansionToggle(event, itemId, !isExpandedBefore);
+      params.onItemExpansionToggle(event, itemId, isExpanded);
     }
     setExpandedItems(event, newExpanded);
   });
@@ -48,9 +58,13 @@ export const useTreeViewExpansion = ({
   populateInstance(instance, {
     isItemExpanded,
     isItemExpandable,
+    setItemExpansion,
     toggleItemExpansion,
     expandAllSiblings
   });
+  populatePublicAPI(publicAPI, {
+    setItemExpansion
+  });
 };
 useTreeViewExpansion.models = {
   expandedItems: {

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

@@ -1,10 +1,19 @@
 import * as React from 'react';
 import { DefaultizedProps, TreeViewPluginSignature } from '../../models';
 import { UseTreeViewItemsSignature } from '../useTreeViewItems';
-export interface UseTreeViewExpansionInstance {
+export interface UseTreeViewExpansionPublicAPI {
+    /**
+     * Change the expansion status of a given item.
+     * @param {React.SyntheticEvent} event The UI event that triggered the change.
+     * @param {string} itemId The id of the item to modify.
+     * @param {boolean} isExpanded The new expansion status of the given item.
+     */
+    setItemExpansion: (event: React.SyntheticEvent, itemId: string, isExpanded: boolean) => void;
+}
+export interface UseTreeViewExpansionInstance extends UseTreeViewExpansionPublicAPI {
     isItemExpanded: (itemId: string) => boolean;
     isItemExpandable: (itemId: string) => boolean;
-    toggleItemExpansion: (event: React.SyntheticEvent, value: string) => void;
+    toggleItemExpansion: (event: React.SyntheticEvent, itemId: string) => void;
     expandAllSiblings: (event: React.KeyboardEvent, itemId: string) => void;
 }
 export interface UseTreeViewExpansionParameters {
@@ -38,6 +47,7 @@ export type UseTreeViewExpansionSignature = TreeViewPluginSignature<{
     params: UseTreeViewExpansionParameters;
     defaultizedParams: UseTreeViewExpansionDefaultizedParameters;
     instance: UseTreeViewExpansionInstance;
+    publicAPI: UseTreeViewExpansionPublicAPI;
     modelNames: 'expandedItems';
     dependantPlugins: [UseTreeViewItemsSignature];
 }>;

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

@@ -4,15 +4,23 @@ import { UseTreeViewIdSignature } from '../useTreeViewId/useTreeViewId.types';
 import type { UseTreeViewItemsSignature } from '../useTreeViewItems';
 import type { UseTreeViewSelectionSignature } from '../useTreeViewSelection';
 import { UseTreeViewExpansionSignature } from '../useTreeViewExpansion';
-export interface UseTreeViewFocusInstance {
+export interface UseTreeViewFocusPublicAPI {
+    /**
+     * Focuses the item with the given id.
+     *
+     * If the item is the child of a collapsed item, then this method will do nothing.
+     * Make sure to expand the ancestors of the item before calling this method if needed.
+     * @param {React.SyntheticEvent} event The event source of the action.
+     * @param {string} itemId The id of the item to focus.
+     */
+    focusItem: (event: React.SyntheticEvent, itemId: string) => void;
+}
+export interface UseTreeViewFocusInstance extends UseTreeViewFocusPublicAPI {
     isItemFocused: (itemId: string) => boolean;
     canItemBeTabbed: (itemId: string) => boolean;
-    focusItem: (event: React.SyntheticEvent, itemId: string) => void;
     focusDefaultItem: (event: React.SyntheticEvent | null) => void;
     removeFocusedItem: () => void;
 }
-export interface UseTreeViewFocusPublicAPI extends Pick<UseTreeViewFocusInstance, 'focusItem'> {
-}
 export interface UseTreeViewFocusParameters {
     /**
      * Callback fired when tree items are focused.

package/internals/plugins/useTreeViewItems/useTreeViewItems.js

@@ -16,7 +16,7 @@ const updateItemsState = ({
       throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', 'An item was provided without id in the `items` prop:', JSON.stringify(item)].join('\n'));
     }
     if (nodeMap[id] != null) {
-      throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Tow items were provided with the same id in the \`items\` prop: "${id}"`].join('\n'));
+      throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Two items were provided with the same id in the \`items\` prop: "${id}"`].join('\n'));
     }
     const label = getItemLabel ? getItemLabel(item) : item.label;
     if (label == null) {

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

@@ -6,9 +6,16 @@ interface TreeViewItemProps {
     id: string | undefined;
     children?: TreeViewItemProps[];
 }
-export interface UseTreeViewItemsInstance<R extends {}> {
-    getNode: (itemId: string) => TreeViewNode;
+export interface UseTreeViewItemsPublicAPI<R extends {}> {
+    /**
+     * Get the item with the given id.
+     * @param {string} itemId The id of the item to return.
+     * @returns {R} The item with the given id.
+     */
     getItem: (itemId: string) => R;
+}
+export interface UseTreeViewItemsInstance<R extends {}> extends UseTreeViewItemsPublicAPI<R> {
+    getNode: (itemId: string) => TreeViewNode;
     getItemsToRender: () => TreeViewItemProps[];
     getChildrenIds: (itemId: string | null) => string[];
     getNavigableChildrenIds: (itemId: string | null) => string[];
@@ -25,8 +32,6 @@ export interface UseTreeViewItemsInstance<R extends {}> {
      */
     areItemUpdatesPrevented: () => boolean;
 }
-export interface UseTreeViewItemsPublicAPI<R extends {}> extends Pick<UseTreeViewItemsInstance<R>, 'getItem'> {
-}
 export interface UseTreeViewItemsParameters<R extends {}> {
     /**
      * If `true`, will allow focus on disabled items.
@@ -47,16 +52,16 @@ export interface UseTreeViewItemsParameters<R extends {}> {
      * @template R
      * @param {R} item The item to check.
      * @returns {string} The label of the item.
-     * @default `(item) => item.label`
+     * @default (item) => item.label
      */
     getItemLabel?: (item: R) => string;
     /**
-     * Used to determine the string label for a given item.
+     * Used to determine the id of a given item.
      *
      * @template R
      * @param {R} item The item to check.
      * @returns {string} The id of the item.
-     * @default `(item) => item.id`
+     * @default (item) => item.id
      */
     getItemId?: (item: R) => TreeViewItemId;
 }

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

@@ -1,2 +1,2 @@
 export { useTreeViewJSXItems } from './useTreeViewJSXItems';
-export type { UseTreeViewJSXItemsSignature, UseTreeViewItemsParameters, UseTreeViewItemsDefaultizedParameters, } from './useTreeViewJSXItems.types';
+export type { UseTreeViewJSXItemsSignature, UseTreeViewJSXItemsParameters, UseTreeViewItemsDefaultizedParameters, } from './useTreeViewJSXItems.types';

package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js

@@ -15,7 +15,7 @@ export const useTreeViewJSXItems = ({
   const insertJSXItem = useEventCallback(item => {
     setState(prevState => {
       if (prevState.items.nodeMap[item.id] != null) {
-        throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Tow items were provided with the same id in the \`items\` prop: "${item.id}"`].join('\n'));
+        throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Two items were provided with the same id in the \`items\` prop: "${item.id}"`].join('\n'));
       }
       return _extends({}, prevState, {
         items: _extends({}, prevState.items, {

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

@@ -6,12 +6,12 @@ export interface UseTreeViewItemsInstance {
     removeJSXItem: (itemId: string) => void;
     mapFirstCharFromJSX: (itemId: string, firstChar: string) => () => void;
 }
-export interface UseTreeViewItemsParameters {
+export interface UseTreeViewJSXItemsParameters {
 }
 export interface UseTreeViewItemsDefaultizedParameters {
 }
 export type UseTreeViewJSXItemsSignature = TreeViewPluginSignature<{
-    params: UseTreeViewItemsParameters;
+    params: UseTreeViewJSXItemsParameters;
     defaultizedParams: UseTreeViewItemsDefaultizedParameters;
     instance: UseTreeViewItemsInstance;
     dependantPlugins: [UseTreeViewItemsSignature, UseTreeViewKeyboardNavigationSignature];

package/internals/useTreeView/useTreeViewModels.js

@@ -22,7 +22,7 @@ export const useTreeViewModels = (plugins, props) => {
     return initialState;
   });
   const models = Object.fromEntries(Object.entries(modelsRef.current).map(([modelName, model]) => {
-    const value = model.isControlled ? props[modelName] : modelsState[modelName];
+    const value = props[modelName] ?? modelsState[modelName];
     return [modelName, {
       value,
       setControlledValue: newValue => {
@@ -53,7 +53,7 @@ export const useTreeViewModels = (plugins, props) => {
         if (!model.isControlled && defaultValue !== newDefaultValue) {
           console.error([`MUI X: A component is changing the default ${modelName} state of an uncontrolled TreeView after being initialized. ` + `To suppress this warning opt to use a controlled TreeView.`].join('\n'));
         }
-      }, [JSON.stringify(defaultValue)]);
+      }, [JSON.stringify(newDefaultValue)]);
     });
   }
   /* eslint-enable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */

package/modern/RichTreeView/RichTreeView.js

@@ -29,7 +29,8 @@ export const RichTreeViewRoot = styled('ul', {
   padding: 0,
   margin: 0,
   listStyle: 'none',
-  outline: 0
+  outline: 0,
+  position: 'relative'
 });
 function WrappedTreeItem({
   slots,
@@ -138,7 +139,8 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
   apiRef: PropTypes.shape({
     current: PropTypes.shape({
       focusItem: PropTypes.func.isRequired,
-      getItem: PropTypes.func.isRequired
+      getItem: PropTypes.func.isRequired,
+      setItemExpansion: PropTypes.func.isRequired
     })
   }),
   /**
@@ -174,12 +176,12 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
    */
   expandedItems: PropTypes.arrayOf(PropTypes.string),
   /**
-   * Used to determine the string label for a given item.
+   * Used to determine the id of a given item.
    *
    * @template R
    * @param {R} item The item to check.
    * @returns {string} The id of the item.
-   * @default `(item) => item.id`
+   * @default (item) => item.id
    */
   getItemId: PropTypes.func,
   /**
@@ -188,7 +190,7 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
    * @template R
    * @param {R} item The item to check.
    * @returns {string} The label of the item.
-   * @default `(item) => item.label`
+   * @default (item) => item.label
    */
   getItemLabel: PropTypes.func,
   /**

package/modern/SimpleTreeView/SimpleTreeView.js

@@ -28,7 +28,8 @@ export const SimpleTreeViewRoot = styled('ul', {
   padding: 0,
   margin: 0,
   listStyle: 'none',
-  outline: 0
+  outline: 0,
+  position: 'relative'
 });
 const EMPTY_ITEMS = [];
 const itemsPropWarning = buildWarning(['MUI X: The `SimpleTreeView` 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/']);
@@ -96,7 +97,8 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
   apiRef: PropTypes.shape({
     current: PropTypes.shape({
       focusItem: PropTypes.func.isRequired,
-      getItem: PropTypes.func.isRequired
+      getItem: PropTypes.func.isRequired,
+      setItemExpansion: PropTypes.func.isRequired
     })
   }),
   /**

package/modern/TreeView/TreeView.js

@@ -70,7 +70,8 @@ process.env.NODE_ENV !== "production" ? TreeView.propTypes = {
   apiRef: PropTypes.shape({
     current: PropTypes.shape({
       focusItem: PropTypes.func.isRequired,
-      getItem: PropTypes.func.isRequired
+      getItem: PropTypes.func.isRequired,
+      setItemExpansion: PropTypes.func.isRequired
     })
   }),
   /**

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-tree-view v7.1.0
+ * @mui/x-tree-view v7.1.1
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/internals/index.js

@@ -1,4 +1,15 @@
 export { useTreeView } from './useTreeView';
 export { TreeViewProvider } from './TreeViewProvider';
+export { unstable_resetCleanupTracking } from './hooks/useInstanceEventHandler';
+// Plugins
 export { DEFAULT_TREE_VIEW_PLUGINS } from './plugins/defaultPlugins';
+export { useTreeViewExpansion } from './plugins/useTreeViewExpansion';
+export { useTreeViewSelection } from './plugins/useTreeViewSelection';
+export { useTreeViewFocus } from './plugins/useTreeViewFocus';
+export { useTreeViewKeyboardNavigation } from './plugins/useTreeViewKeyboardNavigation';
+export { useTreeViewId } from './plugins/useTreeViewId';
+export { useTreeViewIcons } from './plugins/useTreeViewIcons';
+export { useTreeViewItems } from './plugins/useTreeViewItems';
+export { useTreeViewJSXItems } from './plugins/useTreeViewJSXItems';
+export { buildWarning } from './utils/warning';
 export { extractPluginParamsFromProps } from './utils/extractPluginParamsFromProps';

package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js

@@ -1,33 +1,43 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
-import { populateInstance } from '../../useTreeView/useTreeView.utils';
+import { populateInstance, populatePublicAPI } from '../../useTreeView/useTreeView.utils';
 export const useTreeViewExpansion = ({
   instance,
+  publicAPI,
   params,
   models
 }) => {
+  const expandedItemsMap = React.useMemo(() => {
+    const temp = new Map();
+    models.expandedItems.value.forEach(id => {
+      temp.set(id, true);
+    });
+    return temp;
+  }, [models.expandedItems.value]);
   const setExpandedItems = (event, value) => {
     params.onExpandedItemsChange?.(event, value);
     models.expandedItems.setControlledValue(value);
   };
-  const isItemExpanded = React.useCallback(itemId => {
-    return Array.isArray(models.expandedItems.value) ? models.expandedItems.value.indexOf(itemId) !== -1 : false;
-  }, [models.expandedItems.value]);
+  const isItemExpanded = React.useCallback(itemId => expandedItemsMap.has(itemId), [expandedItemsMap]);
   const isItemExpandable = React.useCallback(itemId => !!instance.getNode(itemId)?.expandable, [instance]);
   const toggleItemExpansion = useEventCallback((event, itemId) => {
-    if (itemId == null) {
+    const isExpandedBefore = instance.isItemExpanded(itemId);
+    instance.setItemExpansion(event, itemId, !isExpandedBefore);
+  });
+  const setItemExpansion = useEventCallback((event, itemId, isExpanded) => {
+    const isExpandedBefore = instance.isItemExpanded(itemId);
+    if (isExpandedBefore === isExpanded) {
       return;
     }
-    const isExpandedBefore = models.expandedItems.value.indexOf(itemId) !== -1;
     let newExpanded;
-    if (isExpandedBefore) {
-      newExpanded = models.expandedItems.value.filter(id => id !== itemId);
-    } else {
+    if (isExpanded) {
       newExpanded = [itemId].concat(models.expandedItems.value);
+    } else {
+      newExpanded = models.expandedItems.value.filter(id => id !== itemId);
     }
     if (params.onItemExpansionToggle) {
-      params.onItemExpansionToggle(event, itemId, !isExpandedBefore);
+      params.onItemExpansionToggle(event, itemId, isExpanded);
     }
     setExpandedItems(event, newExpanded);
   });
@@ -48,9 +58,13 @@ export const useTreeViewExpansion = ({
   populateInstance(instance, {
     isItemExpanded,
     isItemExpandable,
+    setItemExpansion,
     toggleItemExpansion,
     expandAllSiblings
   });
+  populatePublicAPI(publicAPI, {
+    setItemExpansion
+  });
 };
 useTreeViewExpansion.models = {
   expandedItems: {

package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.js

@@ -16,7 +16,7 @@ const updateItemsState = ({
       throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', 'An item was provided without id in the `items` prop:', JSON.stringify(item)].join('\n'));
     }
     if (nodeMap[id] != null) {
-      throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Tow items were provided with the same id in the \`items\` prop: "${id}"`].join('\n'));
+      throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Two items were provided with the same id in the \`items\` prop: "${id}"`].join('\n'));
     }
     const label = getItemLabel ? getItemLabel(item) : item.label;
     if (label == null) {

package/modern/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js

@@ -15,7 +15,7 @@ export const useTreeViewJSXItems = ({
   const insertJSXItem = useEventCallback(item => {
     setState(prevState => {
       if (prevState.items.nodeMap[item.id] != null) {
-        throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Tow items were provided with the same id in the \`items\` prop: "${item.id}"`].join('\n'));
+        throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Two items were provided with the same id in the \`items\` prop: "${item.id}"`].join('\n'));
       }
       return _extends({}, prevState, {
         items: _extends({}, prevState.items, {

package/modern/internals/useTreeView/useTreeViewModels.js

@@ -22,7 +22,7 @@ export const useTreeViewModels = (plugins, props) => {
     return initialState;
   });
   const models = Object.fromEntries(Object.entries(modelsRef.current).map(([modelName, model]) => {
-    const value = model.isControlled ? props[modelName] : modelsState[modelName];
+    const value = props[modelName] ?? modelsState[modelName];
     return [modelName, {
       value,
       setControlledValue: newValue => {
@@ -53,7 +53,7 @@ export const useTreeViewModels = (plugins, props) => {
         if (!model.isControlled && defaultValue !== newDefaultValue) {
           console.error([`MUI X: A component is changing the default ${modelName} state of an uncontrolled TreeView after being initialized. ` + `To suppress this warning opt to use a controlled TreeView.`].join('\n'));
         }
-      }, [JSON.stringify(defaultValue)]);
+      }, [JSON.stringify(newDefaultValue)]);
     });
   }
   /* eslint-enable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */

package/node/RichTreeView/RichTreeView.js

@@ -38,7 +38,8 @@ const RichTreeViewRoot = exports.RichTreeViewRoot = (0, _styles.styled)('ul', {
   padding: 0,
   margin: 0,
   listStyle: 'none',
-  outline: 0
+  outline: 0,
+  position: 'relative'
 });
 function WrappedTreeItem({
   slots,
@@ -147,7 +148,8 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
   apiRef: _propTypes.default.shape({
     current: _propTypes.default.shape({
       focusItem: _propTypes.default.func.isRequired,
-      getItem: _propTypes.default.func.isRequired
+      getItem: _propTypes.default.func.isRequired,
+      setItemExpansion: _propTypes.default.func.isRequired
     })
   }),
   /**
@@ -183,12 +185,12 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
    */
   expandedItems: _propTypes.default.arrayOf(_propTypes.default.string),
   /**
-   * Used to determine the string label for a given item.
+   * Used to determine the id of a given item.
    *
    * @template R
    * @param {R} item The item to check.
    * @returns {string} The id of the item.
-   * @default `(item) => item.id`
+   * @default (item) => item.id
    */
   getItemId: _propTypes.default.func,
   /**
@@ -197,7 +199,7 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
    * @template R
    * @param {R} item The item to check.
    * @returns {string} The label of the item.
-   * @default `(item) => item.label`
+   * @default (item) => item.label
    */
   getItemLabel: _propTypes.default.func,
   /**

package/node/SimpleTreeView/SimpleTreeView.js

@@ -37,7 +37,8 @@ const SimpleTreeViewRoot = exports.SimpleTreeViewRoot = (0, _styles.styled)('ul'
   padding: 0,
   margin: 0,
   listStyle: 'none',
-  outline: 0
+  outline: 0,
+  position: 'relative'
 });
 const EMPTY_ITEMS = [];
 const itemsPropWarning = (0, _warning.buildWarning)(['MUI X: The `SimpleTreeView` 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/']);
@@ -105,7 +106,8 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
   apiRef: _propTypes.default.shape({
     current: _propTypes.default.shape({
       focusItem: _propTypes.default.func.isRequired,
-      getItem: _propTypes.default.func.isRequired
+      getItem: _propTypes.default.func.isRequired,
+      setItemExpansion: _propTypes.default.func.isRequired
     })
   }),
   /**

package/node/TreeView/TreeView.js

@@ -79,7 +79,8 @@ process.env.NODE_ENV !== "production" ? TreeView.propTypes = {
   apiRef: _propTypes.default.shape({
     current: _propTypes.default.shape({
       focusItem: _propTypes.default.func.isRequired,
-      getItem: _propTypes.default.func.isRequired
+      getItem: _propTypes.default.func.isRequired,
+      setItemExpansion: _propTypes.default.func.isRequired
     })
   }),
   /**

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-tree-view v7.1.0
+ * @mui/x-tree-view v7.1.1
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/internals/index.js

@@ -15,19 +15,89 @@ Object.defineProperty(exports, "TreeViewProvider", {
     return _TreeViewProvider.TreeViewProvider;
   }
 });
+Object.defineProperty(exports, "buildWarning", {
+  enumerable: true,
+  get: function () {
+    return _warning.buildWarning;
+  }
+});
 Object.defineProperty(exports, "extractPluginParamsFromProps", {
   enumerable: true,
   get: function () {
     return _extractPluginParamsFromProps.extractPluginParamsFromProps;
   }
 });
+Object.defineProperty(exports, "unstable_resetCleanupTracking", {
+  enumerable: true,
+  get: function () {
+    return _useInstanceEventHandler.unstable_resetCleanupTracking;
+  }
+});
 Object.defineProperty(exports, "useTreeView", {
   enumerable: true,
   get: function () {
     return _useTreeView.useTreeView;
   }
 });
+Object.defineProperty(exports, "useTreeViewExpansion", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewExpansion.useTreeViewExpansion;
+  }
+});
+Object.defineProperty(exports, "useTreeViewFocus", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewFocus.useTreeViewFocus;
+  }
+});
+Object.defineProperty(exports, "useTreeViewIcons", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewIcons.useTreeViewIcons;
+  }
+});
+Object.defineProperty(exports, "useTreeViewId", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewId.useTreeViewId;
+  }
+});
+Object.defineProperty(exports, "useTreeViewItems", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewItems.useTreeViewItems;
+  }
+});
+Object.defineProperty(exports, "useTreeViewJSXItems", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewJSXItems.useTreeViewJSXItems;
+  }
+});
+Object.defineProperty(exports, "useTreeViewKeyboardNavigation", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewKeyboardNavigation.useTreeViewKeyboardNavigation;
+  }
+});
+Object.defineProperty(exports, "useTreeViewSelection", {
+  enumerable: true,
+  get: function () {
+    return _useTreeViewSelection.useTreeViewSelection;
+  }
+});
 var _useTreeView = require("./useTreeView");
 var _TreeViewProvider = require("./TreeViewProvider");
+var _useInstanceEventHandler = require("./hooks/useInstanceEventHandler");
 var _defaultPlugins = require("./plugins/defaultPlugins");
+var _useTreeViewExpansion = require("./plugins/useTreeViewExpansion");
+var _useTreeViewSelection = require("./plugins/useTreeViewSelection");
+var _useTreeViewFocus = require("./plugins/useTreeViewFocus");
+var _useTreeViewKeyboardNavigation = require("./plugins/useTreeViewKeyboardNavigation");
+var _useTreeViewId = require("./plugins/useTreeViewId");
+var _useTreeViewIcons = require("./plugins/useTreeViewIcons");
+var _useTreeViewItems = require("./plugins/useTreeViewItems");
+var _useTreeViewJSXItems = require("./plugins/useTreeViewJSXItems");
+var _warning = require("./utils/warning");
 var _extractPluginParamsFromProps = require("./utils/extractPluginParamsFromProps");

package/node/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js

@@ -13,30 +13,40 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useTreeViewExpansion = ({
   instance,
+  publicAPI,
   params,
   models
 }) => {
+  const expandedItemsMap = React.useMemo(() => {
+    const temp = new Map();
+    models.expandedItems.value.forEach(id => {
+      temp.set(id, true);
+    });
+    return temp;
+  }, [models.expandedItems.value]);
   const setExpandedItems = (event, value) => {
     params.onExpandedItemsChange?.(event, value);
     models.expandedItems.setControlledValue(value);
   };
-  const isItemExpanded = React.useCallback(itemId => {
-    return Array.isArray(models.expandedItems.value) ? models.expandedItems.value.indexOf(itemId) !== -1 : false;
-  }, [models.expandedItems.value]);
+  const isItemExpanded = React.useCallback(itemId => expandedItemsMap.has(itemId), [expandedItemsMap]);
   const isItemExpandable = React.useCallback(itemId => !!instance.getNode(itemId)?.expandable, [instance]);
   const toggleItemExpansion = (0, _useEventCallback.default)((event, itemId) => {
-    if (itemId == null) {
+    const isExpandedBefore = instance.isItemExpanded(itemId);
+    instance.setItemExpansion(event, itemId, !isExpandedBefore);
+  });
+  const setItemExpansion = (0, _useEventCallback.default)((event, itemId, isExpanded) => {
+    const isExpandedBefore = instance.isItemExpanded(itemId);
+    if (isExpandedBefore === isExpanded) {
       return;
     }
-    const isExpandedBefore = models.expandedItems.value.indexOf(itemId) !== -1;
     let newExpanded;
-    if (isExpandedBefore) {
-      newExpanded = models.expandedItems.value.filter(id => id !== itemId);
-    } else {
+    if (isExpanded) {
       newExpanded = [itemId].concat(models.expandedItems.value);
+    } else {
+      newExpanded = models.expandedItems.value.filter(id => id !== itemId);
     }
     if (params.onItemExpansionToggle) {
-      params.onItemExpansionToggle(event, itemId, !isExpandedBefore);
+      params.onItemExpansionToggle(event, itemId, isExpanded);
     }
     setExpandedItems(event, newExpanded);
   });
@@ -57,9 +67,13 @@ const useTreeViewExpansion = ({
   (0, _useTreeView.populateInstance)(instance, {
     isItemExpanded,
     isItemExpandable,
+    setItemExpansion,
     toggleItemExpansion,
     expandAllSiblings
   });
+  (0, _useTreeView.populatePublicAPI)(publicAPI, {
+    setItemExpansion
+  });
 };
 exports.useTreeViewExpansion = useTreeViewExpansion;
 useTreeViewExpansion.models = {

package/node/internals/plugins/useTreeViewItems/useTreeViewItems.js

@@ -25,7 +25,7 @@ const updateItemsState = ({
       throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', 'An item was provided without id in the `items` prop:', JSON.stringify(item)].join('\n'));
     }
     if (nodeMap[id] != null) {
-      throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Tow items were provided with the same id in the \`items\` prop: "${id}"`].join('\n'));
+      throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Two items were provided with the same id in the \`items\` prop: "${id}"`].join('\n'));
     }
     const label = getItemLabel ? getItemLabel(item) : item.label;
     if (label == null) {

package/node/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js

@@ -24,7 +24,7 @@ const useTreeViewJSXItems = ({
   const insertJSXItem = (0, _useEventCallback.default)(item => {
     setState(prevState => {
       if (prevState.items.nodeMap[item.id] != null) {
-        throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Tow items were provided with the same id in the \`items\` prop: "${item.id}"`].join('\n'));
+        throw new Error(['MUI X: The Tree View component requires all items to have a unique `id` property.', 'Alternatively, you can use the `getItemId` prop to specify a custom id for each item.', `Two items were provided with the same id in the \`items\` prop: "${item.id}"`].join('\n'));
       }
       return (0, _extends2.default)({}, prevState, {
         items: (0, _extends2.default)({}, prevState.items, {

package/node/internals/useTreeView/useTreeViewModels.js

@@ -31,7 +31,7 @@ const useTreeViewModels = (plugins, props) => {
     return initialState;
   });
   const models = Object.fromEntries(Object.entries(modelsRef.current).map(([modelName, model]) => {
-    const value = model.isControlled ? props[modelName] : modelsState[modelName];
+    const value = props[modelName] ?? modelsState[modelName];
     return [modelName, {
       value,
       setControlledValue: newValue => {
@@ -62,7 +62,7 @@ const useTreeViewModels = (plugins, props) => {
         if (!model.isControlled && defaultValue !== newDefaultValue) {
           console.error([`MUI X: A component is changing the default ${modelName} state of an uncontrolled TreeView after being initialized. ` + `To suppress this warning opt to use a controlled TreeView.`].join('\n'));
         }
-      }, [JSON.stringify(defaultValue)]);
+      }, [JSON.stringify(newDefaultValue)]);
     });
   }
   /* eslint-enable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mui/x-tree-view",
-  "version": "7.1.0",
-  "description": "The community edition of the tree view components (MUI X).",
+  "version": "7.1.1",
+  "description": "The community edition of the Tree View components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
   "license": "MIT",