import React from "react";
import cls from "classnames";
import { classes } from "../../NavigationDrawer.tokens";
import { ExtraCounter, IconWrapper, Icon, StyledIndicator, RightContentWrapper, ContentLeftWrapper, Label, Link } from "./MenuItem.styles";
export var MenuItem = function MenuItem(props) {
    var onClick = props.onClick, href = props.href, target = props.target, disabled = props.disabled, selected = props.selected, icon = props.icon, contentLeft = props.contentLeft, withContentLeft = props.withContentLeft, label = props.label, isOpen = props.isOpen, hasIndicator = props.hasIndicator, counter = props.counter;
    var onMenuClick = typeof onClick === 'function' && !disabled ? onClick : undefined;
    var hasCustomContentLeft = contentLeft && withContentLeft;
    var menuClasses = cls(classes.navigationDrawerMenuItem, selected && classes.navigationDrawerMenuItemSelected, disabled && classes.navigationDrawerMenuItemDisabled, hasCustomContentLeft && classes.navigationDrawerMenuItemContentLeft, !withContentLeft && classes.navigationDrawerMenuItemWithoutContentLeft);
    var indicators = /*#__PURE__*/ React.createElement(React.Fragment, null, hasIndicator && /*#__PURE__*/ React.createElement(StyledIndicator, {
        className: cls(withContentLeft && classes.navigationDrawerMenuIndicator)
    }), counter !== undefined && /*#__PURE__*/ React.createElement(ExtraCounter, {
        className: cls(withContentLeft && classes.navigationDrawerMenuCounter),
        count: counter
    }));
    var contentLeftItem = contentLeft ? /*#__PURE__*/ React.createElement(ContentLeftWrapper, null, contentLeft, indicators) : null;
    var iconItem = icon ? /*#__PURE__*/ React.createElement(IconWrapper, null, /*#__PURE__*/ React.createElement(Icon, null, icon), indicators) : null;
    var menuItemContent = withContentLeft ? /*#__PURE__*/ React.createElement(React.Fragment, null, contentLeft && contentLeftItem, icon && iconItem, isOpen && /*#__PURE__*/ React.createElement(Label, null, label)) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Label, null, label), /*#__PURE__*/ React.createElement(RightContentWrapper, null, indicators));
    return typeof onClick === 'function' ? /*#__PURE__*/ React.createElement("div", {
        className: menuClasses,
        onClick: onMenuClick
    }, menuItemContent) : /*#__PURE__*/ React.createElement(Link, {
        className: cls(classes.navigationDrawerMenuLink, menuClasses),
        href: href,
        rel: "noopener noreferrer",
        target: target
    }, menuItemContent);
};
