import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
import { forwardRef } from 'react';
import { Spinner } from '../spinner/spinner.js';
import styles from './button.module.css.js';
import { Root as Slot } from '../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.9_react@19.2.1/node_modules/@radix-ui/react-slot/dist/index.js';

const button = cva(styles['button'], {
    variants: {
        variant: {
            solid: styles['button-solid'],
            outline: styles['button-outline'],
            ghost: styles['button-ghost'],
            text: styles['button-text']
        },
        size: {
            small: styles['button-small'],
            normal: styles['button-normal']
        },
        disabled: {
            true: styles['button-disabled']
        },
        loading: {
            true: styles['button-loading']
        },
        color: {
            accent: styles['button-color-accent'],
            danger: styles['button-color-danger'],
            neutral: styles['button-color-neutral'],
            success: styles['button-color-success']
        }
    },
    compoundVariants: [
        {
            variant: 'solid',
            color: 'accent',
            className: styles['button-solid-accent']
        },
        {
            variant: 'solid',
            color: 'danger',
            className: styles['button-solid-danger']
        },
        {
            variant: 'solid',
            color: 'neutral',
            className: styles['button-solid-neutral']
        },
        {
            variant: 'solid',
            color: 'success',
            className: styles['button-solid-success']
        },
        {
            variant: 'outline',
            color: 'accent',
            className: styles['button-outline-accent']
        },
        {
            variant: 'outline',
            color: 'danger',
            className: styles['button-outline-danger']
        },
        {
            variant: 'outline',
            color: 'neutral',
            className: styles['button-outline-neutral']
        },
        {
            variant: 'outline',
            color: 'success',
            className: styles['button-outline-success']
        },
        {
            variant: 'ghost',
            color: 'accent',
            className: styles['button-ghost-accent']
        },
        {
            variant: 'ghost',
            color: 'danger',
            className: styles['button-ghost-danger']
        },
        {
            variant: 'ghost',
            color: 'neutral',
            className: styles['button-ghost-neutral']
        },
        {
            variant: 'ghost',
            color: 'success',
            className: styles['button-ghost-success']
        },
        {
            variant: 'text',
            color: 'accent',
            className: styles['button-text-accent']
        },
        {
            variant: 'text',
            color: 'danger',
            className: styles['button-text-danger']
        },
        {
            variant: 'text',
            color: 'neutral',
            className: styles['button-text-neutral']
        },
        {
            variant: 'text',
            color: 'success',
            className: styles['button-text-success']
        }
    ],
    defaultVariants: {
        variant: 'solid',
        size: 'normal',
        color: 'accent'
    }
});
const getLoaderOnlyClass = (size) => size === 'small'
    ? styles['loader-only-button-small']
    : styles['loader-only-button-normal'];
const Button = forwardRef(({ className, variant = 'solid', color = 'accent', size = 'normal', asChild = false, disabled, loading, loaderText, leadingIcon, trailingIcon, maxWidth, width, style = {}, children, ...props }, ref) => {
    const Comp = asChild ? Slot : 'button';
    const isLoaderOnly = loading && !loaderText;
    const widthStyle = { maxWidth, width };
    const buttonStyle = { ...widthStyle, ...style };
    return (jsx(Comp, { className: `${button({ variant, size, color, disabled, loading, className })} ${isLoaderOnly ? getLoaderOnlyClass(size) : ''}`, ref: ref, disabled: disabled, style: buttonStyle, ...props, children: loading ? (jsxs(Fragment, { children: [jsx(Spinner, { size: 1, color: 'default' }), loaderText && (jsx("span", { className: styles['loader-text'], children: loaderText }))] })) : (jsxs(Fragment, { children: [leadingIcon && (jsx("span", { className: `${styles['icon']} ${styles['icon-leading']}`, children: leadingIcon })), children, trailingIcon && (jsx("span", { className: `${styles['icon']} ${styles['icon-trailing']}`, children: trailingIcon }))] })) }));
});
Button.displayName = 'Button';

export { Button };
//# sourceMappingURL=button.js.map
