// @ts-nocheck
import { __assign, __read, __rest, __spreadArray } from "tslib";
import './TagBase.css';
import React from 'react';
import { IconClose } from '../../icons/IconClose/IconClose';
import { cn } from '../../utils/bem';
import { getSizeByMap } from '../../utils/getSizeByMap';
import { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';
export var tagBasePropSize = ['m', 'xs', 's', 'l'];
export var tagBasePropSizeDefault = tagBasePropSize[0];
export var tagBasePropGroupNumberValue = [1, 2, 3, 4, 5, 6, 7, 8, 9];
export var tagBasePropGroupStringValue = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
export var tagBasePropGroup = __spreadArray(__spreadArray([], __read(tagBasePropGroupNumberValue), false), __read(tagBasePropGroupStringValue), false);
export var tagBasePropView = ['stroked', 'filled', 'theme', 'label'];
export var tagBasePropViewDefault = tagBasePropView[0];
export var cnTagBase = cn('TagBase');
var sizeMap = {
    xs: 'xs',
    s: 'xxs',
    m: 'xs',
    l: 's'
};
export var TagBase = forwardRefWithAs(function (props, ref) {
    var _a;
    var _b = props.size, size = _b === void 0 ? tagBasePropSizeDefault : _b, color = props.color, _c = props.as, as = _c === void 0 ? 'div' : _c, label = props.label, className = props.className, group = props.group, _d = props.view, view = _d === void 0 ? tagBasePropViewDefault : _d, onCancel = props.onCancel, Icon = props.icon, iconSize = props.iconSize, withAction = props.withAction, colorBorder = props.colorBorder, otherProps = __rest(props, ["size", "color", "as", "label", "className", "group", "view", "onCancel", "icon", "iconSize", "withAction", "colorBorder"]);
    var Tag = as;
    var withCancel = typeof onCancel === 'function';
    var withIcon = !!Icon;
    var IconCloseSize = getSizeByMap(sizeMap, size);
    var IconSize = getSizeByMap(sizeMap, size, iconSize);
    return (React.createElement(Tag, __assign({}, otherProps, { className: cnTagBase({
            color: color,
            size: size,
            view: view,
            withCancel: withCancel,
            withIcon: withIcon,
            group: group,
            withAction: withAction
        }, [className]), ref: ref, style: colorBorder && (_a = {},
            _a['--tag-border-color'] = "".concat(colorBorder),
            _a) }), withCancel || Icon ? (React.createElement(React.Fragment, null,
        withCancel && (React.createElement("button", { className: cnTagBase('CancelButton'), type: "button", onClick: onCancel },
            React.createElement(IconClose, { className: cnTagBase('CancelIcon'), size: IconCloseSize }))),
        Icon && (React.createElement("span", { className: cnTagBase('IconWrapper') },
            React.createElement(Icon, { size: IconSize, className: cnTagBase('Icon') }))),
        React.createElement("span", { className: cnTagBase('Label') }, label))) : (label)));
});
