import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import clsx from "clsx";
import "./style.scss";
import GetSvgIcon from "../GetSvgIcon";
import CircularIcon from "../CircularIcon";
import EllipsisText from "../EllipsisText";
import Tooltip from "../Tooltip";
const SelectablePill = ({ id, text, onSelect, onExclude, variant = "unselected", highlight = false, onEnter = () => { }, onLeave = () => { }, isDisabled = false, iconPath, dataCy, ...props }) => {
    const className = clsx({
        "selectablePill--Generic": true,
        "selectablePill--Selected": variant === "selected",
        "selectablePill--Excluded": variant === "excluded",
        "selectablePill--Unselected": variant === "unselected",
        "selectablePill--SelectedHover": variant !== "unselected" && highlight,
        "selectablePill--UnselectedHover": variant === "unselected" && highlight,
    });
    const includeButton = clsx({
        "selectablePill--Include": true,
        "selectablePill--IncludeSelected": variant === "selected",
    });
    const excludeButton = clsx({
        "selectablePill--Exclude": true,
        "selectablePill--ExcludeSelected": variant === "excluded",
    });
    return (_jsxs("button", { id: id, disabled: isDisabled, className: className, ...props, onMouseEnter: onEnter, onMouseLeave: onLeave, onClick: onSelect, "data-cy": dataCy, children: [!!iconPath && (_jsx("span", { className: "selectablePill--logoSVG", children: _jsx(CircularIcon, { iconSize: "24", errorImageContainerSize: "34", iconPath: iconPath, altImageType: "company" }) })), _jsx(EllipsisText, { maxWidth: "330px", toolTipPosition: "bottom", children: text }), _jsxs("div", { className: "selectablePill--ActionButton", children: [_jsx(Tooltip, { content: "Include", children: _jsx("button", { className: includeButton, "data-cy": `${dataCy}-include`, children: _jsx(GetSvgIcon, { iconType: "tick", iconSize: "24" }) }) }), _jsx(Tooltip, { content: "Exclude", children: _jsx("button", { className: excludeButton, onClick: (e) => {
                                e.stopPropagation();
                                onExclude(e);
                            }, "data-cy": `${dataCy}-exclude`, children: _jsx(GetSvgIcon, { iconType: "notAllowed", iconSize: "24" }) }) })] })] }));
};
export default SelectablePill;
