"use client";
import { cn } from "./index3.js";
import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
import { jsx, jsxs } from "react/jsx-runtime";
import { DirectionProvider } from "@base-ui/react/direction-provider";
import { Slider } from "@base-ui/react/slider";
//#region src/components/ui/slider.tsx
/**
* Hook to detect direction from nearest ancestor with dir attribute
*/
function useAutoDirection(explicitDir) {
	const ref = useRef(null);
	const [detectedDir, setDetectedDir] = useState("ltr");
	useEffect(() => {
		if (explicitDir) return;
		const detect = () => {
			if (ref.current) {
				const computed = getComputedStyle(ref.current).direction;
				setDetectedDir(computed === "rtl" ? "rtl" : "ltr");
			}
		};
		detect();
		const observer = new MutationObserver(detect);
		if (ref.current) {
			const closest = ref.current.closest("[dir]");
			const docEl = ref.current.ownerDocument.documentElement;
			if (closest) observer.observe(closest, {
				attributes: true,
				attributeFilter: ["dir"]
			});
			if (docEl !== closest) observer.observe(docEl, {
				attributes: true,
				attributeFilter: ["dir"]
			});
		}
		return () => observer.disconnect();
	}, [explicitDir]);
	return {
		ref,
		direction: explicitDir ?? detectedDir
	};
}
var trackSizeClasses = {
	sm: "data-[orientation=horizontal]:h-1.5 data-[orientation=vertical]:w-1.5",
	md: "data-[orientation=horizontal]:h-2 data-[orientation=vertical]:w-2",
	lg: "data-[orientation=horizontal]:h-3 data-[orientation=vertical]:w-3"
};
var colorClasses = {
	primary: {
		indicator: "bg-primary",
		track: "bg-muted",
		thumb: "border-primary ring-primary/20"
	},
	info: {
		indicator: "bg-info",
		track: "bg-info/20",
		thumb: "border-info ring-info/20"
	},
	success: {
		indicator: "bg-success",
		track: "bg-success/20",
		thumb: "border-success ring-success/20"
	},
	warning: {
		indicator: "bg-warning",
		track: "bg-warning/20",
		thumb: "border-warning ring-warning/20"
	},
	error: {
		indicator: "bg-destructive",
		track: "bg-destructive/20",
		thumb: "border-destructive ring-destructive/20"
	}
};
var Slider$1 = forwardRef(({ className, defaultValue, value, min = 0, max = 100, dir, size = "md", color = "primary", ...props }, forwardedRef) => {
	const { ref, direction } = useAutoDirection(dir);
	const colors = colorClasses[color];
	const _values = useMemo(() => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min], [
		value,
		defaultValue,
		min
	]);
	return /* @__PURE__ */ jsx("div", {
		ref,
		className: "contents",
		children: /* @__PURE__ */ jsx(DirectionProvider, {
			direction,
			children: /* @__PURE__ */ jsx(Slider.Root, {
				ref: forwardedRef,
				className: "data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full",
				"data-slot": "slider",
				"data-color": color,
				"data-size": size,
				defaultValue,
				value,
				min,
				max,
				...props,
				children: /* @__PURE__ */ jsxs(Slider.Control, {
					className: cn("group/slider data-[orientation=vertical]:min-h-40 relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col", className),
					children: [/* @__PURE__ */ jsx(Slider.Track, {
						"data-slot": "slider-track",
						className: cn("rounded-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full relative overflow-hidden select-none transition-transform duration-200 ease-out origin-center data-[orientation=horizontal]:group-hover/slider:scale-y-[1.5] data-[orientation=vertical]:group-hover/slider:scale-x-[1.5] motion-reduce:transition-none motion-reduce:group-hover/slider:scale-100", trackSizeClasses[size], colors.track),
						children: /* @__PURE__ */ jsx(Slider.Indicator, {
							"data-slot": "slider-range",
							className: cn("select-none data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full", colors.indicator)
						})
					}), Array.from({ length: _values.length }, (_, index) => /* @__PURE__ */ jsx(Slider.Thumb, {
						"data-slot": "slider-thumb",
						className: cn("relative size-5 rounded-full border-2 bg-background shadow-sm transition-[color,box-shadow,transform] duration-150 ease-out hover:ring-4 hover:scale-110 focus-visible:ring-4 focus-visible:scale-110 active:scale-105 data-[dragging]:shadow-md data-[dragging]:scale-110 focus-visible:outline-hidden block shrink-0 select-none disabled:pointer-events-none disabled:opacity-50 motion-reduce:transition-none motion-reduce:hover:scale-100 motion-reduce:focus-visible:scale-100 motion-reduce:active:scale-100 motion-reduce:data-[dragging]:scale-100 before:absolute before:-inset-3 before:rounded-full", colors.thumb)
					}, index))]
				})
			})
		})
	});
});
Slider$1.displayName = "Slider";
//#endregion
export { colorClasses, trackSizeClasses, useAutoDirection };

//# sourceMappingURL=index33.js.map