x-prop-tree 0.7.21 → 0.7.23

package/dist/index.js

@@ -1,11 +1,11 @@
-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 $e, onUnmounted as we, mergeProps as Me, withKeys as Le, useTemplateRef as He, watch as oe, watchEffect as Ke, h as k, renderSlot as kt, onMounted as Xe, onBeforeUnmount as Fe, reactive as _t } from "vue";
+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 ke, toDisplayString as F, resolveDirective as ee, withDirectives as j, withModifiers as X, normalizeStyle as W, createElementVNode as q, createCommentVNode as G, onMounted as He, onBeforeUnmount as Xe, watch as oe, mergeModels as Z, useModel as z, useId as $e, onUnmounted as we, mergeProps as Me, withKeys as Le, useTemplateRef as Fe, watchEffect as Ke, h as k, renderSlot as kt, reactive as _t } from "vue";
 import { useI18n as I } from "vue-i18n";
-import { useViewStack as ke, useColor as te, eventBus as de, useSystem as ve, injectDark as xt, injectLocale as St, openNumberDlg as ze, openPromptDlg as Vt, globalObjects as Ct } from "x-essential-lib";
-import { getPropertyDefault as J, pkgs as Ne, parsePixelStr as Ut, parsePercentStr as $t, getPropertyTag as wt, elements as Mt, makeSlotId as Re } from "x-runtime-lib";
-import { c as Ge, i as be, r as _e, v as Ye, d as We } from "./vendor.f0ug048x.js";
-import { useDisplay as Qe } from "vuetify";
+import { useViewStack as _e, useColor as te, globalObjects as xt, eventBus as de, useSystem as pe, injectDark as St, injectLocale as Vt, openNumberDlg as ze, openPromptDlg as Ct } from "x-essential-lib";
+import { getPropertyDefault as J, pkgs as Ne, getPropertyTag as Ut, elements as $t, makeSlotId as Re, parsePixelStr as wt, parsePercentStr as Mt } from "x-runtime-lib";
+import { c as Ge, i as be, d as Ye, r as ve, v as We } from "./vendor.f0ug048x.js";
+import { globalState as Qe } from "x-state-lib";
+import { useDisplay as Ze } from "vuetify";
 import { XBlockly as bt } from "x-block-lib";
-import { globalState as Ze } from "x-state-lib";
 const Ee = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, Pt = (t, s) => {
   const n = (e, l) => {
     if (e.ui !== l.ui || e.array !== l.array)
@@ -42,7 +42,7 @@ const Ee = (t) => !(t instanceof Array), Ae = (t) => t instanceof Array, Pt = (t
       n = n.children.find((l) => l.key === e);
     }
   }), n;
