import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Loader2 } from "lucide-react";
import { IconRenderer } from "../../services/iconRenderer";
import "./styles.css";
/**
 * Button component - used for user interactions and form submissions
 *
 * @param props - Button component properties
 * @param props.isLoading - Controls loading state with spinner. Default: false
 * @param props.loadingText - Text to display during loading state
 * @param props.size - Button size. Default: "md"
 * @param props.variant - Visual variant of the button. Default: "solid"
 * @param props.scheme - Button color scheme. Default: "primary"
 * @param props.leftIcon - Optional icon to display on the left
 * @param props.rightIcon - Optional icon to display on the right
 *
 * **...Other valid HTML properties for button**
 *
 * @returns Button JSX element
 *
 * @example
 * ```tsx
 * // Basic button
 * <Button>Click me</Button>
 *
 * // Button with color scheme
 * <Button scheme="success">Save</Button>
 *
 * // Button with loading state
 * <Button isLoading loadingText="Saving...">
 *  Save
 * </Button>
 *
 * // Button with icons
 * <Button leftIcon={SaveIcon} scheme="success">
 *  Save
 * </Button>
 *
 * // Custom button
 * <Button
 *  size="lg"
 *  variant="outline"
 *  scheme="danger"
 *  rightIcon={TrashIcon}
 * >
 *  Delete
 * </Button>
 * ```
 */
function Button(props) {
    const { isLoading = false, scheme = "primary", variant = "solid", loadingText, size = "md", leftIcon, rightIcon, disabled, className: baseClassName = "", children, ...rest } = props;
    const iconSizes = { xs: 12, sm: 16, md: 20, lg: 24 };
    const iconSize = iconSizes[size];
    const loadingClass = isLoading ? "loadingTrue" : "loadingFalse";
    const loadingTextClass = !!loadingText
        ? "loadingTextTrue"
        : "loadingTextFalse";
    const className = `arkynButton ${loadingClass} ${variant} ${scheme} ${size} ${loadingTextClass} ${baseClassName}`;
    return (_jsxs("button", { className: className, disabled: disabled || isLoading, ...rest, children: [_jsxs("div", { className: "arkynButtonSpinner", children: [_jsx(Loader2, { size: iconSize, strokeWidth: 2.5 }), loadingText && loadingText] }), _jsxs("div", { className: "arkynButtonContent", children: [_jsx(IconRenderer, { iconSize: iconSize, icon: leftIcon }), children, _jsx(IconRenderer, { iconSize: iconSize, icon: rightIcon })] })] }));
}
export { Button };
