@poveste/controls 0.14.0 → 0.16.0

package/dist/HstColor-DHgxKTkm.es.js

@@ -0,0 +1,2405 @@
+import { n as e, t } from "./useLocale-Dr4PRYn1.es.js";
+import { _ as n, k as r, p as i, r as a, t as o, u as s, v as c } from "./HstWrapper-Bm5H3_to.es.js";
+import { i as l, n as u, o as d, r as f, t as p } from "./PopoverTrigger-BVAfE9fE.es.js";
+import { n as m, r as h, t as g } from "./VisuallyHiddenInput-0it-_FH2.es.js";
+import { computed as _, createBlock as v, createCommentVNode as y, createElementVNode as b, createVNode as x, defineComponent as S, mergeProps as C, nextTick as w, normalizeClass as T, normalizeStyle as E, onMounted as D, onUnmounted as O, openBlock as k, ref as A, renderSlot as j, resolveDynamicComponent as M, shallowRef as N, toRaw as P, toRefs as F, unref as I, watch as L, withCtx as R } from "@poveste/vendors/vue";
+import { useMounted as z, useVModel as ee } from "@poveste/vendors/vue-use";
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/useComposing.js
+var B = /[\p{Script=Han}\p{Script=Hiragana}\p{Script=Katakana}\p{Script=Hangul}\p{Script=Bopomofo}]/u, V = /android/i;
+function H() {
+	return typeof navigator < "u" && V.test(navigator.userAgent);
+}
+function te(e) {
+	let t = A(!1), n = A(!0), r = A(!1), i = _(() => t.value && n.value);
+	function a() {
+		t.value = !0, n.value = !0, r.value = !1;
+	}
+	function o(e) {
+		e.data && (B.test(e.data) ? (n.value = !0, r.value = !0) : H() && !r.value && (n.value = !1));
+	}
+	function s(n) {
+		w(() => {
+			t.value = !1, e?.(n);
+		});
+	}
+	return {
+		isComposing: t,
+		shouldDeferInput: i,
+		handleCompositionStart: a,
+		handleCompositionUpdate: o,
+		handleCompositionEnd: s
+	};
+}
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/color/convert.js
+function U(e, t = "hex") {
+	switch (t) {
+		case "hex": return W(e);
+		case "rgb": return ne(e);
+		case "hsl": return re(e);
+		case "hsb": return ie(e);
+		default: throw Error(`Unknown format: ${t}`);
+	}
+}
+function W(e) {
+	let t = e.space === "rgb" ? e : G(e), n = (e) => Math.round(e).toString(16).padStart(2, "0");
+	if (t.alpha < 1) {
+		let e = Math.round(t.alpha * 255).toString(16).padStart(2, "0");
+		return `#${n(t.r)}${n(t.g)}${n(t.b)}${e}`;
+	}
+	return `#${n(t.r)}${n(t.g)}${n(t.b)}`;
+}
+function ne(e) {
+	let { r: t, g: n, b: r, alpha: i } = e.space === "rgb" ? e : G(e);
+	return i < 1 ? `rgba(${Math.round(t)}, ${Math.round(n)}, ${Math.round(r)}, ${i})` : `rgb(${Math.round(t)}, ${Math.round(n)}, ${Math.round(r)})`;
+}
+function re(e) {
+	let { h: t, s: n, l: r, alpha: i } = e.space === "hsl" ? e : K(e);
+	return i < 1 ? `hsla(${Math.round(t)}, ${Math.round(n)}%, ${Math.round(r)}%, ${i})` : `hsl(${Math.round(t)}, ${Math.round(n)}%, ${Math.round(r)}%)`;
+}
+function ie(e) {
+	let { h: t, s: n, b: r, alpha: i } = e.space === "hsb" ? e : q(e);
+	return i < 1 ? `hsba(${Math.round(t)}, ${Math.round(n)}%, ${Math.round(r)}%, ${i})` : `hsb(${Math.round(t)}, ${Math.round(n)}%, ${Math.round(r)}%)`;
+}
+function G(e) {
+	if (e.space === "rgb") return e;
+	if (e.space === "hsl") return oe(e);
+	if (e.space === "hsb") return ce(e);
+	throw Error(`Unknown color space: ${e.space}`);
+}
+function K(e) {
+	return e.space === "hsl" ? e : ae(G(e));
+}
+function q(e) {
+	return e.space === "hsb" ? e : se(G(e));
+}
+function ae(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = Math.min(t, n, r), o = 0, s = 0, c = (i + a) / 2;
+	if (i !== a) {
+		let e = i - a;
+		switch (s = c > .5 ? e / (2 - i - a) : e / (i + a), i) {
+			case t:
+				o = (n - r) / e + (n < r ? 6 : 0);
+				break;
+			case n:
+				o = (r - t) / e + 2;
+				break;
+			case r: o = (t - n) / e + 4;
+		}
+		o /= 6;
+	}
+	return {
+		space: "hsl",
+		h: o * 360,
+		s: s * 100,
+		l: c * 100,
+		alpha: e.alpha
+	};
+}
+function oe(e) {
+	let t = e.h / 360, n = e.s / 100, r = e.l / 100, i, a, o;
+	if (n === 0) i = a = o = r;
+	else {
+		let e = (e, t, n) => (n < 0 && (n += 1), n > 1 && --n, n < 1 / 6 ? e + (t - e) * 6 * n : n < 1 / 2 ? t : n < 2 / 3 ? e + (t - e) * (2 / 3 - n) * 6 : e), s = r < .5 ? r * (1 + n) : r + n - r * n, c = 2 * r - s;
+		i = e(c, s, t + 1 / 3), a = e(c, s, t), o = e(c, s, t - 1 / 3);
+	}
+	return {
+		space: "rgb",
+		r: i * 255,
+		g: a * 255,
+		b: o * 255,
+		alpha: e.alpha
+	};
+}
+function se(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = Math.min(t, n, r), o = i - a, s = 0, c = i === 0 ? 0 : o / i, l = i;
+	if (i !== a) {
+		switch (i) {
+			case t:
+				s = (n - r) / o + (n < r ? 6 : 0);
+				break;
+			case n:
+				s = (r - t) / o + 2;
+				break;
+			case r: s = (t - n) / o + 4;
+		}
+		s /= 6;
+	}
+	return {
+		space: "hsb",
+		h: s * 360,
+		s: c * 100,
+		b: l * 100,
+		alpha: e.alpha
+	};
+}
+function ce(e) {
+	let t = e.h / 360, n = e.s / 100, r = e.b / 100, i = 0, a = 0, o = 0, s = Math.floor(t * 6), c = t * 6 - s, l = r * (1 - n), u = r * (1 - c * n), d = r * (1 - (1 - c) * n);
+	switch (s % 6) {
+		case 0:
+			i = r, a = d, o = l;
+			break;
+		case 1:
+			i = u, a = r, o = l;
+			break;
+		case 2:
+			i = l, a = r, o = d;
+			break;
+		case 3:
+			i = l, a = u, o = r;
+			break;
+		case 4:
+			i = d, a = l, o = r;
+			break;
+		case 5: i = r, a = l, o = u;
+	}
+	return {
+		space: "rgb",
+		r: i * 255,
+		g: a * 255,
+		b: o * 255,
+		alpha: e.alpha
+	};
+}
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/color/channel.js
+function J(e) {
+	switch (e) {
+		case "hue": return {
+			min: 0,
+			max: 360,
+			step: 1
+		};
+		case "saturation":
+		case "lightness":
+		case "brightness":
+		case "alpha": return {
+			min: 0,
+			max: 100,
+			step: 1
+		};
+		case "red":
+		case "green":
+		case "blue": return {
+			min: 0,
+			max: 255,
+			step: 1
+		};
+		default: throw Error(`Unknown channel: ${e}`);
+	}
+}
+function Y(e) {
+	return {
+		red: "Red",
+		green: "Green",
+		blue: "Blue",
+		hue: "Hue",
+		saturation: "Saturation",
+		lightness: "Lightness",
+		brightness: "Brightness",
+		alpha: "Alpha"
+	}[e] ?? e;
+}
+function X(e, t) {
+	switch (t) {
+		case "red": return e.space === "rgb" ? e.r : G(e).r;
+		case "green": return e.space === "rgb" ? e.g : G(e).g;
+		case "blue": return e.space === "rgb" ? e.b : G(e).b;
+		case "hue": return e.space === "hsl" ? e.h : K(e).h;
+		case "saturation": return e.space === "hsl" || e.space === "hsb" ? e.s : K(e).s;
+		case "lightness": return e.space === "hsl" ? e.l : K(e).l;
+		case "brightness": return e.space === "hsb" ? e.b : q(e).b;
+		case "alpha": return e.alpha * 100;
+		default: throw Error(`Unknown channel: ${t}`);
+	}
+}
+function Z(e, t, n) {
+	let r = J(t), i = Math.max(r.min, Math.min(r.max, n));
+	if (t === "alpha") return {
+		...e,
+		alpha: i / 100
+	};
+	if (t === "red" || t === "green" || t === "blue") return ue({
+		...G(e),
+		[t === "red" ? "r" : t === "green" ? "g" : "b"]: i
+	}, e.space);
+	if (t === "hue" || t === "lightness") return de({
+		...K(e),
+		[t === "hue" ? "h" : "l"]: i
+	}, e.space);
+	if (t === "saturation") return e.space === "hsb" ? fe({
+		...q(e),
+		s: i
+	}, e.space) : de({
+		...K(e),
+		s: i
+	}, e.space);
+	if (t === "brightness") return fe({
+		...q(e),
+		b: i
+	}, e.space);
+	throw Error(`Unknown channel: ${t}`);
+}
+function le(e, t) {
+	if (t.length === 0) return e;
+	if (t.length === 1) return Z(e, t[0].channel, t[0].value);
+	let n = t.map((e) => e.channel), r = n.includes("brightness");
+	n.includes("lightness");
+	let i = n.some((e) => e === "red" || e === "green" || e === "blue"), a;
+	a = i ? G(e) : r ? q(e) : K(e);
+	for (let { channel: e, value: n } of t) {
+		let t = J(e), r = Math.max(t.min, Math.min(t.max, n));
+		if (e === "alpha") a = {
+			...a,
+			alpha: r / 100
+		};
+		else if (a.space === "rgb" && (e === "red" || e === "green" || e === "blue")) {
+			let t = e === "red" ? "r" : e === "green" ? "g" : "b";
+			a = {
+				...a,
+				[t]: r
+			};
+		} else if (a.space === "hsl" && (e === "hue" || e === "saturation" || e === "lightness")) {
+			let t = e === "hue" ? "h" : e === "saturation" ? "s" : "l";
+			a = {
+				...a,
+				[t]: r
+			};
+		} else if (a.space === "hsb" && (e === "hue" || e === "saturation" || e === "brightness")) {
+			let t = e === "hue" ? "h" : e === "saturation" ? "s" : "b";
+			a = {
+				...a,
+				[t]: r
+			};
+		}
+	}
+	if (t.length === 1 && a.space !== e.space) {
+		if (e.space === "rgb") return G(a);
+		if (e.space === "hsl") return K(a);
+		if (e.space === "hsb") return q(a);
+	}
+	return a;
+}
+function ue(e, t) {
+	if (t === "rgb") return e;
+	if (t === "hsl") return pe(e);
+	if (t === "hsb") return he(e);
+	throw Error(`Unknown color space: ${t}`);
+}
+function de(e, t) {
+	if (t === "hsl") return e;
+	let n = me(e);
+	if (t === "rgb") return n;
+	if (t === "hsb") return he(n);
+	throw Error(`Unknown color space: ${t}`);
+}
+function fe(e, t) {
+	if (t === "hsb") return e;
+	let n = ge(e);
+	if (t === "rgb") return n;
+	if (t === "hsl") return pe(n);
+	throw Error(`Unknown color space: ${t}`);
+}
+function pe(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = Math.min(t, n, r), o = 0, s = 0, c = (i + a) / 2;
+	if (i !== a) {
+		let e = i - a;
+		switch (s = c > .5 ? e / (2 - i - a) : e / (i + a), i) {
+			case t:
+				o = (n - r) / e + (n < r ? 6 : 0);
+				break;
+			case n:
+				o = (r - t) / e + 2;
+				break;
+			case r: o = (t - n) / e + 4;
+		}
+		o /= 6;
+	}
+	return {
+		space: "hsl",
+		h: o * 360,
+		s: s * 100,
+		l: c * 100,
+		alpha: e.alpha
+	};
+}
+function me(e) {
+	let t = e.h / 360, n = e.s / 100, r = e.l / 100, i, a, o;
+	if (n === 0) i = a = o = r;
+	else {
+		let e = (e, t, n) => (n < 0 && (n += 1), n > 1 && --n, n < 1 / 6 ? e + (t - e) * 6 * n : n < 1 / 2 ? t : n < 2 / 3 ? e + (t - e) * (2 / 3 - n) * 6 : e), s = r < .5 ? r * (1 + n) : r + n - r * n, c = 2 * r - s;
+		i = e(c, s, t + 1 / 3), a = e(c, s, t), o = e(c, s, t - 1 / 3);
+	}
+	return {
+		space: "rgb",
+		r: i * 255,
+		g: a * 255,
+		b: o * 255,
+		alpha: e.alpha
+	};
+}
+function he(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = Math.min(t, n, r), o = i - a, s = 0, c = i === 0 ? 0 : o / i, l = i;
+	if (i !== a) {
+		switch (i) {
+			case t:
+				s = (n - r) / o + (n < r ? 6 : 0);
+				break;
+			case n:
+				s = (r - t) / o + 2;
+				break;
+			case r: s = (t - n) / o + 4;
+		}
+		s /= 6;
+	}
+	return {
+		space: "hsb",
+		h: s * 360,
+		s: c * 100,
+		b: l * 100,
+		alpha: e.alpha
+	};
+}
+function ge(e) {
+	let t = e.h / 360, n = e.s / 100, r = e.b / 100, i = 0, a = 0, o = 0, s = Math.floor(t * 6), c = t * 6 - s, l = r * (1 - n), u = r * (1 - c * n), d = r * (1 - (1 - c) * n);
+	switch (s % 6) {
+		case 0:
+			i = r, a = d, o = l;
+			break;
+		case 1:
+			i = u, a = r, o = l;
+			break;
+		case 2:
+			i = l, a = r, o = d;
+			break;
+		case 3:
+			i = l, a = u, o = r;
+			break;
+		case 4:
+			i = d, a = l, o = r;
+			break;
+		case 5: i = r, a = l, o = u;
+	}
+	return {
+		space: "rgb",
+		r: i * 255,
+		g: a * 255,
+		b: o * 255,
+		alpha: e.alpha
+	};
+}
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/color/gradient.js
+function _e(e, t, n = e.space) {
+	let r = K(e), i = q(e);
+	switch (t) {
+		case "hue": return ye();
+		case "saturation": return be(r, n);
+		case "lightness": return xe(r);
+		case "brightness": return Se(i);
+		case "red": return Ce(e);
+		case "green": return we(e);
+		case "blue": return Te(e);
+		case "alpha": return De(e);
+		default: return "";
+	}
+}
+function ve(e, t, n, r = e.space) {
+	K(e), q(e);
+	let i = Oe(e, t, r, "x"), a = Oe(e, n, r, "y");
+	return {
+		background: ke(e, t, n, r),
+		gradientX: i,
+		gradientY: a
+	};
+}
+function ye() {
+	return "linear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000)";
+}
+function be(e, t) {
+	return `linear-gradient(to right, ${U({
+		space: "hsl",
+		h: e.h,
+		s: 0,
+		l: t === "hsl" ? e.l : 50,
+		alpha: 1
+	}, "hsl")}, ${U({
+		space: "hsl",
+		h: e.h,
+		s: 100,
+		l: t === "hsl" ? e.l : 50,
+		alpha: 1
+	}, "hsl")})`;
+}
+function xe(e) {
+	return `linear-gradient(to right, ${U({
+		space: "hsl",
+		h: e.h,
+		s: e.s,
+		l: 0,
+		alpha: 1
+	}, "hsl")}, ${U({
+		space: "hsl",
+		h: e.h,
+		s: e.s,
+		l: 50,
+		alpha: 1
+	}, "hsl")}, ${U({
+		space: "hsl",
+		h: e.h,
+		s: e.s,
+		l: 100,
+		alpha: 1
+	}, "hsl")})`;
+}
+function Se(e) {
+	return `linear-gradient(to right, ${U({
+		space: "hsb",
+		h: e.h,
+		s: e.s,
+		b: 0,
+		alpha: 1
+	}, "rgb")}, ${U({
+		space: "hsb",
+		h: e.h,
+		s: e.s,
+		b: 100,
+		alpha: 1
+	}, "rgb")})`;
+}
+function Ce(e) {
+	let { g: t, b: n, alpha: r } = e.space === "rgb" ? e : {
+		g: 128,
+		b: 128,
+		alpha: 1
+	};
+	return `linear-gradient(to right, ${U({
+		space: "rgb",
+		r: 0,
+		g: t,
+		b: n,
+		alpha: 1
+	}, "rgb")}, ${U({
+		space: "rgb",
+		r: 255,
+		g: t,
+		b: n,
+		alpha: 1
+	}, "rgb")})`;
+}
+function we(e) {
+	let { r: t, b: n, alpha: r } = e.space === "rgb" ? e : {
+		r: 128,
+		b: 128,
+		alpha: 1
+	};
+	return `linear-gradient(to right, ${U({
+		space: "rgb",
+		r: t,
+		g: 0,
+		b: n,
+		alpha: 1
+	}, "rgb")}, ${U({
+		space: "rgb",
+		r: t,
+		g: 255,
+		b: n,
+		alpha: 1
+	}, "rgb")})`;
+}
+function Te(e) {
+	let { r: t, g: n, alpha: r } = e.space === "rgb" ? e : {
+		r: 128,
+		g: 128,
+		alpha: 1
+	};
+	return `linear-gradient(to right, ${U({
+		space: "rgb",
+		r: t,
+		g: n,
+		b: 0,
+		alpha: 1
+	}, "rgb")}, ${U({
+		space: "rgb",
+		r: t,
+		g: n,
+		b: 255,
+		alpha: 1
+	}, "rgb")})`;
+}
+var Ee = [
+	"linear-gradient(45deg, #ccc 25%, transparent 25%)",
+	"linear-gradient(-45deg, #ccc 25%, transparent 25%)",
+	"linear-gradient(45deg, transparent 75%, #ccc 75%)",
+	"linear-gradient(-45deg, transparent 75%, #ccc 75%)"
+].join(", ");
+function De(e) {
+	let { r: t, g: n, b: r } = e.space === "rgb" ? e : G(e);
+	return `linear-gradient(to right, transparent, ${`rgb(${Math.round(t)}, ${Math.round(n)}, ${Math.round(r)})`}), ${Ee}`;
+}
+function Oe(e, t, n, r) {
+	let i = r === "x" ? "to right" : "to top", a = K(e);
+	switch (q(e), t) {
+		case "saturation": return n === "hsb" ? `linear-gradient(${i}, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0))` : `linear-gradient(${i}, #ffffff, ${U({
+			space: "hsl",
+			h: a.h,
+			s: 100,
+			l: 50,
+			alpha: 1
+		}, "rgb")})`;
+		case "lightness": return `linear-gradient(${i}, #000000, ${U({
+			space: "hsl",
+			h: a.h,
+			s: a.s,
+			l: 50,
+			alpha: 1
+		}, "rgb")}, #ffffff)`;
+		case "brightness": return `linear-gradient(${i}, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1))`;
+		default: return "";
+	}
+}
+function ke(e, t, n, r) {
+	let i = K(e), a = q(e);
+	return r === "hsl" && t === "saturation" && n === "lightness" ? U({
+		space: "hsl",
+		h: i.h,
+		s: 100,
+		l: 50,
+		alpha: 1
+	}, "rgb") : r === "hsb" && t === "saturation" && n === "brightness" ? U({
+		space: "hsb",
+		h: a.h,
+		s: 100,
+		b: 100,
+		alpha: 1
+	}, "rgb") : "#ffffff";
+}
+function Ae(e, t, n, r = e.space) {
+	let i = K(e), a = q(e);
+	if (t === "hue") {
+		let e = "linear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000)";
+		if (n === "saturation") return { backgroundImage: `linear-gradient(to bottom, transparent, ${U({
+			space: "hsl",
+			h: i.h,
+			s: 0,
+			l: i.l,
+			alpha: 1
+		}, "rgb")}), ${e}` };
+		if (n === "lightness") return { backgroundImage: `linear-gradient(to top, #000000, transparent, #ffffff), ${e}` };
+		if (n === "brightness") return { backgroundImage: `linear-gradient(to top, #000000, transparent), ${e}` };
+	}
+	if (t === "saturation" && (n === "lightness" || n === "brightness")) {
+		if (r === "hsl") return {
+			backgroundColor: U({
+				space: "hsl",
+				h: i.h,
+				s: 100,
+				l: 50,
+				alpha: 1
+			}, "rgb"),
+			backgroundImage: `linear-gradient(to top, #000000, transparent, #ffffff), ${`linear-gradient(to right, ${U({
+				space: "hsl",
+				h: i.h,
+				s: 0,
+				l: 50,
+				alpha: 1
+			}, "rgb")}, transparent)`}`
+		};
+		if (r === "hsb") return {
+			backgroundColor: U({
+				space: "hsb",
+				h: a.h,
+				s: 100,
+				b: 100,
+				alpha: 1
+			}, "rgb"),
+			backgroundImage: "linear-gradient(to top, #000000, transparent), linear-gradient(to right, #ffffff, transparent)"
+		};
+	}
+	if (r === "rgb" && (t === "red" || t === "green" || t === "blue") && (n === "red" || n === "green" || n === "blue")) {
+		let r = G(e), i = [
+			"red",
+			"green",
+			"blue"
+		], a = [t, n], o = i.find((e) => !a.includes(e)), s = r[o === "red" ? "r" : o === "green" ? "g" : "b"], c = {
+			space: "rgb",
+			r: 0,
+			g: 0,
+			b: 0,
+			alpha: 1
+		}, l = {
+			space: "rgb",
+			r: t === "red" ? 255 : 0,
+			g: t === "green" ? 255 : 0,
+			b: t === "blue" ? 255 : 0,
+			alpha: 1
+		}, u = `linear-gradient(to right, ${U(c, "rgb")}, ${U(l, "rgb")})`, d = {
+			space: "rgb",
+			r: n === "red" ? 255 : 0,
+			g: n === "green" ? 255 : 0,
+			b: n === "blue" ? 255 : 0,
+			alpha: 1
+		}, f = `linear-gradient(to top, ${U(c, "rgb")}, ${U(d, "rgb")})`;
+		return {
+			backgroundColor: U({
+				space: "rgb",
+				r: o === "red" ? s : 0,
+				g: o === "green" ? s : 0,
+				b: o === "blue" ? s : 0,
+				alpha: 1
+			}, "rgb"),
+			backgroundImage: `${f}, ${u}`,
+			backgroundBlendMode: "screen"
+		};
+	}
+	let { background: o, gradientX: s, gradientY: c } = ve(e, t, n, r), l = [];
+	return c && l.push(c), s && l.push(s), {
+		backgroundColor: o,
+		backgroundImage: l.join(", ")
+	};
+}
+function je(e, t, n = e.space) {
+	let r = _e(e, t, n);
+	return t === "alpha" ? {
+		background: r,
+		backgroundSize: "100% 100%, 8px 8px, 8px 8px, 8px 8px, 8px 8px",
+		backgroundPosition: "0 0, 0 0, 0 4px, 4px -4px, -4px 0px"
+	} : { background: r };
+}
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/color/parse.js
+var Me = /^[0-9A-F]{3}$/i, Ne = /^[0-9A-F]{6}$/i, Pe = /^[0-9A-F]{8}$/i, Fe = /rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*(?:,\s*([\d.]+)\s*)?\)/, Ie = /hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%\s*(?:,\s*([\d.]+)\s*)?\)/, Le = /hsb[av]?\(\s*([\d.]+)\s*,\s*([\d.]+)%?\s*,\s*([\d.]+)%?\s*(?:,\s*([\d.]+)\s*)?\)/;
+function Re(e) {
+	let t = e.trim().toLowerCase();
+	if (t.startsWith("#")) return ze(t);
+	if (t.startsWith("rgb")) return Be(t);
+	if (t.startsWith("hsl")) return Ve(t);
+	if (t.startsWith("hsb") || t.startsWith("hsv")) return He(t);
+	throw Error(`Unable to parse color: ${e}`);
+}
+function ze(e) {
+	let t = e.slice(1);
+	if (!Me.test(t) && !Ne.test(t) && !Pe.test(t)) throw Error(`Invalid hex color: ${e}. Expected format: #RGB, #RRGGBB, or #RRGGBBAA`);
+	if (t.length === 3 && (t = t.split("").map((e) => e + e).join("")), t.length === 6) {
+		let e = parseInt(t, 16);
+		return {
+			space: "rgb",
+			r: e >> 16 & 255,
+			g: e >> 8 & 255,
+			b: e & 255,
+			alpha: 1
+		};
+	}
+	if (t.length === 8) {
+		let e = parseInt(t, 16);
+		return {
+			space: "rgb",
+			r: e >> 24 & 255,
+			g: e >> 16 & 255,
+			b: e >> 8 & 255,
+			alpha: (e & 255) / 255
+		};
+	}
+	throw Error(`Invalid hex color: ${e}`);
+}
+function Be(e) {
+	let t = e.match(Fe);
+	if (!t) throw Error(`Invalid RGB color: ${e}`);
+	return {
+		space: "rgb",
+		r: parseFloat(t[1]),
+		g: parseFloat(t[2]),
+		b: parseFloat(t[3]),
+		alpha: t[4] ? parseFloat(t[4]) : 1
+	};
+}
+function Ve(e) {
+	let t = e.match(Ie);
+	if (!t) throw Error(`Invalid HSL color: ${e}`);
+	return {
+		space: "hsl",
+		h: parseFloat(t[1]),
+		s: parseFloat(t[2]),
+		l: parseFloat(t[3]),
+		alpha: t[4] ? parseFloat(t[4]) : 1
+	};
+}
+function He(e) {
+	let t = e.match(Le);
+	if (!t) throw Error(`Invalid HSB color: ${e}`);
+	return {
+		space: "hsb",
+		h: parseFloat(t[1]),
+		s: parseFloat(t[2]),
+		b: parseFloat(t[3]),
+		alpha: t[4] ? parseFloat(t[4]) : 1
+	};
+}
+function Q(e) {
+	return typeof e == "string" ? Re(e) : e;
+}
+function Ue(e) {
+	try {
+		return Re(e), !0;
+	} catch {
+		return !1;
+	}
+}
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/color/utils.js
+var We = /^#/, Ge = /^[0-9A-F]{6}$/i, Ke = /^[0-9A-F]{3}$/i;
+function qe(e) {
+	if (e = e.replace(We, ""), !Ge.test(e) && !Ke.test(e)) throw Error(`Invalid hex color: ${e}. Expected format: #RGB or #RRGGBB`);
+	e.length === 3 && (e = e.split("").map((e) => e + e).join(""));
+	let t = parseInt(e, 16);
+	return {
+		r: t >> 16 & 255,
+		g: t >> 8 & 255,
+		b: t & 255
+	};
+}
+function Je(e) {
+	let { r: t, g: n, b: r } = qe(e);
+	t /= 255, n /= 255, r /= 255;
+	let i = Math.max(t, n, r), a = Math.min(t, n, r), o, s, c = (i + a) / 2;
+	if (i === a) o = s = 0, c *= 100;
+	else {
+		let e = i - a;
+		s = c > .5 ? e / (2 - i - a) : e / (i + a), o = i === t ? (n - r) / e + (n < r ? 6 : 0) : i === n ? (r - t) / e + 2 : (t - n) / e + 4, o /= 6, o *= 360, s *= 100, c *= 100;
+	}
+	return {
+		h: o,
+		s,
+		l: c
+	};
+}
+function Ye(e) {
+	let { h: t, s: n, l: r } = Je(e);
+	if (n < 10) return r < 10 ? "black" : r > 95 ? "white" : r < 20 ? "very dark gray" : r < 35 ? "dark gray" : r < 65 ? "gray" : r < 80 ? "light gray" : "very light gray";
+	let i;
+	i = t < 15 || t >= 345 ? "red" : t < 45 ? "orange" : t < 75 ? "yellow" : t < 105 ? "yellow-green" : t < 135 ? "green" : t < 165 ? "green-cyan" : t < 195 ? "cyan" : t < 225 ? "blue" : t < 255 ? "blue-violet" : t < 285 ? "violet" : t < 315 ? "magenta" : "red-magenta";
+	let a = [];
+	return n > 80 ? a.push("vibrant") : n < 30 && a.push("muted"), r > 80 ? a.push("light") : r < 30 && a.push("dark"), a.length > 0 ? `${a.join(" ")} ${i}` : i;
+}
+function Xe(e) {
+	let { r: t, g: n, b: r } = qe(e);
+	return (.299 * t + .587 * n + .114 * r) / 255 > .5 ? "dark" : "light";
+}
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/ColorArea/ColorAreaRoot.js
+var [Ze, Qe] = /*#__PURE__*/ r("ColorAreaRoot"), $e = /* @__PURE__ */ S({
+	__name: "ColorAreaRoot",
+	props: {
+		modelValue: {
+			type: [String, Object],
+			required: !1
+		},
+		defaultValue: {
+			type: [String, Object],
+			required: !1,
+			default: "#ff0000"
+		},
+		colorSpace: {
+			type: String,
+			required: !1,
+			default: "hsl"
+		},
+		xChannel: {
+			type: String,
+			required: !1,
+			default: "hue"
+		},
+		yChannel: {
+			type: String,
+			required: !1,
+			default: "saturation"
+		},
+		disabled: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		xName: {
+			type: String,
+			required: !1
+		},
+		yName: {
+			type: String,
+			required: !1
+		},
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "div"
+		},
+		name: {
+			type: String,
+			required: !1
+		},
+		required: {
+			type: Boolean,
+			required: !1
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"update:color",
+		"change",
+		"changeEnd"
+	],
+	setup(e, { emit: t }) {
+		let r = e, i = t, { colorSpace: a, xChannel: o, yChannel: c, disabled: l } = F(r), { forwardRef: u, currentElement: d } = n(), f = h(d), p = ee(r, "modelValue", i, {
+			defaultValue: r.defaultValue,
+			passive: r.modelValue === void 0
+		}), m = _({
+			get: () => Q(p.value ?? "#000000"),
+			set: (e) => {
+				let t = U(e, "hex");
+				p.value = t, i("update:color", e);
+			}
+		}), b = _(() => J(o.value)), x = _(() => J(c.value)), S = A(Math.round(X(m.value, o.value))), C = A(Math.round(X(m.value, c.value))), T = A(a.value === "hsl" ? K(m.value).h : a.value === "hsb" ? q(m.value).h : 0), D = !1;
+		L(() => m.value, (e) => {
+			if (D) return;
+			let t = Math.round(X(e, o.value)), n = Math.round(X(e, c.value));
+			if (Math.round(S.value) !== t && (S.value = t), Math.round(C.value) !== n && (C.value = n), a.value === "hsl") {
+				let t = K(e);
+				t.s > 0 && (T.value = t.h);
+			} else if (a.value === "hsb") {
+				let t = q(e);
+				t.s > 0 && (T.value = t.h);
+			}
+		}, { immediate: !0 });
+		let O = _(() => {
+			let e = m.value;
+			return (a.value === "hsl" || a.value === "hsb") && (e = a.value === "hsl" ? {
+				space: "hsl",
+				h: T.value,
+				s: 100,
+				l: 50,
+				alpha: 1
+			} : {
+				space: "hsb",
+				h: T.value,
+				s: 100,
+				b: 100,
+				alpha: 1
+			}), Ae(e, o.value, c.value, a.value);
+		});
+		function M(e, t) {
+			let n = Math.max(b.value.min, Math.min(b.value.max, e)), r = Math.max(x.value.min, Math.min(x.value.max, t));
+			S.value = n, C.value = r, D = !0;
+			let i = [{
+				channel: o.value,
+				value: n
+			}, {
+				channel: c.value,
+				value: r
+			}];
+			o.value !== "hue" && c.value !== "hue" && (a.value === "hsl" || a.value === "hsb") && i.push({
+				channel: "hue",
+				value: T.value
+			}), m.value = le(m.value, i), w(() => {
+				D = !1;
+			});
+		}
+		function N() {
+			i("changeEnd", U(m.value, "hex"));
+		}
+		let P = A();
+		return Qe({
+			color: _(() => m.value),
+			xValue: S,
+			yValue: C,
+			xChannel: o,
+			yChannel: c,
+			colorSpace: a,
+			disabled: l,
+			xRange: b,
+			yRange: x,
+			thumbRef: P,
+			updateValues: M,
+			commitValues: N
+		}), (e, t) => (k(), v(I(s), {
+			ref: I(u),
+			as: e.as,
+			"as-child": e.asChild,
+			role: "group",
+			"aria-disabled": I(l) ? "true" : void 0,
+			"data-disabled": I(l) ? "" : void 0
+		}, {
+			default: R(() => [
+				j(e.$slots, "default", { style: E(O.value) }),
+				I(f) && e.xName ? (k(), v(I(g), {
+					key: 0,
+					type: "text",
+					value: S.value,
+					name: e.xName,
+					disabled: I(l)
+				}, null, 8, [
+					"value",
+					"name",
+					"disabled"
+				])) : y("v-if", !0),
+				I(f) && e.yName ? (k(), v(I(g), {
+					key: 1,
+					type: "text",
+					value: C.value,
+					name: e.yName,
+					disabled: I(l)
+				}, null, 8, [
+					"value",
+					"name",
+					"disabled"
+				])) : y("v-if", !0)
+			]),
+			_: 3
+		}, 8, [
+			"as",
+			"as-child",
+			"aria-disabled",
+			"data-disabled"
+		]));
+	}
+});
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/ColorArea/utils.js
+function et(e, t) {
+	return (n) => {
+		if (e[0] === e[1] || t[0] === t[1]) return t[0];
+		let r = (t[1] - t[0]) / (e[1] - e[0]);
+		return t[0] + r * (n - e[0]);
+	};
+}
+function tt(t, n, r) {
+	if (r === n) return 0;
+	let i = 100 / (r - n) * (t - n);
+	return e(i, 0, 100);
+}
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/ColorArea/ColorAreaArea.js
+var nt = /* @__PURE__ */ S({
+	__name: "ColorAreaArea",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "div"
+		}
+	},
+	setup(e) {
+		let t = Ze(), { primitiveElement: n, currentElement: r } = d(), i = A(!1);
+		function a(e) {
+			let n = r.value.getBoundingClientRect();
+			return {
+				x: et([0, n.width], [t.xRange.value.min, t.xRange.value.max])(e.clientX - n.left),
+				y: et([0, n.height], [t.yRange.value.max, t.yRange.value.min])(e.clientY - n.top)
+			};
+		}
+		function o(e) {
+			if (t.disabled.value) return;
+			e.target.setPointerCapture(e.pointerId), e.preventDefault(), i.value = !0;
+			let { x: n, y: r } = a(e);
+			t.updateValues(n, r), t.thumbRef.value?.focus();
+		}
+		function c(e) {
+			if (i.value && !t.disabled.value && e.target.hasPointerCapture(e.pointerId)) {
+				let { x: n, y: r } = a(e);
+				t.updateValues(n, r);
+			}
+		}
+		function l(e) {
+			i.value && (e.target.releasePointerCapture(e.pointerId), i.value = !1, t.commitValues());
+		}
+		function u(e) {
+			if (t.disabled.value) return;
+			let n = e.shiftKey ? 10 : 1, r = t.xRange.value.step * n, i = t.yRange.value.step * n, a = 0, o = 0;
+			switch (e.key) {
+				case "ArrowLeft":
+					a = -r;
+					break;
+				case "ArrowRight":
+					a = r;
+					break;
+				case "ArrowUp":
+					o = i;
+					break;
+				case "ArrowDown":
+					o = -i;
+					break;
+				case "PageUp":
+					o = i * 10;
+					break;
+				case "PageDown":
+					o = -i * 10;
+					break;
+				case "Home":
+					a = -r * 10;
+					break;
+				case "End":
+					a = r * 10;
+					break;
+				default: return;
+			}
+			e.preventDefault(), t.updateValues(t.xValue.value + a, t.yValue.value + o);
+		}
+		return (e, r) => (k(), v(I(s), {
+			ref_key: "primitiveElement",
+			ref: n,
+			"as-child": e.asChild,
+			as: e.as,
+			role: "application",
+			"aria-roledescription": "Color picker",
+			"aria-disabled": I(t).disabled.value ? "true" : void 0,
+			"data-disabled": I(t).disabled.value ? "" : void 0,
+			style: { touchAction: "none" },
+			onKeydown: u,
+			onPointerdown: o,
+			onPointermove: c,
+			onPointerup: l
+		}, {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 8, [
+			"as-child",
+			"as",
+			"aria-disabled",
+			"data-disabled"
+		]));
+	}
+}), rt = /* @__PURE__ */ S({
+	__name: "ColorAreaThumb",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		}
+	},
+	setup(e) {
+		let t = Ze(), { primitiveElement: n, currentElement: r } = d();
+		D(() => {
+			t.thumbRef.value = r.value;
+		});
+		let i = _(() => tt(t.xValue.value, t.xRange.value.min, t.xRange.value.max)), a = _(() => tt(t.yValue.value, t.yRange.value.min, t.yRange.value.max)), o = _(() => `${Y(t.xChannel.value)}, ${Y(t.yChannel.value)}`), c = _(() => `${Y(t.xChannel.value)} ${Math.round(t.xValue.value)}, ${Y(t.yChannel.value)} ${Math.round(t.yValue.value)}`);
+		return (e, r) => (k(), v(I(s), {
+			ref_key: "primitiveElement",
+			ref: n,
+			role: "slider",
+			tabindex: I(t).disabled.value ? void 0 : 0,
+			"aria-label": o.value,
+			"aria-roledescription": "Color thumb",
+			"aria-valuemin": I(t).xRange.value.min,
+			"aria-valuemax": I(t).xRange.value.max,
+			"aria-valuenow": I(t).xValue.value,
+			"aria-valuetext": c.value,
+			"aria-orientation": "horizontal",
+			"data-disabled": I(t).disabled.value ? "" : void 0,
+			"as-child": e.asChild,
+			as: e.as,
+			style: E({
+				position: "absolute",
+				left: `${i.value}%`,
+				top: `${100 - a.value}%`,
+				transform: "translate(-50%, -50%)",
+				touchAction: "none"
+			})
+		}, {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 8, [
+			"tabindex",
+			"aria-label",
+			"aria-valuemin",
+			"aria-valuemax",
+			"aria-valuenow",
+			"aria-valuetext",
+			"data-disabled",
+			"as-child",
+			"as",
+			"style"
+		]));
+	}
+}), [it, at] = /*#__PURE__*/ r("ColorFieldRoot"), ot = /* @__PURE__ */ S({
+	__name: "ColorFieldRoot",
+	props: {
+		modelValue: {
+			type: [String, Object],
+			required: !1
+		},
+		defaultValue: {
+			type: [String, Object],
+			required: !1,
+			default: "#000000"
+		},
+		colorSpace: {
+			type: String,
+			required: !1,
+			default: "hsl"
+		},
+		channel: {
+			type: String,
+			required: !1
+		},
+		placeholder: {
+			type: String,
+			required: !1
+		},
+		disabled: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		readonly: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		disableWheelChange: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		locale: {
+			type: String,
+			required: !1
+		},
+		step: {
+			type: Number,
+			required: !1
+		},
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "div"
+		},
+		name: {
+			type: String,
+			required: !1
+		},
+		required: {
+			type: Boolean,
+			required: !1
+		}
+	},
+	emits: ["update:modelValue", "update:color"],
+	setup(e, { emit: r }) {
+		let i = e, a = r, { colorSpace: o, channel: c, disabled: l, readonly: u, disableWheelChange: d, placeholder: f, locale: p, step: m } = F(i), { forwardRef: b, currentElement: x } = n(), S = h(x);
+		t(p);
+		let C = ee(i, "modelValue", a, {
+			defaultValue: i.defaultValue,
+			passive: i.modelValue === void 0
+		}), w = _({
+			get: () => Q(C.value ?? "#000000"),
+			set: (e) => {
+				let t = U(e, "hex");
+				C.value = t, a("update:color", e);
+			}
+		}), T = A(""), E = A(!1);
+		L(() => w.value, (e) => {
+			E.value || (T.value = D(e));
+		}, { immediate: !0 });
+		function D(e) {
+			if (c.value) {
+				let t = X(e, c.value);
+				return c.value, String(Math.round(t));
+			}
+			return U(e, "hex");
+		}
+		let O = 16777215;
+		function M() {
+			return m.value == null ? c.value ? J(c.value).step : 1 : m.value;
+		}
+		function N(e) {
+			T.value = e;
+		}
+		function P() {
+			if (E.value = !1, c.value) {
+				let e = parseFloat(T.value);
+				if (!isNaN(e)) {
+					let t = J(c.value), n = Math.max(t.min, Math.min(t.max, e));
+					w.value = Z(w.value, c.value, n);
+				}
+				T.value = D(w.value);
+			} else {
+				let e = T.value.trim();
+				Ue(e) && (w.value = Re(e)), T.value = D(w.value);
+			}
+		}
+		function z(e) {
+			let t = Math.trunc(e), n = w.value.space === "rgb" ? Math.round(w.value.r) << 16 | Math.round(w.value.g) << 8 | Math.round(w.value.b) : (() => {
+				let e = G(w.value);
+				return Math.round(e.r) << 16 | Math.round(e.g) << 8 | Math.round(e.b);
+			})(), r = `#${Math.min(Math.max(n + t, 0), O).toString(16).padStart(6, "0")}`;
+			w.value = Re(r), T.value = D(w.value);
+		}
+		function B() {
+			if (l.value || u.value) return;
+			let e = M();
+			if (c.value) {
+				let t = X(w.value, c.value);
+				w.value = Z(w.value, c.value, t + e), T.value = D(w.value);
+			} else z(e);
+		}
+		function V() {
+			if (l.value || u.value) return;
+			let e = M();
+			if (c.value) {
+				let t = X(w.value, c.value);
+				w.value = Z(w.value, c.value, t - e), T.value = D(w.value);
+			} else z(-e);
+		}
+		function H() {
+			if (l.value || u.value) return;
+			let e = M() * 10;
+			if (c.value) {
+				let t = X(w.value, c.value);
+				w.value = Z(w.value, c.value, t + e), T.value = D(w.value);
+			} else z(e);
+		}
+		function te() {
+			if (l.value || u.value) return;
+			let e = M() * 10;
+			if (c.value) {
+				let t = X(w.value, c.value);
+				w.value = Z(w.value, c.value, t - e), T.value = D(w.value);
+			} else z(-e);
+		}
+		function W() {
+			if (!(l.value || u.value)) {
+				if (c.value) {
+					let e = J(c.value);
+					w.value = Z(w.value, c.value, e.max), T.value = D(w.value);
+				} else z(O);
+			}
+		}
+		function ne() {
+			if (!(l.value || u.value)) {
+				if (c.value) {
+					let e = J(c.value);
+					w.value = Z(w.value, c.value, e.min), T.value = D(w.value);
+				} else z(-16777215);
+			}
+		}
+		function re(e) {
+			d.value || l.value || u.value || (e.preventDefault(), e.deltaY > 0 ? V() : B());
+		}
+		return at({
+			color: _(() => w.value),
+			inputValue: T,
+			channel: c,
+			colorSpace: o,
+			disabled: l,
+			readonly: u,
+			disableWheelChange: d,
+			placeholder: f,
+			updateValue: N,
+			commit: P,
+			increment: B,
+			decrement: V,
+			incrementToMax: W,
+			decrementToMin: ne,
+			incrementPage: H,
+			decrementPage: te,
+			handleWheel: re
+		}), (e, t) => (k(), v(I(s), {
+			ref: I(b),
+			as: e.as,
+			"as-child": e.asChild,
+			role: "group",
+			"data-disabled": I(l) ? "" : void 0,
+			"data-readonly": I(u) ? "" : void 0
+		}, {
+			default: R(() => [j(e.$slots, "default"), I(S) && e.name ? (k(), v(I(g), {
+				key: 0,
+				type: "text",
+				value: I(U)(w.value, "hex"),
+				name: e.name,
+				disabled: I(l),
+				required: e.required
+			}, null, 8, [
+				"value",
+				"name",
+				"disabled",
+				"required"
+			])) : y("v-if", !0)]),
+			_: 3
+		}, 8, [
+			"as",
+			"as-child",
+			"data-disabled",
+			"data-readonly"
+		]));
+	}
+}), st = /[\d.-]/, ct = /* @__PURE__ */ S({
+	__name: "ColorFieldInput",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "input"
+		}
+	},
+	setup(e) {
+		let t = it(), n = A(!1), { isComposing: r, handleCompositionStart: i, handleCompositionEnd: a } = te(), o = _(() => (t.channel.value, "text")), c = _(() => t.channel.value ? "numeric" : "text");
+		function l(e) {
+			let n = e.target;
+			t.updateValue(n.value);
+		}
+		function u() {
+			n.value = !1, t.commit();
+		}
+		function d() {
+			n.value = !0;
+		}
+		function f(e) {
+			n.value && t.handleWheel(e);
+		}
+		function p(e) {
+			if (!(r.value || e.isComposing)) switch (e.key) {
+				case "ArrowUp":
+					e.preventDefault(), t.increment();
+					break;
+				case "ArrowDown":
+					e.preventDefault(), t.decrement();
+					break;
+				case "PageUp":
+					e.preventDefault(), t.incrementPage();
+					break;
+				case "PageDown":
+					e.preventDefault(), t.decrementPage();
+					break;
+				case "Home":
+					e.preventDefault(), t.decrementToMin();
+					break;
+				case "End":
+					e.preventDefault(), t.incrementToMax();
+					break;
+				case "Enter": e.preventDefault(), t.commit();
+			}
+		}
+		function m(e) {
+			if (e.isComposing || !t.channel.value) return;
+			let n = e.target, r = e.data;
+			if (r && !st.test(r)) {
+				e.preventDefault();
+				return;
+			}
+			let i = n.value.slice(0, n.selectionStart ?? void 0) + (r ?? "") + n.value.slice(n.selectionEnd ?? void 0);
+			i !== "-" && i !== "." && i !== "-." && isNaN(parseFloat(i)) && e.preventDefault();
+		}
+		return (e, n) => (k(), v(I(s), {
+			"as-child": e.asChild,
+			as: e.as,
+			type: o.value,
+			inputmode: c.value,
+			value: I(t).inputValue.value,
+			placeholder: I(t).placeholder.value,
+			disabled: I(t).disabled.value,
+			readonly: I(t).readonly.value,
+			"data-disabled": I(t).disabled.value ? "" : void 0,
+			"data-readonly": I(t).readonly.value ? "" : void 0,
+			"aria-invalid": (I(t).channel.value, void 0),
+			onInput: l,
+			onBlur: u,
+			onFocus: d,
+			onKeydown: p,
+			onWheel: f,
+			onBeforeinput: m,
+			onCompositionstart: I(i),
+			onCompositionend: I(a)
+		}, {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 8, [
+			"as-child",
+			"as",
+			"type",
+			"inputmode",
+			"value",
+			"placeholder",
+			"disabled",
+			"readonly",
+			"data-disabled",
+			"data-readonly",
+			"aria-invalid",
+			"onCompositionstart",
+			"onCompositionend"
+		]));
+	}
+});
+//#endregion
+//#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/Slider/utils.js
+function lt(e = [], t, n) {
+	let r = [...e];
+	return r[n] = t, r.sort((e, t) => e - t);
+}
+function ut(t, n, r) {
+	let i = 100 / (r - n) * (t - n);
+	return e(i, 0, 100);
+}
+function dt(e, t) {
+	if (t > 2) return `Value ${e + 1} of ${t}`;
+	if (t === 2) return ["Minimum", "Maximum"][e];
+}
+function ft(e, t) {
+	if (e.length === 1) return 0;
+	let n = e.map((e) => Math.abs(e - t)), r = Math.min(...n);
+	return n.indexOf(r);
+}
+function pt(e, t, n) {
+	let r = e / 2;
+	return (r - gt([0, 50], [0, r])(t) * n) * n;
+}
+function mt(e) {
+	return e.slice(0, -1).map((t, n) => e[n + 1] - t);
+}
+function ht(e, t) {
+	if (t > 0) {
+		let n = mt(e);
+		return Math.min(...n) >= t;
+	}
+	return !0;
+}
+function gt(e, t) {
+	return (n) => {
+		if (e[0] === e[1] || t[0] === t[1]) return t[0];
+		let r = (t[1] - t[0]) / (e[1] - e[0]);
+		return t[0] + r * (n - e[0]);
+	};
+}
+function _t(e) {
+	return (String(e).split(".")[1] || "").length;
+}
+function vt(e, t) {
+	let n = 10 ** t;
+	return Math.round(e * n) / n;
+}
+var yt = ["PageUp", "PageDown"], bt = [
+	"ArrowUp",
+	"ArrowDown",
+	"ArrowLeft",
+	"ArrowRight"
+], xt = {
+	"from-left": [
+		"Home",
+		"PageDown",
+		"ArrowDown",
+		"ArrowLeft"
+	],
+	"from-right": [
+		"Home",
+		"PageDown",
+		"ArrowDown",
+		"ArrowRight"
+	],
+	"from-bottom": [
+		"Home",
+		"PageDown",
+		"ArrowDown",
+		"ArrowLeft"
+	],
+	"from-top": [
+		"Home",
+		"PageUp",
+		"ArrowUp",
+		"ArrowLeft"
+	]
+}, [St, Ct] = /*#__PURE__*/ r(["SliderVertical", "SliderHorizontal"]), wt = /* @__PURE__ */ S({
+	__name: "SliderHorizontal",
+	props: {
+		dir: {
+			type: String,
+			required: !1
+		},
+		min: {
+			type: Number,
+			required: !0
+		},
+		max: {
+			type: Number,
+			required: !0
+		},
+		inverted: {
+			type: Boolean,
+			required: !0
+		}
+	},
+	emits: [
+		"slideEnd",
+		"slideStart",
+		"slideMove",
+		"homeKeyDown",
+		"endKeyDown",
+		"stepKeyDown"
+	],
+	setup(e, { emit: t }) {
+		let r = e, i = t, { max: a, min: o, dir: s, inverted: c } = F(r), { forwardRef: l, currentElement: u } = n(), d = $(), f = A(), p = A(), m = _(() => s?.value !== "rtl" && !c.value || s?.value !== "ltr" && c.value);
+		function h(e, t) {
+			let n = p.value || u.value.getBoundingClientRect(), r = [...d.thumbElements.value][d.valueIndexToChangeRef.value], i = d.thumbAlignment.value === "contain" ? r.clientWidth : 0;
+			!f.value && !t && d.thumbAlignment.value === "contain" && (f.value = e.clientX - r.getBoundingClientRect().left);
+			let s = gt([0, n.width - i], m.value ? [o.value, a.value] : [a.value, o.value]);
+			return p.value = n, s(t ? e.clientX - n.left - i / 2 : e.clientX - n.left - (f.value ?? 0));
+		}
+		return Ct({
+			startEdge: _(() => m.value ? "left" : "right"),
+			endEdge: _(() => m.value ? "right" : "left"),
+			direction: _(() => m.value ? 1 : -1),
+			size: "width"
+		}), (e, t) => (k(), v(Ot, {
+			ref: I(l),
+			dir: I(s),
+			"data-orientation": "horizontal",
+			style: E({ "--reka-slider-thumb-transform": !m.value && I(d).thumbAlignment.value === "overflow" ? "translateX(50%)" : "translateX(-50%)" }),
+			onSlideStart: t[0] ||= (e) => {
+				let t = h(e, !0);
+				i("slideStart", t);
+			},
+			onSlideMove: t[1] ||= (e) => {
+				let t = h(e);
+				i("slideMove", t);
+			},
+			onSlideEnd: t[2] ||= () => {
+				p.value = void 0, f.value = void 0, i("slideEnd");
+			},
+			onStepKeyDown: t[3] ||= (e) => {
+				let t = m.value ? "from-left" : "from-right", n = I(xt)[t].includes(e.key);
+				i("stepKeyDown", e, n ? -1 : 1);
+			},
+			onEndKeyDown: t[4] ||= (e) => i("endKeyDown", e),
+			onHomeKeyDown: t[5] ||= (e) => i("homeKeyDown", e)
+		}, {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 8, ["dir", "style"]));
+	}
+}), Tt = /* @__PURE__ */ S({
+	__name: "SliderVertical",
+	props: {
+		min: {
+			type: Number,
+			required: !0
+		},
+		max: {
+			type: Number,
+			required: !0
+		},
+		inverted: {
+			type: Boolean,
+			required: !0
+		}
+	},
+	emits: [
+		"slideEnd",
+		"slideStart",
+		"slideMove",
+		"homeKeyDown",
+		"endKeyDown",
+		"stepKeyDown"
+	],
+	setup(e, { emit: t }) {
+		let r = e, i = t, { max: a, min: o, inverted: s } = F(r), c = $(), { forwardRef: l, currentElement: u } = n(), d = A(), f = A(), p = _(() => !s.value);
+		function m(e, t) {
+			let n = f.value || u.value.getBoundingClientRect(), r = [...c.thumbElements.value][c.valueIndexToChangeRef.value], i = c.thumbAlignment.value === "contain" ? r.clientHeight : 0;
+			!d.value && !t && c.thumbAlignment.value === "contain" && (d.value = e.clientY - r.getBoundingClientRect().top);
+			let s = gt([0, n.height - i], p.value ? [a.value, o.value] : [o.value, a.value]), l = t ? e.clientY - n.top - i / 2 : e.clientY - n.top - (d.value ?? 0);
+			return f.value = n, s(l);
+		}
+		return Ct({
+			startEdge: _(() => p.value ? "bottom" : "top"),
+			endEdge: _(() => p.value ? "top" : "bottom"),
+			direction: _(() => p.value ? 1 : -1),
+			size: "height"
+		}), (e, t) => (k(), v(Ot, {
+			ref: I(l),
+			"data-orientation": "vertical",
+			style: E({ "--reka-slider-thumb-transform": !p.value && I(c).thumbAlignment.value === "overflow" ? "translateY(-50%)" : "translateY(50%)" }),
+			onSlideStart: t[0] ||= (e) => {
+				let t = m(e, !0);
+				i("slideStart", t);
+			},
+			onSlideMove: t[1] ||= (e) => {
+				let t = m(e);
+				i("slideMove", t);
+			},
+			onSlideEnd: t[2] ||= () => {
+				f.value = void 0, d.value = void 0, i("slideEnd");
+			},
+			onStepKeyDown: t[3] ||= (e) => {
+				let t = p.value ? "from-bottom" : "from-top", n = I(xt)[t].includes(e.key);
+				i("stepKeyDown", e, n ? -1 : 1);
+			},
+			onEndKeyDown: t[4] ||= (e) => i("endKeyDown", e),
+			onHomeKeyDown: t[5] ||= (e) => i("homeKeyDown", e)
+		}, {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 8, ["style"]));
+	}
+}), [$, Et] = /*#__PURE__*/ r("SliderRoot"), Dt = /* @__PURE__ */ S({
+	inheritAttrs: !1,
+	__name: "SliderRoot",
+	props: {
+		defaultValue: {
+			type: Array,
+			required: !1,
+			default: () => [0]
+		},
+		modelValue: {
+			type: [Array, null],
+			required: !1
+		},
+		disabled: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		orientation: {
+			type: String,
+			required: !1,
+			default: "horizontal"
+		},
+		dir: {
+			type: String,
+			required: !1
+		},
+		inverted: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		min: {
+			type: Number,
+			required: !1,
+			default: 0
+		},
+		max: {
+			type: Number,
+			required: !1,
+			default: 100
+		},
+		step: {
+			type: Number,
+			required: !1,
+			default: 1
+		},
+		minStepsBetweenThumbs: {
+			type: Number,
+			required: !1,
+			default: 0
+		},
+		thumbAlignment: {
+			type: String,
+			required: !1,
+			default: "contain"
+		},
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		},
+		name: {
+			type: String,
+			required: !1
+		},
+		required: {
+			type: Boolean,
+			required: !1
+		}
+	},
+	emits: ["update:modelValue", "valueCommit"],
+	setup(t, { emit: r }) {
+		let i = t, a = r, { min: o, max: s, step: l, minStepsBetweenThumbs: u, orientation: d, disabled: f, thumbAlignment: p, dir: b } = F(i), x = c(b), { forwardRef: S, currentElement: w } = n(), T = h(w), { CollectionSlot: E } = m({ isProvider: !0 }), D = ee(i, "modelValue", a, {
+			defaultValue: i.defaultValue,
+			passive: i.modelValue === void 0
+		}), O = _(() => Array.isArray(D.value) ? [...D.value] : []), N = A(0), L = A(O.value);
+		function z(e) {
+			H(e, ft(O.value, e));
+		}
+		function B(e) {
+			H(e, N.value);
+		}
+		function V() {
+			let e = L.value[N.value];
+			O.value[N.value] !== e && a("valueCommit", P(O.value));
+		}
+		function H(t, n, { commit: r } = { commit: !1 }) {
+			let i = _t(l.value), c = vt(Math.round((t - o.value) / l.value) * l.value + o.value, i), d = e(c, o.value, s.value), f = lt(O.value, d, n);
+			if (ht(f, u.value * l.value)) {
+				N.value = f.indexOf(d);
+				let e = String(f) !== String(D.value);
+				e && r && a("valueCommit", f), e && (te.value[N.value]?.focus(), D.value = f);
+			}
+		}
+		let te = A([]);
+		return Et({
+			modelValue: D,
+			currentModelValue: O,
+			valueIndexToChangeRef: N,
+			thumbElements: te,
+			orientation: d,
+			min: o,
+			max: s,
+			disabled: f,
+			thumbAlignment: p
+		}), (e, t) => (k(), v(I(E), null, {
+			default: R(() => [(k(), v(M(I(d) === "horizontal" ? wt : Tt), C(e.$attrs, {
+				ref: I(S),
+				"as-child": e.asChild,
+				as: e.as,
+				min: I(o),
+				max: I(s),
+				dir: I(x),
+				inverted: e.inverted,
+				"aria-disabled": I(f),
+				"data-disabled": I(f) ? "" : void 0,
+				onPointerdown: t[0] ||= () => {
+					I(f) || (L.value = O.value);
+				},
+				onSlideStart: t[1] ||= (e) => !I(f) && z(e),
+				onSlideMove: t[2] ||= (e) => !I(f) && B(e),
+				onSlideEnd: t[3] ||= (e) => !I(f) && V(),
+				onHomeKeyDown: t[4] ||= (e) => !I(f) && H(I(o), 0, { commit: !0 }),
+				onEndKeyDown: t[5] ||= (e) => !I(f) && H(I(s), O.value.length - 1, { commit: !0 }),
+				onStepKeyDown: t[6] ||= (e, t) => {
+					if (!I(f)) {
+						let n = I(yt).includes(e.key) || e.shiftKey && I(bt).includes(e.key) ? 10 : 1, r = N.value, i = O.value[r];
+						H(i + I(l) * n * t, r, { commit: !0 });
+					}
+				}
+			}), {
+				default: R(() => [j(e.$slots, "default", { modelValue: I(D) }), I(T) && e.name ? (k(), v(I(g), {
+					key: 0,
+					type: "number",
+					value: I(D),
+					name: e.name,
+					required: e.required,
+					disabled: I(f),
+					step: I(l)
+				}, null, 8, [
+					"value",
+					"name",
+					"required",
+					"disabled",
+					"step"
+				])) : y("v-if", !0)]),
+				_: 3
+			}, 16, [
+				"as-child",
+				"as",
+				"min",
+				"max",
+				"dir",
+				"inverted",
+				"aria-disabled",
+				"data-disabled"
+			]))]),
+			_: 3
+		}));
+	}
+}), Ot = /* @__PURE__ */ S({
+	__name: "SliderImpl",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		}
+	},
+	emits: [
+		"slideStart",
+		"slideMove",
+		"slideEnd",
+		"homeKeyDown",
+		"endKeyDown",
+		"stepKeyDown"
+	],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = $();
+		return (e, t) => (k(), v(I(s), C({ "data-slider-impl": "" }, n, {
+			onKeydown: t[0] ||= (e) => {
+				e.key === "Home" ? (r("homeKeyDown", e), e.preventDefault()) : e.key === "End" ? (r("endKeyDown", e), e.preventDefault()) : I(yt).concat(I(bt)).includes(e.key) && (r("stepKeyDown", e), e.preventDefault());
+			},
+			onPointerdown: t[1] ||= (e) => {
+				let t = e.target;
+				t.setPointerCapture(e.pointerId), e.preventDefault(), I(i).thumbElements.value.includes(t) ? t.focus() : r("slideStart", e);
+			},
+			onPointermove: t[2] ||= (e) => {
+				e.target.hasPointerCapture(e.pointerId) && r("slideMove", e);
+			},
+			onPointerup: t[3] ||= (e) => {
+				let t = e.target;
+				t.hasPointerCapture(e.pointerId) && (t.releasePointerCapture(e.pointerId), r("slideEnd", e));
+			}
+		}), {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 16));
+	}
+}), kt = /* @__PURE__ */ S({
+	inheritAttrs: !1,
+	__name: "SliderThumbImpl",
+	props: {
+		index: {
+			type: Number,
+			required: !0
+		},
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1
+		}
+	},
+	setup(e) {
+		let t = e, r = $(), a = St(), { forwardRef: o, currentElement: c } = n(), { CollectionItem: l } = m(), u = _(() => r.modelValue?.value?.[t.index]), d = _(() => u.value === void 0 ? 0 : ut(u.value, r.min.value ?? 0, r.max.value ?? 100)), f = _(() => dt(t.index, r.modelValue?.value?.length ?? 0)), p = i(c), h = _(() => p[a.size].value), g = _(() => r.thumbAlignment.value === "overflow" || !h.value ? 0 : pt(h.value, d.value, a.direction.value)), y = z();
+		return D(() => {
+			r.thumbElements.value.push(c.value);
+		}), O(() => {
+			let e = r.thumbElements.value.findIndex((e) => e === c.value) ?? -1;
+			r.thumbElements.value.splice(e, 1);
+		}), (e, t) => (k(), v(I(l), null, {
+			default: R(() => [x(I(s), C(e.$attrs, {
+				ref: I(o),
+				role: "slider",
+				tabindex: I(r).disabled.value ? void 0 : 0,
+				"aria-label": e.$attrs["aria-label"] || f.value,
+				"data-disabled": I(r).disabled.value ? "" : void 0,
+				"data-orientation": I(r).orientation.value,
+				"aria-valuenow": u.value,
+				"aria-valuemin": I(r).min.value,
+				"aria-valuemax": I(r).max.value,
+				"aria-orientation": I(r).orientation.value,
+				"as-child": e.asChild,
+				as: e.as,
+				style: {
+					transform: "var(--reka-slider-thumb-transform)",
+					position: "absolute",
+					[I(a).startEdge.value]: `calc(${d.value}% + ${g.value}px)`,
+					display: !I(y) && u.value === void 0 ? "none" : void 0
+				},
+				onFocus: t[0] ||= () => {
+					I(r).valueIndexToChangeRef.value = e.index;
+				}
+			}), {
+				default: R(() => [j(e.$slots, "default")]),
+				_: 3
+			}, 16, [
+				"tabindex",
+				"aria-label",
+				"data-disabled",
+				"data-orientation",
+				"aria-valuenow",
+				"aria-valuemin",
+				"aria-valuemax",
+				"aria-orientation",
+				"as-child",
+				"as",
+				"style"
+			])]),
+			_: 3
+		}));
+	}
+}), At = /* @__PURE__ */ S({
+	__name: "SliderThumb",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		}
+	},
+	setup(e) {
+		let t = e, { getItems: r } = m(), { forwardRef: i, currentElement: a } = n(), o = _(() => a.value ? r(!0).findIndex((e) => e.ref === a.value) : -1);
+		return (e, n) => (k(), v(kt, C({ ref: I(i) }, t, { index: o.value }), {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 16, ["index"]));
+	}
+}), jt = /* @__PURE__ */ S({
+	__name: "SliderTrack",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		}
+	},
+	setup(e) {
+		let t = $();
+		return n(), (e, n) => (k(), v(I(s), {
+			"as-child": e.asChild,
+			as: e.as,
+			"data-disabled": I(t).disabled.value ? "" : void 0,
+			"data-orientation": I(t).orientation.value
+		}, {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 8, [
+			"as-child",
+			"as",
+			"data-disabled",
+			"data-orientation"
+		]));
+	}
+}), [Mt, Nt] = /*#__PURE__*/ r("ColorSliderRoot"), Pt = /* @__PURE__ */ S({
+	inheritAttrs: !1,
+	__name: "ColorSliderRoot",
+	props: {
+		modelValue: {
+			type: [String, Object],
+			required: !1
+		},
+		defaultValue: {
+			type: [String, Object],
+			required: !1,
+			default: "#000000"
+		},
+		colorSpace: {
+			type: String,
+			required: !1,
+			default: "hsl"
+		},
+		channel: {
+			type: String,
+			required: !0
+		},
+		orientation: {
+			type: String,
+			required: !1,
+			default: "horizontal"
+		},
+		dir: {
+			type: String,
+			required: !1
+		},
+		inverted: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		disabled: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		step: {
+			type: Number,
+			required: !1
+		},
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		},
+		name: {
+			type: String,
+			required: !1
+		},
+		required: {
+			type: Boolean,
+			required: !1
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"update:color",
+		"change",
+		"changeEnd"
+	],
+	setup(e, { emit: t }) {
+		let r = e, i = t, { orientation: a, disabled: o, inverted: s, dir: l, channel: u, colorSpace: d, step: f } = F(r), p = c(l), { forwardRef: m, currentElement: b } = n(), x = h(b), S = ee(r, "modelValue", i, {
+			defaultValue: r.defaultValue,
+			passive: r.modelValue === void 0
+		});
+		function w(e, t, n) {
+			switch (t) {
+				case "hue":
+				case "lightness": return K(e);
+				case "saturation": return n === "hsb" ? q(e) : K(e);
+				case "brightness": return q(e);
+				case "red":
+				case "green":
+				case "blue": return G(e);
+				case "alpha": return e;
+				default: return e;
+			}
+		}
+		let T = A(w(Q(S.value ?? r.defaultValue ?? "#000000"), u.value, d.value));
+		function E(e) {
+			let t = K(e);
+			return t.s === 0 || t.l === 0 || t.l >= 100;
+		}
+		L(() => S.value, (e) => {
+			if (e == null) return;
+			let t = Q(e);
+			if (U(T.value, "hex") !== U(t, "hex")) {
+				let e = w(t, u.value, d.value), n = X(T.value, u.value), r = X(e, u.value), i = O.value.max - O.value.min;
+				u.value === "hue" && E(t) || Math.abs(n - r) < i * .02 ? T.value = Z(e, u.value, n) : T.value = e;
+			}
+		});
+		let D = _({
+			get: () => T.value,
+			set: (e) => {
+				T.value = e;
+				let t = U(e, "hex");
+				S.value = t, i("update:color", e);
+			}
+		}), O = _(() => J(u.value)), M = _(() => O.value.min), N = _(() => O.value.max), P = _(() => f.value ?? O.value.step), z = _(() => X(D.value, u.value)), B = _({
+			get: () => [z.value],
+			set: (e) => {
+				let t = Math.max(M.value, Math.min(N.value, e[0])), n = Z(D.value, u.value, t);
+				D.value = n, i("change", U(n, "hex"));
+			}
+		});
+		function V(e) {
+			i("changeEnd", U(D.value, "hex"));
+		}
+		return Nt({
+			color: _(() => D.value),
+			channelValue: z,
+			channel: u,
+			colorSpace: d,
+			orientation: a,
+			disabled: o,
+			inverted: s,
+			min: M,
+			max: N,
+			step: P
+		}), (e, t) => (k(), v(I(Dt), C(e.$attrs, {
+			ref: I(m),
+			modelValue: B.value,
+			"onUpdate:modelValue": t[0] ||= (e) => B.value = e,
+			orientation: I(a),
+			dir: I(p),
+			disabled: I(o),
+			inverted: I(s),
+			min: M.value,
+			max: N.value,
+			step: P.value,
+			as: e.as,
+			"as-child": e.asChild,
+			onValueCommit: V
+		}), {
+			default: R(() => [j(e.$slots, "default"), I(x) && e.name ? (k(), v(I(g), {
+				key: 0,
+				type: "text",
+				value: I(U)(D.value, "hex"),
+				name: e.name,
+				disabled: I(o),
+				required: e.required
+			}, null, 8, [
+				"value",
+				"name",
+				"disabled",
+				"required"
+			])) : y("v-if", !0)]),
+			_: 3
+		}, 16, [
+			"modelValue",
+			"orientation",
+			"dir",
+			"disabled",
+			"inverted",
+			"min",
+			"max",
+			"step",
+			"as",
+			"as-child"
+		]));
+	}
+}), Ft = /* @__PURE__ */ S({
+	__name: "ColorSliderThumb",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		}
+	},
+	setup(e) {
+		let t = Mt(), n = _(() => Y(t.channel.value)), r = _(() => {
+			let e = t.channelValue.value;
+			return t.channel.value === "alpha" ? `${Math.round(e)}%` : String(Math.round(e));
+		});
+		return (e, i) => (k(), v(I(At), {
+			as: e.as,
+			"as-child": e.asChild,
+			"aria-label": n.value,
+			"aria-valuetext": r.value
+		}, {
+			default: R(() => [j(e.$slots, "default", {
+				channelName: n.value,
+				channelValue: I(t).channelValue.value
+			})]),
+			_: 3
+		}, 8, [
+			"as",
+			"as-child",
+			"aria-label",
+			"aria-valuetext"
+		]));
+	}
+}), It = /* @__PURE__ */ S({
+	__name: "ColorSliderTrack",
+	props: {
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "span"
+		}
+	},
+	setup(e) {
+		let t = Mt(), n = _(() => je(t.color.value, t.channel.value, t.colorSpace.value));
+		return (e, t) => (k(), v(I(jt), {
+			as: e.as,
+			"as-child": e.asChild,
+			style: E(n.value)
+		}, {
+			default: R(() => [j(e.$slots, "default")]),
+			_: 3
+		}, 8, [
+			"as",
+			"as-child",
+			"style"
+		]));
+	}
+}), Lt = /* @__PURE__ */ S({
+	__name: "ColorSwatch",
+	props: {
+		color: {
+			type: [String, Object],
+			required: !1,
+			default: ""
+		},
+		label: {
+			type: String,
+			required: !1
+		},
+		asChild: {
+			type: Boolean,
+			required: !1
+		},
+		as: {
+			type: null,
+			required: !1,
+			default: "div"
+		}
+	},
+	setup(e) {
+		let t = e, n = _(() => t.color ? typeof t.color == "string" ? t.color : U(t.color, "hex") : ""), r = _(() => {
+			if (!t.color) return null;
+			try {
+				return Q(t.color);
+			} catch {
+				return null;
+			}
+		}), i = _(() => r.value?.alpha ?? 0), a = _(() => !t.color || i.value <= 0), o = _(() => {
+			if (t.label) return t.label;
+			if (!r.value || r.value.alpha === 0) return "transparent";
+			try {
+				return Ye(n.value);
+			} catch {
+				return n.value || "transparent";
+			}
+		}), c = _(() => {
+			try {
+				return Xe(n.value);
+			} catch {
+				return;
+			}
+		});
+		return (e, t) => (k(), v(I(s), {
+			role: "img",
+			"aria-label": o.value,
+			"aria-roledescription": "color swatch",
+			"as-child": e.asChild,
+			as: e.as,
+			"data-color-contrast": c.value,
+			"data-no-color": a.value ? "" : void 0,
+			style: E({
+				"--reka-color-swatch-color": n.value,
+				"--reka-color-swatch-alpha": String(i.value)
+			})
+		}, {
+			default: R(() => [j(e.$slots, "default", {
+				color: n.value,
+				alpha: i.value
+			})]),
+			_: 3
+		}, 8, [
+			"aria-label",
+			"as-child",
+			"as",
+			"data-color-contrast",
+			"data-no-color",
+			"style"
+		]));
+	}
+}), Rt = {
+	class: "poveste-color-row",
+	"data-slot": "row"
+}, zt = {
+	type: "button",
+	class: "poveste-color-swatch",
+	"data-slot": "swatch",
+	"aria-label": "Open the colour picker"
+}, Bt = /* @__PURE__ */ S({
+	name: "HstColor",
+	props: {
+		title: { default: void 0 },
+		modelValue: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = A(!1), s = N();
+		D(() => {
+			s.value = a();
+		});
+		let c = "#000000";
+		function d(e) {
+			return q(Q(e || c));
+		}
+		let m = N(d(n.modelValue));
+		L(() => n.modelValue, (e) => {
+			let t = d(e);
+			W(t) !== W(m.value) && (m.value = t);
+		});
+		function h(e) {
+			m.value = q(e), r("update:modelValue", W(e));
+		}
+		return (t, n) => (k(), v(o, {
+			tag: "div",
+			title: e.title,
+			class: T(["poveste-color", t.$attrs.class]),
+			"data-slot": "control",
+			style: E(t.$attrs.style)
+		}, {
+			actions: R(() => [j(t.$slots, "actions")]),
+			default: R(() => [b("span", Rt, [x(I(l), {
+				open: i.value,
+				"onUpdate:open": n[0] ||= (e) => i.value = e
+			}, {
+				default: R(() => [x(I(p), { "as-child": "" }, {
+					default: R(() => [b("button", zt, [x(I(Lt), {
+						color: e.modelValue || c,
+						class: "poveste-color-swatch-fill",
+						"data-slot": "preview"
+					}, null, 8, ["color"])])]),
+					_: 1
+				}), s.value ? (k(), v(I(u), {
+					key: 0,
+					to: s.value
+				}, {
+					default: R(() => [x(I(f), {
+						class: "poveste-color-picker",
+						"data-slot": "picker",
+						align: "start",
+						"side-offset": 6,
+						"collision-padding": 8
+					}, {
+						default: R(() => [x(I($e), {
+							"model-value": m.value,
+							"color-space": "hsb",
+							"x-channel": "saturation",
+							"y-channel": "brightness",
+							class: "poveste-color-area",
+							"data-slot": "area",
+							"onUpdate:color": h
+						}, {
+							default: R(() => [x(I(nt), { class: "poveste-color-area-surface" }, {
+								default: R(() => [x(I(rt), { class: "poveste-color-thumb" })]),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["model-value"]), x(I(Pt), {
+							"model-value": m.value,
+							"color-space": "hsb",
+							channel: "hue",
+							orientation: "horizontal",
+							class: "poveste-color-hue",
+							"data-slot": "hue",
+							"onUpdate:color": h
+						}, {
+							default: R(() => [x(I(It), { class: "poveste-color-hue-track" }, {
+								default: R(() => [x(I(Ft), { class: "poveste-color-thumb" })]),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["model-value"])]),
+						_: 1
+					})]),
+					_: 1
+				}, 8, ["to"])) : y("", !0)]),
+				_: 1
+			}, 8, ["open"]), x(I(ot), {
+				"model-value": e.modelValue || c,
+				class: "poveste-color-field-root",
+				"onUpdate:color": h
+			}, {
+				default: R(() => [x(I(ct), {
+					class: "poveste-color-field",
+					"data-slot": "field",
+					"aria-label": "Colour"
+				})]),
+				_: 1
+			}, 8, ["model-value"])])]),
+			_: 3
+		}, 8, [
+			"title",
+			"class",
+			"style"
+		]));
+	}
+});
+//#endregion
+export { Bt as default };