import classNames from 'classnames';
import { ArrowIcon } from "../Icons";
import { jsx as _jsx, jsxs as _jsxs } from "preact/compat/jsx-runtime";
const DEFAULT_COMPONENT_TYPE = 'div';
export const VerticalNavItemLabel = props => {
  /**
   * The type of element rendered ultimately depends on whether
   * this is meant to be a subnav toggle, link, or generic label
   * @return {String} The type of HTML tag
   */
  const componentType = () => {
    if (props.hasSubnav) {
      return 'button';
    } else if (props.component) {
      return props.component;
    } else if (props.url) {
      return 'a';
    }
    return DEFAULT_COMPONENT_TYPE;
  };
  const LabelComponent = componentType();
  const handleClick = evt => props.onClick(evt);
  const commonProps = {
    className: classNames('ds-c-vertical-nav__label', {
      'ds-c-vertical-nav__label--current': props.selected,
      'ds-c-vertical-nav__label--parent': props.hasSubnav
    }),
    onClick: props.onClick ? handleClick : undefined
  };
  let otherProps;
  if (LabelComponent === 'button') {
    otherProps = {
      'aria-controls': props.subnavId,
      'aria-expanded': !props.collapsed
    };
  } else if (LabelComponent !== DEFAULT_COMPONENT_TYPE) {
    // Apply href if <a> or custom component type
    otherProps = {
      'aria-current': props.selected,
      href: props.url
    };
  }
  return /*#__PURE__*/_jsxs(LabelComponent, {
    ...commonProps,
    ...otherProps,
    children: [props.label, props.hasSubnav && /*#__PURE__*/_jsx(ArrowIcon, {
      direction: props.collapsed ? 'down' : 'up'
    })]
  });
};
export default VerticalNavItemLabel;