import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from 'classnames';
import Icon from '../Icon/Icon';
import './styles.scss';
export const PillSizes = ['large', 'medium', 'small'];
export const PillTypes = ['outlined', 'filled'];
export default function Pill({ text, icon = 'add_circle', className, active, size = 'small', type = 'outlined', onClick, onIconClick, }) {
    const getClassNames = cx('ds-pill', className, type, size, {
        active: active,
    });
    const getIconSize = () => {
        if (size === 'large')
            return 'medium';
        return 'small';
    };
    return (_jsxs("div", { className: getClassNames, onClick: () => onClick && onClick(), children: [_jsx("span", { children: text }), _jsx(Icon, { name: icon, size: getIconSize(), onClick: (e) => {
                    if (onIconClick) {
                        e.stopPropagation();
                        onIconClick();
                    }
                } })] }));
}
