import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useMemo } from "react";
import { PulseLoader } from "react-spinners";
import { ButtonContainer, Option, LinkContainer, Label } from "./button.styled";
const Button = ({ children, label, className, pending, disabled, ...rest }) => {
    const status = useMemo(() => {
        if (pending)
            return "pending";
        if (!!children)
            return "children";
        return "label";
    }, [pending, children]);
    const isInactive = useMemo(() => {
        if (pending || disabled)
            return true;
        return false;
    }, [pending, disabled]);
    return (_jsxs(ButtonContainer, { className: `ui-button ${className ?? ""} ${isInactive ? " inactive" : ""}`, disabled: disabled, pending: pending, ...rest, children: [_jsx(Option, { className: `ui-button__loader${status === "pending" ? "" : " hidden"}`, children: _jsx(PulseLoader, { size: 8 }) }), _jsx(Option, { className: `ui-button__label${status === "label" ? "" : " hidden"}`, children: _jsx(Label, { children: label }) }), _jsx(Option, { className: `ui-button__children${status === "children" ? "" : " hidden"}`, children: children })] }));
};
/**
 * @deprecated use regular button with prop texted or ../link component (for anchor behavior)
 */
const ButtonLink = ({ children, className, ...rest }) => {
    const status = useMemo(() => {
        if (!!children)
            return "children";
        return "label";
    }, [children]);
    return (_jsx(LinkContainer, { className: `ui-button ${className ?? ""}`, ...rest, children: _jsx(Option, { className: `ui-button__children${status === "children" ? "" : " hidden"}`, children: children }) }));
};
export default Object.assign(Button, { Link: ButtonLink });
//# sourceMappingURL=button.js.map