x-prop-tree 0.7.0 → 0.7.1

package/dist/index.js

@@ -1,4 +1,4 @@
-import { provide as de, inject as fe, defineComponent as J, ref as O, computed as K, resolveComponent as $, createBlock as B, openBlock as S, unref as C, isRef as pe, withCtx as R, createVNode as A, createElementBlock as H, Fragment as Ve, renderList as Be, createTextVNode as Ce, toDisplayString as Q, resolveDirective as ne, withDirectives as ee, withModifiers as z, normalizeStyle as I, createElementVNode as F, createCommentVNode as Y, renderSlot as pt, h, mergeModels as W, useModel as G, useId as we, onUnmounted as De, withKeys as Ke, mergeProps as Ae, watchEffect as Ne, watch as ue, useTemplateRef as Re, reactive as yt, onMounted as gt, onBeforeUnmount as ht } from "vue";
+import { provide as de, inject as fe, defineComponent as J, ref as O, computed as K, resolveComponent as $, createBlock as B, openBlock as S, unref as C, isRef as pe, withCtx as R, createVNode as b, createElementBlock as H, Fragment as Ve, renderList as Be, createTextVNode as Ce, toDisplayString as Q, resolveDirective as le, withDirectives as ee, withModifiers as z, normalizeStyle as I, createElementVNode as F, createCommentVNode as Y, renderSlot as pt, h, mergeModels as W, useModel as G, useId as we, onUnmounted as De, withKeys as Ke, mergeProps as be, watchEffect as Ne, watch as ue, useTemplateRef as Re, reactive as yt, onMounted as gt, onBeforeUnmount as ht } from "vue";
 import { useI18n as te } from "vue-i18n";
 import { useViewStack as Se, useColor as ie, eventBus as ae, useSystem as Je, injectDark as _t, injectLocale as kt } from "x-essential-lib";
 import { c as He, i as Ue, m as Xe, a as Fe, b as Vt, d as re, r as ze, v as Ct, e as Ge, f as St } from "./vendor.h3srogcv.js";
@@ -18,7 +18,7 @@ const _e = (o, s) => {
         console.assert(!1, `unpkgProp prop ui must be invalid keys=${s}`);
         return;
       }
