@jfrader/ui 0.5.1 → 0.7.0

package/dist/{signature-pad-_bTeguN9.js → signature-pad-khL2yhQI.js}

@@ -1,17 +1,18 @@
 'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { n } from "./focus-ring-BK5W5_NY.js";
-import { n as r, r as i } from "./media-8yrN85VT.js";
+import { i as e } from "./css-BYJhdGh-.js";
+import { n as t } from "./focus-ring-BK5W5_NY.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
 import { t as a } from "./use-controlled-state-DpeVQZNR.js";
-import { t as o } from "./visually-hidden-BJdvqqvn.js";
+import { t as o } from "./visually-hidden-DgVO3NaB.js";
 import { t as s } from "./renderable-DzcIj1Lo.js";
-import { t as c } from "./button-NLY0h6EJ.js";
-import { t as l } from "./radio-group-TIK0-iPX.js";
+import { t as c } from "./button-C6OV0C7J.js";
+import { t as l } from "./radio-group-DItMf2YM.js";
 import { useEffect as u, useId as ee, useImperativeHandle as te, useLayoutEffect as d, useRef as f, useState as ne } from "react";
 import { vars as p } from "@jfrader/tokens/vars";
 import { jsx as m, jsxs as h } from "@emotion/react/jsx-runtime";
-import { useMergeRefs as re } from "@floating-ui/react";
 import { base as g } from "@jfrader/tokens";
