import React, { forwardRef } from "react";
import { GRADIENT_TEXT_CLASS } from "../../utils/constants";
import cls from "classnames";
import { base as viewCSS } from "./variations/_view/base";
import { base as sizeCSS } from "./variations/_size/base";
import { base as pilledCSS } from "./variations/_pilled/base";
import { base as transparentCSS } from "./variations/_transparent/base";
import { base as clearCSS } from "./variations/_clear/base";
import { StyledContentLeft, StyledContentMain, StyledContentRight, base } from "./Badge.styles";
import { classes, privateTokens } from "./Badge.tokens";
export const badgeRoot = (Root)=>/*#__PURE__*/ forwardRef((props, ref)=>{
        const { children, className, style, text, contentLeft, contentRight, size, view, customColor, customBackgroundColor, pilled = false, transparent = false, clear = false, maxWidth = 'auto', ...rest } = props;
        const pilledClass = pilled ? classes.badgePilled : undefined;
        const transparentClass = transparent ? classes.badgeTransparent : undefined;
        const clearClass = clear ? classes.badgeClear : undefined;
        const truncateClass = maxWidth !== 'auto' ? classes.badgeTruncate : undefined;
        const txt = !text && typeof children === 'string' ? children : text;
        const iconOnlyClass = !txt && contentLeft ? classes.iconOnly : undefined;
        const BadgeContent = ()=>{
            if (contentLeft) {
                return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(StyledContentLeft, null, contentLeft), txt ? /*#__PURE__*/ React.createElement(StyledContentMain, {
                    className: GRADIENT_TEXT_CLASS
                }, txt) : children);
            }
            return /*#__PURE__*/ React.createElement(React.Fragment, null, txt ? /*#__PURE__*/ React.createElement(StyledContentMain, {
                className: GRADIENT_TEXT_CLASS
            }, txt) : children, contentRight && /*#__PURE__*/ React.createElement(StyledContentRight, null, contentRight));
        };
        return /*#__PURE__*/ React.createElement(Root, {
            ref: ref,
            className: cls(pilledClass, transparentClass, clearClass, truncateClass, iconOnlyClass, className, {}),
            view: view,
            size: size,
            pilled: pilled,
            transparent: transparent,
            clear: clear,
            style: {
                ...style,
                maxWidth,
                [privateTokens.customBackground]: customBackgroundColor,
                [privateTokens.customColor]: customColor
            },
            ...rest
        }, /*#__PURE__*/ React.createElement(BadgeContent, null));
    });
export const badgeConfig = {
    name: 'Badge',
    tag: 'div',
    layout: badgeRoot,
    base,
    variations: {
        view: {
            css: viewCSS
        },
        size: {
            css: sizeCSS
        },
        pilled: {
            css: pilledCSS,
            attrs: true
        },
        transparent: {
            css: transparentCSS,
            attrs: true
        },
        clear: {
            css: clearCSS,
            attrs: true
        }
    },
    defaults: {
        view: 'primary',
        size: 'm'
    }
};
