@hankchen/canvas-editor-vue 0.7.0 → 0.8.0

package/dist/{property-panel-DJQJzioT.js → property-panel-BkfqRva4.js}

@@ -169,6 +169,38 @@ var Te = "当前层内容未绘制，padding 不影响预览", H = {
 		}
 	]
 }, Ee = {
+	title: "文本",
+	fields: [
+		{
+			key: ["text"],
+			label: "内容",
+			control: "textarea",
+			data: !0
+		},
+		{
+			key: ["font"],
+			label: "字体",
+			control: "font"
+		},
+		{
+			key: ["fontSize"],
+			label: "字号",
+			control: "number",
+			integer: !0,
+			min: 1
+		},
+		{
+			key: ["fontColor"],
+			label: "字色",
+			control: "color"
+		},
+		{
+			key: ["autowrap"],
+			label: "自动换行",
+			control: "boolean"
+		}
+	]
+}, De = "cover", Oe = "contain", ke = {
 	ImageLayer: [
 		H,
 		U,
@@ -181,6 +213,15 @@ var Te = "当前层内容未绘制，padding 不影响预览", H = {
 				control: "imageSrc",
 				data: !0,
 				resource: !0
+			}, {
+				key: ["fit"],
+				label: "适配",
+				control: "select",
+				domain: [De, Oe],
+				optionLabels: {
+					[De]: "铺满裁切",
+					[Oe]: "完整显示"
+				}
 			}]
 		}
 	],
@@ -188,39 +229,7 @@ var Te = "当前层内容未绘制，padding 不影响预览", H = {
 		H,
 		U,
 		W,
-		{
-			title: "文本",
-			fields: [
-				{
-					key: ["text"],
-					label: "内容",
-					control: "textarea",
-					data: !0
-				},
-				{
-					key: ["font"],
-					label: "字体",
-					control: "font"
-				},
-				{
-					key: ["fontSize"],
-					label: "字号",
-					control: "number",
-					integer: !0,
-					min: 1
-				},
-				{
-					key: ["fontColor"],
-					label: "字色",
-					control: "color"
-				},
-				{
-					key: ["autowrap"],
-					label: "自动换行",
-					control: "boolean"
-				}
-			]
-		}
+		Ee
 	],
 	QrCodeLayer: [
 		H,
@@ -276,15 +285,15 @@ var Te = "当前层内容未绘制，padding 不影响预览", H = {
 		}]
 	}]
 };
