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

package/{useTreeItem2/useTreeItem2.types.d.ts → useTreeItem/useTreeItem.types.d.ts}

@@ -7,7 +7,7 @@ import { UseTreeViewFocusSignature } from '../internals/plugins/useTreeViewFocus
 import { UseTreeViewKeyboardNavigationSignature } from '../internals/plugins/useTreeViewKeyboardNavigation';
 import { UseTreeViewLabelSignature } from '../internals/plugins/useTreeViewLabel';
 import { UseTreeViewExpansionSignature } from '../internals/plugins/useTreeViewExpansion';
-export interface UseTreeItem2Parameters {
+export interface UseTreeItemParameters {
     /**
      * The id attribute of the item. If not provided, it will be generated.
      */
@@ -32,7 +32,7 @@ export interface UseTreeItem2Parameters {
      */
     children?: React.ReactNode;
 }
-export interface UseTreeItem2RootSlotPropsFromUseTreeItem {
+export interface UseTreeItemRootSlotPropsFromUseTreeItem {
     role: 'treeitem';
     tabIndex: 0 | -1;
     id: string;
@@ -43,32 +43,25 @@ export interface UseTreeItem2RootSlotPropsFromUseTreeItem {
     onBlur: TreeViewCancellableEventHandler<React.FocusEvent<HTMLElement>>;
     onKeyDown: TreeViewCancellableEventHandler<React.KeyboardEvent<HTMLElement>>;
     ref: React.RefCallback<HTMLLIElement>;
-    /**
-     * Only defined when the `indentationAtItemLevel` experimental feature is enabled.
-     */
-    style?: React.CSSProperties;
+    style: React.CSSProperties;
 }
-export interface UseTreeItem2RootSlotOwnProps extends UseTreeItem2RootSlotPropsFromUseTreeItem {
+export interface UseTreeItemRootSlotOwnProps extends UseTreeItemRootSlotPropsFromUseTreeItem {
 }
-export type UseTreeItem2RootSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2RootSlotOwnProps;
-export interface UseTreeItem2ContentSlotPropsFromUseTreeItem {
+export type UseTreeItemRootSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemRootSlotOwnProps;
+export interface UseTreeItemContentSlotPropsFromUseTreeItem {
     onClick: TreeViewCancellableEventHandler<React.MouseEvent>;
     onMouseDown: TreeViewCancellableEventHandler<React.MouseEvent>;
     ref: React.RefCallback<HTMLDivElement> | null;
-    status: UseTreeItem2Status;
-    /**
-     * Only defined when the `indentationAtItemLevel` experimental feature is enabled.
-     */
-    indentationAtItemLevel?: true;
+    status: UseTreeItemStatus;
 }
-export interface UseTreeItem2ContentSlotOwnProps extends UseTreeItem2ContentSlotPropsFromUseTreeItem {
+export interface UseTreeItemContentSlotOwnProps extends UseTreeItemContentSlotPropsFromUseTreeItem {
 }
-export type UseTreeItem2ContentSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2ContentSlotOwnProps;
-export interface UseTreeItem2IconContainerSlotOwnProps {
+export type UseTreeItemContentSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemContentSlotOwnProps;
+export interface UseTreeItemIconContainerSlotOwnProps {
     onClick: TreeViewCancellableEventHandler<React.MouseEvent>;
 }
-export type UseTreeItemIconContainerSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2IconContainerSlotOwnProps;
-export interface UseTreeItem2LabelSlotOwnProps {
+export type UseTreeItemIconContainerSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemIconContainerSlotOwnProps;
+export interface UseTreeItemLabelSlotOwnProps {
     children: React.ReactNode;
     onDoubleClick: TreeViewCancellableEventHandler<React.MouseEvent>;
     /**
@@ -76,35 +69,26 @@ export interface UseTreeItem2LabelSlotOwnProps {
      */
     editable?: boolean;
 }
-export type UseTreeItem2LabelSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2LabelSlotOwnProps;
-export interface UseTreeItem2LabelInputSlotOwnProps {
+export type UseTreeItemLabelSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemLabelSlotOwnProps;
+export interface UseTreeItemLabelInputSlotOwnProps {
 }
-export type UseTreeItem2LabelInputSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2LabelInputSlotOwnProps;
-export interface UseTreeItem2CheckboxSlotOwnProps {
-    visible: boolean;
-    checked: boolean;
-    onChange: TreeViewCancellableEventHandler<React.ChangeEvent<HTMLInputElement>>;
-    disabled: boolean;
+export type UseTreeItemLabelInputSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemLabelInputSlotOwnProps;
+export interface UseTreeItemCheckboxSlotOwnProps {
     ref: React.RefObject<HTMLButtonElement>;
-    tabIndex: -1;
 }
-export type UseTreeItem2CheckboxSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2CheckboxSlotOwnProps;
-export interface UseTreeItem2GroupTransitionSlotOwnProps {
+export type UseTreeItemCheckboxSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemCheckboxSlotOwnProps;
+export interface UseTreeItemGroupTransitionSlotOwnProps {
     unmountOnExit: boolean;
     in: boolean;
     component: 'ul';
     role: 'group';
     children: React.ReactNode;
-    /**
-     * Only defined when the `indentationAtItemLevel` experimental feature is enabled.
-     */
-    indentationAtItemLevel?: true;
 }
-export type UseTreeItem2GroupTransitionSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2GroupTransitionSlotOwnProps;
-export interface UseTreeItem2DragAndDropOverlaySlotOwnProps {
+export type UseTreeItemGroupTransitionSlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemGroupTransitionSlotOwnProps;
+export interface UseTreeItemDragAndDropOverlaySlotOwnProps {
 }
-export type UseTreeItem2DragAndDropOverlaySlotProps<ExternalProps = {}> = ExternalProps & UseTreeItem2DragAndDropOverlaySlotOwnProps;
-export interface UseTreeItem2Status {
+export type UseTreeItemDragAndDropOverlaySlotProps<ExternalProps = {}> = ExternalProps & UseTreeItemDragAndDropOverlaySlotOwnProps;
+export interface UseTreeItemStatus {
     expandable: boolean;
     expanded: boolean;
     focused: boolean;
@@ -113,37 +97,37 @@ export interface UseTreeItem2Status {
     editing: boolean;
     editable: boolean;
 }
-export interface UseTreeItem2ReturnValue<TSignatures extends UseTreeItem2MinimalPlugins, TOptionalSignatures extends UseTreeItem2OptionalPlugins> {
+export interface UseTreeItemReturnValue<TSignatures extends UseTreeItemMinimalPlugins, TOptionalSignatures extends UseTreeItemOptionalPlugins> {
     /**
      * Resolver for the root slot's props.
      * @param {ExternalProps} externalProps Additional props for the root slot.
-     * @returns {UseTreeItem2RootSlotProps<ExternalProps>} Props that should be spread on the root slot.
+     * @returns {UseTreeItemRootSlotProps<ExternalProps>} Props that should be spread on the root slot.
      */
-    getRootProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItem2RootSlotProps<ExternalProps>;
+    getRootProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItemRootSlotProps<ExternalProps>;
     /**
      * Resolver for the content slot's props.
      * @param {ExternalProps} externalProps Additional props for the content slot.
-     * @returns {UseTreeItem2ContentSlotProps<ExternalProps>} Props that should be spread on the content slot.
+     * @returns {UseTreeItemContentSlotProps<ExternalProps>} Props that should be spread on the content slot.
      */
-    getContentProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItem2ContentSlotProps<ExternalProps>;
+    getContentProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItemContentSlotProps<ExternalProps>;
     /**
      * Resolver for the label slot's props.
      * @param {ExternalProps} externalProps Additional props for the label slot.
-     * @returns {UseTreeItem2LabelSlotProps<ExternalProps>} Props that should be spread on the label slot.
+     * @returns {UseTreeItemLabelSlotProps<ExternalProps>} Props that should be spread on the label slot.
      */
-    getLabelProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItem2LabelSlotProps<ExternalProps>;
+    getLabelProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItemLabelSlotProps<ExternalProps>;
     /**
      * Resolver for the labelInput slot's props.
      * @param {ExternalProps} externalProps Additional props for the labelInput slot.
-     * @returns {UseTreeItem2LabelInputSlotProps<ExternalProps>} Props that should be spread on the labelInput slot.
+     * @returns {UseTreeItemLabelInputSlotProps<ExternalProps>} Props that should be spread on the labelInput slot.
      */
-    getLabelInputProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItem2LabelInputSlotProps<ExternalProps>;
+    getLabelInputProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItemLabelInputSlotProps<ExternalProps>;
     /**
      * Resolver for the checkbox slot's props.
      * @param {ExternalProps} externalProps Additional props for the checkbox slot.
-     * @returns {UseTreeItem2CheckboxSlotProps<ExternalProps>} Props that should be spread on the checkbox slot.
+     * @returns {UseTreeItemCheckboxSlotProps<ExternalProps>} Props that should be spread on the checkbox slot.
      */
-    getCheckboxProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItem2CheckboxSlotProps<ExternalProps>;
+    getCheckboxProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItemCheckboxSlotProps<ExternalProps>;
     /**
      * Resolver for the iconContainer slot's props.
      * @param {ExternalProps} externalProps Additional props for the iconContainer slot.
@@ -153,16 +137,16 @@ export interface UseTreeItem2ReturnValue<TSignatures extends UseTreeItem2Minimal
     /**
      * Resolver for the GroupTransition slot's props.
      * @param {ExternalProps} externalProps Additional props for the GroupTransition slot.
-     * @returns {UseTreeItem2GroupTransitionSlotProps<ExternalProps>} Props that should be spread on the GroupTransition slot.
+     * @returns {UseTreeItemGroupTransitionSlotProps<ExternalProps>} Props that should be spread on the GroupTransition slot.
      */
-    getGroupTransitionProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItem2GroupTransitionSlotProps<ExternalProps>;
+    getGroupTransitionProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItemGroupTransitionSlotProps<ExternalProps>;
     /**
      * Resolver for the DragAndDropOverlay slot's props.
      * Warning: This slot is only useful when using the `<RichTreeViewPro />` component.
      * @param {ExternalProps} externalProps Additional props for the DragAndDropOverlay slot.
-     * @returns {UseTreeItem2DragAndDropOverlaySlotProps<ExternalProps>} Props that should be spread on the DragAndDropOverlay slot.
+     * @returns {UseTreeItemDragAndDropOverlaySlotProps<ExternalProps>} Props that should be spread on the DragAndDropOverlay slot.
      */
-    getDragAndDropOverlayProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItem2DragAndDropOverlaySlotProps<ExternalProps>;
+    getDragAndDropOverlayProps: <ExternalProps extends Record<string, any> = {}>(externalProps?: ExternalProps) => UseTreeItemDragAndDropOverlaySlotProps<ExternalProps>;
     /**
      * A ref to the component's root DOM element.
      */
@@ -170,16 +154,16 @@ export interface UseTreeItem2ReturnValue<TSignatures extends UseTreeItem2Minimal
     /**
      * Current status of the item.
      */
-    status: UseTreeItem2Status;
+    status: UseTreeItemStatus;
     /**
      * The object the allows Tree View manipulation.
      */
     publicAPI: TreeViewPublicAPI<TSignatures, TOptionalSignatures>;
 }
 /**
- * Plugins that need to be present in the Tree View in order for `useTreeItem2` to work correctly.
+ * Plugins that need to be present in the Tree View in order for `UseTreeItem` to work correctly.
  */
-export type UseTreeItem2MinimalPlugins = readonly [
+export type UseTreeItemMinimalPlugins = readonly [
     UseTreeViewSelectionSignature,
     UseTreeViewExpansionSignature,
     UseTreeViewItemsSignature,
@@ -188,6 +172,6 @@ export type UseTreeItem2MinimalPlugins = readonly [
     UseTreeViewLabelSignature
 ];
 /**
- * Plugins that `useTreeItem2` can use if they are present, but are not required.
+ * Plugins that `UseTreeItem` can use if they are present, but are not required.
  */
-export type UseTreeItem2OptionalPlugins = readonly [];
+export type UseTreeItemOptionalPlugins = readonly [];

package/TreeItem/TreeItemContent.d.ts

@@ -1,61 +0,0 @@
-import * as React from 'react';
-import { TreeItem2DragAndDropOverlayProps } from '../TreeItem2DragAndDropOverlay';
-import { TreeItem2LabelInputProps } from '../TreeItem2LabelInput';
-export interface TreeItemContentProps extends React.HTMLAttributes<HTMLElement> {
-    className?: string;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes: {
-        /** Styles applied to the root element. */
-        root: string;
-        /** State class applied to the content element when expanded. */
-        expanded: string;
-        /** State class applied to the content element when selected. */
-        selected: string;
-        /** State class applied to the content element when focused. */
-        focused: string;
-        /** State class applied to the element when disabled. */
-        disabled: string;
-        /** Styles applied to the Tree Item icon and collapse/expand icon. */
-        iconContainer: string;
-        /** Styles applied to the label element. */
-        label: string;
-        /** Styles applied to the checkbox element. */
-        checkbox: string;
-        /** Styles applied to the input element that is visible when editing is enabled. */
-        labelInput: string;
-        /** Styles applied to the content element when editing is enabled. */
-        editing: string;
-        /** Styles applied to the content of the items that are editable. */
-        editable: string;
-    };
-    /**
-     * The Tree Item label.
-     */
-    label?: React.ReactNode;
-    /**
-     * The id of the item.
-     */
-    itemId: string;
-    /**
-     * The icon to display next to the Tree Item's label.
-     */
-    icon?: React.ReactNode;
-    /**
-     * The icon to display next to the Tree Item's label. Either an expansion or collapse icon.
-     */
-    expansionIcon?: React.ReactNode;
-    /**
-     * The icon to display next to the Tree Item's label. Either a parent or end icon.
-     */
-    displayIcon?: React.ReactNode;
-    dragAndDropOverlayProps?: TreeItem2DragAndDropOverlayProps;
-    labelInputProps?: TreeItem2LabelInputProps;
-}
-export type TreeItemContentClassKey = keyof NonNullable<TreeItemContentProps['classes']>;
-/**
- * @ignore - internal component.
- */
-declare const TreeItemContent: React.ForwardRefExoticComponent<TreeItemContentProps & React.RefAttributes<HTMLDivElement>>;
-export { TreeItemContent };

package/TreeItem/TreeItemContent.js

@@ -1,146 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["classes", "className", "displayIcon", "expansionIcon", "icon", "label", "itemId", "onClick", "onMouseDown", "dragAndDropOverlayProps", "labelInputProps"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import Checkbox from '@mui/material/Checkbox';
-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.
- */
-const TreeItemContent = /*#__PURE__*/React.forwardRef(function TreeItemContent(props, ref) {
-  const {
-      classes,
-      className,
-      displayIcon,
-      expansionIcon,
-      icon: iconProp,
-      label,
-      itemId,
-      onClick,
-      onMouseDown,
-      dragAndDropOverlayProps,
-      labelInputProps
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const {
-    disabled,
-    expanded,
-    selected,
-    focused,
-    editing,
-    editable,
-    disableSelection,
-    checkboxSelection,
-    handleExpansion,
-    handleSelection,
-    handleCheckboxSelection,
-    handleContentClick,
-    preventSelection,
-    expansionTrigger,
-    toggleItemEditing
-  } = useTreeItemState(itemId);
-  const icon = iconProp || expansionIcon || displayIcon;
-  const checkboxRef = React.useRef(null);
-  const handleMouseDown = event => {
-    preventSelection(event);
-    if (onMouseDown) {
-      onMouseDown(event);
-    }
-  };
-  const handleClick = event => {
-    handleContentClick?.(event, itemId);
-    if (checkboxRef.current?.contains(event.target)) {
-      return;
-    }
-    if (expansionTrigger === 'content') {
-      handleExpansion(event);
-    }
-    if (!checkboxSelection) {
-      handleSelection(event);
-    }
-    if (onClick) {
-      onClick(event);
-    }
-  };
-  const handleLabelDoubleClick = event => {
-    if (event.defaultMuiPrevented) {
-      return;
-    }
-    toggleItemEditing();
-  };
-  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 */_jsxs("div", _extends({}, other, {
-    className: clsx(classes.root, className, expanded && classes.expanded, selected && classes.selected, focused && classes.focused, disabled && classes.disabled, editing && classes.editing, editable && classes.editable),
-    onClick: handleClick,
-    onMouseDown: handleMouseDown,
-    ref: ref,
-    children: [/*#__PURE__*/_jsx("div", {
-      className: classes.iconContainer,
-      children: icon
-    }), checkboxSelection && /*#__PURE__*/_jsx(Checkbox, {
-      className: classes.checkbox,
-      checked: selected,
-      onChange: handleCheckboxSelection,
-      disabled: disabled || disableSelection,
-      ref: checkboxRef,
-      tabIndex: -1
-    }), editing ? /*#__PURE__*/_jsx(TreeItem2LabelInput, _extends({}, labelInputProps, {
-      className: classes.labelInput
-    })) : /*#__PURE__*/_jsx("div", _extends({
-      className: classes.label
-    }, editable && {
-      onDoubleClick: handleLabelDoubleClick
-    }, {
-      children: label
-    })), dragAndDropOverlayProps && /*#__PURE__*/_jsx(TreeItem2DragAndDropOverlay, _extends({}, dragAndDropOverlayProps))]
-  }));
-});
-process.env.NODE_ENV !== "production" ? TreeItemContent.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object.isRequired,
-  className: PropTypes.string,
-  /**
-   * The icon to display next to the Tree Item's label. Either a parent or end icon.
-   */
-  displayIcon: PropTypes.node,
-  dragAndDropOverlayProps: PropTypes.shape({
-    action: PropTypes.oneOf(['make-child', 'move-to-parent', 'reorder-above', 'reorder-below']),
-    style: PropTypes.object
-  }),
-  /**
-   * The icon to display next to the Tree Item's label. Either an expansion or collapse icon.
-   */
-  expansionIcon: PropTypes.node,
-  /**
-   * The icon to display next to the Tree Item's label.
-   */
-  icon: PropTypes.node,
-  /**
-   * The id of the item.
-   */
-  itemId: PropTypes.string.isRequired,
-  /**
-   * The Tree Item label.
-   */
-  label: PropTypes.node,
-  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/TreeItem/useTreeItemState.d.ts

@@ -1,21 +0,0 @@
-import * as React from 'react';
-import { TreeViewCancellableEvent } from '../models';
-export declare function useTreeItemState(itemId: string): {
-    disabled: boolean;
-    expanded: boolean;
-    selected: boolean;
-    focused: boolean;
-    editable: boolean;
-    editing: boolean;
-    disableSelection: boolean;
-    checkboxSelection: boolean;
-    handleExpansion: (event: React.MouseEvent<HTMLDivElement>) => void;
-    handleSelection: (event: React.MouseEvent) => void;
-    handleCheckboxSelection: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    handleContentClick: ((event: React.MouseEvent, itemId: string) => void) | undefined;
-    preventSelection: (event: React.MouseEvent<HTMLDivElement>) => void;
-    expansionTrigger: "content" | "iconContainer" | undefined;
-    toggleItemEditing: () => void;
-    handleSaveItemLabel: (event: React.SyntheticEvent & TreeViewCancellableEvent, label: string) => void;
-    handleCancelItemLabelEditing: (event: React.SyntheticEvent) => void;
-};

package/TreeItem/useTreeItemState.js

@@ -1,143 +0,0 @@
-'use client';
-
-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,
-    items: {
-      onItemClick
-    },
-    selection: {
-      multiSelect,
-      checkboxSelection,
-      disableSelection
-    },
-    expansion: {
-      expansionTrigger
-    }
-  } = useTreeViewContext();
-  const expandable = instance.isItemExpandable(itemId);
-  const expanded = instance.isItemExpanded(itemId);
-  const focused = instance.isItemFocused(itemId);
-  const selected = instance.isItemSelected(itemId);
-  const disabled = instance.isItemDisabled(itemId);
-  const editing = instance?.isItemBeingEdited ? instance?.isItemBeingEdited(itemId) : false;
-  const editable = instance.isItemEditable ? instance.isItemEditable(itemId) : false;
-  const handleExpansion = event => {
-    if (!disabled) {
-      if (!focused) {
-        instance.focusItem(event, itemId);
-      }
-      const multiple = multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);
-
-      // If already expanded and trying to toggle selection don't close
-      if (expandable && !(multiple && instance.isItemExpanded(itemId))) {
-        instance.toggleItemExpansion(event, itemId);
-      }
-    }
-  };
-  const handleSelection = event => {
-    if (!disabled) {
-      if (!focused) {
-        instance.focusItem(event, itemId);
-      }
-      const multiple = multiSelect && (event.shiftKey || event.ctrlKey || event.metaKey);
-      if (multiple) {
-        if (event.shiftKey) {
-          instance.expandSelectionRange(event, itemId);
-        } else {
-          instance.selectItem({
-            event,
-            itemId,
-            keepExistingSelection: true
-          });
-        }
-      } else {
-        instance.selectItem({
-          event,
-          itemId,
-          shouldBeSelected: true
-        });
-      }
-    }
-  };
-  const handleCheckboxSelection = event => {
-    if (disableSelection || disabled) {
-      return;
-    }
-    const hasShift = event.nativeEvent.shiftKey;
-    if (multiSelect && hasShift) {
-      instance.expandSelectionRange(event, itemId);
-    } else {
-      instance.selectItem({
-        event,
-        itemId,
-        keepExistingSelection: multiSelect,
-        shouldBeSelected: event.target.checked
-      });
-    }
-  };
-  const preventSelection = event => {
-    if (event.shiftKey || event.ctrlKey || event.metaKey || disabled) {
-      // Prevent text selection
-      event.preventDefault();
-    }
-  };
-  const toggleItemEditing = () => {
-    if (!hasPlugin(instance, useTreeViewLabel)) {
-      return;
-    }
-    if (instance.isItemEditable(itemId)) {
-      if (instance.isItemBeingEdited(itemId)) {
-        instance.setEditedItemId(null);
-      } else {
-        instance.setEditedItemId(itemId);
-      }
-    }
-  };
-  const handleSaveItemLabel = (event, label) => {
-    if (!hasPlugin(instance, useTreeViewLabel)) {
-      return;
-    }
-
-    // As a side effect of `instance.focusItem` called here and in `handleCancelItemLabelEditing` the `labelInput` is blurred
-    // The `onBlur` event is triggered, which calls `handleSaveItemLabel` again.
-    // To avoid creating an unwanted behavior we need to check if the item is being edited before calling `updateItemLabel`
-    // using `instance.isItemBeingEditedRef` instead of `instance.isItemBeingEdited` since the state is not yet updated in this point
-    if (instance.isItemBeingEditedRef(itemId)) {
-      instance.updateItemLabel(itemId, label);
-      toggleItemEditing();
-      instance.focusItem(event, itemId);
-    }
-  };
-  const handleCancelItemLabelEditing = event => {
-    if (!hasPlugin(instance, useTreeViewLabel)) {
-      return;
-    }
-    if (instance.isItemBeingEditedRef(itemId)) {
-      toggleItemEditing();
-      instance.focusItem(event, itemId);
-    }
-  };
-  return {
-    disabled,
-    expanded,
-    selected,
-    focused,
-    editable,
-    editing,
-    disableSelection,
-    checkboxSelection,
-    handleExpansion,
-    handleSelection,
-    handleCheckboxSelection,
-    handleContentClick: onItemClick,
-    preventSelection,
-    expansionTrigger,
-    toggleItemEditing,
-    handleSaveItemLabel,
-    handleCancelItemLabelEditing
-  };
-}

package/TreeItem2/TreeItem2.d.ts

@@ -1,34 +0,0 @@
-import * as React from 'react';
-import { CheckboxProps } from '@mui/material/Checkbox';
-import { TreeItem2Props } from './TreeItem2.types';
-import { UseTreeItem2Status } from '../useTreeItem2';
-export declare const TreeItem2Root: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, keyof React.ClassAttributes<HTMLLIElement> | keyof React.LiHTMLAttributes<HTMLLIElement>>, {}>;
-export declare const TreeItem2Content: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    status: UseTreeItem2Status;
-    indentationAtItemLevel?: true;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const TreeItem2Label: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    editable?: boolean;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const TreeItem2IconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
-export declare const TreeItem2GroupTransition: import("@emotion/styled").StyledComponent<import("@mui/material").CollapseProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    indentationAtItemLevel?: true;
-}, {}, {}>;
-export declare const TreeItem2Checkbox: import("@emotion/styled").StyledComponent<Pick<Omit<CheckboxProps & {
-    visible: boolean;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "hidden" | "visible" | "color" | "content" | "size" | "style" | "icon" | "translate" | "disabled" | "form" | "slot" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "name" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "readOnly" | "required" | "action" | "checked" | "component" | "sx" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "checkedIcon" | "inputProps" | "inputRef" | "indeterminate" | "indeterminateIcon" | keyof React.RefAttributes<HTMLButtonElement>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-type TreeItem2Component = ((props: TreeItem2Props & React.RefAttributes<HTMLLIElement>) => React.JSX.Element) & {
-    propTypes?: any;
-};
-/**
- *
- * Demos:
- *
- * - [Tree View](https://mui.com/x/react-tree-view/)
- *
- * API:
- *
- * - [TreeItem2 API](https://mui.com/x/api/tree-view/tree-item-2/)
- */
-export declare const TreeItem2: TreeItem2Component;
-export {};