@aswin.dev/editor 0.7.0 → 0.7.1

package/dist/{NumberWithSuffix-DkXUez9t.js → NumberWithSuffix-BpUzQOJt.js}

@@ -1,36 +1,36 @@
-import { Dt as e, F as t, L as n, M as r, Mt as i, Ot as a, P as o, Q as s, S as c, V as l, _ as u, b as d, d as f, g as p, h as m, it as h, l as ee, m as g, p as _, t as v } from "./vue.runtime.esm-bundler-DpvJL-nX.js";
-import { t as y } from "./dist-B1IR0bpH.js";
-import { t as te } from "./useI18n-lb2DHDiu.js";
-import { h as b, i as x, m as S, p as C, u as ne } from "./styleConstants-fWzlIIwN.js";
+import { At as e, C as t, F as n, Ft as r, I as i, N as a, R as o, U as s, _ as c, et as l, f as u, g as d, h as f, jt as p, m, st as h, t as ee, u as g, v as _, x as v } from "./vue.runtime.esm-bundler-CjauPXjj.js";
+import { t as y } from "./dist-CivF9P8b.js";
+import { t as te } from "./useI18n-C2xQZ6K9.js";
+import { h as b, i as x, m as S, p as C, u as w } from "./styleConstants-34eUKPOZ.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 T = (e, t = 0, n = 1) => e > n ? n : e < t ? t : e, E = (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 ne = (e) => j(D(e)), D = (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 ? E(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
-}), D = (e) => ae(k(e)), ie = ({ h: e, s: t, v: n, a: r }) => {
+	a: e.length === 8 ? E(parseInt(e.substring(6, 8), 16) / 255, 2) : 1
+}), O = (e) => ae(ie(e)), re = ({ 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: E(e),
+		s: E(i > 0 && i < 200 ? t * n / 100 / (i <= 100 ? i : 200 - i) * 100 : 0),
+		l: E(i / 2),
+		a: E(r, 2)
 	};
-}, O = (e) => {
-	let { h: t, s: n, l: r } = ie(e);
+}, k = (e) => {
+	let { h: t, s: n, l: r } = re(e);
 	return `hsl(${t}, ${n}%, ${r}%)`;
-}, k = ({ h: e, s: t, v: n, a: r }) => {
+}, ie = ({ 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: E([
 			n,
 			o,
 			a,
@@ -38,7 +38,7 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 			s,
 			n
 		][c] * 255),
-		g: T([
+		g: E([
 			s,
 			n,
 			n,
@@ -46,7 +46,7 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 			a,
 			a
 		][c] * 255),
-		b: T([
+		b: E([
 			a,
 			a,
 			s,
@@ -54,27 +54,27 @@ 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: E(r, 2)
 	};
 }, A = (e) => {
 	let t = e.toString(16);
 	return t.length < 2 ? "0" + t : t;
 }, ae = ({ r: e, g: t, b: n, a: r }) => {
-	let i = r < 1 ? A(T(r * 255)) : "";
+	let i = r < 1 ? A(E(r * 255)) : "";
 	return "#" + A(e) + A(t) + A(n) + i;
-}, oe = ({ r: e, g: t, b: n, a: r }) => {
+}, j = ({ 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: E(60 * (o < 0 ? o + 6 : o)),
+		s: E(i ? a / i * 100 : 0),
+		v: E(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) => {
+}, oe = (e, t) => e.toLowerCase() === t.toLowerCase() ? !0 : M(D(e), D(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) => {
@@ -85,8 +85,8 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 }, 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)
+		x: T((n.pageX - (r.left + window.pageXOffset)) / r.width),
+		y: T((n.pageY - (r.top + window.pageYOffset)) / r.height)
 	}));
 }, B = (e, t) => {
 	let n = t.keyCode;
@@ -137,16 +137,16 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 	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", `${E(e)}`);
 	}
 	getMove(e, t) {
-		return { h: t ? w(this.h + e.x * 360, 0, 360) : 360 * e.x };
+		return { h: t ? T(this.h + e.x * 360, 0, 360) : 360 * e.x };
 	}
 }, U = class extends V {
 	constructor(e) {
@@ -156,18 +156,18 @@ 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 ${E(e.s)}%, Brightness ${E(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 ? T(this.hsva.s + e.x * 100, 0, 100) : e.x * 100,
+			v: t ? T(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 {
@@ -215,7 +215,7 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 		};
 		this[X](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[q](r = this.colorModel.fromHsva(n)) && (this[J] = r, F(this, "color-changed", { value: r }));
 	}
 	[q](e) {
 		return this.color && this.colorModel.equal(e, this.color);
@@ -225,14 +225,14 @@ var re = (e) => oe(E(e)), E = (e) => (e[0] === "#" && (e = e.substring(1)), e.le
 	}
 }, ce = {
 	defaultColor: "#000",
-	toHsva: re,
-	fromHsva: ({ h: e, s: t, v: n }) => D({
+	toHsva: ne,
+	fromHsva: ({ h: e, s: t, v: n }) => O({
 		h: e,
 		s: t,
 		v: n,
 		a: 1
 	}),
-	equal: M,
+	equal: oe,
 	fromAttr: (e) => e
 }, le = class extends se {
 	get colorModel() {
@@ -251,7 +251,7 @@ var de = [
 	"placeholder",
 	"disabled",
 	"aria-label"
-], pe = ["color", "aria-label"], me = /* @__PURE__ */ c({
+], pe = ["color", "aria-label"], me = /* @__PURE__ */ t({
 	__name: "ColorPicker",
 	props: {
 		modelValue: {},
@@ -268,13 +268,13 @@ var de = [
 	},
 	emits: ["update:modelValue"],
 	setup(t, { emit: n }) {
-		let i = t, o = n, { t: c } = te(), f = s(!1), m = s(), b = s();
-		y(m, () => {
-			f.value = !1;
+		let r = t, i = n, { t: o } = te(), u = l(!1), d = l(), b = l();
+		y(d, () => {
+			u.value = !1;
 		}, { ignore: [b] });
-		let x = _({
-			get: () => i.modelValue || "#000000",
-			set: (e) => o("update:modelValue", e)
+		let x = m({
+			get: () => r.modelValue || "#000000",
+			set: (e) => i("update:modelValue", e)
 		});
 		function S(e) {
 			x.value = e.detail.value;
@@ -282,36 +282,36 @@ var de = [
 		function C(e) {
 			x.value = e.target.value;
 		}
-		return (n, i) => (r(), u("div", { class: e(["tpl:flex tpl:gap-2 tpl:relative", t.disabled && "tpl:opacity-60 tpl:cursor-not-allowed"]) }, [
-			g("button", {
+		return (n, r) => (a(), _("div", { class: e(["tpl:flex tpl:gap-2 tpl:relative tpl:w-full tpl:min-w-0", t.disabled && "tpl:opacity-60 tpl:cursor-not-allowed"]) }, [
+			f("button", {
 				ref_key: "swatchRef",
 				ref: b,
 				type: "button",
 				disabled: t.disabled,
-				"aria-label": h(c).colorPicker.pickColor,
-				"aria-expanded": f.value,
+				"aria-label": h(o).colorPicker.pickColor,
+				"aria-expanded": u.value,
 				class: e([
 					"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)]",
 					t.disabled ? "tpl:cursor-not-allowed" : "tpl:cursor-pointer",
-					f.value ? "tpl:border-[var(--tpl-primary)] tpl:shadow-[var(--tpl-ring)]" : !t.disabled && "hover:tpl:border-[var(--tpl-text-dim)]",
+					u.value ? "tpl:border-[var(--tpl-primary)] tpl:shadow-[var(--tpl-ring)]" : !t.disabled && "hover:tpl:border-[var(--tpl-text-dim)]",
 					t.size === "large" ? "tpl:size-12" : "tpl:size-10"
 				]),
-				onClick: i[0] ||= (e) => !t.disabled && (f.value = !f.value)
-			}, [g("span", {
+				onClick: r[0] ||= (e) => !t.disabled && (u.value = !u.value)
+			}, [f("span", {
 				class: "tpl:block tpl:size-full tpl:rounded-[calc(var(--tpl-radius-sm)-2px)]",
-				style: a({ backgroundColor: x.value })
+				style: p({ backgroundColor: x.value })
 			}, null, 4)], 10, de),
-			t.swatchOnly ? p("", !0) : (r(), u("input", {
+			t.swatchOnly ? c("", !0) : (a(), _("input", {
 				key: 0,
 				type: "text",
-				class: e(h(ne)),
+				class: e(h(w)),
 				value: t.modelValue,
 				placeholder: t.placeholder,
 				disabled: t.disabled,
-				"aria-label": h(c).colorPicker.hexValue,
+				"aria-label": h(o).colorPicker.hexValue,
 				onInput: C
 			}, null, 42, fe)),
-			d(v, {
+			v(ee, {
 				"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",
 				"enter-to-class": "tpl:opacity-100 tpl:scale-100 tpl:translate-y-0",
@@ -319,17 +319,17 @@ var de = [
 				"leave-from-class": "tpl:opacity-100 tpl:scale-100 tpl:translate-y-0",
 				"leave-to-class": "tpl:opacity-0 tpl:scale-95 tpl:translate-y-1"
 			}, {
-				default: l(() => [f.value ? (r(), u("div", {
+				default: s(() => [u.value ? (a(), _("div", {
 					key: 0,
 					ref_key: "popoverRef",
-					ref: m,
+					ref: d,
 					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"
-				}, [g("hex-color-picker", {
+				}, [f("hex-color-picker", {
 					color: x.value,
-					"aria-label": h(c).colorPicker.pickColor,
+					"aria-label": h(o).colorPicker.pickColor,
 					onColorChanged: S,
-					onKeydown: i[1] ||= ee((e) => f.value = !1, ["escape"])
-				}, null, 40, pe)], 512)) : p("", !0)]),
+					onKeydown: r[1] ||= g((e) => u.value = !1, ["escape"])
+				}, null, 40, pe)], 512)) : c("", !0)]),
 				_: 1
 			})
 		], 2));
@@ -339,7 +339,7 @@ var de = [
 	"aria-label",
 	"title",
 	"onClick"
-], ge = { key: 1 }, _e = /* @__PURE__ */ c({
+], ge = { key: 1 }, _e = /* @__PURE__ */ t({
 	__name: "SlidingPillSelect",
 	props: {
 		options: {},
@@ -347,57 +347,57 @@ var de = [
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		let s = e, c = t, l = _(() => s.options.findIndex((e) => e.value === s.modelValue)), d = _(() => `translateX(${Math.max(l.value, 0) * 100}%)`);
-		return (t, s) => (r(), u("div", {
+		let i = e, s = t, l = m(() => i.options.findIndex((e) => e.value === i.modelValue)), f = m(() => `translateX(${Math.max(l.value, 0) * 100}%)`);
+		return (t, i) => (a(), _("div", {
 			role: "radiogroup",
 			class: "tpl:relative tpl:grid tpl:rounded-[var(--tpl-radius-sm)] tpl:p-1",
-			style: a({
+			style: p({
 				gridTemplateColumns: `repeat(${e.options.length}, 1fr)`,
 				backgroundColor: "var(--tpl-bg-hover)"
 			})
-		}, [l.value >= 0 ? (r(), u("div", {
+		}, [l.value >= 0 ? (a(), _("div", {
 			key: 0,
 			class: "tpl:absolute tpl:inset-y-1 tpl:rounded-[var(--tpl-radius-sm)]",
-			style: a({
+			style: p({
 				left: "4px",
 				width: `calc((100% - 8px) / ${e.options.length})`,
-				transform: d.value,
+				transform: f.value,
 				backgroundColor: "var(--tpl-bg)",
 				boxShadow: "var(--tpl-shadow)",
 				transition: "transform 120ms cubic-bezier(0.16, 1, 0.3, 1)"
 			})
-		}, null, 4)) : p("", !0), (r(!0), u(f, null, o(e.options, (t) => (r(), u("button", {
+		}, null, 4)) : c("", !0), (a(!0), _(u, null, n(e.options, (t) => (a(), _("button", {
 			key: t.value,
 			role: "radio",
 			"aria-checked": e.modelValue === t.value,
 			"aria-label": t.label,
 			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",
-			style: a({
+			style: p({
 				color: e.modelValue === t.value ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
 				transition: "color 120ms cubic-bezier(0.16, 1, 0.3, 1)"
 			}),
 			title: t.label,
-			onClick: (e) => c("update:modelValue", t.value)
-		}, [t.icon ? (r(), m(n(t.icon), {
+			onClick: (e) => s("update:modelValue", t.value)
+		}, [t.icon ? (a(), d(o(t.icon), {
 			key: 0,
 			size: 14,
 			"stroke-width": 2
-		})) : (r(), u("span", ge, i(t.label), 1))], 12, he))), 128))], 4));
+		})) : (a(), _("span", ge, r(t.label), 1))], 12, he))), 128))], 4));
 	}
-}), ve = { class: "tpl:mb-3.5" }, ye = /* @__PURE__ */ c({
+}), ve = { class: "tpl:mb-3.5" }, ye = /* @__PURE__ */ t({
 	__name: "FieldRow",
 	props: { label: {} },
-	setup(n) {
-		return (a, o) => (r(), u("div", ve, [n.label ? (r(), u("label", {
+	setup(t) {
+		return (n, o) => (a(), _("div", ve, [t.label ? (a(), _("label", {
 			key: 0,
 			class: e(h(b))
-		}, i(n.label), 3)) : p("", !0), t(a.$slots, "default")]));
+		}, r(t.label), 3)) : c("", !0), i(n.$slots, "default")]));
 	}
 }), be = { class: "tpl:flex tpl:items-stretch" }, xe = [
 	"value",
 	"min",
 	"max"
-], Se = /* @__PURE__ */ c({
+], Se = /* @__PURE__ */ t({
 	__name: "NumberWithSuffix",
 	props: {
 		modelValue: {},
@@ -407,15 +407,15 @@ var de = [
 	},
 	emits: ["update:modelValue"],
 	setup(t, { emit: n }) {
-		let a = n;
-		return (n, o) => (r(), u("div", be, [g("input", {
+		let i = n;
+		return (n, o) => (a(), _("div", be, [f("input", {
 			type: "number",
 			class: e(h(C)),
 			value: t.modelValue,
 			min: t.min,
 			max: t.max,
-			onInput: o[0] ||= (e) => a("update:modelValue", Number(e.target.value))
-		}, null, 42, xe), g("span", { class: e(h(S)) }, i(t.suffix), 3)]));
+			onInput: o[0] ||= (e) => i("update:modelValue", Number(e.target.value))
+		}, null, 42, xe), f("span", { class: e(h(S)) }, r(t.suffix), 3)]));
 	}
 });
 //#endregion