-function De(e) {
-	return Ee[e] ?? [];
+function Ae(e) {
+	return ke[e] ?? [];
 }
-function Oe(e) {
+function je(e) {
 	if (e[e.length - 1] === "content") return h(e) ? "templateContent" : "content";
 	let t = e[e.length - 2];
 	return t === "rows" ? "row" : t === "cells" ? "cell" : "root";
 }
-var ke = {
+var Me = {
 	root: [],
 	cell: [],
 	row: ["shape.width", "shape.autoWidth"],
@@ -299,9 +308,9 @@ var ke = {
 function G(e, t) {
 	return [...e.key, ...t.key];
 }
-function Ae(e, t) {
-	let n = new Set(ke[Oe(e)]), r = [];
-	for (let e of De(t.type)) {
+function K(e, t) {
+	let n = new Set(Me[je(e)]), r = [];
+	for (let e of Ae(t.type)) {
 		let i = [];
 		for (let r of e.fields) {
 			if (r.items) {
@@ -321,7 +330,7 @@ function Ae(e, t) {
 	}
 	return r;
 }
-var je = [{
+var Ne = [{
 	title: "画布",
 	fields: [{
 		key: ["width"],
@@ -349,16 +358,22 @@ var je = [{
 		control: "imageSrc"
 	}]
 }];
-function Me(e) {
+function Pe(e) {
 	return e === null ? null : e.background === null ? {
 		...e,
-		background: K
+		background: Fe
 	} : e;
 }
-var K = {
+var Fe = {
 	color: null,
 	image: null
 };
+function Ie(e) {
+	return e.type === "ImageLayer" && e.fit === void 0 ? {
+		...e,
+		fit: "cover"
+	} : e;
+}
 function q(e, t) {
 	let n = e;
 	for (let e = 0; e < t.length; e += 1) {
@@ -372,14 +387,14 @@ function q(e, t) {
 }
 //#endregion
 //#region src/property-panel/fields/AlignField.vue?vue&type=script&setup=true&lang.ts
-var Ne = ["aria-label"], Pe = [
+var Le = ["aria-label"], Re = [
 	"aria-pressed",
 	"title",
 	"onClick"
-], Fe = {
+], ze = {
 	key: 1,
 	class: "truncate px-1 text-[10px] leading-none"
-}, Ie = /* @__PURE__ */ j({
+}, Be = /* @__PURE__ */ j({
 	__name: "AlignField",
 	props: {
 		field: {},
@@ -441,28 +456,28 @@ var Ne = ["aria-label"], Pe = [
 		}, [t.icon ? (P(), E(g, {
 			key: 0,
 			icon: t.icon
-		}, null, 8, ["icon"])) : (P(), O("span", Fe, R(t.value), 1))], 10, Pe))), 128))], 8, Ne));
+		}, null, 8, ["icon"])) : (P(), O("span", ze, R(t.value), 1))], 10, Re))), 128))], 8, Le));
 	}
-}), Le = { class: "block" }, Re = ["aria-expanded", "title"], ze = { class: "cn-prop-field__label shrink-0 select-none truncate text-[11px] leading-none text-cn-muted" }, Be = { class: "flex shrink-0 items-center gap-1.5" }, Ve = {
+}), Ve = { class: "block" }, He = ["aria-expanded", "title"], Ue = { class: "cn-prop-field__label shrink-0 select-none truncate text-[11px] leading-none text-cn-muted" }, We = { class: "flex shrink-0 items-center gap-1.5" }, Ge = {
 	viewBox: "0 0 24 24",
 	class: "size-3.5",
 	"aria-hidden": "true"
-}, He = [
+}, Ke = [
 	"cx",
 	"cy",
 	"r"
-], Ue = {
+], qe = {
 	key: 0,
 	class: "mt-2 flex justify-end"
-}, We = {
+}, Je = {
 	class: "cn-anchor grid w-[66px] shrink-0 grid-cols-3 gap-[3px]",
 	role: "group",
 	"aria-label": "九宫锚点"
-}, Ge = [
+}, Ye = [
 	"aria-pressed",
 	"title",
 	"onClick"
-], Ke = /* @__PURE__ */ j({
+], Xe = /* @__PURE__ */ j({
 	__name: "AnchorDisclosureField",
 	props: {
 		field: {},
@@ -482,31 +497,31 @@ var Ne = ["aria-label"], Pe = [
 		function s(e) {
 			r("change", e);
 		}
-		return (t, n) => (P(), O("span", Le, [k("button", {
+		return (t, n) => (P(), O("span", Ve, [k("button", {
 			type: "button",
 			class: "cn-anchor-disclosure__header flex w-full items-center justify-between gap-2",
 			"aria-expanded": e.expanded,
 			title: e.expanded ? "收起锚点" : `锚点：${e.modelValue}（点击展开调整）`,
 			onClick: n[0] ||= (e) => r("toggle")
-		}, [k("span", ze, R(e.field.label), 1), k("span", Be, [(P(), O("svg", Ve, [(P(!0), O(w, null, I(z(a), (e) => (P(), O("circle", {
+		}, [k("span", Ue, R(e.field.label), 1), k("span", We, [(P(), O("svg", Ge, [(P(!0), O(w, null, I(z(a), (e) => (P(), O("circle", {
 			key: e.index,
 			cx: e.cx,
 			cy: e.cy,
 			r: e.index === o.value ? 3.2 : 2.2,
 			class: N(e.index === o.value ? "fill-cn-accent" : "fill-cn-muted/35")
-		}, null, 10, He))), 128))])), A(g, {
+		}, null, 10, Ke))), 128))])), A(g, {
 			icon: z(u),
 			class: N(["text-cn-muted transition-transform duration-150", { "rotate-180": e.expanded }])
-		}, null, 8, ["icon", "class"])])], 8, Re), e.expanded ? (P(), O("span", Ue, [k("span", We, [(P(!0), O(w, null, I(z(i), (t) => (P(), O("button", {
+		}, null, 8, ["icon", "class"])])], 8, He), e.expanded ? (P(), O("span", qe, [k("span", Je, [(P(!0), O(w, null, I(z(i), (t) => (P(), O("button", {
 			key: t,
 			type: "button",
 			class: N(["cn-anchor__cell relative aspect-square min-w-0 rounded-[4px] border p-0 transition-colors duration-100", t === e.modelValue ? "cn-anchor__cell--active border-cn-accent bg-cn-accent shadow-[0_0_8px_rgba(56,189,248,0.35)]" : "border-cn-field-line bg-cn-field hover:border-cn-muted/50"]),
 			"aria-pressed": t === e.modelValue,
 			title: t,
 			onClick: (e) => s(t)
-		}, null, 10, Ge))), 128))])])) : D("", !0)]));
+		}, null, 10, Ye))), 128))])])) : D("", !0)]));
 	}
-}), qe = { class: "cn-bool relative inline-flex h-4 w-7 shrink-0 cursor-pointer items-center" }, Je = ["checked"], Ye = /* @__PURE__ */ j({
+}), Ze = { class: "cn-bool relative inline-flex h-4 w-7 shrink-0 cursor-pointer items-center" }, Qe = ["checked"], $e = /* @__PURE__ */ j({
 	__name: "BooleanField",
 	props: {
 		field: {},
@@ -520,7 +535,7 @@ var Ne = ["aria-label"], Pe = [
 		}
 		return ve(() => {
 			i.value && (i.value.checked = n.modelValue);
-		}), (t, n) => (P(), O("label", qe, [
+		}), (t, n) => (P(), O("label", Ze, [
 			k("input", {
 				ref_key: "inputRef",
 				ref: i,
@@ -528,12 +543,12 @@ var Ne = ["aria-label"], Pe = [
 				type: "checkbox",
 				checked: e.modelValue,
 				onChange: a
-			}, null, 40, Je),
+			}, null, 40, Qe),
 			n[0] ||= k("span", { class: "absolute inset-0 rounded-full border border-cn-field-line bg-cn-field transition-colors duration-150 peer-checked:border-cn-accent/60 peer-checked:bg-cn-accent/30 peer-focus-visible:ring-[3px] peer-focus-visible:ring-cn-accent/20" }, null, -1),
 			n[1] ||= k("span", { class: "relative mx-0.5 size-3 rounded-full bg-cn-muted shadow-sm transition-transform duration-150 peer-checked:translate-x-3 peer-checked:bg-cn-accent" }, null, -1)
 		]));
 	}
-}), Xe = {
+}), et = {
 	1: [{
 		label: "四边",
 		rep: "top",
@@ -576,13 +591,13 @@ var Ne = ["aria-label"], Pe = [
 		}
 	]
 };
-function Ze(e) {
+function tt(e) {
 	return e === 1 ? 2 : e === 2 ? 4 : 1;
 }
-function Qe(e) {
+function nt(e) {
 	return e.top === e.bottom && e.bottom === e.left && e.left === e.right ? 1 : e.top === e.bottom && e.left === e.right ? 2 : 4;
 }
-function $e(e, t) {
+function rt(e, t) {
 	if (t === 1) {
 		let { top: t } = e;
 		return {
@@ -603,17 +618,17 @@ function $e(e, t) {
 	}
 	return e;
 }
-function et(e, t) {
+function it(e, t) {
 	return e.top === t.top && e.bottom === t.bottom && e.left === t.left && e.right === t.right;
 }
 function J(e, t) {
 	return e === null || t === null ? e === t : e.width === t.width && e.color === t.color;
 }
-function tt(e) {
+function at(e) {
 	let { top: t, bottom: n, left: r, right: i } = e;
 	return t === null && n === null && r === null && i === null || t !== null && J(t, n) && J(t, r) && J(t, i) ? 1 : J(t, n) && J(r, i) ? 2 : 4;
 }
-function nt(e, t) {
+function ot(e, t) {
 	let n = (e) => e === null ? null : { ...e };
 	if (t === 1) {
 		let t = n(e.top);
@@ -635,18 +650,18 @@ function nt(e, t) {
 	}
 	return e;
 }
-function rt(e, t) {
+function st(e, t) {
 	return J(e.top, t.top) && J(e.bottom, t.bottom) && J(e.left, t.left) && J(e.right, t.right);
 }
 //#endregion
 //#region src/property-panel/useShorthandMode.ts
-function it(e, t) {
+function ct(e, t) {
 	let n = T(() => t(e())), r = F(null), i = T(() => r.value ?? n.value);
 	B(e, () => {
 		r.value = null;
 	});
 	function a() {
-		let e = i.value, t = Ze(e);
+		let e = i.value, t = tt(e);
 		return r.value = t, {
 			from: e,
 			to: t
@@ -659,7 +674,7 @@ function it(e, t) {
 }
 //#endregion
 //#region src/property-panel/controlStyles.ts
-var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-field text-[11.5px] leading-none text-cn-fg outline-none transition-[border-color,box-shadow,background-color] duration-100 placeholder:text-cn-muted/60 hover:border-cn-muted/40 focus:border-cn-accent/70 focus:ring-[3px] focus:ring-cn-accent/15 disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:border-cn-field-line", X = `${Y} text-right font-mono tabular-nums`, at = Y, ot = "w-full flex-1 min-w-0 resize-y rounded-md border border-cn-field-line bg-cn-field px-2 py-1.5 text-[11.5px] leading-5 text-cn-fg outline-none transition-[border-color,box-shadow] duration-100 placeholder:text-cn-muted/60 hover:border-cn-muted/40 focus:border-cn-accent/70 focus:ring-[3px] focus:ring-cn-accent/15 disabled:cursor-not-allowed disabled:opacity-40", st = "size-7 shrink-0 cursor-pointer self-center rounded-md border border-cn-field-line bg-cn-field p-0.5 transition-colors hover:border-cn-muted/40 disabled:cursor-not-allowed disabled:opacity-40", ct = ["aria-label"], lt = /* @__PURE__ */ j({
+var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-field text-[11.5px] leading-none text-cn-fg outline-none transition-[border-color,box-shadow,background-color] duration-100 placeholder:text-cn-muted/60 hover:border-cn-muted/40 focus:border-cn-accent/70 focus:ring-[3px] focus:ring-cn-accent/15 disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:border-cn-field-line", X = `${Y} text-right font-mono tabular-nums`, lt = Y, ut = "w-full flex-1 min-w-0 resize-y rounded-md border border-cn-field-line bg-cn-field px-2 py-1.5 text-[11.5px] leading-5 text-cn-fg outline-none transition-[border-color,box-shadow] duration-100 placeholder:text-cn-muted/60 hover:border-cn-muted/40 focus:border-cn-accent/70 focus:ring-[3px] focus:ring-cn-accent/15 disabled:cursor-not-allowed disabled:opacity-40", dt = "size-7 shrink-0 cursor-pointer self-center rounded-md border border-cn-field-line bg-cn-field p-0.5 transition-colors hover:border-cn-muted/40 disabled:cursor-not-allowed disabled:opacity-40", ft = ["aria-label"], pt = /* @__PURE__ */ j({
 	__name: "BorderWidthInput",
 	props: {
 		value: {},
@@ -710,9 +725,9 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 			onFocus: n[1] ||= (e) => a.value = !0,
 			onBlur: u,
 			onChange: u
-		}, null, 42, ct)), [[_e, i.value]]);
+		}, null, 42, ft)), [[_e, i.value]]);
 	}
-}), ut = ["aria-label", "title"], dt = /* @__PURE__ */ j({
+}), mt = ["aria-label", "title"], ht = /* @__PURE__ */ j({
 	__name: "ShorthandModeButton",
 	props: {
 		mode: {},
@@ -743,14 +758,14 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 		}, [A(g, {
 			icon: a.value.icon,
 			size: 12
-		}, null, 8, ["icon"])], 8, ut));
+		}, null, 8, ["icon"])], 8, mt));
 	}
