import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Loader2 } from "lucide-react";
import "./styles.css";
/**
 * IconButton component - compact button that renders only an icon
 *
 * @param props - IconButton component properties
 * @param props.icon - Icon to render inside the button (LucideIcon). Required
 * @param props.aria-label - Accessible label for screen readers. Required
 * @param props.isLoading - Controls loading state with spinner. Default: false
 * @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"
 *
 * **...Other valid HTML properties for button element (children not supported)**
 *
 * @returns IconButton JSX element
 *
 * @example
 * ```tsx
 * // Basic icon button
 * <IconButton icon={Plus} aria-label="Add" />
 *
 * // Different color scheme and variant
 * <IconButton icon={Trash2} aria-label="Delete" scheme="danger" variant="outline" />
 *
 * // Loading state
 * <IconButton icon={Save} aria-label="Saving" isLoading />
 *
 * // Sizes
 * <IconButton icon={MoreVertical} aria-label="More options" size="sm" />
 * ```
 */
function IconButton(props) {
    const { isLoading = false, scheme = "primary", variant = "solid", size = "md", icon: Icon, disabled, className: baseClassName = "", ...rest } = props;
    const iconSize = { xs: 12, sm: 16, md: 20, lg: 24 };
    const loading = isLoading ? "loadingTrue" : "loadingFalse";
    const className = `arkynIconButton ${variant} ${scheme} ${size} ${loading} ${baseClassName}`;
    return (_jsxs("button", { disabled: disabled || isLoading, className: className.trim(), ...rest, children: [_jsx("div", { className: "arkynIconButtonSpinner", children: _jsx(Loader2, { size: iconSize[size], strokeWidth: 2.5 }) }), _jsx("div", { className: "arkynIconButtonContent", children: _jsx(Icon, { size: iconSize[size], strokeWidth: 2.5 }) })] }));
}
export { IconButton };
