@mui/x-tree-view 7.14.0 → 7.16.0

package/modern/TreeItem/TreeItemContent.js

@@ -5,9 +5,9 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import Checkbox from '@mui/material/Checkbox';
-import { useTreeItemState } from './useTreeItemState';
-import { TreeItem2DragAndDropOverlay } from '../TreeItem2DragAndDropOverlay';
-import { TreeItem2LabelInput } from '../TreeItem2LabelInput';
+import { useTreeItemState } from "./useTreeItemState.js";
+import { TreeItem2DragAndDropOverlay } from "../TreeItem2DragAndDropOverlay/index.js";
+import { TreeItem2LabelInput } from "../TreeItem2LabelInput/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * @ignore - internal component.
@@ -42,9 +42,7 @@ const TreeItemContent = /*#__PURE__*/React.forwardRef(function TreeItemContent(p
     handleContentClick,
     preventSelection,
     expansionTrigger,
-    toggleItemEditing,
-    handleSaveItemLabel,
-    handleCancelItemLabelEditing
+    toggleItemEditing
   } = useTreeItemState(itemId);
   const icon = iconProp || expansionIcon || displayIcon;
   const checkboxRef = React.useRef(null);
@@ -75,25 +73,6 @@ const TreeItemContent = /*#__PURE__*/React.forwardRef(function TreeItemContent(p
     }
     toggleItemEditing();
   };
-  const handleLabelInputBlur = event => {
-    if (event.defaultMuiPrevented) {
-      return;
-    }
-    if (event.target.value) {
-      handleSaveItemLabel(event, event.target.value);
-    }
-  };
-  const handleLabelInputKeydown = event => {
-    if (event.defaultMuiPrevented) {
-      return;
-    }
-    const target = event.target;
-    if (event.key === 'Enter' && target.value) {
-      handleSaveItemLabel(event, target.value);
-    } else if (event.key === 'Escape') {
-      handleCancelItemLabelEditing(event);
-    }
-  };
   return (
     /*#__PURE__*/
     /* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions -- Key event is handled by the TreeView */
@@ -113,9 +92,7 @@ const TreeItemContent = /*#__PURE__*/React.forwardRef(function TreeItemContent(p
         ref: checkboxRef,
         tabIndex: -1
       }), editing ? /*#__PURE__*/_jsx(TreeItem2LabelInput, _extends({}, labelInputProps, {
-        className: classes.labelInput,
-        onBlur: handleLabelInputBlur,
-        onKeyDown: handleLabelInputKeydown
+        className: classes.labelInput
       })) : /*#__PURE__*/_jsx("div", _extends({
         className: classes.label
       }, editable && {
@@ -160,6 +137,14 @@ process.env.NODE_ENV !== "production" ? TreeItemContent.propTypes = {
    * The tree item label.
    */
   label: PropTypes.node,
-  labelInputProps: PropTypes.object
+  labelInputProps: PropTypes.shape({
+    autoFocus: PropTypes.oneOf([true]),
+    'data-element': PropTypes.oneOf(['labelInput']),
+    onBlur: PropTypes.func,
+    onChange: PropTypes.func,
+    onKeyDown: PropTypes.func,
+    type: PropTypes.oneOf(['text']),
+    value: PropTypes.string
+  })
 } : void 0;
 export { TreeItemContent };

package/modern/TreeItem/index.js

@@ -1,4 +1,4 @@
-export { TreeItem } from './TreeItem';
-export * from './treeItemClasses';
-export * from './useTreeItemState';
-export { TreeItemContent } from './TreeItemContent';
+export { TreeItem } from "./TreeItem.js";
+export * from "./treeItemClasses.js";
+export * from "./useTreeItemState.js";
+export { TreeItemContent } from "./TreeItemContent.js";

package/modern/TreeItem/useTreeItemState.js

@@ -1,6 +1,6 @@
-import { useTreeViewContext } from '../internals/TreeViewProvider';
-import { useTreeViewLabel } from '../internals/plugins/useTreeViewLabel';
-import { hasPlugin } from '../internals/utils/plugins';
+import { useTreeViewContext } from "../internals/TreeViewProvider/index.js";
+import { useTreeViewLabel } from "../internals/plugins/useTreeViewLabel/index.js";
+import { hasPlugin } from "../internals/utils/plugins.js";
 export function useTreeItemState(itemId) {
   const {
     instance,

package/modern/TreeItem2/TreeItem2.js

@@ -12,13 +12,13 @@ import MuiCheckbox from '@mui/material/Checkbox';
 import useSlotProps from '@mui/utils/useSlotProps';
 import { shouldForwardProp } from '@mui/system/createStyled';
 import composeClasses from '@mui/utils/composeClasses';
-import { styled, createUseThemeProps } from '../internals/zero-styled';
-import { unstable_useTreeItem2 as useTreeItem2 } from '../useTreeItem2';
-import { getTreeItemUtilityClass } from '../TreeItem';
-import { TreeItem2Icon } from '../TreeItem2Icon';
-import { TreeItem2DragAndDropOverlay } from '../TreeItem2DragAndDropOverlay';
-import { TreeItem2Provider } from '../TreeItem2Provider';
-import { TreeItem2LabelInput } from '../TreeItem2LabelInput';
+import { styled, createUseThemeProps } from "../internals/zero-styled/index.js";
+import { unstable_useTreeItem2 as useTreeItem2 } from "../useTreeItem2/index.js";
+import { getTreeItemUtilityClass } from "../TreeItem/index.js";
+import { TreeItem2Icon } from "../TreeItem2Icon/index.js";
+import { TreeItem2DragAndDropOverlay } from "../TreeItem2DragAndDropOverlay/index.js";
+import { TreeItem2Provider } from "../TreeItem2Provider/index.js";
+import { TreeItem2LabelInput } from "../TreeItem2LabelInput/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useThemeProps = createUseThemeProps('MuiTreeItem2');
 export const TreeItem2Root = styled('li', {
@@ -158,7 +158,7 @@ export const TreeItem2GroupTransition = styled(Collapse, {
     }
   }]
 });
-export const TreeItem2Checkbox = styled( /*#__PURE__*/React.forwardRef((props, ref) => {
+export const TreeItem2Checkbox = styled(/*#__PURE__*/React.forwardRef((props, ref) => {
   const {
       visible
     } = props,

package/modern/TreeItem2/index.js

@@ -1 +1 @@
-export { TreeItem2, TreeItem2Root, TreeItem2Content, TreeItem2IconContainer, TreeItem2GroupTransition, TreeItem2Checkbox, TreeItem2Label } from './TreeItem2';
+export { TreeItem2, TreeItem2Root, TreeItem2Content, TreeItem2IconContainer, TreeItem2GroupTransition, TreeItem2Checkbox, TreeItem2Label } from "./TreeItem2.js";

package/modern/TreeItem2DragAndDropOverlay/TreeItem2DragAndDropOverlay.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { alpha } from '@mui/material/styles';
 import { shouldForwardProp } from '@mui/system';
-import { styled } from '../internals/zero-styled';
+import { styled } from "../internals/zero-styled/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const TreeItem2DragAndDropOverlayRoot = styled('div', {
   name: 'MuiTreeItem2DragAndDropOverlay',

package/modern/TreeItem2DragAndDropOverlay/index.js

@@ -1 +1 @@
-export { TreeItem2DragAndDropOverlay } from './TreeItem2DragAndDropOverlay';
+export { TreeItem2DragAndDropOverlay } from "./TreeItem2DragAndDropOverlay.js";

package/modern/TreeItem2Icon/TreeItem2Icon.js

@@ -3,8 +3,8 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import resolveComponentProps from '@mui/utils/resolveComponentProps';
 import useSlotProps from '@mui/utils/useSlotProps';
-import { useTreeViewContext } from '../internals/TreeViewProvider';
-import { TreeViewCollapseIcon, TreeViewExpandIcon } from '../icons';
+import { useTreeViewContext } from "../internals/TreeViewProvider/index.js";
+import { TreeViewCollapseIcon, TreeViewExpandIcon } from "../icons/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 function TreeItem2Icon(props) {
   const {

package/modern/TreeItem2Icon/index.js

@@ -1 +1 @@
-export { TreeItem2Icon } from './TreeItem2Icon';
+export { TreeItem2Icon } from "./TreeItem2Icon.js";

package/modern/TreeItem2LabelInput/TreeItem2LabelInput.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import { styled } from '../internals/zero-styled';
+import { styled } from "../internals/zero-styled/index.js";
 const TreeItem2LabelInput = styled('input', {
   name: 'MuiTreeItem2',
   slot: 'LabelInput',

package/modern/TreeItem2LabelInput/index.js

@@ -1 +1 @@
-export { TreeItem2LabelInput } from './TreeItem2LabelInput';
+export { TreeItem2LabelInput } from "./TreeItem2LabelInput.js";

package/modern/TreeItem2Provider/TreeItem2Provider.js

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { useTreeViewContext } from '../internals/TreeViewProvider';
+import { useTreeViewContext } from "../internals/TreeViewProvider/index.js";
 function TreeItem2Provider(props) {
   const {
     children,

package/modern/TreeItem2Provider/index.js

@@ -1 +1 @@
-export { TreeItem2Provider } from './TreeItem2Provider';
+export { TreeItem2Provider } from "./TreeItem2Provider.js";

package/modern/TreeView/TreeView.js

@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import composeClasses from '@mui/utils/composeClasses';
-import { styled, createUseThemeProps } from '../internals/zero-styled';
-import { getTreeViewUtilityClass } from './treeViewClasses';
-import { SimpleTreeView, SimpleTreeViewRoot } from '../SimpleTreeView';
+import { styled, createUseThemeProps } from "../internals/zero-styled/index.js";
+import { getTreeViewUtilityClass } from "./treeViewClasses.js";
+import { SimpleTreeView, SimpleTreeViewRoot } from "../SimpleTreeView/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useThemeProps = createUseThemeProps('MuiTreeView');
 const useUtilityClasses = ownerState => {

package/modern/TreeView/index.js

@@ -1,3 +1,3 @@
-export * from './TreeView';
-export * from './treeViewClasses';
+export * from "./TreeView.js";
+export * from "./treeViewClasses.js";
 export {};

package/modern/hooks/index.js

@@ -1,2 +1,2 @@
-export { useTreeViewApiRef } from './useTreeViewApiRef';
-export { useTreeItem2Utils } from './useTreeItem2Utils';
+export { useTreeViewApiRef } from "./useTreeViewApiRef.js";
+export { useTreeItem2Utils } from "./useTreeItem2Utils/index.js";

package/modern/hooks/useTreeItem2Utils/index.js

@@ -1 +1 @@
-export { useTreeItem2Utils } from './useTreeItem2Utils';
+export { useTreeItem2Utils } from "./useTreeItem2Utils.js";

package/modern/hooks/useTreeItem2Utils/useTreeItem2Utils.js

@@ -1,6 +1,6 @@
-import { useTreeViewContext } from '../../internals/TreeViewProvider';
-import { useTreeViewLabel } from '../../internals/plugins/useTreeViewLabel';
-import { hasPlugin } from '../../internals/utils/plugins';
+import { useTreeViewContext } from "../../internals/TreeViewProvider/index.js";
+import { useTreeViewLabel } from "../../internals/plugins/useTreeViewLabel/index.js";
+import { hasPlugin } from "../../internals/utils/plugins.js";
 const isItemExpandable = reactChildren => {
   if (Array.isArray(reactChildren)) {
     return reactChildren.length > 0 && reactChildren.some(isItemExpandable);

package/modern/icons/icons.js

@@ -1,9 +1,9 @@
 import { createSvgIcon } from '@mui/material/utils';
 import * as React from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
-export const TreeViewExpandIcon = createSvgIcon( /*#__PURE__*/_jsx("path", {
+export const TreeViewExpandIcon = createSvgIcon(/*#__PURE__*/_jsx("path", {
   d: "M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
 }), 'TreeViewExpandIcon');
-export const TreeViewCollapseIcon = createSvgIcon( /*#__PURE__*/_jsx("path", {
+export const TreeViewCollapseIcon = createSvgIcon(/*#__PURE__*/_jsx("path", {
   d: "M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
 }), 'TreeViewCollapseIcon');

package/modern/icons/index.js

@@ -1 +1 @@
-export * from './icons';
+export * from "./icons.js";

package/modern/index.js

@@ -1,22 +1,22 @@
 /**
- * @mui/x-tree-view v7.14.0
+ * @mui/x-tree-view v7.16.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
 // Tree View
-export * from './TreeView';
-export * from './SimpleTreeView';
-export * from './RichTreeView';
+export * from "./TreeView/index.js";
+export * from "./SimpleTreeView/index.js";
+export * from "./RichTreeView/index.js";
 
 // Tree Item
-export * from './TreeItem';
-export * from './TreeItem2';
-export * from './useTreeItem2';
-export * from './TreeItem2Icon';
-export * from './TreeItem2Provider';
-export { unstable_resetCleanupTracking } from './internals/hooks/useInstanceEventHandler';
-export * from './models';
-export * from './icons';
-export * from './hooks';
+export * from "./TreeItem/index.js";
+export * from "./TreeItem2/index.js";
+export * from "./useTreeItem2/index.js";
+export * from "./TreeItem2Icon/index.js";
+export * from "./TreeItem2Provider/index.js";
+export { unstable_resetCleanupTracking } from "./internals/hooks/useInstanceEventHandler.js";
+export * from "./models/index.js";
+export * from "./icons/index.js";
+export * from "./hooks/index.js";

package/modern/internals/TreeViewItemDepthContext/index.js

@@ -1 +1 @@
-export { TreeViewItemDepthContext } from './TreeViewItemDepthContext';
+export { TreeViewItemDepthContext } from "./TreeViewItemDepthContext.js";

package/modern/internals/TreeViewProvider/TreeViewChildrenItemProvider.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { useTreeViewContext } from './useTreeViewContext';
-import { escapeOperandAttributeSelector } from '../utils/utils';
+import { useTreeViewContext } from "./useTreeViewContext.js";
+import { escapeOperandAttributeSelector } from "../utils/utils.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const TreeViewChildrenItemContext = /*#__PURE__*/React.createContext(null);
 if (process.env.NODE_ENV !== 'production') {

package/modern/internals/TreeViewProvider/TreeViewProvider.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TreeViewContext } from './TreeViewContext';
+import { TreeViewContext } from "./TreeViewContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Sets up the contexts for the underlying TreeItem components.

package/modern/internals/TreeViewProvider/index.js

@@ -1,2 +1,2 @@
-export { TreeViewProvider } from './TreeViewProvider';
-export { useTreeViewContext } from './useTreeViewContext';
+export { TreeViewProvider } from "./TreeViewProvider.js";
+export { useTreeViewContext } from "./useTreeViewContext.js";

package/modern/internals/TreeViewProvider/useTreeViewContext.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TreeViewContext } from './TreeViewContext';
+import { TreeViewContext } from "./TreeViewContext.js";
 export const useTreeViewContext = () => {
   const context = React.useContext(TreeViewContext);
   if (context == null) {

package/modern/internals/corePlugins/corePlugins.js

@@ -1,6 +1,6 @@
-import { useTreeViewInstanceEvents } from './useTreeViewInstanceEvents';
-import { useTreeViewOptionalPlugins } from './useTreeViewOptionalPlugins';
-import { useTreeViewId } from './useTreeViewId';
+import { useTreeViewInstanceEvents } from "./useTreeViewInstanceEvents/index.js";
+import { useTreeViewOptionalPlugins } from "./useTreeViewOptionalPlugins/index.js";
+import { useTreeViewId } from "./useTreeViewId/index.js";
 /**
  * Internal plugins that create the tools used by the other plugins.
  * These plugins are used by the tree view components.

package/modern/internals/corePlugins/index.js

@@ -1 +1 @@
-export { TREE_VIEW_CORE_PLUGINS } from './corePlugins';
+export { TREE_VIEW_CORE_PLUGINS } from "./corePlugins.js";

package/modern/internals/corePlugins/useTreeViewId/index.js

@@ -1 +1 @@
-export { useTreeViewId } from './useTreeViewId';
+export { useTreeViewId } from "./useTreeViewId.js";

package/modern/internals/corePlugins/useTreeViewInstanceEvents/index.js

@@ -1 +1 @@
-export { useTreeViewInstanceEvents } from './useTreeViewInstanceEvents';
+export { useTreeViewInstanceEvents } from "./useTreeViewInstanceEvents.js";

package/modern/internals/corePlugins/useTreeViewOptionalPlugins/index.js

@@ -1 +1 @@
-export { useTreeViewOptionalPlugins } from './useTreeViewOptionalPlugins';
+export { useTreeViewOptionalPlugins } from "./useTreeViewOptionalPlugins.js";

package/modern/internals/hooks/useInstanceEventHandler.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { TimerBasedCleanupTracking } from '../utils/cleanupTracking/TimerBasedCleanupTracking';
-import { FinalizationRegistryBasedCleanupTracking } from '../utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking';
+import { TimerBasedCleanupTracking } from "../utils/cleanupTracking/TimerBasedCleanupTracking.js";
+import { FinalizationRegistryBasedCleanupTracking } from "../utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js";
 // We use class to make it easier to detect in heap snapshots by name
 class ObjectToBeRetainedByReact {}
 

package/modern/internals/index.js

@@ -1,17 +1,17 @@
-export { useTreeView } from './useTreeView';
-export { TreeViewProvider, useTreeViewContext } from './TreeViewProvider';
-export { unstable_resetCleanupTracking } from './hooks/useInstanceEventHandler';
+export { useTreeView } from "./useTreeView/index.js";
+export { TreeViewProvider, useTreeViewContext } from "./TreeViewProvider/index.js";
+export { unstable_resetCleanupTracking } from "./hooks/useInstanceEventHandler.js";
 
 // Core plugins
 
 // Plugins
-export { useTreeViewExpansion } from './plugins/useTreeViewExpansion';
-export { useTreeViewSelection } from './plugins/useTreeViewSelection';
-export { useTreeViewFocus } from './plugins/useTreeViewFocus';
-export { useTreeViewKeyboardNavigation } from './plugins/useTreeViewKeyboardNavigation';
-export { useTreeViewIcons } from './plugins/useTreeViewIcons';
-export { useTreeViewItems, buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from './plugins/useTreeViewItems';
-export { useTreeViewLabel } from './plugins/useTreeViewLabel';
-export { useTreeViewJSXItems } from './plugins/useTreeViewJSXItems';
-export { isTargetInDescendants } from './utils/tree';
-export { warnOnce } from './utils/warning';
+export { useTreeViewExpansion } from "./plugins/useTreeViewExpansion/index.js";
+export { useTreeViewSelection } from "./plugins/useTreeViewSelection/index.js";
+export { useTreeViewFocus } from "./plugins/useTreeViewFocus/index.js";
+export { useTreeViewKeyboardNavigation } from "./plugins/useTreeViewKeyboardNavigation/index.js";
+export { useTreeViewIcons } from "./plugins/useTreeViewIcons/index.js";
+export { useTreeViewItems, buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "./plugins/useTreeViewItems/index.js";
+export { useTreeViewLabel } from "./plugins/useTreeViewLabel/index.js";
+export { useTreeViewJSXItems } from "./plugins/useTreeViewJSXItems/index.js";
+export { isTargetInDescendants } from "./utils/tree.js";
+export { warnOnce } from "./utils/warning.js";

package/modern/internals/models/index.js

@@ -1,5 +1,5 @@
-export * from './helpers';
-export * from './plugin';
-export * from './itemPlugin';
-export * from './treeView';
-export * from './MuiCancellableEvent';
+export * from "./helpers.js";
+export * from "./plugin.js";
+export * from "./itemPlugin.js";
+export * from "./treeView.js";
+export * from "./MuiCancellableEvent.js";

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

@@ -1 +1 @@
-export { useTreeViewExpansion } from './useTreeViewExpansion';
+export { useTreeViewExpansion } from "./useTreeViewExpansion.js";

package/modern/internals/plugins/useTreeViewFocus/index.js

@@ -1 +1 @@
-export { useTreeViewFocus } from './useTreeViewFocus';
+export { useTreeViewFocus } from "./useTreeViewFocus.js";

package/modern/internals/plugins/useTreeViewFocus/useTreeViewFocus.js

@@ -2,10 +2,10 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
 import ownerDocument from '@mui/utils/ownerDocument';
-import { useInstanceEventHandler } from '../../hooks/useInstanceEventHandler';
-import { getActiveElement } from '../../utils/utils';
-import { getFirstNavigableItem } from '../../utils/tree';
-import { convertSelectedItemsToArray } from '../useTreeViewSelection/useTreeViewSelection.utils';
+import { useInstanceEventHandler } from "../../hooks/useInstanceEventHandler.js";
+import { getActiveElement } from "../../utils/utils.js";
+import { getFirstNavigableItem } from "../../utils/tree.js";
+import { convertSelectedItemsToArray } from "../useTreeViewSelection/useTreeViewSelection.utils.js";
 const useDefaultFocusableItemId = (instance, selectedItems) => {
   let tabbableItemId = convertSelectedItemsToArray(selectedItems).find(itemId => {
     if (!instance.isItemNavigable(itemId)) {

package/modern/internals/plugins/useTreeViewIcons/index.js

@@ -1 +1 @@
-export { useTreeViewIcons } from './useTreeViewIcons';
+export { useTreeViewIcons } from "./useTreeViewIcons.js";

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

@@ -1,2 +1,2 @@
-export { useTreeViewItems } from './useTreeViewItems';
-export { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from './useTreeViewItems.utils';
+export { useTreeViewItems } from "./useTreeViewItems.js";
+export { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "./useTreeViewItems.utils.js";

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

@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["children"];
 import * as React from 'react';
-import { publishTreeViewEvent } from '../../utils/publishTreeViewEvent';
-import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from './useTreeViewItems.utils';
-import { TreeViewItemDepthContext } from '../../TreeViewItemDepthContext';
+import { publishTreeViewEvent } from "../../utils/publishTreeViewEvent.js";
+import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "./useTreeViewItems.utils.js";
+import { TreeViewItemDepthContext } from "../../TreeViewItemDepthContext/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const updateItemsState = ({
   items,

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

@@ -1 +1 @@
-export { useTreeViewJSXItems } from './useTreeViewJSXItems';
+export { useTreeViewJSXItems } from "./useTreeViewJSXItems.js";

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

@@ -3,11 +3,11 @@ import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
 import useForkRef from '@mui/utils/useForkRef';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
-import { publishTreeViewEvent } from '../../utils/publishTreeViewEvent';
-import { useTreeViewContext } from '../../TreeViewProvider';
-import { TreeViewChildrenItemContext, TreeViewChildrenItemProvider } from '../../TreeViewProvider/TreeViewChildrenItemProvider';
-import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from '../useTreeViewItems/useTreeViewItems.utils';
-import { TreeViewItemDepthContext } from '../../TreeViewItemDepthContext';
+import { publishTreeViewEvent } from "../../utils/publishTreeViewEvent.js";
+import { useTreeViewContext } from "../../TreeViewProvider/index.js";
+import { TreeViewChildrenItemContext, TreeViewChildrenItemProvider } from "../../TreeViewProvider/TreeViewChildrenItemProvider.js";
+import { buildSiblingIndexes, TREE_VIEW_ROOT_PARENT_ID } from "../useTreeViewItems/useTreeViewItems.utils.js";
+import { TreeViewItemDepthContext } from "../../TreeViewItemDepthContext/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const useTreeViewJSXItems = ({
   instance,

package/modern/internals/plugins/useTreeViewKeyboardNavigation/index.js

@@ -1 +1 @@
-export { useTreeViewKeyboardNavigation } from './useTreeViewKeyboardNavigation';
+export { useTreeViewKeyboardNavigation } from "./useTreeViewKeyboardNavigation.js";

package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { useRtl } from '@mui/system/RtlProvider';
 import useEventCallback from '@mui/utils/useEventCallback';
-import { getFirstNavigableItem, getLastNavigableItem, getNextNavigableItem, getPreviousNavigableItem, isTargetInDescendants } from '../../utils/tree';
-import { hasPlugin } from '../../utils/plugins';
-import { useTreeViewLabel } from '../useTreeViewLabel';
+import { getFirstNavigableItem, getLastNavigableItem, getNextNavigableItem, getPreviousNavigableItem, isTargetInDescendants } from "../../utils/tree.js";
+import { hasPlugin } from "../../utils/plugins.js";
+import { useTreeViewLabel } from "../useTreeViewLabel/index.js";
 function isPrintableCharacter(string) {
   return !!string && string.length === 1 && !!string.match(/\S/);
 }

package/modern/internals/plugins/useTreeViewLabel/index.js

@@ -1 +1 @@
-export { useTreeViewLabel } from './useTreeViewLabel';
+export { useTreeViewLabel } from "./useTreeViewLabel.js";

package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.itemPlugin.js

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { useTreeViewContext } from '../../TreeViewProvider';
-export const isAndroid = () => navigator.userAgent.toLowerCase().includes('android');
+import { useTreeViewContext } from "../../TreeViewProvider/index.js";
 export const useTreeViewLabelItemPlugin = ({
   props
 }) => {
@@ -21,12 +20,34 @@ export const useTreeViewLabelItemPlugin = ({
   return {
     propsEnhancers: {
       labelInput: ({
-        externalEventHandlers
+        externalEventHandlers,
+        interactions
       }) => {
         const editable = instance.isItemEditable(itemId);
         if (!editable) {
           return {};
         }
+        const handleKeydown = event => {
+          externalEventHandlers.onKeyDown?.(event);
+          if (event.defaultMuiPrevented) {
+            return;
+          }
+          const target = event.target;
+          if (event.key === 'Enter' && target.value) {
+            interactions.handleSaveItemLabel(event, target.value);
+          } else if (event.key === 'Escape') {
+            interactions.handleCancelItemLabelEditing(event);
+          }
+        };
+        const handleBlur = event => {
+          externalEventHandlers.onBlur?.(event);
+          if (event.defaultMuiPrevented) {
+            return;
+          }
+          if (event.target.value) {
+            interactions.handleSaveItemLabel(event, event.target.value);
+          }
+        };
         const handleInputChange = event => {
           externalEventHandlers.onChange?.(event);
           setLabelInputValue(event.target.value);
@@ -35,6 +56,8 @@ export const useTreeViewLabelItemPlugin = ({
           value: labelInputValue ?? '',
           'data-element': 'labelInput',
           onChange: handleInputChange,
+          onKeyDown: handleKeydown,
+          onBlur: handleBlur,
           autoFocus: true,
           type: 'text'
         };

package/modern/internals/plugins/useTreeViewLabel/useTreeViewLabel.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { warnOnce } from '../../utils/warning';
-import { useTreeViewLabelItemPlugin } from './useTreeViewLabel.itemPlugin';
+import { warnOnce } from "../../utils/warning.js";
+import { useTreeViewLabelItemPlugin } from "./useTreeViewLabel.itemPlugin.js";
 export const useTreeViewLabel = ({
   instance,
   state,

package/modern/internals/plugins/useTreeViewSelection/index.js

@@ -1 +1 @@
-export { useTreeViewSelection } from './useTreeViewSelection';
+export { useTreeViewSelection } from "./useTreeViewSelection.js";

package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { findOrderInTremauxTree, getAllNavigableItems, getFirstNavigableItem, getLastNavigableItem, getNonDisabledItemsInRange } from '../../utils/tree';
-import { convertSelectedItemsToArray, getLookupFromArray } from './useTreeViewSelection.utils';
+import { findOrderInTremauxTree, getAllNavigableItems, getFirstNavigableItem, getLastNavigableItem, getNonDisabledItemsInRange } from "../../utils/tree.js";
+import { convertSelectedItemsToArray, getLookupFromArray } from "./useTreeViewSelection.utils.js";
 export const useTreeViewSelection = ({
   instance,
   params,

package/modern/internals/useTreeView/index.js

@@ -1 +1 @@
-export { useTreeView } from './useTreeView';
+export { useTreeView } from "./useTreeView.js";