-}), ft = { class: "cn-border flex w-full min-w-0 items-center gap-1" }, pt = { class: "grid min-w-0 flex-1 gap-1 grid-cols-1" }, mt = { class: "w-5 shrink-0 select-none text-[10px] leading-none text-cn-muted" }, ht = [
+}), gt = { class: "cn-border flex w-full min-w-0 items-center gap-1" }, _t = { class: "grid min-w-0 flex-1 gap-1 grid-cols-1" }, vt = { class: "w-5 shrink-0 select-none text-[10px] leading-none text-cn-muted" }, yt = [
 	"value",
 	"disabled",
 	"onInput",
 	"onChange"
-], gt = "#000000", _t = /* @__PURE__ */ j({
+], bt = "#000000", xt = /* @__PURE__ */ j({
 	__name: "BorderField",
 	props: {
 		field: {},
@@ -758,12 +773,12 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 	},
 	emits: ["input", "change"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, { mode: i, cycle: a } = it(() => n.modelValue, tt), o = T(() => Xe[i.value]);
+		let n = e, r = t, { mode: i, cycle: a } = ct(() => n.modelValue, at), o = T(() => et[i.value]);
 		function s(e) {
 			return n.modelValue[e.rep]?.width ?? null;
 		}
 		function c(e) {
-			return n.modelValue[e.rep]?.color ?? gt;
+			return n.modelValue[e.rep]?.color ?? bt;
 		}
 		function l(e, t, i) {
 			let a = { ...n.modelValue };
@@ -771,7 +786,7 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 			r(i ? "change" : "input", a);
 		}
 		function u(e, t, r) {
-			let i = n.modelValue[e.rep]?.color ?? gt;
+			let i = n.modelValue[e.rep]?.color ?? bt;
 			l(e, t <= 0 ? null : {
 				width: t,
 				color: i
@@ -789,20 +804,20 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 		function f() {
 			let { from: e, to: t } = a();
 			if (t < e) {
-				let e = nt(n.modelValue, t);
-				rt(e, n.modelValue) || r("change", e);
+				let e = ot(n.modelValue, t);
+				st(e, n.modelValue) || r("change", e);
 			}
 		}
-		return (t, n) => (P(), O("span", ft, [A(dt, {
+		return (t, n) => (P(), O("span", gt, [A(ht, {
 			mode: z(i),
 			label: "边框",
 			onCycle: f
-		}, null, 8, ["mode"]), k("span", pt, [(P(!0), O(w, null, I(o.value, (t) => (P(), O("label", {
+		}, null, 8, ["mode"]), k("span", _t, [(P(!0), O(w, null, I(o.value, (t) => (P(), O("label", {
 			key: t.rep,
 			class: "flex items-center gap-1.5"
 		}, [
-			k("span", mt, R(t.label), 1),
-			A(lt, {
+			k("span", vt, R(t.label), 1),
+			A(pt, {
 				class: "cn-border__width",
 				value: s(t),
 				label: t.label,
@@ -822,17 +837,17 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 				disabled: e.modelValue[t.rep] === null,
 				onInput: (e) => d(t, e, !1),
 				onChange: (e) => d(t, e, !0)
-			}, null, 40, ht)
+			}, null, 40, yt)
 		]))), 128))])]));
 	}
-}), vt = ["value"], yt = {
+}), St = ["value"], Ct = {
 	key: 1,
 	class: "flex flex-1 items-center gap-1.5"
-}, bt = ["value"], xt = ["value"], St = [
+}, wt = ["value"], Tt = ["value"], Et = [
 	"disabled",
 	"title",
 	"data-upload-error"
-], Ct = /* @__PURE__ */ j({
+], Dt = /* @__PURE__ */ j({
 	__name: "FontField",
 	props: {
 		field: {},
@@ -895,14 +910,14 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 		}
 		return (t, n) => z(i) === null ? (P(), O("input", {
 			key: 0,
-			class: N(["cn-field", z(at)]),
+			class: N(["cn-field", z(lt)]),
 			type: "text",
 			value: e.modelValue,
 			onInput: l,
 			onCompositionstart: u,
 			onCompositionend: d,
 			onChange: f
-		}, null, 42, vt)) : (P(), O("div", yt, [
+		}, null, 42, St)) : (P(), O("div", Ct, [
 			k("select", {
 				class: N(["cn-field cn-select", z(Y)]),
 				value: e.modelValue,
@@ -910,7 +925,7 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 			}, [(P(!0), O(w, null, I(a.value, (e) => (P(), O("option", {
 				key: e.value,
 				value: e.value
-			}, R(e.label), 9, xt))), 128))], 42, bt),
+			}, R(e.label), 9, Tt))), 128))], 42, wt),
 			k("input", {
 				ref_key: "fileInput",
 				ref: h,
@@ -927,10 +942,10 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 				title: m.value ?? "上传本机字体（加入清单后可选）",
 				"data-upload-error": m.value ?? void 0,
 				onClick: g
-			}, R(p.value ? "…" : m.value ? "!" : "上传"), 9, St)) : D("", !0)
+			}, R(p.value ? "…" : m.value ? "!" : "上传"), 9, Et)) : D("", !0)
 		]));
 	}
-}), wt = { class: "cn-color flex min-w-0 flex-1 items-center gap-1.5" }, Tt = ["checked"], Et = ["value", "disabled"], Dt = ["value", "disabled"], Ot = "#000000", kt = /* @__PURE__ */ j({
+}), Ot = { class: "cn-color flex min-w-0 flex-1 items-center gap-1.5" }, kt = ["checked"], At = ["value", "disabled"], jt = ["value", "disabled"], Mt = "#000000", Nt = /* @__PURE__ */ j({
 	__name: "ColorField",
 	props: {
 		field: {},
@@ -943,7 +958,7 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 			i.value = e !== null, i.value && (a.value = o(e));
 		});
 		function o(e) {
-			return e !== null && /^#[0-9a-fA-F]{6}$/.test(e) ? e : Ot;
+			return e !== null && /^#[0-9a-fA-F]{6}$/.test(e) ? e : Mt;
 		}
 		function s(e) {
 			let t = e.target.checked;
@@ -970,7 +985,7 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 			}
 			a.value = o(t), r("change", t);
 		}
-		return (t, n) => (P(), O("span", wt, [
+		return (t, n) => (P(), O("span", Ot, [
 			e.field.nullable ? (P(), O("input", {
 				key: 0,
 				class: "cn-color__toggle size-3.5 shrink-0 cursor-pointer accent-cn-accent",
@@ -978,15 +993,15 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 				title: "启用颜色",
 				checked: i.value,
 				onChange: s
-			}, null, 40, Tt)) : D("", !0),
+			}, null, 40, kt)) : D("", !0),
 			k("input", {
-				class: N(["cn-color__swatch", z(st)]),
+				class: N(["cn-color__swatch", z(dt)]),
 				type: "color",
 				value: a.value,
 				disabled: !i.value,
 				onInput: c,
 				onChange: l
-			}, null, 42, Et),
+			}, null, 42, At),
 			k("input", {
 				class: N(["cn-color__text min-w-0 flex-1", z(Y)]),
 				type: "text",
@@ -994,16 +1009,27 @@ var Y = "h-7 flex-1 w-full min-w-0 rounded-md border border-cn-field-line bg-cn-
 				disabled: !i.value,
 				placeholder: "无",
 				onChange: u
-			}, null, 42, Dt)
+			}, null, 42, jt)
 		]));
 	}
 }), Z = Symbol("canvas-image-upload");
