@webx-ui/module-blocks 0.9.0 → 0.9.1

package/dist/index.js

@@ -1,6 +1,6 @@
 import { WxCodeEditor as Ye, WxText as H, WxIcon as we, WxSkeleton as Pe, WxBadge as he, WxButton as ue, confirm as ct, toast as K, useElementWidth as dt, WxSegmented as Kt, WxCard as Ne, WxPopover as Vl, WxAlert as Yt, WxTabs as Al, WxTab as Ue, WxFormItem as ne, WxSelect as kt, WxInput as et, WxTextarea as Gt, WxIconPicker as Bl, WxInputNumber as Lt, WxTagsInput as Wt, WxSwitch as Ll, WxActionBar as Wl, useModal as Zt, WxDialog as Qt, WxEmpty as Xt, WxAction as Ge, WxSortableList as Nl, createModal as el, WxDrawer as zl, WxRadioGroup as Ml, WxRadio as Nt, WxSpace as Ol, WxSkeletonItem as at } from "@webx-ui/core";
-import { defineComponent as se, ref as I, watch as oe, openBlock as c, createElementBlock as x, createVNode as h, unref as n, createBlock as O, withCtx as b, createTextVNode as L, toDisplayString as k, createCommentVNode as W, computed as $, createElementVNode as V, Fragment as P, renderList as Y, onMounted as tt, onBeforeUnmount as pt, normalizeStyle as Me, reactive as ht, resolveComponent as _t, normalizeClass as Oe, withDirectives as Dl, vShow as Il, inject as Ze, watchEffect as Ul, isRef as tl, nextTick as Pl, withKeys as zt, withModifiers as Mt, provide as ll, useModel as Rl, getCurrentInstance as jl, resolveDynamicComponent as Fl, mergeProps as Hl, mergeModels as Jl } from "vue";
-import { useAdmin as lt, useTranslate as ce, useErrorText as nt, WxDate as ql, WxScreenHead as Kl, WxRenameButton as Yl, WxHelpButton as Gl, adminKey as nl, WxRowMenu as Zl, WxListScreen as Ql } from "@webx-ui/module-admin";
+import { defineComponent as se, ref as I, watch as oe, openBlock as c, createElementBlock as x, createVNode as h, unref as n, createBlock as O, withCtx as b, createTextVNode as L, toDisplayString as k, createCommentVNode as W, computed as $, createElementVNode as V, Fragment as P, renderList as Y, onMounted as tt, onBeforeUnmount as pt, normalizeStyle as Me, reactive as ht, resolveComponent as _t, normalizeClass as Oe, withDirectives as Dl, vShow as Il, inject as Ze, watchEffect as Ul, isRef as tl, nextTick as Pl, withKeys as zt, withModifiers as Mt, provide as ll, useModel as Rl, getCurrentInstance as jl, resolveDynamicComponent as Fl, mergeProps as Hl, mergeModels as ql } from "vue";
+import { useAdmin as lt, useTranslate as ce, useErrorText as nt, WxDate as Jl, WxScreenHead as Kl, WxRenameButton as Yl, WxHelpButton as Gl, adminKey as nl, WxRowMenu as Zl, WxListScreen as Ql } from "@webx-ui/module-admin";
 import { useRoute as Xl, useRouter as ol } from "vue-router";
 import { WxScreenRenderer as sl, coreTypes as it } from "@webx-ui/schema";
 import { autocompletion as en, pickedCompletion as Fe, snippetCompletion as ye, startCompletion as tn } from "@codemirror/autocomplete";
