x-prop-tree 0.8.0 → 0.8.3

package/dist/index.js

@@ -1,13 +1,13 @@
 import { a as e, i as t, n, r, t as i } from "./vendor.kbufw3jy.js";
-import { Fragment as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, h as m, inject as h, isRef as g, mergeModels as _, mergeProps as v, normalizeStyle as y, onBeforeUnmount as b, onMounted as x, onUnmounted as S, openBlock as C, provide as w, ref as T, renderList as E, renderSlot as ee, resolveComponent as D, resolveDirective as O, toDisplayString as k, unref as A, useId as j, useModel as M, useTemplateRef as te, watch as N, watchEffect as P, withCtx as F, withDirectives as I, withKeys as ne, withModifiers as L } from "vue";
-import { getElement as re, getPropertyDefault as R, getPropertyDefaultArray as ie, getTag as ae, makeSlotId as oe, parsePercent as se, parsePixel as ce, pkgs as le } from "x-runtime-lib";
-import { useI18n as z } from "vue-i18n";
-import { eventBus as B, globalObjects as ue, injectDark as de, injectLocale as fe, openNumberDlg as pe, openPromptDlg as me, useColor as V, useSystem as H, useViewStack as U } from "x-essential-lib";
-import { globalState as he } from "x-state-lib";
-import { useDisplay as ge } from "vuetify";
-import { XBlockly as _e } from "x-block-lib";
+import { Fragment as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, h as m, inject as h, isRef as g, mergeModels as _, mergeProps as v, normalizeStyle as y, onBeforeUnmount as b, onMounted as x, onUnmounted as S, openBlock as C, provide as w, ref as T, renderList as E, renderSlot as ee, resolveComponent as D, resolveDirective as O, toDisplayString as k, unref as A, useId as j, useModel as M, useTemplateRef as te, watch as N, watchEffect as P, withCtx as F, withDirectives as I, withKeys as L, withModifiers as R } from "vue";
+import { getElement as ne, getPropertyDefault as z, getPropertyDefaultArray as B, getTag as re, isHexColor as ie, isThemeColor as ae, makeSlotId as oe, parsePercent as se, parsePixel as ce, pkgs as le, themeColors as ue } from "x-runtime-lib";
+import { useI18n as V } from "vue-i18n";
+import { eventBus as H, globalObjects as de, injectDark as fe, injectLocale as pe, openNumberDlg as me, openPromptDlg as he, useColor as U, useSystem as W, useViewStack as G } from "x-essential-lib";
+import { globalState as ge } from "x-state-lib";
+import { useDisplay as _e } from "vuetify";
+import { XBlockly as ve } from "x-block-lib";
 //#region src/utils/collapseState.ts
