x-prop-tree 0.7.6 → 0.7.7

package/dist/index.js

@@ -1,11 +1,11 @@
-import { provide as ce, inject as de, defineComponent as R, ref as O, computed as K, resolveComponent as $, createBlock as B, openBlock as C, unref as L, isRef as ve, withCtx as J, createVNode as D, createElementBlock as E, Fragment as Ve, renderList as Be, createTextVNode as Ce, toDisplayString as W, resolveDirective as le, withDirectives as ee, withModifiers as X, normalizeStyle as I, createElementVNode as F, createCommentVNode as G, renderSlot as ft, h, mergeModels as Y, useModel as z, useId as we, onUnmounted as De, withKeys as Ke, mergeProps as be, watchEffect as Ne, watch as re, useTemplateRef as Je, reactive as mt, onMounted as vt, onBeforeUnmount as pt } from "vue";
+import { provide as ce, inject as de, defineComponent as R, ref as O, computed as K, resolveComponent as x, createBlock as B, openBlock as C, unref as L, isRef as ve, withCtx as J, createVNode as D, createElementBlock as E, Fragment as Ve, renderList as Be, createTextVNode as Ce, toDisplayString as W, resolveDirective as le, withDirectives as ee, withModifiers as X, normalizeStyle as I, createElementVNode as F, createCommentVNode as G, renderSlot as ft, h, mergeModels as Y, useModel as z, useId as we, onUnmounted as De, withKeys as Ke, mergeProps as be, watchEffect as Ne, watch as re, useTemplateRef as Je, reactive as mt, onMounted as vt, onBeforeUnmount as pt } from "vue";
 import { useI18n as te } from "vue-i18n";
 import { useViewStack as Se, useColor as ie, eventBus as ue, useSystem as pe, openPromptDlg as yt, openNumberDlg as Re, injectDark as gt, injectLocale as ht } from "x-essential-lib";
 import { c as Ee, i as Ue, r as He, v as _t, d as kt } from "./vendor.n68iqk3a.js";
 import { getPropDefault as q, pkgs as Fe, parsePixelStr as Vt, parsePercentStr as Ct } from "x-runtime-lib";
 import { globalState as St } from "x-state-lib";
 import { useDisplay as Ut } from "vuetify";
