"use client";
import { cn } from "./index3.js";
import { FieldTooltip } from "./index19.js";
import { hasFieldProps, splitFieldProps } from "./index20.js";
import { Field, FieldBottom, FieldDescription, FieldError, FieldLabel, useFieldContextOptional } from "./index22.js";
import { DrawCheck } from "./index23.js";
import { cva } from "class-variance-authority";
import { Minus } from "lucide-react";
import * as React from "react";
import { jsx, jsxs } from "react/jsx-runtime";
import { Checkbox } from "@base-ui/react/checkbox";
//#region src/components/atoms/forms/Checkbox/Checkbox.tsx
var checkboxVariants = cva("relative flex shrink-0 items-center justify-center border shadow-xs transition-[border-color,background-color,color,box-shadow] duration-200 ease-out motion-reduce:transition-none focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50", {
	variants: {
		variant: {
			primary: "",
			secondary: "",
			info: "",
			success: "",
			warning: "",
			destructive: ""
		},
		size: {
			sm: "size-4 rounded-[4px]",
			md: "size-5 rounded-[5px]",
			lg: "size-6 rounded-[6px]"
		},
		checked: {
			true: "",
			false: ""
		}
	},
	compoundVariants: [
		{
			checked: false,
			className: "bg-background border-border hover:border-primary hover:bg-primary/10"
		},
		{
			variant: "primary",
			checked: true,
			className: "border-primary bg-primary text-primary-foreground hover:bg-primary/90"
		},
		{
			variant: "secondary",
			checked: true,
			className: "border-border bg-background text-foreground hover:bg-muted"
		},
		{
			variant: "info",
			checked: true,
			className: "border-info bg-info text-info-foreground hover:bg-info/90"
		},
		{
			variant: "success",
			checked: true,
			className: "border-success bg-success text-success-foreground hover:bg-success/90"
		},
		{
			variant: "warning",
			checked: true,
			className: "border-warning bg-warning text-warning-foreground hover:bg-warning/90"
		},
		{
			variant: "destructive",
			checked: true,
			className: "border-destructive bg-destructive text-destructive-foreground hover:bg-destructive/90"
		}
	],
	defaultVariants: {
		variant: "primary",
		size: "sm",
		checked: false
	}
});
var iconClasses = {
	sm: "size-3",
	md: "size-3.5",
	lg: "size-4"
};
var CheckboxControl = React.forwardRef(({ className, variant: variantProp, size = "sm", checked: controlledChecked, defaultChecked = false, onCheckedChange, ...props }, ref) => {
	const [internalChecked, setInternalChecked] = React.useState(defaultChecked);
	const isControlled = controlledChecked !== void 0;
	const checked = isControlled ? controlledChecked : internalChecked;
	const hasFieldError = useFieldContextOptional()?.state === "destructive";
	const variant = variantProp ?? (hasFieldError ? "destructive" : "primary");
	const handleCheckedChange = React.useCallback((newChecked) => {
		if (!isControlled) setInternalChecked(newChecked);
		onCheckedChange?.(newChecked);
	}, [isControlled, onCheckedChange]);
	return /* @__PURE__ */ jsx(Checkbox.Root, {
		ref,
		"data-slot": "checkbox",
		"data-size": size,
		"data-variant": variant,
		checked,
		onCheckedChange: handleCheckedChange,
		className: cn(checkboxVariants({
			variant,
			size,
			checked
		}), "before:content-[\"\"] before:absolute before:-inset-[4px] before:rounded-[inherit]", "focus-visible:ring-4 focus-visible:ring-bg-secondary focus-visible:shadow-[0_0_0_2px_var(--card),0_0_0_4px_var(--border)]", "dark:focus-visible:ring-bg-tertiary dark:focus-visible:shadow-[0_0_0_2px_var(--card),0_0_0_4px_var(--border)]", checked && "delight-check-bounce", className),
		...props,
		children: /* @__PURE__ */ jsx(Checkbox.Indicator, {
			"data-slot": "checkbox-indicator",
			className: "flex items-center justify-center text-current",
			children: props.indeterminate ? /* @__PURE__ */ jsx(Minus, {
				className: cn(iconClasses[size], "animate-[scale-in_150ms_ease-out] motion-reduce:animate-none"),
				strokeWidth: 3
			}) : /* @__PURE__ */ jsx(DrawCheck, { className: iconClasses[size] })
		})
	});
});
CheckboxControl.displayName = "CheckboxControl";
var Checkbox$1 = React.forwardRef((props, forwardedRef) => {
	const [fieldPropsObj, controlProps] = splitFieldProps(props);
	const { ref: _ref, ...cp } = controlProps;
	if (!hasFieldProps(fieldPropsObj)) return /* @__PURE__ */ jsx(CheckboxControl, {
		ref: forwardedRef,
		...cp,
		required: fieldPropsObj.required
	});
	const { label, required, labelIcon, tooltip, description, error, fieldClassName } = fieldPropsObj;
	return /* @__PURE__ */ jsxs(Field, {
		layout: "inline",
		state: error ? "destructive" : void 0,
		disabled: cp.disabled,
		className: fieldClassName,
		children: [
			/* @__PURE__ */ jsx(CheckboxControl, {
				ref: forwardedRef,
				...cp,
				required
			}),
			label && /* @__PURE__ */ jsxs(FieldLabel, {
				required,
				labelIcon,
				children: [label, tooltip && /* @__PURE__ */ jsx(FieldTooltip, { content: tooltip })]
			}),
			(error || description) && /* @__PURE__ */ jsxs(FieldBottom, { children: [error && /* @__PURE__ */ jsx(FieldError, { children: error }), !error && description && /* @__PURE__ */ jsx(FieldDescription, { children: description })] })
		]
	});
});
Checkbox$1.displayName = "Checkbox";
//#endregion
export { Checkbox$1 as Checkbox };

//# sourceMappingURL=index24.js.map