-}, ye = (t, s) => {
+}, he = (t, s) => {
   let n = t;
   return s.forEach((e) => {
     if (!n) {
@@ -275,64 +275,63 @@ function it() {
 const Yt = /* @__PURE__ */ E({
   __name: "index",
   setup(t) {
-    const { t: s } = I(), n = Kt(), e = Et(), l = Ht(), o = Ft(), i = T(0), u = T(0), r = T([]), a = L(() => [i.value, u.value]), d = (V) => {
+    const { t: s } = I(), n = Kt(), e = Et(), l = Ht(), o = Ft(), i = T(0), u = T(0), r = T([]), a = L(() => [i.value, u.value]), d = (S) => {
       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 U = ye(e.value, r.value.slice(0, -1));
+        const V = Ce(n.value, r.value);
+        if (V)
+          if (V.ui) {
+            const U = he(e.value, r.value.slice(0, -1));
             if (!U)
               return;
-            U[r.value[r.value.length - 1]] = J(S), o(r.value, U[r.value[r.value.length - 1]]);
-          } else if (S.array) {
+            U[r.value[r.value.length - 1]] = J(V), o(r.value, U[r.value[r.value.length - 1]]);
+          } else if (V.array) {
             const U = r.value[r.value.length - 1];
             if (U === void 0) {
               console.assert(!1, "invalid last key");
               return;
             }
             if (typeof U == "string") {
-              const O = ye(e.value, r.value.slice(0, -1));
+              const O = he(e.value, r.value.slice(0, -1));
               if (!O)
                 return;
-              O[r.value[r.value.length - 1]] = J(S), o(r.value, O[r.value[r.value.length - 1]]);
+              O[r.value[r.value.length - 1]] = J(V), o(r.value, O[r.value[r.value.length - 1]]);
             } else {
-              const O = ye(e.value, r.value);
+              const O = he(e.value, r.value);
               if (!O)
                 return;
-              S.children.forEach((Q) => {
-                O[Q.key] = J(S), o([...r.value, Q.key], O[Q.key]);
+              V.children.forEach((Q) => {
+                O[Q.key] = J(V), o([...r.value, Q.key], O[Q.key]);
               });
             }
           } else {
-            const U = ye(e.value, r.value);
+            const U = he(e.value, r.value);
             if (!U)
               return;
-            S.children.forEach((O) => {
-              U[O.key] = J(S), o([...r.value, O.key], U[O.key]);
+            V.children.forEach((O) => {
+              U[O.key] = J(V), o([...r.value, O.key], U[O.key]);
             });
           }
       };
-      D() && V.push({
+      D() && S.push({
         title: s("x-prop-tree.reset"),
         func: x
       });
-    }, c = (V) => {
+    }, c = (S) => {
       const D = () => {
-        const x = Ce(n.value, r.value), S = ye(e.value, r.value);
-        localStorage.setItem("propTreeCopy", JSON.stringify({ property: x, object: S }));
+        const x = Ce(n.value, r.value), V = he(e.value, r.value);
+        localStorage.setItem("propTreeCopy", JSON.stringify({ property: x, object: V }));
       };
-      V.push({
+      S.push({
         title: s("x-prop-tree.copy"),
         func: D
       });
-    }, f = (V) => {
+    }, f = (S) => {
       const D = () => {
-        const S = localStorage.getItem("propTreeCopy");
-        if (!S)
+        const V = localStorage.getItem("propTreeCopy");
+        if (!V)
           return !1;
-        console.log(S);
         try {
-          const { property: U } = JSON.parse(S);
+          const { property: U } = JSON.parse(V);
           if (!U)
             return !1;
           const O = Ce(n.value, r.value);
@@ -344,27 +343,27 @@ const Yt = /* @__PURE__ */ E({
       }, x = () => {
         if (!D())
           return;
-        const S = localStorage.getItem("propTreeCopy");
-        if (S)
+        const V = localStorage.getItem("propTreeCopy");
+        if (V)
           try {
-            const { object: U } = JSON.parse(S), O = Ce(n.value, r.value);
+            const { object: U } = JSON.parse(V), O = Ce(n.value, r.value);
             console.log(U, O);
           } catch (U) {
             console.error(U);
           }
       };
-      D() && V.push({
+      D() && S.push({
         title: s("x-prop-tree.paste"),
         func: x
       });
     }, v = L(() => {
-      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");
+      const S = [];
+      return d(S), c(S), f(S), S;
+    }), C = (S) => {
+      i.value = S.x, u.value = S.y, r.value = S.keys;
+    }, { open: h } = _e("propTreeMenu", C);
+    return (S, D) => {
+      const x = $("v-list-item-title"), V = $("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),
@@ -375,15 +374,15 @@ const Yt = /* @__PURE__ */ E({
         default: R(() => [
           b(U, null, {
             default: R(() => [
-              (_(!0), K(fe, null, Te(v.value, (Q, pe) => (_(), B(S, {
-                key: pe,
+              (_(!0), K(fe, null, Te(v.value, (Q, ge) => (_(), B(V, {
+                key: ge,
                 link: "",
                 onClick: Q.func
               }, {
                 default: R(() => [
                   b(x, null, {
                     default: R(() => [
-                      he(F(Q.title), 1)
+                      ke(F(Q.title), 1)
                     ]),
                     _: 2
                   }, 1024)
@@ -456,7 +455,123 @@ const Yt = /* @__PURE__ */ E({
       ]);
     };
   }
-}), Qt = { class: "d-flex justify-space-between align-center" }, Zt = /* @__PURE__ */ E({
+});
+function Qt() {
+  const t = T([]);
+  zt(t);
+  const s = () => {
+    const { activeApp: o, depends: i } = Qe.app, u = [];
+    for (const { id: r, name: a, position: d } of o.compGroups) {
+      const c = t.value.find((f) => f.id === r);
+      u.push({
+        id: r,
+        type: 0,
+        name: a,
+        position: d,
+        collapse: c?.collapse ?? !0
+      });
+    }
+    for (const { id: r, groupId: a, name: d, position: c } of o.comps)
+      i[r] && u.push({ id: r, type: 1, name: d, position: c, group: a });
+    Ye(u, !0), t.value = u;
+  };
+  let n;
+  const e = () => {
+    clearTimeout(n), n = window.setTimeout(() => {
+      s(), n && e();
+    }, 1e3);
+  }, l = () => {
+    clearTimeout(n), n = void 0;
+  };
+  He(() => {
+    e();
+  }), Xe(() => {
+    l();
+  });
+}
+function Zt(t, s, n) {
+  const { i18n: e } = xt, l = T([]);
+  Gt(l);
+  const o = () => {
+    if (!t.value || !s.value || !n.value)
+      return;
+    const a = Ne[t.value];
+    if (!a) {
+      console.assert(!1, `invalid version=${t.value}`);
+      return;
+    }
+    const d = Ut(s.value, n.value), c = [];
+    for (let h = 0; h < a.groups[d].length; h++) {
+      const S = a.groups[d][h], D = ve(l, S.key);
+      c.push({
+        id: S.key,
+        type: 0,
+        name: e.global.t(S.name),
+        position: h,
+        collapse: D?.collapse ?? !0,
+        count: 0
+      });
+      let x = 0;
+      for (const V of S.items) {
+        const U = $t[V];
+        if (U && !U.internal && U.slots)
+          for (const O of U.slots) {
+            const Q = Re("elementSlot", U.key, O.key), ge = `${e.global.t(U.name)} / ${e.global.t(O.name)}`;
+            c.push({
+              id: Q,
+              type: 1,
+              name: ge,
+              position: x++,
+              group: S.key
+            });
+          }
+      }
+    }
+    const { activeApp: f, depends: v } = Qe.app;
+    for (const { id: h, name: S, position: D } of f.compGroups) {
+      const x = ve(l, h);
+      c.push({
+        id: h,
+        type: 0,
+        name: S,
+        position: D,
+        collapse: x?.collapse ?? !0
+      });
+    }
+    let C = 0;
+    for (const h of f.comps) {
+      const S = v[h.id];
+      if (S && S.meta.slots)
+        for (const D of S.meta.slots) {
+          const x = Re("customSlot", h.id, D.id), V = `${h.name} / ${D.name}`;
+          c.push({
+            id: x,
+            type: 1,
+            name: V,
+            position: C++,
+            group: h.groupId
+          });
+        }
+    }
+    Ye(c, !0), l.value = c;
+  };
+  let i;
+  const u = () => {
+    clearTimeout(i), i = window.setTimeout(() => {
+      o(), i && u();
+    }, 1e3);
+  }, r = () => {
+    clearTimeout(i), i = void 0;
+  };
+  He(() => {
+    u();
+  }), Xe(() => {
+    r();
+  }), oe([t, s, n], () => {
+    o(), u();
+  });
+}
+const jt = { class: "d-flex justify-space-between align-center" }, It = /* @__PURE__ */ E({
   __name: "index",
   props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
@@ -472,7 +587,7 @@ const Yt = /* @__PURE__ */ E({
       return t.hasDelete && (r = "calc(100% - 37px)"), {
         width: r
       };
-    }), i = L(() => t.readonly), { open: u } = ke(`propTreeColorPickerMenu${$e()}`);
+    }), i = L(() => t.readonly), { open: u } = _e(`propTreeColorPickerMenu${$e()}`);
     return we(() => {
       u.value = !1;
     }), (r, a) => {
@@ -484,7 +599,7 @@ const Yt = /* @__PURE__ */ E({
         scrim: "transparent"
       }, {
         activator: R(({ props: v }) => [
-          q("div", Qt, [
+          q("div", jt, [
             q("div", {
               class: "flex-grow-1",
               style: W(o.value)
@@ -496,7 +611,7 @@ const Yt = /* @__PURE__ */ E({
                 disabled: i.value
               }), {
                 default: R(() => [
-                  he(F(e.value ? e.value : P(n)("x-runtime-lib.notSet")), 1)
+                  ke(F(e.value ? e.value : P(n)("x-runtime-lib.notSet")), 1)
                 ]),
                 _: 1
               }, 16, ["color", "disabled"])
@@ -524,7 +639,7 @@ const Yt = /* @__PURE__ */ E({
       }, 8, ["modelValue"]);
     };
   }
-}), jt = { class: "text-subtitle-2 ml-1" }, It = { class: "text-caption text-grey ml-1" }, en = /* @__PURE__ */ E({
+}), en = { class: "text-subtitle-2 ml-1" }, tn = { class: "text-caption text-grey ml-1" }, nn = /* @__PURE__ */ E({
   __name: "group",
   props: {
     id: {},
@@ -553,14 +668,14 @@ const Yt = /* @__PURE__ */ E({
           icon: l.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
           size: "small"
         }, null, 8, ["icon"]),
-        q("span", jt, F(l.title), 1),
-        q("span", It, F(l.count), 1)
+        q("span", en, F(l.title), 1),
+        q("span", tn, F(l.count), 1)
       ], 36)), [
         [c]
       ]);
     };
   }
-}), tn = { class: "text-subtitle-1 ml-6" }, nn = /* @__PURE__ */ E({
+}), ln = { class: "text-subtitle-1 ml-6" }, on = /* @__PURE__ */ E({
   __name: "item",
   props: {
     id: {},
@@ -583,16 +698,16 @@ const Yt = /* @__PURE__ */ E({
         onMouseout: a[1] || (a[1] = (c) => i.value = !1),
         onMouseover: a[2] || (a[2] = (c) => i.value = !0)
       }, [
-        q("span", tn, F(l.title), 1)
+        q("span", ln, F(l.title), 1)
       ], 36)), [
         [d]
       ]);
     };
   }
-}), ln = { key: 0 }, on = {
+}), sn = { key: 0 }, un = {
   key: 1,
   class: "text-body-2 text-grey ml-3"
-}, sn = /* @__PURE__ */ E({
+}, rn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -603,16 +718,16 @@ const Yt = /* @__PURE__ */ E({
   emits: ["update:modelValue", "update:open"],
   setup(t) {
     const { t: s } = I(), n = z(t, "modelValue"), e = z(t, "open"), l = st(), o = (u) => {
-      const r = _e(l, u);
-      r && Ye(l, u, !r.collapse);
+      const r = ve(l, u);
+      r && We(l, u, !r.collapse);
     }, i = (u) => {
       n.value = u, e.value = !1, de.emit("refreshDepends");
     };
-    return (u, r) => P(l).length > 0 ? (_(), K("div", ln, [
+    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 ? (_(), B(en, {
+        a.type === 0 ? (_(), B(nn, {
           key: 0,
           id: a.id,
           collapse: a.collapse,
@@ -620,16 +735,16 @@ const Yt = /* @__PURE__ */ E({
           title: a.name,
           onXClick: o
         }, null, 8, ["id", "collapse", "count", "title"])) : G("", !0),
-        a.type === 1 && a.show ? (_(), B(nn, {
+        a.type === 1 && a.show ? (_(), B(on, {
           key: 1,
           id: a.id,
           title: a.name,
           onXClick: i
         }, null, 8, ["id", "title"])) : G("", !0)
       ], 64))), 128))
-    ])) : (_(), K("div", on, F(P(s)("x-prop-tree.noComp")), 1));
+    ])) : (_(), K("div", un, F(P(s)("x-prop-tree.noComp")), 1));
   }
-}), un = { class: "text-subtitle-1 ml-3" }, rn = /* @__PURE__ */ E({
+}), an = { class: "text-subtitle-1 ml-3" }, cn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -637,7 +752,7 @@ const Yt = /* @__PURE__ */ E({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const { t: s } = I(), n = Qe(), { sysBarAvail: e } = ve(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = st(), u = L(() => {
+    const { t: s } = I(), n = Ze(), { sysBarAvail: e } = pe(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = st(), u = L(() => {
       let f = "100%";
       return n.mdAndUp.value && (f = "400px"), {
         background: l.value,
@@ -655,13 +770,13 @@ const Yt = /* @__PURE__ */ E({
     })), d = L(() => {
       if (!o.value)
         return s("x-runtime-lib.notSet");
-      const f = _e(i, o.value);
+      const f = ve(i, o.value);
       return f ? f.name : s("x-runtime-lib.compNotAvail");
-    }), { open: c } = ke(`propTreeCompSelectDlg${$e()}`);
+    }), { open: c } = _e(`propTreeCompSelectDlg${$e()}`);
     return we(() => {
       c.value = !1;
     }), (f, v) => {
-      const C = $("v-btn"), h = $("v-sheet"), V = $("v-icon"), D = $("v-dialog");
+      const C = $("v-btn"), h = $("v-sheet"), S = $("v-icon"), D = $("v-dialog");
       return _(), B(D, {
         modelValue: P(c),
         "onUpdate:modelValue": v[5] || (v[5] = (x) => re(c) ? c.value = x : null),
@@ -677,7 +792,7 @@ const Yt = /* @__PURE__ */ E({
             density: "comfortable"
           }), {
             default: R(() => [
-              he(F(d.value), 1)
+              ke(F(d.value), 1)
             ]),
             _: 1
           }, 16)
@@ -703,11 +818,11 @@ const Yt = /* @__PURE__ */ E({
                 height: 48
               }, {
                 default: R(() => [
-                  b(V, {
+                  b(S, {
                     icon: "mdi-close",
                     onClick: v[0] || (v[0] = (x) => c.value = !1)
                   }),
-                  q("span", un, F(P(s)("x-prop-tree.dlg.compSelect.title")), 1)
+                  q("span", an, F(P(s)("x-prop-tree.dlg.compSelect.title")), 1)
                 ]),
                 _: 1
               }),
@@ -715,7 +830,7 @@ const Yt = /* @__PURE__ */ E({
                 class: "overflow-y-auto",
                 style: W(r.value)
               }, [
-                b(sn, {
+                b(rn, {
                   modelValue: o.value,
                   "onUpdate:modelValue": v[1] || (v[1] = (x) => o.value = x),
                   open: P(c),
@@ -732,7 +847,7 @@ const Yt = /* @__PURE__ */ E({
       }, 8, ["modelValue"]);
     };
   }
-}), an = /* @__PURE__ */ E({
+}), dn = /* @__PURE__ */ E({
   __name: "editor",
   props: {
     modelValue: { required: !0 },
@@ -744,7 +859,7 @@ const Yt = /* @__PURE__ */ E({
   },
   emits: ["update:modelValue", "update:lock", "update:scale"],
   setup(t, { expose: s }) {
-    const n = z(t, "modelValue"), e = z(t, "lock"), l = z(t, "scale"), o = xt(), i = St(), u = Oe(), r = He("target"), a = () => {
+    const n = z(t, "modelValue"), e = z(t, "lock"), l = z(t, "scale"), o = St(), i = Vt(), u = Oe(), r = Fe("target"), a = () => {
       const c = JSON.parse(n.value);
       r.value?.load(c);
     };
@@ -765,7 +880,7 @@ const Yt = /* @__PURE__ */ E({
       onReady: a
     }, null, 8, ["lock", "scale", "dark", "locale", "version"]));
   }
-}), cn = { class: "text-subtitle-1" }, dn = /* @__PURE__ */ E({
+}), mn = { class: "text-subtitle-1" }, fn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: { required: !0 },
@@ -773,56 +888,56 @@ const Yt = /* @__PURE__ */ E({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    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(() => {
+    const { t: s } = I(), { sysBarAvail: n } = pe(), { 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 } = ke(`propTreejsonEditorDlg${$e()}`);
+    }), d = L(() => s("x-prop-tree.dlg.jsonEditor.title")), { open: c } = _e(`propTreejsonEditorDlg${$e()}`);
     we(() => {
       c.value = !1;
     });
-    const f = He("editor");
+    const f = Fe("editor");
     return oe(c, (v) => {
       v || f.value?.save();
     }), (v, C) => {
-      const h = $("v-btn"), V = $("v-sheet"), D = $("v-spacer"), x = $("v-dialog");
+      const h = $("v-btn"), S = $("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),
+        "onUpdate:modelValue": C[4] || (C[4] = (V) => re(c) ? c.value = V : null),
         attach: "",
         fullscreen: "",
         "no-click-animation": "",
         persistent: "",
         transition: "dialog-bottom-transition",
-        onKeydown: C[5] || (C[5] = Le(X((S) => c.value = !1, ["stop", "prevent"]), ["esc"]))
+        onKeydown: C[5] || (C[5] = Le(X((V) => c.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
-        activator: R(({ props: S }) => [
-          b(h, Me(S, {
+        activator: R(({ props: V }) => [
+          b(h, Me(V, {
             block: "",
             density: "comfortable"
           }), {
             default: R(() => [
-              he(F(d.value), 1)
+              ke(F(d.value), 1)
             ]),
             _: 1
           }, 16)
         ]),
         default: R(() => [
-          b(V, {
+          b(S, {
             color: P(e),
             height: "100%",
             width: "100%"
           }, {
             default: R(() => [
-              P(n) ? (_(), B(V, {
+              P(n) ? (_(), B(S, {
                 key: 0,
                 color: P(o),
                 height: 24
               }, null, 8, ["color"])) : G("", !0),
-              b(V, {
+              b(S, {
                 class: "d-flex align-center px-2",
                 color: P(o),
                 height: 48
@@ -832,9 +947,9 @@ const Yt = /* @__PURE__ */ E({
                     density: "comfortable",
                     icon: "mdi-close",
                     variant: "text",
-                    onClick: C[0] || (C[0] = (S) => c.value = !1)
+                    onClick: C[0] || (C[0] = (V) => c.value = !1)
                   }),
-                  q("span", cn, F(P(s)("x-prop-tree.dlg.jsonEditor.title")), 1),
+                  q("span", mn, F(P(s)("x-prop-tree.dlg.jsonEditor.title")), 1),
                   b(D)
                 ]),
                 _: 1
@@ -842,15 +957,15 @@ const Yt = /* @__PURE__ */ E({
               q("div", {
                 style: W(a.value)
               }, [
-                b(an, {
+                b(dn, {
                   ref_key: "editor",
                   ref: f,
                   modelValue: i.value,
-                  "onUpdate:modelValue": C[1] || (C[1] = (S) => i.value = S),
+                  "onUpdate:modelValue": C[1] || (C[1] = (V) => i.value = V),
                   lock: u.value,
-                  "onUpdate:lock": C[2] || (C[2] = (S) => u.value = S),
+                  "onUpdate:lock": C[2] || (C[2] = (V) => u.value = V),
                   scale: r.value,
-                  "onUpdate:scale": C[3] || (C[3] = (S) => r.value = S)
+                  "onUpdate:scale": C[3] || (C[3] = (V) => r.value = V)
                 }, null, 8, ["modelValue", "lock", "scale"])
               ], 4)
             ]),
@@ -861,7 +976,7 @@ const Yt = /* @__PURE__ */ E({
       }, 8, ["modelValue"]);
     };
   }
-}), mn = { class: "d-flex justify-space-between align-center my-2" }, fn = { class: "flex-grow-1" }, vn = /* @__PURE__ */ E({
+}), vn = { class: "d-flex justify-space-between align-center my-2" }, pn = { class: "flex-grow-1" }, gn = /* @__PURE__ */ E({
   __name: "index",
   props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
@@ -872,12 +987,12 @@ const Yt = /* @__PURE__ */ E({
   }),
   emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
-    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 { t: n } = I(), { isMobile: e } = pe(), 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) => {
+      return u.value?.forEach(({ title: h }, S) => {
         C.push({
           title: n(h),
-          value: V
+          value: S
         });
       }), C;
     });
@@ -900,14 +1015,14 @@ const Yt = /* @__PURE__ */ E({
       h !== void 0 && (f.value = h);
     };
     return Ke(() => {
-      d.value?.ui === "pixelInput" ? f.value = Ut(l.value) : d.value?.ui === "percentInput" && (f.value = $t(l.value));
+      d.value?.ui === "pixelInput" ? f.value = wt(l.value) : d.value?.ui === "percentInput" && (f.value = Mt(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", mn, [
-        q("div", fn, [
-          j(b(V, {
+      const S = $("v-select"), D = $("v-number-input"), x = $("v-btn"), V = ee("ripple");
+      return _(), K("div", vn, [
+        q("div", pn, [
+          j(b(S, {
             modelValue: r.value,
             "onUpdate:modelValue": [
               h[0] || (h[0] = (U) => r.value = U),
@@ -919,7 +1034,7 @@ const Yt = /* @__PURE__ */ E({
             "single-line": ""
           }, null, 8, ["modelValue", "items"]), [
             [
-              S,
+              V,
               void 0,
               void 0,
               { stop: !0 }
@@ -940,7 +1055,7 @@ const Yt = /* @__PURE__ */ E({
             "onUpdate:focused": v
           }, null, 8, ["modelValue", "max", "min", "precision", "step"])), [
             [
-              S,
+              V,
               void 0,
               void 0,
               { stop: !0 }
@@ -958,7 +1073,7 @@ const Yt = /* @__PURE__ */ E({
       ]);
     };
   }
-}), pn = { class: "d-flex justify-space-between align-center" }, gn = /* @__PURE__ */ E({
+}), yn = { class: "d-flex justify-space-between align-center" }, hn = /* @__PURE__ */ E({
   __name: "index",
   props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
@@ -974,7 +1089,7 @@ const Yt = /* @__PURE__ */ E({
   }),
   emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
-    const { isMobile: n } = ve(), e = z(t, "modelValue"), l = s, o = async (i) => {
+    const { isMobile: n } = pe(), e = z(t, "modelValue"), l = s, o = async (i) => {
       if (!i || t.readonly || !n())
         return;
       const u = await ze({
@@ -989,7 +1104,7 @@ const Yt = /* @__PURE__ */ E({
     };
     return (i, u) => {
       const r = $("v-number-input"), a = $("v-btn"), d = ee("ripple");
-      return _(), K("div", pn, [
+      return _(), K("div", yn, [
         j(b(r, {
           modelValue: e.value,
           "onUpdate:modelValue": u[0] || (u[0] = (c) => e.value = c),
@@ -1022,7 +1137,7 @@ const Yt = /* @__PURE__ */ E({
       ]);
     };
   }
-}), yn = { class: "d-flex justify-space-between align-center" }, hn = /* @__PURE__ */ E({
+}), kn = { class: "d-flex justify-space-between align-center" }, _n = /* @__PURE__ */ E({
   __name: "index",
   props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
@@ -1036,13 +1151,13 @@ const Yt = /* @__PURE__ */ E({
   setup(t, { emit: s }) {
     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 });
+      return Ne[o.value].items[t.items].forEach(({ title: a, value: d }) => {
+        u.push({ title: n(a), value: d });
       }), u;
     });
     return (u, r) => {
       const a = $("v-select"), d = $("v-btn"), c = ee("ripple");
-      return _(), K("div", yn, [
+      return _(), K("div", kn, [
         j(b(a, {
           modelValue: e.value,
           "onUpdate:modelValue": r[0] || (r[0] = (f) => e.value = f),
@@ -1070,7 +1185,7 @@ const Yt = /* @__PURE__ */ E({
       ]);
     };
   }
-}), kn = { class: "text-subtitle-2 ml-1" }, _n = { class: "text-caption text-grey ml-1" }, xn = /* @__PURE__ */ E({
+}), xn = { class: "text-subtitle-2 ml-1" }, Sn = { class: "text-caption text-grey ml-1" }, Vn = /* @__PURE__ */ E({
   __name: "group",
   props: {
     id: {},
@@ -1099,14 +1214,14 @@ const Yt = /* @__PURE__ */ E({
           icon: l.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
           size: "small"
         }, null, 8, ["icon"]),
-        q("span", kn, F(l.title), 1),
-        q("span", _n, F(l.count), 1)
+        q("span", xn, F(l.title), 1),
+        q("span", Sn, F(l.count), 1)
       ], 36)), [
         [c]
       ]);
     };
   }
-}), Sn = { class: "text-subtitle-1 ml-6" }, Vn = /* @__PURE__ */ E({
+}), Cn = { class: "text-subtitle-1 ml-6" }, Un = /* @__PURE__ */ E({
   __name: "item",
   props: {
     id: {},
@@ -1129,16 +1244,16 @@ const Yt = /* @__PURE__ */ E({
         onMouseout: a[1] || (a[1] = (c) => i.value = !1),
         onMouseover: a[2] || (a[2] = (c) => i.value = !0)
       }, [
-        q("span", Sn, F(l.title), 1)
+        q("span", Cn, F(l.title), 1)
       ], 36)), [
         [d]
       ]);
     };
   }
-}), Cn = { key: 0 }, Un = {
+}), $n = { key: 0 }, wn = {
   key: 1,
   class: "text-body-2 text-grey ml-3"
-}, $n = /* @__PURE__ */ E({
+}, Mn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -1149,16 +1264,16 @@ const Yt = /* @__PURE__ */ E({
   emits: ["update:modelValue", "update:open"],
   setup(t) {
     const { t: s } = I(), n = z(t, "modelValue"), e = z(t, "open"), l = it(), o = (u) => {
-      const r = _e(l, u);
-      r && Ye(l, u, !r.collapse);
+      const r = ve(l, u);
+      r && We(l, u, !r.collapse);
     }, i = (u) => {
       n.value = u, e.value = !1;
     };
-    return (u, r) => P(l).length > 0 ? (_(), K("div", Cn, [
+    return (u, r) => P(l).length > 0 ? (_(), K("div", $n, [
       (_(!0), K(fe, null, Te(P(l), (a) => (_(), K(fe, {
         key: a.id
       }, [
-        a.type === 0 ? (_(), B(xn, {
+        a.type === 0 ? (_(), B(Vn, {
           key: 0,
           id: a.id,
           collapse: a.collapse,
@@ -1166,16 +1281,16 @@ const Yt = /* @__PURE__ */ E({
           title: a.name,
           onXClick: o
         }, null, 8, ["id", "collapse", "count", "title"])) : G("", !0),
-        a.type === 1 && a.show ? (_(), B(Vn, {
+        a.type === 1 && a.show ? (_(), B(Un, {
           key: 1,
           id: a.id,
           title: a.name,
           onXClick: i
         }, null, 8, ["id", "title"])) : G("", !0)
       ], 64))), 128))
-    ])) : (_(), K("div", Un, F(P(s)("x-prop-tree.noSlot")), 1));
+    ])) : (_(), K("div", wn, F(P(s)("x-prop-tree.noSlot")), 1));
   }
-}), wn = { class: "text-subtitle-1 ml-3" }, Mn = /* @__PURE__ */ E({
+}), bn = { class: "text-subtitle-1 ml-3" }, Pn = /* @__PURE__ */ E({
   __name: "index",
   props: {
     modelValue: {},
@@ -1183,7 +1298,7 @@ const Yt = /* @__PURE__ */ E({
   },
   emits: ["update:modelValue"],
   setup(t) {
-    const { t: s } = I(), n = Qe(), { sysBarAvail: e } = ve(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = it(), u = L(() => {
+    const { t: s } = I(), n = Ze(), { sysBarAvail: e } = pe(), { backgroundColor1: l } = te(), o = z(t, "modelValue"), i = it(), u = L(() => {
       let f = "100%";
       return n.mdAndUp.value && (f = "400px"), {
         background: l.value,
@@ -1201,13 +1316,13 @@ const Yt = /* @__PURE__ */ E({
     })), d = L(() => {
       if (!o.value)
         return s("x-runtime-lib.notSet");
-      const f = _e(i, o.value);
+      const f = ve(i, o.value);
       return f ? f.name : s("x-runtime-lib.slotNotAvail");
-    }), { open: c } = ke(`propTreeSlotSelectDlg${$e()}`);
+    }), { open: c } = _e(`propTreeSlotSelectDlg${$e()}`);
     return we(() => {
       c.value = !1;
     }), (f, v) => {
-      const C = $("v-btn"), h = $("v-sheet"), V = $("v-icon"), D = $("v-dialog");
+      const C = $("v-btn"), h = $("v-sheet"), S = $("v-icon"), D = $("v-dialog");
       return _(), B(D, {
         modelValue: P(c),
         "onUpdate:modelValue": v[5] || (v[5] = (x) => re(c) ? c.value = x : null),
@@ -1223,7 +1338,7 @@ const Yt = /* @__PURE__ */ E({
             density: "comfortable"
           }), {
             default: R(() => [
-              he(F(d.value), 1)
+              ke(F(d.value), 1)
             ]),
             _: 1
           }, 16)
@@ -1249,11 +1364,11 @@ const Yt = /* @__PURE__ */ E({
                 height: 48
               }, {
                 default: R(() => [
-                  b(V, {
+                  b(S, {
                     icon: "mdi-close",
                     onClick: v[0] || (v[0] = (x) => c.value = !1)
                   }),
-                  q("span", wn, F(P(s)("x-prop-tree.dlg.slotSelect.title")), 1)
+                  q("span", bn, F(P(s)("x-prop-tree.dlg.slotSelect.title")), 1)
                 ]),
                 _: 1
               }),
@@ -1261,7 +1376,7 @@ const Yt = /* @__PURE__ */ E({
                 class: "overflow-y-auto",
                 style: W(r.value)
               }, [
-                b($n, {
+                b(Mn, {
                   modelValue: o.value,
                   "onUpdate:modelValue": v[1] || (v[1] = (x) => o.value = x),
                   open: P(c),
@@ -1278,7 +1393,7 @@ const Yt = /* @__PURE__ */ E({
       }, 8, ["modelValue"]);
     };
   }
-}), bn = { class: "d-flex justify-space-between align-center" }, Pn = /* @__PURE__ */ E({
+}), Dn = { class: "d-flex justify-space-between align-center" }, An = /* @__PURE__ */ E({
   __name: "index",
   props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
@@ -1289,10 +1404,10 @@ const Yt = /* @__PURE__ */ E({
   }),
   emits: /* @__PURE__ */ Z(["delete"], ["update:modelValue"]),
   setup(t, { emit: s }) {
-    const { isMobile: n } = ve(), e = z(t, "modelValue"), l = s, o = async (i) => {
+    const { isMobile: n } = pe(), e = z(t, "modelValue"), l = s, o = async (i) => {
       if (!i || t.readonly || !n())
         return;
-      const u = await Vt({
+      const u = await Ct({
         title: "",
         value: e.value
       });
@@ -1300,7 +1415,7 @@ const Yt = /* @__PURE__ */ E({
     };
     return (i, u) => {
       const r = $("v-text-field"), a = $("v-btn"), d = ee("ripple");
-      return _(), K("div", bn, [
+      return _(), K("div", Dn, [
         j(b(r, {
           modelValue: e.value,
           "onUpdate:modelValue": u[0] || (u[0] = (c) => e.value = c),
@@ -1328,7 +1443,7 @@ const Yt = /* @__PURE__ */ E({
       ]);
     };
   }
-}), Dn = { class: "d-flex justify-space-between align-center" }, An = /* @__PURE__ */ E({
+}), Tn = { class: "d-flex justify-space-between align-center" }, Ln = /* @__PURE__ */ E({
   __name: "index",
   props: /* @__PURE__ */ Z({
     hasDelete: { type: Boolean, default: !1 },
@@ -1342,7 +1457,7 @@ const Yt = /* @__PURE__ */ E({
     const n = z(t, "modelValue"), e = s;
     return (l, o) => {
       const i = $("v-switch"), u = $("v-btn");
-      return _(), K("div", Dn, [
+      return _(), K("div", Tn, [
         b(i, {
           modelValue: n.value,
           "onUpdate:modelValue": o[0] || (o[0] = (r) => n.value = r),
@@ -1364,8 +1479,8 @@ const Yt = /* @__PURE__ */ E({
     };
   }
 });
-function Tn(t) {
-  return { renderUiColorPicker: (n, e, l, o, i) => e.ui !== "colorPicker" ? (console.assert(!1), k("div", "renderUiColorPicker property ui must be colorPicker")) : k(Zt, {
+function Nn(t) {
+  return { renderUiColorPicker: (n, e, l, o, i) => e.ui !== "colorPicker" ? (console.assert(!1), k("div", "renderUiColorPicker property ui must be colorPicker")) : k(It, {
     modelValue: ne(
       n,
       e,
@@ -1392,8 +1507,8 @@ function Tn(t) {
     readonly: e.readonly
   }) };
 }
-function Ln(t) {
-  return { renderUiCompSelect: (n, e, l, o, i) => e.ui !== "compSelect" ? (console.assert(!1), k("div", "renderUiCompSelect property ui must be compSelect")) : k(rn, {
+function Bn(t) {
+  return { renderUiCompSelect: (n, e, l, o, i) => e.ui !== "compSelect" ? (console.assert(!1), k("div", "renderUiCompSelect property ui must be compSelect")) : k(cn, {
     modelValue: ne(
       n,
       e,
@@ -1415,7 +1530,7 @@ function Ln(t) {
     }
   }) };
 }
-function Nn(t) {
+function On(t) {
   return { renderUiDummy: (n, e, l, o, i) => {
     if (e.ui !== "dummy") {
       console.assert(!1, "renderUiDummy property ui must be dummy");
@@ -1424,8 +1539,8 @@ function Nn(t) {
     ne(n, e, l, t, o, i);
   } };
 }
-function Bn(t) {
-  return { renderUiJsonEditor: (n, e, l, o, i) => e.ui !== "jsonEditor" ? k("div", "renderUijsonEditor property ui must be jsonEditor") : k(dn, {
+function qn(t) {
+  return { renderUiJsonEditor: (n, e, l, o, i) => e.ui !== "jsonEditor" ? k("div", "renderUijsonEditor property ui must be jsonEditor") : k(fn, {
     modelValue: ne(
       n,
       e,
@@ -1447,8 +1562,8 @@ function Bn(t) {
     }
   }) };
 }
-function On(t) {
-  return { renderUiMultiTypes: (n, e, l, o, i) => e.ui !== "multiTypes" ? (console.assert(!1), k("div", "renderUiMultiTypes property ui must be multiTypes")) : k(vn, {
+function Kn(t) {
+  return { renderUiMultiTypes: (n, e, l, o, i) => e.ui !== "multiTypes" ? (console.assert(!1), k("div", "renderUiMultiTypes property ui must be multiTypes")) : k(gn, {
     modelValue: ne(
       n,
       e,
@@ -1475,8 +1590,8 @@ function On(t) {
     types: e.types
   }) };
 }
-function qn(t) {
-  return { renderUiNumInput: (n, e, l, o, i) => e.ui !== "numInput" ? (console.assert(!1), k("div", "renderUiNumInput property ui must be numInput")) : k(gn, {
+function Rn(t) {
+  return { renderUiNumInput: (n, e, l, o, i) => e.ui !== "numInput" ? (console.assert(!1), k("div", "renderUiNumInput property ui must be numInput")) : k(hn, {
     modelValue: ne(
       n,
       e,
@@ -1507,7 +1622,7 @@ function qn(t) {
     readonly: e.readonly
   }) };
 }
-const Kn = /* @__PURE__ */ E({
+const En = /* @__PURE__ */ E({
   __name: "index",
   props: {
     minHeight: {}
@@ -1539,13 +1654,13 @@ const Kn = /* @__PURE__ */ E({
     };
   }
 });
-function Rn(t, s, n) {
+function Jn(t, s, n) {
   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 += " *"), k(
-      Kn,
+      En,
       {
         minHeight: s.value,
         onMenu: (c, f) => {
@@ -1562,8 +1677,8 @@ function Rn(t, s, n) {
     );
   } };
 }
-function En(t) {
-  return { renderUiSelect: (n, e, l, o, i) => e.ui !== "select" ? (console.assert(!1), k("div", "renderUiSelect property ui must be select")) : k(hn, {
+function Hn(t) {
+  return { renderUiSelect: (n, e, l, o, i) => e.ui !== "select" ? (console.assert(!1), k("div", "renderUiSelect property ui must be select")) : k(_n, {
     modelValue: ne(
       n,
       e,
@@ -1591,8 +1706,8 @@ function En(t) {
     readonly: e.readonly
   }) };
 }
-function Jn(t) {
-  return { renderUiSlotSelect: (n, e, l, o, i) => e.ui !== "slotSelect" ? (console.assert(!1), k("div", "renderUiSlotSelect property ui must be slotSelect")) : k(Mn, {
+function Xn(t) {
+  return { renderUiSlotSelect: (n, e, l, o, i) => e.ui !== "slotSelect" ? (console.assert(!1), k("div", "renderUiSlotSelect property ui must be slotSelect")) : k(Pn, {
     modelValue: ne(
       n,
       e,
@@ -1614,8 +1729,8 @@ function Jn(t) {
     }
   }) };
 }
-function Hn(t) {
-  return { renderUiStrInput: (n, e, l, o, i) => e.ui !== "strInput" ? (console.assert(!1), k("div", "renderUiStrInput property ui must be strInput")) : k(Pn, {
+function Fn(t) {
+  return { renderUiStrInput: (n, e, l, o, i) => e.ui !== "strInput" ? (console.assert(!1), k("div", "renderUiStrInput property ui must be strInput")) : k(An, {
     modelValue: e.static ? e.value : ne(
       n,
       e,
@@ -1642,8 +1757,8 @@ function Hn(t) {
     readonly: e.static || e.readonly
   }) };
 }
-function Xn(t) {
-  return { renderUiSwitch: (n, e, l, o, i) => e.ui !== "switch" ? (console.assert(!1), k("div", "renderUiSwitch property ui must be switch")) : k(An, {
+function zn(t) {
+  return { renderUiSwitch: (n, e, l, o, i) => e.ui !== "switch" ? (console.assert(!1), k("div", "renderUiSwitch property ui must be switch")) : k(Ln, {
     modelValue: ne(
       n,
       e,
@@ -1670,121 +1785,6 @@ function Xn(t) {
     readonly: e.readonly
   }) };
 }
-function Fn() {
-  const t = T([]);
-  zt(t);
-  const s = () => {
-    const { activeApp: o, depends: i } = Ze.app, u = [];
-    for (const { id: r, name: a, position: d } of o.compGroups) {
-      const c = t.value.find((f) => f.id === r);
-      u.push({
-        id: r,
-        type: 0,
-        name: a,
-        position: d,
-        collapse: c?.collapse ?? !0
-      });
-    }
-    for (const { id: r, groupId: a, name: d, position: c } of o.comps)
-      i[r] && u.push({ id: r, type: 1, name: d, position: c, group: a });
-    We(u, !0), t.value = u;
-  };
-  let n;
-  const e = () => {
-    clearTimeout(n), n = window.setTimeout(() => {
-      s(), n && e();
-    }, 1e3);
-  }, l = () => {
-    clearTimeout(n), n = void 0;
-  };
-  Xe(() => {
-    e();
-  }), Fe(() => {
-    l();
-  });
-}
-function zn(t, s, n) {
-  const { i18n: e } = Ct, l = T([]);
-  Gt(l);
-  const o = () => {
-    if (!t.value || !s.value || !n.value)
-      return;
-    const a = Ne[t.value];
-    if (!a) {
-      console.assert(!1, `invalid version=${t.value}`);
-      return;
-    }
-    const d = wt(s.value, n.value), c = [];
-    for (let h = 0; h < a.groups[d].length; h++) {
-      const V = a.groups[d][h], D = _e(l, V.key);
-      c.push({
-        id: V.key,
-        type: 0,
-        name: e.global.t(V.name),
-        position: h,
-        collapse: D?.collapse ?? !0,
-        count: 0
-      });
-      let x = 0;
-      for (const S of V.items) {
-        const U = Mt[S];
-        if (U && !U.internal && U.slots)
-          for (const O of U.slots) {
-            const Q = Re("elementSlot", 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 } = Ze.app;
-    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: V,
-        position: D,
-        collapse: x?.collapse ?? !0
-      });
-    }
-    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 = Re("customSlot", h.id, D.id), S = `${h.name} / ${D.name}`;
-          c.push({
-            id: x,
-            type: 1,
-            name: S,
-            position: C++,
-            group: h.groupId
-          });
-        }
-    }
-    We(c, !0), l.value = c;
-  };
-  let i;
-  const u = () => {
-    clearTimeout(i), i = window.setTimeout(() => {
-      o(), i && u();
-    }, 1e3);
-  }, r = () => {
-    clearTimeout(i), i = void 0;
-  };
-  Xe(() => {
-    u();
-  }), Fe(() => {
-    r();
-  }), oe([t, s, n], () => {
-    o(), u();
-  });
-}
 const Gn = /* @__PURE__ */ E({
   __name: "index",
   props: {
@@ -1842,18 +1842,18 @@ const Gn = /* @__PURE__ */ E({
         h.value = l.config;
       }
     );
-    const V = T(l.object);
-    Rt(V), oe(
+    const S = T(l.object);
+    Rt(S), oe(
       () => l.object,
       () => {
-        V.value = l.object;
+        S.value = l.object;
       }
-    ), Jt(d), Xt(c), Fn(), zn(f, v, C);
-    const { renderProperty: D } = Rn(
+    ), Jt(d), Xt(c), Qt(), Zt(f, v, C);
+    const { renderProperty: D } = Jn(
       d,
       u,
       r
-    ), { renderUiDummy: x } = Nn(c), { renderUiStrInput: S } = Hn(c), { renderUiNumInput: U } = qn(c), { renderUiSwitch: O } = Xn(c), { renderUiSelect: Q } = En(c), { renderUiColorPicker: pe } = Tn(c), { renderUiJsonEditor: ut } = Bn(c), { renderUiMultiTypes: rt } = On(c), { renderUiCompSelect: at } = Ln(c), { renderUiSlotSelect: ct } = Jn(c), xe = (p, m, y, g, w, A) => (p = Ge(p), w !== void 0 ? (p.push(w), A && p.push(m.key)) : p.push(m.key), m.ui ? m.array && g ? ft(
+    ), { renderUiDummy: x } = On(c), { renderUiStrInput: V } = Fn(c), { renderUiNumInput: U } = Rn(c), { renderUiSwitch: O } = zn(c), { renderUiSelect: Q } = Hn(c), { renderUiColorPicker: ge } = Nn(c), { renderUiJsonEditor: ut } = qn(c), { renderUiMultiTypes: rt } = Kn(c), { renderUiCompSelect: at } = Bn(c), { renderUiSlotSelect: ct } = Xn(c), xe = (p, m, y, g, w, A) => (p = Ge(p), w !== void 0 ? (p.push(w), A && p.push(m.key)) : p.push(m.key), m.ui ? m.array && g ? ft(
       p,
       m,
       y,
@@ -1885,7 +1885,7 @@ const Gn = /* @__PURE__ */ E({
       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 ge = k(Ue, {
+      const ye = k(Ue, {
         title: ie,
         collapse: g.collapse,
         hasCreate: !0,
@@ -1987,7 +1987,7 @@ const Gn = /* @__PURE__ */ E({
         },
         (() => {
           const M = [];
-          return M.push(ge), g.collapse || M.push(Y), M;
+          return M.push(ye), g.collapse || M.push(Y), M;
         })()
       );
     }, mt = (p, m, y, g, w, A) => {
@@ -2012,7 +2012,7 @@ const Gn = /* @__PURE__ */ E({
         onDelete: () => {
           w === void 0 || A || (y.splice(w, 1), c(p.slice(0, -1), y));
         }
-      }), ge = k(
+      }), ye = k(
         "div",
         {
           style: {
@@ -2049,7 +2049,7 @@ const Gn = /* @__PURE__ */ E({
         },
         (() => {
           const Y = [];
-          return Y.push(ie), g.collapse || Y.push(ge), Y;
+          return Y.push(ie), g.collapse || Y.push(ye), Y;
         })()
       );
     }, ft = (p, m, y, g, w, A) => {
@@ -2063,7 +2063,7 @@ const Gn = /* @__PURE__ */ E({
       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 ge = k(Ue, {
+      const ye = k(Ue, {
         title: ie,
         collapse: g.collapse,
         hasCreate: !0,
@@ -2101,14 +2101,14 @@ const Gn = /* @__PURE__ */ E({
         },
         (() => {
           const M = [];
-          return M.push(ge), g.collapse || M.push(Y), M;
+          return M.push(ye), g.collapse || M.push(Y), M;
         })()
       );
     }, vt = (p, m, y, g, w) => {
       if (!m.ui)
         return console.assert(!1), k("div", "renderLeafScalar property ui must be valid");
       let A;
-      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 = ut(p, m, y, g, w) : m.ui === "multiTypes" ? A = rt(p, m, y, g, w) : m.ui === "compSelect" ? A = at(p, m, y, g, w) : m.ui === "slotSelect" ? A = ct(p, m, y, g, w) : console.assert(!1, "renderLeafScalar not implemented"), A ? D(p, m, A) : k("div");
+      return m.ui === "dummy" ? A = x(p, m, y, g, w) : m.ui === "strInput" ? A = V(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 = ge(p, m, y, g, w) : m.ui === "jsonEditor" ? A = ut(p, m, y, g, w) : m.ui === "multiTypes" ? A = rt(p, m, y, g, w) : m.ui === "compSelect" ? A = at(p, m, y, g, w) : m.ui === "slotSelect" ? A = ct(p, m, y, g, w) : console.assert(!1, "renderLeafScalar not implemented"), A ? D(p, m, A) : k("div");
     }, pt = () => k(
       "div",
       {