-function At() {
+function Pt() {
 	return fe(Z, null);
 }
 //#endregion
+//#region src/property-panel/fields/intrinsicSize.ts
+function Ft(e, t) {
+	let n = e, r = t;
+	for (; r !== 0;) [n, r] = [r, n % r];
+	let i = e / n, a = t / n;
+	return Math.max(i, a) <= 32 ? `${i}:${a}` : `${Math.round(e / t * 100) / 100}:1`;
+}
+function It(e, t) {
+	return !Number.isFinite(e) || !Number.isFinite(t) || e <= 0 || t <= 0 ? null : `${e}×${t} · ${Ft(e, t)}`;
+}
+//#endregion
 //#region src/property-panel/fields/TextField.vue?vue&type=script&setup=true&lang.ts
-var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
+var Lt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 	__name: "TextField",
 	props: {
 		field: {},
@@ -1033,7 +1059,7 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			o(t) || r("change", t);
 		}
 		return (t, n) => (P(), O("input", {
-			class: N(["cn-field", [z(at), a.value ? "cn-field--invalid" : ""]]),
+			class: N(["cn-field", [z(lt), a.value ? "cn-field--invalid" : ""]]),
 			type: "text",
 			value: e.modelValue,
 			placeholder: e.field.placeholder,
@@ -1041,9 +1067,9 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			onCompositionstart: c,
 			onCompositionend: l,
 			onChange: u
-		}, null, 42, jt));
+		}, null, 42, Lt));
 	}
-}), Mt = /* @__PURE__ */ j({
+}), Rt = /* @__PURE__ */ j({
 	__name: "ResourceValueField",
 	props: {
 		field: {},
@@ -1090,17 +1116,20 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			"disabled"
 		]));
 	}
