@templatical/editor 0.11.1 → 0.12.1

package/dist/cdn/chunks/{NumberWithSuffix-Deo8EOSz.js → NumberWithSuffix-cdWjAK6y.js}

@@ -1,35 +1,35 @@
-import { F as e, L as t, M as n, P as r, V as i, Z as a, c as o, ct as s, f as c, g as l, h as u, it as d, m as f, n as p, ot as m, p as h, st as g, u as _, x as v, y } from "./draggable-iAb7QVJo.js";
-import { It as ee, sn as te } from "./features-mO5NzwnN.js";
-import { h as b, i as x, m as S, p as C, u as ne } from "./styleConstants-lGobwiLH.js";
+import { F as e, L as t, M as n, P as r, V as i, Z as a, c as o, ct as s, f as c, g as l, h as u, it as d, m as f, n as p, ot as m, p as h, st as g, u as _, x as v, y } from "./draggable-Bci-fq8y.js";
+import { Ft as ee, at as te, on as ne } from "./features-DxWz_Enw.js";
+import { h as b, m as x, p as S, u as re } from "./styleConstants-lGobwiLH.js";
 //#region ../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/utils/math.js
-var w = (e, t = 0, n = 1) => e > n ? n : e < t ? t : e, T = (e, t = 0, n = 10 ** t) => Math.round(n * e) / n;
+var C = (e, t = 0, n = 1) => e > n ? n : e < t ? t : e, w = (e, t = 0, n = 10 ** t) => Math.round(n * e) / n;
 360 / (Math.PI * 2);
