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);
    }
  };

  // If we click on the expansion icon and expansionTrigger is "iconContainer", we expand or collapse the tree item.
  const handleIconClick = expansionIcon != null && icon === expansionIcon && expansionTrigger === 'iconContainer' ? event => {
    if (expansionIcon != null && icon === expansionIcon && expansionTrigger === 'iconContainer') {
      handleExpansion(event);
    }
  } : undefined;
  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,
      onClick: handleIconClick,
      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 };