import { cn } from "./cva.js";
import { useFieldControl } from "./Field.js";
import * as React from "react";
import { jsx } from "react/jsx-runtime";
import * as RSwitch from "@radix-ui/react-switch";
//#region src/Switch.tsx
const Switch = React.forwardRef(({ id, className, ...props }, ref) => {
	const field = useFieldControl();
	return /* @__PURE__ */ jsx(RSwitch.Root, {
		ref,
		id: id ?? field?.id,
		"aria-describedby": props["aria-describedby"] ?? field?.describedBy,
		className: cn("inline-flex h-5 w-9 items-center rounded-full border border-border bg-surface px-0.5 transition-colors disabled:opacity-50 disabled:cursor-not-allowed data-[state=checked]:bg-accent", className),
		...props,
		children: /* @__PURE__ */ jsx(RSwitch.Thumb, { className: "block h-4 w-4 rounded-full bg-fg transition-transform data-[state=checked]:translate-x-4" })
	});
});
Switch.displayName = "Switch";
//#endregion
export { Switch };
