import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import clsx from "clsx";
import "./style.scss";
import GetSvgIcon from "../GetSvgIcon";
const Pill = ({ text = "", isSelected = false, props = {}, highlight = false, onCancelClick = () => false, }) => {
    const className = clsx({
        "Pill--Generic": true,
        "Pill--Selected": isSelected,
        "Pill--Unselected": !isSelected,
        "Pill--SelectedHover": isSelected && highlight,
        "Pill--UnselectedHover": !isSelected && highlight,
    });
    return (_jsxs("span", { className: className, ...props, children: [text, _jsx("button", { onClick: (e) => {
                    e.stopPropagation();
                    onCancelClick();
                }, children: _jsx(GetSvgIcon, { iconType: "cross", iconSize: "20" }) })] }));
};
export default Pill;