@@ -219,13 +219,16 @@ const on = { class: "wx-block-data" }, sn = /* @__PURE__ */ se({
     const t = e, o = l;
     De();
     const a = ce("webx-blocks"), i = I(u(t.modelValue)), s = I(null);
-    function u(r) {
-      return JSON.stringify(r ?? {}, null, 2);
+    function u(f) {
+      return f == null ? "" : JSON.stringify(f, null, 2);
     }
-    function d(r) {
-      i.value = r;
+    function d(f) {
+      return f.trim() === "" ? null : JSON.parse(f);
+    }
+    function r(f) {
+      i.value = f;
       try {
-        const p = JSON.parse(r);
+        const p = d(f);
         s.value = null, o("update:modelValue", p);
       } catch (p) {
         s.value = a("components.data-invalid", { error: p.message });
@@ -233,26 +236,26 @@ const on = { class: "wx-block-data" }, sn = /* @__PURE__ */ se({
     }
     return oe(
       () => t.modelValue,
-      (r) => {
+      (f) => {
         let p = !1;
         try {
-          p = JSON.stringify(JSON.parse(i.value)) === JSON.stringify(r ?? {});
+          p = JSON.stringify(d(i.value)) === JSON.stringify(f ?? null);
         } catch {
           p = !1;
         }
-        p || (i.value = u(r), s.value = null);
+        p || (i.value = u(f), s.value = null);
       },
       { deep: !0 }
-    ), (r, p) => (c(), x("div", on, [
+    ), (f, p) => (c(), x("div", on, [
       h(n(Ye), {
         "model-value": i.value,
         language: "json",
-        lint: "",
+        lint: i.value.trim() !== "",
         readonly: e.disabled,
         "min-height": "120px",
         "max-height": "320px",
-        "onUpdate:modelValue": d
-      }, null, 8, ["model-value", "readonly"]),
+        "onUpdate:modelValue": r
+      }, null, 8, ["model-value", "lint", "readonly"]),
       s.value ? (c(), O(n(H), {
         key: 0,
         size: "sm",
@@ -270,7 +273,7 @@ const on = { class: "wx-block-data" }, sn = /* @__PURE__ */ se({
   for (const [o, a] of l)
     t[o] = a;
   return t;
-}, an = /* @__PURE__ */ ae(sn, [["__scopeId", "data-v-13af1e93"]]);
+}, an = /* @__PURE__ */ ae(sn, [["__scopeId", "data-v-b994c835"]]);
 function Re(e) {
   const l = `${e.apiPath}/blocks`, t = (o) => o.data;
   return {
@@ -354,10 +357,10 @@ const rn = { class: "wx-block-checks" }, un = {
     async function r() {
       d.value = await i.versions(t.block.id);
     }
-    function p(m) {
+    function f(m) {
       return t.block.draft?.number === m.number ? "draft" : t.block.published?.number === m.number ? "live" : "replaced";
     }
-    async function f(m) {
+    async function p(m) {
       if (await ct({
         title: s("page.restore-title", { number: m.number }),
         message: s("page.restore-text"),
@@ -389,7 +392,7 @@ const rn = { class: "wx-block-checks" }, un = {
         V("div", fn, [
           h(n(H), null, {
             default: b(() => [
-              L(k(n(s)(`page.version-${p(S)}`)), 1)
+              L(k(n(s)(`page.version-${f(S)}`)), 1)
             ]),
             _: 2
           }, 1024),
@@ -398,7 +401,7 @@ const rn = { class: "wx-block-checks" }, un = {
             tone: "muted"
           }, {
             default: b(() => [
-              S.created_at ? (c(), O(n(ql), {
+              S.created_at ? (c(), O(n(Jl), {
                 key: 0,
                 value: S.created_at
               }, null, 8, ["value"])) : W("", !0),
@@ -410,7 +413,7 @@ const rn = { class: "wx-block-checks" }, un = {
             _: 2
           }, 1024)
         ]),
-        p(S) === "draft" ? (c(), O(n(he), {
+        f(S) === "draft" ? (c(), O(n(he), {
           key: 0,
           type: "warning",
           dot: ""
@@ -419,7 +422,7 @@ const rn = { class: "wx-block-checks" }, un = {
             L(k(n(s)("page.version-draft")), 1)
           ]),
           _: 1
-        })) : p(S) === "live" ? (c(), O(n(he), {
+        })) : f(S) === "live" ? (c(), O(n(he), {
           key: 1,
           type: "success",
           dot: ""
@@ -429,11 +432,11 @@ const rn = { class: "wx-block-checks" }, un = {
           ]),
           _: 1
         })) : W("", !0),
-        e.canManage && p(S) === "replaced" ? (c(), O(n(ue), {
+        e.canManage && f(S) === "replaced" ? (c(), O(n(ue), {
           key: 2,
           size: "sm",
           variant: "outline",
-          onClick: (B) => f(S)
+          onClick: (B) => p(S)
         }, {
           default: b(() => [
             L(k(n(s)("page.restore")), 1)
@@ -470,16 +473,16 @@ function il(e, l, t) {
   const s = o.end.nextSibling;
   let u = o.start;
   for (; u; ) {
-    const f = u.nextSibling, m = u === o.end;
+    const p = u.nextSibling, m = u === o.end;
     if (a.removeChild(u), m) break;
-    u = f;
+    u = p;
   }
   const d = i.content, r = Array.from(d.childNodes);
   a.insertBefore(d, s);
-  const p = e.defaultView?.webx;
-  if (p?.mount)
-    for (const f of r)
-      f.nodeType === 1 && p.mount(f);
+  const f = e.defaultView?.webx;
+  if (f?.mount)
+    for (const p of r)
+      p.nodeType === 1 && f.mount(p);
   return !0;
 }
 function $t(e, l) {
@@ -588,10 +591,10 @@ function yn(e, l) {
   if (o === null) return null;
   const a = (r) => r === null ? null : new URL(r, new URL(l, location.href)).href, i = [];
   for (const r of Array.from(t.head.children)) {
-    const p = r.tagName.toLowerCase(), f = (r.getAttribute("rel") ?? "").toLowerCase().split(/\s+/);
-    if (p === "style" && r.id !== yt)
+    const f = r.tagName.toLowerCase(), p = (r.getAttribute("rel") ?? "").toLowerCase().split(/\s+/);
+    if (f === "style" && r.id !== yt)
       i.push(r.outerHTML);
-    else if (p === "link" && (f.includes("stylesheet") || f.includes("preload") && r.getAttribute("as") === "font")) {
+    else if (f === "link" && (p.includes("stylesheet") || p.includes("preload") && r.getAttribute("as") === "font")) {
       const m = r.cloneNode(!1);
       m.setAttribute("href", a(r.getAttribute("href")) ?? ""), i.push(m.outerHTML);
     }
@@ -601,7 +604,7 @@ function yn(e, l) {
     const r = u.cloneNode(!1);
     r.innerHTML = s, s = r.outerHTML, u = u.parentElement;
   }
-  const d = (r) => Array.from(r.attributes).map((p) => ` ${p.name}="${wt(p.value)}"`).join("");
+  const d = (r) => Array.from(r.attributes).map((f) => ` ${f.name}="${wt(f.value)}"`).join("");
   return `<!doctype html><html${d(t.documentElement)}><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">${i.join("")}</head><body${d(t.body)}>${s}</body></html>`;
 }
 function wn(e, l) {
@@ -637,10 +640,10 @@ const _n = { class: "wx-block-stage" }, $n = { class: "wx-block-stage__bar" }, S
       const z = o.value.find((U) => u.value / U.value >= 0.45);
       a.value = (z ?? o.value[o.value.length - 1]).value;
     });
-    function p(z) {
+    function f(z) {
       r.value = !0, a.value = z;
     }
-    const f = $(() => u.value === 0 ? 1 : Math.min(1, u.value / a.value)), m = $(
+    const p = $(() => u.value === 0 ? 1 : Math.min(1, u.value / a.value)), m = $(
       () => l.stage ? void 0 : rl({
         html: l.html,
         styles: l.styles,
@@ -689,10 +692,10 @@ const _n = { class: "wx-block-stage" }, $n = { class: "wx-block-stage__bar" }, S
     const G = $(() => ({
       width: `${a.value}px`,
       height: `${d.value}px`,
-      transform: `scale(${f.value})`
+      transform: `scale(${p.value})`
     })), ie = $(() => ({
-      width: `${Math.round(a.value * f.value)}px`,
-      height: `${Math.round(d.value * f.value)}px`
+      width: `${Math.round(a.value * p.value)}px`,
+      height: `${Math.round(d.value * p.value)}px`
     }));
     return (z, U) => (c(), x("div", _n, [
       V("div", $n, [
@@ -701,7 +704,7 @@ const _n = { class: "wx-block-stage" }, $n = { class: "wx-block-stage__bar" }, S
           options: o.value,
           size: "sm",
           "aria-label": n(t)("page.width"),
-          "onUpdate:modelValue": U[0] || (U[0] = (Q) => p(Number(Q)))
+          "onUpdate:modelValue": U[0] || (U[0] = (Q) => f(Number(Q)))
         }, null, 8, ["model-value", "options", "aria-label"])
       ]),
       V("div", {
@@ -890,10 +893,10 @@ function Fn({
         options: Gn(e(), a.state.doc.toString()),
         validFor: /^\$\w*$/
       };
-    const p = /(\{\{|\{!!)(\s*)(\w*)$/.exec(i);
-    if (p) return Zn(a, p[1], p[2], p[3], e());
-    const f = Jn(i);
-    if (f !== null) return qn(a, f, t(), o);
+    const f = /(\{\{|\{!!)(\s*)(\w*)$/.exec(i);
+    if (f) return Zn(a, f[1], f[2], f[3], e());
+    const p = qn(i);
+    if (p !== null) return Jn(a, p, t(), o);
     const m = /<(x-[\w:-]*)$/.exec(i);
     if (m) {
       const B = a.state.sliceDoc(0, a.pos - m[0].length);
@@ -919,9 +922,9 @@ function Hn(e, l, t, o) {
       type: "type",
       boost: (a.kind === "component" ? 50 : 0) - i / 100,
       apply: (s, u, d, r) => {
-        const p = /^[\w-]*/.exec(s.state.sliceDoc(r, r + 64))[0], f = r + p.length, m = s.state.sliceDoc(f, f + 1) === l, y = `${a.slug}${m ? "" : l}`;
+        const f = /^[\w-]*/.exec(s.state.sliceDoc(r, r + 64))[0], p = r + f.length, m = s.state.sliceDoc(p, p + 1) === l, y = `${a.slug}${m ? "" : l}`;
         s.dispatch({
-          changes: { from: d, to: f, insert: y },
+          changes: { from: d, to: p, insert: y },
           // Past the closing quote: the attributes come next.
           selection: { anchor: d + y.length + (m ? 1 : 0) },
           annotations: Fe.of(u),
@@ -932,7 +935,7 @@ function Hn(e, l, t, o) {
     validFor: /^[\w-]*$/
   };
 }
-function Jn(e) {
+function qn(e) {
   const l = e.lastIndexOf("<x-webx-block");
   if (l === -1) return null;
   const t = e.slice(l + 13);
@@ -944,19 +947,19 @@ function Jn(e) {
   const i = /\btype\s*=\s*["']([\w-]+)["']/.exec(t);
   return { attributes: t, type: i?.[1] ?? null, bound: a[1] === ":", word: a[2] };
 }
-function qn(e, l, t, o) {
+function Jn(e, l, t, o) {
   const a = new Set([...l.attributes.matchAll(/:?([\w-]+)\s*=/g)].map((r) => r[1])), i = e.pos - l.word.length - (l.bound ? 1 : 0), s = () => {
     const r = [];
     if (a.has("type") || r.push(gt("type", !1, "reserved", null, 60)), !a.has("fallback") && l.type !== null) {
-      const p = t.find((f) => f.slug === l.type)?.fallback ?? null;
-      r.push(gt("fallback", !1, "reserved", p, -10, p));
+      const f = t.find((p) => p.slug === l.type)?.fallback ?? null;
+      r.push(gt("fallback", !1, "reserved", f, -10, f));
     }
     return r;
   }, u = (r) => {
-    const f = [...Ve(r ?? []).filter((m) => m.type !== "wx-slot" && m.type !== "wx-blocks").filter((m) => !a.has(m.id)).map(
+    const p = [...Ve(r ?? []).filter((m) => m.type !== "wx-slot" && m.type !== "wx-blocks").filter((m) => !a.has(m.id)).map(
       (m, y) => gt(m.id, m.type === "wx-data" || l.bound, m.type, m.label, 40 - y)
     ), ...s()];
-    return f.length === 0 || !e.explicit && l.word === "" && !l.bound ? null : { from: i, options: f, validFor: /^:?[\w-]*$/ };
+    return p.length === 0 || !e.explicit && l.word === "" && !l.bound ? null : { from: i, options: p, validFor: /^:?[\w-]*$/ };
   };
   if (l.type === null) return u(null);
   const d = o(l.type);
@@ -970,11 +973,11 @@ function gt(e, l, t, o, a, i = null) {
     info: o ?? void 0,
     type: "property",
     boost: a,
-    apply: (u, d, r, p) => {
-      const f = `${s}="${i ?? (l ? "$" : "")}"`;
+    apply: (u, d, r, f) => {
+      const p = `${s}="${i ?? (l ? "$" : "")}"`;
       u.dispatch({
-        changes: { from: r, to: p, insert: f },
-        selection: { anchor: r + f.length - 1 },
+        changes: { from: r, to: f, insert: p },
+        selection: { anchor: r + p.length - 1 },
         annotations: Fe.of(d),
         userEvent: "input.complete"
       });
@@ -990,19 +993,19 @@ function Kn(e, l, t, o) {
         type: "keyword"
       })
     ];
-    for (const r of Ve(u ?? []).filter((p) => p.type === "wx-slot"))
+    for (const r of Ve(u ?? []).filter((f) => f.type === "wx-slot"))
       d.push({
         label: `x-slot:${r.id}`,
         detail: "slot",
         info: r.label,
         type: "keyword",
         boost: 20,
-        apply: (p, f, m, y) => {
+        apply: (f, p, m, y) => {
           const S = `x-slot:${r.id}>`;
-          p.dispatch({
+          f.dispatch({
             changes: { from: m, to: y, insert: `${S}</x-slot:${r.id}>` },
             selection: { anchor: m + S.length },
-            annotations: Fe.of(f),
+            annotations: Fe.of(p),
             userEvent: "input.complete"
           });
         }
@@ -1048,13 +1051,13 @@ function Zn(e, l, t, o, a) {
       info: u.label,
       type: "variable",
       boost: 50 - d,
-      apply: (r, p, f, m) => {
+      apply: (r, f, p, m) => {
         const y = r.state.sliceDoc(m, m + 8), S = new RegExp(`^\\s*${uo(s)}`).exec(y), B = S ? /^\s/.test(y) ? "" : " " : ` ${s}`, E = `${t === "" ? " " : ""}$${u.id}${B}`;
         r.dispatch({
-          changes: { from: f, to: m, insert: E },
+          changes: { from: p, to: m, insert: E },
           // Past the closing braces: the echo is finished, the next thing is the markup.
-          selection: { anchor: f + E.length + (S ? S[0].length : 0) },
-          annotations: Fe.of(p),
+          selection: { anchor: p + E.length + (S ? S[0].length : 0) },
+          annotations: Fe.of(f),
           userEvent: "input.complete"
         });
       }
@@ -1084,8 +1087,8 @@ function Xn(e, l, t, o, a) {
       label: s,
       detail: u,
       type: "property",
-      apply: (d, r, p, f) => {
-        const m = t ? p - 1 : p, y = d.state.sliceDoc(f, f + 2), S = t || "'", B = f + (y.startsWith(S) ? 1 : 0), E = d.state.sliceDoc(B, B + 1) === "]", w = `${S}${s}${S}${E ? "" : "]"}`;
+      apply: (d, r, f, p) => {
+        const m = t ? f - 1 : f, y = d.state.sliceDoc(p, p + 2), S = t || "'", B = p + (y.startsWith(S) ? 1 : 0), E = d.state.sliceDoc(B, B + 1) === "]", w = `${S}${s}${S}${E ? "" : "]"}`;
         d.dispatch({
           changes: { from: m, to: B, insert: w },
           selection: { anchor: m + w.length + (E ? 1 : 0) },
@@ -1105,7 +1108,7 @@ function eo(e, l, t) {
   if (!u) return [];
   if (u.type === "wx-collection") {
     const d = typeof u.props?.source == "string" ? u.props.source : u.type, r = s === "items" ? jn[d] ?? [] : [];
-    return [...Rn[s ?? ""] ?? [], ...r].map((p) => [p, d]);
+    return [...Rn[s ?? ""] ?? [], ...r].map((f) => [f, d]);
   }
   return Un.includes(u.type) ? Dn.map((d) => [d, u.type]) : u.type === "wx-repeater" ? Ve(u.children ?? []).map((d) => [d.id, d.type]) : [];
 }
@@ -1163,16 +1166,16 @@ function no({ slug: e, template: l }) {
     if (!a) return null;
     const i = /[^{};]*$/.exec(o)[0];
     if (/^\s*[\w-]+\s*:\s/.test(i)) return null;
-    const s = `b-${e()}`, u = new Set(vl(t.state.doc.toString())), d = oo(l()), r = [s, ...d.filter((f) => f !== s)], p = r.map((f, m) => ({
-      label: `.${f}`,
+    const s = `b-${e()}`, u = new Set(vl(t.state.doc.toString())), d = oo(l()), r = [s, ...d.filter((p) => p !== s)], f = r.map((p, m) => ({
+      label: `.${p}`,
       // A class the template uses and nothing styles yet is the likeliest thing to write.
-      detail: u.has(f) ? "template" : "template · no rule yet",
+      detail: u.has(p) ? "template" : "template · no rule yet",
       type: "class",
-      boost: (u.has(f) ? 0 : 20) + (f === s ? 30 : 0) - m / 100
+      boost: (u.has(p) ? 0 : 20) + (p === s ? 30 : 0) - m / 100
     }));
-    for (const f of u)
-      r.includes(f) || p.push({ label: `.${f}`, detail: "styles", type: "class" });
-    return { from: t.pos - a[1].length - 1, options: p, validFor: /^\.[\w-]*$/ };
+    for (const p of u)
+      r.includes(p) || f.push({ label: `.${p}`, detail: "styles", type: "class" });
+    return { from: t.pos - a[1].length - 1, options: f, validFor: /^\.[\w-]*$/ };
   };
 }
 function vl(e) {
@@ -1219,12 +1222,12 @@ function ao({ types: e }) {
     const a = l.pos - o.length, i = t.string !== null;
     if (t.phase === "key") {
       const s = so.filter(({ key: u }) => !t.keys.has(u) || u === o).map(
-        ({ key: u, value: d, info: r }, p) => ({
+        ({ key: u, value: d, info: r }, f) => ({
           label: u,
           info: r,
           type: "property",
-          boost: -p,
-          apply: (f, m, y, S) => jt(f, m, y, S, i, `"${u}": ${d}`, d)
+          boost: -f,
+          apply: (p, m, y, S) => jt(p, m, y, S, i, `"${u}": ${d}`, d)
         })
       );
       return { from: a, options: s, validFor: /^[\w-]*$/ };
@@ -1236,7 +1239,7 @@ function ao({ types: e }) {
         type: "type",
         // Fields first: a block's schema is mostly fields, the layout only groups them.
         boost: d.kind === "field" ? 1 : 0,
-        apply: (r, p, f, m) => jt(r, p, f, m, i, `"${u}"`, "")
+        apply: (r, f, p, m) => jt(r, f, p, m, i, `"${u}"`, "")
       }));
       return { from: a, options: s, validFor: /^[\w-]*$/ };
     }
@@ -1244,10 +1247,10 @@ function ao({ types: e }) {
   };
 }
 function jt(e, l, t, o, a, i, s) {
-  const u = a ? t - 1 : t, d = /^[\w-]*"?/.exec(e.state.sliceDoc(o, o + 60))[0], r = o + (a ? d.length : /^[\w-]*/.exec(d)[0].length), p = s === '""' || s === "{}" || s === "[]" ? 1 : 0;
+  const u = a ? t - 1 : t, d = /^[\w-]*"?/.exec(e.state.sliceDoc(o, o + 60))[0], r = o + (a ? d.length : /^[\w-]*/.exec(d)[0].length), f = s === '""' || s === "{}" || s === "[]" ? 1 : 0;
   e.dispatch({
     changes: { from: u, to: r, insert: i },
-    selection: { anchor: u + i.length - p },
+    selection: { anchor: u + i.length - f },
     annotations: Fe.of(l),
     userEvent: "input.complete"
   }), i.startsWith('"type"') && tn(e);
@@ -1313,12 +1316,12 @@ function po(e, l, t) {
     code: "variables-missing",
     line: null,
     message: t("checks.variables-missing", {
-      variables: a.map((p) => `$${p}`).join(", ")
+      variables: a.map((f) => `$${f}`).join(", ")
     })
   });
   const i = [], s = [], u = `.b-${e}`;
-  for (const [p, f] of mo(l.styles))
-    p.startsWith(u) || p.startsWith("&") || (/^[a-z][a-z0-9-]*/i.test(p) ? s.push([p, f]) : i.push([p, f]));
+  for (const [f, p] of mo(l.styles))
+    f.startsWith(u) || f.startsWith("&") || (/^[a-z][a-z0-9-]*/i.test(f) ? s.push([f, p]) : i.push([f, p]));
   i.length > 0 && o.push({
     file: "styles",
     code: "stray-selectors",
@@ -1451,7 +1454,7 @@ const go = { class: "wx-block-editor" }, ko = { class: "wx-block-editor__split"
   setup(e) {
     const l = e, t = lt(), o = Re(t), a = Xl(), i = ol();
     De();
-    const s = ce("webx-blocks"), u = nt(), d = $(() => Number(a.params.id)), r = I(null), p = I([]), f = I(!0), m = I(!1), y = I(!1), S = I("template"), B = $(() => {
+    const s = ce("webx-blocks"), u = nt(), d = $(() => Number(a.params.id)), r = I(null), f = I([]), p = I(!0), m = I(!1), y = I(!1), S = I("template"), B = $(() => {
       const C = t.state.manifest?.modules.find((g) => g.id === "blocks")?.meta;
       return {
         groups: C?.groups ?? [],
@@ -1516,7 +1519,7 @@ const go = { class: "wx-block-editor" }, ko = { class: "wx-block-editor__split"
         () => null
       ), ve.set(C, F)), F;
     }
-    const q = {
+    const J = {
       template: [
         bt(
           Fn({
@@ -1571,16 +1574,16 @@ const go = { class: "wx-block-editor" }, ko = { class: "wx-block-editor__split"
       Object.assign(_, Se(g)), R.value = JSON.stringify(g.schema, null, 2), Z.value = null, G.value = Q.value;
     }
     async function M() {
-      f.value = !0;
+      p.value = !0;
       try {
-        T(await o.get(d.value)), p.value = await o.usage(d.value), Ce();
+        T(await o.get(d.value)), f.value = await o.usage(d.value), Ce();
       } catch (C) {
         K.danger(u(C));
       } finally {
-        f.value = !1;
+        p.value = !1;
       }
     }
-    function J(C) {
+    function q(C) {
       R.value = C;
       try {
         const g = JSON.parse(C);
@@ -1705,7 +1708,7 @@ const go = { class: "wx-block-editor" }, ko = { class: "wx-block-editor__split"
           title: z.value.entity.title ?? `#${z.value.entity.id}`
         }) : null
       } : null
-    ), st = $(() => S.value === "template" || S.value === "styles"), Je = $(() => [
+    ), st = $(() => S.value === "template" || S.value === "styles"), qe = $(() => [
       {
         title: s("page.example-handler"),
         code: `el.querySelector('.b-hero__button')?.addEventListener('click', (event) => {
@@ -1728,7 +1731,7 @@ setInterval(() => el.classList.toggle('is-second'), seconds * 1000)`
 
 new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
       }
-    ]), Ie = $(() => p.value.slice(0, 5)), ee = $(() => w.kind === "component"), ke = $(() => r.value?.used_by ?? []), We = $(() => {
+    ]), Ie = $(() => f.value.slice(0, 5)), ee = $(() => w.kind === "component"), ke = $(() => r.value?.used_by ?? []), We = $(() => {
       const C = r.value?.declared?.module;
       return C ? t.state.manifest?.modules.find((g) => g.id === C)?.title ?? C.charAt(0).toUpperCase() + C.slice(1) : null;
     }), Vt = $(
@@ -1794,7 +1797,7 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
     return (C, g) => {
       const F = _t("router-link");
       return c(), x("div", go, [
-        f.value || !r.value ? (c(), x(P, { key: 0 }, [
+        p.value || !r.value ? (c(), x(P, { key: 0 }, [
           h(n(Pe), {
             class: "wx-block-editor__ghost-head",
             title: "",
@@ -1908,13 +1911,13 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
                         _: 1
                       }))
                     ]))), 128)),
-                    p.value.length > Ie.value.length ? (c(), O(n(H), {
+                    f.value.length > Ie.value.length ? (c(), O(n(H), {
                       key: 1,
                       size: "sm",
                       tone: "muted"
                     }, {
                       default: b(() => [
-                        L(k(n(s)("page.usage-more", { count: p.value.length - Ie.value.length })), 1)
+                        L(k(n(s)("page.usage-more", { count: f.value.length - Ie.value.length })), 1)
                       ]),
                       _: 1
                     })) : W("", !0)
@@ -1954,7 +1957,7 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
                         modelValue: _.template,
                         "onUpdate:modelValue": g[1] || (g[1] = (N) => _.template = N),
                         language: "php",
-                        extensions: q.template,
+                        extensions: J.template,
                         readonly: !E.value,
                         "min-height": "340px",
                         "max-height": "70vh",
@@ -1975,7 +1978,7 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
                           type: "button",
                           class: "wx-block-editor__pill",
                           disabled: !E.value,
-                          onClick: (qe) => A(N),
+                          onClick: (Je) => A(N),
                           textContent: k(He(N))
                         }, null, 8, So))), 128))
                       ])) : W("", !0),
@@ -2031,14 +2034,14 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
                             _: 2
                           }, 1024),
                           N.fields.length ? (c(), x("dl", Eo, [
-                            (c(!0), x(P, null, Y(N.fields, (qe) => (c(), x(P, {
-                              key: qe.name
+                            (c(!0), x(P, null, Y(N.fields, (Je) => (c(), x(P, {
+                              key: Je.name
                             }, [
                               V("dt", null, [
-                                V("code", null, k(qe.name), 1),
-                                V("span", Vo, k(qe.type), 1)
+                                V("code", null, k(Je.name), 1),
+                                V("span", Vo, k(Je.type), 1)
                               ]),
-                              V("dd", null, k(qe.description), 1)
+                              V("dd", null, k(Je.description), 1)
                             ], 64))), 128))
                           ])) : W("", !0)
                         ]))), 128)),
@@ -2067,7 +2070,7 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
                         modelValue: _.styles,
                         "onUpdate:modelValue": g[2] || (g[2] = (N) => _.styles = N),
                         language: "css",
-                        extensions: q.styles,
+                        extensions: J.styles,
                         readonly: !E.value,
                         "min-height": "340px",
                         "max-height": "70vh"
@@ -2121,7 +2124,7 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
                       title: n(s)("page.examples")
                     }, {
                       default: b(() => [
-                        (c(!0), x(P, null, Y(Je.value, (N) => (c(), x("div", {
+                        (c(!0), x(P, null, Y(qe.value, (N) => (c(), x("div", {
                           key: N.title,
                           class: "wx-block-editor__example"
                         }, [
@@ -2154,12 +2157,12 @@ new Swiper(el.querySelector('.b-slider__viewport'), { loop: true })`
                         h(n(Ye), {
                           "model-value": R.value,
                           language: "json",
-                          extensions: q.schema,
+                          extensions: J.schema,
                           lint: "",
                           readonly: !E.value,
                           "min-height": "340px",
                           "max-height": "70vh",
-                          "onUpdate:modelValue": J
+                          "onUpdate:modelValue": q
                         }, null, 8, ["model-value", "extensions", "readonly"]),
                         V("div", zo, [
                           Z.value ? (c(), O(n(H), {
@@ -2535,10 +2538,10 @@ const Ro = ["srcdoc"], jo = {
       ]))
     ], 4));
   }
-}), _l = /* @__PURE__ */ ae(Fo, [["__scopeId", "data-v-5ca74656"]]), Ho = { class: "wx-block-picker" }, Jo = {
+}), _l = /* @__PURE__ */ ae(Fo, [["__scopeId", "data-v-5ca74656"]]), Ho = { class: "wx-block-picker" }, qo = {
   key: 0,
   class: "wx-block-picker__group-title"
-}, qo = { class: "wx-block-picker__cards" }, Ko = ["disabled", "title", "onClick"], Yo = { class: "wx-block-picker__body" }, Go = { class: "wx-block-picker__title" }, Zo = /* @__PURE__ */ se({
+}, Jo = { class: "wx-block-picker__cards" }, Ko = ["disabled", "title", "onClick"], Yo = { class: "wx-block-picker__body" }, Go = { class: "wx-block-picker__title" }, Zo = /* @__PURE__ */ se({
   __name: "BlockPicker",
   props: {
     catalog: {},
@@ -2570,7 +2573,7 @@ const Ro = ["srcdoc"], jo = {
       return m === "" ? d.value : d.value.filter(
         ({ type: y }) => y.title.toLowerCase().includes(m) || y.slug.includes(m) || (y.description ?? "").toLowerCase().includes(m)
       );
-    }), p = $(() => {
+    }), f = $(() => {
       const m = [...l.groups];
       for (const { type: B } of r.value)
         m.includes(B.group) || m.push(B.group);
@@ -2580,7 +2583,7 @@ const Ro = ["srcdoc"], jo = {
         options: r.value.filter((E) => E.type.group === B)
       })).filter((B) => B.options.length > 0);
       return r.value.length <= 5 || s.value.trim() !== "" || y.length < 2 ? [{ id: "", label: "", options: r.value }] : y;
-    }), f = $(() => {
+    }), p = $(() => {
       if (l.catalog.length === 0) return i("field.pick-none");
       if (d.value.length === 0 && l.parent) {
         const m = (l.allow ?? l.parent.allow ?? []).filter(
@@ -2622,7 +2625,7 @@ const Ro = ["srcdoc"], jo = {
             r.value.length === 0 ? (c(), O(n(Xt), {
               key: 1,
               icon: "grid",
-              title: f.value,
+              title: p.value,
               size: "sm"
             }, {
               default: b(() => [
@@ -2638,12 +2641,12 @@ const Ro = ["srcdoc"], jo = {
               ]),
               _: 1
             }, 8, ["title"])) : W("", !0),
-            (c(!0), x(P, null, Y(p.value, (B) => (c(), x("section", {
+            (c(!0), x(P, null, Y(f.value, (B) => (c(), x("section", {
               key: B.id,
               class: "wx-block-picker__group"
             }, [
-              B.label ? (c(), x("div", Jo, k(B.label), 1)) : W("", !0),
-              V("div", qo, [
+              B.label ? (c(), x("div", qo, k(B.label), 1)) : W("", !0),
+              V("div", Jo, [
                 (c(!0), x(P, null, Y(B.options, (E) => (c(), x("button", {
                   key: E.type.id,
                   type: "button",
@@ -2697,7 +2700,7 @@ const Ro = ["srcdoc"], jo = {
   },
   emits: ["select", "edit"],
   setup(e, { expose: l, emit: t }) {
-    const o = e, a = t, i = ce("webx-blocks"), s = I(null), u = I(null), d = I(null), r = dt(d), p = I(!1), f = I(!1), m = I(null), y = I(0), S = $(() => y.value > 0), B = $(() => [
+    const o = e, a = t, i = ce("webx-blocks"), s = I(null), u = I(null), d = I(null), r = dt(d), f = I(!1), p = I(!1), m = I(null), y = I(0), S = $(() => y.value > 0), B = $(() => [
       { value: 1280, icon: "monitor", ariaLabel: i("field.width-desktop") },
       { value: 834, icon: "tablet", ariaLabel: i("field.width-tablet") },
       { value: 390, icon: "smartphone", ariaLabel: i("field.width-phone") }
@@ -2731,8 +2734,8 @@ const Ro = ["srcdoc"], jo = {
       const v = G(), T = v?.body;
       if (!T || !v?.defaultView) return;
       U(v);
-      const M = v.defaultView.getComputedStyle(T), J = (parseFloat(M.marginTop) || 0) + (parseFloat(M.marginBottom) || 0), le = Math.ceil(T.scrollHeight + J);
-      le !== y.value && (y.value = le, re !== null && Pl(() => requestAnimationFrame(q)));
+      const M = v.defaultView.getComputedStyle(T), q = (parseFloat(M.marginTop) || 0) + (parseFloat(M.marginBottom) || 0), le = Math.ceil(T.scrollHeight + q);
+      le !== y.value && (y.value = le, re !== null && Pl(() => requestAnimationFrame(J)));
     }
     function X(v) {
       z?.disconnect();
@@ -2740,7 +2743,7 @@ const Ro = ["srcdoc"], jo = {
       !T || !v.body || (z = new T.ResizeObserver(Q), z.observe(v.body), Q());
     }
     function xe() {
-      f.value = !0;
+      p.value = !0;
       const v = G();
       v && (X(v), ie?.release(), ie = vn(v, {
         /* No guard against answering a click with a scroll: `bring` moves nothing that is already
@@ -2753,7 +2756,7 @@ const Ro = ["srcdoc"], jo = {
     function ve(v) {
       v !== null && (re = v, te !== null && clearTimeout(te), te = window.setTimeout(() => {
         re = null, te = null;
-      }, 400), q());
+      }, 400), J());
     }
     function Ce(v) {
       const T = s.value?.getBoundingClientRect();
@@ -2771,43 +2774,43 @@ const Ro = ["srcdoc"], jo = {
       }
       return null;
     }
-    function q() {
+    function J() {
       const v = G();
       if (re === null || !v) return;
       U(v);
       const T = $t(v, re), M = T ? Ce(T) : null;
       if (!M) return;
-      const J = Be(), le = J?.getBoundingClientRect(), be = u.value?.getBoundingClientRect().height ?? 0, ge = {
+      const q = Be(), le = q?.getBoundingClientRect(), be = u.value?.getBoundingClientRect().height ?? 0, ge = {
         top: (le?.top ?? 0) + be,
         bottom: (le ? le.bottom : window.innerHeight) - be
       }, Ee = M.top + M.height, Le = M.top < ge.top, He = M.height > ge.bottom - ge.top, A = Le || He ? M.top - ge.top : Ee > ge.bottom ? Ee - ge.bottom : 0;
-      A !== 0 && (J ?? window).scrollBy({ top: A, behavior: "smooth" });
+      A !== 0 && (q ?? window).scrollBy({ top: A, behavior: "smooth" });
     }
     function Te(v, T) {
       const M = G();
-      if (!M || !f.value) return !1;
-      const J = il(M, v, T);
-      return J && vt(M, o.selected ?? null), J;
+      if (!M || !p.value) return !1;
+      const q = il(M, v, T);
+      return q && vt(M, o.selected ?? null), q;
     }
     function _e() {
-      f.value = !1, z?.disconnect(), z = null, s.value && o.url && (s.value.src = o.url);
+      p.value = !1, z?.disconnect(), z = null, s.value && o.url && (s.value.src = o.url);
     }
     function $e(v) {
-      v.key === "Escape" && p.value && (p.value = !1, v.stopPropagation());
+      v.key === "Escape" && f.value && (f.value = !1, v.stopPropagation());
     }
     return oe(
       () => o.selected,
       (v) => {
         const T = G();
-        !T || !f.value || (vt(T, v ?? null), ve(v ?? null));
+        !T || !p.value || (vt(T, v ?? null), ve(v ?? null));
       }
     ), oe(() => o.reload, _e), oe(
       () => o.url,
-      () => f.value = !1
+      () => p.value = !1
     ), tt(() => window.addEventListener("keydown", $e)), pt(() => {
       window.removeEventListener("keydown", $e), te !== null && clearTimeout(te), z?.disconnect(), ie?.release();
-    }), l({ replace: Te, refresh: _e, open: () => p.value = !0 }), (v, T) => (c(), x("div", {
-      class: Oe(["wx-blocks-preview", { "is-fullscreen": p.value, "is-grown": S.value, "is-compact": e.compact }]),
+    }), l({ replace: Te, refresh: _e, open: () => f.value = !0 }), (v, T) => (c(), x("div", {
+      class: Oe(["wx-blocks-preview", { "is-fullscreen": f.value, "is-grown": S.value, "is-compact": e.compact }]),
       style: Me({ "--wx-preview-scale": w.value })
     }, [
       V("div", {
@@ -2855,10 +2858,10 @@ const Ro = ["srcdoc"], jo = {
           }, null, 8, ["title", "href"])) : W("", !0),
           h(n(Ge), {
             size: "sm",
-            icon: p.value ? "minimize" : "maximize",
+            icon: f.value ? "minimize" : "maximize",
             tone: "neutral",
-            title: p.value ? n(i)("field.close") : n(i)("field.fullscreen"),
-            onClick: T[2] || (T[2] = (M) => p.value = !p.value)
+            title: f.value ? n(i)("field.close") : n(i)("field.fullscreen"),
+            onClick: T[2] || (T[2] = (M) => f.value = !f.value)
           }, null, 8, ["icon", "title"])
         ])
       ], 512),
@@ -2902,44 +2905,44 @@ const Ro = ["srcdoc"], jo = {
   emits: ["select", "add", "remove", "duplicate", "visibility", "reorder"],
   setup(e, { emit: l }) {
     const t = e, o = l, a = ce("webx-blocks");
-    function i(p) {
-      return t.catalog.find((f) => f.slug === p.type) ?? null;
+    function i(f) {
+      return t.catalog.find((p) => p.slug === f.type) ?? null;
     }
-    function s(p) {
-      return i(p)?.title ?? p.type;
+    function s(f) {
+      return i(f)?.title ?? f.type;
     }
-    function u(p) {
-      const f = i(p);
-      return f?.content ? pl(f.content.schema) : [];
+    function u(f) {
+      const p = i(f);
+      return p?.content ? pl(p.content.schema) : [];
     }
-    function d(p, f) {
-      const m = p.values[f.id];
+    function d(f, p) {
+      const m = f.values[p.id];
       return Array.isArray(m) ? m : [];
     }
-    function r(p) {
+    function r(f) {
       return [
         {
           key: "visibility",
-          icon: p.hidden === !0 ? "eye" : "eye-off",
-          label: p.hidden === !0 ? a("field.show") : a("field.hide"),
-          run: () => o("visibility", p.key, p.hidden !== !0)
+          icon: f.hidden === !0 ? "eye" : "eye-off",
+          label: f.hidden === !0 ? a("field.show") : a("field.hide"),
+          run: () => o("visibility", f.key, f.hidden !== !0)
         },
         {
           key: "duplicate",
           icon: "copy",
           label: a("field.duplicate"),
-          run: () => o("duplicate", p.key)
+          run: () => o("duplicate", f.key)
         },
         {
           key: "remove",
           icon: "trash",
           label: a("field.remove"),
           danger: !0,
-          run: () => o("remove", p.key)
+          run: () => o("remove", f.key)
         }
       ];
     }
-    return (p, f) => {
+    return (f, p) => {
       const m = _t("blocks-tree", !0);
       return c(), O(n(Nl), {
         "model-value": e.nodes,
@@ -2950,7 +2953,7 @@ const Ro = ["srcdoc"], jo = {
         size: "sm",
         "empty-text": e.depth === 0 ? n(a)("field.empty") : "",
         class: Oe(["wx-blocks-tree", { "is-nested": e.depth > 0 }]),
-        "onUpdate:modelValue": f[6] || (f[6] = (y) => o("reorder", e.parentKey, e.field, y))
+        "onUpdate:modelValue": p[6] || (p[6] = (y) => o("reorder", e.parentKey, e.field, y))
       }, {
         default: b(({ item: y }) => [
           V("div", ns, [
@@ -3010,12 +3013,12 @@ const Ro = ["srcdoc"], jo = {
                 selected: e.selected,
                 disabled: e.disabled,
                 depth: e.depth + 1,
-                onSelect: f[0] || (f[0] = (B) => o("select", B)),
-                onAdd: f[1] || (f[1] = (B, E, w) => o("add", B, E, w)),
-                onRemove: f[2] || (f[2] = (B) => o("remove", B)),
-                onDuplicate: f[3] || (f[3] = (B) => o("duplicate", B)),
-                onVisibility: f[4] || (f[4] = (B, E) => o("visibility", B, E)),
-                onReorder: f[5] || (f[5] = (B, E, w) => o("reorder", B, E, w))
+                onSelect: p[0] || (p[0] = (B) => o("select", B)),
+                onAdd: p[1] || (p[1] = (B, E, w) => o("add", B, E, w)),
+                onRemove: p[2] || (p[2] = (B) => o("remove", B)),
+                onDuplicate: p[3] || (p[3] = (B) => o("duplicate", B)),
+                onVisibility: p[4] || (p[4] = (B, E) => o("visibility", B, E)),
+                onReorder: p[5] || (p[5] = (B, E, w) => o("reorder", B, E, w))
               }, null, 8, ["nodes", "catalog", "parent-key", "field", "selected", "disabled", "depth"]),
               e.disabled ? W("", !0) : (c(), x("button", {
                 key: 0,
@@ -3042,7 +3045,7 @@ function ma(e) {
 function ha() {
   return Ze(Et, null);
 }
-const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
+const qt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
   key: 0,
   class: "wx-blocks-nested"
 }, hs = {
@@ -3061,7 +3064,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
   name: "WxBlocks",
   inheritAttrs: !1,
   __name: "BlocksField",
-  props: /* @__PURE__ */ Jl({
+  props: /* @__PURE__ */ ql({
     node: { default: void 0 },
     context: { default: void 0 },
     name: { default: void 0 },
@@ -3077,11 +3080,11 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const l = e, t = Rl(e, "modelValue"), o = Ze(Jt, !1);
-    ll(Jt, !0), De();
+    const l = e, t = Rl(e, "modelValue"), o = Ze(qt, !1);
+    ll(qt, !0), De();
     const a = ce("webx-blocks"), i = nt(), s = Ze(nl, null);
     let u = null;
-    const d = I([]), r = $(() => l.catalog ?? d.value), p = $(() => Array.isArray(t.value) ? t.value : []), f = I(null), m = $(() => f.value ? me(p.value, f.value) : null), y = $(
+    const d = I([]), r = $(() => l.catalog ?? d.value), f = $(() => Array.isArray(t.value) ? t.value : []), p = I(null), m = $(() => p.value ? me(f.value, p.value) : null), y = $(
       () => m.value ? r.value.find((A) => A.slug === m.value?.node.type) ?? null : null
     );
     function S(A) {
@@ -3089,9 +3092,9 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
     }
     const B = $(() => {
       const A = [];
-      return ot(p.value, (D) => A.push(D.key)), A;
+      return ot(f.value, (D) => A.push(D.key)), A;
     }), E = $(() => {
-      const A = f.value ? B.value.indexOf(f.value) : -1;
+      const A = p.value ? B.value.indexOf(p.value) : -1;
       return {
         previous: A > 0 ? B.value[A - 1] : null,
         next: A >= 0 && A < B.value.length - 1 ? B.value[A + 1] : null
@@ -3100,7 +3103,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       const A = [];
       let D = m.value?.parent ?? null;
       for (; D; )
-        A.unshift({ key: D.key, title: S(D) }), D = me(p.value, D.key)?.parent ?? null;
+        A.unshift({ key: D.key, title: S(D) }), D = me(f.value, D.key)?.parent ?? null;
       return A;
     }), _ = Ze(Et, null), R = I(null), Z = I(null), G = dt(Z), ie = $(() => _ !== null && _.url.value !== null), z = $(() => ie.value && G.value > 0 && G.value <= 900), U = I(!1), Q = $(() => {
       if (!m.value) return;
@@ -3133,23 +3136,23 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
     ), re = jl()?.type, te = $(() => l.context?.types ? l.context.types : s?.types ? { ...it, ...s.types } : re ? { ...it, "wx-blocks": { component: re, kind: "field", nested: !0 } } : it), ve = $(
       () => l.context?.translate ?? s?.i18n.t ?? ((A) => A)
     ), Ce = $(() => l.context?.can ?? s?.can ?? (() => !0)), Be = el(Qo);
-    function q(A) {
+    function J(A) {
       t.value = A;
     }
     async function Te(A, D, j) {
-      const de = A ? me(p.value, A) : null, pe = de ? r.value.find((We) => We.slug === de.node.type) ?? null : null, st = A === null ? l.allow : j?.props?.allow ?? null, Je = A === null ? l.max : j?.props?.max ?? null, Ie = A === null ? p.value : de && D ? de.node.values[D] ?? [] : [];
-      if (Je != null && Ie.length >= Je) return;
+      const de = A ? me(f.value, A) : null, pe = de ? r.value.find((We) => We.slug === de.node.type) ?? null : null, st = A === null ? l.allow : j?.props?.allow ?? null, qe = A === null ? l.max : j?.props?.max ?? null, Ie = A === null ? f.value : de && D ? de.node.values[D] ?? [] : [];
+      if (qe != null && Ie.length >= qe) return;
       const ee = await Be({
         catalog: r.value,
         parent: pe,
         allow: st,
-        tree: p.value,
+        tree: f.value,
         groups: xe.value,
         blocksPath: l.blocksPath
       });
       if (!ee) return;
       const ke = En(ee.slug, _e(ee));
-      q(Rt(p.value, A, D, Ie.length, ke)), f.value = ke.key;
+      J(Rt(f.value, A, D, Ie.length, ke)), p.value = ke.key;
     }
     function _e(A) {
       const D = A.content?.sample ?? {}, j = {};
@@ -3158,7 +3161,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       return j;
     }
     async function $e(A) {
-      const D = me(p.value, A);
+      const D = me(f.value, A);
       if (!D) return;
       const j = An(D.node);
       await ct({
@@ -3169,38 +3172,38 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
         confirmText: a("field.remove"),
         cancelText: a("page.cancel"),
         tone: "danger"
-      }) && (f.value === A && (f.value = null), q(Wn(p.value, A)));
+      }) && (p.value === A && (p.value = null), J(Wn(f.value, A)));
     }
     function v(A) {
-      const D = me(p.value, A);
+      const D = me(f.value, A);
       if (!D) return;
       const j = fl(D.node);
-      q(Rt(p.value, D.parent?.key ?? null, D.field, D.index + 1, j)), f.value = j.key;
+      J(Rt(f.value, D.parent?.key ?? null, D.field, D.index + 1, j)), p.value = j.key;
     }
     function T(A, D) {
-      q(Bn(p.value, A, D));
+      J(Bn(f.value, A, D));
     }
     function M(A, D, j) {
-      q(zn(p.value, A, D, j));
+      J(zn(f.value, A, D, j));
     }
-    function J(A) {
-      f.value = f.value === A ? null : A;
+    function q(A) {
+      p.value = p.value === A ? null : A;
     }
     function le(A) {
-      A === null || !me(p.value, A) || (f.value = A, z.value && (U.value = !0));
+      A === null || !me(f.value, A) || (p.value = A, z.value && (U.value = !0));
     }
     function be() {
-      f.value = null;
+      p.value = null;
     }
     function ge(A) {
-      f.value && q(Nn(p.value, f.value, A));
+      p.value && J(Nn(f.value, p.value, A));
     }
     let Ee;
     oe(
       () => m.value?.node.values,
       (A, D) => {
         if (!A || !D || !y.value || !u || !_) return;
-        const j = f.value, de = y.value.id;
+        const j = p.value, de = y.value.id;
         clearTimeout(Ee), Ee = setTimeout(() => {
           !j || !u || u.render(de, { values: A, key: j }).then((pe) => {
             R.value?.replace(j, pe.html) || R.value?.refresh();
@@ -3211,7 +3214,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       { deep: !0 }
     );
     function Le(A) {
-      A.key === "Escape" && f.value && be();
+      A.key === "Escape" && p.value && be();
     }
     tt(async () => {
       if (window.addEventListener("keydown", Le), l.catalog === null && s) {
@@ -3260,18 +3263,18 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
                   tone: "muted"
                 }, {
                   default: b(() => [
-                    L(k(p.value.length), 1)
+                    L(k(f.value.length), 1)
                   ]),
                   _: 1
                 })
               ]),
               V("div", gs, [
                 h(fs, {
-                  nodes: p.value,
+                  nodes: f.value,
                   catalog: r.value,
-                  selected: f.value,
+                  selected: p.value,
                   disabled: e.disabled,
-                  onSelect: J,
+                  onSelect: q,
                   onAdd: Te,
                   onRemove: $e,
                   onDuplicate: v,
@@ -3280,7 +3283,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
                 }, null, 8, ["nodes", "catalog", "selected", "disabled"])
               ]),
               V("div", ks, [
-                !e.disabled && (e.max === null || p.value.length < e.max) ? (c(), O(n(ue), {
+                !e.disabled && (e.max === null || f.value.length < e.max) ? (c(), O(n(ue), {
                   key: 0,
                   variant: "outline",
                   icon: "plus",
@@ -3316,7 +3319,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
                       V("button", {
                         type: "button",
                         class: "wx-blocks__trail-step",
-                        onClick: (de) => J(j.key)
+                        onClick: (de) => q(j.key)
                       }, k(j.title), 9, $s),
                       h(n(we), { name: "chevron-right" })
                     ], 64))), 128))
@@ -3331,7 +3334,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
                     icon: "chevron-up",
                     title: n(a)("field.previous"),
                     disabled: E.value.previous === null,
-                    onClick: D[2] || (D[2] = (j) => E.value.previous && J(E.value.previous))
+                    onClick: D[2] || (D[2] = (j) => E.value.previous && q(E.value.previous))
                   }, null, 8, ["title", "disabled"]),
                   h(n(Ge), {
                     size: "sm",
@@ -3339,7 +3342,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
                     icon: "chevron-down",
                     title: n(a)("field.next"),
                     disabled: E.value.next === null,
-                    onClick: D[3] || (D[3] = (j) => E.value.next && J(E.value.next))
+                    onClick: D[3] || (D[3] = (j) => E.value.next && q(E.value.next))
                   }, null, 8, ["title", "disabled"]),
                   !z.value && n(_) && n(_).url.value ? (c(), O(n(ue), {
                     key: 1,
@@ -3392,7 +3395,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
             ref_key: "previewEl",
             ref: R,
             url: n(_).url.value,
-            selected: f.value,
+            selected: p.value,
             reload: n(_).reload?.value ?? 0,
             compact: z.value,
             onSelect: le,
@@ -3484,7 +3487,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       ])
     ]));
   }
-}), qt = /* @__PURE__ */ ae(zs, [["__scopeId", "data-v-ed94ea94"]]), Ms = { class: "wx-block-create" }, Os = { class: "wx-block-create__kind" }, Ds = { class: "wx-block-create__kind-help" }, Is = { class: "wx-block-create__kind" }, Us = { class: "wx-block-create__kind-help" }, Ps = /* @__PURE__ */ se({
+}), Jt = /* @__PURE__ */ ae(zs, [["__scopeId", "data-v-ed94ea94"]]), Ms = { class: "wx-block-create" }, Os = { class: "wx-block-create__kind" }, Ds = { class: "wx-block-create__kind-help" }, Is = { class: "wx-block-create__kind" }, Us = { class: "wx-block-create__kind-help" }, Ps = /* @__PURE__ */ se({
   __name: "BlockCreateDialog",
   setup(e) {
     const { resolve: l, dismiss: t, open: o } = Zt(), a = lt(), i = Re(a);
@@ -3494,7 +3497,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       title: "",
       slug: "",
       group: d.value[0] ?? "content"
-    }), p = I({}), f = I(!1), m = I(!1), y = $(
+    }), f = I({}), p = I(!1), m = I(!1), y = $(
       () => d.value.map((w) => ({ value: w, label: je(w, s) }))
     );
     function S(w) {
@@ -3507,18 +3510,18 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       }
     );
     function B(w) {
-      return p.value[w]?.[0];
+      return f.value[w]?.[0];
     }
     async function E() {
-      f.value = !0, p.value = {};
+      p.value = !0, f.value = {};
       try {
         const { group: w, ..._ } = r.value;
         l(await i.create(r.value.kind === "component" ? _ : { ..._, group: w }));
       } catch (w) {
         const _ = w.body;
-        _?.errors ? p.value = _.errors : K.danger(u(w, s("page.failed")));
+        _?.errors ? f.value = _.errors : K.danger(u(w, s("page.failed")));
       } finally {
-        f.value = !1;
+        p.value = !1;
       }
     }
     return (w, _) => (c(), O(n(Qt), {
@@ -3541,7 +3544,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
             }),
             h(n(ue), {
               type: "primary",
-              loading: f.value,
+              loading: p.value,
               onClick: E
             }, {
               default: b(() => [
@@ -3637,7 +3640,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
 }), Rs = /* @__PURE__ */ ae(Ps, [["__scopeId", "data-v-585106f0"]]), js = { class: "wx-block-declared" }, Fs = {
   class: "wx-block-declared__mark",
   "aria-hidden": "true"
-}, Hs = { class: "wx-block-declared__body" }, Js = { class: "wx-block-declared__title" }, qs = {
+}, Hs = { class: "wx-block-declared__body" }, qs = { class: "wx-block-declared__title" }, Js = {
   key: 1,
   class: "wx-block-declared__actions"
 }, Ks = /* @__PURE__ */ se({
@@ -3658,7 +3661,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
         h(n(we), { name: "sliders" })
       ]),
       V("div", Hs, [
-        V("div", Js, k(e.declared.title), 1),
+        V("div", qs, k(e.declared.title), 1),
         h(n(H), {
           size: "sm",
           tone: "muted"
@@ -3689,7 +3692,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
           ]),
           _: 1
         }),
-        e.canManage ? (c(), x("div", qs, [
+        e.canManage ? (c(), x("div", Js, [
           h(n(ue), {
             size: "sm",
             loading: e.busy,
@@ -3724,7 +3727,7 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
   setup(e) {
     const l = e, t = lt(), o = Re(t), a = ol();
     De();
-    const i = ce("webx-blocks"), s = nt(), u = I([]), d = I([]), r = I(!0), p = I(""), f = I(""), m = I(null), y = el(Rs), S = $(() => {
+    const i = ce("webx-blocks"), s = nt(), u = I([]), d = I([]), r = I(!0), f = I(""), p = I(""), m = I(null), y = el(Rs), S = $(() => {
       const v = t.state.manifest?.modules.find((T) => T.id === "blocks")?.meta;
       return {
         groups: v?.groups ?? [],
@@ -3742,13 +3745,13 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       return T ? G(T.module) : null;
     }
     function z(v) {
-      const T = p.value.trim().toLowerCase();
+      const T = f.value.trim().toLowerCase();
       return T === "" || v.some((M) => (M ?? "").toLowerCase().includes(T));
     }
-    const U = $(() => f.value === Ke ? [] : (f.value === "" ? w.value : w.value.filter((T) => T.group === f.value)).filter((T) => z([T.title, T.slug, T.description]))), Q = $(
-      () => f.value === "" || f.value === Ke ? _.value.filter((v) => z([v.title, v.slug, v.description])) : []
+    const U = $(() => p.value === Ke ? [] : (p.value === "" ? w.value : w.value.filter((T) => T.group === p.value)).filter((T) => z([T.title, T.slug, T.description]))), Q = $(
+      () => p.value === "" || p.value === Ke ? _.value.filter((v) => z([v.title, v.slug, v.description])) : []
     ), X = $(
-      () => f.value === "" || f.value === Ke ? R.value.filter((v) => z([v.title, v.slug, v.description])) : []
+      () => p.value === "" || p.value === Ke ? R.value.filter((v) => z([v.title, v.slug, v.description])) : []
     ), xe = $(() => {
       const v = [...S.value.groups];
       for (const T of w.value)
@@ -3758,14 +3761,14 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       const v = xe.value.map((M) => ({ value: M, label: je(M, i) })), T = Z.value ? [{ value: Ke, label: i("components.components") }] : [];
       return v.length + T.length < 2 ? [] : [{ value: "", label: i("page.all-groups") }, ...v, ...T];
     }), te = $(() => {
-      const v = xe.value.map((J) => ({
-        id: J,
-        label: je(J, i),
-        blocks: U.value.filter((le) => le.group === J)
-      })).filter((J) => J.blocks.length > 0);
-      return f.value !== "" || U.value.length <= 5 || p.value.trim() !== "" || v.length < 2 ? U.value.length === 0 ? [] : [{ id: "", label: f.value === "" && Q.value.length + X.value.length > 0 ? i("components.blocks") : "", blocks: U.value }] : v;
+      const v = xe.value.map((q) => ({
+        id: q,
+        label: je(q, i),
+        blocks: U.value.filter((le) => le.group === q)
+      })).filter((q) => q.blocks.length > 0);
+      return p.value !== "" || U.value.length <= 5 || f.value.trim() !== "" || v.length < 2 ? U.value.length === 0 ? [] : [{ id: "", label: p.value === "" && Q.value.length + X.value.length > 0 ? i("components.blocks") : "", blocks: U.value }] : v;
     }), ve = $(
-      () => f.value === Ke || U.value.length === 0 ? "" : i("components.components")
+      () => p.value === Ke || U.value.length === 0 ? "" : i("components.components")
     ), Ce = $(() => u.value.length === 0 && R.value.length === 0);
     async function Be() {
       r.value = !0;
@@ -3778,22 +3781,22 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
         r.value = !1;
       }
     }
-    function q(v) {
+    function J(v) {
       a.push(`${l.base}/${v.id}`);
     }
     async function Te() {
       const v = await y({});
-      v && q(v);
+      v && J(v);
     }
     async function _e(v) {
       m.value = v.slug;
       try {
         const T = await o.customise(v.slug);
-        K.success(i("components.customised")), q(T);
+        K.success(i("components.customised")), J(T);
       } catch (T) {
         const M = T.body;
         if (T.status === 409 && typeof M?.id == "number") {
-          q({ id: M.id });
+          J({ id: M.id });
           return;
         }
         K.danger(s(T, i("components.customise-failed")));
@@ -3808,8 +3811,8 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
       } }] : []
     );
     return (v, T) => (c(), O(n(Ql), {
-      view: f.value,
-      "onUpdate:view": T[1] || (T[1] = (M) => f.value = M),
+      view: p.value,
+      "onUpdate:view": T[1] || (T[1] = (M) => p.value = M),
       class: "wx-blocks-page",
       title: E.value,
       views: re.value,
@@ -3824,8 +3827,8 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
         }, null, 8, ["description"])),
         r.value || !Ce.value ? (c(), x("div", Gs, [
           h(n(et), {
-            modelValue: p.value,
-            "onUpdate:modelValue": T[0] || (T[0] = (M) => p.value = M),
+            modelValue: f.value,
+            "onUpdate:modelValue": T[0] || (T[0] = (M) => f.value = M),
             class: "wx-blocks-page__search",
             placeholder: n(i)("page.search"),
             clearable: ""
@@ -3874,21 +3877,21 @@ const Jt = /* @__PURE__ */ Symbol("wx-blocks-root"), ms = {
           }, [
             M.label ? (c(), x("div", Xs, k(M.label), 1)) : W("", !0),
             V("div", ea, [
-              (c(!0), x(P, null, Y(M.blocks, (J) => (c(), O(qt, {
-                key: J.id,
-                block: J,
-                onOpen: q
+              (c(!0), x(P, null, Y(M.blocks, (q) => (c(), O(Jt, {
+                key: q.id,
+                block: q,
+                onOpen: J
               }, null, 8, ["block"]))), 128))
             ])
           ]))), 128)),
           Q.value.length > 0 || X.value.length > 0 ? (c(), x("section", ta, [
             ve.value ? (c(), x("div", la, k(ve.value), 1)) : W("", !0),
             V("div", na, [
-              (c(!0), x(P, null, Y(Q.value, (M) => (c(), O(qt, {
+              (c(!0), x(P, null, Y(Q.value, (M) => (c(), O(Jt, {
                 key: M.id,
                 block: M,
                 module: ie(M.slug),
-                onOpen: q
+                onOpen: J
               }, null, 8, ["block", "module"]))), 128)),
               (c(!0), x(P, null, Y(X.value, (M) => (c(), O(Ys, {
                 key: M.slug,