import { cn } from "./index3.js";
import { GradientBorder } from "./index4.js";
import { Spinner } from "./index5.js";
import { Button } from "@base-ui/react/button";
import { cva } from "class-variance-authority";
import { Check, X } from "lucide-react";
import * as React from "react";
import { jsx, jsxs } from "react/jsx-runtime";
//#region src/components/atoms/buttons/Button/Button.tsx
var buttonVariants = cva("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-[color,background-color,border-color,box-shadow,transform,opacity] duration-150 ease-out hover:-translate-y-px active:translate-y-0 active:scale-[0.97] motion-reduce:hover:translate-y-0 motion-reduce:active:scale-100 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none", {
	variants: {
		appearance: {
			solid: "delight-click-ripple",
			gradient: "bg-linear-[113deg] hover:opacity-80 delight-click-ripple",
			soft: "delight-click-ripple",
			outline: "bg-background shadow-xs",
			ghost: "bg-transparent",
			link: "border-none bg-transparent p-0 h-auto underline-offset-4 hover:underline hover:translate-y-0 focus-visible:ring-0 focus-visible:border-transparent",
			ai: "bg-transparent border-0"
		},
		variant: {
			primary: "",
			secondary: "",
			info: "",
			success: "",
			warning: "",
			destructive: ""
		},
		size: {
			default: "h-9 gap-1.5 px-2.5 in-data-[slot=button-group]:rounded-full has-data-[icon=inline-end]:pe-2 has-data-[icon=inline-start]:ps-2",
			xs: "h-6 gap-1 px-2 text-xs in-data-[slot=button-group]:rounded-full has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_svg:not([class*='size-'])]:size-3",
			sm: "h-8 gap-1 px-2.5 in-data-[slot=button-group]:rounded-full has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5",
			md: "h-10 gap-1.5 px-3.5 has-data-[icon=inline-end]:pe-3 has-data-[icon=inline-start]:ps-3",
			lg: "h-11 gap-2 px-4 has-data-[icon=inline-end]:pe-3.5 has-data-[icon=inline-start]:ps-3.5",
			xl: "h-12 gap-2 px-4.5 text-base has-data-[icon=inline-end]:pe-4 has-data-[icon=inline-start]:ps-4 [&_svg:not([class*='size-'])]:size-5",
			"2xl": "h-14 gap-2.5 px-5 text-lg has-data-[icon=inline-end]:pe-4.5 has-data-[icon=inline-start]:ps-4.5 [&_svg:not([class*='size-'])]:size-6",
			icon: "size-9",
			"icon-xs": "size-6 in-data-[slot=button-group]:rounded-full [&_svg:not([class*='size-'])]:size-3",
			"icon-sm": "size-8 in-data-[slot=button-group]:rounded-full",
			"icon-lg": "size-10",
			"icon-xl": "size-12 [&_svg:not([class*='size-'])]:size-5",
			"icon-2xl": "size-14 [&_svg:not([class*='size-'])]:size-6"
		},
		shape: {
			rounded: "rounded-md",
			round: "rounded-full"
		}
	},
	compoundVariants: [
		{
			appearance: "solid",
			variant: "primary",
			className: "bg-primary text-primary-foreground hover:bg-primary/80"
		},
		{
			appearance: "solid",
			variant: "secondary",
			className: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground"
		},
		{
			appearance: "solid",
			variant: "info",
			className: "bg-info text-info-foreground hover:bg-info/80"
		},
		{
			appearance: "solid",
			variant: "success",
			className: "bg-success text-success-foreground hover:bg-success/80"
		},
		{
			appearance: "solid",
			variant: "warning",
			className: "bg-warning text-warning-foreground hover:bg-warning/80"
		},
		{
			appearance: "solid",
			variant: "destructive",
			className: "bg-destructive text-destructive-foreground hover:bg-destructive/80"
		},
		{
			appearance: "gradient",
			variant: "primary",
			className: "from-custom-tw-gradient-from to-custom-tw-gradient-to text-primary-foreground hover:from-custom-tw-gradient-to hover:to-custom-tw-gradient-from"
		},
		{
			appearance: "gradient",
			variant: "secondary",
			className: "from-secondary to-secondary/60 text-secondary-foreground hover:from-secondary/60 hover:to-secondary"
		},
		{
			appearance: "gradient",
			variant: "info",
			className: "from-info to-info/60 text-info-foreground hover:from-info/60 hover:to-info"
		},
		{
			appearance: "gradient",
			variant: "success",
			className: "from-success to-success/60 text-success-foreground hover:from-success/60 hover:to-success"
		},
		{
			appearance: "gradient",
			variant: "warning",
			className: "from-warning to-warning/60 text-warning-foreground hover:from-warning/60 hover:to-warning"
		},
		{
			appearance: "gradient",
			variant: "destructive",
			className: "from-destructive to-destructive/60 text-destructive-foreground hover:from-destructive/60 hover:to-destructive"
		},
		{
			appearance: "soft",
			variant: "primary",
			className: "bg-primary/10 border-primary text-primary hover:bg-primary/20 hover:text-primary dark:bg-primary/30 dark:border-primary dark:text-primary dark:hover:bg-primary/50 shadow-xs"
		},
		{
			appearance: "soft",
			variant: "secondary",
			className: "bg-secondary/10 text-secondary-foreground hover:bg-secondary/20"
		},
		{
			appearance: "soft",
			variant: "info",
			className: "bg-info/10 text-info hover:bg-info/20"
		},
		{
			appearance: "soft",
			variant: "success",
			className: "bg-success/10 text-success hover:bg-success/20"
		},
		{
			appearance: "soft",
			variant: "warning",
			className: "bg-warning/10 text-warning hover:bg-warning/20"
		},
		{
			appearance: "soft",
			variant: "destructive",
			className: "bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30"
		},
		{
			appearance: "outline",
			variant: "primary",
			className: "border-primary text-primary hover:bg-primary/10"
		},
		{
			appearance: "outline",
			variant: "secondary",
			className: "border-border text-secondary-foreground hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground"
		},
		{
			appearance: "outline",
			variant: "info",
			className: "border-info text-info hover:bg-info/10"
		},
		{
			appearance: "outline",
			variant: "success",
			className: "border-success text-success hover:bg-success/10"
		},
		{
			appearance: "outline",
			variant: "warning",
			className: "border-warning text-warning hover:bg-warning/10"
		},
		{
			appearance: "outline",
			variant: "destructive",
			className: "border-destructive text-destructive hover:bg-destructive/10"
		},
		{
			appearance: "ghost",
			variant: "primary",
			className: "text-primary hover:bg-primary/10"
		},
		{
			appearance: "ghost",
			variant: "secondary",
			className: "hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground"
		},
		{
			appearance: "ghost",
			variant: "info",
			className: "text-info hover:bg-info/10"
		},
		{
			appearance: "ghost",
			variant: "success",
			className: "text-success hover:bg-success/10"
		},
		{
			appearance: "ghost",
			variant: "warning",
			className: "text-warning hover:bg-warning/10"
		},
		{
			appearance: "ghost",
			variant: "destructive",
			className: "text-destructive hover:bg-destructive/10"
		},
		{
			appearance: "ai",
			variant: "primary",
			className: "text-primary hover:bg-primary/10"
		},
		{
			appearance: "ai",
			variant: "secondary",
			className: "text-secondary-foreground hover:bg-muted"
		},
		{
			appearance: "link",
			variant: "primary",
			className: "text-primary"
		},
		{
			appearance: "link",
			variant: "secondary",
			className: "text-secondary-foreground"
		},
		{
			appearance: "link",
			variant: "info",
			className: "text-info"
		},
		{
			appearance: "link",
			variant: "success",
			className: "text-success"
		},
		{
			appearance: "link",
			variant: "warning",
			className: "text-warning"
		},
		{
			appearance: "link",
			variant: "destructive",
			className: "text-error-700 hover:text-error-800 dark:text-error-400 dark:hover:text-error-300"
		}
	],
	defaultVariants: {
		appearance: "solid",
		variant: "primary",
		size: "default",
		shape: "round"
	}
});
var dotColorClasses = {
	success: "bg-success",
	error: "bg-destructive",
	warning: "bg-warning",
	brand: "bg-primary",
	gray: "bg-muted"
};
var devWarnings = /* @__PURE__ */ new Set();
/** Icon-only size variants for type-safe detection */
var ICON_SIZES = [
	"icon",
	"icon-xs",
	"icon-sm",
	"icon-lg",
	"icon-xl",
	"icon-2xl"
];
var Dot = ({ color = "success", className }) => /* @__PURE__ */ jsx("span", {
	"aria-hidden": "true",
	className: cn("size-2 rounded-full shrink-0 delight-breathing", dotColorClasses[color], className)
});
var Button$1 = React.forwardRef(({ children, loading = false, disabled, startIcon, endIcon, dotIndicator = false, dotColor = "success", iconOnly = false, animated, render, className, appearance = "solid", variant = "primary", shape = "round", size = "default", ...props }, ref) => {
	if (process.env.NODE_ENV !== "production" && !devWarnings.has("icon-a11y")) {
		const hasIconSize = ICON_SIZES.includes(size);
		if ((iconOnly || hasIconSize) && !props["aria-label"] && !props["aria-labelledby"]) {
			devWarnings.add("icon-a11y");
			console.warn("Button: Icon-only buttons require an `aria-label` or `aria-labelledby` for accessibility.");
		}
	}
	const prevLoadingRef = React.useRef(loading);
	const [showSuccess, setShowSuccess] = React.useState(false);
	React.useEffect(() => {
		const wasLoading = prevLoadingRef.current;
		prevLoadingRef.current = loading;
		if (loading) setShowSuccess(false);
		else if (wasLoading) {
			setShowSuccess(true);
			const timer = setTimeout(() => setShowSuccess(false), 600);
			return () => clearTimeout(timer);
		}
	}, [loading]);
	const isAi = appearance === "ai";
	const isAnimated = isAi ? animated ?? loading : false;
	const buttonClassName = cn(buttonVariants({
		appearance,
		variant,
		shape,
		size
	}), className);
	if (render) return /* @__PURE__ */ jsx(Button, {
		ref,
		"data-slot": "button",
		className: buttonClassName,
		render,
		...props,
		children
	});
	const buttonElement = iconOnly || ICON_SIZES.includes(size) ? /* @__PURE__ */ jsx(Button, {
		ref: isAi ? void 0 : ref,
		"data-slot": "button",
		disabled: disabled || loading,
		className: cn(buttonClassName, loading && "relative"),
		...props,
		children: loading ? /* @__PURE__ */ jsx(Spinner, { className: "delight-fade-in" }) : showSuccess ? /* @__PURE__ */ jsx(Check, { className: "delight-bounce-in" }) : children
	}) : /* @__PURE__ */ jsxs(Button, {
		ref: isAi ? void 0 : ref,
		"data-slot": "button",
		disabled: disabled || loading,
		className: cn(buttonClassName, (loading || showSuccess) && "relative"),
		...props,
		children: [
			loading && /* @__PURE__ */ jsx(Spinner, { className: "absolute delight-fade-in" }),
			showSuccess && !loading && /* @__PURE__ */ jsx(Check, { className: "absolute delight-bounce-in" }),
			/* @__PURE__ */ jsxs("span", {
				className: cn("flex items-center gap-2", (loading || showSuccess) && "invisible"),
				children: [
					dotIndicator && /* @__PURE__ */ jsx(Dot, { color: dotColor }),
					startIcon,
					children,
					endIcon
				]
			})
		]
	});
	if (isAi) return /* @__PURE__ */ jsx(GradientBorder, {
		ref,
		animated: isAnimated,
		active: true,
		disabled,
		className: "w-auto inline-flex motion-reduce:animate-none",
		innerClassName: "flex",
		children: buttonElement
	});
	return buttonElement;
});
Button$1.displayName = "Button";
function ClearButton({ className, size = "icon-sm", ...props }) {
	return /* @__PURE__ */ jsx(Button$1, {
		appearance: "ghost",
		variant: "secondary",
		size,
		iconOnly: true,
		className: cn("text-quaternary-foreground hover:text-secondary-foreground", className),
		"aria-label": "Clear",
		...props,
		children: /* @__PURE__ */ jsx(X, {})
	});
}
ClearButton.displayName = "ClearButton";
//#endregion
export { Button$1 as Button, ClearButton, Dot, buttonVariants };

//# sourceMappingURL=index6.js.map