import { __assign, __rest } from "tslib";
import React, { forwardRef } from "react";
import { IconBrokenCloseCircle } from "@greenatom/icons";
import P2 from "../typography/P2";
import { Avatar } from "../Avatar";
import { TagWrapper, LeadIconWrapper, CloseIconWrapper } from "./style";
var FONT_MAPPING = {
    s: "cetus",
    xs: "musca",
    m: "corvus"
};
var Tag = forwardRef(function (_a, ref) {
    var children = _a.children, className = _a.className, avatarProps = _a.avatarProps, isClosable = _a.isClosable, leadIcon = _a.leadIcon, isPressed = _a.isPressed, as = _a.as, isDisabled = _a.isDisabled, _b = _a.closeIcon, closeIcon = _b === void 0 ? React.createElement(IconBrokenCloseCircle, null) : _b, _c = _a.size, size = _c === void 0 ? "m" : _c, onClickClose = _a.onClickClose, onClick = _a.onClick, _d = _a.testId, testId = _d === void 0 ? "tag" : _d, props = __rest(_a, ["children", "className", "avatarProps", "isClosable", "leadIcon", "isPressed", "as", "isDisabled", "closeIcon", "size", "onClickClose", "onClick", "testId"]);
    var handleClick = function (event) {
        onClick && !isDisabled && onClick(event);
        //  TODO check release
    };
    var renderLeadIcon = function () {
        if (leadIcon) {
            return (React.createElement(LeadIconWrapper, { className: "beforeSVG" }, leadIcon));
        }
        return null;
    };
    var renderCloseIcon = function () {
        if (closeIcon && isClosable) {
            return (isClosable && (React.createElement(CloseIconWrapper, { onClick: handleClickClose, size: size }, closeIcon)));
        }
        return null;
    };
    var handleClickClose = function (e) {
        e.preventDefault();
        e.stopPropagation();
        onClickClose && !isDisabled && onClickClose(e);
    };
    return (React.createElement(TagWrapper, __assign({ className: className, isPressed: isPressed, as: as, isClosable: isClosable, isDisabled: isDisabled, size: size, avatarProps: avatarProps, onClick: handleClick, ref: ref, "data-testid": testId }, props),
        renderLeadIcon(),
        avatarProps && (size === "m" || size === "s" || !size) && (React.createElement(Avatar, __assign({ className: "tag__avatar", size: "s", isDisabled: isDisabled }, avatarProps, { as: "div" }))),
        React.createElement(P2, { type: FONT_MAPPING[size || "m"] || "corvus", className: "placeholder" }, children),
        renderCloseIcon()));
});
Tag.displayName = "Tag";
export default Tag;