+import { useMergeRefs as re } from "@floating-ui/react";
 //#region src/components/signature-pad/signature-pad.tsx
 var _ = 600, v = 260, ie = 4096, y = 1e5, ae = 1e3, oe = 2, se = 3, ce = 60, le = 8e3, ue = 500, de = [], b = (e) => s(e) && e !== "", x = {
 	fine: 2,
@@ -173,9 +174,9 @@ var be = e({
 	border: `1px solid ${p.color.borderControl}`,
 	borderRadius: p.radius.lg,
 	touchAction: "none",
-	"&:focus-visible": n,
+	"&:focus-visible": t,
 	"&[aria-disabled=\"true\"], &[data-readonly]": { touchAction: "auto" },
-	[r]: {
+	[n]: {
 		borderColor: "CanvasText",
 		color: "CanvasText"
 	}
@@ -192,15 +193,15 @@ var be = e({
 	fontSize: p.textSize.xs,
 	transitionProperty: "opacity",
 	transitionDuration: p.motion.duration.base,
-	[i]: { transitionDuration: "0s" }
+	[r]: { transitionDuration: "0s" }
 }), we = e({
 	display: "flex",
 	flexWrap: "wrap",
 	alignItems: "center",
 	gap: p.space[3]
 }), Te = e({ fontWeight: p.fontWeight.medium }), Ee = e({ color: p.color.textMuted }), De = e({ color: p.color.dangerText }), M = (e, t) => e === t || JSON.stringify(e) === JSON.stringify(t);
-function N({ ref: e, apiRef: n, value: r, defaultValue: i = de, onValueChange: s, color: p, defaultColor: g = "black", onColorChange: ie, width: oe, defaultWidth: se = "medium", onWidthChange: C, label: w, description: T, error: E, signer: O, hint: k, disabled: A = !1, readOnly: j = !1, required: N = !1, replay: Oe = !0, download: ke = !1, fileName: Ae = "signature", historyLimit: je = ce, messages: P, icons: Me, exportOptions: F, slotProps: I, className: Ne, sx: Pe, dir: Fe, style: Ie, onPointerDown: Le, onPointerMove: Re, onPointerUp: ze, onPointerCancel: Be, onLostPointerCapture: Ve, onKeyDown: He, "aria-labelledby": Ue, "aria-describedby": We, ...L }) {
-	let R = ee(), z = f(null), Ge = re([z, e]), Ke = f(i), [B = de, qe] = a(r, Ke.current, s), [Je = "black", Ye] = a(p, g, ie), [Xe = "medium", Ze] = a(oe, se, C), V = f({
+function N({ ref: e, apiRef: t, value: n, defaultValue: r = de, onValueChange: s, color: p, defaultColor: g = "black", onColorChange: ie, width: oe, defaultWidth: se = "medium", onWidthChange: C, label: w, description: T, error: E, signer: O, hint: k, disabled: A = !1, readOnly: j = !1, required: N = !1, replay: Oe = !0, download: ke = !1, fileName: Ae = "signature", historyLimit: je = ce, messages: P, icons: Me, exportOptions: F, slotProps: I, className: Ne, sx: Pe, dir: Fe, style: Ie, onPointerDown: Le, onPointerMove: Re, onPointerUp: ze, onPointerCancel: Be, onLostPointerCapture: Ve, onKeyDown: He, "aria-labelledby": Ue, "aria-describedby": We, ...L }) {
+	let R = ee(), z = f(null), Ge = re([z, e]), Ke = f(r), [B = de, qe] = a(n, Ke.current, s), [Je = "black", Ye] = a(p, g, ie), [Xe = "medium", Ze] = a(oe, se, C), V = f({
 		present: B,
 		past: [],
 		future: []
@@ -377,7 +378,7 @@ function N({ ref: e, apiRef: n, value: r, defaultValue: i = de, onValueChange: s
 		let t = e.currentTarget.querySelectorAll("input[type=\"radio\"]:not(:disabled)"), n = e.key === "Home" ? t[0] : t[t.length - 1];
 		n && (e.preventDefault(), n.focus(), n.click());
 	}
-	te(n, () => ({
+	te(t, () => ({
 		focus: () => z.current?.focus(),
 		clear: ct,
 		undo: ot,
@@ -456,7 +457,7 @@ function N({ ref: e, apiRef: n, value: r, defaultValue: i = de, onValueChange: s
 			}
 		}] : []
 	];
-	return /* @__PURE__ */ m(t, {
+	return /* @__PURE__ */ m(i, {
 		className: [Ne, I?.root?.className].filter(Boolean).join(" "),
 		styles: [be, I?.root?.css],
 		sx: Pe,

package/dist/signature-pad.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as SignatureExportError, n as SignaturePad, r as signatureToPng, i as signatureToSvg } from "./signature-pad-_bTeguN9.js";
+export { t as SignatureExportError, n as SignaturePad, r as signatureToPng, i as signatureToSvg } from "./signature-pad-khL2yhQI.js";

package/dist/{skeleton-XQQDkCHd.js → skeleton-LJsQsveI.js}

@@ -1,6 +1,7 @@
 'use client';
-import { i as e, r as t, t as n } from "./sx-Dx9JUKp5.js";
-import { r } from "./media-8yrN85VT.js";
+import { a as e, i as t } from "./css-BYJhdGh-.js";
+import { r as n } from "./media-8yrN85VT.js";
+import { t as r } from "./sx-BJXJ2xJK.js";
 import { vars as i } from "@jfrader/tokens/vars";
 import { jsx as a } from "@emotion/react/jsx-runtime";
 //#region src/components/skeleton/skeleton.tsx
@@ -19,7 +20,7 @@ var o = e({
 	backgroundRepeat: "no-repeat",
 	animation: `${o} 1.6s ease-in-out infinite`,
 	"&:dir(rtl)": { animationDirection: "reverse" },
-	[r]: {
+	[n]: {
 		animation: "none",
 		backgroundImage: "none"
 	}
@@ -29,23 +30,23 @@ var o = e({
 	aspectRatio: "1",
 	borderRadius: i.radius.full
 });
-function l({ ref: e, width: t, height: r, circle: i = !1, radius: o, style: l, className: u, sx: d, ...f }) {
-	return /* @__PURE__ */ a(n, {
+function l({ ref: e, width: t, height: n, circle: i = !1, radius: o, style: l, className: u, sx: d, ...f }) {
+	return /* @__PURE__ */ a(r, {
 		className: u,
 		styles: [s, i && c],
 		sx: d,
-		children: (n) => /* @__PURE__ */ a("div", {
+		children: (r) => /* @__PURE__ */ a("div", {
 			...f,
 			ref: e,
 			"aria-hidden": "true",
 			"data-ui": "skeleton",
 			style: {
 				inlineSize: t,
-				blockSize: r,
+				blockSize: n,
 				borderRadius: i ? void 0 : o,
 				...l
 			},
-			className: n
+			className: r
 		})
 	});
 }

package/dist/skeleton.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Skeleton } from "./skeleton-XQQDkCHd.js";
+export { t as Skeleton } from "./skeleton-LJsQsveI.js";

package/dist/slider-DjAnGmlC.js

@@ -0,0 +1,535 @@
+'use client';
+import { i as e } from "./css-BYJhdGh-.js";
+import { n as t } from "./focus-ring-BK5W5_NY.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
+import { t as a } from "./use-controlled-state-DpeVQZNR.js";
+import { t as o } from "./visually-hidden-DgVO3NaB.js";
+import { t as s } from "./renderable-DzcIj1Lo.js";
+import { useEffect as c, useId as l, useMemo as u, useRef as d, useState as f } from "react";
+import { vars as p } from "@jfrader/tokens/vars";
+import { createElement as m } from "@emotion/react";
+import { jsx as h, jsxs as g } from "@emotion/react/jsx-runtime";
+import { MotionConfig as _, motion as ee, useReducedMotion as v } from "motion/react";
+//#region src/components/slider/use-slider-interaction.ts
+var y = 1e-7, b = "data-slider-thumb";
+function x(e, t) {
+	return typeof e == "number" ? e === t : typeof t != "number" && e[0] === t[0] && e[1] === t[1];
+}
+function te(...e) {
+	return e.filter(Boolean).join(" ") || void 0;
+}
+function S(e) {
+	return s(e) && e !== "";
+}
+function C(e, t) {
+	return typeof e == "function" ? e(t) : e;
+}
+function w(e, t, n) {
+	let r = u(() => new Intl.NumberFormat(e, t), [e, t]);
+	return {
+		formatter: r,
+		format: (e) => n ? n(e, r) : r.format(e)
+	};
+}
+function T(e) {
+	let { component: t, range: n, value: r, defaultValue: i, min: o, max: s, step: u, largeStep: p, minStepsBetweenThumbs: m, disabled: h, onValueChange: g, onValueCommit: _, onPointerSample: ee, resolvePointer: v, onGestureEnd: te } = e, S = (s - o) / u;
+	if (![
+		o,
+		s,
+		u,
+		S
+	].every(Number.isFinite) || s <= o || u <= 0 || !Number.isSafeInteger(Math.round(S)) || Math.abs(S - Math.round(S)) > y) throw Error(`${t} requires finite min < max, a positive step, and max aligned to min + n * step.`);
+	if (!Number.isInteger(m) || m < 0 || m > Math.round(S)) throw Error(`${t} minStepsBetweenThumbs must be a nonnegative integer that fits the domain.`);
+	if (p !== void 0 && (!Number.isFinite(p) || p <= 0)) throw Error(`${t} largeStep must be finite and positive.`);
+	let C = m * u, w = Math.max(1, Math.round((p ?? (s - o) / 10) / u)) * u, T = (e) => {
+		if (!Number.isFinite(e)) throw Error(`${t} values must be finite.`);
+		let n = Math.max(0, Math.min(Math.round(S), Math.round((e - o) / u))), r = o + n * u, i = Number(r.toPrecision(15));
+		return Math.abs(i - r) <= u * y ? i : r;
+	}, E = (e) => {
+		if (!n) {
+			if (typeof e != "number") throw Error(`${t} single mode requires a number.`);
+			return T(e);
+		}
+		if (typeof e == "number" || e.length !== 2 || e[0] > e[1]) throw Error(`${t} range requires an ordered [lower, upper] tuple.`);
+		let r = T(e[0]), i = T(e[1]);
+		if ((i - r) / u + y < m) throw Error(`${t} range values must respect minStepsBetweenThumbs.`);
+		return [r, i];
+	}, [ne] = f(() => E(i ?? (n ? [o, s] : o))), [re, ie, D] = a(r, ne, g), O = E(re ?? ne), k = typeof O == "number" ? [O] : O, ae = l(), A = d(null), j = d(null), M = d(0), [oe, N] = f(null), P = (e) => n ? [e === 0 ? o : T(k[0] + C), e === 0 ? T(k[1] - C) : s] : [o, s], F = (e, t) => {
+		let [r, i] = P(e), a = T(Math.max(r, Math.min(i, t)));
+		return n ? e === 0 ? [a, k[1]] : [k[0], a] : a;
+	}, I = (e) => {
+		x(O, e) || ie(e);
+	}, L = (e) => {
+		let t = j.current;
+		t && (j.current = null, N(null), te?.(e), t.control.hasPointerCapture(t.pointerId) && t.control.releasePointerCapture(t.pointerId), e && !x(t.initial, t.candidate) && _(t.candidate));
+	};
+	c(() => {
+		h && L(!1);
+	}, [h]), c(() => () => {
+		let e = j.current;
+		j.current = null, e?.control.hasPointerCapture(e.pointerId) && e.control.releasePointerCapture(e.pointerId);
+	}, []), c(() => {
+		let e = A.current?.closest("form");
+		if (!e) return;
+		let t = (e) => {
+			queueMicrotask(() => {
+				e.defaultPrevented || (L(!1), D());
+			});
+		};
+		return e.addEventListener("reset", t), () => e.removeEventListener("reset", t);
+	}, [D]);
+	let R = (e) => A.current?.querySelector(`[${b}="${e}"]`)?.focus(), z = () => A.current?.matches(":dir(rtl)") ?? !1, B = (e) => {
+		let t = A.current.getBoundingClientRect(), n = t.width > 0 ? (e - t.left) / t.width : 0;
+		return o + (z() ? 1 - n : n) * (s - o);
+	}, V = (e) => n ? Math.abs(e - k[0]) === Math.abs(e - k[1]) ? M.current : Math.abs(e - k[0]) < Math.abs(e - k[1]) ? 0 : 1 : 0, H = (e) => {
+		let t = j.current;
+		if (!t || e.pointerId !== t.pointerId || h) return;
+		t.coincident && e.clientX !== t.originX && (t.thumb = e.clientX > t.originX === z() ? 0 : 1, t.coincident = !1, N(t.thumb), R(t.thumb));
+		let [n, r] = P(t.thumb), i = A.current.getBoundingClientRect().width, a = {
+			raw: B(e.clientX - t.offset),
+			low: n,
+			high: r,
+			pxPerUnit: i / (s - o),
+			rtl: z(),
+			pointerType: e.pointerType
+		};
+		ee?.(a);
+		let c = F(t.thumb, v ? v(a) : a.raw);
+		x(t.candidate, c) || (t.candidate = c, I(c));
+	}, se = (e) => {
+		if (e.defaultPrevented || h || j.current || !e.isPrimary || e.button !== 0) return;
+		let t = e.target.closest(`[${b}]`), r = t ? Number(t.getAttribute(b)) : V(B(e.clientX)), i = t?.getBoundingClientRect(), a = i ? e.clientX - (i.left + i.width / 2) : 0;
+		j.current = {
+			pointerId: e.pointerId,
+			thumb: r,
+			offset: a,
+			originX: e.clientX,
+			coincident: n && k[0] === k[1],
+			initial: O,
+			candidate: O,
+			control: e.currentTarget
+		}, e.currentTarget.setPointerCapture(e.pointerId), e.preventDefault(), N(r), R(r), t || H(e);
+	}, ce = (e, t) => {
+		if (h || e.defaultPrevented) return;
+		let n = z() ? -1 : 1, r = e.shiftKey ? w : u, [i, a] = P(t), o = {
+			ArrowRight: k[t] + r * n,
+			ArrowLeft: k[t] - r * n,
+			ArrowUp: k[t] + r,
+			ArrowDown: k[t] - r,
+			PageUp: k[t] + w,
+			PageDown: k[t] - w,
+			Home: i,
+			End: a
+		}[e.key];
+		if (o === void 0) return;
+		e.preventDefault();
+		let s = F(t, o);
+		x(O, s) || (I(s), _(s));
+	};
+	return {
+		id: ae,
+		controlRef: A,
+		current: O,
+		values: k,
+		active: oe,
+		bounds: P,
+		percent: (e) => (e - o) / (s - o) * 100,
+		normalizeMarks: (e) => Array.from(new Map(e.flatMap((e) => {
+			let t = typeof e == "number" ? { value: e } : e;
+			return Number.isFinite(t.value) && t.value >= o && t.value <= s ? [[T(t.value), {
+				...t,
+				value: T(t.value)
+			}]] : [];
+		})).values()),
+		controlHandlers: (e) => ({
+			ref: (t) => {
+				A.current = t;
+				let n = e?.ref;
+				if (typeof n == "function") return n(t);
+				n && (n.current = t);
+			},
+			onPointerDown: (t) => {
+				e?.onPointerDown?.(t), se(t);
+			},
+			onPointerMove: (t) => {
+				e?.onPointerMove?.(t), t.defaultPrevented || H(t);
+			},
+			onPointerUp: (t) => {
+				e?.onPointerUp?.(t), j.current?.pointerId === t.pointerId && L(!0);
+			},
+			onPointerCancel: (t) => {
+				e?.onPointerCancel?.(t), j.current?.pointerId === t.pointerId && L(!1);
+			},
+			onLostPointerCapture: (t) => {
+				e?.onLostPointerCapture?.(t), j.current?.pointerId === t.pointerId && L(!1);
+			}
+		}),
+		handleRootKeyDown: (e) => {
+			let t = e.target.closest(`[${b}]`);
+			t && A.current?.contains(t) && ce(e, Number(t.getAttribute(b)));
+		},
+		selectMark: (e) => {
+			if (h) return;
+			let t = F(V(e), e);
+			x(O, t) || (I(t), _(t));
+		},
+		noteFocus: (e) => {
+			M.current = e;
+		}
+	};
+}
+//#endregion
+//#region src/components/slider/slider-style.ts
+var E = e({
+	display: "grid",
+	gap: p.space[2],
+	minInlineSize: 0,
+	inlineSize: "100%",
+	fontFamily: p.font.sans,
+	fontSize: p.textSize.sm,
+	lineHeight: p.lineHeight.base,
+	color: p.color.text
+}), ne = e({
+	display: "flex",
+	flexWrap: "wrap",
+	justifyContent: "space-between",
+	gap: p.space[2],
+	alignItems: "baseline"
+}), re = e({ fontWeight: p.fontWeight.medium }), ie = e({
+	fontVariantNumeric: "tabular-nums",
+	overflowWrap: "anywhere"
+}), D = e({ color: p.color.textMuted }), O = e({ color: p.color.dangerText }), k = e({
+	display: "flex",
+	alignItems: "center",
+	gap: p.space[3],
+	minInlineSize: 0,
+	paddingBlockStart: p.space[8]
+}), ae = e({
+	position: "relative",
+	flex: 1,
+	minInlineSize: p.space[8],
+	marginInline: p.space[4],
+	touchAction: "pan-y",
+	userSelect: "none",
+	cursor: "pointer",
+	"&[data-disabled]": { cursor: "default" }
+}), A = {
+	sm: e({ minBlockSize: p.space[8] }),
+	md: e({ minBlockSize: p.space[10] })
+}, j = e({
+	display: "flex",
+	flexWrap: "wrap",
+	gap: p.space[2]
+}), M = e({
+	minBlockSize: p.space[8],
+	minInlineSize: p.space[8],
+	paddingBlock: p.space[1],
+	paddingInline: p.space[2],
+	font: "inherit",
+	overflowWrap: "anywhere",
+	maxInlineSize: "100%",
+	color: p.color.text,
+	background: p.color.surfaceRaised,
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.md,
+	cursor: "pointer",
+	"&:focus-visible": t,
+	"&:disabled": { cursor: "default" },
+	[n]: { borderColor: "ButtonText" }
+}), oe = {
+	type: "spring",
+	stiffness: 420,
+	damping: 30
+}, N = 8, P = e(E, { label: "slider" }), F = e({
+	position: "absolute",
+	insetInline: 0,
+	insetBlockStart: "50%",
+	transform: "translateY(-50%)",
+	blockSize: p.space[1],
+	boxSizing: "border-box",
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.full,
+	background: p.color.surfaceInset,
+	pointerEvents: "none",
+	[n]: {
+		forcedColorAdjust: "none",
+		background: "Canvas",
+		borderColor: "CanvasText"
+	}
+}), I = e({
+	position: "absolute",
+	insetBlock: 0,
+	background: p.color.accent,
+	borderRadius: p.radius.full,
+	[n]: { background: "Highlight" }
+}), L = e({
+	position: "absolute",
+	insetBlockStart: "50%",
+	transform: "translate(-50%, -50%)",
+	"&:dir(rtl)": { transform: "translate(50%, -50%)" },
+	inlineSize: p.space[8],
+	blockSize: p.space[8],
+	display: "grid",
+	placeItems: "center",
+	borderRadius: p.radius.full,
+	cursor: "grab",
+	"&:focus-visible": {
+		...t,
+		zIndex: 2
+	},
+	"&[data-dragging]": {
+		cursor: "grabbing",
+		zIndex: 3
+	},
+	"&[aria-disabled=\"true\"]": { cursor: "default" }
+}), R = e({
+	inlineSize: p.space[6],
+	blockSize: p.space[6],
+	boxSizing: "border-box",
+	border: `2px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.full,
+	background: p.color.surfaceRaised,
+	boxShadow: p.shadow.raised,
+	pointerEvents: "none",
+	[n]: {
+		forcedColorAdjust: "none",
+		background: "Canvas",
+		borderColor: "CanvasText",
+		boxShadow: "none"
+	}
+}), z = e({
+	position: "absolute",
+	insetBlockEnd: `calc(100% + ${p.space[2]})`,
+	paddingInline: p.space[2],
+	paddingBlock: p.space[1],
+	inlineSize: "max-content",
+	maxInlineSize: "min(24rem, 80vw)",
+	overflowWrap: "anywhere",
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.md,
+	background: p.color.surfaceRaised,
+	color: p.color.text,
+	boxShadow: p.shadow.raised,
+	pointerEvents: "none",
+	fontSize: p.textSize.xs,
+	opacity: 0,
+	transition: `opacity ${p.motion.duration.fast} ${p.motion.easeStandard}`,
+	"[data-dragging] > &, [data-slider-thumb]:focus-visible > &": { opacity: 1 },
+	[r]: { transitionDuration: "0s" },
+	[n]: {
+		borderColor: "CanvasText",
+		boxShadow: "none"
+	}
+}), B = e({
+	position: "absolute",
+	insetBlockStart: "50%",
+	transform: "translate(-50%, -50%)",
+	inlineSize: p.space[1],
+	blockSize: p.space[2],
+	border: `1px solid ${p.color.borderControl}`,
+	background: p.color.surfaceRaised,
+	boxSizing: "border-box",
+	pointerEvents: "none",
+	[n]: {
+		background: "Canvas",
+		borderColor: "CanvasText"
+	}
+});
+function V(e) {
+	let { ref: t, type: n = "single", value: r, defaultValue: a, label: s, description: c, error: l, invalid: u = !1, disabled: d = !1, min: p = 0, max: y = 100, step: b = 1, largeStep: x, minStepsBetweenThumbs: E = 0, marks: V = [], thumbLabels: H, locale: se, formatOptions: ce, formatValue: le, showValue: ue = !0, start: de, end: fe, name: U, size: pe = "md", slotProps: W, onValueChange: me, onValueCommit: he, className: ge, sx: _e, onKeyDown: ve, "aria-label": ye, "aria-labelledby": be, "aria-describedby": xe, "aria-invalid": Se, ...Ce } = e, G = n === "range", K = v(), [we, Te] = f(0), q = T({
+		component: "Slider",
+		range: G,
+		value: r,
+		defaultValue: a,
+		min: p,
+		max: y,
+		step: b,
+		largeStep: x,
+		minStepsBetweenThumbs: E,
+		disabled: d,
+		onValueChange: (t) => {
+			e.type, e.onValueChange?.(t);
+		},
+		onValueCommit: (t) => {
+			e.type, e.onValueCommit?.(t);
+		},
+		onPointerSample: ({ raw: e, low: t, high: n, rtl: r }) => Te(K ? 0 : Math.max(-8, Math.min(N, (e - Math.max(t, Math.min(n, e))) * (r ? -1 : 1)))),
+		onGestureEnd: () => Te(0)
+	}), { id: J, current: Y, values: X, active: Ee, bounds: De, percent: Z } = q, { formatter: Oe, format: Q } = w(se, ce, le), ke = typeof Y == "number" ? Q(Y) : !le && "formatRange" in Oe ? Oe.formatRange(Y[0], Y[1]) : `${Q(Y[0])} – ${Q(Y[1])}`, Ae = q.normalizeMarks(V), je = G ? Z(X[0]) : 0, Me = Z(X[+!!G]), Ne = S(s), Pe = S(c), $ = S(l);
+	return /* @__PURE__ */ h(_, {
+		reducedMotion: "user",
+		children: /* @__PURE__ */ h(i, {
+			className: ge,
+			styles: P,
+			sx: _e,
+			children: (e) => /* @__PURE__ */ g("div", {
+				...Ce,
+				ref: t,
+				className: e,
+				"data-ui": "slider",
+				"data-disabled": d || void 0,
+				onKeyDown: (e) => {
+					ve?.(e), q.handleRootKeyDown(e);
+				},
+				children: [
+					(Ne || ue) && /* @__PURE__ */ g("div", {
+						css: ne,
+						children: [Ne && /* @__PURE__ */ h("span", {
+							...W?.label,
+							id: `${J}-label`,
+							css: [re, W?.label?.css],
+							children: s
+						}), ue && /* @__PURE__ */ h("span", {
+							...W?.readout,
+							"aria-hidden": "true",
+							css: [ie, W?.readout?.css],
+							children: ke
+						})]
+					}),
+					Pe && /* @__PURE__ */ h("div", {
+						...W?.description,
+						id: `${J}-description`,
+						css: [D, W?.description?.css],
+						children: c
+					}),
+					$ && /* @__PURE__ */ h("div", {
+						...W?.error,
+						id: `${J}-error`,
+						role: "alert",
+						css: [O, W?.error?.css],
+						children: l
+					}),
+					/* @__PURE__ */ g("div", {
+						css: k,
+						children: [
+							S(de) && /* @__PURE__ */ h("div", {
+								...W?.start,
+								children: de
+							}),
+							/* @__PURE__ */ g("div", {
+								...W?.control,
+								...q.controlHandlers(W?.control),
+								css: [
+									ae,
+									A[pe],
+									W?.control?.css
+								],
+								"data-ui": "slider-control",
+								"data-disabled": d || void 0,
+								children: [
+									/* @__PURE__ */ h("div", {
+										...W?.track,
+										"data-ui": "slider-track",
+										"aria-hidden": "true",
+										css: [F, W?.track?.css],
+										children: /* @__PURE__ */ h("div", {
+											...W?.fill,
+											"data-ui": "slider-fill",
+											css: [I, W?.fill?.css],
+											style: {
+												...W?.fill?.style,
+												insetInlineStart: `${je}%`,
+												inlineSize: `${Me - je}%`
+											}
+										})
+									}),
+									Ae.map((e, t) => /* @__PURE__ */ h("span", {
+										"aria-hidden": "true",
+										css: B,
+										style: { insetInlineStart: `${Z(e.value)}%` }
+									}, t)),
+									X.map((e, t) => {
+										let n = C(W?.thumb, t), [r, i] = De(t);
+										return /* @__PURE__ */ m("div", {
+											...n,
+											key: t,
+											id: `${J}-thumb-${t}`,
+											"data-slider-thumb": t,
+											"data-dragging": Ee === t || void 0,
+											role: "slider",
+											tabIndex: d ? -1 : 0,
+											"aria-orientation": "horizontal",
+											"aria-disabled": d,
+											"aria-invalid": $ || u ? !0 : n?.["aria-invalid"] ?? Se,
+											"aria-valuemin": r,
+											"aria-valuemax": i,
+											"aria-valuenow": e,
+											"aria-valuetext": Q(e),
+											"aria-label": n?.["aria-label"] ?? (G ? H?.[t] : ye),
+											"aria-labelledby": te(be, n?.["aria-labelledby"], G ? `${J}-name-${t}` : Ne && `${J}-label`),
+											"aria-describedby": te(xe, n?.["aria-describedby"], Pe && `${J}-description`, $ && `${J}-error`),
+											css: [L, n?.css],
+											style: {
+												...n?.style,
+												insetInlineStart: `${Z(e)}%`
+											},
+											onFocus: (e) => {
+												q.noteFocus(t), n?.onFocus?.(e);
+											},
+											onKeyDown: (e) => {
+												n?.onKeyDown?.(e);
+											}
+										}, /* @__PURE__ */ h(ee.span, {
+											"aria-hidden": "true",
+											css: R,
+											animate: {
+												scale: K ? 1 : Ee === t ? .95 : 1,
+												x: K ? 0 : Ee === t ? we : 0
+											},
+											transition: K ? { duration: 0 } : oe
+										}), G && /* @__PURE__ */ h("span", {
+											id: `${J}-name-${t}`,
+											css: o,
+											children: H?.[t]
+										}), /* @__PURE__ */ h("span", {
+											...W?.bubble,
+											"data-ui": "slider-bubble",
+											"aria-hidden": "true",
+											css: [z, W?.bubble?.css],
+											style: {
+												...W?.bubble?.style,
+												...Z(e) <= 50 ? { insetInlineStart: 0 } : { insetInlineEnd: 0 }
+											},
+											children: Q(e)
+										}));
+									})
+								]
+							}),
+							S(fe) && /* @__PURE__ */ h("div", {
+								...W?.end,
+								children: fe
+							})
+						]
+					}),
+					Ae.some((e) => S(e.label)) && /* @__PURE__ */ h("div", {
+						css: j,
+						children: Ae.map((e, t) => {
+							if (!S(e.label)) return null;
+							let n = C(W?.mark, t);
+							return /* @__PURE__ */ m("button", {
+								...n,
+								key: t,
+								type: "button",
+								disabled: d,
+								css: [M, n?.css],
+								onClick: (t) => {
+									n?.onClick?.(t), t.defaultPrevented || q.selectMark(e.value);
+								}
+							}, e.label);
+						})
+					}),
+					U !== void 0 && X.map((e, t) => /* @__PURE__ */ h("input", {
+						type: "hidden",
+						disabled: d,
+						name: typeof U == "string" ? U : U[t],
+						value: e
+					}, t))
+				]
+			})
+		})
+	});
+}
+V.displayName = "Slider";
+//#endregion
+export { V as t };

package/dist/slider.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Slider } from "./slider-DVG6-Awh.js";
+export { t as Slider } from "./slider-DjAnGmlC.js";