-function W(e, t) {
+function K(e, t) {
 	let n = e.value;
 	for (let e of t) {
 		if (!n.children[e]) return !0;
@@ -15,7 +15,7 @@ function W(e, t) {
 	}
 	return n.collapse;
 }
-function G(e, t, n) {
+function q(e, t, n) {
 	let r = e.value;
 	for (let e of t) r.children[e] || (r.children[e] = {
 		collapse: !0,
@@ -25,7 +25,7 @@ function G(e, t, n) {
 }
 //#endregion
 //#region src/utils/common.ts
-function K(e, t) {
+function J(e, t) {
 	let n = {
 		key: "",
 		name: "",
@@ -38,7 +38,7 @@ function K(e, t) {
 	}
 	return n;
 }
-function q(e, t) {
+function Y(e, t) {
 	let n = e;
 	for (let e of t) {
 		if (!n) throw Error("target must be valid");
@@ -46,42 +46,42 @@ function q(e, t) {
 	}
 	return n;
 }
-function ve(e, n, r, i, a, o) {
+function ye(e, n, r, i, a, o) {
 	if (i !== void 0 && !a) {
 		if (!(r[i] instanceof Array)) {
-			let a = ie(n);
+			let a = B(n);
 			t(a, r[i]) || (r[i] = a, o(e, r[i]));
 		}
 		return r[i];
 	} else {
 		if (!(r[n.key] instanceof Array)) {
-			let i = ie(n);
+			let i = B(n);
 			t(i, r[n.key]) || (r[n.key] = i, o(e, r[n.key]));
 		}
 		return r[n.key];
 	}
 }
-function J(e, n, r, i, a, o) {
+function X(e, n, r, i, a, o) {
 	if (i !== void 0 && !a) {
 		if (r[i] === void 0) {
-			let a = R(n);
+			let a = z(n);
 			t(a, r[i]) || (r[i] = a, o(e, r[i]));
 		}
 		return r[i];
 	} else {
 		if (r[n.key] === void 0) {
-			let i = R(n);
+			let i = z(n);
 			t(i, r[n.key]) || (r[n.key] = i, o(e, r[n.key]));
 		}
 		return r[n.key];
 	}
 }
-function Y(e, t, n, r, i, a, o) {
+function Z(e, t, n, r, i, a, o) {
 	i !== void 0 && !a ? r !== n[i] && (n[i] = r, o(e, n[i])) : r !== n[t.key] && (n[t.key] = r, o(e, n[t.key]));
 }
 //#endregion
 //#region src/utils/copyPaste.ts
-var ye = (e, t) => {
+var be = (e, t) => {
 	let n = (e, t) => {
 		if (e.ui !== t.ui || e.array !== t.array) return !1;
 		if (e.ui || t.ui) return !0;
@@ -90,17 +90,17 @@ var ye = (e, t) => {
 		return !0;
 	};
 	return n(e, t);
-}, be = [["basic", "id"], ["basic", "name"]];
-function xe(e) {
-	return be.find((n) => t(e, n));
+}, xe = [["basic", "id"], ["basic", "name"]];
+function Se(e) {
+	return xe.find((n) => t(e, n));
 }
-function X(t, n, r, i, a, o) {
-	return t = e(t), a === void 0 ? t.push(n.key) : (t.push(a), o && t.push(n.key)), xe(t) ? (i.change = !1, i.warning = !1, {
+function Ce(t, n, r, i, a, o) {
+	return t = e(t), a === void 0 ? t.push(n.key) : (t.push(a), o && t.push(n.key)), Se(t) ? (i.change = !1, i.warning = !1, {
 		change: i.change,
 		warning: i.warning
-	}) : n.ui ? n.array && i.children ? we(t, n, r, i, a, o) : Te(n, r, i, a, o) : n.array ? Se(t, n, r, i, a, o) : Ce(t, n, r, i, a, o);
+	}) : n.ui ? n.array && i.children ? Ee(t, n, r, i, a, o) : De(n, r, i, a, o) : n.array ? we(t, n, r, i, a, o) : Te(t, n, r, i, a, o);
 }
-function Se(e, n, r, i, a, o) {
+function we(e, n, r, i, a, o) {
 	if (n.ui) throw Error("execPropertyBranchArray property ui must be invalid");
 	if (!n.array) throw Error("execPropertyBranchArray property array must be valid");
 	let s;
@@ -121,16 +121,16 @@ function Se(e, n, r, i, a, o) {
 				warning: !1,
 				children: {}
 			};
-			let { change: n, warning: o } = X(e, a, s[t], r.children[a.key], t, !0);
+			let { change: n, warning: o } = Ce(e, a, s[t], r.children[a.key], t, !0);
 			!r.change && n && (r.change = n), !r.change && o && (r.warning = o), !i.change && r.change && (i.change = r.change), !i.warning && r.warning && (i.warning = r.warning);
 		}
 	}
-	return i.change ||= !t(s, ie(n)), {
+	return i.change ||= !t(s, B(n)), {
 		change: i.change,
 		warning: i.warning
 	};
 }
-function Ce(e, t, n, r, i, a) {
+function Te(e, t, n, r, i, a) {
 	if (t.ui) throw Error("execPropertyBranchScalar property ui must be invalid");
 	if (t.array) throw Error("execPropertyBranchScalar property array must be invalid");
 	let o;
@@ -145,7 +145,7 @@ function Ce(e, t, n, r, i, a) {
 			warning: !1,
 			children: {}
 		};
-		let { change: a, warning: s } = X(e, i, o, r.children[i.key], void 0, !1);
+		let { change: a, warning: s } = Ce(e, i, o, r.children[i.key], void 0, !1);
 		!r.change && a && (r.change = a), !r.warning && s && (r.warning = s);
 	}
 	return {
@@ -153,7 +153,7 @@ function Ce(e, t, n, r, i, a) {
 		warning: r.change
 	};
 }
-function we(e, n, r, i, a, o) {
+function Ee(e, n, r, i, a, o) {
 	if (!n.ui) throw Error("execPropertyLeafArray property ui must be valid");
 	if (!n.array) throw Error("execPropertyLeafArray property aray must be valid");
 	let s;
@@ -167,23 +167,23 @@ function we(e, n, r, i, a, o) {
 			warning: !1,
 			children: {}
 		};
-		let { change: r, warning: a } = X(e, n, s, i.children[t], t, !1);
+		let { change: r, warning: a } = Ce(e, n, s, i.children[t], t, !1);
 		!i.change && r && (i.change = r), !i.warning && a && (i.warning = a);
 	}
-	return i.change ||= !t(s, ie(n)), {
+	return i.change ||= !t(s, B(n)), {
 		change: i.change,
 		warning: i.warning
 	};
 }
-function Te(e, n, r, i, a) {
+function De(e, n, r, i, a) {
 	if (!e.ui) throw Error("execPropertyLeafScalar property ui must be valid");
 	let o;
-	return o = i !== void 0 && !a ? n[i] : n[e.key], r.change = !t(o, R(e)), {
+	return o = i !== void 0 && !a ? n[i] : n[e.key], r.change = !t(o, z(e)), {
 		change: r.change,
 		warning: r.warning
 	};
 }
-function Ee(e, t, n) {
+function Oe(e, t, n) {
 	if (t.length <= 0 || !n) {
 		e.value = {
 			change: !1,
@@ -203,11 +203,11 @@ function Ee(e, t, n) {
 			warning: !1,
 			children: {}
 		};
-		r.children[e.key] = t, X([], e, n, t, void 0, !1);
+		r.children[e.key] = t, Ce([], e, n, t, void 0, !1);
 	}
 	e.value = r;
 }
-function Z(e, t) {
+function Q(e, t) {
 	let n = e;
 	for (let e of t) {
 		if (!n.children[e]) return !1;
@@ -217,53 +217,41 @@ function Z(e, t) {
 }
 //#endregion
 //#region src/utils/provideInject.ts
-var De = Symbol(), Oe = Symbol(), ke = Symbol(), Ae = Symbol(), je = Symbol(), Me = Symbol(), Ne = Symbol(), Pe = Symbol(), Fe = Symbol(), Ie = Symbol(), Le = Symbol();
-function Re(e) {
-	w(De, e);
-}
-function Q() {
-	return h(De);
-}
-function ze(e) {
-	w(Oe, e);
-}
-function Be() {
-	return h(Oe);
-}
-function Ve(e) {
+var ke = Symbol(), Ae = Symbol(), je = Symbol(), Me = Symbol(), Ne = Symbol(), Pe = Symbol(), Fe = Symbol(), Ie = Symbol(), Le = Symbol(), Re = Symbol(), ze = Symbol();
+function Be(e) {
 	w(ke, e);
 }
-function He() {
+function Ve() {
 	return h(ke);
 }
-function Ue(e) {
+function He(e) {
 	w(Ae, e);
 }
-function We() {
+function Ue() {
 	return h(Ae);
 }
-function Ge(e) {
+function We(e) {
 	w(je, e);
 }
-function Ke() {
+function Ge() {
 	return h(je);
 }
-function qe(e) {
+function Ke(e) {
 	w(Me, e);
 }
-function Je() {
+function qe() {
 	return h(Me);
 }
-function Ye(e) {
+function Je(e) {
 	w(Ne, e);
 }
-function Xe() {
+function Ye() {
 	return h(Ne);
 }
-function Ze(e) {
+function Xe(e) {
 	w(Pe, e);
 }
-function $() {
+function Ze() {
 	return h(Pe);
 }
 function Qe(e) {
@@ -275,29 +263,41 @@ function $e() {
 function et(e) {
 	w(Ie, e);
 }
-function tt() {
+function $() {
 	return h(Ie);
 }
-function nt(e) {
+function tt(e) {
 	w(Le, e);
 }
-function rt() {
+function nt() {
 	return h(Le);
 }
+function rt(e) {
+	w(Re, e);
+}
+function it() {
+	return h(Re);
+}
+function at(e) {
+	w(ze, e);
+}
+function ot() {
+	return h(ze);
+}
 //#endregion
 //#region src/components/menu/index.vue
-var it = /* @__PURE__ */ p({
+var st = /* @__PURE__ */ p({
 	__name: "index",
 	setup(e) {
-		let { t } = z(), n = We(), r = Ke(), i = Xe(), c = $(), u = T(0), p = T(0), m = T([]), h = o(() => [u.value, p.value]), _ = (e) => {
-			!(m.value.length <= 0 || !Z(i.value, m.value)) && e.push({
+		let { t } = V(), n = qe(), r = Ye(), i = $e(), c = $(), u = T(0), p = T(0), m = T([]), h = o(() => [u.value, p.value]), _ = (e) => {
+			!(m.value.length <= 0 || !Q(i.value, m.value)) && e.push({
 				title: t("x-prop-tree.reset"),
 				func: () => {
-					let e = K(n.value, m.value);
+					let e = J(n.value, m.value);
 					if (e) if (e.ui) {
-						let t = q(r.value, m.value.slice(0, -1));
+						let t = Y(r.value, m.value.slice(0, -1));
 						if (!t) return;
-						t[m.value[m.value.length - 1]] = R(e), c(m.value, t[m.value[m.value.length - 1]]);
+						t[m.value[m.value.length - 1]] = z(e), c(m.value, t[m.value[m.value.length - 1]]);
 					} else if (e.array) {
 						let t = m.value[m.value.length - 1];
 						if (t === void 0) {
@@ -305,21 +305,21 @@ var it = /* @__PURE__ */ p({
 							return;
 						}
 						if (typeof t == "string") {
-							let t = q(r.value, m.value.slice(0, -1));
+							let t = Y(r.value, m.value.slice(0, -1));
 							if (!t) return;
-							t[m.value[m.value.length - 1]] = R(e), c(m.value, t[m.value[m.value.length - 1]]);
+							t[m.value[m.value.length - 1]] = z(e), c(m.value, t[m.value[m.value.length - 1]]);
 						} else {
-							let t = q(r.value, m.value);
+							let t = Y(r.value, m.value);
 							if (!t) return;
 							e.children.forEach((n) => {
-								t[n.key] = R(e), c([...m.value, n.key], t[n.key]);
+								t[n.key] = z(e), c([...m.value, n.key], t[n.key]);
 							});
 						}
 					} else {
-						let t = q(r.value, m.value);
+						let t = Y(r.value, m.value);
 						if (!t) return;
 						e.children.forEach((n) => {
-							t[n.key] = R(e), c([...m.value, n.key], t[n.key]);
+							t[n.key] = z(e), c([...m.value, n.key], t[n.key]);
 						});
 					}
 				}
@@ -328,7 +328,7 @@ var it = /* @__PURE__ */ p({
 			e.push({
 				title: t("x-prop-tree.copy"),
 				func: () => {
-					let e = K(n.value, m.value), t = q(r.value, m.value);
+					let e = J(n.value, m.value), t = Y(r.value, m.value);
 					localStorage.setItem("propTreeCopy", JSON.stringify({
 						property: e,
 						object: t
@@ -342,8 +342,8 @@ var it = /* @__PURE__ */ p({
 				try {
 					let { property: t } = JSON.parse(e);
 					if (!t) return !1;
-					let r = K(n.value, m.value);
-					return r ? ye(t, r) : !1;
+					let r = J(n.value, m.value);
+					return r ? be(t, r) : !1;
 				} catch (e) {
 					console.error(e);
 				}
@@ -355,7 +355,7 @@ var it = /* @__PURE__ */ p({
 					if (!r()) return;
 					let e = localStorage.getItem("propTreeCopy");
 					if (e) try {
-						let { object: t } = JSON.parse(e), r = K(n.value, m.value);
+						let { object: t } = JSON.parse(e), r = J(n.value, m.value);
 						console.log(t, r);
 					} catch (e) {
 						console.error(e);
@@ -365,7 +365,7 @@ var it = /* @__PURE__ */ p({
 		}, b = o(() => {
 			let e = [];
 			return _(e), v(e), y(e), e;
-		}), { open: x } = U("propTreeMenu", (e) => {
+		}), { open: x } = G("propTreeMenu", (e) => {
 			u.value = e.x, p.value = e.y, m.value = e.keys;
 		});
 		return (e, t) => {
@@ -395,7 +395,7 @@ var it = /* @__PURE__ */ p({
 			}, 8, ["modelValue", "target"]);
 		};
 	}
-}), at = { style: { pointerEvents: "none" } }, ot = /* @__PURE__ */ p({
+}), ct = { style: { pointerEvents: "none" } }, lt = /* @__PURE__ */ p({
 	__name: "index",
 	props: {
 		title: {},
@@ -417,7 +417,7 @@ var it = /* @__PURE__ */ p({
 		"delete"
 	],
 	setup(e, { emit: t }) {
-		let { backgroundColor2: n, highlightColor: r } = V(), i = t, a = T(!1), d = o(() => ({
+		let { backgroundColor2: n, highlightColor: r } = U(), i = t, a = T(!1), d = o(() => ({
 			background: a.value ? r.value : n.value,
 			height: "36px",
 			marginBottom: "1px",
@@ -433,7 +433,7 @@ var it = /* @__PURE__ */ p({
 				class: "d-flex align-center cursor-pointer",
 				style: y(d.value),
 				onClick: p,
-				onContextmenu: L(m, ["self", "prevent"]),
+				onContextmenu: R(m, ["self", "prevent"]),
 				onMouseout: n[2] ||= (e) => a.value = !1,
 				onMouseover: n[3] ||= (e) => a.value = !0
 			}, [
@@ -441,7 +441,7 @@ var it = /* @__PURE__ */ p({
 					class: "mr-1",
 					icon: e.collapse ? "mdi-chevron-right" : "mdi-chevron-down"
 				}, null, 8, ["icon"]),
-				u("span", at, k(e.title), 1),
+				u("span", ct, k(e.title), 1),
 				f(o),
 				e.hasCreate ? (C(), s(h, {
 					key: 0,
@@ -449,7 +449,7 @@ var it = /* @__PURE__ */ p({
 					density: "compact",
 					icon: "mdi-plus",
 					variant: "text",
-					onClick: n[0] ||= L((e) => i("create"), ["stop"])
+					onClick: n[0] ||= R((e) => i("create"), ["stop"])
 				})) : c("", !0),
 				e.hasDelete ? (C(), s(h, {
 					key: 1,
@@ -457,7 +457,7 @@ var it = /* @__PURE__ */ p({
 					density: "compact",
 					icon: "mdi-minus",
 					variant: "text",
-					onClick: n[1] ||= L((t) => i("delete", e.index), ["stop"])
+					onClick: n[1] ||= R((t) => i("delete", e.index), ["stop"])
 				})) : c("", !0)
 			], 36)), [[g]]);
 		};
@@ -465,14 +465,14 @@ var it = /* @__PURE__ */ p({
 });
 //#endregion
 //#region src/composables/adaptSlotList/index.ts
-function st() {
-	let e = Q(), t = Be(), n = He(), { i18n: a } = ue, o = T([]);
-	nt(o);
+function ut() {
+	let e = Ve(), t = Ue(), n = Ge(), { i18n: a } = de, o = T([]);
+	at(o);
 	let s = () => {
 		if (!e.value || !t.value || !n.value) return [];
 		let s = le[e.value];
 		if (!s) return console.assert(!1, `invalid version=${e.value}`), [];
-		let c = ae(t.value, n.value), l = [];
+		let c = re(t.value, n.value), l = [];
 		for (let e = 0; e < s.groups[c].length; e++) {
 			let t = s.groups[c][e], n = r(o, t.key);
 			l.push({
@@ -485,7 +485,7 @@ function st() {
 			});
 			let i = 0;
 			for (let e of t.items) {
-				let n = re(e);
+				let n = ne(e);
 				if (n && !n.internal && n.slots) for (let e of n.slots) {
 					let r = oe("elementSlot", n.key, e.key), o = `${a.global.t(n.name)} / ${a.global.t(e.name)}`;
 					l.push({
@@ -498,7 +498,7 @@ function st() {
 				}
 			}
 		}
-		let { activeApp: u, depends: d } = he.app;
+		let { activeApp: u, depends: d } = ge.app;
 		for (let { id: e, name: t, position: n } of u.compGroups) {
 			let i = r(o, e);
 			l.push({
@@ -547,11 +547,11 @@ function st() {
 }
 //#endregion
 //#region src/composables/compList/index.ts
-function ct() {
+function dt() {
 	let e = T([]);
-	Qe(e);
+	tt(e);
 	let t = () => {
-		let { activeApp: t, depends: n } = he.app, r = [];
+		let { activeApp: t, depends: n } = ge.app, r = [];
 		for (let { id: n, name: i, position: a } of t.compGroups) {
 			let t = e.value.find((e) => e.id === n);
 			r.push({
@@ -585,11 +585,11 @@ function ct() {
 }
 //#endregion
 //#region src/composables/slotList/index.ts
-function lt() {
+function ft() {
 	let e = T([]);
-	et(e);
+	rt(e);
 	let t = () => {
-		let { activeObject: e, activeComp: t } = he.app;
+		let { activeObject: e, activeComp: t } = ge.app;
 		if (e.type !== "comp" || !t.meta.slots) return [];
 		let n = [];
 		for (let { id: e, name: r } of t.meta.slots) n.push({
@@ -614,7 +614,7 @@ function lt() {
 }
 //#endregion
 //#region src/components/values/adaptSlotSelect/adaptSlotList/group.vue?vue&type=script&setup=true&lang.ts
-var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text-grey ml-1" }, ft = /* @__PURE__ */ p({
+var pt = { class: "text-label-large ml-1" }, mt = { class: "text-body-small text-grey ml-1" }, ht = /* @__PURE__ */ p({
 	__name: "group",
 	props: {
 		id: {},
@@ -624,7 +624,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["x-click"],
 	setup(e, { emit: t }) {
-		let { backgroundColor2: n, highlightColor: r } = V(), i = e, a = t, s = T(!1), c = o(() => ({
+		let { backgroundColor2: n, highlightColor: r } = U(), i = e, a = t, s = T(!1), c = o(() => ({
 			background: s.value ? r.value : n.value,
 			height: "30px",
 			marginTop: "1px",
@@ -643,12 +643,12 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					icon: i.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
 					size: "small"
 				}, null, 8, ["icon"]),
-				u("span", ut, k(i.title), 1),
-				u("span", dt, k(i.count), 1)
+				u("span", pt, k(i.title), 1),
+				u("span", mt, k(i.count), 1)
 			], 36)), [[r]]);
 		};
 	}
-}), pt = { class: "text-body-large ml-6" }, mt = /* @__PURE__ */ p({
+}), gt = { class: "text-body-large ml-6" }, _t = /* @__PURE__ */ p({
 	__name: "item",
 	props: {
 		id: {},
@@ -656,7 +656,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["x-click"],
 	setup(e, { emit: t }) {
-		let { backgroundColor2: n, highlightColor: r } = V(), i = t, a = T(!1), s = o(() => ({
+		let { backgroundColor2: n, highlightColor: r } = U(), i = t, a = T(!1), s = o(() => ({
 			background: a.value ? r.value : n.value,
 			height: "48px",
 			marginTop: "1px",
@@ -670,13 +670,13 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				onClick: n[0] ||= (t) => i("x-click", e.id),
 				onMouseout: n[1] ||= (e) => a.value = !1,
 				onMouseover: n[2] ||= (e) => a.value = !0
-			}, [u("span", pt, k(e.title), 1)], 36)), [[r]]);
+			}, [u("span", gt, k(e.title), 1)], 36)), [[r]]);
 		};
 	}
-}), ht = { key: 0 }, gt = {
+}), vt = { key: 0 }, yt = {
 	key: 1,
 	class: "text-body-medium text-grey ml-3"
-}, _t = /* @__PURE__ */ p({
+}, bt = /* @__PURE__ */ p({
 	__name: "index",
 	props: {
 		modelValue: {},
@@ -689,13 +689,13 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["update:modelValue", "update:open"],
 	setup(e) {
-		let { nameList: t } = H(), i = M(e, "modelValue"), o = M(e, "open"), u = rt(), d = (e) => {
+		let { nameList: t } = W(), i = M(e, "modelValue"), o = M(e, "open"), u = ot(), d = (e) => {
 			let t = r(u, e);
 			t && n(u, e, !t.collapse);
 		}, f = (e) => {
 			i.value = e, o.value = !1;
 		};
-		return (e, n) => A(u).length > 0 ? (C(), l("div", ht, [(C(!0), l(a, null, E(A(u), (e) => (C(), l(a, { key: e.id }, [e.type === 0 ? (C(), s(ft, {
+		return (e, n) => A(u).length > 0 ? (C(), l("div", vt, [(C(!0), l(a, null, E(A(u), (e) => (C(), l(a, { key: e.id }, [e.type === 0 ? (C(), s(ht, {
 			key: 0,
 			id: e.id,
 			collapse: e.collapse,
@@ -707,18 +707,18 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			"collapse",
 			"count",
 			"title"
-		])) : c("", !0), e.type === 1 && e.show ? (C(), s(mt, {
+		])) : c("", !0), e.type === 1 && e.show ? (C(), s(_t, {
 			key: 1,
 			id: e.id,
 			title: e.name,
 			onXClick: f
-		}, null, 8, ["id", "title"])) : c("", !0)], 64))), 128))])) : (C(), l("div", gt, k(A(t)([
+		}, null, 8, ["id", "title"])) : c("", !0)], 64))), 128))])) : (C(), l("div", yt, k(A(t)([
 			"x-prop-tree.no",
 			"x-prop-tree.adapt",
 			"x-prop-tree.slot"
 		])), 1));
 	}
-}), vt = { class: "text-body-large" }, yt = /* @__PURE__ */ p({
+}), xt = { class: "text-body-large" }, St = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -735,7 +735,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { t: n } = z(), i = ge(), { sysBarAvail: a, nameList: l } = H(), { backgroundColor1: p } = V(), m = M(e, "modelValue"), h = t, _ = rt(), b = o(() => {
+		let { t: n } = V(), i = _e(), { sysBarAvail: a, nameList: l } = W(), { backgroundColor1: p } = U(), m = M(e, "modelValue"), h = t, _ = ot(), b = o(() => {
 			let e = "100%";
 			return i.mdAndUp.value && (e = "400px"), {
 				background: p.value,
@@ -752,7 +752,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			if (!m.value) return n("x-runtime-lib.notSet");
 			let e = r(_, m.value);
 			return e ? e.name : n("x-runtime-lib.slotNotAvail");
-		}), { open: E } = U(`propTreeAdaptSlotSelectDlg${j()}`);
+		}), { open: E } = G(`propTreeAdaptSlotSelectDlg${j()}`);
 		return S(() => {
 			E.value = !1;
 		}), (t, n) => {
@@ -764,7 +764,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				"no-click-animation": "",
 				persistent: "",
 				transition: "scroll-x-reverse-transition",
-				onKeydown: n[7] ||= ne(L((e) => E.value = !1, ["stop", "prevent"]), ["esc"])
+				onKeydown: n[7] ||= L(R((e) => E.value = !1, ["stop", "prevent"]), ["esc"])
 			}, {
 				activator: F(({ props: t }) => [f(r, v(t, {
 					block: "",
@@ -779,12 +779,12 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					density: "compact",
 					icon: "mdi-minus",
 					variant: "text",
-					onClick: n[0] ||= L((e) => h("delete"), ["stop"])
+					onClick: n[0] ||= R((e) => h("delete"), ["stop"])
 				})) : c("", !0)]),
 				default: F(() => [u("div", {
 					class: "w-100 h-100 d-flex flex-row-reverse",
-					onClick: n[4] ||= L((e) => E.value = !1, ["self"]),
-					onContextmenu: n[5] ||= L((e) => E.value = !1, ["self", "prevent"])
+					onClick: n[4] ||= R((e) => E.value = !1, ["self"]),
+					onContextmenu: n[5] ||= R((e) => E.value = !1, ["self", "prevent"])
 				}, [u("div", {
 					class: "elevation-2",
 					style: y(b.value)
@@ -804,7 +804,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 							icon: "mdi-close",
 							variant: "text",
 							onClick: n[1] ||= (e) => E.value = !1
-						}), u("span", vt, k(A(l)([
+						}), u("span", xt, k(A(l)([
 							"x-prop-tree.select",
 							"x-prop-tree.adapt",
 							"x-prop-tree.slot"
@@ -814,7 +814,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					u("div", {
 						class: "overflow-y-auto",
 						style: y(x.value)
-					}, [f(_t, {
+					}, [f(bt, {
 						modelValue: m.value,
 						"onUpdate:modelValue": n[2] ||= (e) => m.value = e,
 						open: A(E),
@@ -825,7 +825,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			}, 8, ["modelValue"]);
 		};
 	}
-}), bt = { class: "d-flex justify-space-between align-center" }, xt = /* @__PURE__ */ p({
+}), Ct = { class: "d-flex justify-space-between align-center" }, wt = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -842,10 +842,10 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { t: n } = z(), r = M(e, "modelValue"), i = t, a = o(() => {
+		let { t: n } = V(), r = M(e, "modelValue"), i = t, a = o(() => {
 			let t = "100%";
 			return e.hasDelete && (t = "calc(100% - 37px)"), { width: t };
-		}), l = o(() => e.readonly), { open: p } = U(`propTreeColorPickerMenu${j()}`);
+		}), l = o(() => e.readonly), { open: p } = G(`propTreeColorPickerMenu${j()}`);
 		return S(() => {
 			p.value = !1;
 		}), (t, o) => {
@@ -856,7 +856,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				"close-on-content-click": !1,
 				scrim: "transparent"
 			}, {
-				activator: F(({ props: t }) => [u("div", bt, [u("div", {
+				activator: F(({ props: t }) => [u("div", Ct, [u("div", {
 					class: "flex-grow-1",
 					style: y(a.value)
 				}, [f(m, v(t, {
@@ -873,7 +873,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					density: "compact",
 					icon: "mdi-minus",
 					variant: "text",
-					onClick: o[0] ||= L((e) => i("delete"), ["stop"])
+					onClick: o[0] ||= R((e) => i("delete"), ["stop"])
 				})) : c("", !0)])]),
 				default: F(() => [f(h, {
 					modelValue: r.value,
@@ -886,7 +886,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			}, 8, ["modelValue"]);
 		};
 	}
-}), St = { class: "text-label-large ml-1" }, Ct = { class: "text-body-small text-grey ml-1" }, wt = /* @__PURE__ */ p({
+}), Tt = { class: "text-label-large ml-1" }, Et = { class: "text-body-small text-grey ml-1" }, Dt = /* @__PURE__ */ p({
 	__name: "group",
 	props: {
 		id: {},
@@ -896,7 +896,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["x-click"],
 	setup(e, { emit: t }) {
-		let { backgroundColor2: n, highlightColor: r } = V(), i = e, a = t, s = T(!1), c = o(() => ({
+		let { backgroundColor2: n, highlightColor: r } = U(), i = e, a = t, s = T(!1), c = o(() => ({
 			background: s.value ? r.value : n.value,
 			height: "30px",
 			marginTop: "1px",
@@ -915,12 +915,12 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					icon: i.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
 					size: "small"
 				}, null, 8, ["icon"]),
-				u("span", St, k(i.title), 1),
-				u("span", Ct, k(i.count), 1)
+				u("span", Tt, k(i.title), 1),
+				u("span", Et, k(i.count), 1)
 			], 36)), [[r]]);
 		};
 	}
-}), Tt = { class: "text-body-large ml-6" }, Et = /* @__PURE__ */ p({
+}), Ot = { class: "text-body-large ml-6" }, kt = /* @__PURE__ */ p({
 	__name: "item",
 	props: {
 		id: {},
@@ -928,7 +928,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["x-click"],
 	setup(e, { emit: t }) {
-		let { backgroundColor2: n, highlightColor: r } = V(), i = e, a = t, s = T(!1), c = o(() => ({
+		let { backgroundColor2: n, highlightColor: r } = U(), i = e, a = t, s = T(!1), c = o(() => ({
 			background: s.value ? r.value : n.value,
 			height: "48px",
 			marginTop: "1px",
@@ -942,13 +942,13 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				onClick: t[0] ||= (e) => a("x-click", i.id),
 				onMouseout: t[1] ||= (e) => s.value = !1,
 				onMouseover: t[2] ||= (e) => s.value = !0
-			}, [u("span", Tt, k(i.title), 1)], 36)), [[n]]);
+			}, [u("span", Ot, k(i.title), 1)], 36)), [[n]]);
 		};
 	}
-}), Dt = { key: 0 }, Ot = {
+}), At = { key: 0 }, jt = {
 	key: 1,
 	class: "text-body-medium text-grey ml-3"
-}, kt = /* @__PURE__ */ p({
+}, Mt = /* @__PURE__ */ p({
 	__name: "index",
 	props: {
 		modelValue: {},
@@ -961,13 +961,13 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["update:modelValue", "update:open"],
 	setup(e) {
-		let { nameList: t } = H(), i = M(e, "modelValue"), o = M(e, "open"), u = $e(), d = (e) => {
+		let { nameList: t } = W(), i = M(e, "modelValue"), o = M(e, "open"), u = nt(), d = (e) => {
 			let t = r(u, e);
 			t && n(u, e, !t.collapse);
 		}, f = (e) => {
-			i.value = e, o.value = !1, B.emit("refreshDepends");
+			i.value = e, o.value = !1, H.emit("refreshDepends");
 		};
-		return (e, n) => A(u).length > 0 ? (C(), l("div", Dt, [(C(!0), l(a, null, E(A(u), (e) => (C(), l(a, { key: e.id }, [e.type === 0 ? (C(), s(wt, {
+		return (e, n) => A(u).length > 0 ? (C(), l("div", At, [(C(!0), l(a, null, E(A(u), (e) => (C(), l(a, { key: e.id }, [e.type === 0 ? (C(), s(Dt, {
 			key: 0,
 			id: e.id,
 			collapse: e.collapse,
@@ -979,14 +979,14 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			"collapse",
 			"count",
 			"title"
-		])) : c("", !0), e.type === 1 && e.show ? (C(), s(Et, {
+		])) : c("", !0), e.type === 1 && e.show ? (C(), s(kt, {
 			key: 1,
 			id: e.id,
 			title: e.name,
 			onXClick: f
-		}, null, 8, ["id", "title"])) : c("", !0)], 64))), 128))])) : (C(), l("div", Ot, k(A(t)(["x-prop-tree.no", "x-prop-tree.comp"])), 1));
+		}, null, 8, ["id", "title"])) : c("", !0)], 64))), 128))])) : (C(), l("div", jt, k(A(t)(["x-prop-tree.no", "x-prop-tree.comp"])), 1));
 	}
-}), At = { class: "text-body-large" }, jt = /* @__PURE__ */ p({
+}), Nt = { class: "text-body-large" }, Pt = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1003,7 +1003,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { t: n } = z(), i = ge(), { sysBarAvail: a, nameList: l } = H(), { backgroundColor1: p } = V(), m = M(e, "modelValue"), h = t, _ = $e(), b = o(() => {
+		let { t: n } = V(), i = _e(), { sysBarAvail: a, nameList: l } = W(), { backgroundColor1: p } = U(), m = M(e, "modelValue"), h = t, _ = nt(), b = o(() => {
 			let e = "100%";
 			return i.mdAndUp.value && (e = "400px"), {
 				background: p.value,
@@ -1020,7 +1020,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			if (!m.value) return n("x-runtime-lib.notSet");
 			let e = r(_, m.value);
 			return e ? e.name : n("x-runtime-lib.compNotAvail");
-		}), { open: E } = U(`propTreeCompSelectDlg${j()}`);
+		}), { open: E } = G(`propTreeCompSelectDlg${j()}`);
 		return S(() => {
 			E.value = !1;
 		}), (t, n) => {
@@ -1032,7 +1032,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				"no-click-animation": "",
 				persistent: "",
 				transition: "scroll-x-reverse-transition",
-				onKeydown: n[7] ||= ne(L((e) => E.value = !1, ["stop", "prevent"]), ["esc"])
+				onKeydown: n[7] ||= L(R((e) => E.value = !1, ["stop", "prevent"]), ["esc"])
 			}, {
 				activator: F(({ props: t }) => [f(r, v(t, {
 					block: "",
@@ -1047,12 +1047,12 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					density: "compact",
 					icon: "mdi-minus",
 					variant: "text",
-					onClick: n[0] ||= L((e) => h("delete"), ["stop"])
+					onClick: n[0] ||= R((e) => h("delete"), ["stop"])
 				})) : c("", !0)]),
 				default: F(() => [u("div", {
 					class: "w-100 h-100 d-flex flex-row-reverse",
-					onClick: n[4] ||= L((e) => E.value = !1, ["self"]),
-					onContextmenu: n[5] ||= L((e) => E.value = !1, ["self", "prevent"])
+					onClick: n[4] ||= R((e) => E.value = !1, ["self"]),
+					onContextmenu: n[5] ||= R((e) => E.value = !1, ["self", "prevent"])
 				}, [u("div", {
 					class: "elevation-2",
 					style: y(b.value)
@@ -1072,13 +1072,13 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 							icon: "mdi-close",
 							variant: "text",
 							onClick: n[1] ||= (e) => E.value = !1
-						}), u("span", At, k(A(l)(["x-prop-tree.select", "x-prop-tree.comp"])), 1)]),
+						}), u("span", Nt, k(A(l)(["x-prop-tree.select", "x-prop-tree.comp"])), 1)]),
 						_: 1
 					}),
 					u("div", {
 						class: "overflow-y-auto",
 						style: y(x.value)
-					}, [f(kt, {
+					}, [f(Mt, {
 						modelValue: m.value,
 						"onUpdate:modelValue": n[2] ||= (e) => m.value = e,
 						open: A(E),
@@ -1089,7 +1089,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			}, 8, ["modelValue"]);
 		};
 	}
-}), Mt = /* @__PURE__ */ p({
+}), Ft = /* @__PURE__ */ p({
 	__name: "editor",
 	props: {
 		modelValue: { required: !0 },
@@ -1108,14 +1108,14 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 		"update:scale"
 	],
 	setup(e, { expose: t }) {
-		let n = M(e, "modelValue"), r = M(e, "lock"), i = M(e, "scale"), a = de(), o = fe(), c = Q(), l = te("target"), u = () => {
+		let n = M(e, "modelValue"), r = M(e, "lock"), i = M(e, "scale"), a = fe(), o = pe(), c = Ve(), l = te("target"), u = () => {
 			let e = JSON.parse(n.value);
 			l.value?.load(e);
 		};
 		return t({ save: () => {
 			let e = l.value.save();
 			n.value = JSON.stringify(e, null, 2);
-		} }), (e, t) => (C(), s(A(_e), {
+		} }), (e, t) => (C(), s(A(ve), {
 			ref_key: "target",
 			ref: l,
 			lock: r.value,
@@ -1135,7 +1135,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			"version"
 		]));
 	}
-}), Nt = { class: "text-body-large" }, Pt = /* @__PURE__ */ p({
+}), It = { class: "text-body-large" }, Lt = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1152,14 +1152,14 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { t: n } = z(), { sysBarAvail: r } = H(), { backgroundColor0: i, backgroundColor1: a, backgroundColor2: l } = V(), p = M(e, "modelValue"), m = t, h = T(!1), _ = T(1), b = o(() => {
+		let { t: n } = V(), { sysBarAvail: r } = W(), { backgroundColor0: i, backgroundColor1: a, backgroundColor2: l } = U(), p = M(e, "modelValue"), m = t, h = T(!1), _ = T(1), b = o(() => {
 			let e = 48;
 			return r.value && (e += 24), {
 				position: "relative",
 				background: a.value,
 				height: `calc(100% - ${e}px)`
 			};
-		}), x = o(() => n("x-prop-tree.jsonEditor")), { open: w } = U(`propTreejsonEditorDlg${j()}`);
+		}), x = o(() => n("x-prop-tree.jsonEditor")), { open: w } = G(`propTreejsonEditorDlg${j()}`);
 		S(() => {
 			w.value = !1;
 		});
@@ -1176,7 +1176,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				"no-click-animation": "",
 				persistent: "",
 				transition: "dialog-bottom-transition",
-				onKeydown: n[6] ||= ne(L((e) => w.value = !1, ["stop", "prevent"]), ["esc"])
+				onKeydown: n[6] ||= L(R((e) => w.value = !1, ["stop", "prevent"]), ["esc"])
 			}, {
 				activator: F(({ props: t }) => [f(a, v(t, {
 					block: "",
@@ -1191,7 +1191,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					density: "compact",
 					icon: "mdi-minus",
 					variant: "text",
-					onClick: n[0] ||= L((e) => m("delete"), ["stop"])
+					onClick: n[0] ||= R((e) => m("delete"), ["stop"])
 				})) : c("", !0)]),
 				default: F(() => [f(o, {
 					color: A(i),
@@ -1216,12 +1216,12 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 									variant: "text",
 									onClick: n[1] ||= (e) => w.value = !1
 								}),
-								u("span", Nt, k(x.value), 1),
+								u("span", It, k(x.value), 1),
 								f(S)
 							]),
 							_: 1
 						}, 8, ["color"]),
-						u("div", { style: y(b.value) }, [f(Mt, {
+						u("div", { style: y(b.value) }, [f(Ft, {
 							ref_key: "editor",
 							ref: E,
 							modelValue: p.value,
@@ -1242,7 +1242,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			}, 8, ["modelValue"]);
 		};
 	}
-}), Ft = { class: "d-flex justify-space-between align-center my-2" }, It = { class: "flex-grow-1" }, Lt = /* @__PURE__ */ p({
+}), Rt = { class: "d-flex justify-space-between align-center my-2" }, zt = { class: "flex-grow-1" }, Bt = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1260,23 +1260,26 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { t: n } = z(), { isMobile: r } = H(), i = M(e, "modelValue"), a = t, d = Q(), p = o(() => le[d.value].types[e.types]), m = T(0), h = o(() => {
+		let { t: n } = V(), { isMobile: r } = W(), i = M(e, "modelValue"), a = t, d = Ve(), p = o(() => le[d.value].types[e.types]), m = T(""), h = o(() => {
 			let e = [];
-			return p.value?.forEach(({ title: t }, r) => {
-				e.push({
-					title: n(t),
-					value: r
-				});
-			}), e;
+			for (let { value: t, title: r } of p.value) e.push({
+				value: t,
+				title: n(r)
+			});
+			return e;
 		});
 		P(() => {
-			p.value?.some((e, t) => e.validator(i.value) ? (m.value = t, !0) : !1);
+			for (let { value: e, validator: t } of p.value) if (t(i.value)) {
+				m.value = e;
+				return;
+			}
+			m.value = "";
 		});
-		let g = o(() => p.value?.[m.value]), _ = () => {
+		let g = o(() => p.value.find((e) => e.value === m.value)), _ = () => {
 			i.value = g.value?.default;
 		}, v = T(0), y = async (e) => {
-			if (!e || !r() || g.value.value !== "pixel" && g.value.value !== "percent") return;
-			let t = await pe({
+			if (!e || !r() || !g.value || g.value.trait !== "pixel" && g.value.trait !== "percent") return;
+			let t = await me({
 				title: "",
 				value: v.value,
 				precision: g.value.precision,
@@ -1286,66 +1289,107 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			});
 			t !== void 0 && (v.value = t);
 		};
-		return P(() => {
-			g.value?.value === "pixel" ? v.value = ce(i.value) : g.value?.value === "percent" && (v.value = se(i.value));
+		P(() => {
+			g.value?.trait === "pixel" ? v.value = ce(i.value) : g.value?.trait === "percent" && (v.value = se(i.value));
 		}), N(v, (e) => {
-			g.value?.value === "pixel" ? i.value = e + "px" : g.value?.value === "percent" && (i.value = e + "%");
+			g.value?.trait === "pixel" ? i.value = e + "px" : g.value?.trait === "percent" && (i.value = e + "%");
+		});
+		let b = T("#ff00ff");
+		P(() => {
+			g.value?.trait === "hexColor" && ie(i.value) && (b.value = i.value);
+		}), N(b, (e) => {
+			g.value?.trait === "hexColor" && (i.value = e);
+		});
+		let x = T("primary"), S = o(() => {
+			let e = [];
+			if (g.value?.trait === "themeColor") for (let { value: t, title: r } of ue) e.push({
+				value: t,
+				title: n(r)
+			});
+			return e;
+		});
+		return P(() => {
+			g.value?.trait === "themeColor" && ae(i.value) && (x.value = i.value);
+		}), N(x, (e) => {
+			g.value?.trait === "themeColor" && (i.value = e);
 		}), (t, n) => {
 			let r = D("v-select"), i = D("v-number-input"), o = D("v-btn"), d = O("ripple");
-			return C(), l("div", Ft, [u("div", It, [I(f(r, {
-				modelValue: m.value,
-				"onUpdate:modelValue": [n[0] ||= (e) => m.value = e, _],
-				density: "compact",
-				"hide-details": "",
-				items: h.value,
-				readonly: e.readonly,
-				"single-line": ""
-			}, null, 8, [
-				"modelValue",
-				"items",
-				"readonly"
-			]), [[
-				d,
-				void 0,
-				void 0,
-				{ stop: !0 }
-			]]), g.value?.value === "pixel" || g.value?.value === "percent" ? I((C(), s(i, {
-				key: 0,
-				modelValue: v.value,
-				"onUpdate:modelValue": n[1] ||= (e) => v.value = e,
-				"control-variant": "stacked",
-				density: "compact",
-				"hide-details": "",
-				max: g.value.max,
-				min: g.value.min,
-				precision: g.value.precision,
-				readonly: e.readonly,
-				"single-line": "",
-				step: g.value.step,
-				"onUpdate:focused": y
-			}, null, 8, [
-				"modelValue",
-				"max",
-				"min",
-				"precision",
-				"readonly",
-				"step"
-			])), [[
-				d,
-				void 0,
-				void 0,
-				{ stop: !0 }
-			]]) : c("", !0)]), e.hasDelete ? (C(), s(o, {
+			return C(), l("div", Rt, [u("div", zt, [
+				I(f(r, {
+					modelValue: m.value,
+					"onUpdate:modelValue": [n[0] ||= (e) => m.value = e, _],
+					density: "compact",
+					"hide-details": "",
+					items: h.value,
+					readonly: e.readonly,
+					"single-line": ""
+				}, null, 8, [
+					"modelValue",
+					"items",
+					"readonly"
+				]), [[
+					d,
+					void 0,
+					void 0,
+					{ stop: !0 }
+				]]),
+				g.value?.trait === "pixel" || g.value?.trait === "percent" ? I((C(), s(i, {
+					key: 0,
+					modelValue: v.value,
+					"onUpdate:modelValue": n[1] ||= (e) => v.value = e,
+					"control-variant": "stacked",
+					density: "compact",
+					"hide-details": "",
+					max: g.value.max,
+					min: g.value.min,
+					precision: g.value.precision,
+					readonly: e.readonly,
+					"single-line": "",
+					step: g.value.step,
+					"onUpdate:focused": y
+				}, null, 8, [
+					"modelValue",
+					"max",
+					"min",
+					"precision",
+					"readonly",
+					"step"
+				])), [[
+					d,
+					void 0,
+					void 0,
+					{ stop: !0 }
+				]]) : c("", !0),
+				g.value?.trait === "hexColor" ? (C(), s(wt, {
+					key: 1,
+					modelValue: b.value,
+					"onUpdate:modelValue": n[2] ||= (e) => b.value = e
+				}, null, 8, ["modelValue"])) : c("", !0),
+				g.value?.trait === "themeColor" ? I((C(), s(r, {
+					key: 2,
+					modelValue: x.value,
+					"onUpdate:modelValue": n[3] ||= (e) => x.value = e,
+					density: "compact",
+					"hide-details": "",
+					items: S.value,
+					"single-line": ""
+				}, null, 8, ["modelValue", "items"])), [[
+					d,
+					void 0,
+					void 0,
+					{ stop: !0 }
+				]]) : c("", !0)
+			]), e.hasDelete ? (C(), s(o, {
 				key: 0,
 				class: "mx-2",
 				density: "compact",
 				icon: "mdi-minus",
 				variant: "text",
-				onClick: n[2] ||= L((e) => a("delete"), ["stop"])
+				onClick: n[4] ||= R((e) => a("delete"), ["stop"])
 			})) : c("", !0)]);
 		};
 	}
-}), Rt = { class: "d-flex justify-space-between align-center" }, zt = /* @__PURE__ */ p({
+}), Vt = { class: "d-flex justify-space-between align-center" }, Ht = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1366,9 +1410,9 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { isMobile: n } = H(), r = M(e, "modelValue"), i = t, a = async (t) => {
+		let { isMobile: n } = W(), r = M(e, "modelValue"), i = t, a = async (t) => {
 			if (!t || e.readonly || !n()) return;
-			let i = await pe({
+			let i = await me({
 				title: "",
 				value: r.value,
 				precision: e.precision,
@@ -1380,7 +1424,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 		};
 		return (t, n) => {
 			let o = D("v-number-input"), u = D("v-btn"), d = O("ripple");
-			return C(), l("div", Rt, [I(f(o, {
+			return C(), l("div", Vt, [I(f(o, {
 				modelValue: r.value,
 				"onUpdate:modelValue": n[0] ||= (e) => r.value = e,
 				"control-variant": "stacked",
@@ -1411,11 +1455,11 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				density: "compact",
 				icon: "mdi-minus",
 				variant: "text",
-				onClick: n[1] ||= L((e) => i("delete"), ["stop"])
+				onClick: n[1] ||= R((e) => i("delete"), ["stop"])
 			})) : c("", !0)]);
 		};
 	}
-}), Bt = { class: "d-flex justify-space-between align-center" }, Vt = /* @__PURE__ */ p({
+}), Ut = { class: "d-flex justify-space-between align-center" }, Wt = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1433,7 +1477,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { t: n } = z(), r = M(e, "modelValue"), i = t, a = Q(), u = o(() => {
+		let { t: n } = V(), r = M(e, "modelValue"), i = t, a = Ve(), u = o(() => {
 			let t = [];
 			return le[a.value].items[e.items].forEach(({ title: e, value: r }) => {
 				t.push({
@@ -1444,7 +1488,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 		});
 		return (t, n) => {
 			let a = D("v-select"), o = D("v-btn"), d = O("ripple");
-			return C(), l("div", Bt, [I(f(a, {
+			return C(), l("div", Ut, [I(f(a, {
 				modelValue: r.value,
 				"onUpdate:modelValue": n[0] ||= (e) => r.value = e,
 				density: "compact",
@@ -1467,11 +1511,11 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				density: "compact",
 				icon: "mdi-minus",
 				variant: "text",
-				onClick: n[1] ||= L((e) => i("delete"), ["stop"])
+				onClick: n[1] ||= R((e) => i("delete"), ["stop"])
 			})) : c("", !0)]);
 		};
 	}
-}), Ht = { class: "text-body-large ml-6" }, Ut = /* @__PURE__ */ p({
+}), Gt = { class: "text-body-large ml-6" }, Kt = /* @__PURE__ */ p({
 	__name: "item",
 	props: {
 		id: {},
@@ -1479,7 +1523,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["x-click"],
 	setup(e, { emit: t }) {
-		let { backgroundColor2: n, highlightColor: r } = V(), i = t, a = T(!1), s = o(() => ({
+		let { backgroundColor2: n, highlightColor: r } = U(), i = t, a = T(!1), s = o(() => ({
 			background: a.value ? r.value : n.value,
 			height: "48px",
 			marginTop: "1px",
@@ -1493,13 +1537,13 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				onClick: n[0] ||= (t) => i("x-click", e.id),
 				onMouseout: n[1] ||= (e) => a.value = !1,
 				onMouseover: n[2] ||= (e) => a.value = !0
-			}, [u("span", Ht, k(e.title), 1)], 36)), [[r]]);
+			}, [u("span", Gt, k(e.title), 1)], 36)), [[r]]);
 		};
 	}
-}), Wt = { key: 0 }, Gt = {
+}), qt = { key: 0 }, Jt = {
 	key: 1,
 	class: "text-body-medium text-grey ml-3"
-}, Kt = /* @__PURE__ */ p({
+}, Yt = /* @__PURE__ */ p({
 	__name: "index",
 	props: {
 		modelValue: {},
@@ -1512,17 +1556,17 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	},
 	emits: ["update:modelValue", "update:open"],
 	setup(e) {
-		let { nameList: t } = H(), n = M(e, "modelValue"), r = M(e, "open"), i = tt(), o = (e) => {
+		let { nameList: t } = W(), n = M(e, "modelValue"), r = M(e, "open"), i = it(), o = (e) => {
 			n.value = e, r.value = !1;
 		};
-		return (e, n) => A(i).length > 0 ? (C(), l("div", Wt, [(C(!0), l(a, null, E(A(i), (e) => (C(), s(Ut, {
+		return (e, n) => A(i).length > 0 ? (C(), l("div", qt, [(C(!0), l(a, null, E(A(i), (e) => (C(), s(Kt, {
 			key: e.id,
 			id: e.id,
 			title: e.name,
 			onXClick: o
-		}, null, 8, ["id", "title"]))), 128))])) : (C(), l("div", Gt, k(A(t)(["x-prop-tree.no", "x-prop-tree.slot"])), 1));
+		}, null, 8, ["id", "title"]))), 128))])) : (C(), l("div", Jt, k(A(t)(["x-prop-tree.no", "x-prop-tree.slot"])), 1));
 	}
-}), qt = { class: "text-body-large" }, Jt = /* @__PURE__ */ p({
+}), Xt = { class: "text-body-large" }, Zt = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1539,7 +1583,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { t: n } = z(), r = ge(), { sysBarAvail: i, nameList: a } = H(), { backgroundColor1: l } = V(), p = M(e, "modelValue"), m = t, h = tt(), _ = o(() => {
+		let { t: n } = V(), r = _e(), { sysBarAvail: i, nameList: a } = W(), { backgroundColor1: l } = U(), p = M(e, "modelValue"), m = t, h = it(), _ = o(() => {
 			let e = "100%";
 			return r.mdAndUp.value && (e = "400px"), {
 				background: l.value,
@@ -1556,7 +1600,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			if (!p.value) return n("x-runtime-lib.notSet");
 			let e = h.value.find((e) => e.id === p.value);
 			return e ? e.name : n("x-runtime-lib.slotNotAvail");
-		}), { open: T } = U(`propTreeSlotSelectDlg${j()}`);
+		}), { open: T } = G(`propTreeSlotSelectDlg${j()}`);
 		return S(() => {
 			T.value = !1;
 		}), (t, n) => {
@@ -1568,7 +1612,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				"no-click-animation": "",
 				persistent: "",
 				transition: "scroll-x-reverse-transition",
-				onKeydown: n[7] ||= ne(L((e) => T.value = !1, ["stop", "prevent"]), ["esc"])
+				onKeydown: n[7] ||= L(R((e) => T.value = !1, ["stop", "prevent"]), ["esc"])
 			}, {
 				activator: F(({ props: t }) => [f(r, v(t, {
 					block: "",
@@ -1583,12 +1627,12 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 					density: "compact",
 					icon: "mdi-minus",
 					variant: "text",
-					onClick: n[0] ||= L((e) => m("delete"), ["stop"])
+					onClick: n[0] ||= R((e) => m("delete"), ["stop"])
 				})) : c("", !0)]),
 				default: F(() => [u("div", {
 					class: "w-100 h-100 d-flex flex-row-reverse",
-					onClick: n[4] ||= L((e) => T.value = !1, ["self"]),
-					onContextmenu: n[5] ||= L((e) => T.value = !1, ["self", "prevent"])
+					onClick: n[4] ||= R((e) => T.value = !1, ["self"]),
+					onContextmenu: n[5] ||= R((e) => T.value = !1, ["self", "prevent"])
 				}, [u("div", {
 					class: "elevation-2",
 					style: y(_.value)
@@ -1608,13 +1652,13 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 							icon: "mdi-close",
 							variant: "text",
 							onClick: n[1] ||= (e) => T.value = !1
-						}), u("span", qt, k(A(a)(["x-prop-tree.select", "x-prop-tree.slot"])), 1)]),
+						}), u("span", Xt, k(A(a)(["x-prop-tree.select", "x-prop-tree.slot"])), 1)]),
 						_: 1
 					}),
 					u("div", {
 						class: "overflow-y-auto",
 						style: y(b.value)
-					}, [f(Kt, {
+					}, [f(Yt, {
 						modelValue: p.value,
 						"onUpdate:modelValue": n[2] ||= (e) => p.value = e,
 						open: A(T),
@@ -1625,7 +1669,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 			}, 8, ["modelValue"]);
 		};
 	}
-}), Yt = { class: "d-flex justify-space-between align-center" }, Xt = /* @__PURE__ */ p({
+}), Qt = { class: "d-flex justify-space-between align-center" }, $t = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1642,9 +1686,9 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 	}),
 	emits: /* @__PURE__ */ _(["delete"], ["update:modelValue"]),
 	setup(e, { emit: t }) {
-		let { isMobile: n } = H(), r = M(e, "modelValue"), i = t, a = async (t) => {
+		let { isMobile: n } = W(), r = M(e, "modelValue"), i = t, a = async (t) => {
 			if (!t || e.readonly || !n()) return;
-			let i = await me({
+			let i = await he({
 				title: "",
 				value: r.value
 			});
@@ -1652,7 +1696,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 		};
 		return (t, n) => {
 			let o = D("v-text-field"), u = D("v-btn"), d = O("ripple");
-			return C(), l("div", Yt, [I(f(o, {
+			return C(), l("div", Qt, [I(f(o, {
 				modelValue: r.value,
 				"onUpdate:modelValue": n[0] ||= (e) => r.value = e,
 				density: "compact",
@@ -1671,11 +1715,11 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				density: "compact",
 				icon: "mdi-minus",
 				variant: "text",
-				onClick: n[1] ||= L((e) => i("delete"), ["stop"])
+				onClick: n[1] ||= R((e) => i("delete"), ["stop"])
 			})) : c("", !0)]);
 		};
 	}
-}), Zt = { class: "d-flex justify-space-between align-center" }, Qt = /* @__PURE__ */ p({
+}), en = { class: "d-flex justify-space-between align-center" }, tn = /* @__PURE__ */ p({
 	__name: "index",
 	props: /* @__PURE__ */ _({
 		hasDelete: {
@@ -1695,7 +1739,7 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 		let n = M(e, "modelValue"), r = t;
 		return (t, i) => {
 			let a = D("v-switch"), o = D("v-btn");
-			return C(), l("div", Zt, [f(a, {
+			return C(), l("div", en, [f(a, {
 				modelValue: n.value,
 				"onUpdate:modelValue": i[0] ||= (e) => n.value = e,
 				class: "ml-1",
@@ -1709,21 +1753,21 @@ var ut = { class: "text-label-large ml-1" }, dt = { class: "text-body-small text
 				density: "compact",
 				icon: "mdi-minus",
 				variant: "text",
-				onClick: i[1] ||= L((e) => r("delete"), ["stop"])
+				onClick: i[1] ||= R((e) => r("delete"), ["stop"])
 			})) : c("", !0)]);
 		};
 	}
 });
 //#endregion
 //#region src/composables/uis/uiAdaptSlotSelect.ts
-function $t() {
+function nn() {
 	let e = $();
 	return { renderUiAdaptSlotSelect: (t, n, r, i, a) => {
 		if (n.ui !== "selectAdaptSlot") throw Error("renderUiSlotSelect property ui must be selectAdaptSlot");
-		return m(yt, {
-			modelValue: J(t, n, r, i, a, e),
+		return m(St, {
+			modelValue: X(t, n, r, i, a, e),
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1735,14 +1779,14 @@ function $t() {
 }
 //#endregion
 //#region src/composables/uis/uiColorPicker.ts
-function en() {
+function rn() {
 	let e = $();
 	return { renderUiColorPicker: (t, n, r, i, a) => {
 		if (n.ui !== "colorPicker") throw Error("renderUiColorPicker property ui must be colorPicker");
-		return m(xt, {
-			modelValue: J(t, n, r, i, a, e),
+		return m(wt, {
+			modelValue: X(t, n, r, i, a, e),
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1754,14 +1798,14 @@ function en() {
 }
 //#endregion
 //#region src/composables/uis/uiCompSelect.ts
-function tn() {
+function an() {
 	let e = $();
 	return { renderUiCompSelect: (t, n, r, i, a) => {
 		if (n.ui !== "selectComp") throw Error("renderUiCompSelect property ui must be selectComp");
-		return m(jt, {
-			modelValue: J(t, n, r, i, a, e),
+		return m(Pt, {
+			modelValue: X(t, n, r, i, a, e),
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1773,23 +1817,23 @@ function tn() {
 }
 //#endregion
 //#region src/composables/uis/uiDummy.ts
-function nn() {
+function on() {
 	let e = $();
 	return { renderUiDummy: (t, n, r, i, a) => {
 		if (n.ui !== "dummy") throw Error("renderUiDummy property ui must be dummy");
-		J(t, n, r, i, a, e);
+		X(t, n, r, i, a, e);
 	} };
 }
 //#endregion
 //#region src/composables/uis/uiJsonEditor.ts
-function rn() {
+function sn() {
 	let e = $();
 	return { renderUiJsonEditor: (t, n, r, i, a) => {
 		if (n.ui !== "jsonEditor") throw Error("renderUijsonEditor property ui must be jsonEditor");
-		return m(Pt, {
-			modelValue: J(t, n, r, i, a, e) ?? "{}",
+		return m(Lt, {
+			modelValue: X(t, n, r, i, a, e) ?? "{}",
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1801,14 +1845,14 @@ function rn() {
 }
 //#endregion
 //#region src/composables/uis/uiMultiTypes.ts
-function an() {
+function cn() {
 	let e = $();
 	return { renderUiMultiTypes: (t, n, r, i, a) => {
 		if (n.ui !== "multiTypes") throw Error("renderUiMultiTypes property ui must be multiTypes");
-		return m(Lt, {
-			modelValue: J(t, n, r, i, a, e) ?? "",
+		return m(Bt, {
+			modelValue: X(t, n, r, i, a, e) ?? "",
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1820,14 +1864,14 @@ function an() {
 }
 //#endregion
 //#region src/composables/uis/uiNumInput.ts
-function on() {
+function ln() {
 	let e = $();
 	return { renderUiNumInput: (t, n, r, i, a) => {
 		if (n.ui !== "numInput") throw Error("renderUiNumInput property ui must be numInput");
-		return m(zt, {
-			modelValue: J(t, n, r, i, a, e),
+		return m(Ht, {
+			modelValue: X(t, n, r, i, a, e),
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1843,12 +1887,12 @@ function on() {
 }
 //#endregion
 //#region src/components/entry/index.vue
-var sn = /* @__PURE__ */ p({
+var un = /* @__PURE__ */ p({
 	__name: "index",
 	props: { minHeight: {} },
 	emits: ["menu"],
 	setup(e, { emit: t }) {
-		let { backgroundColor2: n, highlightColor: r } = V(), i = t, a = T(!1), s = o(() => ({
+		let { backgroundColor2: n, highlightColor: r } = U(), i = t, a = T(!1), s = o(() => ({
 			background: a.value ? r.value : n.value,
 			minHeight: e.minHeight,
 			paddingRight: "4px",
@@ -1862,7 +1906,7 @@ var sn = /* @__PURE__ */ p({
 			return I((C(), l("div", {
 				class: "d-flex justify-space-between align-center cursor-pointer",
 				style: y(s.value),
-				onContextmenu: L(c, ["self", "prevent"]),
+				onContextmenu: R(c, ["self", "prevent"]),
 				onMouseout: t[0] ||= (e) => a.value = !1,
 				onMouseover: t[1] ||= (e) => a.value = !0
 			}, [ee(e.$slots, "default")], 36)), [[n]]);
@@ -1871,14 +1915,14 @@ var sn = /* @__PURE__ */ p({
 });
 //#endregion
 //#region src/composables/uis/uiProperty.ts
-function cn() {
-	let { t: e } = z(), t = Xe();
+function dn() {
+	let { t: e } = V(), t = $e();
 	return { renderProperty: (n, r, i) => {
 		let a = n[n.length - 1], o = typeof a == "number" ? `[${a + 1}]` : e(r.name);
-		return Z(t.value, n) && (o += " *"), m(sn, {
+		return Q(t.value, n) && (o += " *"), m(un, {
 			minHeight: "56px",
 			onMenu: (e, t) => {
-				B.emit("propTreeMenu", {
+				H.emit("propTreeMenu", {
 					x: e,
 					y: t,
 					keys: n
@@ -1895,14 +1939,14 @@ function cn() {
 }
 //#endregion
 //#region src/composables/uis/uiSelect.ts
-function ln() {
+function fn() {
 	let e = $();
 	return { renderUiSelect: (t, n, r, i, a) => {
 		if (n.ui !== "select") throw Error("renderUiSelect property ui must be select");
-		return m(Vt, {
-			modelValue: J(t, n, r, i, a, e) ?? "",
+		return m(Wt, {
+			modelValue: X(t, n, r, i, a, e) ?? "",
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1915,14 +1959,14 @@ function ln() {
 }
 //#endregion
 //#region src/composables/uis/uiSlotSelect.ts
-function un() {
+function pn() {
 	let e = $();
 	return { renderUiSlotSelect: (t, n, r, i, a) => {
 		if (n.ui !== "selectSlot") throw Error("renderUiSlotSelect property ui must be selectSlot");
-		return m(Jt, {
-			modelValue: J(t, n, r, i, a, e),
+		return m(Zt, {
+			modelValue: X(t, n, r, i, a, e),
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1934,14 +1978,14 @@ function un() {
 }
 //#endregion
 //#region src/composables/uis/uiStrInput.ts
-function dn() {
+function mn() {
 	let e = $();
 	return { renderUiStrInput: (t, n, r, i, a) => {
 		if (n.ui !== "strInput") throw Error("renderUiStrInput property ui must be strInput");
-		return m(Xt, {
-			modelValue: n.static ? n.value : J(t, n, r, i, a, e),
+		return m($t, {
+			modelValue: n.static ? n.value : X(t, n, r, i, a, e),
 			"onUpdate:modelValue": (o) => {
-				n.static || Y(t, n, r, o, i, a, e);
+				n.static || Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1953,14 +1997,14 @@ function dn() {
 }
 //#endregion
 //#region src/composables/uis/uiSwitch.ts
-function fn() {
+function hn() {
 	let e = $();
 	return { renderUiSwitch: (t, n, r, i, a) => {
 		if (n.ui !== "switch") throw Error("renderUiSwitch property ui must be switch");
-		return m(Qt, {
-			modelValue: J(t, n, r, i, a, e) ?? !1,
+		return m(tn, {
+			modelValue: X(t, n, r, i, a, e) ?? !1,
 			"onUpdate:modelValue": (o) => {
-				Y(t, n, r, o, i, a, e);
+				Z(t, n, r, o, i, a, e);
 			},
 			hasDelete: i !== void 0 && !a,
 			onDelete: () => {
@@ -1972,25 +2016,25 @@ function fn() {
 }
 //#endregion
 //#region src/components/propTree/main.vue?vue&type=script&setup=true&lang.ts
-var pn = "20px", mn = /* @__PURE__ */ p({
+var gn = "20px", _n = /* @__PURE__ */ p({
 	__name: "main",
 	setup(t) {
-		let { t: n } = z(), { backgroundColor1: r } = V(), i = We(), o = Ke(), s = Je(), c = Xe(), u = $();
-		ct(), lt(), st();
-		let { renderProperty: d } = cn(), { renderUiDummy: p } = nn(), { renderUiStrInput: h } = dn(), { renderUiNumInput: g } = on(), { renderUiSwitch: _ } = fn(), { renderUiSelect: v } = ln(), { renderUiColorPicker: y } = en(), { renderUiJsonEditor: b } = rn(), { renderUiMultiTypes: x } = an(), { renderUiCompSelect: S } = tn(), { renderUiSlotSelect: w } = un(), { renderUiAdaptSlotSelect: T } = $t(), E = (t, n, r, i, a, o) => (t = e(t), i === void 0 ? t.push(n.key) : (t.push(i), a && t.push(n.key)), n.ui ? n.array && !o ? O(t, n, r, i, a) : k(t, n, r, i, a) : n.array ? ee(t, n, r, i, a) : D(t, n, r, i, a)), ee = (e, t, r, i, a) => {
+		let { t: n } = V(), { backgroundColor1: r } = U(), i = qe(), o = Ye(), s = Ze(), c = $e(), u = $();
+		dt(), ft(), ut();
+		let { renderProperty: d } = dn(), { renderUiDummy: p } = on(), { renderUiStrInput: h } = mn(), { renderUiNumInput: g } = ln(), { renderUiSwitch: _ } = hn(), { renderUiSelect: v } = fn(), { renderUiColorPicker: y } = rn(), { renderUiJsonEditor: b } = sn(), { renderUiMultiTypes: x } = cn(), { renderUiCompSelect: S } = an(), { renderUiSlotSelect: w } = pn(), { renderUiAdaptSlotSelect: T } = nn(), E = (t, n, r, i, a, o) => (t = e(t), i === void 0 ? t.push(n.key) : (t.push(i), a && t.push(n.key)), n.ui ? n.array && !o ? O(t, n, r, i, a) : k(t, n, r, i, a) : n.array ? ee(t, n, r, i, a) : D(t, n, r, i, a)), ee = (e, t, r, i, a) => {
 			if (t.ui) throw Error("renderBranchArray property ui must be invalid");
 			if (!t.array) throw Error("renderBranchArray property array must be valid");
-			let o = ve(e, t, r, i, a, u), l = n(t.name);
-			W(s, e) && Z(c.value, e) && (l += " *");
-			let d = m(ot, {
+			let o = ye(e, t, r, i, a, u), l = n(t.name);
+			K(s, e) && Q(c.value, e) && (l += " *");
+			let d = m(lt, {
 				title: l,
-				collapse: W(s, e),
+				collapse: K(s, e),
 				hasCreate: !0,
 				onCollapse: (t) => {
-					G(s, e, t);
+					q(s, e, t);
 				},
 				onMenu: (t, n) => {
-					B.emit("propTreeMenu", {
+					H.emit("propTreeMenu", {
 						x: t,
 						y: n,
 						keys: e
@@ -1999,21 +2043,21 @@ var pn = "20px", mn = /* @__PURE__ */ p({
 				onCreate: () => {
 					o.push({}), u(e, o);
 				}
-			}), f = m("div", { style: { paddingLeft: pn } }, (() => {
+			}), f = m("div", { style: { paddingLeft: gn } }, (() => {
 				let n = [];
 				for (let r = 0; r < o.length; r++) {
 					let i = [...e, r], a = `[${r + 1}]`;
-					W(s, [...e, r]) && Z(c.value, i) && (a += " *");
-					let l = m(ot, {
+					K(s, [...e, r]) && Q(c.value, i) && (a += " *");
+					let l = m(lt, {
 						title: a,
-						collapse: W(s, [...e, r]),
+						collapse: K(s, [...e, r]),
 						hasDelete: !0,
 						index: r,
 						onCollapse: (t) => {
-							G(s, [...e, r], t);
+							q(s, [...e, r], t);
 						},
 						onMenu: (e, t) => {
-							B.emit("propTreeMenu", {
+							H.emit("propTreeMenu", {
 								x: e,
 								y: t,
 								keys: i
@@ -2024,33 +2068,33 @@ var pn = "20px", mn = /* @__PURE__ */ p({
 						}
 					});
 					n.push(l);
-					let d = m("div", { style: { paddingLeft: pn } }, (() => {
+					let d = m("div", { style: { paddingLeft: gn } }, (() => {
 						let n = [];
 						for (let i of t.children) n.push(E(e, i, o[r], r, !0));
 						return n;
 					})());
-					W(s, [...e, r]) || n.push(d);
+					K(s, [...e, r]) || n.push(d);
 				}
 				return n;
 			})());
 			return m("div", { style: { marginTop: "1px" } }, (() => {
 				let t = [];
-				return t.push(d), W(s, e) || t.push(f), t;
+				return t.push(d), K(s, e) || t.push(f), t;
 			})());
 		}, D = (e, t, r, i, a) => {
 			if (t.ui) throw Error("renderBranchScalar property ui must be invalid");
 			if (t.array) throw Error("renderBranchScalar property array must be invalid");
 			let o = n(t.name);
-			W(s, e) && Z(c.value, e) && (o += " *");
-			let l = m(ot, {
+			K(s, e) && Q(c.value, e) && (o += " *");
+			let l = m(lt, {
 				title: o,
-				collapse: W(s, e),
+				collapse: K(s, e),
 				hasDelete: i !== void 0 && !a,
 				onCollapse: (t) => {
-					G(s, e, t);
+					q(s, e, t);
 				},
 				onMenu: (t, n) => {
-					B.emit("propTreeMenu", {
+					H.emit("propTreeMenu", {
 						x: t,
 						y: n,
 						keys: e
@@ -2059,45 +2103,45 @@ var pn = "20px", mn = /* @__PURE__ */ p({
 				onDelete: () => {
 					i === void 0 || a || (r.splice(i, 1), u(e.slice(0, -1), r));
 				}
-			}), d = m("div", { style: { paddingLeft: pn } }, (() => {
+			}), d = m("div", { style: { paddingLeft: gn } }, (() => {
 				let n = [];
 				for (let i of t.children) n.push(E(e, i, (typeof r[t.key] != "object" && (r[t.key] = {}, u(e, r[t.key])), r[t.key]), void 0, !1));
 				return n;
 			})());
 			return m("div", { style: { marginTop: "1px" } }, (() => {
 				let t = [];
-				return t.push(l), W(s, e) || t.push(d), t;
+				return t.push(l), K(s, e) || t.push(d), t;
 			})());
 		}, O = (e, t, r, i, a) => {
 			if (!t.ui) throw Error("renderLeafArray property ui must be valid");
 			if (!t.array) throw Error("renderLeafArray property array must be valid");
-			let o = ve(e, t, r, i, a, u), l = n(t.name);
-			W(s, e) && Z(c.value, e) && (l += " *");
-			let d = m(ot, {
+			let o = ye(e, t, r, i, a, u), l = n(t.name);
+			K(s, e) && Q(c.value, e) && (l += " *");
+			let d = m(lt, {
 				title: l,
-				collapse: W(s, e),
+				collapse: K(s, e),
 				hasCreate: !0,
 				onCollapse: (t) => {
-					G(s, e, t);
+					q(s, e, t);
 				},
 				onMenu: (t, n) => {
-					B.emit("propTreeMenu", {
+					H.emit("propTreeMenu", {
 						x: t,
 						y: n,
 						keys: e
 					});
 				},
 				onCreate: () => {
-					o.push(R(t)), u(e, o);
+					o.push(z(t)), u(e, o);
 				}
-			}), f = m("div", { style: { paddingLeft: pn } }, (() => {
+			}), f = m("div", { style: { paddingLeft: gn } }, (() => {
 				let n = [];
 				for (let r = 0; r < o.length; r++) n.push(E(e, t, o, r, !1, !0));
 				return n;
 			})());
 			return m("div", { style: { marginTop: "1px" } }, (() => {
 				let t = [];
-				return t.push(d), W(s, e) || t.push(f), t;
+				return t.push(d), K(s, e) || t.push(f), t;
 			})());
 		}, k = (e, t, n, r, i) => {
 			if (!t.ui) throw Error("renderLeafScalar property ui must be valid");
@@ -2111,9 +2155,9 @@ var pn = "20px", mn = /* @__PURE__ */ p({
 			if (i.value.length > 0 && o.value) for (let t of i.value) e.push(E([], t, o.value, void 0, !1));
 			return e;
 		})());
-		return (e, t) => (C(), l(a, null, [f(A), f(it)], 64));
+		return (e, t) => (C(), l(a, null, [f(A), f(st)], 64));
 	}
-}), hn = /* @__PURE__ */ p({
+}), vn = /* @__PURE__ */ p({
 	__name: "index",
 	props: {
 		config: {},
@@ -2125,25 +2169,25 @@ var pn = "20px", mn = /* @__PURE__ */ p({
 	emits: ["change"],
 	setup(e, { emit: t }) {
 		let n = t, r = T([]);
-		Ue(r), P(() => {
+		Ke(r), P(() => {
 			r.value = e.config;
 		});
 		let i = T();
-		Ge(i), P(() => {
+		Je(i), P(() => {
 			i.value = e.object;
 		});
 		let a = T("");
-		Re(a), P(() => {
+		Be(a), P(() => {
 			a.value = e.version;
 		});
 		let o = T(e.type);
-		ze(o), P(() => {
+		He(o), P(() => {
 			o.value = e.type;
 		});
 		let c = T("");
-		Ve(c), P(() => {
+		We(c), P(() => {
 			c.value = e.subtype;
-		}), qe(T({
+		}), Xe(T({
 			collapse: !0,
 			children: {}
 		}));
@@ -2152,15 +2196,15 @@ var pn = "20px", mn = /* @__PURE__ */ p({
 			warning: !1,
 			children: {}
 		});
-		return Ye(l), Ze((t, r) => {
-			Ee(l, e.config, e.object), n("change", t, r);
+		return Qe(l), et((t, r) => {
+			Oe(l, e.config, e.object), n("change", t, r);
 		}), N([() => e.config, () => e.object], () => {
-			Ee(l, e.config, e.object);
-		}, { immediate: !0 }), (e, t) => (C(), s(mn));
+			Oe(l, e.config, e.object);
+		}, { immediate: !0 }), (e, t) => (C(), s(_n));
 	}
-}), gn = (e) => {
-	e.component("XPropTree", hn);
-}, _n = (e, t, n) => {
+}), yn = (e) => {
+	e.component("XPropTree", vn);
+}, bn = (e, t, n) => {
 	let r = t.lastIndexOf("?"), i = e[r === -1 || r < t.lastIndexOf("/") ? t : t.slice(0, r)];
 	return i ? typeof i == "function" ? i() : Promise.resolve(i) : new Promise((e, r) => {
 		(typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(r.bind(null, /* @__PURE__ */ Error("Unknown variable dynamic import: " + t + (t.split("/").length === n ? "" : ". Note that variables only represent file names one level deep."))));
@@ -2168,14 +2212,14 @@ var pn = "20px", mn = /* @__PURE__ */ p({
 };
 //#endregion
 //#region src/i18n/index.ts
-async function vn(e) {
-	return (await _n(/* @__PURE__ */ Object.assign({
+async function xn(e) {
+	return (await bn(/* @__PURE__ */ Object.assign({
 		"./locales/en/index.ts": () => import("./i18n-en.lvwojc1f.js").then((e) => e.t),
 		"./locales/zhHans/index.ts": () => import("./i18n-zhHans.u8lopwp1.js").then((e) => e.t)
 	}), `./locales/${e}/index.ts`, 4)).default;
 }
 //#endregion
 //#region src/index.ts
-var yn = { install: gn };
+var Sn = { install: yn };
 //#endregion
-export { yn as default, vn as loadLocaleMessagePropTree };
+export { Sn as default, xn as loadLocaleMessagePropTree };