-      t = t.children.find((l) => l.key === e);
+      t = t.children.find((n) => n.key === e);
     }
   }), t;
 }, ve = (o, s) => {
@@ -31,47 +31,47 @@ const _e = (o, s) => {
     t = t[e];
   }), t;
 }, Oe = (o) => !(o instanceof Array), Me = (o) => o instanceof Array, wt = (o, s) => {
-  const t = (e, l) => {
-    if (e.ui !== l.ui || e.array !== l.array)
+  const t = (e, n) => {
+    if (e.ui !== n.ui || e.array !== n.array)
       return !1;
-    if (e.ui || l.ui)
+    if (e.ui || n.ui)
       return !0;
-    if (e.children.length !== l.children.length)
+    if (e.children.length !== n.children.length)
       return !1;
-    for (let n = 0; n < e.children.length; n++)
-      if (!t(e.children[n], l.children[n]))
+    for (let l = 0; l < e.children.length; l++)
+      if (!t(e.children[l], n.children[l]))
         return !1;
     return !0;
   };
   return t(o, s);
-}, be = (o) => !(o instanceof Array), $e = (o) => o instanceof Array, Dt = [
+}, Ae = (o) => !(o instanceof Array), $e = (o) => o instanceof Array, Dt = [
   ["basic", "id"],
   ["basic", "name"]
-], At = (o) => Dt.find((s) => Ue(o, s)), xe = (o, s, t, e, l, n, i) => (o = He(o), n !== void 0 ? (o.push(n), i && o.push(s.key)) : o.push(s.key), At(o) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && $e(e.children) ? Lt(
+], bt = (o) => Dt.find((s) => Ue(o, s)), xe = (o, s, t, e, n, l, i) => (o = He(o), l !== void 0 ? (o.push(l), i && o.push(s.key)) : o.push(s.key), bt(o) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && $e(e.children) ? Lt(
   o,
   s,
   t,
   e,
-  l,
   n,
+  l,
   i
-) : Nt(s, t, e, n, i) : s.array ? bt(
+) : Nt(s, t, e, l, i) : s.array ? At(
   o,
   s,
   t,
   e,
-  l,
   n,
+  l,
   i
 ) : Tt(
   o,
   s,
   t,
   e,
-  l,
   n,
+  l,
   i
-)), bt = (o, s, t, e, l, n, i) => {
+)), At = (o, s, t, e, n, l, i) => {
   if (s.ui)
     return console.assert(!1, "execPropBranchArray prop ui must be invalid"), !1;
   if (!s.array)
@@ -79,7 +79,7 @@ const _e = (o, s) => {
   if (!e.children || !$e(e.children))
     return console.assert(!1, "execPropBranchArray state children must be array"), !1;
   let a;
-  n !== void 0 && !i ? (t[n] instanceof Array || (t[n] = q(s), l == null || l(o, t[n])), a = t[n]) : (t[s.key] instanceof Array || (t[s.key] = q(s), l == null || l(o, t[s.key])), a = t[s.key]), e.change = !1;
+  l !== void 0 && !i ? (t[l] instanceof Array || (t[l] = q(s), n == null || n(o, t[l])), a = t[l]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n == null || n(o, t[s.key])), a = t[s.key]), e.change = !1;
   for (let r = 0; r < a.length; r++) {
     e.children.push({
       change: !1,
@@ -87,7 +87,7 @@ const _e = (o, s) => {
     });
     const u = e.children[r];
     s.children.forEach((g) => {
-      if (!u.children || !be(u.children)) {
+      if (!u.children || !Ae(u.children)) {
         console.assert(!1);
         return;
       }
@@ -99,31 +99,31 @@ const _e = (o, s) => {
         g,
         a[r],
         u.children[g.key],
-        l,
+        n,
         r,
         !0
       ) && (u.change = !0), u.change && (e.change = !0);
     });
   }
   return e.change || (e.change = !Ue(a, q(s))), e.change;
-}, Tt = (o, s, t, e, l, n, i) => {
+}, Tt = (o, s, t, e, n, l, i) => {
   if (s.ui)
     return console.assert(!1, "execPropBranchScalar prop ui must be invalid"), !1;
   if (s.array)
     return console.assert(!1, "execPropBranchScalar prop array must be invalid"), !1;
-  if (!e.children || !be(e.children))
+  if (!e.children || !Ae(e.children))
     return console.assert(!1, "execPropBranchScalar state children must be map"), !1;
   let a;
-  n !== void 0 && !i ? (t[n] || (t[n] = {}), a = t[n]) : (t[s.key] || (t[s.key] = {}), a = t[s.key]), e.change = !1;
+  l !== void 0 && !i ? (t[l] || (t[l] = {}), a = t[l]) : (t[s.key] || (t[s.key] = {}), a = t[s.key]), e.change = !1;
   for (let r = 0; r < s.children.length; r++) {
     const u = s.children[r];
     e.children[u.key] = {
       change: !1,
       children: u.array ? [] : {}
-    }, xe(o, u, a, e.children[u.key], l) && (e.change = !0);
+    }, xe(o, u, a, e.children[u.key], n) && (e.change = !0);
   }
   return e.change;
-}, Lt = (o, s, t, e, l, n, i) => {
+}, Lt = (o, s, t, e, n, l, i) => {
   if (!s.ui)
     return console.assert(!1, "execPropLeafArray prop ui must be valid"), !1;
   if (!s.array)
@@ -131,30 +131,30 @@ const _e = (o, s) => {
   if (!e.children || !$e(e.children))
     return console.assert(!1, "execPropLeafArray state children must be array"), !1;
   let a;
-  n !== void 0 && !i ? (t[n] instanceof Array || (t[n] = q(s), l == null || l(o, t[n])), a = t[n]) : (t[s.key] instanceof Array || (t[s.key] = q(s), l == null || l(o, t[s.key])), a = t[s.key]), e.change = !1;
+  l !== void 0 && !i ? (t[l] instanceof Array || (t[l] = q(s), n == null || n(o, t[l])), a = t[l]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n == null || n(o, t[s.key])), a = t[s.key]), e.change = !1;
   for (let r = 0; r < a.length; r++)
     e.children[r] = {
       change: !1,
       children: {}
-    }, xe(o, s, a, e.children[r], l, r, !1) && (e.change = !0);
+    }, xe(o, s, a, e.children[r], n, r, !1) && (e.change = !0);
   return e.change || (e.change = !Ue(a, q(s))), e.change;
-}, Nt = (o, s, t, e, l) => {
+}, Nt = (o, s, t, e, n) => {
   if (!o.ui)
     return console.assert(!1, "execPropLeafScalar prop ui must be valid"), !1;
-  let n;
-  return e !== void 0 && !l ? n = s[e] : n = s[o.key], t.change = !Ue(n, q(o, !0)), t.change;
+  let l;
+  return e !== void 0 && !n ? l = s[e] : l = s[o.key], t.change = !Ue(l, q(o, !0)), t.change;
 }, qe = (o, s, t, e) => {
   if (s.length <= 0 || !t) {
     o.value = {};
     return;
   }
-  const l = {};
-  s.forEach((n) => {
-    l[n.key] = {
+  const n = {};
+  s.forEach((l) => {
+    n[l.key] = {
       change: !1,
-      children: n.array ? [] : {}
-    }, xe([], n, t, l[n.key], e);
-  }), o.value = l;
+      children: l.array ? [] : {}
+    }, xe([], l, t, n[l.key], e);
+  }), o.value = n;
 }, ce = (o, s) => {
   let t = { change: !1, children: o };
   return s.forEach((e) => {
@@ -162,7 +162,7 @@ const _e = (o, s) => {
       return console.assert(!1, `isPropChanged state must be valid keys=${s}`), !1;
     if (!t.children)
       return console.assert(!1, `isPropChanged state must be valid keys=${s}`), !1;
-    typeof e == "string" ? be(t.children) && (t = t.children[e]) : $e(t.children) && (t = t.children[e]);
+    typeof e == "string" ? Ae(t.children) && (t = t.children[e]) : $e(t.children) && (t = t.children[e]);
   }), (t == null ? void 0 : t.change) ?? !1;
 }, We = Symbol(), Qe = Symbol(), Ze = Symbol(), Ee = Symbol(), je = Symbol(), Ie = Symbol();
 function Ot(o) {
@@ -204,15 +204,15 @@ function et() {
 const Gt = /* @__PURE__ */ J({
   __name: "menu",
   setup(o) {
-    const { t: s } = te(), t = Bt(), e = Rt(), l = Ht(), n = Ft(), i = O(0), a = O(0), r = O([]), u = K(() => [i.value, a.value]), g = (w) => {
-      const T = () => !(r.value.length <= 0 || !ce(l.value, r.value)), P = () => {
+    const { t: s } = te(), t = Bt(), e = Rt(), n = Ht(), l = Ft(), i = O(0), a = O(0), r = O([]), u = K(() => [i.value, a.value]), g = (w) => {
+      const T = () => !(r.value.length <= 0 || !ce(n.value, r.value)), P = () => {
         const _ = _e(t.value, r.value);
         if (_)
           if (_.ui) {
             const M = ve(e.value, r.value.slice(0, -1));
             if (!M)
               return;
-            M[r.value[r.value.length - 1]] = q(_), n(r.value, M[r.value[r.value.length - 1]]);
+            M[r.value[r.value.length - 1]] = q(_), l(r.value, M[r.value[r.value.length - 1]]);
           } else if (_.array) {
             const M = r.value[r.value.length - 1];
             if (M === void 0) {
@@ -223,13 +223,13 @@ const Gt = /* @__PURE__ */ J({
               const N = ve(e.value, r.value.slice(0, -1));
               if (!N)
                 return;
-              N[r.value[r.value.length - 1]] = q(_), n(r.value, N[r.value[r.value.length - 1]]);
+              N[r.value[r.value.length - 1]] = q(_), l(r.value, N[r.value[r.value.length - 1]]);
             } else {
               const N = ve(e.value, r.value);
               if (!N)
                 return;
               _.children.forEach((Z) => {
-                N[Z.key] = q(_), n([...r.value, Z.key], N[Z.key]);
+                N[Z.key] = q(_), l([...r.value, Z.key], N[Z.key]);
               });
             }
           } else {
@@ -237,7 +237,7 @@ const Gt = /* @__PURE__ */ J({
             if (!M)
               return;
             _.children.forEach((N) => {
-              M[N.key] = q(_), n([...r.value, N.key], M[N.key]);
+              M[N.key] = q(_), l([...r.value, N.key], M[N.key]);
             });
           }
       };
@@ -298,7 +298,7 @@ const Gt = /* @__PURE__ */ J({
         scrim: "transparent"
       }, {
         default: R(() => [
-          A(M, null, {
+          b(M, null, {
             default: R(() => [
               (S(!0), H(Ve, null, Be(m.value, (Z, Pe) => (S(), B(_, {
                 key: Pe,
@@ -306,7 +306,7 @@ const Gt = /* @__PURE__ */ J({
                 onClick: Z.func
               }, {
                 default: R(() => [
-                  A(P, null, {
+                  b(P, null, {
                     default: R(() => [
                       Ce(Q(Z.title), 1)
                     ]),
@@ -323,7 +323,7 @@ const Gt = /* @__PURE__ */ J({
       }, 8, ["modelValue", "target"]);
     };
   }
-}), ke = /* @__PURE__ */ J({
+}), Yt = { style: { pointerEvents: "none" } }, ke = /* @__PURE__ */ J({
   __name: "title",
   props: {
     title: {},
@@ -334,39 +334,39 @@ const Gt = /* @__PURE__ */ J({
   },
   emits: ["collapse", "menu", "create", "delete"],
   setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), l = s, n = O(!1), i = K(() => ({
-      background: n.value ? e.value : t.value,
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = s, l = O(!1), i = K(() => ({
+      background: l.value ? e.value : t.value,
       height: "36px",
       marginBottom: "1px",
       userSelect: "none"
     })), a = () => {
-      l("collapse", !o.collapse);
+      n("collapse", !o.collapse);
     }, r = (u) => {
-      l("menu", u.clientX, u.clientY);
+      n("menu", u.clientX, u.clientY);
     };
     return (u, g) => {
-      const d = $("v-icon"), f = $("v-spacer"), m = $("v-btn"), k = ne("ripple");
+      const d = $("v-icon"), f = $("v-spacer"), m = $("v-btn"), k = le("ripple");
       return ee((S(), H("div", {
         class: "d-flex align-center cursor-pointer",
         style: I(i.value),
         onClick: a,
         onContextmenu: z(r, ["self", "prevent"]),
-        onMouseover: g[2] || (g[2] = (L) => n.value = !0),
-        onMouseout: g[3] || (g[3] = (L) => n.value = !1)
+        onMouseover: g[2] || (g[2] = (L) => l.value = !0),
+        onMouseout: g[3] || (g[3] = (L) => l.value = !1)
       }, [
-        A(d, {
+        b(d, {
           class: "mr-1",
           icon: u.collapse ? C(Xe) : C(Fe)
         }, null, 8, ["icon"]),
-        F("span", null, Q(u.title), 1),
-        A(f),
+        F("span", Yt, Q(u.title), 1),
+        b(f),
         u.hasCreate ? (S(), B(m, {
           key: 0,
           class: "mx-3",
           variant: "text",
           density: "compact",
           icon: C(Vt),
-          onClick: g[0] || (g[0] = z((L) => l("create"), ["stop"]))
+          onClick: g[0] || (g[0] = z((L) => n("create"), ["stop"]))
         }, null, 8, ["icon"])) : Y("", !0),
         u.hasDelete ? (S(), B(m, {
           key: 1,
@@ -374,37 +374,37 @@ const Gt = /* @__PURE__ */ J({
           variant: "text",
           density: "compact",
           icon: C(re),
-          onClick: g[1] || (g[1] = z((L) => l("delete", u.index), ["stop"]))
+          onClick: g[1] || (g[1] = z((L) => n("delete", u.index), ["stop"]))
         }, null, 8, ["icon"])) : Y("", !0)
       ], 36)), [
         [k]
       ]);
     };
   }
-}), Yt = /* @__PURE__ */ J({
+}), Wt = /* @__PURE__ */ J({
   __name: "entry",
   props: {
     minHeight: {}
   },
   emits: ["menu"],
   setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), l = s, n = O(!1), i = K(() => ({
-      background: n.value ? e.value : t.value,
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = s, l = O(!1), i = K(() => ({
+      background: l.value ? e.value : t.value,
       minHeight: o.minHeight,
       paddingRight: "4px",
       marginBottom: "1px",
       userSelect: "none"
     })), a = (r) => {
-      l("menu", r.clientX, r.clientY);
+      n("menu", r.clientX, r.clientY);
     };
     return (r, u) => {
-      const g = ne("ripple");
+      const g = le("ripple");
       return ee((S(), H("div", {
         class: "d-flex justify-space-between align-center cursor-pointer",
         style: I(i.value),
         onContextmenu: z(a, ["self", "prevent"]),
-        onMouseover: u[0] || (u[0] = (d) => n.value = !0),
-        onMouseout: u[1] || (u[1] = (d) => n.value = !1)
+        onMouseover: u[0] || (u[0] = (d) => l.value = !0),
+        onMouseout: u[1] || (u[1] = (d) => l.value = !1)
       }, [
         pt(r.$slots, "default")
       ], 36)), [
@@ -413,40 +413,40 @@ const Gt = /* @__PURE__ */ J({
     };
   }
 });
-function Wt(o, s, t) {
+function Qt(o, s, t) {
   const { t: e } = te();
-  return { renderProp: (n, i, a) => {
-    const r = n[n.length - 1];
+  return { renderProp: (l, i, a) => {
+    const r = l[l.length - 1];
     let g = typeof r == "number" ? `[${r + 1}]` : e(i.name);
-    return ce(o.value, n) && (g += " *"), h(
-      Yt,
+    return ce(o.value, l) && (g += " *"), h(
+      Wt,
       {
         minHeight: s.value,
         onMenu: (d, f) => {
-          ae.emit("propTreeMenu", { x: d, y: f, keys: n });
+          ae.emit("propTreeMenu", { x: d, y: f, keys: l });
         }
       },
       () => [
-        h("span", { class: "ml-1", innerHTML: g }),
+        h("span", { style: { marginLeft: "4px", pointerEvents: "none" }, innerHTML: g }),
         h("div", { style: { width: t.value } }, a)
       ]
     );
   } };
 }
-const le = (o, s, t, e, l, n) => {
-  if (l !== void 0)
-    if (n) {
+const ne = (o, s, t, e, n, l) => {
+  if (n !== void 0)
+    if (l) {
       if (t[s.key] === void 0) {
         const i = q(s);
         i !== void 0 && (t[s.key] = i, e(o, t[s.key]));
       }
       return t[s.key];
     } else {
-      if (t[l] === void 0) {
+      if (t[n] === void 0) {
         const i = q(s, !0);
-        i !== void 0 && (t[l] = i, e(o, t[l]));
+        i !== void 0 && (t[n] = i, e(o, t[n]));
       }
-      return t[l];
+      return t[n];
     }
   else {
     if (t[s.key] === void 0) {
@@ -455,24 +455,24 @@ const le = (o, s, t, e, l, n) => {
     }
     return t[s.key];
   }
-}, oe = (o, s, t, e, l, n, i) => {
-  if (n !== void 0)
-    i ? e !== t[s.key] && (t[s.key] = e, l(o, t[s.key])) : e !== t[n] && (t[n] = e, l(o, t[n]));
+}, oe = (o, s, t, e, n, l, i) => {
+  if (l !== void 0)
+    i ? e !== t[s.key] && (t[s.key] = e, n(o, t[s.key])) : e !== t[l] && (t[l] = e, n(o, t[l]));
   else {
     let a = e;
-    (s.ui === "switch" || s.ui === "select" || s.ui === "colorPicker" || s.ui === "multiTypes" || s.ui === "compSelect") && (e || (a = void 0)), a !== t[s.key] && (t[s.key] = a, l(o, t[s.key]));
+    (s.ui === "switch" || s.ui === "select" || s.ui === "colorPicker" || s.ui === "multiTypes" || s.ui === "compSelect") && (e || (a = void 0)), a !== t[s.key] && (t[s.key] = a, n(o, t[s.key]));
   }
 };
-function Qt(o) {
-  return { renderUiDummy: (t, e, l, n, i) => {
+function Zt(o) {
+  return { renderUiDummy: (t, e, n, l, i) => {
     if (e.ui !== "dummy") {
       console.assert(!1, "renderUiDummy prop ui must be dummy");
       return;
     }
-    le(t, e, l, o, n, i);
+    ne(t, e, n, o, l, i);
   } };
 }
-const Zt = { class: "d-flex justify-space-between align-center" }, Et = /* @__PURE__ */ J({
+const Et = { class: "d-flex justify-space-between align-center" }, jt = /* @__PURE__ */ J({
   __name: "strInput",
   props: /* @__PURE__ */ W({
     hasDelete: { type: Boolean, default: !1 },
@@ -484,16 +484,16 @@ const Zt = { class: "d-flex justify-space-between align-center" }, Et = /* @__PU
   emits: /* @__PURE__ */ W(["delete"], ["update:modelValue"]),
   setup(o, { emit: s }) {
     const t = G(o, "modelValue"), e = s;
-    return (l, n) => {
-      const i = $("v-text-field"), a = $("v-btn"), r = ne("ripple");
-      return S(), H("div", Zt, [
-        ee(A(i, {
+    return (n, l) => {
+      const i = $("v-text-field"), a = $("v-btn"), r = le("ripple");
+      return S(), H("div", Et, [
+        ee(b(i, {
           modelValue: t.value,
-          "onUpdate:modelValue": n[0] || (n[0] = (u) => t.value = u),
+          "onUpdate:modelValue": l[0] || (l[0] = (u) => t.value = u),
           density: "compact",
           "hide-details": "",
           "single-line": "",
-          readonly: l.readonly
+          readonly: n.readonly
         }, null, 8, ["modelValue", "readonly"]), [
           [
             r,
@@ -502,47 +502,47 @@ const Zt = { class: "d-flex justify-space-between align-center" }, Et = /* @__PU
             { stop: !0 }
           ]
         ]),
-        l.hasDelete ? (S(), B(a, {
+        n.hasDelete ? (S(), B(a, {
           key: 0,
           class: "mx-2",
           variant: "text",
           density: "compact",
           icon: C(re),
-          onClick: n[1] || (n[1] = z((u) => e("delete"), ["stop"]))
+          onClick: l[1] || (l[1] = z((u) => e("delete"), ["stop"]))
         }, null, 8, ["icon"])) : Y("", !0)
       ]);
     };
   }
 });
-function jt(o) {
-  return { renderUiStrInput: (t, e, l, n, i) => e.ui !== "strInput" ? (console.assert(!1), h("div", "renderUiStrInput prop ui must be strInput")) : h(Et, {
-    modelValue: e.static ? e.value : le(
+function It(o) {
+  return { renderUiStrInput: (t, e, n, l, i) => e.ui !== "strInput" ? (console.assert(!1), h("div", "renderUiStrInput prop ui must be strInput")) : h(jt, {
+    modelValue: e.static ? e.value : ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ),
     "onUpdate:modelValue": (a) => {
       e.static || oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     },
-    hasDelete: n !== void 0 && !i,
+    hasDelete: l !== void 0 && !i,
     onDelete: () => {
-      n === void 0 || i || (l.splice(n, 1), o(t.slice(0, -1), l));
+      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
     },
     readonly: e.static || e.readonly
   }) };
 }
-const It = { class: "d-flex justify-space-between align-center" }, el = /* @__PURE__ */ J({
+const en = { class: "d-flex justify-space-between align-center" }, tn = /* @__PURE__ */ J({
   __name: "numInput",
   props: /* @__PURE__ */ W({
     hasDelete: { type: Boolean, default: !1 },
@@ -559,21 +559,21 @@ const It = { class: "d-flex justify-space-between align-center" }, el = /* @__PU
   emits: /* @__PURE__ */ W(["delete"], ["update:modelValue"]),
   setup(o, { emit: s }) {
     const t = G(o, "modelValue"), e = s;
-    return (l, n) => {
-      const i = $("v-number-input"), a = $("v-btn"), r = ne("ripple");
-      return S(), H("div", It, [
-        ee(A(i, {
+    return (n, l) => {
+      const i = $("v-number-input"), a = $("v-btn"), r = le("ripple");
+      return S(), H("div", en, [
+        ee(b(i, {
           modelValue: t.value,
-          "onUpdate:modelValue": n[0] || (n[0] = (u) => t.value = u),
+          "onUpdate:modelValue": l[0] || (l[0] = (u) => t.value = u),
           density: "compact",
           "control-variant": "stacked",
-          precision: l.precision,
-          min: l.min,
-          max: l.max,
-          step: l.step,
+          precision: n.precision,
+          min: n.min,
+          max: n.max,
+          step: n.step,
           "hide-details": "",
           "single-line": "",
-          readonly: l.readonly
+          readonly: n.readonly
         }, null, 8, ["modelValue", "precision", "min", "max", "step", "readonly"]), [
           [
             r,
@@ -582,42 +582,42 @@ const It = { class: "d-flex justify-space-between align-center" }, el = /* @__PU
             { stop: !0 }
           ]
         ]),
-        l.hasDelete ? (S(), B(a, {
+        n.hasDelete ? (S(), B(a, {
           key: 0,
           class: "mx-2",
           variant: "text",
           density: "compact",
           icon: C(re),
-          onClick: n[1] || (n[1] = z((u) => e("delete"), ["stop"]))
+          onClick: l[1] || (l[1] = z((u) => e("delete"), ["stop"]))
         }, null, 8, ["icon"])) : Y("", !0)
       ]);
     };
   }
 });
-function tl(o) {
-  return { renderUiNumInput: (t, e, l, n, i) => e.ui !== "numInput" ? (console.assert(!1), h("div", "renderUiNumInput prop ui must be numInput")) : h(el, {
-    modelValue: le(
+function nn(o) {
+  return { renderUiNumInput: (t, e, n, l, i) => e.ui !== "numInput" ? (console.assert(!1), h("div", "renderUiNumInput prop ui must be numInput")) : h(tn, {
+    modelValue: ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ),
     "onUpdate:modelValue": (a) => {
       oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     },
-    hasDelete: n !== void 0 && !i,
+    hasDelete: l !== void 0 && !i,
     onDelete: () => {
-      n === void 0 || i || (l.splice(n, 1), o(t.slice(0, -1), l));
+      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
     },
     precision: e.precision,
     min: e.min,
@@ -626,7 +626,7 @@ function tl(o) {
     readonly: e.readonly
   }) };
 }
-const ll = { class: "d-flex justify-space-between align-center" }, nl = /* @__PURE__ */ J({
+const ln = { class: "d-flex justify-space-between align-center" }, on = /* @__PURE__ */ J({
   __name: "switch",
   props: /* @__PURE__ */ W({
     hasDelete: { type: Boolean, default: !1 },
@@ -638,59 +638,59 @@ const ll = { class: "d-flex justify-space-between align-center" }, nl = /* @__PU
   emits: /* @__PURE__ */ W(["delete"], ["update:modelValue"]),
   setup(o, { emit: s }) {
     const t = G(o, "modelValue"), e = s;
-    return (l, n) => {
+    return (n, l) => {
       const i = $("v-switch"), a = $("v-btn");
-      return S(), H("div", ll, [
-        A(i, {
+      return S(), H("div", ln, [
+        b(i, {
           modelValue: t.value,
-          "onUpdate:modelValue": n[0] || (n[0] = (r) => t.value = r),
+          "onUpdate:modelValue": l[0] || (l[0] = (r) => t.value = r),
           class: "ml-1",
           density: "compact",
           color: "primary",
           "hide-details": "",
-          readonly: l.readonly
+          readonly: n.readonly
         }, null, 8, ["modelValue", "readonly"]),
-        l.hasDelete ? (S(), B(a, {
+        n.hasDelete ? (S(), B(a, {
           key: 0,
           class: "mx-2",
           variant: "text",
           density: "compact",
           icon: C(re),
-          onClick: n[1] || (n[1] = z((r) => e("delete"), ["stop"]))
+          onClick: l[1] || (l[1] = z((r) => e("delete"), ["stop"]))
         }, null, 8, ["icon"])) : Y("", !0)
       ]);
     };
   }
 });
-function ol(o) {
-  return { renderUiSwitch: (t, e, l, n, i) => e.ui !== "switch" ? (console.assert(!1), h("div", "renderUiSwitch prop ui must be switch")) : h(nl, {
-    modelValue: le(
+function sn(o) {
+  return { renderUiSwitch: (t, e, n, l, i) => e.ui !== "switch" ? (console.assert(!1), h("div", "renderUiSwitch prop ui must be switch")) : h(on, {
+    modelValue: ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ) ?? !1,
     "onUpdate:modelValue": (a) => {
       oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     },
-    hasDelete: n !== void 0 && !i,
+    hasDelete: l !== void 0 && !i,
     onDelete: () => {
-      n === void 0 || i || (l.splice(n, 1), o(t.slice(0, 1), l));
+      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, 1), n));
     },
     readonly: e.readonly
   }) };
 }
-const sl = { class: "d-flex justify-space-between align-center" }, il = /* @__PURE__ */ J({
+const rn = { class: "d-flex justify-space-between align-center" }, un = /* @__PURE__ */ J({
   __name: "select",
   props: /* @__PURE__ */ W({
     hasDelete: { type: Boolean, default: !1 },
@@ -702,17 +702,17 @@ const sl = { class: "d-flex justify-space-between align-center" }, il = /* @__PU
   }),
   emits: /* @__PURE__ */ W(["delete"], ["update:modelValue"]),
   setup(o, { emit: s }) {
-    const { t } = te(), e = G(o, "modelValue"), l = s, n = Te(), i = K(() => {
+    const { t } = te(), e = G(o, "modelValue"), n = s, l = Te(), i = K(() => {
       var r;
       const a = [];
-      return (r = Ye[n.value]) == null || r.items[o.items].forEach(({ title: u, value: g }) => {
+      return (r = Ye[l.value]) == null || r.items[o.items].forEach(({ title: u, value: g }) => {
         a.push({ title: t(u), value: g });
       }), a;
     });
     return (a, r) => {
-      const u = $("v-select"), g = $("v-btn"), d = ne("ripple");
-      return S(), H("div", sl, [
-        ee(A(u, {
+      const u = $("v-select"), g = $("v-btn"), d = le("ripple");
+      return S(), H("div", rn, [
+        ee(b(u, {
           modelValue: e.value,
           "onUpdate:modelValue": r[0] || (r[0] = (f) => e.value = f),
           density: "compact",
@@ -734,42 +734,42 @@ const sl = { class: "d-flex justify-space-between align-center" }, il = /* @__PU
           variant: "text",
           density: "compact",
           icon: C(re),
-          onClick: r[1] || (r[1] = z((f) => l("delete"), ["stop"]))
+          onClick: r[1] || (r[1] = z((f) => n("delete"), ["stop"]))
         }, null, 8, ["icon"])) : Y("", !0)
       ]);
     };
   }
 });
-function rl(o) {
-  return { renderUiSelect: (t, e, l, n, i) => e.ui !== "select" ? (console.assert(!1), h("div", "renderUiSelect prop ui must be select")) : h(il, {
-    modelValue: le(
+function an(o) {
+  return { renderUiSelect: (t, e, n, l, i) => e.ui !== "select" ? (console.assert(!1), h("div", "renderUiSelect prop ui must be select")) : h(un, {
+    modelValue: ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ) ?? "",
     "onUpdate:modelValue": (a) => {
       oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     },
-    hasDelete: n !== void 0 && !i,
+    hasDelete: l !== void 0 && !i,
     onDelete: () => {
-      n === void 0 || i || (l.splice(n, 1), o(t.slice(0, -1), l));
+      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
     },
     items: e.items,
     readonly: e.readonly
   }) };
 }
-const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-grey ml-1" }, cl = /* @__PURE__ */ J({
+const cn = { class: "text-subtitle-2 ml-1" }, dn = { class: "text-caption text-grey ml-1" }, fn = /* @__PURE__ */ J({
   __name: "group",
   props: {
     id: {},
@@ -779,33 +779,33 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
   },
   emits: ["x-click"],
   setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), l = o, n = s, i = O(!1), a = K(() => ({
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = o, l = s, i = O(!1), a = K(() => ({
       background: i.value ? e.value : t.value,
       height: "30px",
       marginBottom: "1px",
       userSelect: "none"
     }));
     return (r, u) => {
-      const g = $("v-icon"), d = ne("ripple");
+      const g = $("v-icon"), d = le("ripple");
       return ee((S(), H("div", {
         class: "d-flex align-center cursor-pointer",
         style: I(a.value),
-        onClick: u[0] || (u[0] = (f) => n("x-click", l.id)),
+        onClick: u[0] || (u[0] = (f) => l("x-click", n.id)),
         onMouseover: u[1] || (u[1] = (f) => i.value = !0),
         onMouseout: u[2] || (u[2] = (f) => i.value = !1)
       }, [
-        A(g, {
-          icon: l.collapse ? C(Xe) : C(Fe),
+        b(g, {
+          icon: n.collapse ? C(Xe) : C(Fe),
           size: "small"
         }, null, 8, ["icon"]),
-        F("span", ul, Q(l.title), 1),
-        F("span", al, Q(l.count), 1)
+        F("span", cn, Q(n.title), 1),
+        F("span", dn, Q(n.count), 1)
       ], 36)), [
         [d]
       ]);
     };
   }
-}), dl = { class: "text-subtitle-1 ml-6" }, fl = /* @__PURE__ */ J({
+}), mn = { class: "text-subtitle-1 ml-6" }, vn = /* @__PURE__ */ J({
   __name: "item",
   props: {
     id: {},
@@ -813,31 +813,31 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
   },
   emits: ["x-click"],
   setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), l = o, n = s, i = O(!1), a = K(() => ({
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = o, l = s, i = O(!1), a = K(() => ({
       background: i.value ? e.value : t.value,
       height: "48px",
       marginBottom: "1px",
       userSelect: "none"
     }));
     return (r, u) => {
-      const g = ne("ripple");
+      const g = le("ripple");
       return ee((S(), H("div", {
         class: "d-flex align-center cursor-pointer",
         style: I(a.value),
-        onClick: u[0] || (u[0] = (d) => n("x-click", l.id)),
+        onClick: u[0] || (u[0] = (d) => l("x-click", n.id)),
         onMouseover: u[1] || (u[1] = (d) => i.value = !0),
         onMouseout: u[2] || (u[2] = (d) => i.value = !1)
       }, [
-        F("span", dl, Q(l.title), 1)
+        F("span", mn, Q(n.title), 1)
       ], 36)), [
         [g]
       ]);
     };
   }
-}), ml = { key: 0 }, vl = {
+}), pn = { key: 0 }, yn = {
   key: 1,
   class: "text-body-2 text-grey ml-3"
-}, pl = /* @__PURE__ */ J({
+}, gn = /* @__PURE__ */ J({
   __name: "index",
   props: {
     modelValue: {},
@@ -847,34 +847,34 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
   },
   emits: ["update:modelValue", "update:open"],
   setup(o) {
-    const { t: s } = te(), t = G(o, "modelValue"), e = G(o, "open"), l = et(), n = (a) => {
-      const r = ze(l, a);
-      r && Ct(l, a, !r.collapse);
+    const { t: s } = te(), t = G(o, "modelValue"), e = G(o, "open"), n = et(), l = (a) => {
+      const r = ze(n, a);
+      r && Ct(n, a, !r.collapse);
     }, i = (a) => {
       t.value = a, e.value = !1, ae.emit("refreshDepends");
     };
-    return (a, r) => C(l).length > 0 ? (S(), H("div", ml, [
-      (S(!0), H(Ve, null, Be(C(l), (u) => (S(), H(Ve, {
+    return (a, r) => C(n).length > 0 ? (S(), H("div", pn, [
+      (S(!0), H(Ve, null, Be(C(n), (u) => (S(), H(Ve, {
         key: u.id
       }, [
-        u.type === 0 ? (S(), B(cl, {
+        u.type === 0 ? (S(), B(fn, {
           key: 0,
           id: u.id,
           title: u.name,
           collapse: u.collapse,
           count: u.count ?? 0,
-          onXClick: n
+          onXClick: l
         }, null, 8, ["id", "title", "collapse", "count"])) : Y("", !0),
-        u.type === 1 && u.show ? (S(), B(fl, {
+        u.type === 1 && u.show ? (S(), B(vn, {
           key: 1,
           id: u.id,
           title: u.name,
           onXClick: i
         }, null, 8, ["id", "title"])) : Y("", !0)
       ], 64))), 128))
-    ])) : (S(), H("div", vl, Q(C(s)("x-prop-tree.noComp")), 1));
+    ])) : (S(), H("div", yn, Q(C(s)("x-prop-tree.noComp")), 1));
   }
-}), yl = { class: "text-subtitle-1 ml-3" }, gl = /* @__PURE__ */ J({
+}), hn = { class: "text-subtitle-1 ml-3" }, _n = /* @__PURE__ */ J({
   __name: "index",
   props: {
     modelValue: {},
@@ -882,10 +882,10 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
   },
   emits: ["update:modelValue"],
   setup(o) {
-    const { t: s } = te(), t = Pt(), { sysBarAvail: e } = Je(), { backgroundColor1: l } = ie(), n = G(o, "modelValue"), i = et(), a = K(() => {
+    const { t: s } = te(), t = Pt(), { sysBarAvail: e } = Je(), { backgroundColor1: n } = ie(), l = G(o, "modelValue"), i = et(), a = K(() => {
       let f = "100%";
       return t.mdAndUp.value && (f = "400px"), {
-        background: l.value,
+        background: n.value,
         width: f,
         height: "100%"
       };
@@ -898,9 +898,9 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
     }), u = K(() => ({
       height: "60px"
     })), g = K(() => {
-      if (!n.value)
+      if (!l.value)
         return s("x-runtime-lib.notSet");
-      const f = ze(i, n.value);
+      const f = ze(i, l.value);
       return f ? f.name : s("x-runtime-lib.compNotAvail");
     }), { open: d } = Se(`propTreeCompSelectDlg${we()}`);
     return De(() => {
@@ -917,7 +917,7 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
         onKeydown: m[6] || (m[6] = Ke(z((P) => d.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
         activator: R(({ props: P }) => [
-          A(k, Ae(P, {
+          b(k, be(P, {
             density: "comfortable",
             block: ""
           }), {
@@ -942,17 +942,17 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
                 color: "transparent",
                 height: 24
               })) : Y("", !0),
-              A(L, {
+              b(L, {
                 class: "d-flex align-center px-3",
                 color: "transparent",
                 height: 48
               }, {
                 default: R(() => [
-                  A(w, {
+                  b(w, {
                     icon: C(Ge),
                     onClick: m[0] || (m[0] = (P) => d.value = !1)
                   }, null, 8, ["icon"]),
-                  F("span", yl, Q(C(s)("x-prop-tree.dlg.compSelect.title")), 1)
+                  F("span", hn, Q(C(s)("x-prop-tree.dlg.compSelect.title")), 1)
                 ]),
                 _: 1
               }),
@@ -960,9 +960,9 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
                 class: "overflow-y-auto",
                 style: I(r.value)
               }, [
-                A(pl, {
-                  modelValue: n.value,
-                  "onUpdate:modelValue": m[1] || (m[1] = (P) => n.value = P),
+                b(gn, {
+                  modelValue: l.value,
+                  "onUpdate:modelValue": m[1] || (m[1] = (P) => l.value = P),
                   open: C(d),
                   "onUpdate:open": m[2] || (m[2] = (P) => pe(d) ? d.value = P : null)
                 }, null, 8, ["modelValue", "open"]),
@@ -978,30 +978,30 @@ const ul = { class: "text-subtitle-2 ml-1" }, al = { class: "text-caption text-g
     };
   }
 });
-function hl(o) {
-  return { renderUiCompSelect: (t, e, l, n, i) => e.ui !== "compSelect" ? (console.assert(!1), h("div", "renderUiCompSelect prop ui must be compSelect")) : h(gl, {
-    modelValue: le(
+function kn(o) {
+  return { renderUiCompSelect: (t, e, n, l, i) => e.ui !== "compSelect" ? (console.assert(!1), h("div", "renderUiCompSelect prop ui must be compSelect")) : h(_n, {
+    modelValue: ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ),
     "onUpdate:modelValue": (a) => {
       oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     }
   }) };
 }
-const _l = { class: "d-flex justify-space-between align-center" }, kl = /* @__PURE__ */ J({
+const Vn = { class: "d-flex justify-space-between align-center" }, Cn = /* @__PURE__ */ J({
   __name: "colorPicker",
   props: /* @__PURE__ */ W({
     hasDelete: { type: Boolean, default: !1 },
@@ -1012,7 +1012,7 @@ const _l = { class: "d-flex justify-space-between align-center" }, kl = /* @__PU
   }),
   emits: /* @__PURE__ */ W(["delete"], ["update:modelValue"]),
   setup(o, { emit: s }) {
-    const { t } = te(), e = G(o, "modelValue"), l = s, n = K(() => {
+    const { t } = te(), e = G(o, "modelValue"), n = s, l = K(() => {
       let r = "100%";
       return o.hasDelete && (r = "calc(100% - 37px)"), {
         width: r
@@ -1029,12 +1029,12 @@ const _l = { class: "d-flex justify-space-between align-center" }, kl = /* @__PU
         scrim: "transparent"
       }, {
         activator: R(({ props: m }) => [
-          F("div", _l, [
+          F("div", Vn, [
             F("div", {
               class: "flex-grow-1",
-              style: I(n.value)
+              style: I(l.value)
             }, [
-              A(g, Ae(m, {
+              b(g, be(m, {
                 density: "comfortable",
                 color: e.value,
                 block: "",
@@ -1052,12 +1052,12 @@ const _l = { class: "d-flex justify-space-between align-center" }, kl = /* @__PU
               variant: "text",
               density: "compact",
               icon: C(re),
-              onClick: u[0] || (u[0] = z((k) => l("delete"), ["stop"]))
+              onClick: u[0] || (u[0] = z((k) => n("delete"), ["stop"]))
             }, null, 8, ["icon"])) : Y("", !0)
           ])
         ]),
         default: R(() => [
-          A(d, {
+          b(d, {
             modelValue: e.value,
             "onUpdate:modelValue": u[1] || (u[1] = (m) => e.value = m),
             mode: "hexa",
@@ -1070,35 +1070,35 @@ const _l = { class: "d-flex justify-space-between align-center" }, kl = /* @__PU
     };
   }
 });
-function Vl(o) {
-  return { renderUiColorPicker: (t, e, l, n, i) => e.ui !== "colorPicker" ? (console.assert(!1), h("div", "renderUiColorPicker prop ui must be colorPicker")) : h(kl, {
-    modelValue: le(
+function Sn(o) {
+  return { renderUiColorPicker: (t, e, n, l, i) => e.ui !== "colorPicker" ? (console.assert(!1), h("div", "renderUiColorPicker prop ui must be colorPicker")) : h(Cn, {
+    modelValue: ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ),
     "onUpdate:modelValue": (a) => {
       oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     },
-    hasDelete: n !== void 0 && !i,
+    hasDelete: l !== void 0 && !i,
     onDelete: () => {
-      n === void 0 || i || (l.splice(n, 1), o(t.slice(0, -1), l));
+      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
     },
     readonly: e.readonly
   }) };
 }
-const Cl = { class: "d-flex justify-space-between align-center my-2" }, Sl = { class: "flex-grow-1" }, Ul = /* @__PURE__ */ J({
+const Un = { class: "d-flex justify-space-between align-center my-2" }, $n = { class: "flex-grow-1" }, xn = /* @__PURE__ */ J({
   __name: "multiTypes",
   props: /* @__PURE__ */ W({
     hasDelete: { type: Boolean, default: !1 },
@@ -1109,9 +1109,9 @@ const Cl = { class: "d-flex justify-space-between align-center my-2" }, Sl = { c
   }),
   emits: /* @__PURE__ */ W(["delete"], ["update:modelValue"]),
   setup(o, { emit: s }) {
-    const { t } = te(), e = G(o, "modelValue"), l = s, n = Te(), i = K(() => {
+    const { t } = te(), e = G(o, "modelValue"), n = s, l = Te(), i = K(() => {
       var f;
-      return (f = Ye[n.value]) == null ? void 0 : f.types[o.types];
+      return (f = Ye[l.value]) == null ? void 0 : f.types[o.types];
     }), a = O(0), r = K(() => {
       var m;
       const f = [];
@@ -1141,10 +1141,10 @@ const Cl = { class: "d-flex justify-space-between align-center my-2" }, Sl = { c
       ((m = u.value) == null ? void 0 : m.ui) === "pixelInput" ? e.value = f + "px" : ((k = u.value) == null ? void 0 : k.ui) === "percentInput" && (e.value = f + "%");
     }), (f, m) => {
       var P, _;
-      const k = $("v-select"), L = $("v-number-input"), w = $("v-btn"), T = ne("ripple");
-      return S(), H("div", Cl, [
-        F("div", Sl, [
-          ee(A(k, {
+      const k = $("v-select"), L = $("v-number-input"), w = $("v-btn"), T = le("ripple");
+      return S(), H("div", Un, [
+        F("div", $n, [
+          ee(b(k, {
             modelValue: a.value,
             "onUpdate:modelValue": [
               m[0] || (m[0] = (M) => a.value = M),
@@ -1189,41 +1189,41 @@ const Cl = { class: "d-flex justify-space-between align-center my-2" }, Sl = { c
           variant: "text",
           density: "compact",
           icon: C(re),
-          onClick: m[2] || (m[2] = z((M) => l("delete"), ["stop"]))
+          onClick: m[2] || (m[2] = z((M) => n("delete"), ["stop"]))
         }, null, 8, ["icon"])) : Y("", !0)
       ]);
     };
   }
 });
-function $l(o) {
-  return { renderUiMultiTypes: (t, e, l, n, i) => e.ui !== "multiTypes" ? (console.assert(!1), h("div", "renderUiMultiTypes prop ui must be multiTypes")) : h(Ul, {
-    modelValue: le(
+function Pn(o) {
+  return { renderUiMultiTypes: (t, e, n, l, i) => e.ui !== "multiTypes" ? (console.assert(!1), h("div", "renderUiMultiTypes prop ui must be multiTypes")) : h(xn, {
+    modelValue: ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ) ?? "",
     "onUpdate:modelValue": (a) => {
       oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     },
-    hasDelete: n !== void 0 && !i,
+    hasDelete: l !== void 0 && !i,
     onDelete: () => {
-      n === void 0 || i || (l.splice(n, 1), o(t.slice(0, -1), l));
+      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
     },
     types: e.types
   }) };
 }
-const xl = /* @__PURE__ */ J({
+const Mn = /* @__PURE__ */ J({
   __name: "editor",
   props: {
     modelValue: { required: !0 },
@@ -1235,7 +1235,7 @@ const xl = /* @__PURE__ */ J({
   },
   emits: ["update:modelValue", "update:lock", "update:scale"],
   setup(o, { expose: s }) {
-    const t = G(o, "modelValue"), e = G(o, "lock"), l = G(o, "scale"), n = _t(), i = kt(), a = Te(), r = Re("target"), u = () => {
+    const t = G(o, "modelValue"), e = G(o, "lock"), n = G(o, "scale"), l = _t(), i = kt(), a = Te(), r = Re("target"), u = () => {
       var f;
       const d = JSON.parse(t.value);
       (f = r.value) == null || f.load(d);
@@ -1248,16 +1248,16 @@ const xl = /* @__PURE__ */ J({
       ref: r,
       lock: e.value,
       "onUpdate:lock": f[0] || (f[0] = (m) => e.value = m),
-      scale: l.value,
-      "onUpdate:scale": f[1] || (f[1] = (m) => l.value = m),
+      scale: n.value,
+      "onUpdate:scale": f[1] || (f[1] = (m) => n.value = m),
       type: "json",
       version: C(a),
       locale: C(i),
-      dark: C(n),
+      dark: C(l),
       onReady: u
     }, null, 8, ["lock", "scale", "version", "locale", "dark"]));
   }
-}), Pl = { class: "text-subtitle-1" }, Ml = /* @__PURE__ */ J({
+}), wn = { class: "text-subtitle-1" }, Dn = /* @__PURE__ */ J({
   __name: "index",
   props: {
     modelValue: { required: !0 },
@@ -1265,11 +1265,11 @@ const xl = /* @__PURE__ */ J({
   },
   emits: ["update:modelValue"],
   setup(o) {
-    const { t: s } = te(), { sysBarAvail: t } = Je(), { backgroundColor0: e, backgroundColor1: l, backgroundColor2: n } = ie(), i = G(o, "modelValue"), a = O(!1), r = O(1), u = K(() => {
+    const { t: s } = te(), { sysBarAvail: t } = Je(), { backgroundColor0: e, backgroundColor1: n, backgroundColor2: l } = ie(), i = G(o, "modelValue"), a = O(!1), r = O(1), u = K(() => {
       let m = 48;
       return t.value && (m += 24), {
         position: "relative",
-        background: l.value,
+        background: n.value,
         height: `calc(100% - ${m}px)`
       };
     }), g = K(() => s("x-prop-tree.dlg.jsonObject.title")), { open: d } = Se(`propTreeJsonObjectDlg${we()}`);
@@ -1293,7 +1293,7 @@ const xl = /* @__PURE__ */ J({
         onKeydown: k[5] || (k[5] = Ke(z((_) => d.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
         activator: R(({ props: _ }) => [
-          A(L, Ae(_, {
+          b(L, be(_, {
             density: "comfortable",
             block: ""
           }), {
@@ -1304,7 +1304,7 @@ const xl = /* @__PURE__ */ J({
           }, 1040)
         ]),
         default: R(() => [
-          A(w, {
+          b(w, {
             color: C(e),
             width: "100%",
             height: "100%"
@@ -1312,30 +1312,30 @@ const xl = /* @__PURE__ */ J({
             default: R(() => [
               C(t) ? (S(), B(w, {
                 key: 0,
-                color: C(n),
+                color: C(l),
                 height: 24
               }, null, 8, ["color"])) : Y("", !0),
-              A(w, {
+              b(w, {
                 class: "d-flex align-center px-2",
-                color: C(n),
+                color: C(l),
                 height: 48
               }, {
                 default: R(() => [
-                  A(L, {
+                  b(L, {
                     variant: "text",
                     density: "comfortable",
                     icon: C(Ge),
                     onClick: k[0] || (k[0] = (_) => d.value = !1)
                   }, null, 8, ["icon"]),
-                  F("span", Pl, Q(C(s)("x-prop-tree.dlg.jsonObject.title")), 1),
-                  A(T)
+                  F("span", wn, Q(C(s)("x-prop-tree.dlg.jsonObject.title")), 1),
+                  b(T)
                 ]),
                 _: 1
               }, 8, ["color"]),
               F("div", {
                 style: I(u.value)
               }, [
-                A(xl, {
+                b(Mn, {
                   ref_key: "editor",
                   ref: f,
                   modelValue: i.value,
@@ -1355,30 +1355,30 @@ const xl = /* @__PURE__ */ J({
     };
   }
 });
-function wl(o) {
-  return { renderUiJsonEditor: (t, e, l, n, i) => e.ui !== "jsonEditor" ? h("div", "renderUiJsonObject prop ui must be jsonEditor") : h(Ml, {
-    modelValue: le(
+function bn(o) {
+  return { renderUiJsonEditor: (t, e, n, l, i) => e.ui !== "jsonEditor" ? h("div", "renderUiJsonObject prop ui must be jsonEditor") : h(Dn, {
+    modelValue: ne(
       t,
       e,
-      l,
-      o,
       n,
+      o,
+      l,
       i
     ) ?? "{}",
     "onUpdate:modelValue": (a) => {
       oe(
         t,
         e,
-        l,
+        n,
         a,
         o,
-        n,
+        l,
         i
       );
     }
   }) };
 }
-const Dl = /* @__PURE__ */ J({
+const An = /* @__PURE__ */ J({
   __name: "index",
   props: {
     unique: {},
@@ -1388,37 +1388,37 @@ const Dl = /* @__PURE__ */ J({
   },
   emits: ["change"],
   setup(o, { emit: s }) {
-    const { t } = te(), { backgroundColor1: e } = ie(), l = o, n = s, i = O("20px"), a = O("56px"), r = O("200px"), u = yt({}), g = O({}), d = (p, c) => {
-      qe(g, l.config, l.object), n("change", p, c);
+    const { t } = te(), { backgroundColor1: e } = ie(), n = o, l = s, i = O("20px"), a = O("56px"), r = O("200px"), u = yt({}), g = O({}), d = (p, c) => {
+      qe(g, n.config, n.object), l("change", p, c);
     };
     ue(
-      [() => l.config, () => l.object],
+      [() => n.config, () => n.object],
       () => {
-        qe(g, l.config, l.object, (p, c) => {
-          n("change", p, c);
+        qe(g, n.config, n.object, (p, c) => {
+          l("change", p, c);
         });
       },
       { immediate: !0 }
     );
-    const f = O(l.version);
+    const f = O(n.version);
     Ot(f), ue(
-      () => l.version,
+      () => n.version,
       () => {
-        f.value = l.version;
+        f.value = n.version;
       }
     );
-    const m = O(l.config);
+    const m = O(n.config);
     qt(m), ue(
-      () => l.config,
+      () => n.config,
       () => {
-        m.value = l.config;
+        m.value = n.config;
       }
     );
-    const k = O(l.object);
+    const k = O(n.object);
     Kt(k), ue(
-      () => l.object,
+      () => n.object,
       () => {
-        k.value = l.object;
+        k.value = n.object;
       }
     ), Jt(g), Xt(d);
     const L = O([]);
@@ -1451,7 +1451,7 @@ const Dl = /* @__PURE__ */ J({
     }), ht(() => {
       _();
     });
-    const { renderProp: M } = Wt(g, a, r), { renderUiDummy: N } = Qt(d), { renderUiStrInput: Z } = jt(d), { renderUiNumInput: Pe } = tl(d), { renderUiSwitch: tt } = ol(d), { renderUiSelect: lt } = rl(d), { renderUiColorPicker: nt } = Vl(d), { renderUiJsonEditor: ot } = wl(d), { renderUiMultiTypes: st } = $l(d), { renderUiCompSelect: it } = hl(d), ye = (p, c, y, v, V, x) => (p = He(p), V !== void 0 ? (p.push(V), x && p.push(c.key)) : p.push(c.key), c.ui ? c.array && v ? at(p, c, y, v, V, x) : ct(p, c, y, V, x) : c.array ? rt(p, c, y, v, V, x) : ut(
+    const { renderProp: M } = Qt(g, a, r), { renderUiDummy: N } = Zt(d), { renderUiStrInput: Z } = It(d), { renderUiNumInput: Pe } = nn(d), { renderUiSwitch: tt } = sn(d), { renderUiSelect: nt } = an(d), { renderUiColorPicker: lt } = Sn(d), { renderUiJsonEditor: ot } = bn(d), { renderUiMultiTypes: st } = Pn(d), { renderUiCompSelect: it } = kn(d), ye = (p, c, y, v, V, x) => (p = He(p), V !== void 0 ? (p.push(V), x && p.push(c.key)) : p.push(c.key), c.ui ? c.array && v ? at(p, c, y, v, V, x) : ct(p, c, y, V, x) : c.array ? rt(p, c, y, v, V, x) : ut(
       p,
       c,
       y,
@@ -1476,8 +1476,8 @@ const Dl = /* @__PURE__ */ J({
         onCollapse: (U) => {
           v.collapse = U;
         },
-        onMenu: (U, b) => {
-          ae.emit("propTreeMenu", { x: U, y: b, keys: p });
+        onMenu: (U, A) => {
+          ae.emit("propTreeMenu", { x: U, y: A, keys: p });
         },
         onCreate: () => {
           D.push({}), d(p, D);
@@ -1491,29 +1491,29 @@ const Dl = /* @__PURE__ */ J({
         },
         (() => {
           const U = [];
-          for (let b = 0; b < D.length; b++) {
+          for (let A = 0; A < D.length; A++) {
             if (!Me(v.children)) {
               console.assert(!1);
               break;
             }
-            v.children[b] || v.children.push({
+            v.children[A] || v.children.push({
               collapse: !0,
               children: {}
             });
-            const ge = [...p, b], he = v.children[b];
-            let Le = `[${b + 1}]`;
-            v.children[b].collapse && ce(g.value, ge) && (Le += " *");
+            const ge = [...p, A], he = v.children[A];
+            let Le = `[${A + 1}]`;
+            v.children[A].collapse && ce(g.value, ge) && (Le += " *");
             const ft = h(ke, {
               title: Le,
-              collapse: v.children[b].collapse,
+              collapse: v.children[A].collapse,
               hasDelete: !0,
-              index: b,
+              index: A,
               onCollapse: (j) => {
                 if (!Me(v.children)) {
                   console.assert(!1);
                   return;
                 }
-                v.children[b].collapse = j;
+                v.children[A].collapse = j;
               },
               onMenu: (j, se) => {
                 ae.emit("propTreeMenu", { x: j, y: se, keys: ge });
@@ -1548,16 +1548,16 @@ const Dl = /* @__PURE__ */ J({
                   const vt = ye(
                     p,
                     se,
-                    D[b],
+                    D[A],
                     he.children[se.key],
-                    b,
+                    A,
                     !0
                   );
                   j.push(vt);
                 }), j;
               })()
             );
-            v.children[b].collapse || U.push(mt);
+            v.children[A].collapse || U.push(mt);
           }
           return U;
         })()
@@ -1614,13 +1614,13 @@ const Dl = /* @__PURE__ */ J({
               collapse: !0,
               children: !U.ui && U.array ? [] : {}
             });
-            const b = ye(
+            const A = ye(
               p,
               U,
               (typeof y[c.key] != "object" && (y[c.key] = {}, d(p, y[c.key])), y[c.key]),
               v.children[U.key]
             );
-            X.push(b);
+            X.push(A);
           }), X;
         })()
       );
@@ -1654,8 +1654,8 @@ const Dl = /* @__PURE__ */ J({
         onCollapse: (U) => {
           v.collapse = U;
         },
-        onMenu: (U, b) => {
-          ae.emit("propTreeMenu", { x: U, y: b, keys: p });
+        onMenu: (U, A) => {
+          ae.emit("propTreeMenu", { x: U, y: A, keys: p });
         },
         onCreate: () => {
           D.push(q(c, !0)), d(p, D);
@@ -1669,8 +1669,8 @@ const Dl = /* @__PURE__ */ J({
         },
         (() => {
           const U = [];
-          for (let b = 0; b < D.length; b++) {
-            const ge = ye(p, c, D, void 0, b, !1);
+          for (let A = 0; A < D.length; A++) {
+            const ge = ye(p, c, D, void 0, A, !1);
             U.push(ge);
           }
           return U;
@@ -1692,7 +1692,7 @@ const Dl = /* @__PURE__ */ J({
       if (!c.ui)
         return console.assert(!1), h("div", "renderLeafScalar prop ui must be valid");
       let x;
-      return c.ui === "dummy" ? x = N(p, c, y, v, V) : c.ui === "strInput" ? x = Z(p, c, y, v, V) : c.ui === "numInput" ? x = Pe(p, c, y, v, V) : c.ui === "switch" ? x = tt(p, c, y, v, V) : c.ui === "select" ? x = lt(p, c, y, v, V) : c.ui === "colorPicker" ? x = nt(p, c, y, v, V) : c.ui === "jsonEditor" ? x = ot(p, c, y, v, V) : c.ui === "multiTypes" ? x = st(p, c, y, v, V) : c.ui === "compSelect" ? x = it(p, c, y, v, V) : console.assert(!1, "renderLeafScalar not implemented"), x ? M(p, c, x) : h("div");
+      return c.ui === "dummy" ? x = N(p, c, y, v, V) : c.ui === "strInput" ? x = Z(p, c, y, v, V) : c.ui === "numInput" ? x = Pe(p, c, y, v, V) : c.ui === "switch" ? x = tt(p, c, y, v, V) : c.ui === "select" ? x = nt(p, c, y, v, V) : c.ui === "colorPicker" ? x = lt(p, c, y, v, V) : c.ui === "jsonEditor" ? x = ot(p, c, y, v, V) : c.ui === "multiTypes" ? x = st(p, c, y, v, V) : c.ui === "compSelect" ? x = it(p, c, y, v, V) : console.assert(!1, "renderLeafScalar not implemented"), x ? M(p, c, x) : h("div");
     }, dt = () => h(
       "div",
       {
@@ -1703,15 +1703,15 @@ const Dl = /* @__PURE__ */ J({
       },
       (() => {
         const p = [];
-        if (l.unique && l.config.length > 0 && l.object) {
-          u[l.unique] || (u[l.unique] = {});
-          const c = u[l.unique];
-          l.config.forEach((y) => {
+        if (n.unique && n.config.length > 0 && n.object) {
+          u[n.unique] || (u[n.unique] = {});
+          const c = u[n.unique];
+          n.config.forEach((y) => {
             c[y.key] || (c[y.key] = {
               collapse: !0,
               children: !y.ui && y.array ? [] : {}
             });
-            const v = ye([], y, l.object, c[y.key]);
+            const v = ye([], y, n.object, c[y.key]);
             p.push(v);
           });
         }
@@ -1719,21 +1719,21 @@ const Dl = /* @__PURE__ */ J({
       })()
     );
     return (p, c) => (S(), H(Ve, null, [
-      A(dt),
-      A(Gt, {
-        config: l.config,
-        object: l.object,
+      b(dt),
+      b(Gt, {
+        config: n.config,
+        object: n.object,
         "prop-states": g.value
       }, null, 8, ["config", "object", "prop-states"])
     ], 64));
   }
-}), Al = (o) => {
-  o.component("XPropTree", Dl);
-}, bl = (o, s, t) => {
+}), Tn = (o) => {
+  o.component("XPropTree", An);
+}, Ln = (o, s, t) => {
   const e = o[s];
-  return e ? typeof e == "function" ? e() : Promise.resolve(e) : new Promise((l, n) => {
+  return e ? typeof e == "function" ? e() : Promise.resolve(e) : new Promise((n, l) => {
     (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
-      n.bind(
+      l.bind(
         null,
         new Error(
           "Unknown variable dynamic import: " + s + (s.split("/").length !== t ? ". Note that variables only represent file names one level deep." : "")
@@ -1742,11 +1742,11 @@ const Dl = /* @__PURE__ */ J({
     );
   });
 };
-async function Jl(o) {
-  return (await bl(/* @__PURE__ */ Object.assign({ "./locales/en/index.ts": () => import("./i18n-en.n11iysmh.js"), "./locales/zhHans/index.ts": () => import("./i18n-zhHans.hr18mfah.js") }), `./locales/${o}/index.ts`, 4)).default;
+async function Xn(o) {
+  return (await Ln(/* @__PURE__ */ Object.assign({ "./locales/en/index.ts": () => import("./i18n-en.n11iysmh.js"), "./locales/zhHans/index.ts": () => import("./i18n-zhHans.hr18mfah.js") }), `./locales/${o}/index.ts`, 4)).default;
 }
-const Hl = { install: Al };
+const Fn = { install: Tn };
 export {
-  Hl as default,
-  Jl as loadLocaleMessagePropTree
+  Fn as default,
+  Xn as loadLocaleMessagePropTree
 };