x-prop-tree 0.7.4 → 0.7.5

package/dist/index.js

@@ -1,13 +1,13 @@
-import { provide as ce, inject as de, defineComponent as R, ref as O, computed as K, resolveComponent as S, createBlock as B, openBlock as k, unref as T, isRef as ve, withCtx as J, createVNode as M, createElementBlock as E, Fragment as ke, renderList as qe, createTextVNode as Ve, toDisplayString as W, resolveDirective as le, withDirectives as ee, withModifiers as F, normalizeStyle as I, createElementVNode as X, createCommentVNode as G, renderSlot as dt, h, mergeModels as Y, useModel as z, useId as Me, onUnmounted as we, withKeys as Be, mergeProps as De, watchEffect as Le, watch as re, useTemplateRef as Ke, reactive as ft, onMounted as mt, onBeforeUnmount as vt } from "vue";
-import { useI18n as te } from "vue-i18n";
-import { useViewStack as Ce, useColor as ie, eventBus as ue, useSystem as Je, injectDark as pt, injectLocale as yt } from "x-essential-lib";
-import { c as Re, i as Se, r as Ee, v as gt, d as ht } from "./vendor.n68iqk3a.js";
-import { getPropDefault as q, pkgs as He, parsePixelStr as _t, parsePercentStr as kt } from "x-runtime-lib";
-import { globalState as Vt } from "x-state-lib";
-import { useDisplay as Ct } from "vuetify";
-import { XBlockly as St } from "x-block-lib";
-const he = (o, s) => {
-  let t = { key: "", name: "", children: o };
+import { provide as ce, inject as de, defineComponent as R, ref as O, computed as K, resolveComponent as S, createBlock as B, openBlock as k, unref as T, isRef as ve, withCtx as J, createVNode as M, createElementBlock as E, Fragment as ke, renderList as Be, createTextVNode as Ve, toDisplayString as W, resolveDirective as le, withDirectives as te, withModifiers as F, normalizeStyle as ee, createElementVNode as X, createCommentVNode as G, renderSlot as dt, h, mergeModels as Y, useModel as z, useId as Me, onUnmounted as we, withKeys as Ke, mergeProps as De, watchEffect as Ne, watch as re, useTemplateRef as Je, reactive as ft, onMounted as mt, onBeforeUnmount as vt } from "vue";
+import { useI18n as Z } from "vue-i18n";
+import { useViewStack as Ce, useColor as ie, eventBus as ue, useSystem as be, openPromptDlg as pt, injectDark as yt, injectLocale as gt } from "x-essential-lib";
+import { c as Re, i as Se, r as Ee, v as ht, d as _t } from "./vendor.n68iqk3a.js";
+import { getPropDefault as q, pkgs as He, parsePixelStr as kt, parsePercentStr as Vt } from "x-runtime-lib";
+import { globalState as Ct } from "x-state-lib";
+import { useDisplay as St } from "vuetify";
+import { XBlockly as Ut } from "x-block-lib";
+const he = (l, s) => {
+  let t = { key: "", name: "", children: l };
   return s.forEach((e) => {
     if (typeof e != "number") {
       if (!t) {
@@ -21,8 +21,8 @@ const he = (o, s) => {
       t = t.children.find((n) => n.key === e);
     }
   }), t;
-}, me = (o, s) => {
-  let t = o;
+}, me = (l, s) => {
+  let t = l;
   return s.forEach((e) => {
     if (!t) {
       console.assert(!1, `unpkgObject object must be valid keys=${s}`);
@@ -30,7 +30,7 @@ const he = (o, s) => {
     }
     t = t[e];
   }), t;
-}, Ne = (o) => !(o instanceof Array), Pe = (o) => o instanceof Array, Ut = (o, s) => {
+}, Oe = (l) => !(l instanceof Array), Pe = (l) => l instanceof Array, $t = (l, s) => {
   const t = (e, n) => {
     if (e.ui !== n.ui || e.array !== n.array)
       return !1;
@@ -38,125 +38,125 @@ const he = (o, s) => {
       return !0;
     if (e.children.length !== n.children.length)
       return !1;
-    for (let l = 0; l < e.children.length; l++)
-      if (!t(e.children[l], n.children[l]))
+    for (let o = 0; o < e.children.length; o++)
+      if (!t(e.children[o], n.children[o]))
         return !1;
     return !0;
   };
-  return t(o, s);
-}, Ae = (o) => !(o instanceof Array), Ue = (o) => o instanceof Array, $t = [
+  return t(l, s);
+}, Ae = (l) => !(l instanceof Array), Ue = (l) => l instanceof Array, xt = [
   ["basic", "id"],
   ["basic", "name"]
-], xt = (o) => $t.find((s) => Se(o, s)), $e = (o, s, t, e, n, l, i) => (o = Re(o), l !== void 0 ? (o.push(l), i && o.push(s.key)) : o.push(s.key), xt(o) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && Ue(e.children) ? wt(
-  o,
+], Pt = (l) => xt.find((s) => Se(l, s)), $e = (l, s, t, e, n, o, i) => (l = Re(l), o !== void 0 ? (l.push(o), i && l.push(s.key)) : l.push(s.key), Pt(l) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && Ue(e.children) ? Dt(
+  l,
   s,
   t,
   e,
   n,
-  l,
-  i
-) : Dt(s, t, e, l, i) : s.array ? Pt(
   o,
+  i
+) : bt(s, t, e, o, i) : s.array ? Mt(
+  l,
   s,
   t,
   e,
   n,
-  l,
-  i
-) : Mt(
   o,
+  i
+) : wt(
+  l,
   s,
   t,
   e,
   n,
-  l,
+  o,
   i
-)), Pt = (o, s, t, e, n, l, i) => {
+)), Mt = (l, s, t, e, n, o, i) => {
   if (s.ui)
     return console.assert(!1, "execPropBranchArray prop ui must be invalid"), !1;
   if (!s.array)
     return console.assert(!1, "execPropBranchArray prop array must be valid"), !1;
   if (!e.children || !Ue(e.children))
     return console.assert(!1, "execPropBranchArray state children must be array"), !1;
-  let a;
-  l !== void 0 && !i ? (t[l] instanceof Array || (t[l] = q(s), n?.(o, t[l])), a = t[l]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n?.(o, t[s.key])), a = t[s.key]), e.change = !1;
-  for (let u = 0; u < a.length; u++) {
+  let u;
+  o !== void 0 && !i ? (t[o] instanceof Array || (t[o] = q(s), n?.(l, t[o])), u = t[o]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n?.(l, t[s.key])), u = t[s.key]), e.change = !1;
+  for (let r = 0; r < u.length; r++) {
     e.children.push({
       change: !1,
       children: {}
     });
-    const r = e.children[u];
+    const a = e.children[r];
     s.children.forEach((y) => {
-      if (!r.children || !Ae(r.children)) {
+      if (!a.children || !Ae(a.children)) {
         console.assert(!1);
         return;
       }
-      r.children[y.key] = {
+      a.children[y.key] = {
         change: !1,
         children: y.array ? [] : {}
       }, $e(
-        o,
+        l,
         y,
-        a[u],
-        r.children[y.key],
+        u[r],
+        a.children[y.key],
         n,
-        u,
+        r,
         !0
-      ) && (r.change = !0), r.change && (e.change = !0);
+      ) && (a.change = !0), a.change && (e.change = !0);
     });
   }
-  return e.change || (e.change = !Se(a, q(s))), e.change;
-}, Mt = (o, s, t, e, n, l, i) => {
+  return e.change || (e.change = !Se(u, q(s))), e.change;
+}, wt = (l, s, t, e, n, o, 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 || !Ae(e.children))
     return console.assert(!1, "execPropBranchScalar state children must be map"), !1;
-  let a;
-  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 u = 0; u < s.children.length; u++) {
-    const r = s.children[u];
-    e.children[r.key] = {
+  let u;
+  o !== void 0 && !i ? (t[o] || (t[o] = {}), u = t[o]) : (t[s.key] || (t[s.key] = {}), u = t[s.key]), e.change = !1;
+  for (let r = 0; r < s.children.length; r++) {
+    const a = s.children[r];
+    e.children[a.key] = {
       change: !1,
-      children: r.array ? [] : {}
-    }, $e(o, r, a, e.children[r.key], n) && (e.change = !0);
+      children: a.array ? [] : {}
+    }, $e(l, a, u, e.children[a.key], n) && (e.change = !0);
   }
   return e.change;
-}, wt = (o, s, t, e, n, l, i) => {
+}, Dt = (l, s, t, e, n, o, i) => {
   if (!s.ui)
     return console.assert(!1, "execPropLeafArray prop ui must be valid"), !1;
   if (!s.array)
     return console.assert(!1, "execPropLeafArray prop aray must be valid"), !1;
   if (!e.children || !Ue(e.children))
     return console.assert(!1, "execPropLeafArray state children must be array"), !1;
-  let a;
-  l !== void 0 && !i ? (t[l] instanceof Array || (t[l] = q(s), n?.(o, t[l])), a = t[l]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n?.(o, t[s.key])), a = t[s.key]), e.change = !1;
-  for (let u = 0; u < a.length; u++)
-    e.children[u] = {
+  let u;
+  o !== void 0 && !i ? (t[o] instanceof Array || (t[o] = q(s), n?.(l, t[o])), u = t[o]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n?.(l, t[s.key])), u = t[s.key]), e.change = !1;
+  for (let r = 0; r < u.length; r++)
+    e.children[r] = {
       change: !1,
       children: {}
-    }, $e(o, s, a, e.children[u], n, u, !1) && (e.change = !0);
-  return e.change || (e.change = !Se(a, q(s))), e.change;
-}, Dt = (o, s, t, e, n) => {
-  if (!o.ui)
+    }, $e(l, s, u, e.children[r], n, r, !1) && (e.change = !0);
+  return e.change || (e.change = !Se(u, q(s))), e.change;
+}, bt = (l, s, t, e, n) => {
+  if (!l.ui)
     return console.assert(!1, "execPropLeafScalar prop ui must be valid"), !1;
-  let l;
-  return e !== void 0 && !n ? l = s[e] : l = s[o.key], t.change = !Se(l, q(o, !0)), t.change;
-}, Oe = (o, s, t, e) => {
+  let o;
+  return e !== void 0 && !n ? o = s[e] : o = s[l.key], t.change = !Se(o, q(l, !0)), t.change;
+}, qe = (l, s, t, e) => {
   if (s.length <= 0 || !t) {
-    o.value = {};
+    l.value = {};
     return;
   }
   const n = {};
-  s.forEach((l) => {
-    n[l.key] = {
+  s.forEach((o) => {
+    n[o.key] = {
       change: !1,
-      children: l.array ? [] : {}
-    }, $e([], l, t, n[l.key], e);
-  }), o.value = n;
-}, ae = (o, s) => {
-  let t = { change: !1, children: o };
+      children: o.array ? [] : {}
+    }, $e([], o, t, n[o.key], e);
+  }), l.value = n;
+}, ae = (l, s) => {
+  let t = { change: !1, children: l };
   return s.forEach((e) => {
     if (!t)
       return console.assert(!1, `isPropChanged state must be valid keys=${s}`), !1;
@@ -165,79 +165,79 @@ const he = (o, s) => {
     typeof e == "string" ? Ae(t.children) && (t = t.children[e]) : Ue(t.children) && (t = t.children[e]);
   }), t?.change ?? !1;
 }, Xe = Symbol(), Fe = Symbol(), ze = Symbol(), Ge = Symbol(), Ye = Symbol(), We = Symbol();
-function At(o) {
-  ce(Xe, o);
+function At(l) {
+  ce(Xe, l);
 }
-function be() {
+function Te() {
   return de(Xe);
 }
-function bt(o) {
-  ce(Fe, o);
+function Tt(l) {
+  ce(Fe, l);
 }
-function Tt() {
+function Lt() {
   return de(Fe);
 }
-function Lt(o) {
-  ce(ze, o);
+function Nt(l) {
+  ce(ze, l);
 }
-function Nt() {
+function Ot() {
   return de(ze);
 }
-function Ot(o) {
-  ce(Ge, o);
+function qt(l) {
+  ce(Ge, l);
 }
-function qt() {
+function Bt() {
   return de(Ge);
 }
-function Bt(o) {
-  ce(Ye, o);
+function Kt(l) {
+  ce(Ye, l);
 }
-function Kt() {
+function Jt() {
   return de(Ye);
 }
-function Jt(o) {
-  ce(We, o);
+function Rt(l) {
+  ce(We, l);
 }
 function Qe() {
   return de(We);
 }
-const Rt = /* @__PURE__ */ R({
+const Et = /* @__PURE__ */ R({
   __name: "menu",
-  setup(o) {
-    const { t: s } = te(), t = Tt(), e = Nt(), n = qt(), l = Kt(), i = O(0), a = O(0), u = O([]), r = K(() => [i.value, a.value]), y = (P) => {
-      const D = () => !(u.value.length <= 0 || !ae(n.value, u.value)), U = () => {
-        const V = he(t.value, u.value);
+  setup(l) {
+    const { t: s } = Z(), t = Lt(), e = Ot(), n = Bt(), o = Jt(), i = O(0), u = O(0), r = O([]), a = K(() => [i.value, u.value]), y = (P) => {
+      const D = () => !(r.value.length <= 0 || !ae(n.value, r.value)), U = () => {
+        const V = he(t.value, r.value);
         if (V)
           if (V.ui) {
-            const A = me(e.value, u.value.slice(0, -1));
-            if (!A)
+            const b = me(e.value, r.value.slice(0, -1));
+            if (!b)
               return;
-            A[u.value[u.value.length - 1]] = q(V), l(u.value, A[u.value[u.value.length - 1]]);
+            b[r.value[r.value.length - 1]] = q(V), o(r.value, b[r.value[r.value.length - 1]]);
           } else if (V.array) {
-            const A = u.value[u.value.length - 1];
-            if (A === void 0) {
+            const b = r.value[r.value.length - 1];
+            if (b === void 0) {
               console.assert(!1, "invalid last key");
               return;
             }
-            if (typeof A == "string") {
-              const N = me(e.value, u.value.slice(0, -1));
+            if (typeof b == "string") {
+              const N = me(e.value, r.value.slice(0, -1));
               if (!N)
                 return;
-              N[u.value[u.value.length - 1]] = q(V), l(u.value, N[u.value[u.value.length - 1]]);
+              N[r.value[r.value.length - 1]] = q(V), o(r.value, N[r.value[r.value.length - 1]]);
             } else {
-              const N = me(e.value, u.value);
+              const N = me(e.value, r.value);
               if (!N)
                 return;
               V.children.forEach((Q) => {
-                N[Q.key] = q(V), l([...u.value, Q.key], N[Q.key]);
+                N[Q.key] = q(V), o([...r.value, Q.key], N[Q.key]);
               });
             }
           } else {
-            const A = me(e.value, u.value);
-            if (!A)
+            const b = me(e.value, r.value);
+            if (!b)
               return;
             V.children.forEach((N) => {
-              A[N.key] = q(V), l([...u.value, N.key], A[N.key]);
+              b[N.key] = q(V), o([...r.value, N.key], b[N.key]);
             });
           }
       };
@@ -247,7 +247,7 @@ const Rt = /* @__PURE__ */ R({
       });
     }, d = (P) => {
       const D = () => {
-        const U = he(t.value, u.value), V = me(e.value, u.value);
+        const U = he(t.value, r.value), V = me(e.value, r.value);
         localStorage.setItem("propTreeCopy", JSON.stringify({ prop: U, object: V }));
       };
       P.push({
@@ -260,10 +260,10 @@ const Rt = /* @__PURE__ */ R({
         if (!V)
           return !1;
         try {
-          const { prop: A } = JSON.parse(V), N = he(t.value, u.value);
-          return Ut(A, N);
-        } catch (A) {
-          console.error(A);
+          const { prop: b } = JSON.parse(V), N = he(t.value, r.value);
+          return $t(b, N);
+        } catch (b) {
+          console.error(b);
         }
         return !1;
       }, U = () => {
@@ -272,10 +272,10 @@ const Rt = /* @__PURE__ */ R({
         const V = localStorage.getItem("propTreeCopy");
         if (V)
           try {
-            const { object: A } = JSON.parse(V), N = he(t.value, u.value);
-            console.log(A, N);
-          } catch (A) {
-            console.error(A);
+            const { object: b } = JSON.parse(V), N = he(t.value, r.value);
+            console.log(b, N);
+          } catch (b) {
+            console.error(b);
           }
       };
       D() && P.push({
@@ -286,21 +286,21 @@ const Rt = /* @__PURE__ */ R({
       const P = [];
       return y(P), d(P), g(P), P;
     }), x = (P) => {
-      i.value = P.x, a.value = P.y, u.value = P.keys;
+      i.value = P.x, u.value = P.y, r.value = P.keys;
     }, { open: L } = Ce("propTreeMenu", x);
     return (P, D) => {
-      const U = S("v-list-item-title"), V = S("v-list-item"), A = S("v-list"), N = S("v-menu");
+      const U = S("v-list-item-title"), V = S("v-list-item"), b = S("v-list"), N = S("v-menu");
       return k(), B(N, {
         modelValue: T(L),
         "onUpdate:modelValue": D[0] || (D[0] = (Q) => ve(L) ? L.value = Q : null),
         "location-strategy": "connected",
-        target: r.value,
+        target: a.value,
         scrim: "transparent"
       }, {
         default: J(() => [
-          M(A, null, {
+          M(b, null, {
             default: J(() => [
-              (k(!0), E(ke, null, qe(v.value, (Q, xe) => (k(), B(V, {
+              (k(!0), E(ke, null, Be(v.value, (Q, xe) => (k(), B(V, {
                 key: xe,
                 link: "",
                 onClick: Q.func
@@ -323,7 +323,7 @@ const Rt = /* @__PURE__ */ R({
       }, 8, ["modelValue", "target"]);
     };
   }
-}), Et = { style: { pointerEvents: "none" } }, _e = /* @__PURE__ */ R({
+}), Ht = { style: { pointerEvents: "none" } }, _e = /* @__PURE__ */ R({
   __name: "title",
   props: {
     title: {},
@@ -333,34 +333,34 @@ const Rt = /* @__PURE__ */ R({
     index: { default: 0 }
   },
   emits: ["collapse", "menu", "create", "delete"],
-  setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), n = s, l = O(!1), i = K(() => ({
-      background: l.value ? e.value : t.value,
+  setup(l, { emit: s }) {
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = s, o = O(!1), i = K(() => ({
+      background: o.value ? e.value : t.value,
       height: "36px",
       marginBottom: "1px",
       userSelect: "none"
-    })), a = () => {
-      n("collapse", !o.collapse);
-    }, u = (r) => {
-      n("menu", r.clientX, r.clientY);
+    })), u = () => {
+      n("collapse", !l.collapse);
+    }, r = (a) => {
+      n("menu", a.clientX, a.clientY);
     };
-    return (r, y) => {
+    return (a, y) => {
       const d = S("v-icon"), g = S("v-spacer"), v = S("v-btn"), x = le("ripple");
-      return ee((k(), E("div", {
+      return te((k(), E("div", {
         class: "d-flex align-center cursor-pointer",
-        style: I(i.value),
-        onClick: a,
-        onContextmenu: F(u, ["self", "prevent"]),
-        onMouseover: y[2] || (y[2] = (L) => l.value = !0),
-        onMouseout: y[3] || (y[3] = (L) => l.value = !1)
+        style: ee(i.value),
+        onClick: u,
+        onContextmenu: F(r, ["self", "prevent"]),
+        onMouseover: y[2] || (y[2] = (L) => o.value = !0),
+        onMouseout: y[3] || (y[3] = (L) => o.value = !1)
       }, [
         M(d, {
           class: "mr-1",
-          icon: r.collapse ? "mdi-chevron-right" : "mdi-chevron-down"
+          icon: a.collapse ? "mdi-chevron-right" : "mdi-chevron-down"
         }, null, 8, ["icon"]),
-        X("span", Et, W(r.title), 1),
+        X("span", Ht, W(a.title), 1),
         M(g),
-        r.hasCreate ? (k(), B(v, {
+        a.hasCreate ? (k(), B(v, {
           key: 0,
           class: "mx-3",
           variant: "text",
@@ -368,62 +368,62 @@ const Rt = /* @__PURE__ */ R({
           icon: "mdi-plus",
           onClick: y[0] || (y[0] = F((L) => n("create"), ["stop"]))
         })) : G("", !0),
-        r.hasDelete ? (k(), B(v, {
+        a.hasDelete ? (k(), B(v, {
           key: 1,
           class: "mx-3",
           variant: "text",
           density: "compact",
           icon: "mdi-minus",
-          onClick: y[1] || (y[1] = F((L) => n("delete", r.index), ["stop"]))
+          onClick: y[1] || (y[1] = F((L) => n("delete", a.index), ["stop"]))
         })) : G("", !0)
       ], 36)), [
         [x]
       ]);
     };
   }
-}), Ht = /* @__PURE__ */ R({
+}), Xt = /* @__PURE__ */ R({
   __name: "entry",
   props: {
     minHeight: {}
   },
   emits: ["menu"],
-  setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), n = s, l = O(!1), i = K(() => ({
-      background: l.value ? e.value : t.value,
-      minHeight: o.minHeight,
+  setup(l, { emit: s }) {
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = s, o = O(!1), i = K(() => ({
+      background: o.value ? e.value : t.value,
+      minHeight: l.minHeight,
       paddingRight: "4px",
       marginBottom: "1px",
       userSelect: "none"
-    })), a = (u) => {
-      n("menu", u.clientX, u.clientY);
+    })), u = (r) => {
+      n("menu", r.clientX, r.clientY);
     };
-    return (u, r) => {
+    return (r, a) => {
       const y = le("ripple");
-      return ee((k(), E("div", {
+      return te((k(), E("div", {
         class: "d-flex justify-space-between align-center cursor-pointer",
-        style: I(i.value),
-        onContextmenu: F(a, ["self", "prevent"]),
-        onMouseover: r[0] || (r[0] = (d) => l.value = !0),
-        onMouseout: r[1] || (r[1] = (d) => l.value = !1)
+        style: ee(i.value),
+        onContextmenu: F(u, ["self", "prevent"]),
+        onMouseover: a[0] || (a[0] = (d) => o.value = !0),
+        onMouseout: a[1] || (a[1] = (d) => o.value = !1)
       }, [
-        dt(u.$slots, "default")
+        dt(r.$slots, "default")
       ], 36)), [
         [y]
       ]);
     };
   }
 });
-function Xt(o, s, t) {
-  const { t: e } = te();
-  return { renderProp: (l, i, a) => {
-    const u = l[l.length - 1];
-    let y = typeof u == "number" ? `[${u + 1}]` : e(i.name);
-    return ae(o.value, l) && (y += " *"), h(
-      Ht,
+function Ft(l, s, t) {
+  const { t: e } = Z();
+  return { renderProp: (o, i, u) => {
+    const r = o[o.length - 1];
+    let y = typeof r == "number" ? `[${r + 1}]` : e(i.name);
+    return ae(l.value, o) && (y += " *"), h(
+      Xt,
       {
         minHeight: s.value,
         onMenu: (d, g) => {
-          ue.emit("propTreeMenu", { x: d, y: g, keys: l });
+          ue.emit("propTreeMenu", { x: d, y: g, keys: o });
         }
       },
       () => [
@@ -431,53 +431,54 @@ function Xt(o, s, t) {
           style: { marginLeft: "4px", pointerEvents: "none" },
           innerHTML: y
         }),
-        h("div", { style: { width: t.value } }, a)
+        h("div", { style: { width: t.value } }, u)
       ]
     );
   } };
 }
-const ne = (o, s, t, e, n, l) => {
+const ne = (l, s, t, e, n, o) => {
   if (n !== void 0)
-    if (l) {
+    if (o) {
       if (t[s.key] === void 0) {
         const i = q(s);
-        i !== void 0 && (t[s.key] = i, e(o, t[s.key]));
+        i !== void 0 && (t[s.key] = i, e(l, t[s.key]));
       }
       return t[s.key];
     } else {
       if (t[n] === void 0) {
         const i = q(s, !0);
-        i !== void 0 && (t[n] = i, e(o, t[n]));
+        i !== void 0 && (t[n] = i, e(l, t[n]));
       }
       return t[n];
     }
   else {
     if (t[s.key] === void 0) {
       const i = q(s);
-      i !== void 0 && (t[s.key] = i, e(o, t[s.key]));
+      i !== void 0 && (t[s.key] = i, e(l, t[s.key]));
     }
     return t[s.key];
   }
-}, 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]));
+}, oe = (l, s, t, e, n, o, i) => {
+  if (o !== void 0)
+    i ? e !== t[s.key] && (t[s.key] = e, n(l, t[s.key])) : e !== t[o] && (t[o] = e, n(l, t[o]));
   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, n(o, t[s.key]));
+    let u = e;
+    (s.ui === "switch" || s.ui === "select" || s.ui === "colorPicker" || s.ui === "multiTypes" || s.ui === "compSelect") && (e || (u = void 0)), u !== t[s.key] && (t[s.key] = u, n(l, t[s.key]));
   }
 };
-function Ft(o) {
-  return { renderUiDummy: (t, e, n, l, i) => {
+function zt(l) {
+  return { renderUiDummy: (t, e, n, o, i) => {
     if (e.ui !== "dummy") {
       console.assert(!1, "renderUiDummy prop ui must be dummy");
       return;
     }
-    ne(t, e, n, o, l, i);
+    ne(t, e, n, l, o, i);
   } };
 }
-const zt = { class: "d-flex justify-space-between align-center" }, Gt = /* @__PURE__ */ R({
+const Gt = { class: "d-flex justify-space-between align-center" }, Yt = /* @__PURE__ */ R({
   __name: "strInput",
   props: /* @__PURE__ */ Y({
+    title: {},
     hasDelete: { type: Boolean, default: !1 },
     readonly: { type: Boolean, default: !1 }
   }, {
@@ -485,67 +486,78 @@ const zt = { class: "d-flex justify-space-between align-center" }, Gt = /* @__PU
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Y(["delete"], ["update:modelValue"]),
-  setup(o, { emit: s }) {
-    const t = z(o, "modelValue"), e = s;
-    return (n, l) => {
-      const i = S("v-text-field"), a = S("v-btn"), u = le("ripple");
-      return k(), E("div", zt, [
-        ee(M(i, {
-          modelValue: t.value,
-          "onUpdate:modelValue": l[0] || (l[0] = (r) => t.value = r),
+  setup(l, { emit: s }) {
+    const { isMobile: t } = be(), e = z(l, "modelValue"), n = s, o = async (i) => {
+      if (!i || l.readonly || !t())
+        return;
+      const u = await pt({
+        title: l.title,
+        value: e.value
+      });
+      u !== void 0 && (e.value = u);
+    };
+    return (i, u) => {
+      const r = S("v-text-field"), a = S("v-btn"), y = le("ripple");
+      return k(), E("div", Gt, [
+        te(M(r, {
+          modelValue: e.value,
+          "onUpdate:modelValue": u[0] || (u[0] = (d) => e.value = d),
           density: "compact",
           "hide-details": "",
           "single-line": "",
-          readonly: n.readonly
+          readonly: i.readonly,
+          "onUpdate:focused": o
         }, null, 8, ["modelValue", "readonly"]), [
           [
-            u,
+            y,
             void 0,
             void 0,
             { stop: !0 }
           ]
         ]),
-        n.hasDelete ? (k(), B(a, {
+        i.hasDelete ? (k(), B(a, {
           key: 0,
           class: "mx-2",
           variant: "text",
           density: "compact",
           icon: "mdi-minus",
-          onClick: l[1] || (l[1] = F((r) => e("delete"), ["stop"]))
+          onClick: u[1] || (u[1] = F((d) => n("delete"), ["stop"]))
         })) : G("", !0)
       ]);
     };
   }
 });
-function Yt(o) {
-  return { renderUiStrInput: (t, e, n, l, i) => e.ui !== "strInput" ? (console.assert(!1), h("div", "renderUiStrInput prop ui must be strInput")) : h(Gt, {
-    modelValue: e.static ? e.value : ne(
-      t,
+function Wt(l) {
+  const { t: s } = Z();
+  return { renderUiStrInput: (e, n, o, i, u) => n.ui !== "strInput" ? (console.assert(!1), h("div", "renderUiStrInput prop ui must be strInput")) : h(Yt, {
+    modelValue: n.static ? n.value : ne(
       e,
       n,
       o,
       l,
-      i
+      i,
+      u
     ),
-    "onUpdate:modelValue": (a) => {
-      e.static || oe(
-        t,
+    "onUpdate:modelValue": (r) => {
+      n.static || oe(
         e,
         n,
-        a,
         o,
+        r,
         l,
-        i
+        i,
+        u
       );
     },
-    hasDelete: l !== void 0 && !i,
+    title: s(n.name),
+    hasDelete: i !== void 0 && !u,
     onDelete: () => {
-      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
+      i === void 0 || u || (o.splice(i, 1), l(e.slice(0, -1), o));
     },
-    readonly: e.static || e.readonly
+    readonly: n.static || n.readonly
   }) };
 }
-const Wt = { class: "d-flex justify-space-between align-center" }, Qt = /* @__PURE__ */ R({
+const Qt = { class: "d-flex justify-space-between align-center" }, Zt = /* @__PURE__ */ R({
   __name: "numInput",
   props: /* @__PURE__ */ Y({
     hasDelete: { type: Boolean, default: !1 },
@@ -560,14 +572,14 @@ const Wt = { class: "d-flex justify-space-between align-center" }, Qt = /* @__PU
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Y(["delete"], ["update:modelValue"]),
-  setup(o, { emit: s }) {
-    const t = z(o, "modelValue"), e = s;
-    return (n, l) => {
-      const i = S("v-number-input"), a = S("v-btn"), u = le("ripple");
-      return k(), E("div", Wt, [
-        ee(M(i, {
+  setup(l, { emit: s }) {
+    const t = z(l, "modelValue"), e = s;
+    return (n, o) => {
+      const i = S("v-number-input"), u = S("v-btn"), r = le("ripple");
+      return k(), E("div", Qt, [
+        te(M(i, {
           modelValue: t.value,
-          "onUpdate:modelValue": l[0] || (l[0] = (r) => t.value = r),
+          "onUpdate:modelValue": o[0] || (o[0] = (a) => t.value = a),
           density: "compact",
           "control-variant": "stacked",
           precision: n.precision,
@@ -579,48 +591,48 @@ const Wt = { class: "d-flex justify-space-between align-center" }, Qt = /* @__PU
           readonly: n.readonly
         }, null, 8, ["modelValue", "precision", "min", "max", "step", "readonly"]), [
           [
-            u,
+            r,
             void 0,
             void 0,
             { stop: !0 }
           ]
         ]),
-        n.hasDelete ? (k(), B(a, {
+        n.hasDelete ? (k(), B(u, {
           key: 0,
           class: "mx-2",
           variant: "text",
           density: "compact",
           icon: "mdi-minus",
-          onClick: l[1] || (l[1] = F((r) => e("delete"), ["stop"]))
+          onClick: o[1] || (o[1] = F((a) => e("delete"), ["stop"]))
         })) : G("", !0)
       ]);
     };
   }
 });
-function Zt(o) {
-  return { renderUiNumInput: (t, e, n, l, i) => e.ui !== "numInput" ? (console.assert(!1), h("div", "renderUiNumInput prop ui must be numInput")) : h(Qt, {
+function jt(l) {
+  return { renderUiNumInput: (t, e, n, o, i) => e.ui !== "numInput" ? (console.assert(!1), h("div", "renderUiNumInput prop ui must be numInput")) : h(Zt, {
     modelValue: ne(
       t,
       e,
       n,
-      o,
       l,
+      o,
       i
     ),
-    "onUpdate:modelValue": (a) => {
+    "onUpdate:modelValue": (u) => {
       oe(
         t,
         e,
         n,
-        a,
-        o,
+        u,
         l,
+        o,
         i
       );
     },
-    hasDelete: l !== void 0 && !i,
+    hasDelete: o !== void 0 && !i,
     onDelete: () => {
-      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
+      o === void 0 || i || (n.splice(o, 1), l(t.slice(0, -1), n));
     },
     precision: e.precision,
     min: e.min,
@@ -629,7 +641,7 @@ function Zt(o) {
     readonly: e.readonly
   }) };
 }
-const jt = { class: "d-flex justify-space-between align-center" }, It = /* @__PURE__ */ R({
+const It = { class: "d-flex justify-space-between align-center" }, en = /* @__PURE__ */ R({
   __name: "switch",
   props: /* @__PURE__ */ Y({
     hasDelete: { type: Boolean, default: !1 },
@@ -639,61 +651,61 @@ const jt = { class: "d-flex justify-space-between align-center" }, It = /* @__PU
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Y(["delete"], ["update:modelValue"]),
-  setup(o, { emit: s }) {
-    const t = z(o, "modelValue"), e = s;
-    return (n, l) => {
-      const i = S("v-switch"), a = S("v-btn");
-      return k(), E("div", jt, [
+  setup(l, { emit: s }) {
+    const t = z(l, "modelValue"), e = s;
+    return (n, o) => {
+      const i = S("v-switch"), u = S("v-btn");
+      return k(), E("div", It, [
         M(i, {
           modelValue: t.value,
-          "onUpdate:modelValue": l[0] || (l[0] = (u) => t.value = u),
+          "onUpdate:modelValue": o[0] || (o[0] = (r) => t.value = r),
           class: "ml-1",
           density: "compact",
           color: "primary",
           "hide-details": "",
           readonly: n.readonly
         }, null, 8, ["modelValue", "readonly"]),
-        n.hasDelete ? (k(), B(a, {
+        n.hasDelete ? (k(), B(u, {
           key: 0,
           class: "mx-2",
           variant: "text",
           density: "compact",
           icon: "mdi-minus",
-          onClick: l[1] || (l[1] = F((u) => e("delete"), ["stop"]))
+          onClick: o[1] || (o[1] = F((r) => e("delete"), ["stop"]))
         })) : G("", !0)
       ]);
     };
   }
 });
-function en(o) {
-  return { renderUiSwitch: (t, e, n, l, i) => e.ui !== "switch" ? (console.assert(!1), h("div", "renderUiSwitch prop ui must be switch")) : h(It, {
+function tn(l) {
+  return { renderUiSwitch: (t, e, n, o, i) => e.ui !== "switch" ? (console.assert(!1), h("div", "renderUiSwitch prop ui must be switch")) : h(en, {
     modelValue: ne(
       t,
       e,
       n,
-      o,
       l,
+      o,
       i
     ) ?? !1,
-    "onUpdate:modelValue": (a) => {
+    "onUpdate:modelValue": (u) => {
       oe(
         t,
         e,
         n,
-        a,
-        o,
+        u,
         l,
+        o,
         i
       );
     },
-    hasDelete: l !== void 0 && !i,
+    hasDelete: o !== void 0 && !i,
     onDelete: () => {
-      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, 1), n));
+      o === void 0 || i || (n.splice(o, 1), l(t.slice(0, 1), n));
     },
     readonly: e.readonly
   }) };
 }
-const tn = { class: "d-flex justify-space-between align-center" }, nn = /* @__PURE__ */ R({
+const nn = { class: "d-flex justify-space-between align-center" }, ln = /* @__PURE__ */ R({
   __name: "select",
   props: /* @__PURE__ */ Y({
     hasDelete: { type: Boolean, default: !1 },
@@ -704,24 +716,24 @@ const tn = { class: "d-flex justify-space-between align-center" }, nn = /* @__PU
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Y(["delete"], ["update:modelValue"]),
-  setup(o, { emit: s }) {
-    const { t } = te(), e = z(o, "modelValue"), n = s, l = be(), i = K(() => {
-      const a = [];
-      return He[l.value]?.items[o.items].forEach(({ title: u, value: r }) => {
-        a.push({ title: t(u), value: r });
-      }), a;
+  setup(l, { emit: s }) {
+    const { t } = Z(), e = z(l, "modelValue"), n = s, o = Te(), i = K(() => {
+      const u = [];
+      return He[o.value]?.items[l.items].forEach(({ title: r, value: a }) => {
+        u.push({ title: t(r), value: a });
+      }), u;
     });
-    return (a, u) => {
-      const r = S("v-select"), y = S("v-btn"), d = le("ripple");
-      return k(), E("div", tn, [
-        ee(M(r, {
+    return (u, r) => {
+      const a = S("v-select"), y = S("v-btn"), d = le("ripple");
+      return k(), E("div", nn, [
+        te(M(a, {
           modelValue: e.value,
-          "onUpdate:modelValue": u[0] || (u[0] = (g) => e.value = g),
+          "onUpdate:modelValue": r[0] || (r[0] = (g) => e.value = g),
           density: "compact",
           items: i.value,
           "hide-details": "",
           "single-line": "",
-          readonly: a.readonly
+          readonly: u.readonly
         }, null, 8, ["modelValue", "items", "readonly"]), [
           [
             d,
@@ -730,48 +742,48 @@ const tn = { class: "d-flex justify-space-between align-center" }, nn = /* @__PU
             { stop: !0 }
           ]
         ]),
-        a.hasDelete ? (k(), B(y, {
+        u.hasDelete ? (k(), B(y, {
           key: 0,
           class: "mx-2",
           variant: "text",
           density: "compact",
           icon: "mdi-minus",
-          onClick: u[1] || (u[1] = F((g) => n("delete"), ["stop"]))
+          onClick: r[1] || (r[1] = F((g) => n("delete"), ["stop"]))
         })) : G("", !0)
       ]);
     };
   }
 });
-function ln(o) {
-  return { renderUiSelect: (t, e, n, l, i) => e.ui !== "select" ? (console.assert(!1), h("div", "renderUiSelect prop ui must be select")) : h(nn, {
+function on(l) {
+  return { renderUiSelect: (t, e, n, o, i) => e.ui !== "select" ? (console.assert(!1), h("div", "renderUiSelect prop ui must be select")) : h(ln, {
     modelValue: ne(
       t,
       e,
       n,
-      o,
       l,
+      o,
       i
     ) ?? "",
-    "onUpdate:modelValue": (a) => {
+    "onUpdate:modelValue": (u) => {
       oe(
         t,
         e,
         n,
-        a,
-        o,
+        u,
         l,
+        o,
         i
       );
     },
-    hasDelete: l !== void 0 && !i,
+    hasDelete: o !== void 0 && !i,
     onDelete: () => {
-      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
+      o === void 0 || i || (n.splice(o, 1), l(t.slice(0, -1), n));
     },
     items: e.items,
     readonly: e.readonly
   }) };
 }
-const on = { class: "text-subtitle-2 ml-1" }, sn = { class: "text-caption text-grey ml-1" }, rn = /* @__PURE__ */ R({
+const sn = { class: "text-subtitle-2 ml-1" }, rn = { class: "text-caption text-grey ml-1" }, un = /* @__PURE__ */ R({
   __name: "group",
   props: {
     id: {},
@@ -780,66 +792,66 @@ const on = { class: "text-subtitle-2 ml-1" }, sn = { class: "text-caption text-g
     count: {}
   },
   emits: ["x-click"],
-  setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), n = o, l = s, i = O(!1), a = K(() => ({
+  setup(l, { emit: s }) {
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = l, o = s, i = O(!1), u = K(() => ({
       background: i.value ? e.value : t.value,
       height: "30px",
       marginBottom: "1px",
       userSelect: "none"
     }));
-    return (u, r) => {
+    return (r, a) => {
       const y = S("v-icon"), d = le("ripple");
-      return ee((k(), E("div", {
+      return te((k(), E("div", {
         class: "d-flex align-center cursor-pointer",
-        style: I(a.value),
-        onClick: r[0] || (r[0] = (g) => l("x-click", n.id)),
-        onMouseover: r[1] || (r[1] = (g) => i.value = !0),
-        onMouseout: r[2] || (r[2] = (g) => i.value = !1)
+        style: ee(u.value),
+        onClick: a[0] || (a[0] = (g) => o("x-click", n.id)),
+        onMouseover: a[1] || (a[1] = (g) => i.value = !0),
+        onMouseout: a[2] || (a[2] = (g) => i.value = !1)
       }, [
         M(y, {
           icon: n.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
           size: "small"
         }, null, 8, ["icon"]),
-        X("span", on, W(n.title), 1),
-        X("span", sn, W(n.count), 1)
+        X("span", sn, W(n.title), 1),
+        X("span", rn, W(n.count), 1)
       ], 36)), [
         [d]
       ]);
     };
   }
-}), un = { class: "text-subtitle-1 ml-6" }, an = /* @__PURE__ */ R({
+}), an = { class: "text-subtitle-1 ml-6" }, cn = /* @__PURE__ */ R({
   __name: "item",
   props: {
     id: {},
     title: {}
   },
   emits: ["x-click"],
-  setup(o, { emit: s }) {
-    const { backgroundColor2: t, highlightColor: e } = ie(), n = o, l = s, i = O(!1), a = K(() => ({
+  setup(l, { emit: s }) {
+    const { backgroundColor2: t, highlightColor: e } = ie(), n = l, o = s, i = O(!1), u = K(() => ({
       background: i.value ? e.value : t.value,
       height: "48px",
       marginBottom: "1px",
       userSelect: "none"
     }));
-    return (u, r) => {
+    return (r, a) => {
       const y = le("ripple");
-      return ee((k(), E("div", {
+      return te((k(), E("div", {
         class: "d-flex align-center cursor-pointer",
-        style: I(a.value),
-        onClick: r[0] || (r[0] = (d) => l("x-click", n.id)),
-        onMouseover: r[1] || (r[1] = (d) => i.value = !0),
-        onMouseout: r[2] || (r[2] = (d) => i.value = !1)
+        style: ee(u.value),
+        onClick: a[0] || (a[0] = (d) => o("x-click", n.id)),
+        onMouseover: a[1] || (a[1] = (d) => i.value = !0),
+        onMouseout: a[2] || (a[2] = (d) => i.value = !1)
       }, [
-        X("span", un, W(n.title), 1)
+        X("span", an, W(n.title), 1)
       ], 36)), [
         [y]
       ]);
     };
   }
-}), cn = { key: 0 }, dn = {
+}), dn = { key: 0 }, fn = {
   key: 1,
   class: "text-body-2 text-grey ml-3"
-}, fn = /* @__PURE__ */ R({
+}, mn = /* @__PURE__ */ R({
   __name: "index",
   props: {
     modelValue: {},
@@ -848,61 +860,61 @@ const on = { class: "text-subtitle-2 ml-1" }, sn = { class: "text-caption text-g
     openModifiers: {}
   },
   emits: ["update:modelValue", "update:open"],
-  setup(o) {
-    const { t: s } = te(), t = z(o, "modelValue"), e = z(o, "open"), n = Qe(), l = (a) => {
-      const u = Ee(n, a);
-      u && gt(n, a, !u.collapse);
-    }, i = (a) => {
-      t.value = a, e.value = !1, ue.emit("refreshDepends");
+  setup(l) {
+    const { t: s } = Z(), t = z(l, "modelValue"), e = z(l, "open"), n = Qe(), o = (u) => {
+      const r = Ee(n, u);
+      r && ht(n, u, !r.collapse);
+    }, i = (u) => {
+      t.value = u, e.value = !1, ue.emit("refreshDepends");
     };
-    return (a, u) => T(n).length > 0 ? (k(), E("div", cn, [
-      (k(!0), E(ke, null, qe(T(n), (r) => (k(), E(ke, {
-        key: r.id
+    return (u, r) => T(n).length > 0 ? (k(), E("div", dn, [
+      (k(!0), E(ke, null, Be(T(n), (a) => (k(), E(ke, {
+        key: a.id
       }, [
-        r.type === 0 ? (k(), B(rn, {
+        a.type === 0 ? (k(), B(un, {
           key: 0,
-          id: r.id,
-          title: r.name,
-          collapse: r.collapse,
-          count: r.count ?? 0,
-          onXClick: l
+          id: a.id,
+          title: a.name,
+          collapse: a.collapse,
+          count: a.count ?? 0,
+          onXClick: o
         }, null, 8, ["id", "title", "collapse", "count"])) : G("", !0),
-        r.type === 1 && r.show ? (k(), B(an, {
+        a.type === 1 && a.show ? (k(), B(cn, {
           key: 1,
-          id: r.id,
-          title: r.name,
+          id: a.id,
+          title: a.name,
           onXClick: i
         }, null, 8, ["id", "title"])) : G("", !0)
       ], 64))), 128))
-    ])) : (k(), E("div", dn, W(T(s)("x-prop-tree.noComp")), 1));
+    ])) : (k(), E("div", fn, W(T(s)("x-prop-tree.noComp")), 1));
   }
-}), mn = { class: "text-subtitle-1 ml-3" }, vn = /* @__PURE__ */ R({
+}), vn = { class: "text-subtitle-1 ml-3" }, pn = /* @__PURE__ */ R({
   __name: "index",
   props: {
     modelValue: {},
     modelModifiers: {}
   },
   emits: ["update:modelValue"],
-  setup(o) {
-    const { t: s } = te(), t = Ct(), { sysBarAvail: e } = Je(), { backgroundColor1: n } = ie(), l = z(o, "modelValue"), i = Qe(), a = K(() => {
+  setup(l) {
+    const { t: s } = Z(), t = St(), { sysBarAvail: e } = be(), { backgroundColor1: n } = ie(), o = z(l, "modelValue"), i = Qe(), u = K(() => {
       let g = "100%";
       return t.mdAndUp.value && (g = "400px"), {
         background: n.value,
         width: g,
         height: "100%"
       };
-    }), u = K(() => {
+    }), r = K(() => {
       let g = 48;
       return e.value && (g += 24), {
         position: "relative",
         height: `calc(100% - ${g}px)`
       };
-    }), r = K(() => ({
+    }), a = K(() => ({
       height: "60px"
     })), y = K(() => {
-      if (!l.value)
+      if (!o.value)
         return s("x-runtime-lib.notSet");
-      const g = Ee(i, l.value);
+      const g = Ee(i, o.value);
       return g ? g.name : s("x-runtime-lib.compNotAvail");
     }), { open: d } = Ce(`propTreeCompSelectDlg${Me()}`);
     return we(() => {
@@ -916,7 +928,7 @@ const on = { class: "text-subtitle-2 ml-1" }, sn = { class: "text-caption text-g
         persistent: "",
         "no-click-animation": "",
         fullscreen: "",
-        onKeydown: v[6] || (v[6] = Be(F((U) => d.value = !1, ["stop", "prevent"]), ["esc"]))
+        onKeydown: v[6] || (v[6] = Ke(F((U) => d.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
         activator: J(({ props: U }) => [
           M(x, De(U, {
@@ -937,7 +949,7 @@ const on = { class: "text-subtitle-2 ml-1" }, sn = { class: "text-caption text-g
           }, [
             X("div", {
               class: "elevation-2",
-              style: I(a.value)
+              style: ee(u.value)
             }, [
               T(e) ? (k(), B(L, {
                 key: 0,
@@ -954,22 +966,22 @@ const on = { class: "text-subtitle-2 ml-1" }, sn = { class: "text-caption text-g
                     icon: "mdi-close",
                     onClick: v[0] || (v[0] = (U) => d.value = !1)
                   }),
-                  X("span", mn, W(T(s)("x-prop-tree.dlg.compSelect.title")), 1)
+                  X("span", vn, W(T(s)("x-prop-tree.dlg.compSelect.title")), 1)
                 ]),
                 _: 1
               }),
               X("div", {
                 class: "overflow-y-auto",
-                style: I(u.value)
+                style: ee(r.value)
               }, [
-                M(fn, {
-                  modelValue: l.value,
-                  "onUpdate:modelValue": v[1] || (v[1] = (U) => l.value = U),
+                M(mn, {
+                  modelValue: o.value,
+                  "onUpdate:modelValue": v[1] || (v[1] = (U) => o.value = U),
                   open: T(d),
                   "onUpdate:open": v[2] || (v[2] = (U) => ve(d) ? d.value = U : null)
                 }, null, 8, ["modelValue", "open"]),
                 X("div", {
-                  style: I(r.value)
+                  style: ee(a.value)
                 }, null, 4)
               ], 4)
             ], 4)
@@ -980,30 +992,30 @@ const on = { class: "text-subtitle-2 ml-1" }, sn = { class: "text-caption text-g
     };
   }
 });
-function pn(o) {
-  return { renderUiCompSelect: (t, e, n, l, i) => e.ui !== "compSelect" ? (console.assert(!1), h("div", "renderUiCompSelect prop ui must be compSelect")) : h(vn, {
+function yn(l) {
+  return { renderUiCompSelect: (t, e, n, o, i) => e.ui !== "compSelect" ? (console.assert(!1), h("div", "renderUiCompSelect prop ui must be compSelect")) : h(pn, {
     modelValue: ne(
       t,
       e,
       n,
-      o,
       l,
+      o,
       i
     ),
-    "onUpdate:modelValue": (a) => {
+    "onUpdate:modelValue": (u) => {
       oe(
         t,
         e,
         n,
-        a,
-        o,
+        u,
         l,
+        o,
         i
       );
     }
   }) };
 }
-const yn = { class: "d-flex justify-space-between align-center" }, gn = /* @__PURE__ */ R({
+const gn = { class: "d-flex justify-space-between align-center" }, hn = /* @__PURE__ */ R({
   __name: "colorPicker",
   props: /* @__PURE__ */ Y({
     hasDelete: { type: Boolean, default: !1 },
@@ -1013,28 +1025,28 @@ const yn = { class: "d-flex justify-space-between align-center" }, gn = /* @__PU
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Y(["delete"], ["update:modelValue"]),
-  setup(o, { emit: s }) {
-    const { t } = te(), e = z(o, "modelValue"), n = s, l = K(() => {
-      let u = "100%";
-      return o.hasDelete && (u = "calc(100% - 37px)"), {
-        width: u
+  setup(l, { emit: s }) {
+    const { t } = Z(), e = z(l, "modelValue"), n = s, o = K(() => {
+      let r = "100%";
+      return l.hasDelete && (r = "calc(100% - 37px)"), {
+        width: r
       };
-    }), i = K(() => o.readonly), { open: a } = Ce(`propTreeColorPickerMenu${Me()}`);
+    }), i = K(() => l.readonly), { open: u } = Ce(`propTreeColorPickerMenu${Me()}`);
     return we(() => {
-      a.value = !1;
-    }), (u, r) => {
+      u.value = !1;
+    }), (r, a) => {
       const y = S("v-btn"), d = S("v-color-picker"), g = S("v-menu");
       return k(), B(g, {
-        modelValue: T(a),
-        "onUpdate:modelValue": r[2] || (r[2] = (v) => ve(a) ? a.value = v : null),
+        modelValue: T(u),
+        "onUpdate:modelValue": a[2] || (a[2] = (v) => ve(u) ? u.value = v : null),
         "close-on-content-click": !1,
         scrim: "transparent"
       }, {
         activator: J(({ props: v }) => [
-          X("div", yn, [
+          X("div", gn, [
             X("div", {
               class: "flex-grow-1",
-              style: I(l.value)
+              style: ee(o.value)
             }, [
               M(y, De(v, {
                 density: "comfortable",
@@ -1048,20 +1060,20 @@ const yn = { class: "d-flex justify-space-between align-center" }, gn = /* @__PU
                 _: 2
               }, 1040, ["color", "disabled"])
             ], 4),
-            u.hasDelete ? (k(), B(y, {
+            r.hasDelete ? (k(), B(y, {
               key: 0,
               class: "mx-2",
               variant: "text",
               density: "compact",
               icon: "mdi-minus",
-              onClick: r[0] || (r[0] = F((x) => n("delete"), ["stop"]))
+              onClick: a[0] || (a[0] = F((x) => n("delete"), ["stop"]))
             })) : G("", !0)
           ])
         ]),
         default: J(() => [
           M(d, {
             modelValue: e.value,
-            "onUpdate:modelValue": r[1] || (r[1] = (v) => e.value = v),
+            "onUpdate:modelValue": a[1] || (a[1] = (v) => e.value = v),
             mode: "hexa",
             "show-swatches": "",
             "swatches-max-height": "150px"
@@ -1072,35 +1084,35 @@ const yn = { class: "d-flex justify-space-between align-center" }, gn = /* @__PU
     };
   }
 });
-function hn(o) {
-  return { renderUiColorPicker: (t, e, n, l, i) => e.ui !== "colorPicker" ? (console.assert(!1), h("div", "renderUiColorPicker prop ui must be colorPicker")) : h(gn, {
+function _n(l) {
+  return { renderUiColorPicker: (t, e, n, o, i) => e.ui !== "colorPicker" ? (console.assert(!1), h("div", "renderUiColorPicker prop ui must be colorPicker")) : h(hn, {
     modelValue: ne(
       t,
       e,
       n,
-      o,
       l,
+      o,
       i
     ),
-    "onUpdate:modelValue": (a) => {
+    "onUpdate:modelValue": (u) => {
       oe(
         t,
         e,
         n,
-        a,
-        o,
+        u,
         l,
+        o,
         i
       );
     },
-    hasDelete: l !== void 0 && !i,
+    hasDelete: o !== void 0 && !i,
     onDelete: () => {
-      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
+      o === void 0 || i || (n.splice(o, 1), l(t.slice(0, -1), n));
     },
     readonly: e.readonly
   }) };
 }
-const _n = { class: "d-flex justify-space-between align-center my-2" }, kn = { class: "flex-grow-1" }, Vn = /* @__PURE__ */ R({
+const kn = { class: "d-flex justify-space-between align-center my-2" }, Vn = { class: "flex-grow-1" }, Cn = /* @__PURE__ */ R({
   __name: "multiTypes",
   props: /* @__PURE__ */ Y({
     hasDelete: { type: Boolean, default: !1 },
@@ -1110,8 +1122,8 @@ const _n = { class: "d-flex justify-space-between align-center my-2" }, kn = { c
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ Y(["delete"], ["update:modelValue"]),
-  setup(o, { emit: s }) {
-    const { t } = te(), e = z(o, "modelValue"), n = s, l = be(), i = K(() => He[l.value]?.types[o.types]), a = O(0), u = K(() => {
+  setup(l, { emit: s }) {
+    const { t } = Z(), e = z(l, "modelValue"), n = s, o = Te(), i = K(() => He[o.value]?.types[l.types]), u = O(0), r = K(() => {
       const g = [];
       return i.value?.forEach(({ title: v }, x) => {
         g.push({
@@ -1120,28 +1132,28 @@ const _n = { class: "d-flex justify-space-between align-center my-2" }, kn = { c
         });
       }), g;
     });
-    Le(() => {
-      i.value?.some((g, v) => g.validator(e.value) ? (a.value = v, !0) : !1);
+    Ne(() => {
+      i.value?.some((g, v) => g.validator(e.value) ? (u.value = v, !0) : !1);
     });
-    const r = K(() => i.value?.[a.value]), y = () => {
-      e.value = r.value?.default;
+    const a = K(() => i.value?.[u.value]), y = () => {
+      e.value = a.value?.default;
     }, d = O(0);
-    return Le(() => {
-      r.value?.ui === "pixelInput" ? d.value = _t(e.value) : r.value?.ui === "percentInput" && (d.value = kt(e.value));
+    return Ne(() => {
+      a.value?.ui === "pixelInput" ? d.value = kt(e.value) : a.value?.ui === "percentInput" && (d.value = Vt(e.value));
     }), re(d, (g) => {
-      r.value?.ui === "pixelInput" ? e.value = g + "px" : r.value?.ui === "percentInput" && (e.value = g + "%");
+      a.value?.ui === "pixelInput" ? e.value = g + "px" : a.value?.ui === "percentInput" && (e.value = g + "%");
     }), (g, v) => {
       const x = S("v-select"), L = S("v-number-input"), P = S("v-btn"), D = le("ripple");
-      return k(), E("div", _n, [
-        X("div", kn, [
-          ee(M(x, {
-            modelValue: a.value,
+      return k(), E("div", kn, [
+        X("div", Vn, [
+          te(M(x, {
+            modelValue: u.value,
             "onUpdate:modelValue": [
-              v[0] || (v[0] = (U) => a.value = U),
+              v[0] || (v[0] = (U) => u.value = U),
               y
             ],
             density: "compact",
-            items: u.value,
+            items: r.value,
             "hide-details": "",
             "single-line": ""
           }, null, 8, ["modelValue", "items"]), [
@@ -1152,16 +1164,16 @@ const _n = { class: "d-flex justify-space-between align-center my-2" }, kn = { c
               { stop: !0 }
             ]
           ]),
-          r.value?.ui === "pixelInput" || r.value?.ui === "percentInput" ? ee((k(), B(L, {
+          a.value?.ui === "pixelInput" || a.value?.ui === "percentInput" ? te((k(), B(L, {
             key: 0,
             modelValue: d.value,
             "onUpdate:modelValue": v[1] || (v[1] = (U) => d.value = U),
             density: "compact",
             "control-variant": "stacked",
-            precision: r.value.precision,
-            min: r.value.min,
-            max: r.value.max,
-            step: r.value.step,
+            precision: a.value.precision,
+            min: a.value.min,
+            max: a.value.max,
+            step: a.value.step,
             "hide-details": "",
             "single-line": ""
           }, null, 8, ["modelValue", "precision", "min", "max", "step"])), [
@@ -1185,35 +1197,35 @@ const _n = { class: "d-flex justify-space-between align-center my-2" }, kn = { c
     };
   }
 });
-function Cn(o) {
-  return { renderUiMultiTypes: (t, e, n, l, i) => e.ui !== "multiTypes" ? (console.assert(!1), h("div", "renderUiMultiTypes prop ui must be multiTypes")) : h(Vn, {
+function Sn(l) {
+  return { renderUiMultiTypes: (t, e, n, o, i) => e.ui !== "multiTypes" ? (console.assert(!1), h("div", "renderUiMultiTypes prop ui must be multiTypes")) : h(Cn, {
     modelValue: ne(
       t,
       e,
       n,
-      o,
       l,
+      o,
       i
     ) ?? "",
-    "onUpdate:modelValue": (a) => {
+    "onUpdate:modelValue": (u) => {
       oe(
         t,
         e,
         n,
-        a,
-        o,
+        u,
         l,
+        o,
         i
       );
     },
-    hasDelete: l !== void 0 && !i,
+    hasDelete: o !== void 0 && !i,
     onDelete: () => {
-      l === void 0 || i || (n.splice(l, 1), o(t.slice(0, -1), n));
+      o === void 0 || i || (n.splice(o, 1), l(t.slice(0, -1), n));
     },
     types: e.types
   }) };
 }
-const Sn = /* @__PURE__ */ R({
+const Un = /* @__PURE__ */ R({
   __name: "editor",
   props: {
     modelValue: { required: !0 },
@@ -1224,37 +1236,37 @@ const Sn = /* @__PURE__ */ R({
     scaleModifiers: {}
   },
   emits: ["update:modelValue", "update:lock", "update:scale"],
-  setup(o, { expose: s }) {
-    const t = z(o, "modelValue"), e = z(o, "lock"), n = z(o, "scale"), l = pt(), i = yt(), a = be(), u = Ke("target"), r = () => {
+  setup(l, { expose: s }) {
+    const t = z(l, "modelValue"), e = z(l, "lock"), n = z(l, "scale"), o = yt(), i = gt(), u = Te(), r = Je("target"), a = () => {
       const d = JSON.parse(t.value);
-      u.value?.load(d);
+      r.value?.load(d);
     };
     return s({ save: () => {
-      const d = u.value.save();
+      const d = r.value.save();
       t.value = JSON.stringify(d, null, 2);
-    } }), (d, g) => (k(), B(T(St), {
+    } }), (d, g) => (k(), B(T(Ut), {
       ref_key: "target",
-      ref: u,
+      ref: r,
       lock: e.value,
       "onUpdate:lock": g[0] || (g[0] = (v) => e.value = v),
       scale: n.value,
       "onUpdate:scale": g[1] || (g[1] = (v) => n.value = v),
       type: "json",
-      version: T(a),
+      version: T(u),
       locale: T(i),
-      dark: T(l),
-      onReady: r
+      dark: T(o),
+      onReady: a
     }, null, 8, ["lock", "scale", "version", "locale", "dark"]));
   }
-}), Un = { class: "text-subtitle-1" }, $n = /* @__PURE__ */ R({
+}), $n = { class: "text-subtitle-1" }, xn = /* @__PURE__ */ R({
   __name: "index",
   props: {
     modelValue: { required: !0 },
     modelModifiers: {}
   },
   emits: ["update:modelValue"],
-  setup(o) {
-    const { t: s } = te(), { sysBarAvail: t } = Je(), { backgroundColor0: e, backgroundColor1: n, backgroundColor2: l } = ie(), i = z(o, "modelValue"), a = O(!1), u = O(1), r = K(() => {
+  setup(l) {
+    const { t: s } = Z(), { sysBarAvail: t } = be(), { backgroundColor0: e, backgroundColor1: n, backgroundColor2: o } = ie(), i = z(l, "modelValue"), u = O(!1), r = O(1), a = K(() => {
       let v = 48;
       return t.value && (v += 24), {
         position: "relative",
@@ -1265,7 +1277,7 @@ const Sn = /* @__PURE__ */ R({
     we(() => {
       d.value = !1;
     });
-    const g = Ke("editor");
+    const g = Je("editor");
     return re(d, (v) => {
       v || g.value?.save();
     }), (v, x) => {
@@ -1278,7 +1290,7 @@ const Sn = /* @__PURE__ */ R({
         "no-click-animation": "",
         fullscreen: "",
         attach: "",
-        onKeydown: x[5] || (x[5] = Be(F((V) => d.value = !1, ["stop", "prevent"]), ["esc"]))
+        onKeydown: x[5] || (x[5] = Ke(F((V) => d.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
         activator: J(({ props: V }) => [
           M(L, De(V, {
@@ -1300,12 +1312,12 @@ const Sn = /* @__PURE__ */ R({
             default: J(() => [
               T(t) ? (k(), B(P, {
                 key: 0,
-                color: T(l),
+                color: T(o),
                 height: 24
               }, null, 8, ["color"])) : G("", !0),
               M(P, {
                 class: "d-flex align-center px-2",
-                color: T(l),
+                color: T(o),
                 height: 48
               }, {
                 default: J(() => [
@@ -1315,23 +1327,23 @@ const Sn = /* @__PURE__ */ R({
                     icon: "mdi-close",
                     onClick: x[0] || (x[0] = (V) => d.value = !1)
                   }),
-                  X("span", Un, W(T(s)("x-prop-tree.dlg.jsonObject.title")), 1),
+                  X("span", $n, W(T(s)("x-prop-tree.dlg.jsonObject.title")), 1),
                   M(D)
                 ]),
                 _: 1
               }, 8, ["color"]),
               X("div", {
-                style: I(r.value)
+                style: ee(a.value)
               }, [
-                M(Sn, {
+                M(Un, {
                   ref_key: "editor",
                   ref: g,
                   modelValue: i.value,
                   "onUpdate:modelValue": x[1] || (x[1] = (V) => i.value = V),
-                  lock: a.value,
-                  "onUpdate:lock": x[2] || (x[2] = (V) => a.value = V),
-                  scale: u.value,
-                  "onUpdate:scale": x[3] || (x[3] = (V) => u.value = V)
+                  lock: u.value,
+                  "onUpdate:lock": x[2] || (x[2] = (V) => u.value = V),
+                  scale: r.value,
+                  "onUpdate:scale": x[3] || (x[3] = (V) => r.value = V)
                 }, null, 8, ["modelValue", "lock", "scale"])
               ], 4)
             ]),
@@ -1343,30 +1355,30 @@ const Sn = /* @__PURE__ */ R({
     };
   }
 });
-function xn(o) {
-  return { renderUiJsonEditor: (t, e, n, l, i) => e.ui !== "jsonEditor" ? h("div", "renderUiJsonObject prop ui must be jsonEditor") : h($n, {
+function Pn(l) {
+  return { renderUiJsonEditor: (t, e, n, o, i) => e.ui !== "jsonEditor" ? h("div", "renderUiJsonObject prop ui must be jsonEditor") : h(xn, {
     modelValue: ne(
       t,
       e,
       n,
-      o,
       l,
+      o,
       i
     ) ?? "{}",
-    "onUpdate:modelValue": (a) => {
+    "onUpdate:modelValue": (u) => {
       oe(
         t,
         e,
         n,
-        a,
-        o,
+        u,
         l,
+        o,
         i
       );
     }
   }) };
 }
-const Pn = /* @__PURE__ */ R({
+const Mn = /* @__PURE__ */ R({
   __name: "index",
   props: {
     unique: {},
@@ -1375,15 +1387,15 @@ const Pn = /* @__PURE__ */ R({
     version: {}
   },
   emits: ["change"],
-  setup(o, { emit: s }) {
-    const { t } = te(), { backgroundColor1: e } = ie(), n = o, l = s, i = O("20px"), a = O("56px"), u = O("200px"), r = ft({}), y = O({}), d = (m, c) => {
-      Oe(y, n.config, n.object), l("change", m, c);
+  setup(l, { emit: s }) {
+    const { t } = Z(), { backgroundColor1: e } = ie(), n = l, o = s, i = O("20px"), u = O("56px"), r = O("200px"), a = ft({}), y = O({}), d = (m, c) => {
+      qe(y, n.config, n.object), o("change", m, c);
     };
     re(
       [() => n.config, () => n.object],
       () => {
-        Oe(y, n.config, n.object, (m, c) => {
-          l("change", m, c);
+        qe(y, n.config, n.object, (m, c) => {
+          o("change", m, c);
         });
       },
       { immediate: !0 }
@@ -1396,35 +1408,35 @@ const Pn = /* @__PURE__ */ R({
       }
     );
     const v = O(n.config);
-    bt(v), re(
+    Tt(v), re(
       () => n.config,
       () => {
         v.value = n.config;
       }
     );
     const x = O(n.object);
-    Lt(x), re(
+    Nt(x), re(
       () => n.object,
       () => {
         x.value = n.object;
       }
-    ), Ot(y), Bt(d);
+    ), qt(y), Kt(d);
     const L = O([]);
-    Jt(L);
+    Rt(L);
     const P = () => {
-      const { compGroups: m, comps: c } = Vt.app.activeApp, p = [];
+      const { compGroups: m, comps: c } = Ct.app.activeApp, p = [];
       m.forEach(({ id: f, name: _, position: $ }) => {
-        const b = L.value.find((Z) => Z.id === f);
+        const A = L.value.find((j) => j.id === f);
         p.push({
           id: f,
           type: 0,
           name: _,
           position: $,
-          collapse: b?.collapse ?? !0
+          collapse: A?.collapse ?? !0
         });
-      }), c.forEach(({ id: f, groupid: _, name: $, position: b }) => {
-        p.push({ id: f, type: 1, name: $, position: b, group: _ });
-      }), ht(p, !0), L.value = p;
+      }), c.forEach(({ id: f, groupid: _, name: $, position: A }) => {
+        p.push({ id: f, type: 1, name: $, position: A, group: _ });
+      }), _t(p, !0), L.value = p;
     };
     let D;
     const U = () => {
@@ -1439,7 +1451,7 @@ const Pn = /* @__PURE__ */ R({
     }), vt(() => {
       V();
     });
-    const { renderProp: A } = Xt(y, a, u), { renderUiDummy: N } = Ft(d), { renderUiStrInput: Q } = Yt(d), { renderUiNumInput: xe } = Zt(d), { renderUiSwitch: Ze } = en(d), { renderUiSelect: je } = ln(d), { renderUiColorPicker: Ie } = hn(d), { renderUiJsonEditor: et } = xn(d), { renderUiMultiTypes: tt } = Cn(d), { renderUiCompSelect: nt } = pn(d), pe = (m, c, p, f, _, $) => (m = Re(m), _ !== void 0 ? (m.push(_), $ && m.push(c.key)) : m.push(c.key), c.ui ? c.array && f ? st(m, c, p, f, _, $) : it(m, c, p, _, $) : c.array ? lt(m, c, p, f, _, $) : ot(
+    const { renderProp: b } = Ft(y, u, r), { renderUiDummy: N } = zt(d), { renderUiStrInput: Q } = Wt(d), { renderUiNumInput: xe } = jt(d), { renderUiSwitch: Ze } = tn(d), { renderUiSelect: je } = on(d), { renderUiColorPicker: Ie } = _n(d), { renderUiJsonEditor: et } = Pn(d), { renderUiMultiTypes: tt } = Sn(d), { renderUiCompSelect: nt } = yn(d), pe = (m, c, p, f, _, $) => (m = Re(m), _ !== void 0 ? (m.push(_), $ && m.push(c.key)) : m.push(c.key), c.ui ? c.array && f ? st(m, c, p, f, _, $) : it(m, c, p, _, $) : c.array ? lt(m, c, p, f, _, $) : ot(
       m,
       c,
       p,
@@ -1453,12 +1465,12 @@ const Pn = /* @__PURE__ */ R({
         return console.assert(!1), h("div", "renderBranchArray prop array must be valid");
       if (!f)
         return console.assert(!1), h("div", "renderBranchArray branch must be valid");
-      let b;
-      _ !== void 0 && !$ ? (p[_] instanceof Array || (p[_] = q(c), d(m, p[c.key])), b = p[_]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(m, p[c.key])), b = p[c.key]);
-      let Z = t(c.name);
-      f.collapse && ae(y.value, m) && (Z += " *");
+      let A;
+      _ !== void 0 && !$ ? (p[_] instanceof Array || (p[_] = q(c), d(m, p[c.key])), A = p[_]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(m, p[c.key])), A = p[c.key]);
+      let j = t(c.name);
+      f.collapse && ae(y.value, m) && (j += " *");
       const fe = h(_e, {
-        title: Z,
+        title: j,
         collapse: f.collapse,
         hasCreate: !0,
         onCollapse: (C) => {
@@ -1468,7 +1480,7 @@ const Pn = /* @__PURE__ */ R({
           ue.emit("propTreeMenu", { x: C, y: w, keys: m });
         },
         onCreate: () => {
-          b.push({}), d(m, b);
+          A.push({}), d(m, A);
         }
       }), H = h(
         "div",
@@ -1479,7 +1491,7 @@ const Pn = /* @__PURE__ */ R({
         },
         (() => {
           const C = [];
-          for (let w = 0; w < b.length; w++) {
+          for (let w = 0; w < A.length; w++) {
             if (!Pe(f.children)) {
               console.assert(!1);
               break;
@@ -1489,29 +1501,29 @@ const Pn = /* @__PURE__ */ R({
               children: {}
             });
             const ye = [...m, w], ge = f.children[w];
-            let Te = `[${w + 1}]`;
-            f.children[w].collapse && ae(y.value, ye) && (Te += " *");
+            let Le = `[${w + 1}]`;
+            f.children[w].collapse && ae(y.value, ye) && (Le += " *");
             const ut = h(_e, {
-              title: Te,
+              title: Le,
               collapse: f.children[w].collapse,
               hasDelete: !0,
               index: w,
-              onCollapse: (j) => {
+              onCollapse: (I) => {
                 if (!Pe(f.children)) {
                   console.assert(!1);
                   return;
                 }
-                f.children[w].collapse = j;
+                f.children[w].collapse = I;
               },
-              onMenu: (j, se) => {
-                ue.emit("propTreeMenu", { x: j, y: se, keys: ye });
+              onMenu: (I, se) => {
+                ue.emit("propTreeMenu", { x: I, y: se, keys: ye });
               },
-              onDelete: (j) => {
+              onDelete: (I) => {
                 if (!Pe(f.children)) {
                   console.assert(!1);
                   return;
                 }
-                f.children.splice(j, 1), b.splice(j, 1), d(m, b);
+                f.children.splice(I, 1), A.splice(I, 1), d(m, A);
               }
             });
             C.push(ut);
@@ -1523,9 +1535,9 @@ const Pn = /* @__PURE__ */ R({
                 }
               },
               (() => {
-                const j = [];
+                const I = [];
                 return c.children.forEach((se) => {
-                  if (!Ne(ge.children)) {
+                  if (!Oe(ge.children)) {
                     console.assert(!1);
                     return;
                   }
@@ -1536,13 +1548,13 @@ const Pn = /* @__PURE__ */ R({
                   const ct = pe(
                     m,
                     se,
-                    b[w],
+                    A[w],
                     ge.children[se.key],
                     w,
                     !0
                   );
-                  j.push(ct);
-                }), j;
+                  I.push(ct);
+                }), I;
               })()
             );
             f.children[w].collapse || C.push(at);
@@ -1569,10 +1581,10 @@ const Pn = /* @__PURE__ */ R({
         return console.assert(!1), h("div", "renderBranchScalar prop array must be invalid");
       if (!f)
         return console.assert(!1), h("div", "renderBranchScalar branch must be valid");
-      let b = t(c.name);
-      f.collapse && ae(y.value, m) && (b += " *");
-      const Z = h(_e, {
-        title: b,
+      let A = t(c.name);
+      f.collapse && ae(y.value, m) && (A += " *");
+      const j = h(_e, {
+        title: A,
         collapse: f.collapse,
         hasDelete: _ !== void 0 && !$,
         onCollapse: (H) => {
@@ -1594,7 +1606,7 @@ const Pn = /* @__PURE__ */ R({
         (() => {
           const H = [];
           return c.children.forEach((C) => {
-            if (!Ne(f.children)) {
+            if (!Oe(f.children)) {
               console.assert(!1);
               return;
             }
@@ -1621,7 +1633,7 @@ const Pn = /* @__PURE__ */ R({
         },
         (() => {
           const H = [];
-          return H.push(Z), f.collapse || H.push(fe), H;
+          return H.push(j), f.collapse || H.push(fe), H;
         })()
       );
     }, st = (m, c, p, f, _, $) => {
@@ -1631,12 +1643,12 @@ const Pn = /* @__PURE__ */ R({
         return console.assert(!1), h("div", "renderLeafArray prop array must be valid");
       if (!f)
         return console.assert(!1), h("div", "renderLeafArray branch must be valid");
-      let b;
-      _ !== void 0 && !$ ? (p[_] instanceof Array || (p[_] = q(c), d(m, p[_])), b = p[_]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(m, p[c.key])), b = p[c.key]);
-      let Z = t(c.name);
-      f.collapse && ae(y.value, m) && (Z += " *");
+      let A;
+      _ !== void 0 && !$ ? (p[_] instanceof Array || (p[_] = q(c), d(m, p[_])), A = p[_]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(m, p[c.key])), A = p[c.key]);
+      let j = t(c.name);
+      f.collapse && ae(y.value, m) && (j += " *");
       const fe = h(_e, {
-        title: Z,
+        title: j,
         collapse: f.collapse,
         hasCreate: !0,
         onCollapse: (C) => {
@@ -1646,7 +1658,7 @@ const Pn = /* @__PURE__ */ R({
           ue.emit("propTreeMenu", { x: C, y: w, keys: m });
         },
         onCreate: () => {
-          b.push(q(c, !0)), d(m, b);
+          A.push(q(c, !0)), d(m, A);
         }
       }), H = h(
         "div",
@@ -1657,8 +1669,8 @@ const Pn = /* @__PURE__ */ R({
         },
         (() => {
           const C = [];
-          for (let w = 0; w < b.length; w++) {
-            const ye = pe(m, c, b, void 0, w, !1);
+          for (let w = 0; w < A.length; w++) {
+            const ye = pe(m, c, A, void 0, w, !1);
             C.push(ye);
           }
           return C;
@@ -1680,7 +1692,7 @@ const Pn = /* @__PURE__ */ R({
       if (!c.ui)
         return console.assert(!1), h("div", "renderLeafScalar prop ui must be valid");
       let $;
-      return c.ui === "dummy" ? $ = N(m, c, p, f, _) : c.ui === "strInput" ? $ = Q(m, c, p, f, _) : c.ui === "numInput" ? $ = xe(m, c, p, f, _) : c.ui === "switch" ? $ = Ze(m, c, p, f, _) : c.ui === "select" ? $ = je(m, c, p, f, _) : c.ui === "colorPicker" ? $ = Ie(m, c, p, f, _) : c.ui === "jsonEditor" ? $ = et(m, c, p, f, _) : c.ui === "multiTypes" ? $ = tt(m, c, p, f, _) : c.ui === "compSelect" ? $ = nt(m, c, p, f, _) : console.assert(!1, "renderLeafScalar not implemented"), $ ? A(m, c, $) : h("div");
+      return c.ui === "dummy" ? $ = N(m, c, p, f, _) : c.ui === "strInput" ? $ = Q(m, c, p, f, _) : c.ui === "numInput" ? $ = xe(m, c, p, f, _) : c.ui === "switch" ? $ = Ze(m, c, p, f, _) : c.ui === "select" ? $ = je(m, c, p, f, _) : c.ui === "colorPicker" ? $ = Ie(m, c, p, f, _) : c.ui === "jsonEditor" ? $ = et(m, c, p, f, _) : c.ui === "multiTypes" ? $ = tt(m, c, p, f, _) : c.ui === "compSelect" ? $ = nt(m, c, p, f, _) : console.assert(!1, "renderLeafScalar not implemented"), $ ? b(m, c, $) : h("div");
     }, rt = () => h(
       "div",
       {
@@ -1692,8 +1704,8 @@ const Pn = /* @__PURE__ */ R({
       (() => {
         const m = [];
         if (n.unique && n.config.length > 0 && n.object) {
-          r[n.unique] || (r[n.unique] = {});
-          const c = r[n.unique];
+          a[n.unique] || (a[n.unique] = {});
+          const c = a[n.unique];
           n.config.forEach((p) => {
             c[p.key] || (c[p.key] = {
               collapse: !0,
@@ -1708,26 +1720,26 @@ const Pn = /* @__PURE__ */ R({
     );
     return (m, c) => (k(), E(ke, null, [
       M(rt),
-      M(Rt, {
+      M(Et, {
         config: n.config,
         object: n.object,
         "prop-states": y.value
       }, null, 8, ["config", "object", "prop-states"])
     ], 64));
   }
-}), Mn = (o) => {
-  o.component("XPropTree", Pn);
-}, wn = (o, s, t) => {
-  const e = o[s];
-  return e ? typeof e == "function" ? e() : Promise.resolve(e) : new Promise((n, l) => {
-    (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(l.bind(null, /* @__PURE__ */ new Error("Unknown variable dynamic import: " + s + (s.split("/").length !== t ? ". Note that variables only represent file names one level deep." : ""))));
+}), wn = (l) => {
+  l.component("XPropTree", Mn);
+}, Dn = (l, s, t) => {
+  const e = l[s];
+  return e ? typeof e == "function" ? e() : Promise.resolve(e) : new Promise((n, o) => {
+    (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(o.bind(null, /* @__PURE__ */ new Error("Unknown variable dynamic import: " + s + (s.split("/").length !== t ? ". Note that variables only represent file names one level deep." : ""))));
   });
 };
-async function Bn(o) {
-  return (await wn(/* @__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 Kn(l) {
+  return (await Dn(/* @__PURE__ */ Object.assign({ "./locales/en/index.ts": () => import("./i18n-en.n11iysmh.js"), "./locales/zhHans/index.ts": () => import("./i18n-zhHans.hr18mfah.js") }), `./locales/${l}/index.ts`, 4)).default;
 }
-const Kn = { install: Mn };
+const Jn = { install: wn };
 export {
-  Kn as default,
-  Bn as loadLocaleMessagePropTree
+  Jn as default,
+  Kn as loadLocaleMessagePropTree
 };