-var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.length < 6 ? {
+var T = (e) => ae(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.length < 6 ? {
 	r: parseInt(e[0] + e[0], 16),
 	g: parseInt(e[1] + e[1], 16),
 	b: parseInt(e[2] + e[2], 16),
-	a: e.length === 4 ? T(parseInt(e[3] + e[3], 16) / 255, 2) : 1
+	a: e.length === 4 ? w(parseInt(e[3] + e[3], 16) / 255, 2) : 1
 } : {
 	r: parseInt(e.substring(0, 2), 16),
 	g: parseInt(e.substring(2, 4), 16),
 	b: parseInt(e.substring(4, 6), 16),
-	a: e.length === 8 ? T(parseInt(e.substring(6, 8), 16) / 255, 2) : 1
-}), ie = (e) => ae(k(e)), D = ({ h: e, s: t, v: n, a: r }) => {
+	a: e.length === 8 ? w(parseInt(e.substring(6, 8), 16) / 255, 2) : 1
+}), D = (e) => ie(A(e)), O = ({ h: e, s: t, v: n, a: r }) => {
 	let i = (200 - t) * n / 100;
 	return {
-		h: T(e),
-		s: T(i > 0 && i < 200 ? t * n / 100 / (i <= 100 ? i : 200 - i) * 100 : 0),
-		l: T(i / 2),
-		a: T(r, 2)
+		h: w(e),
+		s: w(i > 0 && i < 200 ? t * n / 100 / (i <= 100 ? i : 200 - i) * 100 : 0),
+		l: w(i / 2),
+		a: w(r, 2)
 	};
-}, O = (e) => {
-	let { h: t, s: n, l: r } = D(e);
+}, k = (e) => {
+	let { h: t, s: n, l: r } = O(e);
 	return `hsl(${t}, ${n}%, ${r}%)`;
-}, k = ({ h: e, s: t, v: n, a: r }) => {
+}, A = ({ h: e, s: t, v: n, a: r }) => {
 	e = e / 360 * 6, t /= 100, n /= 100;
 	let i = Math.floor(e), a = n * (1 - t), o = n * (1 - (e - i) * t), s = n * (1 - (1 - e + i) * t), c = i % 6;
 	return {
-		r: T([
+		r: w([
 			n,
 			o,
 			a,
@@ -37,7 +37,7 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 			s,
 			n
 		][c] * 255),
-		g: T([
+		g: w([
 			s,
 			n,
 			n,
@@ -45,7 +45,7 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 			a,
 			a
 		][c] * 255),
-		b: T([
+		b: w([
 			a,
 			a,
 			s,
@@ -53,62 +53,62 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 			n,
 			o
 		][c] * 255),
-		a: T(r, 2)
+		a: w(r, 2)
 	};
-}, A = (e) => {
+}, j = (e) => {
 	let t = e.toString(16);
 	return t.length < 2 ? "0" + t : t;
+}, ie = ({ r: e, g: t, b: n, a: r }) => {
+	let i = r < 1 ? j(w(r * 255)) : "";
+	return "#" + j(e) + j(t) + j(n) + i;
 }, ae = ({ r: e, g: t, b: n, a: r }) => {
-	let i = r < 1 ? A(T(r * 255)) : "";
-	return "#" + A(e) + A(t) + A(n) + i;
-}, oe = ({ r: e, g: t, b: n, a: r }) => {
 	let i = Math.max(e, t, n), a = i - Math.min(e, t, n), o = a ? i === e ? (t - n) / a : i === t ? 2 + (n - e) / a : 4 + (e - t) / a : 0;
 	return {
-		h: T(60 * (o < 0 ? o + 6 : o)),
-		s: T(i ? a / i * 100 : 0),
-		v: T(i / 255 * 100),
+		h: w(60 * (o < 0 ? o + 6 : o)),
+		s: w(i ? a / i * 100 : 0),
+		v: w(i / 255 * 100),
 		a: r
 	};
-}, j = (e, t) => {
+}, M = (e, t) => {
 	if (e === t) return !0;
 	for (let n in e) if (e[n] !== t[n]) return !1;
 	return !0;
-}, M = (e, t) => e.toLowerCase() === t.toLowerCase() ? !0 : j(E(e), E(t)), N = {}, P = (e) => {
-	let t = N[e];
-	return t || (t = document.createElement("template"), t.innerHTML = e, N[e] = t), t;
-}, F = (e, t, n) => {
+}, N = (e, t) => e.toLowerCase() === t.toLowerCase() ? !0 : M(E(e), E(t)), P = {}, F = (e) => {
+	let t = P[e];
+	return t || (t = document.createElement("template"), t.innerHTML = e, P[e] = t), t;
+}, I = (e, t, n) => {
 	e.dispatchEvent(new CustomEvent(t, {
 		bubbles: !0,
 		detail: n
 	}));
-}, I = !1, L = (e) => "touches" in e, R = (e) => I && !L(e) ? !1 : (I ||= L(e), !0), z = (e, t) => {
-	let n = L(t) ? t.touches[0] : t, r = e.el.getBoundingClientRect();
-	F(e.el, "move", e.getMove({
-		x: w((n.pageX - (r.left + window.pageXOffset)) / r.width),
-		y: w((n.pageY - (r.top + window.pageYOffset)) / r.height)
+}, L = !1, R = (e) => "touches" in e, oe = (e) => L && !R(e) ? !1 : (L ||= R(e), !0), z = (e, t) => {
+	let n = R(t) ? t.touches[0] : t, r = e.el.getBoundingClientRect();
+	I(e.el, "move", e.getMove({
+		x: C((n.pageX - (r.left + window.pageXOffset)) / r.width),
+		y: C((n.pageY - (r.top + window.pageYOffset)) / r.height)
 	}));
-}, B = (e, t) => {
+}, se = (e, t) => {
 	let n = t.keyCode;
-	n > 40 || e.xy && n < 37 || n < 33 || (t.preventDefault(), F(e.el, "move", e.getMove({
+	n > 40 || e.xy && n < 37 || n < 33 || (t.preventDefault(), I(e.el, "move", e.getMove({
 		x: n === 39 ? .01 : n === 37 ? -.01 : n === 34 ? .05 : n === 33 ? -.05 : n === 35 ? 1 : n === 36 ? -1 : 0,
 		y: n === 40 ? .01 : n === 38 ? -.01 : 0
 	}, !0)));
-}, V = class {
+}, B = class {
 	constructor(e, t, n, r) {
-		let i = P(`<div role="slider" tabindex="0" part="${t}" ${n}><div part="${t}-pointer"></div></div>`);
+		let i = F(`<div role="slider" tabindex="0" part="${t}" ${n}><div part="${t}-pointer"></div></div>`);
 		e.appendChild(i.content.cloneNode(!0));
 		let a = e.querySelector(`[part=${t}]`);
 		a.addEventListener("mousedown", this), a.addEventListener("touchstart", this), a.addEventListener("keydown", this), this.el = a, this.xy = r, this.nodes = [a.firstChild, a];
 	}
 	set dragging(e) {
 		let t = e ? document.addEventListener : document.removeEventListener;
-		t(I ? "touchmove" : "mousemove", this), t(I ? "touchend" : "mouseup", this);
+		t(L ? "touchmove" : "mousemove", this), t(L ? "touchend" : "mouseup", this);
 	}
 	handleEvent(e) {
 		switch (e.type) {
 			case "mousedown":
 			case "touchstart":
-				if (e.preventDefault(), !R(e) || !I && e.button != 0) return;
+				if (e.preventDefault(), !oe(e) || !L && e.button != 0) return;
 				this.el.focus(), z(this, e), this.dragging = !0;
 				break;
 			case "mousemove":
@@ -120,7 +120,7 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 				this.dragging = !1;
 				break;
 			case "keydown":
-				B(this, e);
+				se(this, e);
 				break;
 		}
 	}
@@ -129,25 +129,25 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 			for (let n in e) this.nodes[t].style.setProperty(n, e[n]);
 		});
 	}
-}, H = class extends V {
+}, V = class extends B {
 	constructor(e) {
 		super(e, "hue", "aria-label=\"Hue\" aria-valuemin=\"0\" aria-valuemax=\"360\"", !1);
 	}
 	update({ h: e }) {
 		this.h = e, this.style([{
 			left: `${e / 360 * 100}%`,
-			color: O({
+			color: k({
 				h: e,
 				s: 100,
 				v: 100,
 				a: 1
 			})
-		}]), this.el.setAttribute("aria-valuenow", `${T(e)}`);
+		}]), this.el.setAttribute("aria-valuenow", `${w(e)}`);
 	}
 	getMove(e, t) {
-		return { h: t ? w(this.h + e.x * 360, 0, 360) : 360 * e.x };
+		return { h: t ? C(this.h + e.x * 360, 0, 360) : 360 * e.x };
 	}
-}, U = class extends V {
+}, H = class extends B {
 	constructor(e) {
 		super(e, "saturation", "aria-label=\"Color\"", !0);
 	}
@@ -155,47 +155,47 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 		this.hsva = e, this.style([{
 			top: `${100 - e.v}%`,
 			left: `${e.s}%`,
-			color: O(e)
-		}, { "background-color": O({
+			color: k(e)
+		}, { "background-color": k({
 			h: e.h,
 			s: 100,
 			v: 100,
 			a: 1
-		}) }]), this.el.setAttribute("aria-valuetext", `Saturation ${T(e.s)}%, Brightness ${T(e.v)}%`);
+		}) }]), this.el.setAttribute("aria-valuetext", `Saturation ${w(e.s)}%, Brightness ${w(e.v)}%`);
 	}
 	getMove(e, t) {
 		return {
-			s: t ? w(this.hsva.s + e.x * 100, 0, 100) : e.x * 100,
-			v: t ? w(this.hsva.v - e.y * 100, 0, 100) : Math.round(100 - e.y * 100)
+			s: t ? C(this.hsva.s + e.x * 100, 0, 100) : e.x * 100,
+			v: t ? C(this.hsva.v - e.y * 100, 0, 100) : Math.round(100 - e.y * 100)
 		};
 	}
-}, W = ":host{display:flex;flex-direction:column;position:relative;width:200px;height:200px;user-select:none;-webkit-user-select:none;cursor:default}:host([hidden]){display:none!important}[role=slider]{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;outline:0}[role=slider]:last-child{border-radius:0 0 8px 8px}[part$=pointer]{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;display:flex;place-content:center center;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}[part$=pointer]::after{content:\"\";width:100%;height:100%;border-radius:inherit;background-color:currentColor}[role=slider]:focus [part$=pointer]{transform:translate(-50%,-50%) scale(1.1)}", G = "[part=hue]{flex:0 0 24px;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}[part=hue-pointer]{top:50%;z-index:2}", K = "[part=saturation]{flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,rgba(255,255,255,0));box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}[part=saturation-pointer]{z-index:3}", q = Symbol("same"), J = Symbol("color"), Y = Symbol("hsva"), X = Symbol("update"), Z = Symbol("parts"), Q = Symbol("css"), $ = Symbol("sliders"), se = class extends HTMLElement {
+}, U = ":host{display:flex;flex-direction:column;position:relative;width:200px;height:200px;user-select:none;-webkit-user-select:none;cursor:default}:host([hidden]){display:none!important}[role=slider]{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;outline:0}[role=slider]:last-child{border-radius:0 0 8px 8px}[part$=pointer]{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;display:flex;place-content:center center;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}[part$=pointer]::after{content:\"\";width:100%;height:100%;border-radius:inherit;background-color:currentColor}[role=slider]:focus [part$=pointer]{transform:translate(-50%,-50%) scale(1.1)}", W = "[part=hue]{flex:0 0 24px;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}[part=hue-pointer]{top:50%;z-index:2}", G = "[part=saturation]{flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,rgba(255,255,255,0));box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}[part=saturation-pointer]{z-index:3}", K = Symbol("same"), q = Symbol("color"), J = Symbol("hsva"), Y = Symbol("update"), X = Symbol("parts"), Z = Symbol("css"), Q = Symbol("sliders"), ce = class extends HTMLElement {
 	static get observedAttributes() {
 		return ["color"];
 	}
-	get [Q]() {
+	get [Z]() {
 		return [
+			U,
 			W,
-			G,
-			K
+			G
 		];
 	}
-	get [$]() {
-		return [U, H];
+	get [Q]() {
+		return [H, V];
 	}
 	get color() {
-		return this[J];
+		return this[q];
 	}
 	set color(e) {
-		if (!this[q](e)) {
+		if (!this[K](e)) {
 			let t = this.colorModel.toHsva(e);
-			this[X](t), this[J] = e;
+			this[Y](t), this[q] = e;
 		}
 	}
 	constructor() {
 		super();
-		let e = P(`<style>${this[Q].join("")}</style>`), t = this.attachShadow({ mode: "open" });
-		t.appendChild(e.content.cloneNode(!0)), t.addEventListener("move", this), this[Z] = this[$].map((e) => new e(t));
+		let e = F(`<style>${this[Z].join("")}</style>`), t = this.attachShadow({ mode: "open" });
+		t.appendChild(e.content.cloneNode(!0)), t.addEventListener("move", this), this[X] = this[Q].map((e) => new e(t));
 	}
 	connectedCallback() {
 		if (this.hasOwnProperty("color")) {
@@ -205,57 +205,60 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 	}
 	attributeChangedCallback(e, t, n) {
 		let r = this.colorModel.fromAttr(n);
-		this[q](r) || (this.color = r);
+		this[K](r) || (this.color = r);
 	}
 	handleEvent(e) {
-		let t = this[Y], n = {
+		let t = this[J], n = {
 			...t,
 			...e.detail
 		};
-		this[X](n);
+		this[Y](n);
 		let r;
-		!j(n, t) && !this[q](r = this.colorModel.fromHsva(n)) && (this[J] = r, F(this, "color-changed", { value: r }));
+		!M(n, t) && !this[K](r = this.colorModel.fromHsva(n)) && (this[q] = r, I(this, "color-changed", { value: r }));
 	}
-	[q](e) {
+	[K](e) {
 		return this.color && this.colorModel.equal(e, this.color);
 	}
-	[X](e) {
-		this[Y] = e, this[Z].forEach((t) => t.update(e));
+	[Y](e) {
+		this[J] = e, this[X].forEach((t) => t.update(e));
 	}
-}, ce = {
+}, le = {
 	defaultColor: "#000",
-	toHsva: re,
-	fromHsva: ({ h: e, s: t, v: n }) => ie({
+	toHsva: T,
+	fromHsva: ({ h: e, s: t, v: n }) => D({
 		h: e,
 		s: t,
 		v: n,
 		a: 1
 	}),
-	equal: M,
+	equal: N,
 	fromAttr: (e) => e
-}, le = class extends se {
+}, ue = class extends ce {
 	get colorModel() {
-		return ce;
+		return le;
 	}
 };
-customElements.define("hex-color-picker", class extends le {});
+customElements.define("hex-color-picker", class extends ue {});
 //#endregion
 //#region src/components/ColorPicker.vue?vue&type=script&setup=true&lang.ts
-var ue = [
+var de = [
 	"disabled",
 	"aria-label",
 	"aria-expanded"
-], de = [
+], fe = {
+	key: 0,
+	class: "tpl:relative tpl:flex-1"
+}, pe = [
 	"value",
 	"placeholder",
 	"disabled",
 	"aria-label"
-], fe = ["color", "aria-label"], pe = /* @__PURE__ */ v({
+], me = ["aria-label", "title"], $ = ["color", "aria-label"], he = /* @__PURE__ */ v({
 	__name: "ColorPicker",
 	props: {
 		modelValue: {},
-		placeholder: { default: x },
-		size: { default: "default" },
+		placeholder: { default: "" },
+		seedColor: { default: "#ffffff" },
 		swatchOnly: {
 			type: Boolean,
 			default: !1
@@ -267,21 +270,27 @@ var ue = [
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		let r = e, s = t, { t: f } = ee(), _ = a(!1), v = a(), b = a();
-		te(v, () => {
+		let r = e, s = t, { t: f } = ee(), _ = a(!1), v = a(), b = a(), x = a(!1);
+		ne(v, () => {
 			_.value = !1;
 		}, { ignore: [b] });
-		let x = c({
-			get: () => r.modelValue || "#000000",
-			set: (e) => s("update:modelValue", e)
-		});
-		function S(e) {
-			x.value = e.detail.value;
+		let S = c(() => !r.modelValue), C = c(() => r.modelValue || r.seedColor), w = c(() => !r.swatchOnly && !r.disabled && !S.value);
+		function T(e) {
+			x.value = !0, s("update:modelValue", e.detail.value);
+		}
+		function E() {
+			x.value = !1;
+		}
+		function D() {
+			!x.value && S.value && s("update:modelValue", C.value);
 		}
-		function C(e) {
-			x.value = e.target.value;
+		function O(e) {
+			s("update:modelValue", e.target.value);
 		}
-		return (t, r) => (n(), l("div", { class: m(["tpl:flex tpl:gap-2 tpl:relative", e.disabled && "tpl:opacity-60 tpl:cursor-not-allowed"]) }, [
+		function k() {
+			s("update:modelValue", "");
+		}
+		return (t, r) => (n(), l("div", { class: m(["tpl:flex tpl:items-center tpl:gap-2 tpl:relative", e.disabled && "tpl:opacity-60 tpl:cursor-not-allowed"]) }, [
 			h("button", {
 				ref_key: "swatchRef",
 				ref: b,
@@ -293,23 +302,33 @@ var ue = [
 					"tpl:shrink-0 tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-0.5 tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]",
 					e.disabled ? "tpl:cursor-not-allowed" : "tpl:cursor-pointer",
 					_.value ? "tpl:border-[var(--tpl-primary)] tpl:shadow-[var(--tpl-ring)]" : !e.disabled && "hover:tpl:border-[var(--tpl-text-dim)]",
-					e.size === "large" ? "tpl:size-12" : "tpl:size-10"
+					"tpl:size-10"
 				]),
 				onClick: r[0] ||= (t) => !e.disabled && (_.value = !_.value)
 			}, [h("span", {
-				class: "tpl:block tpl:size-full tpl:rounded-[calc(var(--tpl-radius-sm)-2px)]",
-				style: g({ backgroundColor: x.value })
-			}, null, 4)], 10, ue),
-			e.swatchOnly ? u("", !0) : (n(), l("input", {
-				key: 0,
+				class: m(["tpl:block tpl:size-full tpl:rounded-[calc(var(--tpl-radius-sm)-2px)]", { "tpl-color-swatch-empty": S.value }]),
+				style: g(S.value ? void 0 : { backgroundColor: e.modelValue })
+			}, null, 6)], 10, de),
+			e.swatchOnly ? u("", !0) : (n(), l("div", fe, [h("input", {
 				type: "text",
-				class: m(d(ne)),
+				class: m([d(re), "tpl:w-full"]),
+				style: g(w.value ? { paddingRight: "2.25rem" } : void 0),
 				value: e.modelValue,
-				placeholder: e.placeholder,
+				placeholder: e.placeholder || d(f).colorPicker.notSet,
 				disabled: e.disabled,
 				"aria-label": d(f).colorPicker.hexValue,
-				onInput: C
-			}, null, 42, de)),
+				onInput: O
+			}, null, 46, pe), w.value ? (n(), l("button", {
+				key: 0,
+				type: "button",
+				"aria-label": d(f).colorPicker.clear,
+				title: d(f).colorPicker.clear,
+				class: "tpl:absolute tpl:right-2 tpl:top-1/2 tpl:flex tpl:size-6 tpl:-translate-y-1/2 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:text-[var(--tpl-text-dim)] tpl:transition-colors tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)] hover:tpl:bg-[var(--tpl-bg-hover)] hover:tpl:text-[var(--tpl-text)]",
+				onClick: k
+			}, [y(d(te), {
+				size: 14,
+				"stroke-width": 1.5
+			})], 8, me)) : u("", !0)])),
 			y(p, {
 				"enter-active-class": "tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]",
 				"enter-from-class": "tpl:opacity-0 tpl:scale-95 tpl:translate-y-1",
@@ -324,21 +343,23 @@ var ue = [
 					ref: v,
 					class: "tpl:absolute tpl:left-0 tpl:top-full tpl:z-50 tpl:mt-2 tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)] tpl:p-3 tpl:shadow-lg"
 				}, [h("hex-color-picker", {
-					color: x.value,
+					color: C.value,
 					"aria-label": d(f).colorPicker.pickColor,
-					onColorChanged: S,
+					onColorChanged: T,
+					onPointerdown: E,
+					onPointerup: D,
 					onKeydown: r[1] ||= o((e) => _.value = !1, ["escape"])
-				}, null, 40, fe)], 512)) : u("", !0)]),
+				}, null, 40, $)], 512)) : u("", !0)]),
 				_: 1
 			})
 		], 2));
 	}
-}), me = [
+}), ge = [
 	"aria-checked",
 	"aria-label",
 	"title",
 	"onClick"
-], he = { key: 1 }, ge = /* @__PURE__ */ v({
+], _e = { key: 1 }, ve = /* @__PURE__ */ v({
 	__name: "SlidingPillSelect",
 	props: {
 		options: {},
@@ -381,22 +402,22 @@ var ue = [
 			key: 0,
 			size: 14,
 			"stroke-width": 2
-		})) : (n(), l("span", he, s(r.label), 1))], 12, me))), 128))], 4));
+		})) : (n(), l("span", _e, s(r.label), 1))], 12, ge))), 128))], 4));
 	}
