import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { useRef, useContext } from 'react';
import { cx } from '../../../../../../utils/index.js';
import { classes } from '../../../../Combobox.tokens.js';
import { Context } from '../../../../Combobox.context.js';
import { ItemSelectionIcon, ItemContent } from '../../../ItemView/ItemView.js';
import { Wrapper, DisclosureIconWrapper, StyledArrow } from './Item.styles.js';
import { useDidMountEffect } from '../../../../../../hooks/useDidMountEffect.js';
import { getItemId } from '../../../../utils/getItemId.js';
import { isEmpty } from '../../../../../../utils/isEmpty.js';
import { sizeToIconSize } from '../../../../utils/sizeToIconSize.js';

var _excluded = ["value", "disabled", "className"];
var Item = function Item(_ref) {
  var item = _ref.item,
    path = _ref.path,
    currentLevel = _ref.currentLevel,
    index = _ref.index,
    ariaControls = _ref.ariaControls,
    ariaExpanded = _ref.ariaExpanded,
    ariaLevel = _ref.ariaLevel,
    ariaLabel = _ref.ariaLabel;
  var value = item.value,
    disabled = item.disabled,
    className = item.className,
    rest = _objectWithoutProperties(item, _excluded);
  var ref = useRef(null);
  var _useContext = useContext(Context),
    focusedPath = _useContext.focusedPath,
    checked = _useContext.checked,
    multiple = _useContext.multiple,
    size = _useContext.size,
    handleCheckboxChange = _useContext.handleCheckboxChange,
    handleItemClick = _useContext.handleItemClick,
    variant = _useContext.variant,
    renderItem = _useContext.renderItem,
    renderSelectionIcon = _useContext.renderSelectionIcon,
    treeId = _useContext.treeId,
    singleLine = _useContext.singleLine,
    _checkboxAppearance = _useContext._checkboxAppearance;
  var checkedValue = checked.get(item.value) || false;
  var disabledClassName = disabled ? classes.dropdownItemIsDisabled : undefined;
  var focusedClass = currentLevel === focusedPath.length - 1 && index === (focusedPath === null || focusedPath === void 0 ? void 0 : focusedPath[currentLevel]) ? classes.dropdownItemIsFocused : undefined;
  var activeClass = value === (path === null || path === void 0 ? void 0 : path[currentLevel + 1]) ? classes.dropdownItemIsActive : undefined;
  useDidMountEffect(function () {
    if (focusedClass && ref !== null && ref !== void 0 && ref.current) {
      ref.current.scrollIntoView({
        behavior: 'smooth',
        block: 'center',
        inline: 'center'
      });
    }
  }, [focusedClass]);
  var handleChange = function handleChange(e) {
    if (disabled) return;
    e.stopPropagation();
    handleCheckboxChange(item);
  };
  var handleClick = function handleClick(e) {
    if (disabled) {
      e.stopPropagation();
      return;
    }
    handleItemClick(item, e);
  };
  return /*#__PURE__*/React__default.createElement(Wrapper, _extends({}, rest, {
    className: cx(disabledClassName, focusedClass, activeClass, className),
    id: getItemId(treeId, value),
    ref: ref,
    onClick: handleClick,
    variant: variant,
    role: "treeitem",
    "aria-controls": ariaControls,
    "aria-expanded": ariaExpanded,
    "aria-level": ariaLevel,
    "aria-label": ariaLabel,
    "aria-selected": Boolean(checkedValue)
  }), /*#__PURE__*/React__default.createElement(ItemSelectionIcon, {
    checked: checkedValue,
    disabled: disabled,
    multiple: multiple,
    size: size,
    variant: variant,
    renderSelectionIcon: renderSelectionIcon,
    checkboxAppearance: _checkboxAppearance,
    withMargin: true,
    onChange: handleChange
  }), /*#__PURE__*/React__default.createElement(ItemContent, {
    item: item,
    renderItem: renderItem,
    singleLine: singleLine
  }), !isEmpty(item.items) && /*#__PURE__*/React__default.createElement(DisclosureIconWrapper, null, /*#__PURE__*/React__default.createElement(StyledArrow, {
    size: sizeToIconSize(size, variant),
    color: "inherit"
  })));
};

export { Item };
