'use strict';

var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
var index$1 = require('../../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.cjs');
var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
var React = require('react');
var spinner = require('../spinner/spinner.cjs');
var button_module = require('./button.module.css.cjs');

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

exports.Button = Button;
//# sourceMappingURL=button.cjs.map