-}), _e = { class: "tpl:mb-3.5" }, ve = /* @__PURE__ */ v({
+}), ye = { class: "tpl:mb-3.5" }, be = /* @__PURE__ */ v({
 	__name: "FieldRow",
 	props: { label: {} },
 	setup(t) {
-		return (r, i) => (n(), l("div", _e, [t.label ? (n(), l("label", {
+		return (r, i) => (n(), l("div", ye, [t.label ? (n(), l("label", {
 			key: 0,
 			class: m(d(b))
 		}, s(t.label), 3)) : u("", !0), e(r.$slots, "default")]));
 	}
-}), ye = { class: "tpl:flex tpl:items-stretch" }, be = [
+}), xe = { class: "tpl:flex tpl:items-stretch" }, Se = [
 	"value",
 	"min",
 	"max"
-], xe = /* @__PURE__ */ v({
+], Ce = /* @__PURE__ */ v({
 	__name: "NumberWithSuffix",
 	props: {
 		modelValue: {},
@@ -407,17 +428,17 @@ var ue = [
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
 		let r = t;
-		return (t, i) => (n(), l("div", ye, [h("input", {
+		return (t, i) => (n(), l("div", xe, [h("input", {
 			type: "number",
-			class: m(d(C)),
+			class: m(d(S)),
 			value: e.modelValue,
 			min: e.min,
 			max: e.max,
 			onInput: i[0] ||= (e) => r("update:modelValue", Number(e.target.value))
-		}, null, 42, be), h("span", { class: m(d(S)) }, s(e.suffix), 3)]));
+		}, null, 42, Se), h("span", { class: m(d(x)) }, s(e.suffix), 3)]));
 	}
 });
 //#endregion
-export { pe as i, ve as n, ge as r, xe as t };
+export { he as i, be as n, ve as r, Ce as t };
 
-//# sourceMappingURL=NumberWithSuffix-Deo8EOSz.js.map
+//# sourceMappingURL=NumberWithSuffix-cdWjAK6y.js.map

package/dist/cdn/chunks/NumberWithSuffix-cdWjAK6y.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberWithSuffix-cdWjAK6y.js","names":["css","hueCss","saturationCss"],"sources":["../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/utils/math.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/utils/convert.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/utils/compare.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/utils/dom.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/components/slider.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/components/hue.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/components/saturation.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/styles/color-picker.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/styles/hue.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/styles/saturation.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/components/color-picker.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/lib/entrypoints/hex.js","../../../../../node_modules/.pnpm/vanilla-colorful@0.7.2/node_modules/vanilla-colorful/hex-color-picker.js","../../../src/components/ColorPicker.vue","../../../src/components/ColorPicker.vue","../../../src/components/SlidingPillSelect.vue","../../../src/components/SlidingPillSelect.vue","../../../src/components/toolbar/FieldRow.vue","../../../src/components/toolbar/FieldRow.vue","../../../src/components/toolbar/NumberWithSuffix.vue","../../../src/components/toolbar/NumberWithSuffix.vue"],"sourcesContent":["// Clamps a value between an upper and lower bound.\n// We use ternary operators because it makes the minified code\n// 2 times shorter then `Math.min(Math.max(a,b),c)`\nexport const clamp = (number, min = 0, max = 1) => {\n    return number > max ? max : number < min ? min : number;\n};\nexport const round = (number, digits = 0, base = Math.pow(10, digits)) => {\n    return Math.round(base * number) / base;\n};\n//# sourceMappingURL=math.js.map","import { round } from './math.js';\n/**\n * Valid CSS <angle> units.\n * https://developer.mozilla.org/en-US/docs/Web/CSS/angle\n */\nconst angleUnits = {\n    grad: 360 / 400,\n    turn: 360,\n    rad: 360 / (Math.PI * 2)\n};\nexport const hexToHsva = (hex) => rgbaToHsva(hexToRgba(hex));\nexport const hexToRgba = (hex) => {\n    if (hex[0] === '#')\n        hex = hex.substring(1);\n    if (hex.length < 6) {\n        return {\n            r: parseInt(hex[0] + hex[0], 16),\n            g: parseInt(hex[1] + hex[1], 16),\n            b: parseInt(hex[2] + hex[2], 16),\n            a: hex.length === 4 ? round(parseInt(hex[3] + hex[3], 16) / 255, 2) : 1\n        };\n    }\n    return {\n        r: parseInt(hex.substring(0, 2), 16),\n        g: parseInt(hex.substring(2, 4), 16),\n        b: parseInt(hex.substring(4, 6), 16),\n        a: hex.length === 8 ? round(parseInt(hex.substring(6, 8), 16) / 255, 2) : 1\n    };\n};\nexport const parseHue = (value, unit = 'deg') => {\n    return Number(value) * (angleUnits[unit] || 1);\n};\nexport const hslaStringToHsva = (hslString) => {\n    const matcher = /hsla?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n    const match = matcher.exec(hslString);\n    if (!match)\n        return { h: 0, s: 0, v: 0, a: 1 };\n    return hslaToHsva({\n        h: parseHue(match[1], match[2]),\n        s: Number(match[3]),\n        l: Number(match[4]),\n        a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1)\n    });\n};\nexport const hslStringToHsva = hslaStringToHsva;\nexport const hslaToHsva = ({ h, s, l, a }) => {\n    s *= (l < 50 ? l : 100 - l) / 100;\n    return {\n        h: h,\n        s: s > 0 ? ((2 * s) / (l + s)) * 100 : 0,\n        v: l + s,\n        a\n    };\n};\nexport const hsvaToHex = (hsva) => rgbaToHex(hsvaToRgba(hsva));\nexport const hsvaToHsla = ({ h, s, v, a }) => {\n    const hh = ((200 - s) * v) / 100;\n    return {\n        h: round(h),\n        s: round(hh > 0 && hh < 200 ? ((s * v) / 100 / (hh <= 100 ? hh : 200 - hh)) * 100 : 0),\n        l: round(hh / 2),\n        a: round(a, 2)\n    };\n};\nexport const hsvaToHsvString = (hsva) => {\n    const { h, s, v } = roundHsva(hsva);\n    return `hsv(${h}, ${s}%, ${v}%)`;\n};\nexport const hsvaToHsvaString = (hsva) => {\n    const { h, s, v, a } = roundHsva(hsva);\n    return `hsva(${h}, ${s}%, ${v}%, ${a})`;\n};\nexport const hsvaToHslString = (hsva) => {\n    const { h, s, l } = hsvaToHsla(hsva);\n    return `hsl(${h}, ${s}%, ${l}%)`;\n};\nexport const hsvaToHslaString = (hsva) => {\n    const { h, s, l, a } = hsvaToHsla(hsva);\n    return `hsla(${h}, ${s}%, ${l}%, ${a})`;\n};\nexport const hsvaToRgba = ({ h, s, v, a }) => {\n    h = (h / 360) * 6;\n    s = s / 100;\n    v = v / 100;\n    const hh = Math.floor(h), b = v * (1 - s), c = v * (1 - (h - hh) * s), d = v * (1 - (1 - h + hh) * s), module = hh % 6;\n    return {\n        r: round([v, c, b, b, d, v][module] * 255),\n        g: round([d, v, v, c, b, b][module] * 255),\n        b: round([b, b, d, v, v, c][module] * 255),\n        a: round(a, 2)\n    };\n};\nexport const hsvaToRgbString = (hsva) => {\n    const { r, g, b } = hsvaToRgba(hsva);\n    return `rgb(${r}, ${g}, ${b})`;\n};\nexport const hsvaToRgbaString = (hsva) => {\n    const { r, g, b, a } = hsvaToRgba(hsva);\n    return `rgba(${r}, ${g}, ${b}, ${a})`;\n};\nexport const hsvaStringToHsva = (hsvString) => {\n    const matcher = /hsva?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n    const match = matcher.exec(hsvString);\n    if (!match)\n        return { h: 0, s: 0, v: 0, a: 1 };\n    return roundHsva({\n        h: parseHue(match[1], match[2]),\n        s: Number(match[3]),\n        v: Number(match[4]),\n        a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1)\n    });\n};\nexport const hsvStringToHsva = hsvaStringToHsva;\nexport const rgbaStringToHsva = (rgbaString) => {\n    const matcher = /rgba?\\(?\\s*(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n    const match = matcher.exec(rgbaString);\n    if (!match)\n        return { h: 0, s: 0, v: 0, a: 1 };\n    return rgbaToHsva({\n        r: Number(match[1]) / (match[2] ? 100 / 255 : 1),\n        g: Number(match[3]) / (match[4] ? 100 / 255 : 1),\n        b: Number(match[5]) / (match[6] ? 100 / 255 : 1),\n        a: match[7] === undefined ? 1 : Number(match[7]) / (match[8] ? 100 : 1)\n    });\n};\nexport const rgbStringToHsva = rgbaStringToHsva;\nconst format = (number) => {\n    const hex = number.toString(16);\n    return hex.length < 2 ? '0' + hex : hex;\n};\nexport const rgbaToHex = ({ r, g, b, a }) => {\n    const alphaHex = a < 1 ? format(round(a * 255)) : '';\n    return '#' + format(r) + format(g) + format(b) + alphaHex;\n};\nexport const rgbaToHsva = ({ r, g, b, a }) => {\n    const max = Math.max(r, g, b);\n    const delta = max - Math.min(r, g, b);\n    // prettier-ignore\n    const hh = delta\n        ? max === r\n            ? (g - b) / delta\n            : max === g\n                ? 2 + (b - r) / delta\n                : 4 + (r - g) / delta\n        : 0;\n    return {\n        h: round(60 * (hh < 0 ? hh + 6 : hh)),\n        s: round(max ? (delta / max) * 100 : 0),\n        v: round((max / 255) * 100),\n        a\n    };\n};\nexport const roundHsva = (hsva) => ({\n    h: round(hsva.h),\n    s: round(hsva.s),\n    v: round(hsva.v),\n    a: round(hsva.a, 2)\n});\nexport const rgbaToRgb = ({ r, g, b }) => ({ r, g, b });\nexport const hslaToHsl = ({ h, s, l }) => ({ h, s, l });\nexport const hsvaToHsv = (hsva) => {\n    const { h, s, v } = roundHsva(hsva);\n    return { h, s, v };\n};\n//# sourceMappingURL=convert.js.map","import { hexToRgba } from './convert.js';\nexport const equalColorObjects = (first, second) => {\n    if (first === second)\n        return true;\n    for (const prop in first) {\n        // The following allows for a type-safe calling of this function (first & second have to be HSL, HSV, or RGB)\n        // with type-unsafe iterating over object keys. TS does not allow this without an index (`[key: string]: number`)\n        // on an object to define how iteration is normally done. To ensure extra keys are not allowed on our types,\n        // we must cast our object to unknown (as RGB demands `r` be a key, while `Record<string, x>` does not care if\n        // there is or not), and then as a type TS can iterate over.\n        if (first[prop] !==\n            second[prop])\n            return false;\n    }\n    return true;\n};\nexport const equalColorString = (first, second) => {\n    return first.replace(/\\s/g, '') === second.replace(/\\s/g, '');\n};\nexport const equalHex = (first, second) => {\n    if (first.toLowerCase() === second.toLowerCase())\n        return true;\n    // To compare colors like `#FFF` and `ffffff` we convert them into RGB objects\n    return equalColorObjects(hexToRgba(first), hexToRgba(second));\n};\n//# sourceMappingURL=compare.js.map","const cache = {};\nexport const tpl = (html) => {\n    let template = cache[html];\n    if (!template) {\n        template = document.createElement('template');\n        template.innerHTML = html;\n        cache[html] = template;\n    }\n    return template;\n};\nexport const fire = (target, type, detail) => {\n    target.dispatchEvent(new CustomEvent(type, {\n        bubbles: true,\n        detail\n    }));\n};\n//# sourceMappingURL=dom.js.map","import { fire, tpl } from '../utils/dom.js';\nimport { clamp } from '../utils/math.js';\nlet hasTouched = false;\n// Check if an event was triggered by touch\nconst isTouch = (e) => 'touches' in e;\n// Prevent mobile browsers from handling mouse events (conflicting with touch ones).\n// If we detected a touch interaction before, we prefer reacting to touch events only.\nconst isValid = (event) => {\n    if (hasTouched && !isTouch(event))\n        return false;\n    if (!hasTouched)\n        hasTouched = isTouch(event);\n    return true;\n};\nconst pointerMove = (target, event) => {\n    const pointer = isTouch(event) ? event.touches[0] : event;\n    const rect = target.el.getBoundingClientRect();\n    fire(target.el, 'move', target.getMove({\n        x: clamp((pointer.pageX - (rect.left + window.pageXOffset)) / rect.width),\n        y: clamp((pointer.pageY - (rect.top + window.pageYOffset)) / rect.height)\n    }));\n};\nconst keyMove = (target, event) => {\n    // We use `keyCode` instead of `key` to reduce the size of the library.\n    const keyCode = event.keyCode;\n    // Ignore all keys except arrow ones, Page Up, Page Down, Home and End.\n    if (keyCode > 40 || (target.xy && keyCode < 37) || keyCode < 33)\n        return;\n    // Do not scroll page by keys when color picker element has focus.\n    event.preventDefault();\n    // Send relative offset to the parent component.\n    fire(target.el, 'move', target.getMove({\n        x: keyCode === 39 // Arrow Right\n            ? 0.01\n            : keyCode === 37 // Arrow Left\n                ? -0.01\n                : keyCode === 34 // Page Down\n                    ? 0.05\n                    : keyCode === 33 // Page Up\n                        ? -0.05\n                        : keyCode === 35 // End\n                            ? 1\n                            : keyCode === 36 // Home\n                                ? -1\n                                : 0,\n        y: keyCode === 40 // Arrow down\n            ? 0.01\n            : keyCode === 38 // Arrow Up\n                ? -0.01\n                : 0\n    }, true));\n};\nexport class Slider {\n    constructor(root, part, aria, xy) {\n        const template = tpl(`<div role=\"slider\" tabindex=\"0\" part=\"${part}\" ${aria}><div part=\"${part}-pointer\"></div></div>`);\n        root.appendChild(template.content.cloneNode(true));\n        const el = root.querySelector(`[part=${part}]`);\n        el.addEventListener('mousedown', this);\n        el.addEventListener('touchstart', this);\n        el.addEventListener('keydown', this);\n        this.el = el;\n        this.xy = xy;\n        this.nodes = [el.firstChild, el];\n    }\n    set dragging(state) {\n        const toggleEvent = state ? document.addEventListener : document.removeEventListener;\n        toggleEvent(hasTouched ? 'touchmove' : 'mousemove', this);\n        toggleEvent(hasTouched ? 'touchend' : 'mouseup', this);\n    }\n    handleEvent(event) {\n        switch (event.type) {\n            case 'mousedown':\n            case 'touchstart':\n                event.preventDefault();\n                // event.button is 0 in mousedown for left button activation\n                if (!isValid(event) || (!hasTouched && event.button != 0))\n                    return;\n                this.el.focus();\n                pointerMove(this, event);\n                this.dragging = true;\n                break;\n            case 'mousemove':\n            case 'touchmove':\n                event.preventDefault();\n                pointerMove(this, event);\n                break;\n            case 'mouseup':\n            case 'touchend':\n                this.dragging = false;\n                break;\n            case 'keydown':\n                keyMove(this, event);\n                break;\n        }\n    }\n    style(styles) {\n        styles.forEach((style, i) => {\n            for (const p in style) {\n                this.nodes[i].style.setProperty(p, style[p]);\n            }\n        });\n    }\n}\n//# sourceMappingURL=slider.js.map","import { Slider } from './slider.js';\nimport { hsvaToHslString } from '../utils/convert.js';\nimport { clamp, round } from '../utils/math.js';\nexport class Hue extends Slider {\n    constructor(root) {\n        super(root, 'hue', 'aria-label=\"Hue\" aria-valuemin=\"0\" aria-valuemax=\"360\"', false);\n    }\n    update({ h }) {\n        this.h = h;\n        this.style([\n            {\n                left: `${(h / 360) * 100}%`,\n                color: hsvaToHslString({ h, s: 100, v: 100, a: 1 })\n            }\n        ]);\n        this.el.setAttribute('aria-valuenow', `${round(h)}`);\n    }\n    getMove(offset, key) {\n        // Hue measured in degrees of the color circle ranging from 0 to 360\n        return { h: key ? clamp(this.h + offset.x * 360, 0, 360) : 360 * offset.x };\n    }\n}\n//# sourceMappingURL=hue.js.map","import { Slider } from './slider.js';\nimport { hsvaToHslString } from '../utils/convert.js';\nimport { clamp, round } from '../utils/math.js';\nexport class Saturation extends Slider {\n    constructor(root) {\n        super(root, 'saturation', 'aria-label=\"Color\"', true);\n    }\n    update(hsva) {\n        this.hsva = hsva;\n        this.style([\n            {\n                top: `${100 - hsva.v}%`,\n                left: `${hsva.s}%`,\n                color: hsvaToHslString(hsva)\n            },\n            {\n                'background-color': hsvaToHslString({ h: hsva.h, s: 100, v: 100, a: 1 })\n            }\n        ]);\n        this.el.setAttribute('aria-valuetext', `Saturation ${round(hsva.s)}%, Brightness ${round(hsva.v)}%`);\n    }\n    getMove(offset, key) {\n        // Saturation and brightness always fit into [0, 100] range\n        return {\n            s: key ? clamp(this.hsva.s + offset.x * 100, 0, 100) : offset.x * 100,\n            v: key ? clamp(this.hsva.v - offset.y * 100, 0, 100) : Math.round(100 - offset.y * 100)\n        };\n    }\n}\n//# sourceMappingURL=saturation.js.map","export default `:host{display:flex;flex-direction:column;position:relative;width:200px;height:200px;user-select:none;-webkit-user-select:none;cursor:default}:host([hidden]){display:none!important}[role=slider]{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;outline:0}[role=slider]:last-child{border-radius:0 0 8px 8px}[part$=pointer]{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;display:flex;place-content:center center;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}[part$=pointer]::after{content:\"\";width:100%;height:100%;border-radius:inherit;background-color:currentColor}[role=slider]:focus [part$=pointer]{transform:translate(-50%,-50%) scale(1.1)}`;\n//# sourceMappingURL=color-picker.js.map","export default `[part=hue]{flex:0 0 24px;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}[part=hue-pointer]{top:50%;z-index:2}`;\n//# sourceMappingURL=hue.js.map","export default `[part=saturation]{flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,rgba(255,255,255,0));box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}[part=saturation-pointer]{z-index:3}`;\n//# sourceMappingURL=saturation.js.map","import { equalColorObjects } from '../utils/compare.js';\nimport { fire, tpl } from '../utils/dom.js';\nimport { Hue } from './hue.js';\nimport { Saturation } from './saturation.js';\nimport css from '../styles/color-picker.js';\nimport hueCss from '../styles/hue.js';\nimport saturationCss from '../styles/saturation.js';\nconst $isSame = Symbol('same');\nconst $color = Symbol('color');\nconst $hsva = Symbol('hsva');\nconst $update = Symbol('update');\nconst $parts = Symbol('parts');\nexport const $css = Symbol('css');\nexport const $sliders = Symbol('sliders');\nexport class ColorPicker extends HTMLElement {\n    static get observedAttributes() {\n        return ['color'];\n    }\n    get [$css]() {\n        return [css, hueCss, saturationCss];\n    }\n    get [$sliders]() {\n        return [Saturation, Hue];\n    }\n    get color() {\n        return this[$color];\n    }\n    set color(newColor) {\n        if (!this[$isSame](newColor)) {\n            const newHsva = this.colorModel.toHsva(newColor);\n            this[$update](newHsva);\n            this[$color] = newColor;\n        }\n    }\n    constructor() {\n        super();\n        const template = tpl(`<style>${this[$css].join('')}</style>`);\n        const root = this.attachShadow({ mode: 'open' });\n        root.appendChild(template.content.cloneNode(true));\n        root.addEventListener('move', this);\n        this[$parts] = this[$sliders].map((slider) => new slider(root));\n    }\n    connectedCallback() {\n        // A user may set a property on an _instance_ of an element,\n        // before its prototype has been connected to this class.\n        // If so, we need to run it through the proper class setter.\n        if (this.hasOwnProperty('color')) {\n            const value = this.color;\n            delete this['color'];\n            this.color = value;\n        }\n        else if (!this.color) {\n            this.color = this.colorModel.defaultColor;\n        }\n    }\n    attributeChangedCallback(_attr, _oldVal, newVal) {\n        const color = this.colorModel.fromAttr(newVal);\n        if (!this[$isSame](color)) {\n            this.color = color;\n        }\n    }\n    handleEvent(event) {\n        // Merge the current HSV color object with updated params.\n        const oldHsva = this[$hsva];\n        const newHsva = { ...oldHsva, ...event.detail };\n        this[$update](newHsva);\n        let newColor;\n        if (!equalColorObjects(newHsva, oldHsva) &&\n            !this[$isSame]((newColor = this.colorModel.fromHsva(newHsva)))) {\n            this[$color] = newColor;\n            fire(this, 'color-changed', { value: newColor });\n        }\n    }\n    [$isSame](color) {\n        return this.color && this.colorModel.equal(color, this.color);\n    }\n    [$update](hsva) {\n        this[$hsva] = hsva;\n        this[$parts].forEach((part) => part.update(hsva));\n    }\n}\n//# sourceMappingURL=color-picker.js.map","import { ColorPicker } from '../components/color-picker.js';\nimport { hexToHsva, hsvaToHex } from '../utils/convert.js';\nimport { equalHex } from '../utils/compare.js';\nconst colorModel = {\n    defaultColor: '#000',\n    toHsva: hexToHsva,\n    fromHsva: ({ h, s, v }) => hsvaToHex({ h, s, v, a: 1 }),\n    equal: equalHex,\n    fromAttr: (color) => color\n};\nexport class HexBase extends ColorPicker {\n    get colorModel() {\n        return colorModel;\n    }\n}\n//# sourceMappingURL=hex.js.map","import { HexBase } from './lib/entrypoints/hex.js';\n/**\n * A color picker custom element that uses HEX format.\n *\n * @element hex-color-picker\n *\n * @prop {string} color - Selected color in HEX format.\n * @attr {string} color - Selected color in HEX format.\n *\n * @fires color-changed - Event fired when color property changes.\n *\n * @csspart hue - A hue selector container.\n * @csspart saturation - A saturation selector container\n * @csspart hue-pointer - A hue pointer element.\n * @csspart saturation-pointer - A saturation pointer element.\n */\nexport class HexColorPicker extends HexBase {\n}\ncustomElements.define('hex-color-picker', HexColorPicker);\n//# sourceMappingURL=hex-color-picker.js.map","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { onClickOutside } from \"@vueuse/core\";\nimport { X } from \"@lucide/vue\";\nimport { useI18n } from \"../composables/useI18n\";\nimport { colorTextClass } from \"../constants/styleConstants\";\nimport \"vanilla-colorful\";\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: string;\n    placeholder?: string;\n    /**\n     * Color the picker wheel opens on while the field is unset. It only\n     * positions the wheel — it never paints the swatch or fills the input,\n     * so an unset field still reads as \"not set\".\n     */\n    seedColor?: string;\n    swatchOnly?: boolean;\n    disabled?: boolean;\n  }>(),\n  {\n    placeholder: \"\",\n    seedColor: \"#ffffff\",\n    swatchOnly: false,\n    disabled: false,\n  },\n);\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nconst { t } = useI18n();\n\nconst open = ref(false);\nconst popoverRef = ref<HTMLElement>();\nconst swatchRef = ref<HTMLElement>();\n\n// Whether the picker emitted a real change during the current pointer gesture.\n// vanilla-colorful only fires `color-changed` when the chosen color differs\n// from the one the wheel was seeded with — so picking a color equal to the\n// seed emits nothing. When the field is still unset after such a no-change\n// pick, we commit the seed ourselves on pointerup so the value persists\n// (otherwise e.g. white on an empty background can never be set — issue #282).\nconst pickerTouched = ref(false);\n\nonClickOutside(\n  popoverRef,\n  () => {\n    open.value = false;\n  },\n  { ignore: [swatchRef] },\n);\n\nconst isUnset = computed(() => !props.modelValue);\n\n// The color handed to the wheel: the stored value, or the seed when unset.\nconst seed = computed(() => props.modelValue || props.seedColor);\n\n// The clear (×) lives inside the input, shown only when a value is set.\nconst showClear = computed(\n  () => !props.swatchOnly && !props.disabled && !isUnset.value,\n);\n\nfunction onPickerChange(e: Event): void {\n  pickerTouched.value = true;\n  emit(\"update:modelValue\", (e as CustomEvent).detail.value);\n}\n\nfunction onPickerPointerDown(): void {\n  pickerTouched.value = false;\n}\n\nfunction onPickerPointerUp(): void {\n  // A deliberate pick equal to the seed fires no `color-changed`; commit it.\n  if (!pickerTouched.value && isUnset.value) {\n    emit(\"update:modelValue\", seed.value);\n  }\n}\n\nfunction onTextInput(e: Event): void {\n  emit(\"update:modelValue\", (e.target as HTMLInputElement).value);\n}\n\nfunction clear(): void {\n  emit(\"update:modelValue\", \"\");\n}\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'tpl:flex tpl:items-center tpl:gap-2 tpl:relative',\n      disabled && 'tpl:opacity-60 tpl:cursor-not-allowed',\n    ]\"\n  >\n    <button\n      ref=\"swatchRef\"\n      type=\"button\"\n      :disabled=\"disabled\"\n      :aria-label=\"t.colorPicker.pickColor\"\n      :aria-expanded=\"open\"\n      :class=\"[\n        'tpl:shrink-0 tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-0.5 tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]',\n        disabled ? 'tpl:cursor-not-allowed' : 'tpl:cursor-pointer',\n        open\n          ? 'tpl:border-[var(--tpl-primary)] tpl:shadow-[var(--tpl-ring)]'\n          : !disabled && 'hover:tpl:border-[var(--tpl-text-dim)]',\n        'tpl:size-10',\n      ]\"\n      @click=\"!disabled && (open = !open)\"\n    >\n      <span\n        class=\"tpl:block tpl:size-full tpl:rounded-[calc(var(--tpl-radius-sm)-2px)]\"\n        :class=\"{ 'tpl-color-swatch-empty': isUnset }\"\n        :style=\"isUnset ? undefined : { backgroundColor: modelValue }\"\n      />\n    </button>\n    <div v-if=\"!swatchOnly\" class=\"tpl:relative tpl:flex-1\">\n      <input\n        type=\"text\"\n        :class=\"[colorTextClass, 'tpl:w-full']\"\n        :style=\"showClear ? { paddingRight: '2.25rem' } : undefined\"\n        :value=\"modelValue\"\n        :placeholder=\"placeholder || t.colorPicker.notSet\"\n        :disabled=\"disabled\"\n        :aria-label=\"t.colorPicker.hexValue\"\n        @input=\"onTextInput\"\n      />\n      <button\n        v-if=\"showClear\"\n        type=\"button\"\n        :aria-label=\"t.colorPicker.clear\"\n        :title=\"t.colorPicker.clear\"\n        class=\"tpl:absolute tpl:right-2 tpl:top-1/2 tpl:flex tpl:size-6 tpl:-translate-y-1/2 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:text-[var(--tpl-text-dim)] tpl:transition-colors tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)] hover:tpl:bg-[var(--tpl-bg-hover)] hover:tpl:text-[var(--tpl-text)]\"\n        @click=\"clear\"\n      >\n        <X :size=\"14\" :stroke-width=\"1.5\" />\n      </button>\n    </div>\n    <Transition\n      enter-active-class=\"tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]\"\n      enter-from-class=\"tpl:opacity-0 tpl:scale-95 tpl:translate-y-1\"\n      enter-to-class=\"tpl:opacity-100 tpl:scale-100 tpl:translate-y-0\"\n      leave-active-class=\"tpl:transition-all tpl:duration-[80ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]\"\n      leave-from-class=\"tpl:opacity-100 tpl:scale-100 tpl:translate-y-0\"\n      leave-to-class=\"tpl:opacity-0 tpl:scale-95 tpl:translate-y-1\"\n    >\n      <div\n        v-if=\"open\"\n        ref=\"popoverRef\"\n        class=\"tpl:absolute tpl:left-0 tpl:top-full tpl:z-50 tpl:mt-2 tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)] tpl:p-3 tpl:shadow-lg\"\n      >\n        <hex-color-picker\n          :color=\"seed\"\n          :aria-label=\"t.colorPicker.pickColor\"\n          @color-changed=\"onPickerChange\"\n          @pointerdown=\"onPickerPointerDown\"\n          @pointerup=\"onPickerPointerUp\"\n          @keydown.escape=\"open = false\"\n        />\n      </div>\n    </Transition>\n  </div>\n</template>\n\n<style>\nhex-color-picker {\n  --hcp-width: 200px;\n}\n\nhex-color-picker::part(hue) {\n  border-radius: var(--tpl-radius-sm, 7px);\n}\n\nhex-color-picker::part(saturation) {\n  border-radius: var(--tpl-radius-sm, 7px) var(--tpl-radius-sm, 7px) 0 0;\n}\n\n/* Unset swatch: paper with a single thin diagonal slash = \"no color set\".\n   A neutral non-color signal — never Signal Amber (intent) or Danger. */\n.tpl-color-swatch-empty {\n  background-color: var(--tpl-bg);\n  background-image: linear-gradient(\n    to top right,\n    transparent calc(50% - 0.75px),\n    var(--tpl-text-dim) calc(50% - 0.75px),\n    var(--tpl-text-dim) calc(50% + 0.75px),\n    transparent calc(50% + 0.75px)\n  );\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { onClickOutside } from \"@vueuse/core\";\nimport { X } from \"@lucide/vue\";\nimport { useI18n } from \"../composables/useI18n\";\nimport { colorTextClass } from \"../constants/styleConstants\";\nimport \"vanilla-colorful\";\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: string;\n    placeholder?: string;\n    /**\n     * Color the picker wheel opens on while the field is unset. It only\n     * positions the wheel — it never paints the swatch or fills the input,\n     * so an unset field still reads as \"not set\".\n     */\n    seedColor?: string;\n    swatchOnly?: boolean;\n    disabled?: boolean;\n  }>(),\n  {\n    placeholder: \"\",\n    seedColor: \"#ffffff\",\n    swatchOnly: false,\n    disabled: false,\n  },\n);\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nconst { t } = useI18n();\n\nconst open = ref(false);\nconst popoverRef = ref<HTMLElement>();\nconst swatchRef = ref<HTMLElement>();\n\n// Whether the picker emitted a real change during the current pointer gesture.\n// vanilla-colorful only fires `color-changed` when the chosen color differs\n// from the one the wheel was seeded with — so picking a color equal to the\n// seed emits nothing. When the field is still unset after such a no-change\n// pick, we commit the seed ourselves on pointerup so the value persists\n// (otherwise e.g. white on an empty background can never be set — issue #282).\nconst pickerTouched = ref(false);\n\nonClickOutside(\n  popoverRef,\n  () => {\n    open.value = false;\n  },\n  { ignore: [swatchRef] },\n);\n\nconst isUnset = computed(() => !props.modelValue);\n\n// The color handed to the wheel: the stored value, or the seed when unset.\nconst seed = computed(() => props.modelValue || props.seedColor);\n\n// The clear (×) lives inside the input, shown only when a value is set.\nconst showClear = computed(\n  () => !props.swatchOnly && !props.disabled && !isUnset.value,\n);\n\nfunction onPickerChange(e: Event): void {\n  pickerTouched.value = true;\n  emit(\"update:modelValue\", (e as CustomEvent).detail.value);\n}\n\nfunction onPickerPointerDown(): void {\n  pickerTouched.value = false;\n}\n\nfunction onPickerPointerUp(): void {\n  // A deliberate pick equal to the seed fires no `color-changed`; commit it.\n  if (!pickerTouched.value && isUnset.value) {\n    emit(\"update:modelValue\", seed.value);\n  }\n}\n\nfunction onTextInput(e: Event): void {\n  emit(\"update:modelValue\", (e.target as HTMLInputElement).value);\n}\n\nfunction clear(): void {\n  emit(\"update:modelValue\", \"\");\n}\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'tpl:flex tpl:items-center tpl:gap-2 tpl:relative',\n      disabled && 'tpl:opacity-60 tpl:cursor-not-allowed',\n    ]\"\n  >\n    <button\n      ref=\"swatchRef\"\n      type=\"button\"\n      :disabled=\"disabled\"\n      :aria-label=\"t.colorPicker.pickColor\"\n      :aria-expanded=\"open\"\n      :class=\"[\n        'tpl:shrink-0 tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-0.5 tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]',\n        disabled ? 'tpl:cursor-not-allowed' : 'tpl:cursor-pointer',\n        open\n          ? 'tpl:border-[var(--tpl-primary)] tpl:shadow-[var(--tpl-ring)]'\n          : !disabled && 'hover:tpl:border-[var(--tpl-text-dim)]',\n        'tpl:size-10',\n      ]\"\n      @click=\"!disabled && (open = !open)\"\n    >\n      <span\n        class=\"tpl:block tpl:size-full tpl:rounded-[calc(var(--tpl-radius-sm)-2px)]\"\n        :class=\"{ 'tpl-color-swatch-empty': isUnset }\"\n        :style=\"isUnset ? undefined : { backgroundColor: modelValue }\"\n      />\n    </button>\n    <div v-if=\"!swatchOnly\" class=\"tpl:relative tpl:flex-1\">\n      <input\n        type=\"text\"\n        :class=\"[colorTextClass, 'tpl:w-full']\"\n        :style=\"showClear ? { paddingRight: '2.25rem' } : undefined\"\n        :value=\"modelValue\"\n        :placeholder=\"placeholder || t.colorPicker.notSet\"\n        :disabled=\"disabled\"\n        :aria-label=\"t.colorPicker.hexValue\"\n        @input=\"onTextInput\"\n      />\n      <button\n        v-if=\"showClear\"\n        type=\"button\"\n        :aria-label=\"t.colorPicker.clear\"\n        :title=\"t.colorPicker.clear\"\n        class=\"tpl:absolute tpl:right-2 tpl:top-1/2 tpl:flex tpl:size-6 tpl:-translate-y-1/2 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:text-[var(--tpl-text-dim)] tpl:transition-colors tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)] hover:tpl:bg-[var(--tpl-bg-hover)] hover:tpl:text-[var(--tpl-text)]\"\n        @click=\"clear\"\n      >\n        <X :size=\"14\" :stroke-width=\"1.5\" />\n      </button>\n    </div>\n    <Transition\n      enter-active-class=\"tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]\"\n      enter-from-class=\"tpl:opacity-0 tpl:scale-95 tpl:translate-y-1\"\n      enter-to-class=\"tpl:opacity-100 tpl:scale-100 tpl:translate-y-0\"\n      leave-active-class=\"tpl:transition-all tpl:duration-[80ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]\"\n      leave-from-class=\"tpl:opacity-100 tpl:scale-100 tpl:translate-y-0\"\n      leave-to-class=\"tpl:opacity-0 tpl:scale-95 tpl:translate-y-1\"\n    >\n      <div\n        v-if=\"open\"\n        ref=\"popoverRef\"\n        class=\"tpl:absolute tpl:left-0 tpl:top-full tpl:z-50 tpl:mt-2 tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)] tpl:p-3 tpl:shadow-lg\"\n      >\n        <hex-color-picker\n          :color=\"seed\"\n          :aria-label=\"t.colorPicker.pickColor\"\n          @color-changed=\"onPickerChange\"\n          @pointerdown=\"onPickerPointerDown\"\n          @pointerup=\"onPickerPointerUp\"\n          @keydown.escape=\"open = false\"\n        />\n      </div>\n    </Transition>\n  </div>\n</template>\n\n<style>\nhex-color-picker {\n  --hcp-width: 200px;\n}\n\nhex-color-picker::part(hue) {\n  border-radius: var(--tpl-radius-sm, 7px);\n}\n\nhex-color-picker::part(saturation) {\n  border-radius: var(--tpl-radius-sm, 7px) var(--tpl-radius-sm, 7px) 0 0;\n}\n\n/* Unset swatch: paper with a single thin diagonal slash = \"no color set\".\n   A neutral non-color signal — never Signal Amber (intent) or Danger. */\n.tpl-color-swatch-empty {\n  background-color: var(--tpl-bg);\n  background-image: linear-gradient(\n    to top right,\n    transparent calc(50% - 0.75px),\n    var(--tpl-text-dim) calc(50% - 0.75px),\n    var(--tpl-text-dim) calc(50% + 0.75px),\n    transparent calc(50% + 0.75px)\n  );\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { Component } from \"vue\";\nimport { computed } from \"vue\";\n\nexport interface PillOption {\n  value: string;\n  label: string;\n  icon?: Component;\n}\n\nconst props = defineProps<{\n  options: PillOption[];\n  modelValue: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nconst selectedIndex = computed(() =>\n  props.options.findIndex((o) => o.value === props.modelValue),\n);\n\nconst pillOffset = computed(\n  () => `translateX(${Math.max(selectedIndex.value, 0) * 100}%)`,\n);\n</script>\n\n<template>\n  <div\n    role=\"radiogroup\"\n    class=\"tpl:relative tpl:grid tpl:rounded-[var(--tpl-radius-sm)] tpl:p-1\"\n    :style=\"{\n      gridTemplateColumns: `repeat(${options.length}, 1fr)`,\n      backgroundColor: 'var(--tpl-bg-hover)',\n    }\"\n  >\n    <!-- Sliding pill — hidden when modelValue matches no option,\n         otherwise it would silently sit on the first option and create\n         a visual mismatch with aria-checked. -->\n    <div\n      v-if=\"selectedIndex >= 0\"\n      class=\"tpl:absolute tpl:inset-y-1 tpl:rounded-[var(--tpl-radius-sm)]\"\n      :style=\"{\n        left: '4px',\n        width: `calc((100% - 8px) / ${options.length})`,\n        transform: pillOffset,\n        backgroundColor: 'var(--tpl-bg)',\n        boxShadow: 'var(--tpl-shadow)',\n        transition: 'transform 120ms cubic-bezier(0.16, 1, 0.3, 1)',\n      }\"\n    ></div>\n\n    <button\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      role=\"radio\"\n      :aria-checked=\"modelValue === option.value\"\n      :aria-label=\"option.label\"\n      class=\"tpl:relative tpl:z-10 tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:bg-transparent tpl:px-2.5 tpl:py-[5px] tpl:text-xs tpl:font-medium\"\n      :style=\"{\n        color:\n          modelValue === option.value\n            ? 'var(--tpl-primary)'\n            : 'var(--tpl-text-muted)',\n        transition: 'color 120ms cubic-bezier(0.16, 1, 0.3, 1)',\n      }\"\n      :title=\"option.label\"\n      @click=\"emit('update:modelValue', option.value)\"\n    >\n      <component\n        :is=\"option.icon\"\n        v-if=\"option.icon\"\n        :size=\"14\"\n        :stroke-width=\"2\"\n      />\n      <span v-else>{{ option.label }}</span>\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport type { Component } from \"vue\";\nimport { computed } from \"vue\";\n\nexport interface PillOption {\n  value: string;\n  label: string;\n  icon?: Component;\n}\n\nconst props = defineProps<{\n  options: PillOption[];\n  modelValue: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nconst selectedIndex = computed(() =>\n  props.options.findIndex((o) => o.value === props.modelValue),\n);\n\nconst pillOffset = computed(\n  () => `translateX(${Math.max(selectedIndex.value, 0) * 100}%)`,\n);\n</script>\n\n<template>\n  <div\n    role=\"radiogroup\"\n    class=\"tpl:relative tpl:grid tpl:rounded-[var(--tpl-radius-sm)] tpl:p-1\"\n    :style=\"{\n      gridTemplateColumns: `repeat(${options.length}, 1fr)`,\n      backgroundColor: 'var(--tpl-bg-hover)',\n    }\"\n  >\n    <!-- Sliding pill — hidden when modelValue matches no option,\n         otherwise it would silently sit on the first option and create\n         a visual mismatch with aria-checked. -->\n    <div\n      v-if=\"selectedIndex >= 0\"\n      class=\"tpl:absolute tpl:inset-y-1 tpl:rounded-[var(--tpl-radius-sm)]\"\n      :style=\"{\n        left: '4px',\n        width: `calc((100% - 8px) / ${options.length})`,\n        transform: pillOffset,\n        backgroundColor: 'var(--tpl-bg)',\n        boxShadow: 'var(--tpl-shadow)',\n        transition: 'transform 120ms cubic-bezier(0.16, 1, 0.3, 1)',\n      }\"\n    ></div>\n\n    <button\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      role=\"radio\"\n      :aria-checked=\"modelValue === option.value\"\n      :aria-label=\"option.label\"\n      class=\"tpl:relative tpl:z-10 tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:bg-transparent tpl:px-2.5 tpl:py-[5px] tpl:text-xs tpl:font-medium\"\n      :style=\"{\n        color:\n          modelValue === option.value\n            ? 'var(--tpl-primary)'\n            : 'var(--tpl-text-muted)',\n        transition: 'color 120ms cubic-bezier(0.16, 1, 0.3, 1)',\n      }\"\n      :title=\"option.label\"\n      @click=\"emit('update:modelValue', option.value)\"\n    >\n      <component\n        :is=\"option.icon\"\n        v-if=\"option.icon\"\n        :size=\"14\"\n        :stroke-width=\"2\"\n      />\n      <span v-else>{{ option.label }}</span>\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { labelClass } from \"../../constants/styleConstants\";\n\ndefineProps<{\n  label?: string;\n}>();\n</script>\n\n<template>\n  <div class=\"tpl:mb-3.5\">\n    <label v-if=\"label\" :class=\"labelClass\">{{ label }}</label>\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { labelClass } from \"../../constants/styleConstants\";\n\ndefineProps<{\n  label?: string;\n}>();\n</script>\n\n<template>\n  <div class=\"tpl:mb-3.5\">\n    <label v-if=\"label\" :class=\"labelClass\">{{ label }}</label>\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport {\n  inputGroupInputClass,\n  inputSuffixClass,\n} from \"../../constants/styleConstants\";\n\ndefineProps<{\n  modelValue: number;\n  min?: number;\n  max?: number;\n  suffix: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: number): void;\n}>();\n</script>\n\n<template>\n  <div class=\"tpl:flex tpl:items-stretch\">\n    <input\n      type=\"number\"\n      :class=\"inputGroupInputClass\"\n      :value=\"modelValue\"\n      :min=\"min\"\n      :max=\"max\"\n      @input=\"\n        emit(\n          'update:modelValue',\n          Number(($event.target as HTMLInputElement).value),\n        )\n      \"\n    />\n    <span :class=\"inputSuffixClass\">{{ suffix }}</span>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport {\n  inputGroupInputClass,\n  inputSuffixClass,\n} from \"../../constants/styleConstants\";\n\ndefineProps<{\n  modelValue: number;\n  min?: number;\n  max?: number;\n  suffix: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: number): void;\n}>();\n</script>\n\n<template>\n  <div class=\"tpl:flex tpl:items-stretch\">\n    <input\n      type=\"number\"\n      :class=\"inputGroupInputClass\"\n      :value=\"modelValue\"\n      :min=\"min\"\n      :max=\"max\"\n      @input=\"\n        emit(\n          'update:modelValue',\n          Number(($event.target as HTMLInputElement).value),\n        )\n      \"\n    />\n    <span :class=\"inputSuffixClass\">{{ suffix }}</span>\n  </div>\n</template>\n"],"x_google_ignoreList":[0,1,2,3,4,5,6,7,8,9,10,11,12],"mappings":";;;;AAGA,IAAa,KAAS,GAAQ,IAAM,GAAG,IAAM,MAClC,IAAS,IAAM,IAAM,IAAS,IAAM,IAAM,GAExC,KAAS,GAAQ,IAAS,GAAG,IAAgB,MAAI,MACnD,KAAK,MAAM,IAAO,CAAM,IAAI;ACC9B,OAAO,KAAK,KAAK;AAE1B,IAAa,KAAa,MAAQ,GAAW,EAAU,CAAG,CAAC,GAC9C,KAAa,OAClB,EAAI,OAAO,QACX,IAAM,EAAI,UAAU,CAAC,IACrB,EAAI,SAAS,IACN;CACH,GAAG,SAAS,EAAI,KAAK,EAAI,IAAI,EAAE;CAC/B,GAAG,SAAS,EAAI,KAAK,EAAI,IAAI,EAAE;CAC/B,GAAG,SAAS,EAAI,KAAK,EAAI,IAAI,EAAE;CAC/B,GAAG,EAAI,WAAW,IAAI,EAAM,SAAS,EAAI,KAAK,EAAI,IAAI,EAAE,IAAI,KAAK,CAAC,IAAI;AAC1E,IAEG;CACH,GAAG,SAAS,EAAI,UAAU,GAAG,CAAC,GAAG,EAAE;CACnC,GAAG,SAAS,EAAI,UAAU,GAAG,CAAC,GAAG,EAAE;CACnC,GAAG,SAAS,EAAI,UAAU,GAAG,CAAC,GAAG,EAAE;CACnC,GAAG,EAAI,WAAW,IAAI,EAAM,SAAS,EAAI,UAAU,GAAG,CAAC,GAAG,EAAE,IAAI,KAAK,CAAC,IAAI;AAC9E,IA2BS,KAAa,MAAS,GAAU,EAAW,CAAI,CAAC,GAChD,KAAc,EAAE,MAAG,MAAG,MAAG,WAAQ;CAC1C,IAAM,KAAO,MAAM,KAAK,IAAK;CAC7B,OAAO;EACH,GAAG,EAAM,CAAC;EACV,GAAG,EAAM,IAAK,KAAK,IAAK,MAAQ,IAAI,IAAK,OAAO,KAAM,MAAM,IAAK,MAAM,KAAO,MAAM,CAAC;EACrF,GAAG,EAAM,IAAK,CAAC;EACf,GAAG,EAAM,GAAG,CAAC;CACjB;AACJ,GASa,KAAmB,MAAS;CACrC,IAAM,EAAE,MAAG,MAAG,SAAM,EAAW,CAAI;CACnC,OAAO,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE;AACjC,GAKa,KAAc,EAAE,MAAG,MAAG,MAAG,WAAQ;CAG1C,AAFA,IAAK,IAAI,MAAO,GAChB,KAAQ,KACR,KAAQ;CACR,IAAM,IAAK,KAAK,MAAM,CAAC,GAAG,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,IAAI,KAAM,IAAI,IAAI,KAAK,KAAK,IAAI,IAAI,KAAM,IAAI,IAAS,IAAK;CACrH,OAAO;EACH,GAAG,EAAM;GAAC;GAAG;GAAG;GAAG;GAAG;GAAG;EAAC,CAAC,CAAC,KAAU,GAAG;EACzC,GAAG,EAAM;GAAC;GAAG;GAAG;GAAG;GAAG;GAAG;EAAC,CAAC,CAAC,KAAU,GAAG;EACzC,GAAG,EAAM;GAAC;GAAG;GAAG;GAAG;GAAG;GAAG;EAAC,CAAC,CAAC,KAAU,GAAG;EACzC,GAAG,EAAM,GAAG,CAAC;CACjB;AACJ,GAmCM,KAAU,MAAW;CACvB,IAAM,IAAM,EAAO,SAAS,EAAE;CAC9B,OAAO,EAAI,SAAS,IAAI,MAAM,IAAM;AACxC,GACa,MAAa,EAAE,MAAG,MAAG,MAAG,WAAQ;CACzC,IAAM,IAAW,IAAI,IAAI,EAAO,EAAM,IAAI,GAAG,CAAC,IAAI;CAClD,OAAO,MAAM,EAAO,CAAC,IAAI,EAAO,CAAC,IAAI,EAAO,CAAC,IAAI;AACrD,GACa,MAAc,EAAE,MAAG,MAAG,MAAG,WAAQ;CAC1C,IAAM,IAAM,KAAK,IAAI,GAAG,GAAG,CAAC,GACtB,IAAQ,IAAM,KAAK,IAAI,GAAG,GAAG,CAAC,GAE9B,IAAK,IACL,MAAQ,KACH,IAAI,KAAK,IACV,MAAQ,IACJ,KAAK,IAAI,KAAK,IACd,KAAK,IAAI,KAAK,IACtB;CACN,OAAO;EACH,GAAG,EAAM,MAAM,IAAK,IAAI,IAAK,IAAI,EAAG;EACpC,GAAG,EAAM,IAAO,IAAQ,IAAO,MAAM,CAAC;EACtC,GAAG,EAAO,IAAM,MAAO,GAAG;EAC1B;CACJ;AACJ,GCtJa,KAAqB,GAAO,MAAW;CAChD,IAAI,MAAU,GACV,OAAO;CACX,KAAK,IAAM,KAAQ,GAMf,IAAI,EAAM,OACN,EAAO,IACP,OAAO;CAEf,OAAO;AACX,GAIa,KAAY,GAAO,MACxB,EAAM,YAAY,MAAM,EAAO,YAAY,IACpC,KAEJ,EAAkB,EAAU,CAAK,GAAG,EAAU,CAAM,CAAC,GCvB1D,IAAQ,CAAC,GACF,KAAO,MAAS;CACzB,IAAI,IAAW,EAAM;CAMrB,OALK,MACD,IAAW,SAAS,cAAc,UAAU,GAC5C,EAAS,YAAY,GACrB,EAAM,KAAQ,IAEX;AACX,GACa,KAAQ,GAAQ,GAAM,MAAW;CAC1C,EAAO,cAAc,IAAI,YAAY,GAAM;EACvC,SAAS;EACT;CACJ,CAAC,CAAC;AACN,GCbI,IAAa,IAEX,KAAW,MAAM,aAAa,GAG9B,MAAW,MACT,KAAc,CAAC,EAAQ,CAAK,IACrB,MACX,AACI,MAAa,EAAQ,CAAK,GACvB,KAEL,KAAe,GAAQ,MAAU;CACnC,IAAM,IAAU,EAAQ,CAAK,IAAI,EAAM,QAAQ,KAAK,GAC9C,IAAO,EAAO,GAAG,sBAAsB;CAC7C,EAAK,EAAO,IAAI,QAAQ,EAAO,QAAQ;EACnC,GAAG,GAAO,EAAQ,SAAS,EAAK,OAAO,OAAO,gBAAgB,EAAK,KAAK;EACxE,GAAG,GAAO,EAAQ,SAAS,EAAK,MAAM,OAAO,gBAAgB,EAAK,MAAM;CAC5E,CAAC,CAAC;AACN,GACM,MAAW,GAAQ,MAAU;CAE/B,IAAM,IAAU,EAAM;CAElB,IAAU,MAAO,EAAO,MAAM,IAAU,MAAO,IAAU,OAG7D,EAAM,eAAe,GAErB,EAAK,EAAO,IAAI,QAAQ,EAAO,QAAQ;EACnC,GAAG,MAAY,KACT,MACA,MAAY,KACR,OACA,MAAY,KACR,MACA,MAAY,KACR,OACA,MAAY,KACR,IACA,MAAY,KACR,KACA;EAC1B,GAAG,MAAY,KACT,MACA,MAAY,KACR,OACA;CACd,GAAG,EAAI,CAAC;AACZ,GACa,IAAb,MAAoB;CAChB,YAAY,GAAM,GAAM,GAAM,GAAI;EAC9B,IAAM,IAAW,EAAI,yCAAyC,EAAK,IAAI,EAAK,cAAc,EAAK,uBAAuB;EACtH,EAAK,YAAY,EAAS,QAAQ,UAAU,EAAI,CAAC;EACjD,IAAM,IAAK,EAAK,cAAc,SAAS,EAAK,EAAE;EAM9C,AALA,EAAG,iBAAiB,aAAa,IAAI,GACrC,EAAG,iBAAiB,cAAc,IAAI,GACtC,EAAG,iBAAiB,WAAW,IAAI,GACnC,KAAK,KAAK,GACV,KAAK,KAAK,GACV,KAAK,QAAQ,CAAC,EAAG,YAAY,CAAE;CACnC;CACA,IAAI,SAAS,GAAO;EAChB,IAAM,IAAc,IAAQ,SAAS,mBAAmB,SAAS;EAEjE,AADA,EAAY,IAAa,cAAc,aAAa,IAAI,GACxD,EAAY,IAAa,aAAa,WAAW,IAAI;CACzD;CACA,YAAY,GAAO;EACf,QAAQ,EAAM,MAAd;GACI,KAAK;GACL,KAAK;IAGD,IAFA,EAAM,eAAe,GAEjB,CAAC,GAAQ,CAAK,KAAM,CAAC,KAAc,EAAM,UAAU,GACnD;IAGJ,AAFA,KAAK,GAAG,MAAM,GACd,EAAY,MAAM,CAAK,GACvB,KAAK,WAAW;IAChB;GACJ,KAAK;GACL,KAAK;IAED,AADA,EAAM,eAAe,GACrB,EAAY,MAAM,CAAK;IACvB;GACJ,KAAK;GACL,KAAK;IACD,KAAK,WAAW;IAChB;GACJ,KAAK;IACD,GAAQ,MAAM,CAAK;IACnB;EACR;CACJ;CACA,MAAM,GAAQ;EACV,EAAO,SAAS,GAAO,MAAM;GACzB,KAAK,IAAM,KAAK,GACZ,KAAK,MAAM,EAAE,CAAC,MAAM,YAAY,GAAG,EAAM,EAAE;EAEnD,CAAC;CACL;AACJ,GCnGa,IAAb,cAAyB,EAAO;CAC5B,YAAY,GAAM;EACd,MAAM,GAAM,OAAO,gEAA0D,EAAK;CACtF;CACA,OAAO,EAAE,QAAK;EAQV,AAPA,KAAK,IAAI,GACT,KAAK,MAAM,CACP;GACI,MAAM,GAAI,IAAI,MAAO,IAAI;GACzB,OAAO,EAAgB;IAAE;IAAG,GAAG;IAAK,GAAG;IAAK,GAAG;GAAE,CAAC;EACtD,CACJ,CAAC,GACD,KAAK,GAAG,aAAa,iBAAiB,GAAG,EAAM,CAAC,GAAG;CACvD;CACA,QAAQ,GAAQ,GAAK;EAEjB,OAAO,EAAE,GAAG,IAAM,EAAM,KAAK,IAAI,EAAO,IAAI,KAAK,GAAG,GAAG,IAAI,MAAM,EAAO,EAAE;CAC9E;AACJ,GClBa,IAAb,cAAgC,EAAO;CACnC,YAAY,GAAM;EACd,MAAM,GAAM,cAAc,wBAAsB,EAAI;CACxD;CACA,OAAO,GAAM;EAYT,AAXA,KAAK,OAAO,GACZ,KAAK,MAAM,CACP;GACI,KAAK,GAAG,MAAM,EAAK,EAAE;GACrB,MAAM,GAAG,EAAK,EAAE;GAChB,OAAO,EAAgB,CAAI;EAC/B,GACA,EACI,oBAAoB,EAAgB;GAAE,GAAG,EAAK;GAAG,GAAG;GAAK,GAAG;GAAK,GAAG;EAAE,CAAC,EAC3E,CACJ,CAAC,GACD,KAAK,GAAG,aAAa,kBAAkB,cAAc,EAAM,EAAK,CAAC,EAAE,gBAAgB,EAAM,EAAK,CAAC,EAAE,EAAE;CACvG;CACA,QAAQ,GAAQ,GAAK;EAEjB,OAAO;GACH,GAAG,IAAM,EAAM,KAAK,KAAK,IAAI,EAAO,IAAI,KAAK,GAAG,GAAG,IAAI,EAAO,IAAI;GAClE,GAAG,IAAM,EAAM,KAAK,KAAK,IAAI,EAAO,IAAI,KAAK,GAAG,GAAG,IAAI,KAAK,MAAM,MAAM,EAAO,IAAI,GAAG;EAC1F;CACJ;AACJ,GC5BA,IAAe,ixBCAf,IAAe,mKCAf,IAAe,+SCOT,IAAU,OAAO,MAAM,GACvB,IAAS,OAAO,OAAO,GACvB,IAAQ,OAAO,MAAM,GACrB,IAAU,OAAO,QAAQ,GACzB,IAAS,OAAO,OAAO,GAChB,IAAO,OAAO,KAAK,GACnB,IAAW,OAAO,SAAS,GAC3B,KAAb,cAAiC,YAAY;CACzC,WAAW,qBAAqB;EAC5B,OAAO,CAAC,OAAO;CACnB;CACA,KAAK,KAAQ;EACT,OAAO;GAACA;GAAKC;GAAQC;EAAa;CACtC;CACA,KAAK,KAAY;EACb,OAAO,CAAC,GAAY,CAAG;CAC3B;CACA,IAAI,QAAQ;EACR,OAAO,KAAK;CAChB;CACA,IAAI,MAAM,GAAU;EAChB,IAAI,CAAC,KAAK,EAAQ,CAAC,CAAQ,GAAG;GAC1B,IAAM,IAAU,KAAK,WAAW,OAAO,CAAQ;GAE/C,AADA,KAAK,EAAQ,CAAC,CAAO,GACrB,KAAK,KAAU;EACnB;CACJ;CACA,cAAc;EACV,MAAM;EACN,IAAM,IAAW,EAAI,UAAU,KAAK,EAAK,CAAC,KAAK,EAAE,EAAE,SAAS,GACtD,IAAO,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;EAG/C,AAFA,EAAK,YAAY,EAAS,QAAQ,UAAU,EAAI,CAAC,GACjD,EAAK,iBAAiB,QAAQ,IAAI,GAClC,KAAK,KAAU,KAAK,EAAS,CAAC,KAAK,MAAW,IAAI,EAAO,CAAI,CAAC;CAClE;CACA,oBAAoB;EAIhB,IAAI,KAAK,eAAe,OAAO,GAAG;GAC9B,IAAM,IAAQ,KAAK;GAEnB,AADA,OAAO,KAAK,OACZ,KAAK,QAAQ;EACjB,OACK,AACD,KAAK,UAAQ,KAAK,WAAW;CAErC;CACA,yBAAyB,GAAO,GAAS,GAAQ;EAC7C,IAAM,IAAQ,KAAK,WAAW,SAAS,CAAM;EAC7C,AAAK,KAAK,EAAQ,CAAC,CAAK,MACpB,KAAK,QAAQ;CAErB;CACA,YAAY,GAAO;EAEf,IAAM,IAAU,KAAK,IACf,IAAU;GAAE,GAAG;GAAS,GAAG,EAAM;EAAO;EAC9C,KAAK,EAAQ,CAAC,CAAO;EACrB,IAAI;EACJ,AAAI,CAAC,EAAkB,GAAS,CAAO,KACnC,CAAC,KAAK,EAAQ,CAAE,IAAW,KAAK,WAAW,SAAS,CAAO,CAAE,MAC7D,KAAK,KAAU,GACf,EAAK,MAAM,iBAAiB,EAAE,OAAO,EAAS,CAAC;CAEvD;CACA,CAAC,GAAS,GAAO;EACb,OAAO,KAAK,SAAS,KAAK,WAAW,MAAM,GAAO,KAAK,KAAK;CAChE;CACA,CAAC,GAAS,GAAM;EAEZ,AADA,KAAK,KAAS,GACd,KAAK,EAAO,CAAC,SAAS,MAAS,EAAK,OAAO,CAAI,CAAC;CACpD;AACJ,GC7EM,KAAa;CACf,cAAc;CACd,QAAQ;CACR,WAAW,EAAE,MAAG,MAAG,WAAQ,EAAU;EAAE;EAAG;EAAG;EAAG,GAAG;CAAE,CAAC;CACtD,OAAO;CACP,WAAW,MAAU;AACzB,GACa,KAAb,cAA6B,GAAY;CACrC,IAAI,aAAa;EACb,OAAO;CACX;AACJ;ACIA,eAAe,OAAO,oBAAoB,cAFN,GAAQ,CAC5C,CACwD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECVxD,IAAM,IAAQ,GAqBR,IAAO,GAIP,EAAE,SAAM,GAAQ,GAEhB,IAAO,EAAI,EAAK,GAChB,IAAa,EAAiB,GAC9B,IAAY,EAAiB,GAQ7B,IAAgB,EAAI,EAAK;EAE/B,GACE,SACM;GACJ,EAAK,QAAQ;EACf,GACA,EAAE,QAAQ,CAAC,CAAS,EAAE,CACxB;EAEA,IAAM,IAAU,QAAe,CAAC,EAAM,UAAU,GAG1C,IAAO,QAAe,EAAM,cAAc,EAAM,SAAS,GAGzD,IAAY,QACV,CAAC,EAAM,cAAc,CAAC,EAAM,YAAY,CAAC,EAAQ,KACzD;EAEA,SAAS,EAAe,GAAgB;GAEtC,AADA,EAAc,QAAQ,IACtB,EAAK,qBAAsB,EAAkB,OAAO,KAAK;EAC3D;EAEA,SAAS,IAA4B;GACnC,EAAc,QAAQ;EACxB;EAEA,SAAS,IAA0B;GAEjC,AAAI,CAAC,EAAc,SAAS,EAAQ,SAClC,EAAK,qBAAqB,EAAK,KAAK;EAExC;EAEA,SAAS,EAAY,GAAgB;GACnC,EAAK,qBAAsB,EAAE,OAA4B,KAAK;EAChE;EAEA,SAAS,IAAc;GACrB,EAAK,qBAAqB,EAAE;EAC9B;yBAIE,EAyEM,OAAA,EAxEH,OAAK,EAAA,CAAA,oDAAoE,EAAA,YAAQ,uCAAA,CAAA,EAAA,GAAA;GAKlF,EAqBS,UAAA;aApBH;IAAJ,KAAI;IACJ,MAAK;IACJ,UAAU,EAAA;IACV,cAAY,EAAA,CAAA,CAAC,CAAC,YAAY;IAC1B,iBAAe,EAAA;IACf,OAAK,EAAA;;KAAgO,EAAA,WAAQ,2BAAA;KAA4D,EAAA,QAAA,iEAAA,CAA6F,EAAA,YAAQ;;;IAQ9Y,SAAK,AAAA,EAAA,QAAA,MAAA,CAAG,EAAA,aAAa,EAAA,QAAI,CAAI,EAAA;OAE9B,EAIE,QAAA;IAHA,OAAK,EAAA,CAAC,wEAAsE,EAAA,0BACxC,EAAA,MAAO,CAAA,CAAA;IAC1C,OAAK,EAAE,EAAA,QAAU,KAAA,IAAS,EAAA,iBAAsB,EAAA,WAAU,CAAA;;GAGnD,EAAA,0BAAA,EAAA,GAAZ,EAqBM,OArBN,IAqBM,CApBJ,EASE,SAAA;IARA,MAAK;IACJ,OAAK,EAAA,CAAG,EAAA,EAAA,GAAc,YAAA,CAAA;IACtB,OAAK,EAAE,EAAA,QAAS,EAAA,cAAA,UAAA,IAAiC,KAAA,CAAS;IAC1D,OAAO,EAAA;IACP,aAAa,EAAA,eAAe,EAAA,CAAA,CAAC,CAAC,YAAY;IAC1C,UAAU,EAAA;IACV,cAAY,EAAA,CAAA,CAAC,CAAC,YAAY;IAC1B,SAAO;qBAGF,EAAA,SAAA,EAAA,GADR,EASS,UAAA;;IAPP,MAAK;IACJ,cAAY,EAAA,CAAA,CAAC,CAAC,YAAY;IAC1B,OAAO,EAAA,CAAA,CAAC,CAAC,YAAY;IACtB,OAAM;IACL,SAAO;OAER,EAAoC,EAAA,EAAA,GAAA;IAAhC,MAAM;IAAK,gBAAc;;GAGjC,EAsBa,GAAA;IArBX,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;IACf,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;;qBAeT,CAZE,EAAA,SAAA,EAAA,GADR,EAaM,OAAA;;cAXA;KAAJ,KAAI;KACJ,OAAM;QAEN,EAOE,oBAAA;KANC,OAAO,EAAA;KACP,cAAY,EAAA,CAAA,CAAC,CAAC,YAAY;KAC1B,gBAAe;KACf,eAAa;KACb,aAAW;KACX,WAAO,AAAA,EAAA,OAAA,GAAA,MAAS,EAAA,QAAI,IAAA,CAAA,QAAA,CAAA;;;;;;;;;;;;;;;;;;;EEtJ/B,IAAM,IAAQ,GAKR,IAAO,GAIP,IAAgB,QACpB,EAAM,QAAQ,WAAW,MAAM,EAAE,UAAU,EAAM,UAAU,CAC7D,GAEM,IAAa,QACX,cAAc,KAAK,IAAI,EAAc,OAAO,CAAC,IAAI,IAAI,GAC7D;yBAIE,EAiDM,OAAA;GAhDJ,MAAK;GACL,OAAM;GACL,OAAK,EAAA;mCAAyC,EAAA,QAAQ,OAAM;;;MASrD,EAAA,SAAa,KAAA,EAAA,GADrB,EAWO,OAAA;;GATL,OAAM;GACL,OAAK,EAAA;;kCAA+D,EAAA,QAAQ,OAAM;eAAwB,EAAA;;;;;oCAU7G,EAwBS,GAAA,MAAA,EAvBU,EAAA,UAAV,YADT,EAwBS,UAAA;GAtBN,KAAK,EAAO;GACb,MAAK;GACJ,gBAAc,EAAA,eAAe,EAAO;GACpC,cAAY,EAAO;GACpB,OAAM;GACL,OAAK,EAAA;WAA6B,EAAA,eAAe,EAAO,QAAA,uBAAA;;;GAOxD,OAAO,EAAO;GACd,UAAK,MAAE,EAAI,qBAAsB,EAAO,KAAK;MAItC,EAAO,QAAA,EAAA,GAFf,EAKE,EAJK,EAAO,IAAI,GAAA;;GAEf,MAAM;GACN,gBAAc;cAEjB,EAAsC,QAAA,IAAA,EAAtB,EAAO,KAAK,GAAA,CAAA,EAAA,GAAA,IAAA,EAAA;;;;;;yBEnEhC,EAGM,OAHN,IAGM,CAFS,EAAA,SAAA,EAAA,GAAb,EAA2D,SAAA;;GAAtC,OAAK,EAAE,EAAA,CAAA,CAAU;OAAK,EAAA,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,GAChD,EAAQ,EAAA,QAAA,SAAA,CAAA,CAAA;;;;;;;;;;;;;;;;EEEZ,IAAM,IAAO;yBAMX,EAeM,OAfN,IAeM,CAdJ,EAYE,SAAA;GAXA,MAAK;GACJ,OAAK,EAAE,EAAA,CAAA,CAAoB;GAC3B,OAAO,EAAA;GACP,KAAK,EAAA;GACL,KAAK,EAAA;GACL,SAAK,AAAA,EAAA,QAAA,MAAW,EAAA,qBAA+C,OAAQ,EAAO,OAA4B,KAAK,CAAA;oBAOlH,EAAmD,QAAA,EAA5C,OAAK,EAAE,EAAA,CAAA,CAAgB,EAAA,GAAA,EAAK,EAAA,MAAM,GAAA,CAAA,CAAA,CAAA"}