x-prop-tree 0.7.18 → 0.7.19

package/dist/index.js

@@ -1,8 +1,8 @@
-import { provide as ae, inject as ce, defineComponent as R, ref as T, computed as L, resolveComponent as U, createBlock as B, openBlock as V, unref as D, isRef as re, withCtx as K, createVNode as M, createElementBlock as q, Fragment as fe, renderList as Te, createTextVNode as ye, toDisplayString as F, resolveDirective as ee, withDirectives as Z, withModifiers as X, normalizeStyle as W, createElementVNode as O, createCommentVNode as G, mergeModels as Q, useModel as z, useId as Ue, onUnmounted as $e, mergeProps as we, withKeys as Le, useTemplateRef as Je, watch as oe, watchEffect as Ke, h as x, renderSlot as ht, onMounted as He, onBeforeUnmount as Xe, reactive as kt } from "vue";
-import { useI18n as j } from "vue-i18n";
-import { useViewStack as he, useColor as te, eventBus as de, useSystem as ve, injectDark as _t, injectLocale as xt, openNumberDlg as Fe, openPromptDlg as Vt, globalObjects as St } from "x-essential-lib";
-import { getPropertyDefault as J, pkgs as Ne, parsePixelStr as Ct, parsePercentStr as Ut, getPropertyTag as $t, elements as wt } from "x-runtime-lib";
-import { c as ze, i as Me, r as ke, v as Ge, d as Ye } from "./vendor.f0ug048x.js";
+import { provide as ae, inject as ce, defineComponent as E, ref as T, computed as L, resolveComponent as $, createBlock as B, openBlock as _, unref as P, isRef as re, withCtx as R, createVNode as b, createElementBlock as K, Fragment as fe, renderList as Te, createTextVNode as he, toDisplayString as F, resolveDirective as ee, withDirectives as j, withModifiers as X, normalizeStyle as W, createElementVNode as q, createCommentVNode as G, mergeModels as Z, useModel as z, useId as Ue, onUnmounted as we, mergeProps as Me, withKeys as Le, useTemplateRef as Je, watch as oe, watchEffect as Ke, h as k, renderSlot as ht, onMounted as He, onBeforeUnmount as Xe, reactive as kt } from "vue";
+import { useI18n as I } from "vue-i18n";
+import { useViewStack as ke, useColor as te, eventBus as de, useSystem as ve, injectDark as _t, injectLocale as xt, openNumberDlg as Fe, openPromptDlg as Vt, globalObjects as St } from "x-essential-lib";
+import { getPropertyDefault as J, pkgs as Ne, parsePixelStr as Ct, parsePercentStr as $t, getPropertyTag as Ut, elements as wt } from "x-runtime-lib";
+import { c as ze, i as be, r as _e, v as Ge, d as Ye } from "./vendor.f0ug048x.js";
 import { useDisplay as We } from "vuetify";
 import { XBlockly as Mt } from "x-block-lib";
 import { globalState as Qe } from "x-state-lib";
@@ -20,7 +20,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
     return !0;
   };
   return n(t, s);
-}, Se = (t, s) => {
+}, Ce = (t, s) => {
   let n = {
     key: "",
     name: "",
@@ -42,7 +42,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
       n = n.children.find((l) => l.key === e);
     }
   }), n;