-}), Nt = {
+}), zt = {
 	key: 0,
 	class: "flex flex-col gap-1.5"
-}, Pt = [
+}, Bt = [
 	"disabled",
 	"title",
 	"data-upload-error"
-], Ft = ["src"], It = {
+], Vt = ["src"], Ht = {
 	key: 2,
 	class: "relative"
-}, Lt = { class: "flex items-center gap-1.5" }, Rt = /* @__PURE__ */ j({
+}, Ut = { class: "flex items-center gap-1.5" }, Wt = {
+	key: 0,
+	class: "cn-imagesrc__intrinsic text-[11px] leading-4 text-cn-muted"
+}, Gt = /* @__PURE__ */ j({
 	__name: "ImageSrcField",
 	props: {
 		field: {},
@@ -1112,11 +1141,21 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 	},
 	emits: ["input", "change"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, i = At(), a = T(() => i !== null && i.canUpload && n.dataMode !== "expression"), o = T(() => typeof n.modelValue == "string" && n.modelValue !== ""), s = T(() => n.resourceStatus === "pending" ? "装载中" : n.resourceStatus === "failed" ? "失败" : null), c = F(!1), l = F(null), u = F(null);
-		function d() {
+		let n = e, r = t, i = Pt(), a = T(() => i !== null && i.canUpload && n.dataMode !== "expression"), o = T(() => typeof n.modelValue == "string" && n.modelValue !== ""), s = T(() => n.resourceStatus === "pending" ? "装载中" : n.resourceStatus === "failed" ? "失败" : null), c = F(!1), l = F(null), u = F(null), d = F(null), f = T(() => d.value === null ? null : It(d.value.width, d.value.height));
+		function p(e) {
+			let t = e.target;
+			d.value = t.naturalWidth > 0 && t.naturalHeight > 0 ? {
+				width: t.naturalWidth,
+				height: t.naturalHeight
+			} : null;
+		}
+		B(() => n.modelValue, () => {
+			d.value = null;
+		});
+		function m() {
 			l.value = null, u.value?.click();
 		}
-		async function f(e) {
+		async function h(e) {
 			let t = e.target, n = t.files?.[0];
 			if (t.value = "", i !== null && n && !c.value) {
 				c.value = !0;
@@ -1130,42 +1169,44 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 				}
 			}
 		}
-		return (t, n) => a.value ? (P(), O("div", Nt, [
+		return (t, n) => a.value ? (P(), O("div", zt, [
 			k("button", {
 				type: "button",
 				class: "cn-imagesrc__thumb relative flex h-16 w-full items-center justify-center overflow-hidden rounded-md border border-dashed border-cn-field-line bg-cn-field/40 text-[11px] leading-none text-cn-muted transition-colors duration-100 hover:border-cn-muted/40 disabled:cursor-not-allowed disabled:opacity-40",
 				disabled: c.value,
 				title: l.value ?? (o.value ? "点击替换图片" : "点击上传图片"),
 				"data-upload-error": l.value ?? void 0,
-				onClick: d
+				onClick: m
 			}, [
 				o.value ? (P(), O("img", {
 					key: 0,
 					src: e.modelValue ?? void 0,
 					class: "absolute inset-0 size-full object-cover",
-					alt: ""
-				}, null, 8, Ft)) : D("", !0),
+					alt: "",
+					onLoad: p,
+					onError: n[0] ||= (e) => d.value = null
+				}, null, 40, Vt)) : D("", !0),
 				s.value ? (P(), O("span", {
 					key: 1,
 					class: N(["cn-imagesrc__status absolute right-1 top-1 rounded bg-cn-bg-elevated/90 px-1 py-0.5 text-[10px] leading-none", e.resourceStatus === "failed" ? "text-red-400" : "text-cn-muted"])
 				}, R(s.value), 3)) : D("", !0),
-				o.value ? D("", !0) : (P(), O("span", It, R(c.value ? "…" : l.value ? "!" : "点击上传图片"), 1))
-			], 8, Pt),
+				o.value ? D("", !0) : (P(), O("span", Ht, R(c.value ? "…" : l.value ? "!" : "点击上传图片"), 1))
+			], 8, Bt),
 			k("input", {
 				ref_key: "fileInput",
 				ref: u,
 				type: "file",
 				class: "hidden",
 				accept: "image/*",
-				onChange: f
+				onChange: h
 			}, null, 544),
-			k("div", Lt, [A(Q, {
+			k("div", Ut, [A(Q, {
 				class: "flex-1",
 				field: e.field,
 				"model-value": e.modelValue ?? "",
 				"aria-label": e.field.label,
-				onInput: n[0] ||= (e) => r("input", e),
-				onChange: n[1] ||= (e) => r("change", e)
+				onInput: n[1] ||= (e) => r("input", e),
+				onChange: n[2] ||= (e) => r("change", e)
 			}, null, 8, [
 				"field",
 				"model-value",
@@ -1175,17 +1216,18 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 				type: "button",
 				class: "cn-imagesrc__clear h-7 shrink-0 rounded-md border border-cn-field-line bg-cn-field px-2 text-[11px] leading-none text-cn-fg transition-colors duration-100 hover:border-cn-muted/40",
 				title: "清除图片（资源地址置空）",
-				onClick: n[2] ||= (e) => r("change", "")
-			}, "清除")) : D("", !0)])
-		])) : e.dataMode === "expression" ? (P(), E(Mt, {
+				onClick: n[3] ||= (e) => r("change", "")
+			}, "清除")) : D("", !0)]),
+			f.value ? (P(), O("span", Wt, "源图 " + R(f.value), 1)) : D("", !0)
+		])) : e.dataMode === "expression" ? (P(), E(Rt, {
 			key: 1,
 			field: e.field,
 			"model-value": e.modelValue,
 			"data-mode": "expression",
 			source: e.source ?? null,
 			disabled: e.disabled,
-			onInput: n[3] ||= (e) => r("input", e),
-			onChange: n[4] ||= (e) => r("change", e)
+			onInput: n[4] ||= (e) => r("input", e),
+			onChange: n[5] ||= (e) => r("change", e)
 		}, null, 8, [
 			"field",
 			"model-value",
@@ -1196,15 +1238,15 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			field: e.field,
 			"model-value": e.modelValue ?? "",
 			"aria-label": e.field.label,
-			onInput: n[5] ||= (e) => r("input", e),
-			onChange: n[6] ||= (e) => r("change", e)
+			onInput: n[6] ||= (e) => r("input", e),
+			onChange: n[7] ||= (e) => r("change", e)
 		}, null, 8, [
 			"field",
 			"model-value",
 			"aria-label"
 		]));
 	}
-}), zt = [
+}), Kt = [
 	"aria-label",
 	"min",
 	"max",
@@ -1257,9 +1299,9 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			onFocus: n[1] ||= (e) => a.value = !0,
 			onBlur: l,
 			onChange: l
-		}, null, 42, zt)), [[_e, i.value]]);
+		}, null, 42, Kt)), [[_e, i.value]]);
 	}