-import { XBlockly as $t } from "x-block-lib";
+import { XBlockly as xt } from "x-block-lib";
 const _e = (l, s) => {
   let t = { key: "", name: "", children: l };
   return s.forEach((e) => {
@@ -30,7 +30,7 @@ const _e = (l, s) => {
     }
     t = t[e];
   }), t;
-}, Oe = (l) => !(l instanceof Array), Me = (l) => l instanceof Array, xt = (l, s) => {
+}, Oe = (l) => !(l instanceof Array), Me = (l) => l instanceof Array, $t = (l, s) => {
   const t = (e, n) => {
     if (e.ui !== n.ui || e.array !== n.array)
       return !1;
@@ -44,10 +44,10 @@ const _e = (l, s) => {
     return !0;
   };
   return t(l, s);
-}, Ae = (l) => !(l instanceof Array), $e = (l) => l instanceof Array, Pt = [
+}, Ae = (l) => !(l instanceof Array), xe = (l) => l instanceof Array, Pt = [
   ["basic", "id"],
   ["basic", "name"]
-], Mt = (l) => Pt.find((s) => Ue(l, s)), xe = (l, s, t, e, n, o, i) => (l = Ee(l), o !== void 0 ? (l.push(o), i && l.push(s.key)) : l.push(s.key), Mt(l) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && $e(e.children) ? bt(
+], Mt = (l) => Pt.find((s) => Ue(l, s)), $e = (l, s, t, e, n, o, i) => (l = Ee(l), o !== void 0 ? (l.push(o), i && l.push(s.key)) : l.push(s.key), Mt(l) ? (e.change = !1, e.change) : s.ui ? s.array && e.children && xe(e.children) ? bt(
   l,
   s,
   t,
@@ -76,7 +76,7 @@ const _e = (l, s) => {
     return console.assert(!1, "execPropBranchArray prop ui must be invalid"), !1;
   if (!s.array)
     return console.assert(!1, "execPropBranchArray prop array must be valid"), !1;
-  if (!e.children || !$e(e.children))
+  if (!e.children || !xe(e.children))
     return console.assert(!1, "execPropBranchArray state children must be array"), !1;
   let r;
   o !== void 0 && !i ? (t[o] instanceof Array || (t[o] = q(s), n?.(l, t[o])), r = t[o]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n?.(l, t[s.key])), r = t[s.key]), e.change = !1;
@@ -94,7 +94,7 @@ const _e = (l, s) => {
       a.children[f.key] = {
         change: !1,
         children: f.array ? [] : {}
-      }, xe(
+      }, $e(
         l,
         f,
         r[u],
@@ -120,7 +120,7 @@ const _e = (l, s) => {
     e.children[a.key] = {
       change: !1,
       children: a.array ? [] : {}
-    }, xe(l, a, r, e.children[a.key], n) && (e.change = !0);
+    }, $e(l, a, r, e.children[a.key], n) && (e.change = !0);
   }
   return e.change;
 }, bt = (l, s, t, e, n, o, i) => {
@@ -128,7 +128,7 @@ const _e = (l, s) => {
     return console.assert(!1, "execPropLeafArray prop ui must be valid"), !1;
   if (!s.array)
     return console.assert(!1, "execPropLeafArray prop aray must be valid"), !1;
-  if (!e.children || !$e(e.children))
+  if (!e.children || !xe(e.children))
     return console.assert(!1, "execPropLeafArray state children must be array"), !1;
   let r;
   o !== void 0 && !i ? (t[o] instanceof Array || (t[o] = q(s), n?.(l, t[o])), r = t[o]) : (t[s.key] instanceof Array || (t[s.key] = q(s), n?.(l, t[s.key])), r = t[s.key]), e.change = !1;
@@ -136,7 +136,7 @@ const _e = (l, s) => {
     e.children[u] = {
       change: !1,
       children: {}
-    }, xe(l, s, r, e.children[u], n, u, !1) && (e.change = !0);
+    }, $e(l, s, r, e.children[u], n, u, !1) && (e.change = !0);
   return e.change || (e.change = !Ue(r, q(s))), e.change;
 }, At = (l, s, t, e, n) => {
   if (!l.ui)
@@ -153,7 +153,7 @@ const _e = (l, s) => {
     n[o.key] = {
       change: !1,
       children: o.array ? [] : {}
-    }, xe([], o, t, n[o.key], e);
+    }, $e([], o, t, n[o.key], e);
   }), l.value = n;
 }, ae = (l, s) => {
   let t = { change: !1, children: l };
@@ -162,7 +162,7 @@ const _e = (l, s) => {
       return console.assert(!1, `isPropChanged state must be valid keys=${s}`), !1;
     if (!t.children)
       return console.assert(!1, `isPropChanged state must be valid keys=${s}`), !1;
-    typeof e == "string" ? Ae(t.children) && (t = t.children[e]) : $e(t.children) && (t = t.children[e]);
+    typeof e == "string" ? Ae(t.children) && (t = t.children[e]) : xe(t.children) && (t = t.children[e]);
   }), t?.change ?? !1;
 }, Xe = Symbol(), ze = Symbol(), Ge = Symbol(), Ye = Symbol(), We = Symbol(), Qe = Symbol();
 function Tt(l) {
@@ -261,7 +261,7 @@ const Ht = /* @__PURE__ */ R({
           return !1;
         try {
           const { prop: M } = JSON.parse(_), N = _e(t.value, u.value);
-          return xt(M, N);
+          return $t(M, N);
         } catch (M) {
           console.error(M);
         }
@@ -289,13 +289,13 @@ const Ht = /* @__PURE__ */ R({
       i.value = P.x, r.value = P.y, u.value = P.keys;
     }, { open: S } = Se("propTreeMenu", k);
     return (P, T) => {
-      const w = $("v-list-item-title"), _ = $("v-list-item"), M = $("v-list"), N = $("v-menu");
+      const w = x("v-list-item-title"), _ = x("v-list-item"), M = x("v-list"), N = x("v-menu");
       return C(), B(N, {
         modelValue: L(S),
         "onUpdate:modelValue": T[0] || (T[0] = (Q) => ve(S) ? S.value = Q : null),
         "location-strategy": "connected",
-        target: a.value,
-        scrim: "transparent"
+        scrim: "transparent",
+        target: a.value
       }, {
         default: J(() => [
           D(M, null, {
@@ -345,14 +345,14 @@ const Ht = /* @__PURE__ */ R({
       n("menu", a.clientX, a.clientY);
     };
     return (a, f) => {
-      const d = $("v-icon"), y = $("v-spacer"), g = $("v-btn"), k = le("ripple");
+      const d = x("v-icon"), y = x("v-spacer"), g = x("v-btn"), k = le("ripple");
       return ee((C(), E("div", {
         class: "d-flex align-center cursor-pointer",
         style: I(i.value),
         onClick: r,
         onContextmenu: X(u, ["self", "prevent"]),
-        onMouseover: f[2] || (f[2] = (S) => o.value = !0),
-        onMouseout: f[3] || (f[3] = (S) => o.value = !1)
+        onMouseout: f[2] || (f[2] = (S) => o.value = !1),
+        onMouseover: f[3] || (f[3] = (S) => o.value = !0)
       }, [
         D(d, {
           class: "mr-1",
@@ -363,17 +363,17 @@ const Ht = /* @__PURE__ */ R({
         a.hasCreate ? (C(), B(g, {
           key: 0,
           class: "mx-3",
-          variant: "text",
           density: "compact",
           icon: "mdi-plus",
+          variant: "text",
           onClick: f[0] || (f[0] = X((S) => n("create"), ["stop"]))
         })) : G("", !0),
         a.hasDelete ? (C(), B(g, {
           key: 1,
           class: "mx-3",
-          variant: "text",
           density: "compact",
           icon: "mdi-minus",
+          variant: "text",
           onClick: f[1] || (f[1] = X((S) => n("delete", a.index), ["stop"]))
         })) : G("", !0)
       ], 36)), [
@@ -403,8 +403,8 @@ const Ht = /* @__PURE__ */ R({
         class: "d-flex justify-space-between align-center cursor-pointer",
         style: I(i.value),
         onContextmenu: X(r, ["self", "prevent"]),
-        onMouseover: a[0] || (a[0] = (d) => o.value = !0),
-        onMouseout: a[1] || (a[1] = (d) => o.value = !1)
+        onMouseout: a[0] || (a[0] = (d) => o.value = !1),
+        onMouseover: a[1] || (a[1] = (d) => o.value = !0)
       }, [
         ft(u.$slots, "default")
       ], 36)), [
@@ -496,15 +496,15 @@ const Yt = { class: "d-flex justify-space-between align-center" }, Wt = /* @__PU
       r !== void 0 && (e.value = r);
     };
     return (i, r) => {
-      const u = $("v-text-field"), a = $("v-btn"), f = le("ripple");
+      const u = x("v-text-field"), a = x("v-btn"), f = le("ripple");
       return C(), E("div", Yt, [
         ee(D(u, {
           modelValue: e.value,
           "onUpdate:modelValue": r[0] || (r[0] = (d) => e.value = d),
           density: "compact",
           "hide-details": "",
-          "single-line": "",
           readonly: i.readonly,
+          "single-line": "",
           "onUpdate:focused": o
         }, null, 8, ["modelValue", "readonly"]), [
           [
@@ -517,9 +517,9 @@ const Yt = { class: "d-flex justify-space-between align-center" }, Wt = /* @__PU
         i.hasDelete ? (C(), B(a, {
           key: 0,
           class: "mx-2",
-          variant: "text",
           density: "compact",
           icon: "mdi-minus",
+          variant: "text",
           onClick: r[1] || (r[1] = X((d) => n("delete"), ["stop"]))
         })) : G("", !0)
       ]);
@@ -574,6 +574,7 @@ const Zt = { class: "d-flex justify-space-between align-center" }, jt = /* @__PU
       if (!i || l.readonly || !t())
         return;
       const r = await Re({
+        title: "",
         value: e.value,
         precision: l.precision,
         min: l.min,
@@ -583,22 +584,22 @@ const Zt = { class: "d-flex justify-space-between align-center" }, jt = /* @__PU
       r !== void 0 && (e.value = r);
     };
     return (i, r) => {
-      const u = $("v-number-input"), a = $("v-btn"), f = le("ripple");
+      const u = x("v-number-input"), a = x("v-btn"), f = le("ripple");
       return C(), E("div", Zt, [
         ee(D(u, {
           modelValue: e.value,
           "onUpdate:modelValue": r[0] || (r[0] = (d) => e.value = d),
-          density: "compact",
           "control-variant": "stacked",
-          precision: i.precision,
-          min: i.min,
-          max: i.max,
-          step: i.step,
+          density: "compact",
           "hide-details": "",
-          "single-line": "",
+          max: i.max,
+          min: i.min,
+          precision: i.precision,
           readonly: i.readonly,
+          "single-line": "",
+          step: i.step,
           "onUpdate:focused": o
-        }, null, 8, ["modelValue", "precision", "min", "max", "step", "readonly"]), [
+        }, null, 8, ["modelValue", "max", "min", "precision", "readonly", "step"]), [
           [
             f,
             void 0,
@@ -609,9 +610,9 @@ const Zt = { class: "d-flex justify-space-between align-center" }, jt = /* @__PU
         i.hasDelete ? (C(), B(a, {
           key: 0,
           class: "mx-2",
-          variant: "text",
           density: "compact",
           icon: "mdi-minus",
+          variant: "text",
           onClick: r[1] || (r[1] = X((d) => n("delete"), ["stop"]))
         })) : G("", !0)
       ]);
@@ -663,23 +664,23 @@ const en = { class: "d-flex justify-space-between align-center" }, tn = /* @__PU
   setup(l, { emit: s }) {
     const t = z(l, "modelValue"), e = s;
     return (n, o) => {
-      const i = $("v-switch"), r = $("v-btn");
+      const i = x("v-switch"), r = x("v-btn");
       return C(), E("div", en, [
         D(i, {
           modelValue: t.value,
           "onUpdate:modelValue": o[0] || (o[0] = (u) => t.value = u),
           class: "ml-1",
-          density: "compact",
           color: "primary",
+          density: "compact",
           "hide-details": "",
           readonly: n.readonly
         }, null, 8, ["modelValue", "readonly"]),
         n.hasDelete ? (C(), B(r, {
           key: 0,
           class: "mx-2",
-          variant: "text",
           density: "compact",
           icon: "mdi-minus",
+          variant: "text",
           onClick: o[1] || (o[1] = X((u) => e("delete"), ["stop"]))
         })) : G("", !0)
       ]);
@@ -733,16 +734,16 @@ const ln = { class: "d-flex justify-space-between align-center" }, on = /* @__PU
       }), r;
     });
     return (r, u) => {
-      const a = $("v-select"), f = $("v-btn"), d = le("ripple");
+      const a = x("v-select"), f = x("v-btn"), d = le("ripple");
       return C(), E("div", ln, [
         ee(D(a, {
           modelValue: e.value,
           "onUpdate:modelValue": u[0] || (u[0] = (y) => e.value = y),
           density: "compact",
-          items: i.value,
           "hide-details": "",
-          "single-line": "",
-          readonly: r.readonly
+          items: i.value,
+          readonly: r.readonly,
+          "single-line": ""
         }, null, 8, ["modelValue", "items", "readonly"]), [
           [
             d,
@@ -754,9 +755,9 @@ const ln = { class: "d-flex justify-space-between align-center" }, on = /* @__PU
         r.hasDelete ? (C(), B(f, {
           key: 0,
           class: "mx-2",
-          variant: "text",
           density: "compact",
           icon: "mdi-minus",
+          variant: "text",
           onClick: u[1] || (u[1] = X((y) => n("delete"), ["stop"]))
         })) : G("", !0)
       ]);
@@ -809,13 +810,13 @@ const rn = { class: "text-subtitle-2 ml-1" }, un = { class: "text-caption text-g
       userSelect: "none"
     }));
     return (u, a) => {
-      const f = $("v-icon"), d = le("ripple");
+      const f = x("v-icon"), d = le("ripple");
       return ee((C(), E("div", {
         class: "d-flex align-center cursor-pointer",
         style: I(r.value),
         onClick: a[0] || (a[0] = (y) => o("x-click", n.id)),
-        onMouseover: a[1] || (a[1] = (y) => i.value = !0),
-        onMouseout: a[2] || (a[2] = (y) => i.value = !1)
+        onMouseout: a[1] || (a[1] = (y) => i.value = !1),
+        onMouseover: a[2] || (a[2] = (y) => i.value = !0)
       }, [
         D(f, {
           icon: n.collapse ? "mdi-chevron-right" : "mdi-chevron-down",
@@ -848,8 +849,8 @@ const rn = { class: "text-subtitle-2 ml-1" }, un = { class: "text-caption text-g
         class: "d-flex align-center cursor-pointer",
         style: I(r.value),
         onClick: a[0] || (a[0] = (d) => o("x-click", n.id)),
-        onMouseover: a[1] || (a[1] = (d) => i.value = !0),
-        onMouseout: a[2] || (a[2] = (d) => i.value = !1)
+        onMouseout: a[1] || (a[1] = (d) => i.value = !1),
+        onMouseover: a[2] || (a[2] = (d) => i.value = !0)
       }, [
         F("span", cn, W(n.title), 1)
       ], 36)), [
@@ -883,11 +884,11 @@ const rn = { class: "text-subtitle-2 ml-1" }, un = { class: "text-caption text-g
         a.type === 0 ? (C(), B(an, {
           key: 0,
           id: a.id,
-          title: a.name,
           collapse: a.collapse,
           count: a.count ?? 0,
+          title: a.name,
           onXClick: o
-        }, null, 8, ["id", "title", "collapse", "count"])) : G("", !0),
+        }, null, 8, ["id", "collapse", "count", "title"])) : G("", !0),
         a.type === 1 && a.show ? (C(), B(dn, {
           key: 1,
           id: a.id,
@@ -929,20 +930,20 @@ const rn = { class: "text-subtitle-2 ml-1" }, un = { class: "text-caption text-g
     return De(() => {
       d.value = !1;
     }), (y, g) => {
-      const k = $("v-btn"), S = $("v-sheet"), P = $("v-icon"), T = $("v-dialog");
+      const k = x("v-btn"), S = x("v-sheet"), P = x("v-icon"), T = x("v-dialog");
       return C(), B(T, {
         modelValue: L(d),
         "onUpdate:modelValue": g[5] || (g[5] = (w) => ve(d) ? d.value = w : null),
-        transition: "scroll-x-reverse-transition",
-        persistent: "",
-        "no-click-animation": "",
         fullscreen: "",
+        "no-click-animation": "",
+        persistent: "",
+        transition: "scroll-x-reverse-transition",
         onKeydown: g[6] || (g[6] = Ke(X((w) => d.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
         activator: J(({ props: w }) => [
           D(k, be(w, {
-            density: "comfortable",
-            block: ""
+            block: "",
+            density: "comfortable"
           }), {
             default: J(() => [
               Ce(W(f.value), 1)
@@ -1044,7 +1045,7 @@ const hn = { class: "d-flex justify-space-between align-center" }, _n = /* @__PU
     return De(() => {
       r.value = !1;
     }), (u, a) => {
-      const f = $("v-btn"), d = $("v-color-picker"), y = $("v-menu");
+      const f = x("v-btn"), d = x("v-color-picker"), y = x("v-menu");
       return C(), B(y, {
         modelValue: L(r),
         "onUpdate:modelValue": a[2] || (a[2] = (g) => ve(r) ? r.value = g : null),
@@ -1058,9 +1059,9 @@ const hn = { class: "d-flex justify-space-between align-center" }, _n = /* @__PU
               style: I(o.value)
             }, [
               D(f, be(g, {
-                density: "comfortable",
-                color: e.value,
                 block: "",
+                color: e.value,
+                density: "comfortable",
                 disabled: i.value
               }), {
                 default: J(() => [
@@ -1072,9 +1073,9 @@ const hn = { class: "d-flex justify-space-between align-center" }, _n = /* @__PU
             u.hasDelete ? (C(), B(f, {
               key: 0,
               class: "mx-2",
-              variant: "text",
               density: "compact",
               icon: "mdi-minus",
+              variant: "text",
               onClick: a[0] || (a[0] = X((k) => n("delete"), ["stop"]))
             })) : G("", !0)
           ])
@@ -1147,10 +1148,15 @@ const Vn = { class: "d-flex justify-space-between align-center my-2" }, Cn = { c
     const f = K(() => r.value?.[u.value]), d = () => {
       n.value = f.value?.default;
     }, y = O(0), g = async (k) => {
-      if (!k || !e())
+      if (!k || !e() || f.value.ui !== "pixelInput" && f.value.ui !== "percentInput")
         return;
       const S = await Re({
-        value: y.value
+        title: "",
+        value: y.value,
+        precision: f.value.precision,
+        min: f.value.min,
+        max: f.value.max,
+        step: f.value.step
       });
       S !== void 0 && (y.value = S);
     };
@@ -1159,7 +1165,7 @@ const Vn = { class: "d-flex justify-space-between align-center my-2" }, Cn = { c
     }), re(y, (k) => {
       f.value?.ui === "pixelInput" ? n.value = k + "px" : f.value?.ui === "percentInput" && (n.value = k + "%");
     }), (k, S) => {
-      const P = $("v-select"), T = $("v-number-input"), w = $("v-btn"), _ = le("ripple");
+      const P = x("v-select"), T = x("v-number-input"), w = x("v-btn"), _ = le("ripple");
       return C(), E("div", Vn, [
         F("div", Cn, [
           ee(D(P, {
@@ -1169,8 +1175,8 @@ const Vn = { class: "d-flex justify-space-between align-center my-2" }, Cn = { c
               d
             ],
             density: "compact",
-            items: a.value,
             "hide-details": "",
+            items: a.value,
             "single-line": ""
           }, null, 8, ["modelValue", "items"]), [
             [
@@ -1184,16 +1190,16 @@ const Vn = { class: "d-flex justify-space-between align-center my-2" }, Cn = { c
             key: 0,
             modelValue: y.value,
             "onUpdate:modelValue": S[1] || (S[1] = (M) => y.value = M),
-            density: "compact",
             "control-variant": "stacked",
-            precision: f.value.precision,
-            min: f.value.min,
-            max: f.value.max,
-            step: f.value.step,
+            density: "compact",
             "hide-details": "",
+            max: f.value.max,
+            min: f.value.min,
+            precision: f.value.precision,
             "single-line": "",
+            step: f.value.step,
             "onUpdate:focused": g
-          }, null, 8, ["modelValue", "precision", "min", "max", "step"])), [
+          }, null, 8, ["modelValue", "max", "min", "precision", "step"])), [
             [
               _,
               void 0,
@@ -1205,9 +1211,9 @@ const Vn = { class: "d-flex justify-space-between align-center my-2" }, Cn = { c
         k.hasDelete ? (C(), B(w, {
           key: 0,
           class: "mx-2",
-          variant: "text",
           density: "compact",
           icon: "mdi-minus",
+          variant: "text",
           onClick: S[2] || (S[2] = X((M) => o("delete"), ["stop"]))
         })) : G("", !0)
       ]);
@@ -1242,7 +1248,7 @@ function Un(l) {
     types: e.types
   }) };
 }
-const $n = /* @__PURE__ */ R({
+const xn = /* @__PURE__ */ R({
   __name: "editor",
   props: {
     modelValue: { required: !0 },
@@ -1261,21 +1267,21 @@ const $n = /* @__PURE__ */ R({
     return s({ save: () => {
       const d = u.value.save();
       t.value = JSON.stringify(d, null, 2);
-    } }), (d, y) => (C(), B(L($t), {
+    } }), (d, y) => (C(), B(L(xt), {
       ref_key: "target",
       ref: u,
       lock: e.value,
       "onUpdate:lock": y[0] || (y[0] = (g) => e.value = g),
       scale: n.value,
       "onUpdate:scale": y[1] || (y[1] = (g) => n.value = g),
+      dark: L(o),
+      locale: L(i),
       type: "json",
       version: L(r),
-      locale: L(i),
-      dark: L(o),
       onReady: a
-    }, null, 8, ["lock", "scale", "version", "locale", "dark"]));
+    }, null, 8, ["lock", "scale", "dark", "locale", "version"]));
   }
-}), xn = { class: "text-subtitle-1" }, Pn = /* @__PURE__ */ R({
+}), $n = { class: "text-subtitle-1" }, Pn = /* @__PURE__ */ R({
   __name: "index",
   props: {
     modelValue: { required: !0 },
@@ -1298,21 +1304,21 @@ const $n = /* @__PURE__ */ R({
     return re(d, (g) => {
       g || y.value?.save();
     }), (g, k) => {
-      const S = $("v-btn"), P = $("v-sheet"), T = $("v-spacer"), w = $("v-dialog");
+      const S = x("v-btn"), P = x("v-sheet"), T = x("v-spacer"), w = x("v-dialog");
       return C(), B(w, {
         modelValue: L(d),
         "onUpdate:modelValue": k[4] || (k[4] = (_) => ve(d) ? d.value = _ : null),
-        transition: "dialog-bottom-transition",
-        persistent: "",
-        "no-click-animation": "",
-        fullscreen: "",
         attach: "",
+        fullscreen: "",
+        "no-click-animation": "",
+        persistent: "",
+        transition: "dialog-bottom-transition",
         onKeydown: k[5] || (k[5] = Ke(X((_) => d.value = !1, ["stop", "prevent"]), ["esc"]))
       }, {
         activator: J(({ props: _ }) => [
           D(S, be(_, {
-            density: "comfortable",
-            block: ""
+            block: "",
+            density: "comfortable"
           }), {
             default: J(() => [
               Ce(W(f.value), 1)
@@ -1323,8 +1329,8 @@ const $n = /* @__PURE__ */ R({
         default: J(() => [
           D(P, {
             color: L(e),
-            width: "100%",
-            height: "100%"
+            height: "100%",
+            width: "100%"
           }, {
             default: J(() => [
               L(t) ? (C(), B(P, {
@@ -1339,12 +1345,12 @@ const $n = /* @__PURE__ */ R({
               }, {
                 default: J(() => [
                   D(S, {
-                    variant: "text",
                     density: "comfortable",
                     icon: "mdi-close",
+                    variant: "text",
                     onClick: k[0] || (k[0] = (_) => d.value = !1)
                   }),
-                  F("span", xn, W(L(s)("x-prop-tree.dlg.jsonObject.title")), 1),
+                  F("span", $n, W(L(s)("x-prop-tree.dlg.jsonObject.title")), 1),
                   D(T)
                 ]),
                 _: 1
@@ -1352,7 +1358,7 @@ const $n = /* @__PURE__ */ R({
               F("div", {
                 style: I(a.value)
               }, [
-                D($n, {
+                D(xn, {
                   ref_key: "editor",
                   ref: y,
                   modelValue: i.value,
@@ -1442,17 +1448,17 @@ const wn = /* @__PURE__ */ R({
     Et(S);
     const P = () => {
       const { compGroups: v, comps: c } = St.app.activeApp, p = [];
-      v.forEach(({ id: m, name: V, position: x }) => {
+      v.forEach(({ id: m, name: V, position: $ }) => {
         const A = S.value.find((Z) => Z.id === m);
         p.push({
           id: m,
           type: 0,
           name: V,
-          position: x,
+          position: $,
           collapse: A?.collapse ?? !0
         });
-      }), c.forEach(({ id: m, groupid: V, name: x, position: A }) => {
-        p.push({ id: m, type: 1, name: x, position: A, group: V });
+      }), c.forEach(({ id: m, groupid: V, name: $, position: A }) => {
+        p.push({ id: m, type: 1, name: $, position: A, group: V });
       }), kt(p, !0), S.value = p;
     };
     let T;
@@ -1468,14 +1474,14 @@ const wn = /* @__PURE__ */ R({
     }), pt(() => {
       _();
     });
-    const { renderProp: M } = zt(f, r, u), { renderUiDummy: N } = Gt(d), { renderUiStrInput: Q } = Qt(d), { renderUiNumInput: Pe } = It(d), { renderUiSwitch: je } = nn(d), { renderUiSelect: Ie } = sn(d), { renderUiColorPicker: et } = kn(d), { renderUiJsonEditor: tt } = Mn(d), { renderUiMultiTypes: nt } = Un(d), { renderUiCompSelect: lt } = gn(d), ye = (v, c, p, m, V, x) => (v = Ee(v), V !== void 0 ? (v.push(V), x && v.push(c.key)) : v.push(c.key), c.ui ? c.array && m ? it(v, c, p, m, V, x) : rt(v, c, p, V, x) : c.array ? ot(v, c, p, m, V, x) : st(
+    const { renderProp: M } = zt(f, r, u), { renderUiDummy: N } = Gt(d), { renderUiStrInput: Q } = Qt(d), { renderUiNumInput: Pe } = It(d), { renderUiSwitch: je } = nn(d), { renderUiSelect: Ie } = sn(d), { renderUiColorPicker: et } = kn(d), { renderUiJsonEditor: tt } = Mn(d), { renderUiMultiTypes: nt } = Un(d), { renderUiCompSelect: lt } = gn(d), ye = (v, c, p, m, V, $) => (v = Ee(v), V !== void 0 ? (v.push(V), $ && v.push(c.key)) : v.push(c.key), c.ui ? c.array && m ? it(v, c, p, m, V, $) : rt(v, c, p, V, $) : c.array ? ot(v, c, p, m, V, $) : st(
       v,
       c,
       p,
       m,
       V,
-      x
-    )), ot = (v, c, p, m, V, x) => {
+      $
+    )), ot = (v, c, p, m, V, $) => {
       if (c.ui)
         return console.assert(!1), h("div", "renderBranchArray prop ui must be invalid");
       if (!c.array)
@@ -1483,7 +1489,7 @@ const wn = /* @__PURE__ */ R({
       if (!m)
         return console.assert(!1), h("div", "renderBranchArray branch must be valid");
       let A;
-      V !== void 0 && !x ? (p[V] instanceof Array || (p[V] = q(c), d(v, p[c.key])), A = p[V]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(v, p[c.key])), A = p[c.key]);
+      V !== void 0 && !$ ? (p[V] instanceof Array || (p[V] = q(c), d(v, p[c.key])), A = p[V]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(v, p[c.key])), A = p[c.key]);
       let Z = t(c.name);
       m.collapse && ae(f.value, v) && (Z += " *");
       const fe = h(ke, {
@@ -1591,7 +1597,7 @@ const wn = /* @__PURE__ */ R({
           return U.push(fe), m.collapse || U.push(H), U;
         })()
       );
-    }, st = (v, c, p, m, V, x) => {
+    }, st = (v, c, p, m, V, $) => {
       if (c.ui)
         return console.assert(!1), h("div", "renderBranchScalar prop ui must be invalid");
       if (c.array)
@@ -1603,7 +1609,7 @@ const wn = /* @__PURE__ */ R({
       const Z = h(ke, {
         title: A,
         collapse: m.collapse,
-        hasDelete: V !== void 0 && !x,
+        hasDelete: V !== void 0 && !$,
         onCollapse: (H) => {
           m.collapse = H;
         },
@@ -1611,7 +1617,7 @@ const wn = /* @__PURE__ */ R({
           ue.emit("propTreeMenu", { x: H, y: U, keys: v });
         },
         onDelete: () => {
-          V === void 0 || x || (p.splice(V, 1), d(v.slice(0, -1), p));
+          V === void 0 || $ || (p.splice(V, 1), d(v.slice(0, -1), p));
         }
       }), fe = h(
         "div",
@@ -1653,7 +1659,7 @@ const wn = /* @__PURE__ */ R({
           return H.push(Z), m.collapse || H.push(fe), H;
         })()
       );
-    }, it = (v, c, p, m, V, x) => {
+    }, it = (v, c, p, m, V, $) => {
       if (!c.ui)
         return console.assert(!1), h("div", "renderLeafArray prop ui must be valid");
       if (!c.array)
@@ -1661,7 +1667,7 @@ const wn = /* @__PURE__ */ R({
       if (!m)
         return console.assert(!1), h("div", "renderLeafArray branch must be valid");
       let A;
-      V !== void 0 && !x ? (p[V] instanceof Array || (p[V] = q(c), d(v, p[V])), A = p[V]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(v, p[c.key])), A = p[c.key]);
+      V !== void 0 && !$ ? (p[V] instanceof Array || (p[V] = q(c), d(v, p[V])), A = p[V]) : (p[c.key] instanceof Array || (p[c.key] = q(c), d(v, p[c.key])), A = p[c.key]);
       let Z = t(c.name);
       m.collapse && ae(f.value, v) && (Z += " *");
       const fe = h(ke, {
@@ -1708,8 +1714,8 @@ const wn = /* @__PURE__ */ R({
     }, rt = (v, c, p, m, V) => {
       if (!c.ui)
         return console.assert(!1), h("div", "renderLeafScalar prop ui must be valid");
-      let x;
-      return c.ui === "dummy" ? x = N(v, c, p, m, V) : c.ui === "strInput" ? x = Q(v, c, p, m, V) : c.ui === "numInput" ? x = Pe(v, c, p, m, V) : c.ui === "switch" ? x = je(v, c, p, m, V) : c.ui === "select" ? x = Ie(v, c, p, m, V) : c.ui === "colorPicker" ? x = et(v, c, p, m, V) : c.ui === "jsonEditor" ? x = tt(v, c, p, m, V) : c.ui === "multiTypes" ? x = nt(v, c, p, m, V) : c.ui === "compSelect" ? x = lt(v, c, p, m, V) : console.assert(!1, "renderLeafScalar not implemented"), x ? M(v, c, x) : h("div");
+      let $;
+      return c.ui === "dummy" ? $ = N(v, c, p, m, V) : c.ui === "strInput" ? $ = Q(v, c, p, m, V) : c.ui === "numInput" ? $ = Pe(v, c, p, m, V) : c.ui === "switch" ? $ = je(v, c, p, m, V) : c.ui === "select" ? $ = Ie(v, c, p, m, V) : c.ui === "colorPicker" ? $ = et(v, c, p, m, V) : c.ui === "jsonEditor" ? $ = tt(v, c, p, m, V) : c.ui === "multiTypes" ? $ = nt(v, c, p, m, V) : c.ui === "compSelect" ? $ = lt(v, c, p, m, V) : console.assert(!1, "renderLeafScalar not implemented"), $ ? M(v, c, $) : h("div");
     }, ut = () => h(
       "div",
       {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "x-prop-tree",
   "private": false,
-  "version": "0.7.6",
+  "version": "0.7.7",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -24,20 +24,20 @@
   "dependencies": {
     "lodash-es": "^4.17.21",
     "vue": "^3.5.17",
-    "vue-i18n": "^11.1.9",
+    "vue-i18n": "^11.1.10",
     "vuetify": "^3.9.0",
-    "x-block-lib": "^0.7.7",
-    "x-essential-lib": "^0.8.21",
+    "x-block-lib": "^0.7.8",
+    "x-essential-lib": "^0.8.22",
     "x-group-list": "^0.4.3",
     "x-runtime-lib": "^0.7.15",
     "x-state-lib": "^0.3.2"
   },
   "devDependencies": {
-    "@eslint/js": "^9.30.1",
+    "@eslint/js": "^9.31.0",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^24.0.12",
+    "@types/node": "^24.0.14",
     "@vitejs/plugin-vue": "^6.0.0",
-    "eslint": "^9.30.1",
+    "eslint": "^9.31.0",
     "eslint-config-prettier": "^10.1.5",
     "eslint-plugin-prettier": "^5.5.1",
     "eslint-plugin-vue": "^10.3.0",
@@ -47,8 +47,8 @@
     "prettier": "3.6.2",
     "sass": "^1.89.2",
     "typescript": "^5.8.3",
-    "typescript-eslint": "^8.36.0",
-    "vite": "^7.0.3",
+    "typescript-eslint": "^8.37.0",
+    "vite": "^7.0.4",
     "vite-plugin-css-injected-by-js": "^3.5.2",
     "vite-plugin-vuetify": "^2.1.1",
     "vue-eslint-parser": "^10.2.0",