import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/.pnpm/@radix-ui_react-slot@1.0.2_@types_react@18.2.12_react@18.2.0/node_modules/@radix-ui/react-slot/dist/index.js';
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';

const button = cva(styles['button'], {
    variants: {
        variant: {
            primary: styles["button-primary"],
            secondary: styles["button-secondary"],
            outline: styles["button-outline"],
            ghost: styles["button-ghost"],
            danger: styles["button-danger"],
            text: styles["button-text"]
        },
        size: {
            small: styles["button-small"],
            normal: styles["button-normal"],
        },
        disabled: {
            true: styles["button-disabled"],
        },
        loading: {
            true: styles["button-loading"],
        }
    },
});
const getLoaderOnlyClass = (size) => size === 'small' ? styles['loader-only-button-small'] : styles['loader-only-button-normal'];
const Button = forwardRef(({ className, variant = 'primary', size = 'normal', asChild = false, disabled, loading, loaderText, leadingIcon, trailingIcon, width, children, ...props }, ref) => {
    const Comp = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : "button";
    const isLoaderOnly = loading && !loaderText;
    const widthStyle = width ? { width } : {};
    const spinnerColor = variant === 'primary' || variant === 'danger' ? 'inverted' : 'default';
    return (jsxRuntimeExports.jsx(Comp, { className: `${button({ variant, size, disabled, loading, className })} ${isLoaderOnly ? getLoaderOnlyClass(size) : ''}`, ref: ref, disabled: disabled, style: widthStyle, ...props, children: loading ? (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(Spinner, { size: 1, color: spinnerColor }), loaderText && jsxRuntimeExports.jsx("span", { className: styles['loader-text'], children: loaderText })] })) : (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [leadingIcon && jsxRuntimeExports.jsx("span", { className: `${styles['icon']} ${styles['icon-leading']}`, children: leadingIcon }), children, trailingIcon && jsxRuntimeExports.jsx("span", { className: `${styles['icon']} ${styles['icon-trailing']}`, children: trailingIcon })] })) }));
});
Button.displayName = "Button";

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