-}), Bt = { class: "cn-padding flex w-full min-w-0 items-center gap-1.5" }, Vt = { class: "w-5 shrink-0 select-none text-[10px] leading-none text-cn-muted" }, Ht = /* @__PURE__ */ j({
+}), qt = { class: "cn-padding flex w-full min-w-0 items-center gap-1.5" }, Jt = { class: "w-5 shrink-0 select-none text-[10px] leading-none text-cn-muted" }, Yt = /* @__PURE__ */ j({
 	__name: "PaddingField",
 	props: {
 		field: {},
@@ -1267,7 +1309,7 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 	},
 	emits: ["input", "change"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, { mode: i, cycle: a } = it(() => n.modelValue, Qe), o = T(() => Xe[i.value]);
+		let n = e, r = t, { mode: i, cycle: a } = ct(() => n.modelValue, nt), o = T(() => et[i.value]);
 		function s(e) {
 			return {
 				key: ["padding", e.rep],
@@ -1283,18 +1325,18 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 		function l() {
 			let { from: e, to: t } = a();
 			if (t < e) {
-				let e = $e(n.modelValue, t);
-				et(e, n.modelValue) || r("change", e);
+				let e = rt(n.modelValue, t);
+				it(e, n.modelValue) || r("change", e);
 			}
 		}
-		return (t, n) => (P(), O("span", Bt, [A(dt, {
+		return (t, n) => (P(), O("span", qt, [A(ht, {
 			mode: z(i),
 			label: "内边距",
 			onCycle: l
 		}, null, 8, ["mode"]), k("span", { class: N(["grid min-w-0 flex-1 gap-1.5", z(i) === 1 ? "grid-cols-1" : "grid-cols-2"]) }, [(P(!0), O(w, null, I(o.value, (t) => (P(), O("label", {
 			key: t.rep,
 			class: "flex min-w-0 items-center gap-1.5"
-		}, [k("span", Vt, R(t.label), 1), A($, {
+		}, [k("span", Jt, R(t.label), 1), A($, {
 			class: "min-w-0 flex-1",
 			field: s(t),
 			"model-value": e.modelValue[t.rep],
@@ -1307,16 +1349,16 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			"onChange"
 		])]))), 128))], 2)]));
 	}
-}), Ut = { class: "grid w-full min-w-0 grid-cols-2 gap-1" }, Wt = ["title"], Gt = { class: "w-3.5 shrink-0 select-none text-[10px] leading-none text-cn-muted" }, Kt = [
+}), Xt = { class: "grid w-full min-w-0 grid-cols-2 gap-1" }, Zt = ["title"], Qt = { class: "w-3.5 shrink-0 select-none text-[10px] leading-none text-cn-muted" }, $t = [
 	"aria-pressed",
 	"title",
 	"onClick"
-], qt = [
+], en = [
 	"aria-label",
 	"value",
 	"placeholder",
 	"title"
-], Jt = /* @__PURE__ */ j({
+], tn = /* @__PURE__ */ j({
 	__name: "PairField",
 	props: {
 		field: {},
@@ -1372,12 +1414,12 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			let t = d(e);
 			return t?.preview ? "模板子树：预览盒尺寸（随行实例变化，非文档声明值）" : t === void 0 ? `${e.label}自适应：已开启` : `${e.label}自适应：布局解析值（与画布选择框同源）`;
 		}
-		return (e, t) => (P(), O("span", Ut, [(P(!0), O(w, null, I(i.value, (e) => (P(), O("label", {
+		return (e, t) => (P(), O("span", Xt, [(P(!0), O(w, null, I(i.value, (e) => (P(), O("label", {
 			key: e.key.join("."),
 			class: "flex min-w-0 items-center gap-1",
 			title: e.auto ? void 0 : e.label
 		}, [
-			k("span", Gt, R(e.label), 1),
+			k("span", Qt, R(e.label), 1),
 			e.auto ? (P(), O("button", {
 				key: 0,
 				type: "button",
@@ -1385,7 +1427,7 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 				"aria-pressed": a(e),
 				title: p(e),
 				onClick: V((t) => l(e), ["prevent"])
-			}, "自", 10, Kt)) : D("", !0),
+			}, "自", 10, $t)) : D("", !0),
 			a(e) ? (P(), O("input", {
 				key: 2,
 				class: N(["cn-field cn-field--number min-w-0 flex-1", [z(X), d(e)?.preview ? "cn-field--preview" : ""]]),
@@ -1395,7 +1437,7 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 				value: f(e),
 				placeholder: e.auto?.placeholder ?? "",
 				title: m(e)
-			}, null, 10, qt)) : (P(), E($, {
+			}, null, 10, en)) : (P(), E($, {
 				key: 1,
 				class: "min-w-0 flex-1",
 				field: e,
@@ -1408,9 +1450,9 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 				"onInput",
 				"onChange"
 			]))
-		], 8, Wt))), 128))]));
+		], 8, Zt))), 128))]));
 	}
-}), Yt = /* @__PURE__ */ j({
+}), nn = /* @__PURE__ */ j({
 	__name: "RowsPathField",
 	props: {
 		field: {},
@@ -1439,7 +1481,7 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			"aria-label"
 		]));
 	}
-}), Xt = ["value"], Zt = ["value"], Qt = /* @__PURE__ */ j({
+}), rn = ["value"], an = ["value"], on = /* @__PURE__ */ j({
 	__name: "SelectField",
 	props: {
 		field: {},
@@ -1455,12 +1497,12 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			class: "cn-select h-7 w-full min-w-0 flex-1 cursor-pointer appearance-none rounded-md border border-cn-field-line bg-cn-field py-0 pl-2 pr-6 text-[11px] leading-none text-cn-fg outline-none transition-[border-color,box-shadow] duration-100 hover:border-cn-muted/40 focus:border-cn-accent/70 focus:ring-[3px] focus:ring-cn-accent/15 disabled:cursor-not-allowed disabled:opacity-40",
 			value: e.modelValue,
 			onChange: r
-		}, [(P(!0), O(w, null, I(e.field.domain ?? [], (e) => (P(), O("option", {
-			key: e,
-			value: e
-		}, R(e), 9, Zt))), 128))], 40, Xt));
+		}, [(P(!0), O(w, null, I(e.field.domain ?? [], (t) => (P(), O("option", {
+			key: t,
+			value: t
+		}, R(e.field.optionLabels?.[t] ?? t), 9, an))), 128))], 40, rn));
 	}
-}), $t = ["value", "disabled"], en = /* @__PURE__ */ j({
+}), sn = ["value", "disabled"], cn = /* @__PURE__ */ j({
 	__name: "TextareaField",
 	props: {
 		field: {},
@@ -1484,7 +1526,7 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			r = !1, n("change", e.target.value);
 		}
 		return (t, n) => (P(), O("textarea", {
-			class: N(["cn-field", z(ot)]),
+			class: N(["cn-field", z(ut)]),
 			rows: "3",
 			value: e.modelValue,
 			disabled: e.disabled,
@@ -1492,28 +1534,28 @@ var jt = ["value", "placeholder"], Q = /* @__PURE__ */ j({
 			onCompositionstart: a,
 			onCompositionend: o,
 			onChange: s
-		}, null, 42, $t));
+		}, null, 42, sn));
 	}
-}), tn = {
+}), ln = {
 	number: M($),
 	text: M(Q),
-	textarea: M(en),
-	color: M(kt),
-	select: M(Qt),
-	boolean: M(Ye),
-	pair: M(Jt),
-	anchor: M(Ke),
-	align: M(Ie),
-	padding: M(Ht),
-	border: M(_t),
-	font: M(Ct),
-	imageSrc: M(Rt),
-	resourceValue: M(Mt),
-	rowsPath: M(Yt)
+	textarea: M(cn),
+	color: M(Nt),
+	select: M(on),
+	boolean: M($e),
+	pair: M(tn),
+	anchor: M(Xe),
+	align: M(Be),
+	padding: M(Yt),
+	border: M(xt),
+	font: M(Dt),
+	imageSrc: M(Gt),
+	resourceValue: M(Rt),
+	rowsPath: M(nn)
 };
 //#endregion
 //#region src/property-panel/usePropertyPanel.ts