-}, ge = (t, s) => {
+}, ye = (t, s) => {
   let n = t;
   return s.forEach((e) => {
     if (!n) {
@@ -80,10 +80,10 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
     let u = e;
     (s.ui === "switch" || s.ui === "select" || s.ui === "colorPicker" || s.ui === "multiTypes" || s.ui === "compSelect") && (e || (u = void 0)), u !== n[s.key] && (n[s.key] = u, l(t, n[s.key]));
   }
-}, Be = (t) => !(t instanceof Array), be = (t) => t instanceof Array, Pt = [
+}, Be = (t) => !(t instanceof Array), Pe = (t) => t instanceof Array, Pt = [
   ["basic", "id"],
   ["basic", "name"]
-], Dt = (t) => Pt.find((s) => Me(t, s)), Pe = (t, s, n, e, l, o, i) => (t = ze(t), o !== void 0 ? (t.push(o), i && t.push(s.key)) : t.push(s.key), Dt(t) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && be(e.children) ? Lt(
+], Dt = (t) => Pt.find((s) => be(t, s)), De = (t, s, n, e, l, o, i) => (t = ze(t), o !== void 0 ? (t.push(o), i && t.push(s.key)) : t.push(s.key), Dt(t) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && Pe(e.children) ? Lt(
   t,
   s,
   n,
@@ -121,7 +121,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
       !1,
       "execPropertyBranchArray property array must be valid"
     ), !1;
-  if (!e.children || !be(e.children))
+  if (!e.children || !Pe(e.children))
     return console.assert(
       !1,
       "execPropertyBranchArray state children must be array"
@@ -142,7 +142,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
       a.children[d.key] = {
         change: !1,
         children: d.array ? [] : {}
-      }, Pe(
+      }, De(
         t,
         d,
         u[r],
@@ -153,7 +153,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
       ) && (a.change = !0), a.change && (e.change = !0);
     });
   }
-  return e.change || (e.change = !Me(u, J(s))), e.change;
+  return e.change || (e.change = !be(u, J(s))), e.change;
 }, Tt = (t, s, n, e, l, o, i) => {
   if (s.ui)
     return console.assert(
@@ -174,7 +174,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
     e.children[a.key] = {
       change: !1,
       children: a.array ? [] : {}
-    }, Pe(t, a, u, e.children[a.key], l) && (e.change = !0);
+    }, De(t, a, u, e.children[a.key], l) && (e.change = !0);
   }
   return e.change;
 }, Lt = (t, s, n, e, l, o, i) => {
@@ -182,7 +182,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
     return console.assert(!1, "execPropertyLeafArray property ui must be valid"), !1;
   if (!s.array)
     return console.assert(!1, "execPropertyLeafArray property aray must be valid"), !1;
-  if (!e.children || !be(e.children))
+  if (!e.children || !Pe(e.children))
     return console.assert(!1, "execPropertyLeafArray state children must be array"), !1;
   let u;
   o !== void 0 && !i ? (n[o] instanceof Array || (n[o] = J(s), l?.(t, n[o])), u = n[o]) : (n[s.key] instanceof Array || (n[s.key] = J(s), l?.(t, n[s.key])), u = n[s.key]), e.change = !1;
@@ -190,7 +190,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
     e.children[r] = {
       change: !1,
       children: {}
-    }, Pe(
+    }, De(
       t,
       s,
       u,
@@ -199,12 +199,12 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
       r,
       !1
     ) && (e.change = !0);
-  return e.change || (e.change = !Me(u, J(s))), e.change;
+  return e.change || (e.change = !be(u, J(s))), e.change;
 }, Nt = (t, s, n, e, l) => {
   if (!t.ui)
     return console.assert(!1, "execPropertyLeafScalar property ui must be valid"), !1;
   let o;
-  return e !== void 0 && !l ? o = s[e] : o = s[t.key], n.change = !Me(o, J(t, !0)), n.change;
+  return e !== void 0 && !l ? o = s[e] : o = s[t.key], n.change = !be(o, J(t, !0)), n.change;
 }, Ee = (t, s, n, e) => {
   if (s.length <= 0 || !n) {
     t.value = {};
@@ -215,7 +215,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
     l[o.key] = {
       change: !1,
       children: o.array ? [] : {}
-    }, Pe([], o, n, l[o.key], e);
+    }, De([], o, n, l[o.key], e);
   }), t.value = l;
 }, me = (t, s) => {
   let n = {
@@ -227,7 +227,7 @@ const Re = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, bt = (t
       return console.assert(!1, `isPropChanged state must be valid keys=${s}`), !1;
     if (!n.children)
       return console.assert(!1, `isPropChanged state must be valid keys=${s}`), !1;
-    typeof e == "string" ? Be(n.children) && (n = n.children[e]) : be(n.children) && (n = n.children[e]);
+    typeof e == "string" ? Be(n.children) && (n = n.children[e]) : Pe(n.children) && (n = n.children[e]);
   }), n?.change ?? !1;
 }, Ze = Symbol(), je = Symbol(), Ie = Symbol(), et = Symbol(), tt = Symbol(), nt = Symbol(), lt = Symbol();
 function Bt(t) {
@@ -272,114 +272,114 @@ function zt(t) {
 function st() {
   return ce(lt);
 }
-const Gt = /* @__PURE__ */ R({
+const Gt = /* @__PURE__ */ E({
   __name: "index",
   setup(t) {
-    const { t: s } = j(), n = qt(), e = Rt(), l = Jt(), o = Xt(), i = T(0), u = T(0), r = T([]), a = L(() => [i.value, u.value]), d = (C) => {
-      const b = () => !(r.value.length <= 0 || !me(l.value, r.value)), k = () => {
-        const S = Se(n.value, r.value);
+    const { t: s } = I(), n = qt(), e = Rt(), l = Jt(), o = Xt(), i = T(0), u = T(0), r = T([]), a = L(() => [i.value, u.value]), d = (V) => {
+      const D = () => !(r.value.length <= 0 || !me(l.value, r.value)), x = () => {
+        const S = Ce(n.value, r.value);
         if (S)
           if (S.ui) {
-            const P = ge(e.value, r.value.slice(0, -1));
-            if (!P)
+            const U = ye(e.value, r.value.slice(0, -1));
+            if (!U)
               return;
-            P[r.value[r.value.length - 1]] = J(S), o(r.value, P[r.value[r.value.length - 1]]);
+            U[r.value[r.value.length - 1]] = J(S), o(r.value, U[r.value[r.value.length - 1]]);
           } else if (S.array) {
-            const P = r.value[r.value.length - 1];
-            if (P === void 0) {
+            const U = r.value[r.value.length - 1];
+            if (U === void 0) {
               console.assert(!1, "invalid last key");
               return;
             }
-            if (typeof P == "string") {
-              const E = ge(e.value, r.value.slice(0, -1));
-              if (!E)
+            if (typeof U == "string") {
+              const O = ye(e.value, r.value.slice(0, -1));
+              if (!O)
                 return;
-              E[r.value[r.value.length - 1]] = J(S), o(r.value, E[r.value[r.value.length - 1]]);
+              O[r.value[r.value.length - 1]] = J(S), o(r.value, O[r.value[r.value.length - 1]]);
             } else {
-              const E = ge(e.value, r.value);
-              if (!E)
+              const O = ye(e.value, r.value);
+              if (!O)
                 return;
-              S.children.forEach((I) => {
-                E[I.key] = J(S), o([...r.value, I.key], E[I.key]);
+              S.children.forEach((Q) => {
+                O[Q.key] = J(S), o([...r.value, Q.key], O[Q.key]);
               });
             }
           } else {
-            const P = ge(e.value, r.value);
-            if (!P)
+            const U = ye(e.value, r.value);
+            if (!U)
               return;
-            S.children.forEach((E) => {
-              P[E.key] = J(S), o([...r.value, E.key], P[E.key]);
+            S.children.forEach((O) => {
+              U[O.key] = J(S), o([...r.value, O.key], U[O.key]);
             });
           }
       };
-      b() && C.push({
+      D() && V.push({
         title: s("x-prop-tree.reset"),
-        func: k
+        func: x
       });
-    }, c = (C) => {
-      const b = () => {
-        const k = Se(n.value, r.value), S = ge(e.value, r.value);
-        localStorage.setItem("propTreeCopy", JSON.stringify({ property: k, object: S }));
+    }, c = (V) => {
+      const D = () => {
+        const x = Ce(n.value, r.value), S = ye(e.value, r.value);
+        localStorage.setItem("propTreeCopy", JSON.stringify({ property: x, object: S }));
       };
-      C.push({
+      V.push({
         title: s("x-prop-tree.copy"),
-        func: b
+        func: D
       });
-    }, f = (C) => {
-      const b = () => {
+    }, f = (V) => {
+      const D = () => {
         const S = localStorage.getItem("propTreeCopy");
         if (!S)
           return !1;
         try {
-          const { property: P } = JSON.parse(S), E = Se(n.value, r.value);
-          return bt(P, E);
-        } catch (P) {
-          console.error(P);
+          const { property: U } = JSON.parse(S), O = Ce(n.value, r.value);
+          return bt(U, O);
+        } catch (U) {
+          console.error(U);
         }
         return !1;
-      }, k = () => {
-        if (!b())
+      }, x = () => {
+        if (!D())
           return;
         const S = localStorage.getItem("propTreeCopy");
         if (S)
           try {
-            const { object: P } = JSON.parse(S), E = Se(n.value, r.value);
-            console.log(P, E);
-          } catch (P) {
-            console.error(P);
+            const { object: U } = JSON.parse(S), O = Ce(n.value, r.value);
+            console.log(U, O);
+          } catch (U) {
+            console.error(U);
           }
       };
-      b() && C.push({
+      D() && V.push({
         title: s("x-prop-tree.paste"),
-        func: k
+        func: x
       });
     }, v = L(() => {
-      const C = [];
-      return d(C), c(C), f(C), C;
-    }), h = (C) => {
-      i.value = C.x, u.value = C.y, r.value = C.keys;
-    }, { open: _ } = he("propTreeMenu", h);
-    return (C, b) => {
-      const k = U("v-list-item-title"), S = U("v-list-item"), P = U("v-list"), E = U("v-menu");
-      return V(), B(E, {
-        modelValue: D(_),
-        "onUpdate:modelValue": b[0] || (b[0] = (I) => re(_) ? _.value = I : null),
+      const V = [];
+      return d(V), c(V), f(V), V;
+    }), C = (V) => {
+      i.value = V.x, u.value = V.y, r.value = V.keys;
+    }, { open: h } = ke("propTreeMenu", C);
+    return (V, D) => {
+      const x = $("v-list-item-title"), S = $("v-list-item"), U = $("v-list"), O = $("v-menu");
+      return _(), B(O, {
+        modelValue: P(h),
+        "onUpdate:modelValue": D[0] || (D[0] = (Q) => re(h) ? h.value = Q : null),
         "location-strategy": "connected",
         scrim: "transparent",
         target: a.value
       }, {
-        default: K(() => [
-          M(P, null, {
-            default: K(() => [
-              (V(!0), q(fe, null, Te(v.value, (I, De) => (V(), B(S, {
-                key: De,
+        default: R(() => [
+          b(U, null, {
+            default: R(() => [
+              (_(!0), K(fe, null, Te(v.value, (Q, pe) => (_(), B(S, {
+                key: pe,
                 link: "",
-                onClick: I.func
+                onClick: Q.func
               }, {
-                default: K(() => [
-                  M(k, null, {
-                    default: K(() => [
-                      ye(F(I.title), 1)
+                default: R(() => [
+                  b(x, null, {
+                    default: R(() => [
+                      he(F(Q.title), 1)
                     ]),
                     _: 2
                   }, 1024)
@@ -394,7 +394,7 @@ const Gt = /* @__PURE__ */ R({
       }, 8, ["modelValue", "target"]);
     };
   }
-}), Yt = { style: { pointerEvents: "none" } }, Ce = /* @__PURE__ */ R({
+}), Yt = { style: { pointerEvents: "none" } }, $e = /* @__PURE__ */ E({
   __name: "index",
   props: {
     title: {},
@@ -416,99 +416,99 @@ const Gt = /* @__PURE__ */ R({
       l("menu", a.clientX, a.clientY);
     };
     return (a, d) => {
-      const c = U("v-icon"), f = U("v-spacer"), v = U("v-btn"), h = ee("ripple");
-      return Z((V(), q("div", {
+      const c = $("v-icon"), f = $("v-spacer"), v = $("v-btn"), C = ee("ripple");
+      return j((_(), K("div", {
         class: "d-flex align-center cursor-pointer",
         style: W(i.value),
         onClick: u,
         onContextmenu: X(r, ["self", "prevent"]),
-        onMouseout: d[2] || (d[2] = (_) => o.value = !1),
-        onMouseover: d[3] || (d[3] = (_) => o.value = !0)
+        onMouseout: d[2] || (d[2] = (h) => o.value = !1),
+        onMouseover: d[3] || (d[3] = (h) => o.value = !0)
       }, [
-        M(c, {
+        b(c, {
           class: "mr-1",
           icon: t.collapse ? "mdi-chevron-right" : "mdi-chevron-down"
         }, null, 8, ["icon"]),
-        O("span", Yt, F(t.title), 1),
-        M(f),
-        t.hasCreate ? (V(), B(v, {
+        q("span", Yt, F(t.title), 1),
+        b(f),
+        t.hasCreate ? (_(), B(v, {
           key: 0,
           class: "mx-3",
           density: "compact",
           icon: "mdi-plus",
           variant: "text",
-          onClick: d[0] || (d[0] = X((_) => l("create"), ["stop"]))
+          onClick: d[0] || (d[0] = X((h) => l("create"), ["stop"]))
         })) : G("", !0),
-        t.hasDelete ? (V(), B(v, {
+        t.hasDelete ? (_(), B(v, {
           key: 1,
           class: "mx-3",
           density: "compact",
           icon: "mdi-minus",
           variant: "text",
-          onClick: d[1] || (d[1] = X((_) => l("delete", t.index), ["stop"]))
+          onClick: d[1] || (d[1] = X((h) => l("delete", t.index), ["stop"]))
         })) : G("", !0)
       ], 36)), [
-        [h]
+        [C]
       ]);
     };
   }
-}), Wt = { class: "d-flex justify-space-between align-center" }, Qt = /* @__PURE__ */ R({
+}), Wt = { class: "d-flex justify-space-between align-center" }, Qt = /* @__PURE__ */ E({
   __name: "index",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
     readonly: { type: Boolean, default: !1 }
   }, {
     modelValue: {},
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q(["delete"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
-    const { t: n } = j(), e = z(t, "modelValue"), l = s, o = L(() => {
+    const { t: n } = I(), e = z(t, "modelValue"), l = s, o = L(() => {
       let r = "100%";
       return t.hasDelete && (r = "calc(100% - 37px)"), {
         width: r
       };
-    }), i = L(() => t.readonly), { open: u } = he(`propTreeColorPickerMenu${Ue()}`);
-    return $e(() => {
+    }), i = L(() => t.readonly), { open: u } = ke(`propTreeColorPickerMenu${Ue()}`);
+    return we(() => {
       u.value = !1;
     }), (r, a) => {
-      const d = U("v-btn"), c = U("v-color-picker"), f = U("v-menu");
-      return V(), B(f, {
-        modelValue: D(u),
+      const d = $("v-btn"), c = $("v-color-picker"), f = $("v-menu");
+      return _(), B(f, {
+        modelValue: P(u),
         "onUpdate:modelValue": a[2] || (a[2] = (v) => re(u) ? u.value = v : null),
         "close-on-content-click": !1,
         scrim: "transparent"
       }, {
-        activator: K(({ props: v }) => [
-          O("div", Wt, [
-            O("div", {
+        activator: R(({ props: v }) => [
+          q("div", Wt, [
+            q("div", {
               class: "flex-grow-1",
               style: W(o.value)
             }, [
-              M(d, we(v, {
+              b(d, Me(v, {
                 block: "",
                 color: e.value,
                 density: "comfortable",
                 disabled: i.value
               }), {
-                default: K(() => [
-                  ye(F(e.value ? e.value : D(n)("x-runtime-lib.notSet")), 1)
+                default: R(() => [
+                  he(F(e.value ? e.value : P(n)("x-runtime-lib.notSet")), 1)
                 ]),
                 _: 1
               }, 16, ["color", "disabled"])
             ], 4),
-            t.hasDelete ? (V(), B(d, {
+            t.hasDelete ? (_(), B(d, {
               key: 0,
               class: "mx-2",
               density: "compact",
               icon: "mdi-minus",
               variant: "text",
-              onClick: a[0] || (a[0] = X((h) => l("delete"), ["stop"]))
+              onClick: a[0] || (a[0] = X((C) => l("delete"), ["stop"]))
             })) : G("", !0)
           ])
         ]),
-        default: K(() => [
-          M(c, {
+        default: R(() => [
+          b(c, {
             modelValue: e.value,
             "onUpdate:modelValue": a[1] || (a[1] = (v) => e.value = v),
             mode: "hexa",
@@ -520,7 +520,7 @@ const Gt = /* @__PURE__ */ R({
       }, 8, ["modelValue"]);
     };
   }
-}), Zt = { class: "text-subtitle-2 ml-1" }, jt = { class: "text-caption text-grey ml-1" }, It = /* @__PURE__ */ R({
+}), Zt = { class: "text-subtitle-2 ml-1" }, jt = { class: "text-caption text-grey ml-1" }, It = /* @__PURE__ */ E({
   __name: "group",
   props: {
     id: {},
@@ -537,26 +537,26 @@ const Gt = /* @__PURE__ */ R({
       userSelect: "none"
     }));
     return (r, a) => {
-      const d = U("v-icon"), c = ee("ripple");
-      return Z((V(), q("div", {
+      const d = $("v-icon"), c = ee("ripple");
+      return j((_(), K("div", {
         class: "d-flex align-center cursor-pointer",
         style: W(u.value),
         onClick: a[0] || (a[0] = (f) => o("x-click", l.id)),
         onMouseout: a[1] || (a[1] = (f) => i.value = !1),
         onMouseover: a[2] || (a[2] = (f) => i.value = !0)
       }, [
-        M(d, {
+        b(d, {
           icon: l.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
           size: "small"
         }, null, 8, ["icon"]),
-        O("span", Zt, F(l.title), 1),
-        O("span", jt, F(l.count), 1)
+        q("span", Zt, F(l.title), 1),
+        q("span", jt, F(l.count), 1)
       ], 36)), [
         [c]
       ]);
     };
   }
-}), en = { class: "text-subtitle-1 ml-6" }, tn = /* @__PURE__ */ R({
+}), en = { class: "text-subtitle-1 ml-6" }, tn = /* @__PURE__ */ E({
   __name: "item",
   props: {
     id: {},
@@ -572,14 +572,14 @@ const Gt = /* @__PURE__ */ R({
     }));
     return (r, a) => {
       const d = ee("ripple");
-      return Z((V(), q("div", {
+      return j((_(), K("div", {
         class: "d-flex align-center cursor-pointer",
         style: W(u.value),
         onClick: a[0] || (a[0] = (c) => o("x-click", l.id)),
         onMouseout: a[1] || (a[1] = (c) => i.value = !1),
         onMouseover: a[2] || (a[2] = (c) => i.value = !0)
       }, [
-        O("span", en, F(l.title), 1)
+        q("span", en, F(l.title), 1)
       ], 36)), [
         [d]
       ]);
@@ -588,7 +588,7 @@ const Gt = /* @__PURE__ */ R({
 }), nn = { key: 0 }, ln = {
   key: 1,
   class: "text-body-2 text-grey ml-3"
-}, on = /* @__PURE__ */ R({
+}, on = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -598,17 +598,17 @@ const Gt = /* @__PURE__ */ R({
   },
   emits: ["update:modelValue", "update:open"],
   setup(t) {
-    const { t: s } = j(), n = z(t, "modelValue"), e = z(t, "open"), l = ot(), o = (u) => {
-      const r = ke(l, u);
+    const { t: s } = I(), n = z(t, "modelValue"), e = z(t, "open"), l = ot(), o = (u) => {
+      const r = _e(l, u);
       r && Ge(l, u, !r.collapse);
     }, i = (u) => {
       n.value = u, e.value = !1, de.emit("refreshDepends");
     };
-    return (u, r) => D(l).length > 0 ? (V(), q("div", nn, [
-      (V(!0), q(fe, null, Te(D(l), (a) => (V(), q(fe, {
+    return (u, r) => P(l).length > 0 ? (_(), K("div", nn, [
+      (_(!0), K(fe, null, Te(P(l), (a) => (_(), K(fe, {
         key: a.id
       }, [
-        a.type === 0 ? (V(), B(It, {
+        a.type === 0 ? (_(), B(It, {
           key: 0,
           id: a.id,
           collapse: a.collapse,
@@ -616,16 +616,16 @@ const Gt = /* @__PURE__ */ R({
           title: a.name,
           onXClick: o
         }, null, 8, ["id", "collapse", "count", "title"])) : G("", !0),
-        a.type === 1 && a.show ? (V(), B(tn, {
+        a.type === 1 && a.show ? (_(), B(tn, {
           key: 1,
           id: a.id,
           title: a.name,
           onXClick: i
         }, null, 8, ["id", "title"])) : G("", !0)
       ], 64))), 128))
-    ])) : (V(), q("div", ln, F(D(s)("x-prop-tree.noComp")), 1));
+    ])) : (_(), K("div", ln, F(P(s)("x-prop-tree.noComp")), 1));
   }
-}), sn = { class: "text-subtitle-1 ml-3" }, un = /* @__PURE__ */ R({
+}), sn = { class: "text-subtitle-1 ml-3" }, un = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -633,7 +633,7 @@ const Gt = /* @__PURE__ */ R({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const { t: s } = j(), n = We(), { sysBarAvail: e } = ve(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = ot(), u = L(() => {
+    const { t: s } = I(), n = We(), { sysBarAvail: e } = ve(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = ot(), u = L(() => {
       let f = "100%";
       return n.mdAndUp.value && (f = "400px"), {
         background: l.value,
@@ -651,73 +651,73 @@ const Gt = /* @__PURE__ */ R({
     })), d = L(() => {
       if (!o.value)
         return s("x-runtime-lib.notSet");
-      const f = ke(i, o.value);
+      const f = _e(i, o.value);
       return f ? f.name : s("x-runtime-lib.compNotAvail");
-    }), { open: c } = he(`propTreeCompSelectDlg${Ue()}`);
-    return $e(() => {
+    }), { open: c } = ke(`propTreeCompSelectDlg${Ue()}`);
+    return we(() => {
       c.value = !1;
     }), (f, v) => {
-      const h = U("v-btn"), _ = U("v-sheet"), C = U("v-icon"), b = U("v-dialog");
-      return V(), B(b, {
-        modelValue: D(c),
-        "onUpdate:modelValue": v[5] || (v[5] = (k) => re(c) ? c.value = k : null),
+      const C = $("v-btn"), h = $("v-sheet"), V = $("v-icon"), D = $("v-dialog");
+      return _(), B(D, {
+        modelValue: P(c),
+        "onUpdate:modelValue": v[5] || (v[5] = (x) => re(c) ? c.value = x : null),
         fullscreen: "",
         "no-click-animation": "",
         persistent: "",
         transition: "scroll-x-reverse-transition",
-        onKeydown: v[6] || (v[6] = Le(X((k) => c.value = !1, ["stop", "prevent"]), ["esc"]))
+        onKeydown: v[6] || (v[6] = Le(X((x) => c.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
-        activator: K(({ props: k }) => [
-          M(h, we(k, {
+        activator: R(({ props: x }) => [
+          b(C, Me(x, {
             block: "",
             density: "comfortable"
           }), {
-            default: K(() => [
-              ye(F(d.value), 1)
+            default: R(() => [
+              he(F(d.value), 1)
             ]),
             _: 1
           }, 16)
         ]),
-        default: K(() => [
-          O("div", {
+        default: R(() => [
+          q("div", {
             class: "w-100 h-100 d-flex flex-row-reverse",
-            onClick: v[3] || (v[3] = X((k) => c.value = !1, ["self"])),
-            onContextmenu: v[4] || (v[4] = X((k) => c.value = !1, ["self", "prevent"]))
+            onClick: v[3] || (v[3] = X((x) => c.value = !1, ["self"])),
+            onContextmenu: v[4] || (v[4] = X((x) => c.value = !1, ["self", "prevent"]))
           }, [
-            O("div", {
+            q("div", {
               class: "elevation-2",
               style: W(u.value)
             }, [
-              D(e) ? (V(), B(_, {
+              P(e) ? (_(), B(h, {
                 key: 0,
                 color: "transparent",
                 height: 24
               })) : G("", !0),
-              M(_, {
+              b(h, {
                 class: "d-flex align-center px-3",
                 color: "transparent",
                 height: 48
               }, {
-                default: K(() => [
-                  M(C, {
+                default: R(() => [
+                  b(V, {
                     icon: "mdi-close",
-                    onClick: v[0] || (v[0] = (k) => c.value = !1)
+                    onClick: v[0] || (v[0] = (x) => c.value = !1)
                   }),
-                  O("span", sn, F(D(s)("x-prop-tree.dlg.compSelect.title")), 1)
+                  q("span", sn, F(P(s)("x-prop-tree.dlg.compSelect.title")), 1)
                 ]),
                 _: 1
               }),
-              O("div", {
+              q("div", {
                 class: "overflow-y-auto",
                 style: W(r.value)
               }, [
-                M(on, {
+                b(on, {
                   modelValue: o.value,
-                  "onUpdate:modelValue": v[1] || (v[1] = (k) => o.value = k),
-                  open: D(c),
-                  "onUpdate:open": v[2] || (v[2] = (k) => re(c) ? c.value = k : null)
+                  "onUpdate:modelValue": v[1] || (v[1] = (x) => o.value = x),
+                  open: P(c),
+                  "onUpdate:open": v[2] || (v[2] = (x) => re(c) ? c.value = x : null)
                 }, null, 8, ["modelValue", "open"]),
-                O("div", {
+                q("div", {
                   style: W(a.value)
                 }, null, 4)
               ], 4)
@@ -728,7 +728,7 @@ const Gt = /* @__PURE__ */ R({
       }, 8, ["modelValue"]);
     };
   }
-}), rn = /* @__PURE__ */ R({
+}), rn = /* @__PURE__ */ E({
   __name: "editor",
   props: {
     modelValue: { required: !0 },
@@ -747,21 +747,21 @@ const Gt = /* @__PURE__ */ R({
     return s({ save: () => {
       const c = r.value.save();
       n.value = JSON.stringify(c, null, 2);
-    } }), (c, f) => (V(), B(D(Mt), {
+    } }), (c, f) => (_(), B(P(Mt), {
       ref_key: "target",
       ref: r,
       lock: e.value,
       "onUpdate:lock": f[0] || (f[0] = (v) => e.value = v),
       scale: l.value,
       "onUpdate:scale": f[1] || (f[1] = (v) => l.value = v),
-      dark: D(o),
-      locale: D(i),
+      dark: P(o),
+      locale: P(i),
       type: "json",
-      version: D(u),
+      version: P(u),
       onReady: a
     }, null, 8, ["lock", "scale", "dark", "locale", "version"]));
   }
-}), an = { class: "text-subtitle-1" }, cn = /* @__PURE__ */ R({
+}), an = { class: "text-subtitle-1" }, cn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: { required: !0 },
@@ -769,84 +769,84 @@ const Gt = /* @__PURE__ */ R({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const { t: s } = j(), { sysBarAvail: n } = ve(), { backgroundColor0: e, backgroundColor1: l, backgroundColor2: o } = te(), i = z(t, "modelValue"), u = T(!1), r = T(1), a = L(() => {
+    const { t: s } = I(), { sysBarAvail: n } = ve(), { backgroundColor0: e, backgroundColor1: l, backgroundColor2: o } = te(), i = z(t, "modelValue"), u = T(!1), r = T(1), a = L(() => {
       let v = 48;
       return n.value && (v += 24), {
         position: "relative",
         background: l.value,
         height: `calc(100% - ${v}px)`
       };
-    }), d = L(() => s("x-prop-tree.dlg.jsonEditor.title")), { open: c } = he(`propTreejsonEditorDlg${Ue()}`);
-    $e(() => {
+    }), d = L(() => s("x-prop-tree.dlg.jsonEditor.title")), { open: c } = ke(`propTreejsonEditorDlg${Ue()}`);
+    we(() => {
       c.value = !1;
     });
     const f = Je("editor");
     return oe(c, (v) => {
       v || f.value?.save();
-    }), (v, h) => {
-      const _ = U("v-btn"), C = U("v-sheet"), b = U("v-spacer"), k = U("v-dialog");
-      return V(), B(k, {
-        modelValue: D(c),
-        "onUpdate:modelValue": h[4] || (h[4] = (S) => re(c) ? c.value = S : null),
+    }), (v, C) => {
+      const h = $("v-btn"), V = $("v-sheet"), D = $("v-spacer"), x = $("v-dialog");
+      return _(), B(x, {
+        modelValue: P(c),
+        "onUpdate:modelValue": C[4] || (C[4] = (S) => re(c) ? c.value = S : null),
         attach: "",
         fullscreen: "",
         "no-click-animation": "",
         persistent: "",
         transition: "dialog-bottom-transition",
-        onKeydown: h[5] || (h[5] = Le(X((S) => c.value = !1, ["stop", "prevent"]), ["esc"]))
+        onKeydown: C[5] || (C[5] = Le(X((S) => c.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
-        activator: K(({ props: S }) => [
-          M(_, we(S, {
+        activator: R(({ props: S }) => [
+          b(h, Me(S, {
             block: "",
             density: "comfortable"
           }), {
-            default: K(() => [
-              ye(F(d.value), 1)
+            default: R(() => [
+              he(F(d.value), 1)
             ]),
             _: 1
           }, 16)
         ]),
-        default: K(() => [
-          M(C, {
-            color: D(e),
+        default: R(() => [
+          b(V, {
+            color: P(e),
             height: "100%",
             width: "100%"
           }, {
-            default: K(() => [
-              D(n) ? (V(), B(C, {
+            default: R(() => [
+              P(n) ? (_(), B(V, {
                 key: 0,
-                color: D(o),
+                color: P(o),
                 height: 24
               }, null, 8, ["color"])) : G("", !0),
-              M(C, {
+              b(V, {
                 class: "d-flex align-center px-2",
-                color: D(o),
+                color: P(o),
                 height: 48
               }, {
-                default: K(() => [
-                  M(_, {
+                default: R(() => [
+                  b(h, {
                     density: "comfortable",
                     icon: "mdi-close",
                     variant: "text",
-                    onClick: h[0] || (h[0] = (S) => c.value = !1)
+                    onClick: C[0] || (C[0] = (S) => c.value = !1)
                   }),
-                  O("span", an, F(D(s)("x-prop-tree.dlg.jsonEditor.title")), 1),
-                  M(b)
+                  q("span", an, F(P(s)("x-prop-tree.dlg.jsonEditor.title")), 1),
+                  b(D)
                 ]),
                 _: 1
               }, 8, ["color"]),
-              O("div", {
+              q("div", {
                 style: W(a.value)
               }, [
-                M(rn, {
+                b(rn, {
                   ref_key: "editor",
                   ref: f,
                   modelValue: i.value,
-                  "onUpdate:modelValue": h[1] || (h[1] = (S) => i.value = S),
+                  "onUpdate:modelValue": C[1] || (C[1] = (S) => i.value = S),
                   lock: u.value,
-                  "onUpdate:lock": h[2] || (h[2] = (S) => u.value = S),
+                  "onUpdate:lock": C[2] || (C[2] = (S) => u.value = S),
                   scale: r.value,
-                  "onUpdate:scale": h[3] || (h[3] = (S) => r.value = S)
+                  "onUpdate:scale": C[3] || (C[3] = (S) => r.value = S)
                 }, null, 8, ["modelValue", "lock", "scale"])
               ], 4)
             ]),
@@ -857,35 +857,35 @@ const Gt = /* @__PURE__ */ R({
       }, 8, ["modelValue"]);
     };
   }
-}), dn = { class: "d-flex justify-space-between align-center my-2" }, mn = { class: "flex-grow-1" }, fn = /* @__PURE__ */ R({
+}), dn = { class: "d-flex justify-space-between align-center my-2" }, mn = { class: "flex-grow-1" }, fn = /* @__PURE__ */ E({
   __name: "index",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
     types: {}
   }, {
     modelValue: {},
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q(["delete"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
-    const { t: n } = j(), { isMobile: e } = ve(), l = z(t, "modelValue"), o = s, i = Oe(), u = L(() => Ne[i.value]?.types[t.types]), r = T(0), a = L(() => {
-      const h = [];
-      return u.value?.forEach(({ title: _ }, C) => {
-        h.push({
-          title: n(_),
-          value: C
+    const { t: n } = I(), { isMobile: e } = ve(), l = z(t, "modelValue"), o = s, i = Oe(), u = L(() => Ne[i.value]?.types[t.types]), r = T(0), a = L(() => {
+      const C = [];
+      return u.value?.forEach(({ title: h }, V) => {
+        C.push({
+          title: n(h),
+          value: V
         });
-      }), h;
+      }), C;
     });
     Ke(() => {
-      u.value?.some((h, _) => h.validator(l.value) ? (r.value = _, !0) : !1);
+      u.value?.some((C, h) => C.validator(l.value) ? (r.value = h, !0) : !1);
     });
     const d = L(() => u.value?.[r.value]), c = () => {
       l.value = d.value?.default;
-    }, f = T(0), v = async (h) => {
-      if (!h || !e() || d.value.ui !== "pixelInput" && d.value.ui !== "percentInput")
+    }, f = T(0), v = async (C) => {
+      if (!C || !e() || d.value.ui !== "pixelInput" && d.value.ui !== "percentInput")
         return;
-      const _ = await Fe({
+      const h = await Fe({
         title: "",
         value: f.value,
         precision: d.value.precision,
@@ -893,20 +893,20 @@ const Gt = /* @__PURE__ */ R({
         max: d.value.max,
         step: d.value.step
       });
-      _ !== void 0 && (f.value = _);
+      h !== void 0 && (f.value = h);
     };
     return Ke(() => {
-      d.value?.ui === "pixelInput" ? f.value = Ct(l.value) : d.value?.ui === "percentInput" && (f.value = Ut(l.value));
-    }), oe(f, (h) => {
-      d.value?.ui === "pixelInput" ? l.value = h + "px" : d.value?.ui === "percentInput" && (l.value = h + "%");
-    }), (h, _) => {
-      const C = U("v-select"), b = U("v-number-input"), k = U("v-btn"), S = ee("ripple");
-      return V(), q("div", dn, [
-        O("div", mn, [
-          Z(M(C, {
+      d.value?.ui === "pixelInput" ? f.value = Ct(l.value) : d.value?.ui === "percentInput" && (f.value = $t(l.value));
+    }), oe(f, (C) => {
+      d.value?.ui === "pixelInput" ? l.value = C + "px" : d.value?.ui === "percentInput" && (l.value = C + "%");
+    }), (C, h) => {
+      const V = $("v-select"), D = $("v-number-input"), x = $("v-btn"), S = ee("ripple");
+      return _(), K("div", dn, [
+        q("div", mn, [
+          j(b(V, {
             modelValue: r.value,
             "onUpdate:modelValue": [
-              _[0] || (_[0] = (P) => r.value = P),
+              h[0] || (h[0] = (U) => r.value = U),
               c
             ],
             density: "compact",
@@ -921,10 +921,10 @@ const Gt = /* @__PURE__ */ R({
               { stop: !0 }
             ]
           ]),
-          d.value?.ui === "pixelInput" || d.value?.ui === "percentInput" ? Z((V(), B(b, {
+          d.value?.ui === "pixelInput" || d.value?.ui === "percentInput" ? j((_(), B(D, {
             key: 0,
             modelValue: f.value,
-            "onUpdate:modelValue": _[1] || (_[1] = (P) => f.value = P),
+            "onUpdate:modelValue": h[1] || (h[1] = (U) => f.value = U),
             "control-variant": "stacked",
             density: "compact",
             "hide-details": "",
@@ -943,20 +943,20 @@ const Gt = /* @__PURE__ */ R({
             ]
           ]) : G("", !0)
         ]),
-        t.hasDelete ? (V(), B(k, {
+        t.hasDelete ? (_(), B(x, {
           key: 0,
           class: "mx-2",
           density: "compact",
           icon: "mdi-minus",
           variant: "text",
-          onClick: _[2] || (_[2] = X((P) => o("delete"), ["stop"]))
+          onClick: h[2] || (h[2] = X((U) => o("delete"), ["stop"]))
         })) : G("", !0)
       ]);
     };
   }
-}), vn = { class: "d-flex justify-space-between align-center" }, pn = /* @__PURE__ */ R({
+}), vn = { class: "d-flex justify-space-between align-center" }, pn = /* @__PURE__ */ E({
   __name: "index",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
     precision: { default: () => {
     } },
@@ -968,7 +968,7 @@ const Gt = /* @__PURE__ */ R({
     modelValue: { required: !0 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q(["delete"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
     const { isMobile: n } = ve(), e = z(t, "modelValue"), l = s, o = async (i) => {
       if (!i || t.readonly || !n())
@@ -984,9 +984,9 @@ const Gt = /* @__PURE__ */ R({
       u !== void 0 && (e.value = u);
     };
     return (i, u) => {
-      const r = U("v-number-input"), a = U("v-btn"), d = ee("ripple");
-      return V(), q("div", vn, [
-        Z(M(r, {
+      const r = $("v-number-input"), a = $("v-btn"), d = ee("ripple");
+      return _(), K("div", vn, [
+        j(b(r, {
           modelValue: e.value,
           "onUpdate:modelValue": u[0] || (u[0] = (c) => e.value = c),
           "control-variant": "stacked",
@@ -1007,7 +1007,7 @@ const Gt = /* @__PURE__ */ R({
             { stop: !0 }
           ]
         ]),
-        t.hasDelete ? (V(), B(a, {
+        t.hasDelete ? (_(), B(a, {
           key: 0,
           class: "mx-2",
           density: "compact",
@@ -1018,9 +1018,9 @@ const Gt = /* @__PURE__ */ R({
       ]);
     };
   }
-}), gn = { class: "d-flex justify-space-between align-center" }, yn = /* @__PURE__ */ R({
+}), gn = { class: "d-flex justify-space-between align-center" }, yn = /* @__PURE__ */ E({
   __name: "index",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
     readonly: { type: Boolean, default: !1 },
     items: {}
@@ -1028,18 +1028,18 @@ const Gt = /* @__PURE__ */ R({
     modelValue: {},
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q(["delete"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
-    const { t: n } = j(), e = z(t, "modelValue"), l = s, o = Oe(), i = L(() => {
+    const { t: n } = I(), e = z(t, "modelValue"), l = s, o = Oe(), i = L(() => {
       const u = [];
       return Ne[o.value]?.items[t.items].forEach(({ title: r, value: a }) => {
         u.push({ title: n(r), value: a });
       }), u;
     });
     return (u, r) => {
-      const a = U("v-select"), d = U("v-btn"), c = ee("ripple");
-      return V(), q("div", gn, [
-        Z(M(a, {
+      const a = $("v-select"), d = $("v-btn"), c = ee("ripple");
+      return _(), K("div", gn, [
+        j(b(a, {
           modelValue: e.value,
           "onUpdate:modelValue": r[0] || (r[0] = (f) => e.value = f),
           density: "compact",
@@ -1055,7 +1055,7 @@ const Gt = /* @__PURE__ */ R({
             { stop: !0 }
           ]
         ]),
-        t.hasDelete ? (V(), B(d, {
+        t.hasDelete ? (_(), B(d, {
           key: 0,
           class: "mx-2",
           density: "compact",
@@ -1066,7 +1066,7 @@ const Gt = /* @__PURE__ */ R({
       ]);
     };
   }
-}), hn = { class: "text-subtitle-2 ml-1" }, kn = { class: "text-caption text-grey ml-1" }, _n = /* @__PURE__ */ R({
+}), hn = { class: "text-subtitle-2 ml-1" }, kn = { class: "text-caption text-grey ml-1" }, _n = /* @__PURE__ */ E({
   __name: "group",
   props: {
     id: {},
@@ -1083,26 +1083,26 @@ const Gt = /* @__PURE__ */ R({
       userSelect: "none"
     }));
     return (r, a) => {
-      const d = U("v-icon"), c = ee("ripple");
-      return Z((V(), q("div", {
+      const d = $("v-icon"), c = ee("ripple");
+      return j((_(), K("div", {
         class: "d-flex align-center cursor-pointer",
         style: W(u.value),
         onClick: a[0] || (a[0] = (f) => o("x-click", l.id)),
         onMouseout: a[1] || (a[1] = (f) => i.value = !1),
         onMouseover: a[2] || (a[2] = (f) => i.value = !0)
       }, [
-        M(d, {
+        b(d, {
           icon: l.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
           size: "small"
         }, null, 8, ["icon"]),
-        O("span", hn, F(l.title), 1),
-        O("span", kn, F(l.count), 1)
+        q("span", hn, F(l.title), 1),
+        q("span", kn, F(l.count), 1)
       ], 36)), [
         [c]
       ]);
     };
   }
-}), xn = { class: "text-subtitle-1 ml-6" }, Vn = /* @__PURE__ */ R({
+}), xn = { class: "text-subtitle-1 ml-6" }, Vn = /* @__PURE__ */ E({
   __name: "item",
   props: {
     id: {},
@@ -1118,14 +1118,14 @@ const Gt = /* @__PURE__ */ R({
     }));
     return (r, a) => {
       const d = ee("ripple");
-      return Z((V(), q("div", {
+      return j((_(), K("div", {
         class: "d-flex align-center cursor-pointer",
         style: W(u.value),
         onClick: a[0] || (a[0] = (c) => o("x-click", l.id)),
         onMouseout: a[1] || (a[1] = (c) => i.value = !1),
         onMouseover: a[2] || (a[2] = (c) => i.value = !0)
       }, [
-        O("span", xn, F(l.title), 1)
+        q("span", xn, F(l.title), 1)
       ], 36)), [
         [d]
       ]);
@@ -1134,7 +1134,7 @@ const Gt = /* @__PURE__ */ R({
 }), Sn = { key: 0 }, Cn = {
   key: 1,
   class: "text-body-2 text-grey ml-3"
-}, Un = /* @__PURE__ */ R({
+}, $n = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -1144,17 +1144,17 @@ const Gt = /* @__PURE__ */ R({
   },
   emits: ["update:modelValue", "update:open"],
   setup(t) {
-    const { t: s } = j(), n = z(t, "modelValue"), e = z(t, "open"), l = st(), o = (u) => {
-      const r = ke(l, u);
+    const { t: s } = I(), n = z(t, "modelValue"), e = z(t, "open"), l = st(), o = (u) => {
+      const r = _e(l, u);
       r && Ge(l, u, !r.collapse);
     }, i = (u) => {
       n.value = u, e.value = !1;
     };
-    return (u, r) => D(l).length > 0 ? (V(), q("div", Sn, [
-      (V(!0), q(fe, null, Te(D(l), (a) => (V(), q(fe, {
+    return (u, r) => P(l).length > 0 ? (_(), K("div", Sn, [
+      (_(!0), K(fe, null, Te(P(l), (a) => (_(), K(fe, {
         key: a.id
       }, [
-        a.type === 0 ? (V(), B(_n, {
+        a.type === 0 ? (_(), B(_n, {
           key: 0,
           id: a.id,
           collapse: a.collapse,
@@ -1162,16 +1162,16 @@ const Gt = /* @__PURE__ */ R({
           title: a.name,
           onXClick: o
         }, null, 8, ["id", "collapse", "count", "title"])) : G("", !0),
-        a.type === 1 && a.show ? (V(), B(Vn, {
+        a.type === 1 && a.show ? (_(), B(Vn, {
           key: 1,
           id: a.id,
           title: a.name,
           onXClick: i
         }, null, 8, ["id", "title"])) : G("", !0)
       ], 64))), 128))
-    ])) : (V(), q("div", Cn, F(D(s)("x-prop-tree.noSlot")), 1));
+    ])) : (_(), K("div", Cn, F(P(s)("x-prop-tree.noSlot")), 1));
   }
-}), $n = { class: "text-subtitle-1 ml-3" }, wn = /* @__PURE__ */ R({
+}), Un = { class: "text-subtitle-1 ml-3" }, wn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -1179,7 +1179,7 @@ const Gt = /* @__PURE__ */ R({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const { t: s } = j(), n = We(), { sysBarAvail: e } = ve(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = st(), u = L(() => {
+    const { t: s } = I(), n = We(), { sysBarAvail: e } = ve(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = st(), u = L(() => {
       let f = "100%";
       return n.mdAndUp.value && (f = "400px"), {
         background: l.value,
@@ -1197,73 +1197,73 @@ const Gt = /* @__PURE__ */ R({
     })), d = L(() => {
       if (!o.value)
         return s("x-runtime-lib.notSet");
-      const f = ke(i, o.value);
+      const f = _e(i, o.value);
       return f ? f.name : s("x-runtime-lib.slotNotAvail");
-    }), { open: c } = he(`propTreeSlotSelectDlg${Ue()}`);
-    return $e(() => {
+    }), { open: c } = ke(`propTreeSlotSelectDlg${Ue()}`);
+    return we(() => {
       c.value = !1;
     }), (f, v) => {
-      const h = U("v-btn"), _ = U("v-sheet"), C = U("v-icon"), b = U("v-dialog");
-      return V(), B(b, {
-        modelValue: D(c),
-        "onUpdate:modelValue": v[5] || (v[5] = (k) => re(c) ? c.value = k : null),
+      const C = $("v-btn"), h = $("v-sheet"), V = $("v-icon"), D = $("v-dialog");
+      return _(), B(D, {
+        modelValue: P(c),
+        "onUpdate:modelValue": v[5] || (v[5] = (x) => re(c) ? c.value = x : null),
         fullscreen: "",
         "no-click-animation": "",
         persistent: "",
         transition: "scroll-x-reverse-transition",
-        onKeydown: v[6] || (v[6] = Le(X((k) => c.value = !1, ["stop", "prevent"]), ["esc"]))
+        onKeydown: v[6] || (v[6] = Le(X((x) => c.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
-        activator: K(({ props: k }) => [
-          M(h, we(k, {
+        activator: R(({ props: x }) => [
+          b(C, Me(x, {
             block: "",
             density: "comfortable"
           }), {
-            default: K(() => [
-              ye(F(d.value), 1)
+            default: R(() => [
+              he(F(d.value), 1)
             ]),
             _: 1
           }, 16)
         ]),
-        default: K(() => [
-          O("div", {
+        default: R(() => [
+          q("div", {
             class: "w-100 h-100 d-flex flex-row-reverse",
-            onClick: v[3] || (v[3] = X((k) => c.value = !1, ["self"])),
-            onContextmenu: v[4] || (v[4] = X((k) => c.value = !1, ["self", "prevent"]))
+            onClick: v[3] || (v[3] = X((x) => c.value = !1, ["self"])),
+            onContextmenu: v[4] || (v[4] = X((x) => c.value = !1, ["self", "prevent"]))
           }, [
-            O("div", {
+            q("div", {
               class: "elevation-2",
               style: W(u.value)
             }, [
-              D(e) ? (V(), B(_, {
+              P(e) ? (_(), B(h, {
                 key: 0,
                 color: "transparent",
                 height: 24
               })) : G("", !0),
-              M(_, {
+              b(h, {
                 class: "d-flex align-center px-3",
                 color: "transparent",
                 height: 48
               }, {
-                default: K(() => [
-                  M(C, {
+                default: R(() => [
+                  b(V, {
                     icon: "mdi-close",
-                    onClick: v[0] || (v[0] = (k) => c.value = !1)
+                    onClick: v[0] || (v[0] = (x) => c.value = !1)
                   }),
-                  O("span", $n, F(D(s)("x-prop-tree.dlg.slotSelect.title")), 1)
+                  q("span", Un, F(P(s)("x-prop-tree.dlg.slotSelect.title")), 1)
                 ]),
                 _: 1
               }),
-              O("div", {
+              q("div", {
                 class: "overflow-y-auto",
                 style: W(r.value)
               }, [
-                M(Un, {
+                b($n, {
                   modelValue: o.value,
-                  "onUpdate:modelValue": v[1] || (v[1] = (k) => o.value = k),
-                  open: D(c),
-                  "onUpdate:open": v[2] || (v[2] = (k) => re(c) ? c.value = k : null)
+                  "onUpdate:modelValue": v[1] || (v[1] = (x) => o.value = x),
+                  open: P(c),
+                  "onUpdate:open": v[2] || (v[2] = (x) => re(c) ? c.value = x : null)
                 }, null, 8, ["modelValue", "open"]),
-                O("div", {
+                q("div", {
                   style: W(a.value)
                 }, null, 4)
               ], 4)
@@ -1274,16 +1274,16 @@ const Gt = /* @__PURE__ */ R({
       }, 8, ["modelValue"]);
     };
   }
-}), Mn = { class: "d-flex justify-space-between align-center" }, bn = /* @__PURE__ */ R({
+}), Mn = { class: "d-flex justify-space-between align-center" }, bn = /* @__PURE__ */ E({
   __name: "index",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
     readonly: { type: Boolean, default: !1 }
   }, {
     modelValue: { required: !0 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q(["delete"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
     const { isMobile: n } = ve(), e = z(t, "modelValue"), l = s, o = async (i) => {
       if (!i || t.readonly || !n())
@@ -1295,9 +1295,9 @@ const Gt = /* @__PURE__ */ R({
       u !== void 0 && (e.value = u);
     };
     return (i, u) => {
-      const r = U("v-text-field"), a = U("v-btn"), d = ee("ripple");
-      return V(), q("div", Mn, [
-        Z(M(r, {
+      const r = $("v-text-field"), a = $("v-btn"), d = ee("ripple");
+      return _(), K("div", Mn, [
+        j(b(r, {
           modelValue: e.value,
           "onUpdate:modelValue": u[0] || (u[0] = (c) => e.value = c),
           density: "compact",
@@ -1313,7 +1313,7 @@ const Gt = /* @__PURE__ */ R({
             { stop: !0 }
           ]
         ]),
-        t.hasDelete ? (V(), B(a, {
+        t.hasDelete ? (_(), B(a, {
           key: 0,
           class: "mx-2",
           density: "compact",
@@ -1324,22 +1324,22 @@ const Gt = /* @__PURE__ */ R({
       ]);
     };
   }
-}), Pn = { class: "d-flex justify-space-between align-center" }, Dn = /* @__PURE__ */ R({
+}), Pn = { class: "d-flex justify-space-between align-center" }, Dn = /* @__PURE__ */ E({
   __name: "index",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
     readonly: { type: Boolean, default: !1 }
   }, {
     modelValue: { type: Boolean },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q(["delete"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
     const n = z(t, "modelValue"), e = s;
     return (l, o) => {
-      const i = U("v-switch"), u = U("v-btn");
-      return V(), q("div", Pn, [
-        M(i, {
+      const i = $("v-switch"), u = $("v-btn");
+      return _(), K("div", Pn, [
+        b(i, {
           modelValue: n.value,
           "onUpdate:modelValue": o[0] || (o[0] = (r) => n.value = r),
           class: "ml-1",
@@ -1348,7 +1348,7 @@ const Gt = /* @__PURE__ */ R({
           "hide-details": "",
           readonly: t.readonly
         }, null, 8, ["modelValue", "readonly"]),
-        t.hasDelete ? (V(), B(u, {
+        t.hasDelete ? (_(), B(u, {
           key: 0,
           class: "mx-2",
           density: "compact",
@@ -1361,7 +1361,7 @@ const Gt = /* @__PURE__ */ R({
   }
 });
 function An(t) {
-  return { renderUiColorPicker: (n, e, l, o, i) => e.ui !== "colorPicker" ? (console.assert(!1), x("div", "renderUiColorPicker property ui must be colorPicker")) : x(Qt, {
+  return { renderUiColorPicker: (n, e, l, o, i) => e.ui !== "colorPicker" ? (console.assert(!1), k("div", "renderUiColorPicker property ui must be colorPicker")) : k(Qt, {
     modelValue: ne(
       n,
       e,
@@ -1389,7 +1389,7 @@ function An(t) {
   }) };
 }
 function Tn(t) {
-  return { renderUiCompSelect: (n, e, l, o, i) => e.ui !== "compSelect" ? (console.assert(!1), x("div", "renderUiCompSelect property ui must be compSelect")) : x(un, {
+  return { renderUiCompSelect: (n, e, l, o, i) => e.ui !== "compSelect" ? (console.assert(!1), k("div", "renderUiCompSelect property ui must be compSelect")) : k(un, {
     modelValue: ne(
       n,
       e,
@@ -1421,7 +1421,7 @@ function Ln(t) {
   } };
 }
 function Nn(t) {
-  return { renderUiJsonEditor: (n, e, l, o, i) => e.ui !== "jsonEditor" ? x("div", "renderUijsonEditor property ui must be jsonEditor") : x(cn, {
+  return { renderUiJsonEditor: (n, e, l, o, i) => e.ui !== "jsonEditor" ? k("div", "renderUijsonEditor property ui must be jsonEditor") : k(cn, {
     modelValue: ne(
       n,
       e,
@@ -1444,7 +1444,7 @@ function Nn(t) {
   }) };
 }
 function Bn(t) {
-  return { renderUiMultiTypes: (n, e, l, o, i) => e.ui !== "multiTypes" ? (console.assert(!1), x("div", "renderUiMultiTypes property ui must be multiTypes")) : x(fn, {
+  return { renderUiMultiTypes: (n, e, l, o, i) => e.ui !== "multiTypes" ? (console.assert(!1), k("div", "renderUiMultiTypes property ui must be multiTypes")) : k(fn, {
     modelValue: ne(
       n,
       e,
@@ -1472,7 +1472,7 @@ function Bn(t) {
   }) };
 }
 function On(t) {
-  return { renderUiNumInput: (n, e, l, o, i) => e.ui !== "numInput" ? (console.assert(!1), x("div", "renderUiNumInput property ui must be numInput")) : x(pn, {
+  return { renderUiNumInput: (n, e, l, o, i) => e.ui !== "numInput" ? (console.assert(!1), k("div", "renderUiNumInput property ui must be numInput")) : k(pn, {
     modelValue: ne(
       n,
       e,
@@ -1503,7 +1503,7 @@ function On(t) {
     readonly: e.readonly
   }) };
 }
-const qn = /* @__PURE__ */ R({
+const qn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     minHeight: {}
@@ -1521,7 +1521,7 @@ const qn = /* @__PURE__ */ R({
     };
     return (r, a) => {
       const d = ee("ripple");
-      return Z((V(), q("div", {
+      return j((_(), K("div", {
         class: "d-flex justify-space-between align-center cursor-pointer",
         style: W(i.value),
         onContextmenu: X(u, ["self", "prevent"]),
@@ -1536,11 +1536,11 @@ const qn = /* @__PURE__ */ R({
   }
 });
 function Kn(t, s, n) {
-  const { t: e } = j();
+  const { t: e } = I();
   return { renderProperty: (o, i, u) => {
     const r = o[o.length - 1];
     let d = typeof r == "number" ? `[${r + 1}]` : e(i.name);
-    return me(t.value, o) && (d += " *"), x(
+    return me(t.value, o) && (d += " *"), k(
       qn,
       {
         minHeight: s.value,
@@ -1549,17 +1549,17 @@ function Kn(t, s, n) {
         }
       },
       () => [
-        x("span", {
+        k("span", {
           style: { marginLeft: "4px", pointerEvents: "none" },
           innerHTML: d
         }),
-        x("div", { style: { width: n.value } }, u)
+        k("div", { style: { width: n.value } }, u)
       ]
     );
   } };
 }
 function Rn(t) {
-  return { renderUiSelect: (n, e, l, o, i) => e.ui !== "select" ? (console.assert(!1), x("div", "renderUiSelect property ui must be select")) : x(yn, {
+  return { renderUiSelect: (n, e, l, o, i) => e.ui !== "select" ? (console.assert(!1), k("div", "renderUiSelect property ui must be select")) : k(yn, {
     modelValue: ne(
       n,
       e,
@@ -1588,7 +1588,7 @@ function Rn(t) {
   }) };
 }
 function En(t) {
-  return { renderUiSlotSelect: (n, e, l, o, i) => e.ui !== "slotSelect" ? (console.assert(!1), x("div", "renderUiSlotSelect property ui must be slotSelect")) : x(wn, {
+  return { renderUiSlotSelect: (n, e, l, o, i) => e.ui !== "slotSelect" ? (console.assert(!1), k("div", "renderUiSlotSelect property ui must be slotSelect")) : k(wn, {
     modelValue: ne(
       n,
       e,
@@ -1611,7 +1611,7 @@ function En(t) {
   }) };
 }
 function Jn(t) {
-  return { renderUiStrInput: (n, e, l, o, i) => e.ui !== "strInput" ? (console.assert(!1), x("div", "renderUiStrInput property ui must be strInput")) : x(bn, {
+  return { renderUiStrInput: (n, e, l, o, i) => e.ui !== "strInput" ? (console.assert(!1), k("div", "renderUiStrInput property ui must be strInput")) : k(bn, {
     modelValue: e.static ? e.value : ne(
       n,
       e,
@@ -1639,7 +1639,7 @@ function Jn(t) {
   }) };
 }
 function Hn(t) {
-  return { renderUiSwitch: (n, e, l, o, i) => e.ui !== "switch" ? (console.assert(!1), x("div", "renderUiSwitch property ui must be switch")) : x(Dn, {
+  return { renderUiSwitch: (n, e, l, o, i) => e.ui !== "switch" ? (console.assert(!1), k("div", "renderUiSwitch property ui must be switch")) : k(Dn, {
     modelValue: ne(
       n,
       e,
@@ -1710,42 +1710,58 @@ function Fn(t, s, n) {
       console.assert(!1, `invalid version=${t.value}`);
       return;
     }
-    const d = $t(s.value, n.value), c = [];
+    const d = Ut(s.value, n.value), c = [];
     for (let h = 0; h < a.groups[d].length; h++) {
-      const _ = a.groups[d][h], C = ke(l, _.key);
+      const V = a.groups[d][h], D = _e(l, V.key);
       c.push({
-        id: _.key,
+        id: V.key,
         type: 0,
-        name: e.global.t(_.name),
+        name: e.global.t(V.name),
         position: h,
-        collapse: C?.collapse ?? !0,
+        collapse: D?.collapse ?? !0,
         count: 0
       });
-      for (let b = 0; b < _.items.length; b++) {
-        const k = _.items[b], S = wt[k];
-        S && (S.internal || !S.slots || S.slots.length <= 0 || c.push({
-          id: S.key,
-          type: 1,
-          name: e.global.t(S.name),
-          position: b,
-          group: _.key
-        }));
+      let x = 0;
+      for (const S of V.items) {
+        const U = wt[S];
+        if (U && !U.internal && U.slots)
+          for (const O of U.slots) {
+            const Q = `element/${U.key}/${O.key}`, pe = `${e.global.t(U.name)} / ${e.global.t(O.name)}`;
+            c.push({
+              id: Q,
+              type: 1,
+              name: pe,
+              position: x++,
+              group: V.key
+            });
+          }
       }
     }
     const { activeApp: f, depends: v } = Qe.app;
-    for (const { id: h, name: _, position: C } of f.compGroups) {
-      const b = l.value.find((k) => k.id);
+    for (const { id: h, name: V, position: D } of f.compGroups) {
+      const x = l.value.find((S) => S.id);
       c.push({
         id: h,
         type: 0,
-        name: _,
-        position: C,
-        collapse: b?.collapse ?? !0
+        name: V,
+        position: D,
+        collapse: x?.collapse ?? !0
       });
     }
-    for (const { id: h, groupId: _, name: C, position: b } of f.comps) {
-      const k = v[h];
-      k && (!k.meta.slots || k.meta.slots.length <= 0 || c.push({ id: h, type: 1, name: C, position: b, group: _ }));
+    let C = 0;
+    for (const h of f.comps) {
+      const V = v[h.id];
+      if (V && V.meta.slots)
+        for (const D of V.meta.slots) {
+          const x = `custom/${h.id}/${D.id}`, S = `${h.name} / ${D.name}`;
+          c.push({
+            id: x,
+            type: 1,
+            name: S,
+            position: C++,
+            group: h.groupId
+          });
+        }
     }
     Ye(c, !0), l.value = c;
   };
@@ -1765,7 +1781,7 @@ function Fn(t, s, n) {
     o(), u();
   });
 }
-const zn = /* @__PURE__ */ R({
+const zn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     unique: {},
@@ -1777,7 +1793,7 @@ const zn = /* @__PURE__ */ R({
   },
   emits: ["change"],
   setup(t, { emit: s }) {
-    const { t: n } = j(), { backgroundColor1: e } = te(), l = t, o = s, i = T("20px"), u = T("56px"), r = T("200px"), a = kt({}), d = T({}), c = (p, m) => {
+    const { t: n } = I(), { backgroundColor1: e } = te(), l = t, o = s, i = T("20px"), u = T("56px"), r = T("200px"), a = kt({}), d = T({}), c = (p, m) => {
       Ee(d, l.config, l.object), o("change", p, m);
     };
     oe(
@@ -1808,77 +1824,77 @@ const zn = /* @__PURE__ */ R({
         v.value = l.type;
       }
     );
-    const h = T(l.subtype);
+    const C = T(l.subtype);
     oe(
       () => l.subtype,
       () => {
-        h.value = l.subtype;
+        C.value = l.subtype;
       }
     );
-    const _ = T(l.config);
-    Ot(_), oe(
+    const h = T(l.config);
+    Ot(h), oe(
       () => l.config,
       () => {
-        _.value = l.config;
+        h.value = l.config;
       }
     );
-    const C = T(l.object);
-    Kt(C), oe(
+    const V = T(l.object);
+    Kt(V), oe(
       () => l.object,
       () => {
-        C.value = l.object;
+        V.value = l.object;
       }
-    ), Et(d), Ht(c), Xn(), Fn(f, v, h);
-    const { renderProperty: b } = Kn(
+    ), Et(d), Ht(c), Xn(), Fn(f, v, C);
+    const { renderProperty: D } = Kn(
       d,
       u,
       r
-    ), { renderUiDummy: k } = Ln(c), { renderUiStrInput: S } = Jn(c), { renderUiNumInput: P } = On(c), { renderUiSwitch: E } = Hn(c), { renderUiSelect: I } = Rn(c), { renderUiColorPicker: De } = An(c), { renderUiJsonEditor: it } = Nn(c), { renderUiMultiTypes: ut } = Bn(c), { renderUiCompSelect: rt } = Tn(c), { renderUiSlotSelect: at } = En(c), _e = (p, m, y, g, $, A) => (p = ze(p), $ !== void 0 ? (p.push($), A && p.push(m.key)) : p.push(m.key), m.ui ? m.array && g ? mt(
+    ), { renderUiDummy: x } = Ln(c), { renderUiStrInput: S } = Jn(c), { renderUiNumInput: U } = On(c), { renderUiSwitch: O } = Hn(c), { renderUiSelect: Q } = Rn(c), { renderUiColorPicker: pe } = An(c), { renderUiJsonEditor: it } = Nn(c), { renderUiMultiTypes: ut } = Bn(c), { renderUiCompSelect: rt } = Tn(c), { renderUiSlotSelect: at } = En(c), xe = (p, m, y, g, w, A) => (p = ze(p), w !== void 0 ? (p.push(w), A && p.push(m.key)) : p.push(m.key), m.ui ? m.array && g ? mt(
       p,
       m,
       y,
       g,
-      $,
+      w,
       A
-    ) : ft(p, m, y, $, A) : m.array ? ct(
+    ) : ft(p, m, y, w, A) : m.array ? ct(
       p,
       m,
       y,
       g,
-      $,
+      w,
       A
     ) : dt(
       p,
       m,
       y,
       g,
-      $,
+      w,
       A
-    )), ct = (p, m, y, g, $, A) => {
+    )), ct = (p, m, y, g, w, A) => {
       if (m.ui)
-        return console.assert(!1), x("div", "renderBranchArray property ui must be invalid");
+        return console.assert(!1), k("div", "renderBranchArray property ui must be invalid");
       if (!m.array)
-        return console.assert(!1), x("div", "renderBranchArray property array must be valid");
+        return console.assert(!1), k("div", "renderBranchArray property array must be valid");
       if (!g)
-        return console.assert(!1), x("div", "renderBranchArray branch must be valid");
+        return console.assert(!1), k("div", "renderBranchArray branch must be valid");
       let H;
-      $ !== void 0 && !A ? (y[$] instanceof Array || (y[$] = J(m), c(p, y[m.key])), H = y[$]) : (y[m.key] instanceof Array || (y[m.key] = J(m), c(p, y[m.key])), H = y[m.key]);
+      w !== void 0 && !A ? (y[w] instanceof Array || (y[w] = J(m), c(p, y[m.key])), H = y[w]) : (y[m.key] instanceof Array || (y[m.key] = J(m), c(p, y[m.key])), H = y[m.key]);
       let ie = n(m.name);
       g.collapse && me(d.value, p) && (ie += " *");
-      const pe = x(Ce, {
+      const ge = k($e, {
         title: ie,
         collapse: g.collapse,
         hasCreate: !0,
-        onCollapse: (w) => {
-          g.collapse = w;
+        onCollapse: (M) => {
+          g.collapse = M;
         },
-        onMenu: (w, N) => {
-          de.emit("propTreeMenu", { x: w, y: N, keys: p });
+        onMenu: (M, N) => {
+          de.emit("propTreeMenu", { x: M, y: N, keys: p });
         },
         onCreate: () => {
           H.push({}), c(p, H);
         }
-      }), Y = x(
+      }), Y = k(
         "div",
         {
           style: {
@@ -1886,7 +1902,7 @@ const zn = /* @__PURE__ */ R({
           }
         },
         (() => {
-          const w = [];
+          const M = [];
           for (let N = 0; N < H.length; N++) {
             if (!Ae(g.children)) {
               console.assert(!1);
@@ -1896,10 +1912,10 @@ const zn = /* @__PURE__ */ R({
               collapse: !0,
               children: {}
             });
-            const xe = [...p, N], Ve = g.children[N];
+            const Ve = [...p, N], Se = g.children[N];
             let qe = `[${N + 1}]`;
-            g.children[N].collapse && me(d.value, xe) && (qe += " *");
-            const pt = x(Ce, {
+            g.children[N].collapse && me(d.value, Ve) && (qe += " *");
+            const pt = k($e, {
               title: qe,
               collapse: g.children[N].collapse,
               hasDelete: !0,
@@ -1912,7 +1928,7 @@ const zn = /* @__PURE__ */ R({
                 g.children[N].collapse = le;
               },
               onMenu: (le, ue) => {
-                de.emit("propTreeMenu", { x: le, y: ue, keys: xe });
+                de.emit("propTreeMenu", { x: le, y: ue, keys: Ve });
               },
               onDelete: (le) => {
                 if (!Ae(g.children)) {
@@ -1922,8 +1938,8 @@ const zn = /* @__PURE__ */ R({
                 g.children.splice(le, 1), H.splice(le, 1), c(p, H);
               }
             });
-            w.push(pt);
-            const gt = x(
+            M.push(pt);
+            const gt = k(
               "div",
               {
                 style: {
@@ -1933,19 +1949,19 @@ const zn = /* @__PURE__ */ R({
               (() => {
                 const le = [];
                 return m.children.forEach((ue) => {
-                  if (!Re(Ve.children)) {
+                  if (!Re(Se.children)) {
                     console.assert(!1);
                     return;
                   }
-                  Ve.children[ue.key] || (Ve.children[ue.key] = {
+                  Se.children[ue.key] || (Se.children[ue.key] = {
                     collapse: !0,
                     children: ue.array ? [] : {}
                   });
-                  const yt = _e(
+                  const yt = xe(
                     p,
                     ue,
                     H[N],
-                    Ve.children[ue.key],
+                    Se.children[ue.key],
                     N,
                     !0
                   );
@@ -1953,12 +1969,12 @@ const zn = /* @__PURE__ */ R({
                 }), le;
               })()
             );
-            g.children[N].collapse || w.push(gt);
+            g.children[N].collapse || M.push(gt);
           }
-          return w;
+          return M;
         })()
       );
-      return x(
+      return k(
         "div",
         {
           style: {
@@ -1966,33 +1982,33 @@ const zn = /* @__PURE__ */ R({
           }
         },
         (() => {
-          const w = [];
-          return w.push(pe), g.collapse || w.push(Y), w;
+          const M = [];
+          return M.push(ge), g.collapse || M.push(Y), M;
         })()
       );
-    }, dt = (p, m, y, g, $, A) => {
+    }, dt = (p, m, y, g, w, A) => {
       if (m.ui)
-        return console.assert(!1), x("div", "renderBranchScalar property ui must be invalid");
+        return console.assert(!1), k("div", "renderBranchScalar property ui must be invalid");
       if (m.array)
-        return console.assert(!1), x("div", "renderBranchScalar property array must be invalid");
+        return console.assert(!1), k("div", "renderBranchScalar property array must be invalid");
       if (!g)
-        return console.assert(!1), x("div", "renderBranchScalar branch must be valid");
+        return console.assert(!1), k("div", "renderBranchScalar branch must be valid");
       let H = n(m.name);
       g.collapse && me(d.value, p) && (H += " *");
-      const ie = x(Ce, {
+      const ie = k($e, {
         title: H,
         collapse: g.collapse,
-        hasDelete: $ !== void 0 && !A,
+        hasDelete: w !== void 0 && !A,
         onCollapse: (Y) => {
           g.collapse = Y;
         },
-        onMenu: (Y, w) => {
-          de.emit("propTreeMenu", { x: Y, y: w, keys: p });
+        onMenu: (Y, M) => {
+          de.emit("propTreeMenu", { x: Y, y: M, keys: p });
         },
         onDelete: () => {
-          $ === void 0 || A || (y.splice($, 1), c(p.slice(0, -1), y));
+          w === void 0 || A || (y.splice(w, 1), c(p.slice(0, -1), y));
         }
-      }), pe = x(
+      }), ge = k(
         "div",
         {
           style: {
@@ -2001,26 +2017,26 @@ const zn = /* @__PURE__ */ R({
         },
         (() => {
           const Y = [];
-          return m.children.forEach((w) => {
+          return m.children.forEach((M) => {
             if (!Re(g.children)) {
               console.assert(!1);
               return;
             }
-            g.children[w.key] || (g.children[w.key] = {
+            g.children[M.key] || (g.children[M.key] = {
               collapse: !0,
-              children: !w.ui && w.array ? [] : {}
+              children: !M.ui && M.array ? [] : {}
             });
-            const N = _e(
+            const N = xe(
               p,
-              w,
+              M,
               (typeof y[m.key] != "object" && (y[m.key] = {}, c(p, y[m.key])), y[m.key]),
-              g.children[w.key]
+              g.children[M.key]
             );
             Y.push(N);
           }), Y;
         })()
       );
-      return x(
+      return k(
         "div",
         {
           style: {
@@ -2029,34 +2045,34 @@ const zn = /* @__PURE__ */ R({
         },
         (() => {
           const Y = [];
-          return Y.push(ie), g.collapse || Y.push(pe), Y;
+          return Y.push(ie), g.collapse || Y.push(ge), Y;
         })()
       );
-    }, mt = (p, m, y, g, $, A) => {
+    }, mt = (p, m, y, g, w, A) => {
       if (!m.ui)
-        return console.assert(!1), x("div", "renderLeafArray property ui must be valid");
+        return console.assert(!1), k("div", "renderLeafArray property ui must be valid");
       if (!m.array)
-        return console.assert(!1), x("div", "renderLeafArray property array must be valid");
+        return console.assert(!1), k("div", "renderLeafArray property array must be valid");
       if (!g)
-        return console.assert(!1), x("div", "renderLeafArray branch must be valid");
+        return console.assert(!1), k("div", "renderLeafArray branch must be valid");
       let H;
-      $ !== void 0 && !A ? (y[$] instanceof Array || (y[$] = J(m), c(p, y[$])), H = y[$]) : (y[m.key] instanceof Array || (y[m.key] = J(m), c(p, y[m.key])), H = y[m.key]);
+      w !== void 0 && !A ? (y[w] instanceof Array || (y[w] = J(m), c(p, y[w])), H = y[w]) : (y[m.key] instanceof Array || (y[m.key] = J(m), c(p, y[m.key])), H = y[m.key]);
       let ie = n(m.name);
       g.collapse && me(d.value, p) && (ie += " *");
-      const pe = x(Ce, {
+      const ge = k($e, {
         title: ie,
         collapse: g.collapse,
         hasCreate: !0,
-        onCollapse: (w) => {
-          g.collapse = w;
+        onCollapse: (M) => {
+          g.collapse = M;
         },
-        onMenu: (w, N) => {
-          de.emit("propTreeMenu", { x: w, y: N, keys: p });
+        onMenu: (M, N) => {
+          de.emit("propTreeMenu", { x: M, y: N, keys: p });
         },
         onCreate: () => {
           H.push(J(m, !0)), c(p, H);
         }
-      }), Y = x(
+      }), Y = k(
         "div",
         {
           style: {
@@ -2064,15 +2080,15 @@ const zn = /* @__PURE__ */ R({
           }
         },
         (() => {
-          const w = [];
+          const M = [];
           for (let N = 0; N < H.length; N++) {
-            const xe = _e(p, m, H, void 0, N, !1);
-            w.push(xe);
+            const Ve = xe(p, m, H, void 0, N, !1);
+            M.push(Ve);
           }
-          return w;
+          return M;
         })()
       );
-      return x(
+      return k(
         "div",
         {
           style: {
@@ -2080,16 +2096,16 @@ const zn = /* @__PURE__ */ R({
           }
         },
         (() => {
-          const w = [];
-          return w.push(pe), g.collapse || w.push(Y), w;
+          const M = [];
+          return M.push(ge), g.collapse || M.push(Y), M;
         })()
       );
-    }, ft = (p, m, y, g, $) => {
+    }, ft = (p, m, y, g, w) => {
       if (!m.ui)
-        return console.assert(!1), x("div", "renderLeafScalar property ui must be valid");
+        return console.assert(!1), k("div", "renderLeafScalar property ui must be valid");
       let A;
-      return m.ui === "dummy" ? A = k(p, m, y, g, $) : m.ui === "strInput" ? A = S(p, m, y, g, $) : m.ui === "numInput" ? A = P(p, m, y, g, $) : m.ui === "switch" ? A = E(p, m, y, g, $) : m.ui === "select" ? A = I(p, m, y, g, $) : m.ui === "colorPicker" ? A = De(p, m, y, g, $) : m.ui === "jsonEditor" ? A = it(p, m, y, g, $) : m.ui === "multiTypes" ? A = ut(p, m, y, g, $) : m.ui === "compSelect" ? A = rt(p, m, y, g, $) : m.ui === "slotSelect" ? A = at(p, m, y, g, $) : console.assert(!1, "renderLeafScalar not implemented"), A ? b(p, m, A) : x("div");
-    }, vt = () => x(
+      return m.ui === "dummy" ? A = x(p, m, y, g, w) : m.ui === "strInput" ? A = S(p, m, y, g, w) : m.ui === "numInput" ? A = U(p, m, y, g, w) : m.ui === "switch" ? A = O(p, m, y, g, w) : m.ui === "select" ? A = Q(p, m, y, g, w) : m.ui === "colorPicker" ? A = pe(p, m, y, g, w) : m.ui === "jsonEditor" ? A = it(p, m, y, g, w) : m.ui === "multiTypes" ? A = ut(p, m, y, g, w) : m.ui === "compSelect" ? A = rt(p, m, y, g, w) : m.ui === "slotSelect" ? A = at(p, m, y, g, w) : console.assert(!1, "renderLeafScalar not implemented"), A ? D(p, m, A) : k("div");
+    }, vt = () => k(
       "div",
       {
         class: "text-body-2",
@@ -2107,7 +2123,7 @@ const zn = /* @__PURE__ */ R({
               collapse: !0,
               children: !y.ui && y.array ? [] : {}
             });
-            const g = _e(
+            const g = xe(
               [],
               y,
               l.object,
@@ -2119,9 +2135,9 @@ const zn = /* @__PURE__ */ R({
         return p;
       })()
     );
-    return (p, m) => (V(), q(fe, null, [
-      M(vt),
-      M(Gt, {
+    return (p, m) => (_(), K(fe, null, [
+      b(vt),
+      b(Gt, {
         config: l.config,
         object: l.object,
         "property-states": d.value