-function nn(e) {
+function un(e) {
 	let t = L(e.store.doc), n = L(e.store.ui.selection), r = L(e.store.ui.anchorExpanded), i = L(e.store.ui.dataSourceSchema), a = L(e.store.ui.resourceStatuses), o = L(e.store.ui.editing), s = e.subscribe((s) => {
 		s.scope === "doc" ? (t.value = e.store.doc, n.value = e.store.ui.selection, a.value = e.store.ui.resourceStatuses, o.value = e.store.ui.editing) : s.scope === "ui" && (s.branch === "selection" ? (n.value = e.store.ui.selection, e.store.closeMerge()) : s.branch === "anchorExpanded" ? r.value = e.store.ui.anchorExpanded : s.branch === "dataSourceSchema" ? i.value = e.store.ui.dataSourceSchema : s.branch === "resourceStatuses" ? a.value = e.store.ui.resourceStatuses : s.branch === "editing" && (o.value = e.store.ui.editing));
 	});
@@ -1523,7 +1565,7 @@ function nn(e) {
 		return e && r ? p(e, r) : null;
 	}), l = T(() => t.value), u = T(() => {
 		let e = c.value, r = n.value;
-		return e && r ? Ae(r, e) : t.value ? je : [];
+		return e && r ? K(r, e) : t.value ? Ne : [];
 	}), d = T(() => {
 		let r = n.value;
 		return r && t.value ? e.layerBoxAt(r) : null;
@@ -1582,7 +1624,7 @@ function nn(e) {
 	function ae(t, n, r) {
 		let i = t.key[1];
 		if (i !== "color" && i !== "image") return;
-		let a = l.value?.background ?? K, o = typeof n == "string" && n !== "" ? n : null, s = {
+		let a = l.value?.background ?? Fe, o = typeof n == "string" && n !== "" ? n : null, s = {
 			...a,
 			[i]: o
 		}, c = `canvas:background.${i}`;
@@ -1610,14 +1652,14 @@ function nn(e) {
 }
 //#endregion
 //#region src/property-panel/fields/ValueTypeSegmented.vue?vue&type=script&setup=true&lang.ts
-var rn = ["aria-disabled"], an = [
+var dn = ["aria-disabled"], fn = [
 	"aria-pressed",
 	"title",
 	"data-mode-static",
 	"data-mode-expression",
 	"disabled",
 	"onClick"
-], on = /* @__PURE__ */ j({
+], pn = /* @__PURE__ */ j({
 	__name: "ValueTypeSegmented",
 	props: {
 		mode: {},
@@ -1652,15 +1694,15 @@ var rn = ["aria-disabled"], an = [
 			"data-mode-expression": t.value === "expression" || void 0,
 			disabled: e.disabled,
 			onClick: V((e) => a(t.value), ["prevent"])
-		}, R(t.label), 11, an)), 64))], 10, rn));
+		}, R(t.label), 11, fn)), 64))], 10, dn));
 	}
-}), sn = ["title"], cn = {
+}), mn = ["title"], hn = {
 	key: 2,
 	class: "cn-prop-field__hint col-span-2 block text-[11px] leading-4 text-cn-muted"
-}, ln = ["title"], un = {
+}, gn = ["title"], _n = {
 	key: 4,
 	class: "cn-prop-field__hint col-span-2 block text-[11px] leading-4 text-cn-muted"
-}, dn = /* @__PURE__ */ j({
+}, vn = /* @__PURE__ */ j({
 	__name: "PropertyField",
 	props: {
 		field: {},
@@ -1680,7 +1722,7 @@ var rn = ["aria-disabled"], an = [
 		"sub-commit"
 	],
 	setup(e, { emit: t }) {
-		let n = e, r = t, i = T(() => tn[n.field.control]), a = T(() => n.dataMode === "expression"), o = T(() => n.field.control === "pair" ? "cn-prop-field block" : "cn-prop-field grid grid-cols-[60px_minmax(0,1fr)] items-center gap-x-2 gap-y-1.5"), s = T(() => n.field.data === !0 ? "col-span-2" : ""), c = T(() => n.field.data === !0 && n.field.control === "textarea"), l = T(() => n.field.control === "rowsPath"), u = T(() => n.field.resource === !0 || l.value), d = F(null), f = T(() => n.field.data === !0 && a.value && typeof n.value == "string" ? n.field.resource === !0 ? n.value === "" ? [] : x(n.value) : c.value ? ne(n.value) : [] : []), p = T(() => f.value.length === 0 ? "" : n.field.resource === !0 ? le(n.completion != null) : se(f.value)), m = T(() => (n.field.resource === !0 ? a.value : l.value) && n.completion == null && f.value.length === 0 ? C : ""), h = T(() => f.value.length > 0 || l.value && n.drifted === !0), g = T(() => n.field.control === "textarea");
+		let n = e, r = t, i = T(() => ln[n.field.control]), a = T(() => n.dataMode === "expression"), o = T(() => n.field.control === "pair" ? "cn-prop-field block" : "cn-prop-field grid grid-cols-[60px_minmax(0,1fr)] items-center gap-x-2 gap-y-1.5"), s = T(() => n.field.data === !0 ? "col-span-2" : ""), c = T(() => n.field.data === !0 && n.field.control === "textarea"), l = T(() => n.field.control === "rowsPath"), u = T(() => n.field.resource === !0 || l.value), d = F(null), f = T(() => n.field.data === !0 && a.value && typeof n.value == "string" ? n.field.resource === !0 ? n.value === "" ? [] : x(n.value) : c.value ? ne(n.value) : [] : []), p = T(() => f.value.length === 0 ? "" : n.field.resource === !0 ? le(n.completion != null) : se(f.value)), m = T(() => (n.field.resource === !0 ? a.value : l.value) && n.completion == null && f.value.length === 0 ? C : ""), h = T(() => f.value.length > 0 || l.value && n.drifted === !0), g = T(() => n.field.control === "textarea");
 		function _() {
 			let e = f.value[0], t = d.value?.$el;
 			e !== void 0 && (t instanceof HTMLTextAreaElement || t instanceof HTMLInputElement) && (t.focus(), t.setSelectionRange(e.at.start, e.at.end));
@@ -1705,8 +1747,8 @@ var rn = ["aria-disabled"], an = [
 					key: 0,
 					class: "cn-prop-field__label shrink-0 select-none truncate text-[11px] leading-none text-cn-muted",
 					title: e.field.title
-				}, R(e.field.label), 9, sn)),
-				e.field.data ? (P(), E(on, {
+				}, R(e.field.label), 9, mn)),
+				e.field.data ? (P(), E(pn, {
 					key: 1,
 					class: "justify-self-end",
 					mode: e.dataMode ?? "static",
@@ -1740,14 +1782,14 @@ var rn = ["aria-disabled"], an = [
 					"source",
 					"resource-status"
 				])),
-				e.hint ? (P(), O("span", cn, R(e.hint), 1)) : D("", !0),
+				e.hint ? (P(), O("span", hn, R(e.hint), 1)) : D("", !0),
 				p.value ? (P(), O("span", {
 					key: 3,
 					class: N(["cn-prop-field__hint cn-prop-field__hint--error col-span-2 block text-[11px] leading-4 text-cn-danger", { "cursor-pointer": g.value }]),
 					title: g.value ? "点击选中出错片段" : void 0,
 					onClick: _
-				}, R(p.value), 11, ln)) : D("", !0),
-				m.value ? (P(), O("span", un, R(m.value), 1)) : D("", !0)
+				}, R(p.value), 11, gn)) : D("", !0),
+				m.value ? (P(), O("span", _n, R(m.value), 1)) : D("", !0)
 			]),
 			_: 1
 		}, 8, ["class"])), c.value ? (P(), E(ae, {
@@ -1758,14 +1800,14 @@ var rn = ["aria-disabled"], an = [
 			onSelect: z(S)
 		}, null, 8, ["state", "onSelect"])) : D("", !0)], 64));
 	}
-}), fn = { class: "cn-props flex w-[288px] shrink-0 flex-col overflow-y-auto rounded-xl border border-cn-line bg-cn-bg text-cn-fg shadow-[0_16px_40px_-12px_rgba(2,6,23,0.55)]" }, pn = { class: "sticky top-0 z-10 border-b border-cn-line bg-cn-bg-elevated/95 px-3.5 py-2.5 backdrop-blur-sm" }, mn = { class: "flex items-center gap-2" }, hn = { class: "inline-flex items-center gap-1.5 rounded border border-cn-accent/25 bg-cn-accent-soft px-1.5 py-0.5 font-mono text-[10px] leading-4 text-cn-accent" }, gn = { class: "text-[12px] font-medium tracking-wide text-cn-fg/90" }, _n = {
+}), yn = { class: "cn-props flex w-[288px] shrink-0 flex-col overflow-y-auto rounded-xl border border-cn-line bg-cn-bg text-cn-fg shadow-[0_16px_40px_-12px_rgba(2,6,23,0.55)]" }, bn = { class: "sticky top-0 z-10 border-b border-cn-line bg-cn-bg-elevated/95 px-3.5 py-2.5 backdrop-blur-sm" }, xn = { class: "flex items-center gap-2" }, Sn = { class: "inline-flex items-center gap-1.5 rounded border border-cn-accent/25 bg-cn-accent-soft px-1.5 py-0.5 font-mono text-[10px] leading-4 text-cn-accent" }, Cn = { class: "text-[12px] font-medium tracking-wide text-cn-fg/90" }, wn = {
 	key: 0,
 	class: "mx-3.5 my-4 rounded-lg border border-dashed border-cn-line px-3 py-6 text-center text-[11px] leading-5 text-cn-muted"
-}, vn = { class: "cn-props__section-title mb-2 text-[10px] font-semibold uppercase tracking-[0.16em] text-cn-muted" }, yn = { class: "flex flex-col gap-2" }, bn = "内容编辑中：请在画布编辑框内修改，退出后此处更新", xn = /* @__PURE__ */ j({
+}, Tn = { class: "cn-props__section-title mb-2 text-[10px] font-semibold uppercase tracking-[0.16em] text-cn-muted" }, En = { class: "flex flex-col gap-2" }, Dn = "内容编辑中：请在画布编辑框内修改，退出后此处更新", On = /* @__PURE__ */ j({
 	__name: "PropertyPanel",
 	props: { editor: {} },
 	setup(e) {
-		let t = e, n = nn(t.editor);
+		let t = e, n = un(t.editor);
 		he(Z, {
 			canUpload: t.editor.canUpload,
 			uploadImage: (e) => t.editor.uploadImage(e)
@@ -1777,7 +1819,7 @@ var rn = ["aria-disabled"], an = [
 			let e = n.layer.value;
 			return e ? e.type : n.canvas.value ? "Canvas" : "—";
 		}), o = T(() => {
-			let e = n.layer.value ?? (n.selection.value ? null : Me(n.canvas.value));
+			let e = n.layer.value === null ? n.selection.value ? null : Pe(n.canvas.value) : Ie(n.layer.value);
 			if (!e) return [];
 			let t = n.selection.value?.join(".") ?? "canvas", r = n.layer.value, i = n.resourceStatuses.value, a = [];
 			for (let o of n.sections.value) {
@@ -1792,7 +1834,7 @@ var rn = ["aria-disabled"], an = [
 						value: o.value,
 						dataMode: a.data ? n.isDataMarked(a) ? "expression" : "static" : void 0,
 						locked: c,
-						hint: c ? bn : a.hint && r ? a.hint(r, i) ?? void 0 : void 0,
+						hint: c ? Dn : a.hint && r ? a.hint(r, i) ?? void 0 : void 0,
 						resourceStatus: a.control === "imageSrc" && typeof o.value == "string" && o.value !== "" ? i[o.value] : void 0,
 						drifted: a.control === "rowsPath" ? n.rowsPathDrifted.value : void 0
 					});
@@ -1820,16 +1862,16 @@ var rn = ["aria-disabled"], an = [
 		function c() {
 			n.setAnchorExpanded(!n.anchorExpanded.value);
 		}
-		return (e, t) => (P(), O("aside", fn, [
-			k("header", pn, [k("div", mn, [k("span", hn, [t[0] ||= k("i", {
+		return (e, t) => (P(), O("aside", yn, [
+			k("header", bn, [k("div", xn, [k("span", Sn, [t[0] ||= k("i", {
 				class: "size-1.5 rounded-full bg-cn-accent",
 				"aria-hidden": "true"
-			}, null, -1), de(" " + R(a.value), 1)]), k("span", gn, R(i.value ? "图层属性" : "画布属性"), 1)])]),
-			o.value.length === 0 ? (P(), O("p", _n, " 打开文档后可编辑属性 ")) : D("", !0),
+			}, null, -1), de(" " + R(a.value), 1)]), k("span", Cn, R(i.value ? "图层属性" : "画布属性"), 1)])]),
+			o.value.length === 0 ? (P(), O("p", wn, " 打开文档后可编辑属性 ")) : D("", !0),
 			(P(!0), O(w, null, I(o.value, (e) => (P(), O("section", {
 				key: e.title,
 				class: "cn-props__section border-b border-cn-line/70 px-3.5 py-3 last:border-b-0"
-			}, [k("h3", vn, R(e.title), 1), k("div", yn, [(P(!0), O(w, null, I(e.fields, (e) => (P(), O(w, { key: e.key }, [e.field.control === "anchor" ? (P(), E(Ke, {
+			}, [k("h3", Tn, R(e.title), 1), k("div", En, [(P(!0), O(w, null, I(e.fields, (e) => (P(), O(w, { key: e.key }, [e.field.control === "anchor" ? (P(), E(Xe, {
 				key: 0,
 				field: e.field,
 				"model-value": e.value,
@@ -1841,7 +1883,7 @@ var rn = ["aria-disabled"], an = [
 				"model-value",
 				"expanded",
 				"onChange"
-			])) : (P(), E(dn, {
+			])) : (P(), E(vn, {
 				key: 1,
 				field: e.field,
 				value: e.value,
@@ -1875,4 +1917,4 @@ var rn = ["aria-disabled"], an = [
 	}
 });
 //#endregion
-export { Z as a, Ee as c, Oe as d, q as f, tn as i, Ae as l, dn as n, At as o, nn as r, je as s, xn as t, De as u };
+export { Z as a, ke as c, je as d, q as f, ln as i, K as l, vn as n, Pt as o, un as r, Ne as s, On as t, Ae as u };