@cratis/event-models 0.225.1 → 0.226.0

package/dist/screen-editor/index.js

@@ -1,12 +1,12 @@
 import { c as Ja, d as Qa, f as ze, l as tr, m as oo, p as Ya, s as Xa, t as nr, u as Xt } from "./defaultStructuredEditorStrings-Ch1I0Lci.js";
 import { t as or } from "./QueryBindingEditor-MTd0R7iQ.js";
 import { i as Za, n as es, r as ts, t as ns } from "./toTemplateSources-Chd2UNJQ.js";
-import { _ as os, a as hv, c as Ho, d as ir, f as is, g as fv, h as rs, i as as, l as gv, m as ss, n as vv, o as ln, p as rr, r as ls, s as bv, t as yv, u as wv, v as kv, y as Sv } from "./structuredValue-vqCZttsk.js";
+import { _ as os, a as fv, c as Ho, d as ir, f as is, g as gv, h as rs, i as as, l as vv, m as ss, n as bv, o as ln, p as rr, r as ls, s as yv, t as wv, u as kv, v as Sv, y as Cv } from "./structuredValue-vqCZttsk.js";
 import { a as we, n as cs, r as ds } from "./iconDiagnostics-Ds4CnqD0.js";
-import { t as Tv } from "./StructuredValueEditor-DUSATTWd.js";
+import { t as Iv } from "./StructuredValueEditor-DUSATTWd.js";
 import { createContext as us, createElement as wt, useCallback as z, useContext as ps, useEffect as ce, useId as ms, useLayoutEffect as Se, useMemo as U, useRef as V, useState as j } from "react";
 import { Fragment as le, jsx as a, jsxs as b } from "react/jsx-runtime";
-import { BindingMode as Ov, BindingNullBehavior as Dv, BindingSourceKind as Rv, BindingSourceKind as xt, CollectionOperation as ke, ColorScheme as hs, ComponentCategory as fs, DestinationKind as Fv, DestinationKind as ar, DiagnosticCode as gs, EditTarget as vs, EditingScopeKind as Vt, FlowContainerKind as cn, FormGenerationMode as ge, FormWidthUnit as Ce, GridUnitType as bs, HorizontalAlignment as io, InteractionActionKind as lt, InteractionTriggerKind as sr, NavigationRegionKind as Go, NavigationRegionMode as De, Orientation as ct, PackageKind as dt, PropertyEditorKind as X, PropertyValueType as K, ProvenanceKind as qo, QueryOriginKind as ys, QueryResultShape as ws, SceneEditKind as Y, SceneNodeKind as ks, TemplateReferenceSource as Ss, TemplateScope as Cs, ValueSource as lr, VerticalAlignment as ro, Visibility as ao, componentCategories as Ns } from "@cratis/scene.model";
+import { BindingMode as Dv, BindingNullBehavior as Rv, BindingSourceKind as Fv, BindingSourceKind as xt, CollectionOperation as ke, ColorScheme as hs, ComponentCategory as fs, DestinationKind as Ev, DestinationKind as ar, DiagnosticCode as gs, EditTarget as vs, EditingScopeKind as Vt, FlowContainerKind as cn, FormGenerationMode as ge, FormWidthUnit as Ce, GridUnitType as bs, HorizontalAlignment as io, InteractionActionKind as lt, InteractionTriggerKind as sr, NavigationRegionKind as Go, NavigationRegionMode as De, Orientation as ct, PackageKind as dt, PropertyEditorKind as X, PropertyValueType as K, ProvenanceKind as qo, QueryOriginKind as ys, QueryResultShape as ws, SceneEditKind as Y, SceneNodeKind as ks, TemplateReferenceSource as Ss, TemplateScope as Cs, ValueSource as lr, VerticalAlignment as ro, Visibility as ao, componentCategories as Ns } from "@cratis/scene.model";
 import { ApplicationStructureIndex as Zt, EffectiveIconCatalog as Ts, NavigationEditKind as Ko, TemplateCatalogKind as cr, ToolbarDiagnosticSeverity as Is, addNavItem as Ps, applicableTemplates as xs, applyEdit as dr, applyNavigationEdits as Os, baseComponentLibraries as Ds, componentArgumentSourcePrefix as Rs, componentBadge as Vo, computeSizeClass as Fs, corePackage as so, createDescriptorCatalog as Es, diagnoseNavigationRegions as Ms, effectiveNavigation as ur, effectivePackages as pr, elementNodeId as re, findComponentDescriptor as lo, findLayoutTypeDescriptor as Jo, inspect as co, isCanvas as ut, isDockPanel as As, isExternalComponent as qe, isGrid as uo, isPackageSelectionValid as _s, isPanel as jt, isStackPanel as po, isThemeCompatible as $s, isWrapPanel as Ls, matchComponentQuery as Bs, normalizeToolbarButton as js, packagesOfKind as Qo, rankFrequentlyUsedComponents as Us, resolveComponentName as Tt, resolveEffectiveConfiguration as mr, resolveIconLibraries as Ws, resolvePackageDependencies as zs, resolveTemplateChain as mo, resolveToolbarButton as Hs, setApplicationLogo as Gs, switchRegionMode as hr, toComponentCatalog as en, toolbarButtonFromItem as ho, validateToolbarButtons as qs, validateValue as dn } from "@cratis/scene.engine";
 import { ErrorBoundary as Ve, IconButton as xe, Tabs as Ks } from "@cratis/components/Common";
 import { ColorScheme as Vs, ComponentName as Js, LayoutConfigProvider as fr, LayoutMode as Qs, LayoutName as Ys, TemplatePreviewState as at, applyTemplatePreviewState as Xs, composeApplicationScreen as Zs, composeScreenElement as el, defaultApplicationChrome as tl, defaultBlueprint as gr, defaultBlueprintName as vr, effectiveShellOf as br, externalComponent as fo, foundationSamples as nl, previewProfile as ol, resolveElementComponentNames as go } from "@cratis/scene.blueprint.default";
@@ -132,38 +132,38 @@ var Qd = (e) => e ? {
     height: window.innerHeight
   }));
   ce(() => {
-    const A = () => m({
+    const M = () => m({
       width: window.innerWidth,
       height: window.innerHeight
     });
-    return window.addEventListener("resize", A), () => window.removeEventListener("resize", A);
+    return window.addEventListener("resize", M), () => window.removeEventListener("resize", M);
   }, []);
-  const v = z(() => f((A) => !A), []), w = V(null);
+  const v = z(() => f((M) => !M), []), w = V(null);
   ce(() => {
-    const A = requestAnimationFrame(() => c("visible"));
-    return () => cancelAnimationFrame(A);
+    const M = requestAnimationFrame(() => c("visible"));
+    return () => cancelAnimationFrame(M);
   }, []);
   const P = z(async () => {
     r && !await r(p.current) || (c("closing"), setTimeout(() => s(p.current), 300));
-  }, [r, s]), x = (A, q) => {
+  }, [r, s]), x = (M, q) => {
     q.stopPropagation(), q.preventDefault(), w.current = {
-      direction: A,
+      direction: M,
       startX: q.clientX,
       startY: q.clientY,
       startWidth: u.width,
       startHeight: u.height
     }, q.target.setPointerCapture(q.pointerId);
-  }, C = z((A) => {
+  }, S = z((M) => {
     const q = w.current;
     if (!q) return;
     const { direction: ne } = q;
     let ye = q.startWidth, me = q.startHeight;
     if (ne.includes("e") || ne.includes("w")) {
-      const ue = ne.includes("e") ? A.clientX - q.startX : q.startX - A.clientX;
+      const ue = ne.includes("e") ? M.clientX - q.startX : q.startX - M.clientX;
       ye = Math.max(Vd, q.startWidth + ue * 2);
     }
     if (ne.includes("s") || ne.includes("n")) {
-      const ue = ne.includes("s") ? A.clientY - q.startY : q.startY - A.clientY;
+      const ue = ne.includes("s") ? M.clientY - q.startY : q.startY - M.clientY;
       me = Math.max(Jd, q.startHeight + ue * 2);
     }
     d({
@@ -172,7 +172,7 @@ var Qd = (e) => e ? {
     });
   }, []), k = z(() => {
     w.current = null;
-  }, []), y = Kd(u, g, n - (h ? 360 / 2 : 0)), T = y.offsetX, M = {
+  }, []), y = Kd(u, g, n - (h ? 360 / 2 : 0)), N = y.offsetX, A = {
     size: u,
     setSize: d,
     isInspectorOpen: h,
@@ -180,42 +180,42 @@ var Qd = (e) => e ? {
     close: () => {
       P();
     }
-  }, I = e.left + e.width / 2, N = e.top + e.height / 2, R = g.width / 2 + T - y.width / 2, B = g.height / 2 - y.height / 2, S = `${I - R}px ${N - B}px`, E = [
+  }, T = e.left + e.width / 2, C = e.top + e.height / 2, _ = g.width / 2 + N - y.width / 2, L = g.height / 2 - y.height / 2, D = `${T - _}px ${C - L}px`, I = [
     "prototype-editor-overlay-content",
     l === "visible" ? "prototype-editor-overlay-content--visible" : "",
     l === "closing" ? "prototype-editor-overlay-content--closing" : ""
-  ].join(" "), $ = ["prototype-editor-overlay-backdrop", l === "visible" ? "prototype-editor-overlay-backdrop--visible" : ""].join(" ");
+  ].join(" "), F = ["prototype-editor-overlay-backdrop", l === "visible" ? "prototype-editor-overlay-backdrop--visible" : ""].join(" ");
   return /* @__PURE__ */ b("div", {
-    className: $,
+    className: F,
     "data-testid": "studio-screen-editor-backdrop",
     onClick: P,
     children: [/* @__PURE__ */ b("div", {
-      className: E,
+      className: I,
       "data-testid": "studio-screen-editor-frame",
       style: {
-        transformOrigin: S,
+        transformOrigin: D,
         width: y.width,
         height: y.height,
-        marginLeft: -(y.width / 2) + T,
+        marginLeft: -(y.width / 2) + N,
         marginTop: -(y.height / 2)
       },
-      onClick: (A) => A.stopPropagation(),
-      onPointerDown: (A) => A.stopPropagation(),
-      children: [l === "visible" && Yd.map((A) => /* @__PURE__ */ a("div", {
-        className: `prototype-editor-overlay-resize prototype-editor-overlay-resize--${A}`,
-        onPointerDown: (q) => x(A, q),
-        onPointerMove: C,
+      onClick: (M) => M.stopPropagation(),
+      onPointerDown: (M) => M.stopPropagation(),
+      children: [l === "visible" && Yd.map((M) => /* @__PURE__ */ a("div", {
+        className: `prototype-editor-overlay-resize prototype-editor-overlay-resize--${M}`,
+        onPointerDown: (q) => x(M, q),
+        onPointerMove: S,
         onPointerUp: k,
         onPointerCancel: k
-      }, A)), o(M)]
+      }, M)), o(A)]
     }), i && /* @__PURE__ */ a("aside", {
       className: `prototype-editor-overlay-inspector${h && l === "visible" ? " prototype-editor-overlay-inspector--open" : ""}`,
       style: { width: 360 },
       "aria-hidden": !h,
       inert: !h,
-      onClick: (A) => A.stopPropagation(),
-      onPointerDown: (A) => A.stopPropagation(),
-      children: i(M)
+      onClick: (M) => M.stopPropagation(),
+      onPointerDown: (M) => M.stopPropagation(),
+      children: i(A)
     })]
   });
 }, wo = {
@@ -344,10 +344,10 @@ function zt(e, t = () => {
 }
 var fe = (e, t) => typeof e == "number" ? e : t;
 function Ur(e, t) {
-  const n = e, o = { ...n.properties ?? {} }, i = Xt(e).map((C) => Ur(C, t)), r = o[cu];
+  const n = e, o = { ...n.properties ?? {} }, i = Xt(e).map((S) => Ur(S, t)), r = o[cu];
   if (r != null && typeof r == "object") return mu(r, n, o, i);
   const s = o[fi], l = typeof o.legacyType == "string" && o.legacyType !== "" ? o[hi] : void 0, c = l ?? (jt(e) ? lu(jr(e)) : t(qe(e) ? e.componentName : "")), u = qe(e) ? e.componentName : "", { [hi]: d, [fi]: p, [Je]: h, [Qe]: f, ...g } = o, m = {};
-  for (const C of s?.topKeys ?? []) C in g && (m[C] = g[C], delete g[C]);
+  for (const S of s?.topKeys ?? []) S in g && (m[S] = g[S], delete g[S]);
   const v = fe(h, s?.position.x ?? 0), w = fe(f, s?.position.y ?? 0), P = n.name ?? "", x = s?.emptyName === !0 && P === (l ?? "");
   return {
     ...pu(n, s),
@@ -600,64 +600,64 @@ var gi = {
   ArrowRight: Re.Indent
 };
 function qr({ roots: e, adapter: t, strings: n, selectedId: o, onSelect: i, onEdit: r, onRemove: s }) {
-  const [l, c] = j(() => new Set(e.flatMap((I) => [t.idOf(I), ...t.childrenOf(I).map((N) => t.idOf(N))]))), [u, d] = j(o), [p, h] = j(), [f, g] = j(), [m, v] = j(""), w = U(() => Hr(e, l, t), [
+  const [l, c] = j(() => new Set(e.flatMap((T) => [t.idOf(T), ...t.childrenOf(T).map((C) => t.idOf(C))]))), [u, d] = j(o), [p, h] = j(), [f, g] = j(), [m, v] = j(""), w = U(() => Hr(e, l, t), [
     e,
     l,
     t
-  ]), P = w.some((I) => I.id === u) ? u : w[0]?.id, x = z((I) => c((N) => {
-    const R = new Set(N);
-    return R.delete(I) || R.add(I), R;
-  }), []), C = z((I) => {
-    if (!I) return;
-    const N = r(I);
-    v(N ? n.rejection[N] : n.moved), !N && I.targetParentId && c((R) => new Set(R).add(I.targetParentId));
-  }, [r, n]), k = (I) => {
-    I && (d(I), requestAnimationFrame(() => document.querySelector(`[data-row-id="${CSS.escape(I)}"]`)?.focus()));
-  }, y = (I, N) => {
-    const R = w.findIndex((S) => S.id === N), B = w[R];
-    if (I.altKey && gi[I.key]) {
-      I.preventDefault(), C(fu(e, N, gi[I.key], t)), k(N);
+  ]), P = w.some((T) => T.id === u) ? u : w[0]?.id, x = z((T) => c((C) => {
+    const _ = new Set(C);
+    return _.delete(T) || _.add(T), _;
+  }), []), S = z((T) => {
+    if (!T) return;
+    const C = r(T);
+    v(C ? n.rejection[C] : n.moved), !C && T.targetParentId && c((_) => new Set(_).add(T.targetParentId));
+  }, [r, n]), k = (T) => {
+    T && (d(T), requestAnimationFrame(() => document.querySelector(`[data-row-id="${CSS.escape(T)}"]`)?.focus()));
+  }, y = (T, C) => {
+    const _ = w.findIndex((D) => D.id === C), L = w[_];
+    if (T.altKey && gi[T.key]) {
+      T.preventDefault(), S(fu(e, C, gi[T.key], t)), k(C);
       return;
     }
-    if (ko(I) && s && jn(e, N, t)) {
-      I.preventDefault();
-      const S = zr(e, N, t);
-      s(N), k(S);
+    if (ko(T) && s && jn(e, C, t)) {
+      T.preventDefault();
+      const D = zr(e, C, t);
+      s(C), k(D);
       return;
     }
-    switch (I.key) {
+    switch (T.key) {
       case "ArrowDown":
-        I.preventDefault(), k(w[R + 1]?.id);
+        T.preventDefault(), k(w[_ + 1]?.id);
         break;
       case "ArrowUp":
-        I.preventDefault(), k(w[R - 1]?.id);
+        T.preventDefault(), k(w[_ - 1]?.id);
         break;
       case "Home":
-        I.preventDefault(), k(w[0]?.id);
+        T.preventDefault(), k(w[0]?.id);
         break;
       case "End":
-        I.preventDefault(), k(w[w.length - 1]?.id);
+        T.preventDefault(), k(w[w.length - 1]?.id);
         break;
       case "ArrowRight":
-        I.preventDefault(), B.hasChildren && !B.isExpanded ? x(N) : k(w[R + 1]?.parentId === N ? w[R + 1].id : void 0);
+        T.preventDefault(), L.hasChildren && !L.isExpanded ? x(C) : k(w[_ + 1]?.parentId === C ? w[_ + 1].id : void 0);
         break;
       case "ArrowLeft":
-        I.preventDefault(), B.isExpanded ? x(N) : k(B.parentId ?? void 0);
+        T.preventDefault(), L.isExpanded ? x(C) : k(L.parentId ?? void 0);
         break;
       case "Enter":
       case " ":
-        I.preventDefault(), i(N);
+        T.preventDefault(), i(C);
     }
-  }, T = (I, N) => {
+  }, N = (T, C) => {
     if (!p) return;
-    I.preventDefault();
-    const R = I.currentTarget.getBoundingClientRect(), B = w.find((S) => S.id === N);
+    T.preventDefault();
+    const _ = T.currentTarget.getBoundingClientRect(), L = w.find((D) => D.id === C);
     g({
-      id: N,
-      zone: vu(I.clientY - R.top, R.height, !!B && t.acceptsChildren(B.node))
+      id: C,
+      zone: vu(T.clientY - _.top, _.height, !!L && t.acceptsChildren(L.node))
     });
-  }, M = (I, N) => {
-    I.preventDefault(), p && f?.id === N && C(gu(e, p, N, f.zone, t)), h(void 0), g(void 0);
+  }, A = (T, C) => {
+    T.preventDefault(), p && f?.id === C && S(gu(e, p, C, f.zone, t)), h(void 0), g(void 0);
   };
   return w.length === 0 ? /* @__PURE__ */ a("p", {
     className: "studio-editor-structure-empty",
@@ -666,25 +666,25 @@ function qr({ roots: e, adapter: t, strings: n, selectedId: o, onSelect: i, onEd
     role: "tree",
     "aria-label": n.structureLabel,
     className: "studio-editor-structure-tree",
-    children: w.map((I) => /* @__PURE__ */ a(bu, {
-      row: I,
+    children: w.map((T) => /* @__PURE__ */ a(bu, {
+      row: T,
       adapter: t,
       strings: n,
-      isSelected: I.id === o,
-      isFocusable: I.id === P,
-      dropZone: f?.id === I.id ? f.zone : void 0,
-      onSelect: (N) => {
-        d(N), i(N);
+      isSelected: T.id === o,
+      isFocusable: T.id === P,
+      dropZone: f?.id === T.id ? f.zone : void 0,
+      onSelect: (C) => {
+        d(C), i(C);
       },
       onToggle: x,
       onKeyDown: y,
       onDragStart: h,
-      onDragOver: T,
-      onDrop: M,
+      onDragOver: N,
+      onDrop: A,
       onDragEnd: () => {
         h(void 0), g(void 0);
       }
-    }, I.id))
+    }, T.id))
   }), /* @__PURE__ */ a("p", {
     className: "studio-editor-structure-announcement",
     role: "status",
@@ -2135,13 +2135,13 @@ function Si(e, t) {
   };
 }
 var To = ({ registry: e, property: t, context: n, componentId: o, onChange: i, diagnostics: r, presentation: s = "field" }) => {
-  const l = s === "popover", { descriptor: c } = t, u = `pe-${o}-${c.path}`.replace(/[^A-Za-z0-9_-]/g, "-"), d = e.resolve(c), p = Ja(t), { editor: h, failed: f } = Si(e, d?.id), { editor: g } = Si(e, p ? "bindingExpression" : void 0), m = n.strings.editors, v = !t.editable || c.readOnly === !0, w = t.editable ? c.readOnly === !0 ? m.readOnly : void 0 : t.reason ?? m.inherited, P = t.effectiveValue, x = Fp(t, r), C = P == null || !Ho(c) ? void 0 : dn(c, P) ?? Hn(c, P), k = C !== void 0 && dn(c, P) !== void 0 ? os(c, P) : void 0, y = k !== void 0 && dn(c, k) === void 0, T = (R) => i(t, R), M = p && Xa(P), I = c.valueType === "boolean", N = Ho(c);
+  const l = s === "popover", { descriptor: c } = t, u = `pe-${o}-${c.path}`.replace(/[^A-Za-z0-9_-]/g, "-"), d = e.resolve(c), p = Ja(t), { editor: h, failed: f } = Si(e, d?.id), { editor: g } = Si(e, p ? "bindingExpression" : void 0), m = n.strings.editors, v = !t.editable || c.readOnly === !0, w = t.editable ? c.readOnly === !0 ? m.readOnly : void 0 : t.reason ?? m.inherited, P = t.effectiveValue, x = Fp(t, r), S = P == null || !Ho(c) ? void 0 : dn(c, P) ?? Hn(c, P), k = S !== void 0 && dn(c, P) !== void 0 ? os(c, P) : void 0, y = k !== void 0 && dn(c, k) === void 0, N = (_) => i(t, _), A = p && Xa(P), T = c.valueType === "boolean", C = Ho(c);
   return /* @__PURE__ */ b("div", {
-    className: `studio-editor-field${I ? " studio-editor-field--inline" : ""}`,
+    className: `studio-editor-field${T ? " studio-editor-field--inline" : ""}`,
     "data-property": c.path,
     "data-editor": d?.id,
     children: [
-      N || l ? /* @__PURE__ */ a("span", {
+      C || l ? /* @__PURE__ */ a("span", {
         id: `${u}-label`,
         hidden: !0,
         children: c.label
@@ -2153,25 +2153,25 @@ var To = ({ registry: e, property: t, context: n, componentId: o, onChange: i, d
       }),
       /* @__PURE__ */ b("div", {
         className: "studio-editor-field__control",
-        children: [C !== void 0 ? /* @__PURE__ */ b("div", {
+        children: [S !== void 0 ? /* @__PURE__ */ b("div", {
           className: "studio-editor-structured__mismatch",
           role: "alert",
           children: [
-            /* @__PURE__ */ a("p", { children: n.strings.structured.mismatch(c.label, C) }),
+            /* @__PURE__ */ a("p", { children: n.strings.structured.mismatch(c.label, S) }),
             /* @__PURE__ */ a("button", {
               type: "button",
               disabled: v || !y,
-              onClick: () => T(k),
+              onClick: () => N(k),
               children: n.strings.structured.convert
             }),
             /* @__PURE__ */ a("button", {
               type: "button",
               disabled: v,
-              onClick: () => T(void 0),
+              onClick: () => N(void 0),
               children: n.strings.structured.clear
             })
           ]
-        }) : M ? null : h ? /* @__PURE__ */ a(Ve, {
+        }) : A ? null : h ? /* @__PURE__ */ a(Ve, {
           fallback: /* @__PURE__ */ a("p", {
             className: "studio-editor-binding__missing",
             role: "alert",
@@ -2180,7 +2180,7 @@ var To = ({ registry: e, property: t, context: n, componentId: o, onChange: i, d
           children: /* @__PURE__ */ a(h, {
             id: u,
             value: P,
-            onChange: T,
+            onChange: N,
             descriptor: c,
             context: n,
             disabled: v,
@@ -2203,7 +2203,7 @@ var To = ({ registry: e, property: t, context: n, componentId: o, onChange: i, d
         }), g && /* @__PURE__ */ a(g, {
           id: `${u}-binding`,
           value: t.currentValue,
-          onChange: T,
+          onChange: N,
           descriptor: c,
           context: n,
           disabled: v
@@ -3159,6 +3159,7 @@ var Oo = {
     definedIn: (e) => `defined in ${e}`,
     inheritedReadOnly: "inherited · read-only",
     navigationItem: "Navigation item",
+    hierarchy: "Where it appears",
     label: "Label",
     navigateTo: "Navigate to",
     renderIntoSlot: "Render into slot",
@@ -3211,7 +3212,7 @@ var Oo = {
     removed: (e) => `Removed ${e}`,
     refused: (e) => `Not possible: ${e}`
   }
-}, _ = {
+}, $ = {
   addItem: "addItem",
   addButton: "addButton",
   rename: "rename",
@@ -3244,17 +3245,17 @@ function Ft(e, t) {
     enabled: !1
   };
   switch (e.id) {
-    case _.moveEarlier:
+    case $.moveEarlier:
       return {
         visible: !0,
         enabled: t.index > 0
       };
-    case _.moveLater:
+    case $.moveLater:
       return {
         visible: !0,
         enabled: t.index < t.count - 1
       };
-    case _.addSubItem:
+    case $.addSubItem:
       return {
         visible: !0,
         enabled: t.parentId === void 0
@@ -3354,47 +3355,47 @@ function im(e, t) {
   return [n.name, ...o].join(" › ");
 }
 function aa(e) {
-  const { region: t, module: n, navigation: o, structure: i, newId: r, slots: s, startingLabel: l, strings: c } = e, u = ur(i, o, n, t), d = nm(o, n, t), p = Ms(i, o, { slots: [...s] }), h = (x) => `${n ?? "application"}:${t}:${x}`, f = [], g = (x, C) => {
+  const { region: t, module: n, navigation: o, structure: i, newId: r, slots: s, startingLabel: l, strings: c } = e, u = ur(i, o, n, t), d = nm(o, n, t), p = Ms(i, o, { slots: [...s] }), h = (x) => `${n ?? "application"}:${t}:${x}`, f = [], g = (x, S) => {
     const k = x.filter((y) => !y.readOnly);
     x.forEach((y) => {
-      const T = Qt(d, y.id)?.target ?? (y.target ? {
+      const N = Qt(d, y.id)?.target ?? (y.target ? {
         module: y.target.module,
         ...y.target.feature ? { feature: y.target.feature } : {}
-      } : void 0), M = y.readOnly ? -1 : k.indexOf(y), I = im(i, T), N = p.filter((R) => R.entry === h(y.id)).map((R) => ({
-        code: R.code,
-        message: R.message
+      } : void 0), A = y.readOnly ? -1 : k.indexOf(y), T = im(i, N), C = p.filter((_) => _.entry === h(y.id)).map((_) => ({
+        code: _.code,
+        message: _.message
       }));
       f.push({
         id: y.id,
         label: y.title,
-        index: M,
+        index: A,
         count: k.length,
-        ...C ? { parentId: C } : {},
+        ...S ? { parentId: S } : {},
         readOnly: y.readOnly,
         ...y.readOnly ? {
           readOnlyReason: Do,
           origin: c.application
         } : {},
         values: {
-          target: T,
+          target: N,
           slot: y.slot,
           icon: y.icon,
           children: y.children?.length
         },
         chips: {
-          target: I ?? "",
+          target: T ?? "",
           slot: y.slot === "content" || y.slot === "" ? c.mainArea : y.slot
         },
-        ...N.length > 0 ? { problems: N } : {},
-        unlinked: T === void 0 && !(y.children && y.children.length > 0)
+        ...C.length > 0 ? { problems: C } : {},
+        unlinked: N === void 0 && !(y.children && y.children.length > 0)
       }), y.children && g(y.children, y.id);
     });
   };
   g(u.items);
-  const m = t, v = (x, C, k, y = {}) => C.rejected ? { rejected: C.rejected } : {
+  const m = t, v = (x, S, k, y = {}) => S.rejected ? { rejected: S.rejected } : {
     label: x,
     edits: [],
-    navigationEdits: C.edits,
+    navigationEdits: S.edits,
     ...k ? { select: k } : {},
     ...y
   }, w = (x) => ({ edits: [{
@@ -3403,11 +3404,11 @@ function aa(e) {
     region: t,
     items: x
   }] }), P = (x) => {
-    const C = r(), k = Ps(o, n, t, {
-      id: C,
+    const S = r(), k = Ps(o, n, t, {
+      id: S,
       title: l
-    }, x), y = k.edits.some((T) => T.kind === Ko.SetRegionMode);
-    return v("Add", k, { itemId: C }, {
+    }, x), y = k.edits.some((N) => N.kind === Ko.SetRegionMode);
+    return v("Add", k, { itemId: S }, {
       renameNext: !0,
       ...y ? { notice: c.extendsNotice } : {}
     });
@@ -3425,43 +3426,43 @@ function aa(e) {
       ...n !== void 0 ? { module: n } : {},
       ...u.mode ? { mode: om(u.mode) } : {}
     },
-    add: (x) => x === _.addItem ? P() : { rejected: x },
-    act: (x, C) => {
+    add: (x) => x === $.addItem ? P() : { rejected: x },
+    act: (x, S) => {
       switch (x) {
-        case _.addSubItem:
-          return C.parentId !== void 0 ? { rejected: "subItemOfSubItem" } : P(C.id);
-        case _.moveEarlier:
-        case _.moveLater: {
-          const k = C.index + (x === _.moveEarlier ? -1 : 1), y = Ct(d, C.id);
-          return !y || k < 0 || k >= y.length ? { rejected: "noWhere" } : v("Move", w(Xp(d, C.id, k)), { itemId: C.id });
+        case $.addSubItem:
+          return S.parentId !== void 0 ? { rejected: "subItemOfSubItem" } : P(S.id);
+        case $.moveEarlier:
+        case $.moveLater: {
+          const k = S.index + (x === $.moveEarlier ? -1 : 1), y = Ct(d, S.id);
+          return !y || k < 0 || k >= y.length ? { rejected: "noWhere" } : v("Move", w(Xp(d, S.id, k)), { itemId: S.id });
         }
-        case _.duplicate: {
-          const k = Zp(d, C.id, r);
+        case $.duplicate: {
+          const k = Zp(d, S.id, r);
           return k.copy ? v("Duplicate", w(k.items), { itemId: k.copy.id }) : { rejected: x };
         }
-        case _.delete: {
-          const k = Ct(d, C.id) ?? [], y = k.findIndex((M) => M.id === C.id), T = k[y + 1] ?? k[y - 1];
-          return v("Remove", w(Yp(d, C.id)), { itemId: T?.id ?? null });
+        case $.delete: {
+          const k = Ct(d, S.id) ?? [], y = k.findIndex((A) => A.id === S.id), N = k[y + 1] ?? k[y - 1];
+          return v("Remove", w(Yp(d, S.id)), { itemId: N?.id ?? null });
         }
         default:
           return { rejected: x };
       }
     },
-    rename: (x, C) => v("Rename", w(Et(d, x.id, { title: C })), { itemId: x.id }),
-    choice: (x, C) => {
-      const k = Qt(d, C.id);
+    rename: (x, S) => v("Rename", w(Et(d, x.id, { title: S })), { itemId: x.id }),
+    choice: (x, S) => {
+      const k = Qt(d, S.id);
       if (k) {
-        if (x === _.target) return {
+        if (x === $.target) return {
           property: Nn("target", "Navigate to", "navigationItemTarget", k.target),
-          plan: (y) => v("Link", w(Et(d, C.id, { target: rm(y) ? y : void 0 })), { itemId: C.id })
+          plan: (y) => v("Link", w(Et(d, S.id, { target: rm(y) ? y : void 0 })), { itemId: S.id })
         };
-        if (x === _.slot) return {
+        if (x === $.slot) return {
           property: Nn("slot", "Render into slot", "renderingSlot", k.slot ?? "content"),
-          plan: (y) => v("Change", w(Et(d, C.id, { slot: typeof y == "string" && y !== "content" ? y : void 0 })), { itemId: C.id })
+          plan: (y) => v("Change", w(Et(d, S.id, { slot: typeof y == "string" && y !== "content" ? y : void 0 })), { itemId: S.id })
         };
         if (x === "icon") return {
           property: Nn("icon", "Icon", "icon", k.icon),
-          plan: (y) => v("Change", w(Et(d, C.id, { icon: typeof y == "string" && y !== "" ? y : void 0 })), { itemId: C.id })
+          plan: (y) => v("Change", w(Et(d, S.id, { icon: typeof y == "string" && y !== "" ? y : void 0 })), { itemId: S.id })
         };
       }
     },
@@ -3518,7 +3519,7 @@ function am({ componentId: e, property: t, newId: n, startingLabel: o, startingD
     kind: on.Collection,
     items: d,
     add: (f) => {
-      if (f !== _.addItem) return { rejected: f };
+      if (f !== $.addItem) return { rejected: f };
       const g = h(ke.Add);
       if (g) return g;
       const m = t.descriptor.item?.properties.some((w) => w.path === "destination" && w.constraints?.required === !0) === !0;
@@ -3544,11 +3545,11 @@ function am({ componentId: e, property: t, newId: n, startingLabel: o, startingD
     },
     act: (f, g) => {
       switch (f) {
-        case _.moveEarlier:
-        case _.moveLater: {
+        case $.moveEarlier:
+        case $.moveLater: {
           const m = h(ke.Reorder);
           if (m) return m;
-          const v = g.index + (f === _.moveEarlier ? -1 : 1);
+          const v = g.index + (f === $.moveEarlier ? -1 : 1);
           return v < 0 || v >= l.length ? { rejected: "noWhere" } : {
             label: "Move",
             edits: [{
@@ -3560,7 +3561,7 @@ function am({ componentId: e, property: t, newId: n, startingLabel: o, startingD
             select: { itemId: g.id }
           };
         }
-        case _.duplicate: {
+        case $.duplicate: {
           const m = h(ke.Add);
           if (m) return m;
           const v = n(), w = s.find((P) => P.id === g.id);
@@ -3578,7 +3579,7 @@ function am({ componentId: e, property: t, newId: n, startingLabel: o, startingD
             select: { itemId: v }
           };
         }
-        case _.delete: {
+        case $.delete: {
           const m = h(ke.Remove);
           if (m) return m;
           const v = l[g.index + 1] ?? l[g.index - 1];
@@ -3698,7 +3699,7 @@ function Kn(e, t) {
   typeof n.id == "string" && n.properties !== null && typeof n.properties == "object" && (n.id = t());
   for (const [o, i] of Object.entries(n)) o !== "properties" && Kn(i, t);
 }
-var Vn = (e) => typeof e == "string" ? e : "", rn = { [_.addButton]: {
+var Vn = (e) => typeof e == "string" ? e : "", rn = { [$.addButton]: {
   slot: "items",
   componentName: "core:toolbarItem",
   labelProperty: "label",
@@ -3752,9 +3753,9 @@ function dm({ component: e, addActionId: t, ownershipOf: n, inspect: o, newId: i
     act: (h, f) => {
       const g = c[f.index];
       switch (h) {
-        case _.moveEarlier:
-        case _.moveLater: {
-          const m = f.index + (h === _.moveEarlier ? -1 : 1);
+        case $.moveEarlier:
+        case $.moveLater: {
+          const m = f.index + (h === $.moveEarlier ? -1 : 1);
           return m < 0 || m >= c.length ? { rejected: "noWhere" } : {
             label: "Move",
             edits: [{
@@ -3767,9 +3768,9 @@ function dm({ component: e, addActionId: t, ownershipOf: n, inspect: o, newId: i
             select: { elementId: f.id }
           };
         }
-        case _.duplicate:
+        case $.duplicate:
           return p(cm(g, i), f.index + 1, "Duplicate");
-        case _.delete: {
+        case $.delete: {
           const m = c[f.index + 1] ?? c[f.index - 1];
           return {
             label: "Remove",
@@ -3793,7 +3794,7 @@ function dm({ component: e, addActionId: t, ownershipOf: n, inspect: o, newId: i
       } : { rejected: "rename" };
     },
     choice: (h, f) => {
-      const g = h === _.slice ? "slice" : h === _.emphasis ? "emphasis" : void 0, m = g ? o(f.id)?.properties.find((v) => v.descriptor.path === g) : void 0;
+      const g = h === $.slice ? "slice" : h === $.emphasis ? "emphasis" : void 0, m = g ? o(f.id)?.properties.find((v) => v.descriptor.path === g) : void 0;
       if (m)
         return {
           property: m,
@@ -3862,16 +3863,16 @@ function pm({ controller: e, environment: t, strings: n, startingLabels: o, star
   const [s, l] = j(0), [c, u] = j(""), [d, p] = j("");
   ce(() => {
     if (d === "") return;
-    const N = setTimeout(() => p(""), 4e3);
-    return () => clearTimeout(N);
+    const C = setTimeout(() => p(""), 4e3);
+    return () => clearTimeout(C);
   }, [d]);
-  const { document: h, composition: f, context: g, selectedId: m, ownershipOf: v, selectedItemId: w, navigation: P, navigationModule: x, structure: C } = e, k = t.navigation?.slots ?? t.propertyEditors?.slots ?? mm, y = z((N) => {
-    const R = an(N.componentName);
-    return R ? aa({
-      region: R,
+  const { document: h, composition: f, context: g, selectedId: m, ownershipOf: v, selectedItemId: w, navigation: P, navigationModule: x, structure: S } = e, k = t.navigation?.slots ?? t.propertyEditors?.slots ?? mm, y = z((C) => {
+    const _ = an(C.componentName);
+    return _ ? aa({
+      region: _,
       module: x,
       navigation: P,
-      structure: C,
+      structure: S,
       newId: Nt,
       slots: k,
       startingLabel: o.item,
@@ -3883,26 +3884,26 @@ function pm({ controller: e, environment: t, strings: n, startingLabels: o, star
         application: n.navigation.application,
         mainArea: n.mainArea
       }
-    }) : r?.(N, w);
+    }) : r?.(C, w);
   }, [
     x,
     P,
-    C,
+    S,
     k,
     o,
     n,
     r,
     w
-  ]), T = U(() => um({
+  ]), N = U(() => um({
     roots: f.roots,
     catalog: g.catalog,
     selectedId: m,
     selectedItemId: w,
     ownershipOf: v,
     newId: Nt,
-    inspect: (N) => co(h, re(N), g),
+    inspect: (C) => co(h, re(C), g),
     startingLabels: o,
-    structure: C,
+    structure: S,
     ...i ? { startingDestination: i } : {},
     otherSource: y
   }), [
@@ -3914,64 +3915,64 @@ function pm({ controller: e, environment: t, strings: n, startingLabels: o, star
     h,
     o,
     i,
-    C,
+    S,
     y
-  ]), M = e.selectItem, I = z((N, R) => {
-    if (ia(N))
-      return u(n.announce.refused(N.rejected)), !1;
-    if (N.editAtApplication)
+  ]), A = e.selectItem, T = z((C, _) => {
+    if (ia(C))
+      return u(n.announce.refused(C.rejected)), !1;
+    if (C.editAtApplication)
       return e.setNavigationModule(void 0), e.selectItem(void 0, void 0), !0;
-    const B = N.navigationEdits ? e.applyNavigationEdits(N.navigationEdits, N.label) : e.applyAll(N.edits, N.label);
-    if (!B.applied)
-      return u(n.announce.refused("rejected" in B && B.rejected || "diagnostics" in B && B.diagnostics[0]?.message || N.label)), !1;
-    const { select: S } = N;
-    return S?.elementId !== void 0 && e.select(S.elementId), S?.itemId !== void 0 && e.selectItem(S.itemId === null ? void 0 : T?.componentId ?? m, S.itemId === null ? void 0 : S.itemId), N.notice && (u(N.notice), p(N.notice)), N.renameNext && l((E) => E + 1), R && !N.notice && u(R(N)), !0;
+    const L = C.navigationEdits ? e.applyNavigationEdits(C.navigationEdits, C.label) : e.applyAll(C.edits, C.label);
+    if (!L.applied)
+      return u(n.announce.refused("rejected" in L && L.rejected || "diagnostics" in L && L.diagnostics[0]?.message || C.label)), !1;
+    const { select: D } = C;
+    return D?.elementId !== void 0 && e.select(D.elementId), D?.itemId !== void 0 && e.selectItem(D.itemId === null ? void 0 : N?.componentId ?? m, D.itemId === null ? void 0 : D.itemId), C.notice && (u(C.notice), p(C.notice)), C.renameNext && l((I) => I + 1), _ && !C.notice && u(_(C)), !0;
   }, [
     e,
     n,
-    T,
+    N,
     m
   ]);
   return {
-    subject: T,
+    subject: N,
     renameToken: s,
     announcement: c,
     notice: d,
-    pointItem: M,
-    perform: I,
-    add: z((N) => {
-      if (!T) return !1;
-      const R = T.source.kind === on.Elements ? o.button : o.item;
-      return I(T.source.add(N), () => n.announce.added(R));
+    pointItem: A,
+    perform: T,
+    add: z((C) => {
+      if (!N) return !1;
+      const _ = N.source.kind === on.Elements ? o.button : o.item;
+      return T(N.source.add(C), () => n.announce.added(_));
     }, [
+      N,
       T,
-      I,
       n,
       o
     ]),
-    act: z((N, R) => {
-      if (!T) return !1;
-      const B = R.label;
-      return I(T.source.act(N, R), () => {
-        switch (N) {
-          case _.moveEarlier:
-            return n.announce.moved(B, R.index, R.count);
-          case _.moveLater:
-            return n.announce.moved(B, R.index + 2, R.count);
-          case _.duplicate:
-            return n.announce.duplicated(B);
-          case _.delete:
-            return n.announce.removed(B);
+    act: z((C, _) => {
+      if (!N) return !1;
+      const L = _.label;
+      return T(N.source.act(C, _), () => {
+        switch (C) {
+          case $.moveEarlier:
+            return n.announce.moved(L, _.index, _.count);
+          case $.moveLater:
+            return n.announce.moved(L, _.index + 2, _.count);
+          case $.duplicate:
+            return n.announce.duplicated(L);
+          case $.delete:
+            return n.announce.removed(L);
           default:
             return "";
         }
       });
     }, [
+      N,
       T,
-      I,
       n
     ]),
-    rename: z((N, R) => T ? I(T.source.rename(N, R)) : !1, [T, I]),
+    rename: z((C, _) => N ? T(N.source.rename(C, _)) : !1, [N, T]),
     deselect: z(() => {
       w !== void 0 ? e.selectItem(void 0, void 0) : e.select(void 0);
     }, [w, e])
@@ -4021,7 +4022,7 @@ var da = (e) => ({
       application: o.application,
       mainArea: "Main area"
     }
-  }), m = l.modules.find((S) => S.id === c)?.name ?? c, v = m ?? o.application, w = o.regionName[u], P = r ? g.items.find((S) => S.id === r) : void 0, x = t.propertyEditors?.registry ?? nn, C = Io({
+  }), m = l.modules.find((I) => I.id === c)?.name ?? c, v = m ?? o.application, w = o.regionName[u], P = r ? g.items.find((I) => I.id === r) : void 0, x = t.propertyEditors?.registry ?? nn, S = Io({
     controller: e,
     environment: t,
     strings: n,
@@ -4030,41 +4031,51 @@ var da = (e) => ({
     inCanvas: !1,
     bindingScope: h,
     slotNames: da(o)
-  }), k = g.region?.mode, y = (S, E = !1) => {
-    const $ = hr(s, c, u, S, { copy: E });
-    $.rejected || $.edits.length === 0 || e.applyNavigationEdits($.edits, "Region mode");
-  }, T = (S) => {
-    if (S !== k) {
-      if (k === De.Inherit && S === De.Override) {
+  }), k = g.region?.mode, y = (I, F = !1) => {
+    const M = hr(s, c, u, I, { copy: F });
+    M.rejected || M.edits.length === 0 || e.applyNavigationEdits(M.edits, "Region mode");
+  }, N = (I) => {
+    if (I !== k) {
+      if (k === De.Inherit && I === De.Override) {
         p(!0);
         return;
       }
-      p(!1), y(S);
+      p(!1), y(I);
     }
-  }, M = P ? !P.readOnly : !1, I = (S) => {
-    !S || "rejected" in S || S.navigationEdits && e.applyNavigationEdits(S.navigationEdits, S.label);
-  }, N = (S, E) => {
+  }, A = P ? !P.readOnly : !1, T = (I) => {
+    !I || "rejected" in I || I.navigationEdits && e.applyNavigationEdits(I.navigationEdits, I.label);
+  }, C = (I, F) => {
     if (P)
-      switch (S.descriptor.path) {
+      switch (I.descriptor.path) {
         case "label":
-          typeof E == "string" && E !== "" && I(g.rename(P, E));
+          typeof F == "string" && F !== "" && T(g.rename(P, F));
           break;
         case "target":
-          I(g.choice("target", P)?.plan(E));
+          T(g.choice("target", P)?.plan(F));
           break;
         case "slot":
-          I(g.choice("slot", P)?.plan(E));
+          T(g.choice("slot", P)?.plan(F));
           break;
         case "icon":
-          I(g.choice("icon", P)?.plan(E));
+          T(g.choice("icon", P)?.plan(F));
       }
-  }, R = s.application.logo, B = (S) => {
-    const E = Gs(s, c, {
-      image: R?.image ?? "",
-      title: R?.title ?? "",
-      ...S
+  }, _ = (() => {
+    if (!P) return [];
+    const I = [];
+    for (let F = P; ; ) {
+      I.unshift(F.label);
+      const M = F.parentId ? g.items.find((q) => q.id === F.parentId) : void 0;
+      if (!M) break;
+      F = M;
+    }
+    return [P.readOnly ? o.application : v, ...I];
+  })(), L = s.application.logo, D = (I) => {
+    const F = Gs(s, c, {
+      image: L?.image ?? "",
+      title: L?.title ?? "",
+      ...I
     });
-    E.rejected || e.applyNavigationEdits(E.edits, "Logo");
+    F.rejected || e.applyNavigationEdits(F.edits, "Logo");
   };
   return /* @__PURE__ */ a("section", {
     className: "studio-editor-properties__navigation",
@@ -4090,24 +4101,33 @@ var da = (e) => ({
         role: "note",
         children: m ? o.inheritedNote(m) : o.inheritedFromApplication
       }),
-      P.problems?.map((S) => /* @__PURE__ */ a("p", {
+      /* @__PURE__ */ b("p", {
+        className: "studio-editor-properties__hint",
+        "data-navigation-hierarchy": _.join(" › "),
+        children: [
+          /* @__PURE__ */ a("strong", { children: o.hierarchy }),
+          " ",
+          _.join(" › ")
+        ]
+      }),
+      P.problems?.map((I) => /* @__PURE__ */ a("p", {
         className: "studio-editor-chip studio-editor-chip--error",
         role: "alert",
-        children: o.problems[S.code] ?? S.message
-      }, S.code)),
+        children: o.problems[I.code] ?? I.message
+      }, I.code)),
       [
-        Mt("label", o.label, K.String, "text", P.label, M, o.inheritedFromApplication),
-        Mt("target", o.navigateTo, K.String, "navigationItemTarget", P.values.target, M, o.inheritedFromApplication),
-        Mt("slot", o.renderIntoSlot, K.String, "renderingSlot", P.values.slot, M, o.inheritedFromApplication),
-        Mt("icon", o.icon, K.String, "icon", P.values.icon, M, o.inheritedFromApplication)
-      ].map((S) => /* @__PURE__ */ a(To, {
+        Mt("label", o.label, K.String, "text", P.label, A, o.inheritedFromApplication),
+        Mt("target", o.navigateTo, K.String, "navigationItemTarget", P.values.target, A, o.inheritedFromApplication),
+        Mt("slot", o.renderIntoSlot, K.String, "renderingSlot", P.values.slot, A, o.inheritedFromApplication),
+        Mt("icon", o.icon, K.String, "icon", P.values.icon, A, o.inheritedFromApplication)
+      ].map((I) => /* @__PURE__ */ a(To, {
         registry: x,
-        property: S,
-        context: C,
+        property: I,
+        context: S,
         componentId: P.id,
-        onChange: N,
+        onChange: C,
         diagnostics: []
-      }, `${P.id}-${S.descriptor.path}`))
+      }, `${P.id}-${I.descriptor.path}`))
     ] }) : /* @__PURE__ */ b(le, { children: [
       /* @__PURE__ */ a("header", {
         className: "studio-editor-properties__header",
@@ -4126,15 +4146,15 @@ var da = (e) => ({
           className: "studio-editor-mode-cards",
           role: "radiogroup",
           "aria-label": o.modeTitle(w, v),
-          children: hm.map((S) => /* @__PURE__ */ b("button", {
+          children: hm.map((I) => /* @__PURE__ */ b("button", {
             type: "button",
             role: "radio",
-            "aria-checked": S === k,
-            "data-mode": S,
-            className: `studio-editor-mode-card${S === k ? " studio-editor-mode-card--chosen" : ""}`,
-            onClick: () => T(S),
-            children: [/* @__PURE__ */ a("strong", { children: o.modes[S].title }), /* @__PURE__ */ a("span", { children: o.modes[S].description })]
-          }, S))
+            "aria-checked": I === k,
+            "data-mode": I,
+            className: `studio-editor-mode-card${I === k ? " studio-editor-mode-card--chosen" : ""}`,
+            onClick: () => N(I),
+            children: [/* @__PURE__ */ a("strong", { children: o.modes[I].title }), /* @__PURE__ */ a("span", { children: o.modes[I].description })]
+          }, I))
         }),
         d && /* @__PURE__ */ b("div", {
           className: "studio-editor-mode__prompt",
@@ -4169,15 +4189,15 @@ var da = (e) => ({
           /* @__PURE__ */ a("legend", { children: o.logo }),
           /* @__PURE__ */ b("label", { children: [o.logoTitle, /* @__PURE__ */ a("input", {
             type: "text",
-            value: R?.title ?? "",
+            value: L?.title ?? "",
             disabled: c !== void 0,
-            onChange: (S) => B({ title: S.target.value })
+            onChange: (I) => D({ title: I.target.value })
           })] }),
           /* @__PURE__ */ b("label", { children: [o.logoImage, /* @__PURE__ */ a("input", {
             type: "text",
-            value: R?.image ?? "",
+            value: L?.image ?? "",
             disabled: c !== void 0,
-            onChange: (S) => B({ image: S.target.value })
+            onChange: (I) => D({ image: I.target.value })
           })] }),
           c !== void 0 && /* @__PURE__ */ a("p", {
             className: "studio-editor-properties__hint",
@@ -4332,7 +4352,7 @@ var gm = (e) => String(e.componentName ?? "").endsWith("toolbarItem"), vm = (e)
       strings: n
     })
   });
-  const p = Ya(e.composition.roots, s), h = wu(r.properties, p, l.properties), { runtime: f } = t, g = ym(e.context.catalog.components, r.typeId), m = g ? f.packageDescriptorOf(g) : void 0, v = (S) => !!m && f.designTime.propertyEditor(m, S.descriptor).contribution !== void 0, w = t.propertyEditors?.registry ?? nn, P = [...r.diagnostics, ...e.diagnostics], x = Nu(h, r.typeId, (S) => wm.has(S.descriptor.path) || v(S)), C = Tu(x), k = {
+  const p = Ya(e.composition.roots, s), h = wu(r.properties, p, l.properties), { runtime: f } = t, g = ym(e.context.catalog.components, r.typeId), m = g ? f.packageDescriptorOf(g) : void 0, v = (D) => !!m && f.designTime.propertyEditor(m, D.descriptor).contribution !== void 0, w = t.propertyEditors?.registry ?? nn, P = [...r.diagnostics, ...e.diagnostics], x = Nu(h, r.typeId, (D) => wm.has(D.descriptor.path) || v(D)), S = Tu(x), k = {
     controller: e,
     environment: t,
     strings: n,
@@ -4341,7 +4361,7 @@ var gm = (e) => String(e.componentName ?? "").endsWith("toolbarItem"), vm = (e)
     diagnostics: P,
     inCanvas: p,
     bindingScope: u
-  }, y = Io(k), T = r.typeId.endsWith("action"), M = r.typeId.endsWith("toolbarButton"), I = Jr(r.typeId), N = e.document.screens.find((S) => S.name === "Screen")?.forms ?? [], R = o !== void 0 && o !== "local", B = l.properties;
+  }, y = Io(k), N = r.typeId.endsWith("action"), A = r.typeId.endsWith("toolbarButton"), T = Jr(r.typeId), C = e.document.screens.find((D) => D.name === "Screen")?.forms ?? [], _ = o !== void 0 && o !== "local", L = l.properties;
   return /* @__PURE__ */ b("div", {
     className: "studio-editor-properties",
     children: [
@@ -4406,62 +4426,62 @@ var gm = (e) => String(e.componentName ?? "").endsWith("toolbarItem"), vm = (e)
         /* @__PURE__ */ a(Mu, {
           component: l,
           descriptor: g,
-          properties: r.properties.filter((S) => !Kr(r.typeId, S.descriptor.path)),
+          properties: r.properties.filter((D) => !Kr(r.typeId, D.descriptor.path)),
           controller: e,
           environment: t,
           strings: n,
           disabled: o !== void 0 && o !== "local"
         })
       ] }),
-      C.length === 0 && r.properties.length === 0 && /* @__PURE__ */ a("p", {
+      S.length === 0 && r.properties.length === 0 && /* @__PURE__ */ a("p", {
         className: "studio-editor-properties-empty",
         children: c.noProperties
       }),
-      C.map((S) => /* @__PURE__ */ b("section", {
+      S.map((D) => /* @__PURE__ */ b("section", {
         className: "studio-editor-properties__group",
-        "aria-label": S.name,
+        "aria-label": D.name,
         children: [/* @__PURE__ */ a("h4", {
           className: "studio-editor-properties__group-title",
-          children: S.name
-        }), S.properties.map((E) => /* @__PURE__ */ a(To, {
+          children: D.name
+        }), D.properties.map((I) => /* @__PURE__ */ a(To, {
           registry: w,
-          property: E,
-          context: $p(y, k, E),
+          property: I,
+          context: $p(y, k, I),
           componentId: s,
           onChange: e.setProperty,
           diagnostics: P
-        }, `${s}:${E.descriptor.path}`))]
-      }, S.name)),
-      T && /* @__PURE__ */ a(Ou, {
-        action: na(B, t.stateChangeSlices.find((S) => S.id === B?.command)?.name ?? ""),
+        }, `${s}:${I.descriptor.path}`))]
+      }, D.name)),
+      N && /* @__PURE__ */ a(Ou, {
+        action: na(L, t.stateChangeSlices.find((D) => D.id === L?.command)?.name ?? ""),
         slices: t.stateChangeSlices,
         sources: Vr(Object.keys(t.availableSources), d.componentOutputs, s),
         strings: n,
         disabled: o !== void 0 && o !== "local",
-        suggestSource: (S) => S === "id" || S.endsWith("Id") ? "row.id" : void 0,
-        onChange: (S) => S && e.applyAll(Wp(s, S), n.properties.action.label)
+        suggestSource: (D) => D === "id" || D.endsWith("Id") ? "row.id" : void 0,
+        onChange: (D) => D && e.applyAll(Wp(s, D), n.properties.action.label)
       }),
-      I && /* @__PURE__ */ a(ap, {
+      T && /* @__PURE__ */ a(ap, {
         elementId: s,
-        command: typeof B?.command == "string" ? B.command : void 0,
+        command: typeof L?.command == "string" ? L.command : void 0,
         slices: t.stateChangeSlices,
-        forms: N,
+        forms: C,
         strings: n,
-        disabled: R,
-        onCommandChange: (S) => {
-          e.applyAll([Lu(s, S)], n.properties.commandForm.label).applied && S && !N.some((E) => E.forCommand === S.name) && e.setScreenForms([...N, zn(S)], n.properties.commandForm.createForm(S.name));
+        disabled: _,
+        onCommandChange: (D) => {
+          e.applyAll([Lu(s, D)], n.properties.commandForm.label).applied && D && !C.some((I) => I.forCommand === D.name) && e.setScreenForms([...C, zn(D)], n.properties.commandForm.createForm(D.name));
         },
-        onFormChange: (S) => e.setScreenForms(N.map((E) => E.forCommand === S.forCommand ? S : E), n.properties.forms.label),
-        onFormCreate: (S) => e.setScreenForms([...N, zn(S)], n.properties.commandForm.createForm(S.name))
+        onFormChange: (D) => e.setScreenForms(C.map((I) => I.forCommand === D.forCommand ? D : I), n.properties.forms.label),
+        onFormCreate: (D) => e.setScreenForms([...C, zn(D)], n.properties.commandForm.createForm(D.name))
       }),
-      M && /* @__PURE__ */ a(Kp, {
+      A && /* @__PURE__ */ a(Kp, {
         behaviors: l.behaviors,
         targets: ds(t, e.document),
         destinations: t.destinations,
         slices: t.stateChangeSlices,
         strings: n.properties.toolbarButton,
-        disabled: R,
-        onChange: (S) => e.setElementBehaviors(s, S, n.properties.toolbarButton.label)
+        disabled: _,
+        onChange: (D) => e.setElementBehaviors(s, D, n.properties.toolbarButton.label)
       }, s),
       /* @__PURE__ */ a(Rp, {
         inspection: r,
@@ -4745,31 +4765,31 @@ var Lm = (e) => e.dataTransfer.types.includes(Mo), Bm = {
     l,
     n.frequentlyUsed
   ]), g = r.trim().length > 0, m = z((y) => {
-    g || c((T) => {
-      const M = {
-        ...T,
+    g || c((N) => {
+      const A = {
+        ...N,
         [y.id]: !y.expanded
       };
-      return t.writeGroups(M), M;
+      return t.writeGroups(A), A;
     });
-  }, [g, t]), v = () => [...d.current?.querySelectorAll("[data-picker-focus]") ?? []], w = (y, T) => {
-    const M = v(), I = y ? M.indexOf(y) : -1;
-    M[Math.min(Math.max(I + T, 0), M.length - 1)]?.focus();
+  }, [g, t]), v = () => [...d.current?.querySelectorAll("[data-picker-focus]") ?? []], w = (y, N) => {
+    const A = v(), T = y ? A.indexOf(y) : -1;
+    A[Math.min(Math.max(T + N, 0), A.length - 1)]?.focus();
   }, P = (y) => {
-    const T = y.target, M = T === u.current;
-    if (y.key === "/" && !M)
+    const N = y.target, A = N === u.current;
+    if (y.key === "/" && !A)
       y.preventDefault(), u.current?.focus();
     else if (y.key === "ArrowDown")
-      y.preventDefault(), w(M ? null : T, 1);
+      y.preventDefault(), w(A ? null : N, 1);
     else if (y.key === "ArrowUp") {
       y.preventDefault();
-      const I = v();
-      if (M) return;
-      I.indexOf(T) <= 0 ? u.current?.focus() : w(T, -1);
-    } else y.key === "Escape" && M && r !== "" && (y.stopPropagation(), s(""));
-  }, x = (y, T) => {
-    Mm(T, y.payload, y.label), T.currentTarget.closest('[data-cratis-part="toolbar-folder-panel"]')?.setAttribute("data-dragging", "");
-  }, C = (y) => {
+      const T = v();
+      if (A) return;
+      T.indexOf(N) <= 0 ? u.current?.focus() : w(N, -1);
+    } else y.key === "Escape" && A && r !== "" && (y.stopPropagation(), s(""));
+  }, x = (y, N) => {
+    Mm(N, y.payload, y.label), N.currentTarget.closest('[data-cratis-part="toolbar-folder-panel"]')?.setAttribute("data-dragging", "");
+  }, S = (y) => {
     y.currentTarget.closest('[data-cratis-part="toolbar-folder-panel"]')?.removeAttribute("data-dragging");
   }, k = Om(f);
   return /* @__PURE__ */ b("div", {
@@ -4831,38 +4851,38 @@ var Lm = (e) => e.dataTransfer.types.includes(Mo), Bm = {
           }), y.expanded && /* @__PURE__ */ a("ul", {
             id: `${p}-${y.id}`,
             className: "studio-component-picker__rows",
-            children: y.rows.map(({ entry: T, match: M }) => /* @__PURE__ */ a("li", { children: /* @__PURE__ */ b("button", {
+            children: y.rows.map(({ entry: N, match: A }) => /* @__PURE__ */ a("li", { children: /* @__PURE__ */ b("button", {
               type: "button",
               "data-picker-focus": !0,
-              "data-component": T.key,
+              "data-component": N.key,
               draggable: !0,
               className: "studio-component-picker__row",
-              title: n.addLabel(T.label),
-              onClick: () => o(T),
-              onDragStart: (I) => x(T, I),
-              onDragEnd: C,
+              title: n.addLabel(N.label),
+              onClick: () => o(N),
+              onDragStart: (T) => x(N, T),
+              onDragEnd: S,
               children: [
                 /* @__PURE__ */ a("span", {
                   className: "studio-component-picker__badge",
                   "aria-hidden": "true",
-                  children: T.badge
+                  children: N.badge
                 }),
                 /* @__PURE__ */ b("span", {
                   className: "studio-component-picker__label",
                   children: [/* @__PURE__ */ a("span", {
                     className: "studio-component-picker__name",
-                    children: Dm(T.label, M.ranges).map((I, N) => I.marked ? /* @__PURE__ */ a("mark", { children: I.text }, N) : /* @__PURE__ */ a("span", { children: I.text }, N))
-                  }), M.via === "keyword" && M.keyword && /* @__PURE__ */ a("span", {
+                    children: Dm(N.label, A.ranges).map((T, C) => T.marked ? /* @__PURE__ */ a("mark", { children: T.text }, C) : /* @__PURE__ */ a("span", { children: T.text }, C))
+                  }), A.via === "keyword" && A.keyword && /* @__PURE__ */ a("span", {
                     className: "studio-component-picker__hint",
-                    children: n.viaKeyword(T.badge, r.trim(), M.keyword)
+                    children: n.viaKeyword(N.badge, r.trim(), A.keyword)
                   })]
                 }),
-                T.packageTitle && /* @__PURE__ */ a("span", {
+                N.packageTitle && /* @__PURE__ */ a("span", {
                   className: "studio-component-picker__package",
-                  children: T.packageTitle
+                  children: N.packageTitle
                 })
               ]
-            }) }, T.key))
+            }) }, N.key))
           })]
         }, y.id))
       }),
@@ -5330,14 +5350,14 @@ function gh(e, t, n, o = vh) {
     t,
     l
   ]), w = z(() => {
-    const C = !m;
-    p(C), f(void 0), o.write(u, C);
+    const S = !m;
+    p(S), f(void 0), o.write(u, S);
   }, [
     m,
     u,
     o
-  ]), P = z((C) => {
-    sh(C) && f(C);
+  ]), P = z((S) => {
+    sh(S) && f(S);
   }, []), x = z(() => f(void 0), []);
   return {
     available: g,
@@ -6216,34 +6236,34 @@ function zh(e, t, n) {
   const h = z((k) => {
     u.current = k, l(k);
   }, []), f = (k) => {
-    const y = u.current, { region: T } = k.target;
-    if (!y || !T.containerId) return;
-    const M = T.kind === Te.Container ? g(T.containerId) : T.index;
-    return $h(n.composition.roots, n.adapter, y, T.containerId, M);
+    const y = u.current, { region: N } = k.target;
+    if (!y || !N.containerId) return;
+    const A = N.kind === Te.Container ? g(N.containerId) : N.index;
+    return $h(n.composition.roots, n.adapter, y, N.containerId, A);
   }, g = (k) => {
     const y = [...n.composition.roots];
     for (; y.length > 0; ) {
-      const T = y.pop();
-      if (n.adapter.idOf(T) === k) return n.adapter.childrenOf(T).length;
-      y.push(...n.adapter.childrenOf(T));
+      const N = y.pop();
+      if (n.adapter.idOf(N) === k) return n.adapter.childrenOf(N).length;
+      y.push(...n.adapter.childrenOf(N));
     }
     return 0;
   }, m = (k) => {
-    const y = e.current.getBoundingClientRect(), T = jh(t(), k.clientX - y.left, k.clientY - y.top), M = k.target.closest("[data-scene-id], [data-studio-element]"), I = M?.dataset.sceneId ?? M?.dataset.studioElement, N = !!I && n.ownershipOf(I) !== ie.Local;
-    if (!T || N) return { denied: !0 };
+    const y = e.current.getBoundingClientRect(), N = jh(t(), k.clientX - y.left, k.clientY - y.top), A = k.target.closest("[data-scene-id], [data-studio-element]"), T = A?.dataset.sceneId ?? A?.dataset.studioElement, C = !!T && n.ownershipOf(T) !== ie.Local;
+    if (!N || C) return { denied: !0 };
     if (Jn(k)) {
-      const R = f(T), B = R ? n.validateMove(R) : oe.NodeNotFound;
-      if (B && B !== oe.NoChange) return { denied: !0 };
+      const _ = f(N), L = _ ? n.validateMove(_) : oe.NodeNotFound;
+      if (L && L !== oe.NoChange) return { denied: !0 };
     }
     return {
-      drop: T,
+      drop: N,
       denied: !1
     };
   }, v = (k, y) => {
-    const T = e.current.getBoundingClientRect();
+    const N = e.current.getBoundingClientRect();
     return {
-      left: k.clientX - T.left - y.container.left,
-      top: k.clientY - T.top - y.container.top
+      left: k.clientX - N.left - y.container.left,
+      top: k.clientY - N.top - y.container.top
     };
   };
   return {
@@ -6258,22 +6278,22 @@ function zh(e, t, n) {
       onDragOver: (k) => {
         if (!At(k) || (k.preventDefault(), p.current)) return;
         const y = m(k);
-        k.dataTransfer.dropEffect = y.denied ? "none" : Jn(k) ? "move" : "copy", i((T) => Wh(T, y) ? T : y);
+        k.dataTransfer.dropEffect = y.denied ? "none" : Jn(k) ? "move" : "copy", i((N) => Wh(N, y) ? N : y);
       },
       onDragLeave: (k) => {
         At(k) && (c.current = Math.max(0, c.current - 1), c.current === 0 && i(void 0));
       },
       onDrop: (k) => {
         if (!At(k)) return;
-        const y = _m(k), T = $m(k), { drop: M, denied: I } = m(k), N = M && y ? f(M) : void 0, R = p.current;
-        if (k.preventDefault(), d(), p.current = !1, R || I || !M) return;
+        const y = _m(k), N = $m(k), { drop: A, denied: T } = m(k), C = A && y ? f(A) : void 0, _ = p.current;
+        if (k.preventDefault(), d(), p.current = !1, _ || T || !A) return;
         if (y) {
-          N && n.move(N, v(k, M));
+          C && n.move(C, v(k, A));
           return;
         }
-        if (!T) return;
-        const { region: B } = M.target, S = B.containerId ?? void 0, E = B.kind === Te.Container ? void 0 : B.index, $ = v(k, M);
-        T.kind === "layout" ? n.insertLayout(T.item, S, E, $) : n.insertComponent(Ao(T.componentName, T.package), S, E, $);
+        if (!N) return;
+        const { region: L } = A.target, D = L.containerId ?? void 0, I = L.kind === Te.Container ? void 0 : L.index, F = v(k, A);
+        N.kind === "layout" ? n.insertLayout(N.item, D, I, F) : n.insertComponent(Ao(N.componentName, N.package), D, I, F);
       }
     }
   };
@@ -6473,89 +6493,89 @@ function ef({ anchor: e, bounds: t, size: n, prefer: o, gap: i = 6 }) {
   };
 }
 var Hi = [
-  _.target,
-  _.slot,
-  _.slice,
-  _.emphasis
+  $.target,
+  $.slot,
+  $.slice,
+  $.emphasis
 ], tf = [
-  _.moveEarlier,
-  _.moveLater,
-  _.addSubItem,
-  _.duplicate,
-  _.delete
+  $.moveEarlier,
+  $.moveLater,
+  $.addSubItem,
+  $.duplicate,
+  $.delete
 ], nf = {
-  [_.target]: /* @__PURE__ */ a(fc, { "aria-hidden": "true" }),
-  [_.slot]: /* @__PURE__ */ a(gc, { "aria-hidden": "true" }),
-  [_.slice]: /* @__PURE__ */ a(yc, { "aria-hidden": "true" })
+  [$.target]: /* @__PURE__ */ a(fc, { "aria-hidden": "true" }),
+  [$.slot]: /* @__PURE__ */ a(gc, { "aria-hidden": "true" }),
+  [$.slice]: /* @__PURE__ */ a(yc, { "aria-hidden": "true" })
 }, of = {
-  [_.moveEarlier]: /* @__PURE__ */ a(uc, { "aria-hidden": "true" }),
-  [_.moveLater]: /* @__PURE__ */ a(pc, { "aria-hidden": "true" }),
-  [_.addSubItem]: /* @__PURE__ */ a(hc, { "aria-hidden": "true" }),
-  [_.duplicate]: /* @__PURE__ */ a(mc, { "aria-hidden": "true" }),
-  [_.delete]: /* @__PURE__ */ a(bc, { "aria-hidden": "true" })
+  [$.moveEarlier]: /* @__PURE__ */ a(uc, { "aria-hidden": "true" }),
+  [$.moveLater]: /* @__PURE__ */ a(pc, { "aria-hidden": "true" }),
+  [$.addSubItem]: /* @__PURE__ */ a(hc, { "aria-hidden": "true" }),
+  [$.duplicate]: /* @__PURE__ */ a(mc, { "aria-hidden": "true" }),
+  [$.delete]: /* @__PURE__ */ a(bc, { "aria-hidden": "true" })
 }, rf = ({ subject: e, item: t, anchor: n, bounds: o, strings: i, renameToken: r, chipLabel: s, onRename: l, onAction: c, onChoice: u, readOnlyActions: d, onReadOnlyAction: p, onLeave: h }) => {
   const f = V(null), g = V(null), [m, v] = j({
     width: 380,
     height: 100
-  }), [w, P] = j(t.label), [x, C] = j(0), k = e.mode.itemToolbar, y = k.some((D) => D.compact === !0), T = k.some((D) => Hi.includes(D.id)), M = k.find((D) => D.id === _.rename), I = M && Ft(M, t);
+  }), [w, P] = j(t.label), [x, S] = j(0), k = e.mode.itemToolbar, y = k.some((R) => R.compact === !0), N = k.some((R) => Hi.includes(R.id)), A = k.find((R) => R.id === $.rename), T = A && Ft(A, t);
   ce(() => {
     P(t.label);
   }, [t.id, t.label]), ce(() => {
     r === 0 || !g.current || (g.current.focus({ preventScroll: !0 }), g.current.select());
   }, [r, t.id]), Se(() => {
-    const D = f.current?.getBoundingClientRect();
-    D && (Math.round(D.width) !== Math.round(m.width) || Math.round(D.height) !== Math.round(m.height)) && v({
-      width: D.width,
-      height: D.height
+    const R = f.current?.getBoundingClientRect();
+    R && (Math.round(R.width) !== Math.round(m.width) || Math.round(R.height) !== Math.round(m.height)) && v({
+      width: R.width,
+      height: R.height
     });
   });
-  const N = e.source.kind === "elements" ? "above" : "below", R = ef({
+  const C = e.source.kind === "elements" ? "above" : "below", _ = ef({
     anchor: n,
     bounds: o,
     size: m,
-    prefer: N
-  }), B = V(!1), S = () => {
-    const D = w.trim();
-    D !== "" && D !== t.label ? l(D) : P(t.label);
-  }, E = (D) => {
-    D.key === "Enter" && (D.preventDefault(), S(), B.current = !0, h()), D.key === "Escape" && (D.preventDefault(), D.stopPropagation(), P(t.label), B.current = !0, h());
-  }, $ = () => {
-    if (B.current) {
-      B.current = !1;
+    prefer: C
+  }), L = V(!1), D = () => {
+    const R = w.trim();
+    R !== "" && R !== t.label ? l(R) : P(t.label);
+  }, I = (R) => {
+    R.key === "Enter" && (R.preventDefault(), D(), L.current = !0, h()), R.key === "Escape" && (R.preventDefault(), R.stopPropagation(), P(t.label), L.current = !0, h());
+  }, F = () => {
+    if (L.current) {
+      L.current = !1;
       return;
     }
-    S();
-  }, A = () => Array.from(f.current?.querySelectorAll("[data-roving]:not(:disabled)") ?? []), q = (D) => {
-    if (D.target instanceof HTMLInputElement) return;
-    const ee = A(), he = ee.indexOf(D.target);
+    D();
+  }, M = () => Array.from(f.current?.querySelectorAll("[data-roving]:not(:disabled)") ?? []), q = (R) => {
+    if (R.target instanceof HTMLInputElement) return;
+    const ee = M(), he = ee.indexOf(R.target);
     if (he < 0) return;
-    const J = D.key === "ArrowRight" || D.key === "ArrowDown" ? he + 1 : D.key === "ArrowLeft" || D.key === "ArrowUp" ? he - 1 : D.key === "Home" ? 0 : D.key === "End" ? ee.length - 1 : void 0;
-    if (J === void 0 || D.altKey) return;
-    D.preventDefault();
+    const J = R.key === "ArrowRight" || R.key === "ArrowDown" ? he + 1 : R.key === "ArrowLeft" || R.key === "ArrowUp" ? he - 1 : R.key === "Home" ? 0 : R.key === "End" ? ee.length - 1 : void 0;
+    if (J === void 0 || R.altKey) return;
+    R.preventDefault();
     const ae = ee[(J + ee.length) % ee.length];
-    C(Number(ae.dataset.roving)), ae.focus();
+    S(Number(ae.dataset.roving)), ae.focus();
   }, ne = {
     ref: f,
     role: "toolbar",
     "aria-label": i.toolbarLabel(t.label),
     className: "studio-design-toolbar",
-    "data-side": R.side,
+    "data-side": _.side,
     "data-compact": y ? "true" : void 0,
     "data-kind": e.source.kind,
     style: {
-      left: R.left,
-      top: R.top
+      left: _.left,
+      top: _.top
     },
     onKeyDown: q
   };
   if (t.readOnly) {
-    const D = t.origin ? i.inheritedFrom(t.origin) : i.readOnlyReasons[t.readOnlyReason ?? ""] ?? t.readOnlyReason ?? "";
+    const R = t.origin ? i.inheritedFrom(t.origin) : i.readOnlyReasons[t.readOnlyReason ?? ""] ?? t.readOnlyReason ?? "";
     return /* @__PURE__ */ b("div", {
       ...ne,
       "data-read-only": "true",
       children: [/* @__PURE__ */ b("span", {
         className: "studio-design-toolbar__reason",
-        children: [/* @__PURE__ */ a(Er, { "aria-hidden": "true" }), /* @__PURE__ */ a("span", { children: D })]
+        children: [/* @__PURE__ */ a(Er, { "aria-hidden": "true" }), /* @__PURE__ */ a("span", { children: R })]
       }), d.map((ee, he) => /* @__PURE__ */ a("button", {
         type: "button",
         className: "studio-design-toolbar__text-action",
@@ -6569,44 +6589,44 @@ var Hi = [
   }
   let ye = 0;
   const me = () => {
-    const D = ye++;
+    const R = ye++;
     return {
-      "data-roving": D,
-      tabIndex: x === D ? 0 : -1
+      "data-roving": R,
+      tabIndex: x === R ? 0 : -1
     };
-  }, ue = k.filter((D) => Hi.includes(D.id) && Ft(D, t).visible), Ie = tf.flatMap((D) => k.filter((ee) => ee.id === D)).filter((D) => Ft(D, t).visible);
+  }, ue = k.filter((R) => Hi.includes(R.id) && Ft(R, t).visible), Ie = tf.flatMap((R) => k.filter((ee) => ee.id === R)).filter((R) => Ft(R, t).visible);
   return /* @__PURE__ */ b("div", {
     ...ne,
     children: [
-      I?.visible && /* @__PURE__ */ a("input", {
+      T?.visible && /* @__PURE__ */ a("input", {
         ref: g,
         type: "text",
         className: "studio-design-toolbar__title",
         value: w,
         "aria-label": i.titleField,
         "data-action": "rename",
-        onChange: (D) => P(D.target.value),
-        onBlur: $,
-        onKeyDown: E,
-        onFocus: (D) => D.currentTarget.select()
+        onChange: (R) => P(R.target.value),
+        onBlur: F,
+        onKeyDown: I,
+        onFocus: (R) => R.currentTarget.select()
       }),
-      I?.visible && T && /* @__PURE__ */ a("span", {
+      T?.visible && N && /* @__PURE__ */ a("span", {
         className: "studio-design-toolbar__divider",
         "aria-hidden": "true"
       }),
       ue.length > 0 && /* @__PURE__ */ a("div", {
         className: "studio-design-toolbar__chips",
-        children: ue.map((D) => /* @__PURE__ */ b("button", {
+        children: ue.map((R) => /* @__PURE__ */ b("button", {
           type: "button",
           className: "studio-design-toolbar__chip",
-          "data-action": D.id,
-          title: D.title,
-          "data-unlinked": D.id !== _.emphasis && t.unlinked && D.id !== _.slot ? "true" : void 0,
+          "data-action": R.id,
+          title: R.title,
+          "data-unlinked": R.id !== $.emphasis && t.unlinked && R.id !== $.slot ? "true" : void 0,
           "aria-haspopup": "dialog",
           ...me(),
-          onClick: (ee) => u(D.id, ee.currentTarget),
-          children: [nf[D.id], /* @__PURE__ */ a("span", { children: s(D.id, t) })]
-        }, D.id))
+          onClick: (ee) => u(R.id, ee.currentTarget),
+          children: [nf[R.id], /* @__PURE__ */ a("span", { children: s(R.id, t) })]
+        }, R.id))
       }),
       ue.length > 0 && Ie.length > 0 && /* @__PURE__ */ a("span", {
         className: "studio-design-toolbar__divider",
@@ -6614,19 +6634,19 @@ var Hi = [
       }),
       Ie.length > 0 && /* @__PURE__ */ a("div", {
         className: "studio-design-toolbar__actions",
-        children: Ie.map((D) => {
-          const ee = Ft(D, t);
+        children: Ie.map((R) => {
+          const ee = Ft(R, t);
           return /* @__PURE__ */ a("button", {
             type: "button",
             className: "studio-design-toolbar__button",
-            "data-action": D.id,
-            title: D.title,
-            "aria-label": D.title,
+            "data-action": R.id,
+            title: R.title,
+            "aria-label": R.title,
             disabled: !ee.enabled,
             ...me(),
-            onClick: () => c(D.id),
-            children: of[D.id]
-          }, D.id);
+            onClick: () => c(R.id),
+            children: of[R.id]
+          }, R.id);
         })
       })
     ]
@@ -6699,28 +6719,28 @@ function lf(e, t) {
   }, [t]), sf);
 }
 var xn = 34, cf = ({ surface: e, state: t, controller: n, environment: o, editorStrings: i, strings: r }) => {
-  const { subject: s } = t, l = lf(e, s), [c, u] = j(), d = o.propertyEditors?.registry ?? nn, p = U(() => So(o.availableSources), [o.availableSources]), h = z((E) => {
-    if (typeof E != "string" || E === "") return;
-    const $ = o.propertyEditors?.slices?.find((q) => q.id === E) ?? o.stateChangeSlices.find((q) => q.id === E), A = E.split(".");
-    return $?.name ?? A[A.length - 1];
-  }, [o]), f = z((E, $) => {
-    const A = $.chips?.[E];
-    if (A !== void 0 && A !== "") return A;
-    switch (E) {
-      case _.slice:
-        return h($.values.slice) ?? r.chooseSlice;
-      case _.emphasis:
-        return r.emphasis[String($.values.emphasis ?? "secondary").toLowerCase()] ?? String($.values.emphasis ?? "");
-      case _.slot:
-        return typeof $.values.slot == "string" && $.values.slot !== "" ? $.values.slot : r.mainArea;
+  const { subject: s } = t, l = lf(e, s), [c, u] = j(), d = o.propertyEditors?.registry ?? nn, p = U(() => So(o.availableSources), [o.availableSources]), h = z((I) => {
+    if (typeof I != "string" || I === "") return;
+    const F = o.propertyEditors?.slices?.find((q) => q.id === I) ?? o.stateChangeSlices.find((q) => q.id === I), M = I.split(".");
+    return F?.name ?? M[M.length - 1];
+  }, [o]), f = z((I, F) => {
+    const M = F.chips?.[I];
+    if (M !== void 0 && M !== "") return M;
+    switch (I) {
+      case $.slice:
+        return h(F.values.slice) ?? r.chooseSlice;
+      case $.emphasis:
+        return r.emphasis[String(F.values.emphasis ?? "secondary").toLowerCase()] ?? String(F.values.emphasis ?? "");
+      case $.slot:
+        return typeof F.values.slot == "string" && F.values.slot !== "" ? F.values.slot : r.mainArea;
       default:
         return r.notLinked;
     }
   }, [h, r]), g = s?.selected?.parentId !== void 0 && l !== void 0 && l.items[s.selected.id] === void 0, m = s?.selected?.parentId;
   if (ce(() => {
     if (!g || !m) return;
-    const E = e.current?.querySelector(`[data-scene-nav-item="${CSS.escape(m)}"] > [data-scene-nav-link]`);
-    E && (E.focus({ preventScroll: !0 }), E.dispatchEvent(new KeyboardEvent("keydown", {
+    const I = e.current?.querySelector(`[data-scene-nav-item="${CSS.escape(m)}"] > [data-scene-nav-link]`);
+    I && (I.focus({ preventScroll: !0 }), I.dispatchEvent(new KeyboardEvent("keydown", {
       key: "ArrowRight",
       bubbles: !0,
       cancelable: !0
@@ -6730,13 +6750,13 @@ var xn = 34, cf = ({ surface: e, state: t, controller: n, environment: o, editor
     m,
     e
   ]), !s || !l) return null;
-  const { selected: v, source: w } = s, P = s.mode.addActions[0], x = w.items.flatMap((E) => l.items[E.id] ? [l.items[E.id]] : []), C = x[x.length - 1], k = s.mode.itemToolbar.some((E) => E.compact === !0), y = C ?? l.component, T = y && P ? k || !C ? {
-    left: (C ?? y).left,
-    top: (C ? C.top + C.height : y.top) + 8
+  const { selected: v, source: w } = s, P = s.mode.addActions[0], x = w.items.flatMap((I) => l.items[I.id] ? [l.items[I.id]] : []), S = x[x.length - 1], k = s.mode.itemToolbar.some((I) => I.compact === !0), y = S ?? l.component, N = y && P ? k || !S ? {
+    left: (S ?? y).left,
+    top: (S ? S.top + S.height : y.top) + 8
   } : {
-    left: C.left + C.width + 8,
-    top: C.top + (C.height - xn) / 2
-  } : void 0, M = v ? l.items[v.id] : void 0, I = c && v && c.itemId === v.id ? w.choice(c.actionId, v) : void 0, N = () => u(void 0), R = () => Io({
+    left: S.left + S.width + 8,
+    top: S.top + (S.height - xn) / 2
+  } : void 0, A = v ? l.items[v.id] : void 0, T = c && v && c.itemId === v.id ? w.choice(c.actionId, v) : void 0, C = () => u(void 0), _ = () => Io({
     controller: n,
     environment: o,
     strings: i,
@@ -6745,67 +6765,67 @@ var xn = 34, cf = ({ surface: e, state: t, controller: n, environment: o, editor
     inCanvas: !1,
     bindingScope: p,
     slotNames: da(r.navigation)
-  }), B = (E, $) => {
-    if (!I) return;
-    const A = I.plan($);
-    ia(A) || u(void 0), t.perform(A);
-  }, S = M;
+  }), L = (I, F) => {
+    if (!T) return;
+    const M = T.plan(F);
+    ia(M) || u(void 0), t.perform(M);
+  }, D = A;
   return /* @__PURE__ */ b(le, { children: [
-    T && P && /* @__PURE__ */ a("button", {
+    N && P && /* @__PURE__ */ a("button", {
       type: "button",
       className: "studio-design-add",
       "data-action": P.id,
       "aria-label": P.label,
       title: P.label,
       style: {
-        left: T.left,
-        top: T.top,
+        left: N.left,
+        top: N.top,
         width: xn,
         height: xn
       },
       onClick: () => t.add(P.id),
       children: /* @__PURE__ */ a(vc, { "aria-hidden": "true" })
     }),
-    v && S && /* @__PURE__ */ a(rf, {
+    v && D && /* @__PURE__ */ a(rf, {
       subject: s,
       item: v,
-      anchor: S,
+      anchor: D,
       bounds: l.surface,
       strings: r,
       renameToken: t.renameToken,
       chipLabel: f,
-      onRename: (E) => t.rename(v, E),
-      onAction: (E) => t.act(E, v),
-      onChoice: (E, $) => u((A) => A && A.actionId === E && A.itemId === v.id ? void 0 : {
-        actionId: E,
+      onRename: (I) => t.rename(v, I),
+      onAction: (I) => t.act(I, v),
+      onChoice: (I, F) => u((M) => M && M.actionId === I && M.itemId === v.id ? void 0 : {
+        actionId: I,
         itemId: v.id,
-        opener: $
+        opener: F
       }),
       readOnlyActions: w.readOnlyActions(v),
-      onReadOnlyAction: (E) => t.perform(E.plan()),
+      onReadOnlyAction: (I) => t.perform(I.plan()),
       onLeave: () => e.current?.focus({ preventScroll: !0 })
     }, v.id),
-    I && c && S && /* @__PURE__ */ a(Zh, {
+    T && c && D && /* @__PURE__ */ a(Zh, {
       registry: d,
-      property: I.property,
-      context: R(),
+      property: T.property,
+      context: _(),
       componentId: v.id,
       anchor: df(e, c.opener),
       opener: c.opener,
       bounds: l.surface,
-      title: s.mode.itemToolbar.find((E) => E.id === c.actionId)?.title ?? c.actionId,
+      title: s.mode.itemToolbar.find((I) => I.id === c.actionId)?.title ?? c.actionId,
       strings: r,
-      onChange: B,
-      onClose: N
+      onChange: L,
+      onClose: C
     }),
-    v && M && s.source.kind === "region" && /* @__PURE__ */ a("div", {
+    v && A && s.source.kind === "region" && /* @__PURE__ */ a("div", {
       className: "studio-design-item-ring",
       "data-item": v.id,
       style: {
-        left: M.left - 2,
-        top: M.top - 2,
-        width: M.width + 4,
-        height: M.height + 4
+        left: A.left - 2,
+        top: A.top - 2,
+        width: A.width + 4,
+        height: A.height + 4
       }
     }),
     t.notice !== "" && /* @__PURE__ */ a("div", {
@@ -6964,9 +6984,9 @@ function bf(e, t, n) {
   if (e.altKey && !e.ctrlKey && !e.metaKey) {
     const l = e.key === "ArrowUp" || e.key === "ArrowLeft", c = e.key === "ArrowDown" || e.key === "ArrowRight";
     if (l || c)
-      return t.act(l ? _.moveEarlier : _.moveLater, s), r();
+      return t.act(l ? $.moveEarlier : $.moveLater, s), r();
   }
-  return ko(e) ? (t.act(_.delete, s), r()) : !1;
+  return ko(e) ? (t.act($.delete, s), r()) : !1;
 }
 function Ma(e, t, n) {
   if (e.id === t) return n;
@@ -6987,55 +7007,55 @@ var yf = () => {
   button: "Button",
   item: "New item"
 }, kf = ({ controller: e, environment: t, resolveBinding: n = yf, configuration: o, strings: i, editorStrings: r, viewportHeight: s, shell: l }) => {
-  const c = V(null), { composition: u, dropRegions: d, selectedId: p } = e, { selectionRect: h, measureNow: f } = Gh(c, d, p), { feedback: g, draggedId: m, startMoving: v, endMoving: w, handlers: P } = zh(c, f, e), [x, C] = j(), k = _h(e, t), { document: y, context: T } = e, M = U(() => o ?? (y.instanceContributions.length > 0 ? mr(mo(y, T.scope), y.instanceContributions, T.catalog) : void 0), [
+  const c = V(null), { composition: u, dropRegions: d, selectedId: p } = e, { selectionRect: h, measureNow: f } = Gh(c, d, p), { feedback: g, draggedId: m, startMoving: v, endMoving: w, handlers: P } = zh(c, f, e), [x, S] = j(), k = _h(e, t), { document: y, context: N } = e, A = U(() => o ?? (y.instanceContributions.length > 0 ? mr(mo(y, N.scope), y.instanceContributions, N.catalog) : void 0), [
     o,
     y,
-    T
-  ]), I = r?.designMode ?? Oo, N = t.destinations[0], R = U(() => N ? { screen: N.id } : void 0, [N]), B = pm({
+    N
+  ]), T = r?.designMode ?? Oo, C = t.destinations[0], _ = U(() => C ? { screen: C.id } : void 0, [C]), L = pm({
     controller: e,
     environment: t,
-    strings: I,
+    strings: T,
     startingLabels: wf,
-    ...R ? { startingDestination: R } : {}
+    ..._ ? { startingDestination: _ } : {}
   });
   Se(() => {
     const J = c.current?.closest("[data-studio-viewport]") ?? c.current?.parentElement;
     if (s !== void 0 || !J || typeof ResizeObserver > "u") return;
-    const ae = new ResizeObserver(() => C(J.clientHeight));
-    return C(J.clientHeight), ae.observe(J), () => ae.disconnect();
+    const ae = new ResizeObserver(() => S(J.clientHeight));
+    return S(J.clientHeight), ae.observe(J), () => ae.disconnect();
   }, [s]);
-  const S = (J) => {
+  const D = (J) => {
     if (J.key === "Escape" && l?.peeking) {
       J.preventDefault(), l.back();
       return;
     }
-    bf(J, B, () => {
+    bf(J, L, () => {
       const ae = c.current?.querySelector(".studio-design-toolbar__title");
       return ae?.focus({ preventScroll: !0 }), !!ae;
     }) || !ko(J) || !e.selectedId || !e.canRemove(e.selectedId) || (J.preventDefault(), e.remove(e.selectedId));
-  }, E = !!e.selectedId && e.ownershipOf(e.selectedId) === ie.Local && e.canRemove(e.selectedId), $ = e.selection && (e.selection.name || e.selection.componentName) || "";
+  }, I = !!e.selectedId && e.ownershipOf(e.selectedId) === ie.Local && e.canRemove(e.selectedId), F = e.selection && (e.selection.name || e.selection.componentName) || "";
   Xh(c, (J, ae) => {
-    e.select(J), B.pointItem(J, ae);
+    e.select(J), L.pointItem(J, ae);
   }, l?.frame !== void 0);
-  const { setMeasurer: A } = e;
-  ce(() => (A((J) => {
+  const { setMeasurer: M } = e;
+  ce(() => (M((J) => {
     const ae = c.current;
     if (!ae) return;
-    const F = ae.getBoundingClientRect(), W = ae.querySelector(`[data-studio-element="${CSS.escape(J)}"]`)?.closest("[data-scene-placement]")?.getBoundingClientRect();
+    const E = ae.getBoundingClientRect(), W = ae.querySelector(`[data-studio-element="${CSS.escape(J)}"]`)?.closest("[data-scene-placement]")?.getBoundingClientRect();
     if (W && W.width > 0 && W.height > 0) return {
-      left: W.left - F.left,
-      top: W.top - F.top,
+      left: W.left - E.left,
+      top: W.top - E.top,
       width: W.width,
       height: W.height
     };
-    const L = Le(ae, J, F);
-    return L && {
-      left: L.left,
-      top: L.top,
-      width: L.width,
-      height: L.height
+    const B = Le(ae, J, E);
+    return B && {
+      left: B.left,
+      top: B.top,
+      width: B.width,
+      height: B.height
     };
-  }), () => A(void 0)), [A]);
+  }), () => M(void 0)), [M]);
   const q = U(() => go(u.element, t.runtime.compositionProfile, t.runtime.packages), [
     u,
     t.runtime.compositionProfile,
@@ -7048,7 +7068,7 @@ var yf = () => {
     q,
     ne,
     ye
-  ]), ue = U(() => xh(t.runtime.registry, i), [t.runtime.registry, i]), Ie = U(() => jo(t.runtime), [t.runtime]), D = U(() => /* @__PURE__ */ a(yr, {
+  ]), ue = U(() => xh(t.runtime.registry, i), [t.runtime.registry, i]), Ie = U(() => jo(t.runtime), [t.runtime]), R = U(() => /* @__PURE__ */ a(yr, {
     registry: t.runtime.iconAdapters,
     children: /* @__PURE__ */ a(fr, {
       storage: null,
@@ -7056,14 +7076,14 @@ var yf = () => {
         structure: e.structure,
         navigation: e.navigation,
         module: e.navigationModule,
-        logoLockedReason: I.navigation.logoLocked,
+        logoLockedReason: T.navigation.logoLocked,
         onNavigate: l?.frame ? l.navigate : void 0,
         peeking: ne ? l?.peekingName : void 0,
         children: /* @__PURE__ */ a(vo, {
           element: me,
           registry: ue,
           resolveBinding: n,
-          configuration: M
+          configuration: A
         })
       })
     })
@@ -7072,7 +7092,7 @@ var yf = () => {
     ue,
     t.runtime.iconAdapters,
     n,
-    M,
+    A,
     e.structure,
     e.navigation,
     e.navigationModule,
@@ -7092,10 +7112,10 @@ var yf = () => {
       className: "studio-screen-surface",
       style: he,
       "data-studio-dragging": g ? "true" : void 0,
-      onKeyDown: S,
+      onKeyDown: D,
       tabIndex: -1,
       ...P,
-      children: [D, /* @__PURE__ */ b("div", {
+      children: [R, /* @__PURE__ */ b("div", {
         className: "studio-screen-surface__chrome",
         children: [
           h && /* @__PURE__ */ a("div", {
@@ -7103,7 +7123,7 @@ var yf = () => {
             "data-moving": m === e.selectedId ? "true" : void 0,
             style: h
           }),
-          h && E && /* @__PURE__ */ a("div", {
+          h && I && /* @__PURE__ */ a("div", {
             className: "studio-screen-surface__grip",
             style: {
               left: h.left,
@@ -7111,9 +7131,9 @@ var yf = () => {
             },
             draggable: !0,
             "aria-hidden": "true",
-            title: i.moveHandle($),
+            title: i.moveHandle(F),
             onDragStart: (J) => {
-              v(e.selectedId), Am(J, e.selectedId, $);
+              v(e.selectedId), Am(J, e.selectedId, F);
             },
             onDragEnd: w,
             children: /* @__PURE__ */ a(Al, { "aria-hidden": "true" })
@@ -7129,15 +7149,15 @@ var yf = () => {
           /* @__PURE__ */ a(mf, {
             surface: c,
             controller: e,
-            strings: I
+            strings: T
           }),
           r && /* @__PURE__ */ a(cf, {
             surface: c,
-            state: B,
+            state: L,
             controller: e,
             environment: t,
             editorStrings: r,
-            strings: I
+            strings: T
           }),
           /* @__PURE__ */ a("span", {
             className: "studio-screen-surface__announcement",
@@ -7653,14 +7673,14 @@ var Vf = { modules: [] }, Jf = (e, t) => oo(e, t)?.id;
 function Ua(e, t, n, o) {
   const [i, r] = j(() => Rf(e.document)), s = V(void 0);
   s.current ??= new Df(i, r);
-  const l = z((F) => s.current.commit(F), []), [c, u] = j(), [d, p] = j(), [h, f] = j(n.navigation?.module), g = V(void 0), m = z((F, W) => {
-    const L = g.current?.(F), G = g.current?.(W);
-    return L && G ? {
-      height: L.height,
-      bottom: L.top + L.height - G.top
+  const l = z((E) => s.current.commit(E), []), [c, u] = j(), [d, p] = j(), [h, f] = j(n.navigation?.module), g = V(void 0), m = z((E, W) => {
+    const B = g.current?.(E), G = g.current?.(W);
+    return B && G ? {
+      height: B.height,
+      bottom: B.top + B.height - G.top
     } : void 0;
-  }, []), v = z((F) => {
-    g.current = F;
+  }, []), v = z((E) => {
+    g.current = E;
   }, []), w = Kf(n.runtime.icons), P = U(() => ({
     catalog: n.runtime.catalog,
     scope: $n(t, t !== void 0),
@@ -7670,87 +7690,87 @@ function Ua(e, t, n, o) {
     n,
     t,
     w
-  ]), x = U(() => no(i.document, t), [i.document, t]), C = U(() => qf(i.document, x.roots, P), [
+  ]), x = U(() => no(i.document, t), [i.document, t]), S = U(() => qf(i.document, x.roots, P), [
     i.document,
     x,
     P
-  ]), k = U(() => Uf(C), [C]), y = ft(i.document, t), T = U(() => Of(x.roots, Wf(y), k).filter((F) => F.containerId !== null), [
+  ]), k = U(() => Uf(S), [S]), y = ft(i.document, t), N = U(() => Of(x.roots, Wf(y), k).filter((E) => E.containerId !== null), [
     x,
     y,
     k
-  ]), M = c ? ze(x.roots, c) : void 0, I = U(() => c ? co(i.document, re(c), P) : void 0, [
+  ]), A = c ? ze(x.roots, c) : void 0, T = U(() => c ? co(i.document, re(c), P) : void 0, [
     i.document,
     c,
     P
-  ]), N = z((F, W) => {
-    const L = s.current.current, G = l((te) => Ff(te, F, P, W));
+  ]), C = z((E, W) => {
+    const B = s.current.current, G = l((te) => Ff(te, E, P, W));
     return {
-      applied: G.undoable.length > L.undoable.length || G.document !== L.document,
+      applied: G.undoable.length > B.undoable.length || G.document !== B.document,
       diagnostics: G.diagnostics
     };
-  }, [l, P]), R = z((F, W) => {
-    N(F, W);
-  }, [N]), B = z((F, W) => {
-    const L = s.current.current, G = l((te) => Ef(te, F, P, W));
+  }, [l, P]), _ = z((E, W) => {
+    C(E, W);
+  }, [C]), L = z((E, W) => {
+    const B = s.current.current, G = l((te) => Ef(te, E, P, W));
     return {
-      applied: G.document !== L.document,
+      applied: G.document !== B.document,
       diagnostics: G.diagnostics
     };
-  }, [l, P]), S = z((F, W) => {
-    const L = F ?? y?.id, G = L ? ze(x.roots, L)?.children ?? [] : [];
+  }, [l, P]), D = z((E, W) => {
+    const B = E ?? y?.id, G = B ? ze(x.roots, B)?.children ?? [] : [];
     return {
-      parent: L,
+      parent: B,
       index: W ?? G.length
     };
-  }, [y, x]), E = V(o);
-  E.current = o;
-  const $ = z((F, W, L, G, te, de) => {
-    const Be = S(W, L);
+  }, [y, x]), I = V(o);
+  I.current = o;
+  const F = z((E, W, B, G, te, de) => {
+    const Be = D(W, B);
     if (!Be.parent) return;
-    const Ye = ze(no(s.current.current.document, t).roots, Be.parent), Va = Ye && ut(Ye) ? $a(F, te ?? _a(ja(Ye, m))) : F;
-    N(Ba(Be.parent, Be.index, Va), G).applied && (u(F.id), de && E.current?.(de));
+    const Ye = ze(no(s.current.current.document, t).roots, Be.parent), Va = Ye && ut(Ye) ? $a(E, te ?? _a(ja(Ye, m))) : E;
+    C(Ba(Be.parent, Be.index, Va), G).applied && (u(E.id), de && I.current?.(de));
   }, [
-    N,
-    S,
+    C,
+    D,
     t,
     m
-  ]), A = z((F, W) => {
-    const L = Pf(x.roots, F, W, m), G = Qi(x.roots, F, k);
-    if (G && !(G === oe.NoChange && L && F.targetParentId === Jf(x.roots, F.nodeId))) return G;
-    if (L) return B(L, "Move").applied ? void 0 : oe.NodeLocked;
-    const te = Tf(F);
-    return te ? N(te, "Move").applied ? void 0 : oe.NodeLocked : oe.TargetNotContainer;
+  ]), M = z((E, W) => {
+    const B = Pf(x.roots, E, W, m), G = Qi(x.roots, E, k);
+    if (G && !(G === oe.NoChange && B && E.targetParentId === Jf(x.roots, E.nodeId))) return G;
+    if (B) return L(B, "Move").applied ? void 0 : oe.NodeLocked;
+    const te = Tf(E);
+    return te ? C(te, "Move").applied ? void 0 : oe.NodeLocked : oe.TargetNotContainer;
   }, [
     x,
     k,
-    N,
-    B
-  ]), q = z((F, W) => {
-    l((L) => {
-      const G = L.document.screens.map((te) => te.name === "Screen" ? {
+    C,
+    L
+  ]), q = z((E, W) => {
+    l((B) => {
+      const G = B.document.screens.map((te) => te.name === "Screen" ? {
         ...te,
-        forms: F
+        forms: E
       } : te);
-      return Pe(L, {
-        ...L.document,
+      return Pe(B, {
+        ...B.document,
         screens: G
       }, W);
     });
-  }, [l]), ne = z((F, W, L) => {
+  }, [l]), ne = z((E, W, B) => {
     l((G) => {
-      const te = G.document.screenTemplates.map((de) => de.name === F ? {
+      const te = G.document.screenTemplates.map((de) => de.name === E ? {
         ...de,
         outlets: W
       } : de);
       return Pe(G, {
         ...G.document,
         screenTemplates: te
-      }, L);
+      }, B);
     });
-  }, [l]), ye = z((F, W, L) => {
+  }, [l]), ye = z((E, W, B) => {
     l((G) => {
       const te = G.document.screenTemplates.map((de) => {
-        if (de.name !== F) return de;
+        if (de.name !== E) return de;
         const { metadata: Be, ...Ye } = de;
         return W ? {
           ...Ye,
@@ -7760,31 +7780,31 @@ function Ua(e, t, n, o) {
       return Pe(G, {
         ...G.document,
         screenTemplates: te
-      }, L);
+      }, B);
     });
-  }, [l]), me = z((F, W) => {
-    l((L) => Pe(L, {
-      ...L.document,
-      dialogTemplates: F
+  }, [l]), me = z((E, W) => {
+    l((B) => Pe(B, {
+      ...B.document,
+      dialogTemplates: E
     }, W));
-  }, [l]), ue = z((F, W, L, G, te) => {
-    l((de) => Pe(de, Ji(de.document, F, (Be) => Qf(Be, W, L, G)), te));
-  }, [l]), Ie = z((F, W) => {
-    const L = n.runtime.bundles.flatMap((G) => G.screenTemplates ?? []);
-    l((G) => Pe(G, Sf(G.document, F, L), W));
-  }, [l, n.runtime.bundles]), D = z((F, W, L) => {
-    l((G) => Pe(G, Ji(G.document, F, (te) => {
+  }, [l]), ue = z((E, W, B, G, te) => {
+    l((de) => Pe(de, Ji(de.document, E, (Be) => Qf(Be, W, B, G)), te));
+  }, [l]), Ie = z((E, W) => {
+    const B = n.runtime.bundles.flatMap((G) => G.screenTemplates ?? []);
+    l((G) => Pe(G, Sf(G.document, E, B), W));
+  }, [l, n.runtime.bundles]), R = z((E, W, B) => {
+    l((G) => Pe(G, Ji(G.document, E, (te) => {
       W ? te.behaviors = W : delete te.behaviors;
-    }), L));
-  }, [l]), ee = U(() => Ti(i.document), [i.document]), he = n.navigation?.structure ?? Vf, J = z((F, W) => {
-    const L = Os(Ti(s.current.current.document), F);
-    return L.applied ? (l((G) => Pe(G, tm(G.document, L.model), W)), { applied: !0 }) : {
+    }), B));
+  }, [l]), ee = U(() => Ti(i.document), [i.document]), he = n.navigation?.structure ?? Vf, J = z((E, W) => {
+    const B = Os(Ti(s.current.current.document), E);
+    return B.applied ? (l((G) => Pe(G, tm(G.document, B.model), W)), { applied: !0 }) : {
       applied: !1,
-      rejected: L.rejected
+      rejected: B.rejected
     };
-  }, [l]), ae = z((F, W) => {
-    p(F && W ? {
-      componentId: F,
+  }, [l]), ae = z((E, W) => {
+    p(E && W ? {
+      componentId: E,
       itemId: W
     } : void 0);
   }, []);
@@ -7800,34 +7820,34 @@ function Ua(e, t, n, o) {
     composition: x,
     context: P,
     selectedId: c,
-    selection: M,
-    inspection: I,
+    selection: A,
+    inspection: T,
     diagnostics: i.diagnostics,
     adapter: k,
-    ownershipOf: C,
-    dropRegions: T,
+    ownershipOf: S,
+    dropRegions: N,
     select: u,
     setMeasurer: v,
-    apply: R,
-    tryApply: N,
-    applyAll: B,
-    move: A,
-    validateMove: (F) => Qi(x.roots, F, k),
-    insertComponent: (F, W, L, G) => $(la(Nt(), F, F), W, L, "Add", G, F),
-    insertLayout: (F, W, L, G) => $(Yt(F, Nt(), F), W, L, "Add layout", G, `layout:${F}`),
-    remove: (F) => {
-      if (!jn(x.roots, F, k)) return;
-      const W = zr(x.roots, F, k);
-      N(If(F), "Remove").applied && u((L) => L === F || L === void 0 ? W : L);
+    apply: _,
+    tryApply: C,
+    applyAll: L,
+    move: M,
+    validateMove: (E) => Qi(x.roots, E, k),
+    insertComponent: (E, W, B, G) => F(la(Nt(), E, E), W, B, "Add", G, E),
+    insertLayout: (E, W, B, G) => F(Yt(E, Nt(), E), W, B, "Add layout", G, `layout:${E}`),
+    remove: (E) => {
+      if (!jn(x.roots, E, k)) return;
+      const W = zr(x.roots, E, k);
+      C(If(E), "Remove").applied && u((B) => B === E || B === void 0 ? W : B);
     },
-    canRemove: (F) => jn(x.roots, F, k),
-    setProperty: (F, W) => c && R(qn(c, F, W), "Change"),
+    canRemove: (E) => jn(x.roots, E, k),
+    setProperty: (E, W) => c && _(qn(c, E, W), "Change"),
     setScreenForms: q,
     setScreenTemplateOutlets: ne,
     setScreenTemplateMetadata: ye,
     setDialogTemplates: me,
     setCollectionItemDestination: ue,
-    setElementBehaviors: D,
+    setElementBehaviors: R,
     setScreenTemplate: Ie,
     markSaved: () => {
       l(Lf);
@@ -7864,7 +7884,7 @@ function Wa(e) {
 var Yi = () => ({
   width: window.innerWidth - 64,
   height: window.innerHeight - 64
-}), by = (e) => /* @__PURE__ */ a(ya, {
+}), yy = (e) => /* @__PURE__ */ a(ya, {
   strings: e.strings,
   onClose: () => e.onDismiss?.(),
   children: /* @__PURE__ */ a(Xf, { ...e })
@@ -7885,58 +7905,58 @@ var Yi = () => ({
     })
   });
 }, Zf = ({ subject: e, environment: t, strings: n, layoutLabels: o, icons: i, paletteSources: r, sourceRect: s, initialSize: l, rememberWindowAs: c, windowMemory: u, centerOffsetX: d, renderPaletteHost: p, onClose: h, onBeforeClose: f, onPreview: g, opened: m }) => {
-  const v = V(void 0), w = Ua(m, e.authoringTemplate, t, ($) => v.current?.($)), P = U(() => u ?? Jm(), [u]), x = U(() => Xm({
+  const v = V(void 0), w = Ua(m, e.authoringTemplate, t, (F) => v.current?.(F)), P = U(() => u ?? Jm(), [u]), x = U(() => Xm({
     remembered: c ? P.read(c) : void 0,
     saved: l,
     lastUsed: P.readLastUsed()
-  }, Yi()), []), C = z(($) => {
-    c && P.write(c, $);
-  }, [P, c]), k = z(($) => {
-    C($);
-    const A = ft(w.document, e.authoringTemplate);
+  }, Yi()), []), S = z((F) => {
+    c && P.write(c, F);
+  }, [P, c]), k = z((F) => {
+    S(F);
+    const M = ft(w.document, e.authoringTemplate);
     h({
       document: w.document,
-      legacyElements: zt(A, t.runtime.legacyTypeOf),
-      windowSize: $,
-      layout: Gt(A),
+      legacyElements: zt(M, t.runtime.legacyTypeOf),
+      windowSize: F,
+      layout: Gt(M),
       changed: w.isDirty
     });
   }, [
     w,
     t.runtime.legacyTypeOf,
     h,
-    C,
+    S,
     e.authoringTemplate
-  ]), [y, T] = j(), M = z(async ($) => {
-    C($);
-    const A = ft(w.document, e.authoringTemplate), q = {
+  ]), [y, N] = j(), A = z(async (F) => {
+    S(F);
+    const M = ft(w.document, e.authoringTemplate), q = {
       document: w.document,
-      legacyElements: zt(A, t.runtime.legacyTypeOf),
-      windowSize: $,
-      layout: Gt(A),
+      legacyElements: zt(M, t.runtime.legacyTypeOf),
+      windowSize: F,
+      layout: Gt(M),
       changed: w.isDirty
     }, ne = await f?.(q);
-    return T(ne), !ne;
+    return N(ne), !ne;
   }, [
     w,
     t.runtime.legacyTypeOf,
     f,
-    C,
+    S,
     e.authoringTemplate
-  ]), [I, N] = j(!1), R = z(async ($) => {
+  ]), [T, C] = j(!1), _ = z(async (F) => {
     if (!(!f || !w.isDirty)) {
-      N(!0);
+      C(!0);
       try {
-        const A = ft(w.document, e.authoringTemplate), q = await f({
+        const M = ft(w.document, e.authoringTemplate), q = await f({
           document: w.document,
-          legacyElements: zt(A, t.runtime.legacyTypeOf),
-          windowSize: $,
-          layout: Gt(A),
+          legacyElements: zt(M, t.runtime.legacyTypeOf),
+          windowSize: F,
+          layout: Gt(M),
           changed: !0
         });
-        T(q), q || w.markSaved();
+        N(q), q || w.markSaved();
       } finally {
-        N(!1);
+        C(!1);
       }
     }
   }, [
@@ -7944,36 +7964,36 @@ var Yi = () => ({
     t.runtime.legacyTypeOf,
     f,
     e.authoringTemplate
-  ]), { palette: B, recordInserted: S } = ga({
+  ]), { palette: L, recordInserted: D } = ga({
     strings: n,
     layoutLabels: o,
     icons: i,
     paletteSources: r,
-    onAdd: ($) => E($.payload)
+    onAdd: (F) => I(F.payload)
   });
-  v.current = S;
-  function E($) {
-    if (!Eo($)) return;
-    const A = w.selection && eg(w) ? w.selectedId : void 0;
-    $.kind === "layout" ? w.insertLayout($.item, A, void 0) : w.insertComponent(Ao($.componentName, $.package), A, void 0);
+  v.current = D;
+  function I(F) {
+    if (!Eo(F)) return;
+    const M = w.selection && eg(w) ? w.selectedId : void 0;
+    F.kind === "layout" ? w.insertLayout(F.item, M, void 0) : w.insertComponent(Ao(F.componentName, F.package), M, void 0);
   }
   return /* @__PURE__ */ b(Ca, {
     environment: t,
-    children: [p ? p(B) : /* @__PURE__ */ a(ba, {
+    children: [p ? p(L) : /* @__PURE__ */ a(ba, {
       placement: "floating",
-      children: B
+      children: L
     }), /* @__PURE__ */ a($r, {
       sourceRect: s,
       initialSize: x,
       centerOffsetX: d,
-      canClose: M,
+      canClose: A,
       onClosed: k,
-      renderInspector: ($) => /* @__PURE__ */ a(ua, {
+      renderInspector: (F) => /* @__PURE__ */ a(ua, {
         strings: n,
         controller: w,
         environment: t,
         authoringTemplate: e.authoringTemplate,
-        onClose: $.toggleInspector,
+        onClose: F.toggleInspector,
         structure: /* @__PURE__ */ a(qr, {
           roots: w.composition.roots,
           adapter: w.adapter,
@@ -7984,20 +8004,20 @@ var Yi = () => ({
           onRemove: w.remove
         })
       }),
-      children: ($) => /* @__PURE__ */ a(Aa, {
+      children: (F) => /* @__PURE__ */ a(Aa, {
         controller: w,
         environment: t,
         strings: n,
         window: {
-          ...$,
+          ...F,
           available: Yi()
         },
         authoringTemplate: e.authoringTemplate,
         saveFailure: y,
         onSave: f ? () => {
-          R($.size);
+          _(F.size);
         } : void 0,
-        isSaving: I,
+        isSaving: T,
         onPreview: g
       })
     })]
@@ -8114,14 +8134,14 @@ var it = "p-anchored-overlay", Bt = "p-collapsible", Dn = "p-overlay-mask", O =
   "Tooltip.Root": O(jd),
   "Tooltip.Popup": pe("p-tooltip"),
   "Tree.Root": O(Ud)
-}, og = Yo.find((e) => e.name === "lara-light-blue") ?? Yo[0], yy = ({ defaults: e, theme: t, ...n }) => {
+}, og = Yo.find((e) => e.name === "lara-light-blue") ?? Yo[0], wy = ({ defaults: e, theme: t, ...n }) => {
   const o = gl(og);
   return /* @__PURE__ */ a(wc, {
     ...n,
     theme: t ?? o?.theme,
     defaults: tg(ng, e)
   });
-}, wy = (e) => /* @__PURE__ */ a(ya, {
+}, ky = (e) => /* @__PURE__ */ a(ya, {
   strings: e.strings,
   onClose: e.onDismiss,
   children: /* @__PURE__ */ a(ig, { ...e })
@@ -8135,14 +8155,14 @@ var it = "p-anchored-overlay", Bt = "p-collapsible", Dn = "p-overlay-mask", O =
     strings: e.strings
   });
 }, rg = ({ subject: e, environment: t, strings: n, layoutLabels: o, icons: i, paletteSources: r, initialSize: s, onChange: l, renderPaletteHost: c, opened: u }) => {
-  const d = V(void 0), p = Ua(u, e.authoringTemplate, t, (C) => d.current?.(C)), [h, f] = j(s ?? sn[Ke.Desktop]), [g, m] = j(!0), v = V(l);
+  const d = V(void 0), p = Ua(u, e.authoringTemplate, t, (S) => d.current?.(S)), [h, f] = j(s ?? sn[Ke.Desktop]), [g, m] = j(!0), v = V(l);
   v.current = l, ce(() => {
-    const C = ft(p.document, e.authoringTemplate);
+    const S = ft(p.document, e.authoringTemplate);
     v.current?.({
       document: p.document,
-      legacyElements: zt(C, t.runtime.legacyTypeOf),
+      legacyElements: zt(S, t.runtime.legacyTypeOf),
       windowSize: h,
-      layout: Gt(C),
+      layout: Gt(S),
       changed: p.isDirty
     });
   }, [
@@ -8152,16 +8172,16 @@ var it = "p-anchored-overlay", Bt = "p-collapsible", Dn = "p-overlay-mask", O =
     e.authoringTemplate,
     t.runtime.legacyTypeOf
   ]);
-  const w = z((C) => {
-    if (!Eo(C)) return;
+  const w = z((S) => {
+    if (!Eo(S)) return;
     const k = p.selection, y = k && "children" in k ? p.selectedId : void 0;
-    C.kind === "layout" ? p.insertLayout(C.item, y, void 0) : p.insertComponent(Ao(C.componentName, C.package), y, void 0);
+    S.kind === "layout" ? p.insertLayout(S.item, y, void 0) : p.insertComponent(Ao(S.componentName, S.package), y, void 0);
   }, [p]), { palette: P, recordInserted: x } = ga({
     strings: n,
     layoutLabels: o,
     icons: i,
     paletteSources: r,
-    onAdd: (C) => w(C.payload)
+    onAdd: (S) => w(S.payload)
   });
   return d.current = x, /* @__PURE__ */ a(Ca, {
     environment: t,
@@ -8182,7 +8202,7 @@ var it = "p-anchored-overlay", Bt = "p-collapsible", Dn = "p-overlay-mask", O =
               size: h,
               setSize: f,
               isInspectorOpen: g,
-              toggleInspector: () => m((C) => !C),
+              toggleInspector: () => m((S) => !S),
               available: {
                 width: 1600,
                 height: 1e3
@@ -8227,7 +8247,7 @@ var sg = new Set(Object.values(ws)), lg = new Set(Object.values(ys));
 function cg(e) {
   return e.filter((t) => sg.has(t.resultShape) && t.origin.every((n) => lg.has(n.kind))).map((t) => t);
 }
-function ky(e) {
+function Sy(e) {
   const t = cg(e.queryCandidates ?? []);
   return {
     runtime: e.runtime,
@@ -8246,7 +8266,7 @@ var dg = [.../* @__PURE__ */ new Set([...nn.ids, ...Object.values(X)])];
 function ug(e, t) {
   return ul({
     bundles: e,
-    profile: t,
+    profile: pg(e, t),
     policy: {
       allowExecutableImports: !0,
       allowNetworkAssets: !1,
@@ -8254,21 +8274,27 @@ function ug(e, t) {
     }
   }, { hostEditorKinds: [...dg] });
 }
-function pg(e) {
+function pg(e, t) {
+  return !t.layout || e.some((n) => (n.layouts ?? []).some((o) => o.name === t.layout)) ? t : {
+    ...t,
+    layout: void 0
+  };
+}
+function mg(e) {
   return e.flatMap((t) => t.iconLibrary ? [t.iconLibrary.catalog] : []);
 }
-function mg(e, t) {
+function hg(e, t) {
   const n = Ws(e, t.map((o) => o.manifest));
-  return new Ts(n, pg(t));
+  return new Ts(n, mg(t));
 }
-function hg(e) {
+function fg(e) {
   const t = ol([e]), n = t.packages.filter((o) => o !== "PrimeReact");
   return n.splice(Math.max(n.indexOf(vr), 0), 0, "PrimeReact"), {
     ...t,
     packages: n
   };
 }
-var fg = [
+var gg = [
   "PrimeReact.Accordion",
   "PrimeReact.AutoComplete",
   "PrimeReact.Avatar",
@@ -8371,7 +8397,7 @@ var fg = [
   "itemsControl",
   "stackPanel",
   "wrapPanel"
-], gg = ["PrimeReact.Dialog"], vg = new Set(fg.filter((e) => !gg.includes(e))), bg = [
+], vg = ["PrimeReact.Dialog"], bg = new Set(gg.filter((e) => !vg.includes(e))), yg = [
   {
     value: ve.None,
     label: "Run directly"
@@ -8385,7 +8411,7 @@ var fg = [
     label: "Ask in a drawer"
   }
 ];
-function yg(e) {
+function wg(e) {
   return !e.component.endsWith(":action") || e.properties.some((t) => t.path === "presentation") ? e : {
     ...e,
     properties: [...e.properties, {
@@ -8394,13 +8420,13 @@ function yg(e) {
       group: "Behavior",
       valueType: K.Enum,
       default: ve.None,
-      choices: bg,
+      choices: yg,
       description: "Whether the command runs straight away or first asks for its input in a dialog or a drawer."
     }]
   };
 }
-var wg = (e) => e.replace(/([A-Z])/g, " $1").replace(/^./, (t) => t.toUpperCase()), kg = (e) => /ies$/i.test(e) ? `${e.slice(0, -3)}y` : /(ss|us)$/i.test(e) || !/s$/i.test(e) ? e : e.slice(0, -1), za = (e) => e !== null && typeof e == "object" && !Array.isArray(e);
-function Wo(e, t, n = wg(e)) {
+var kg = (e) => e.replace(/([A-Z])/g, " $1").replace(/^./, (t) => t.toUpperCase()), Sg = (e) => /ies$/i.test(e) ? `${e.slice(0, -3)}y` : /(ss|us)$/i.test(e) || !/s$/i.test(e) ? e : e.slice(0, -1), za = (e) => e !== null && typeof e == "object" && !Array.isArray(e);
+function Wo(e, t, n = kg(e)) {
   const o = {
     path: e,
     label: n,
@@ -8412,7 +8438,7 @@ function Wo(e, t, n = wg(e)) {
   } : typeof t == "boolean" ? {
     ...o,
     valueType: K.Boolean
-  } : Array.isArray(t) ? Cg(o, t) : za(t) ? {
+  } : Array.isArray(t) ? Ng(o, t) : za(t) ? {
     ...o,
     valueType: K.Object,
     properties: Ha(t),
@@ -8423,12 +8449,12 @@ function Wo(e, t, n = wg(e)) {
   };
 }
 function Ha(e, t = []) {
-  return Object.entries(e).filter(([n]) => !t.includes(n)).map(([n, o]) => Sg(n, o));
+  return Object.entries(e).filter(([n]) => !t.includes(n)).map(([n, o]) => Cg(n, o));
 }
-function Sg(e, t) {
+function Cg(e, t) {
   return Wo(e, t);
 }
-function Cg(e, t) {
+function Ng(e, t) {
   if (t.length > 0 && t.every((o) => typeof o == "string")) return {
     ...e,
     valueType: K.Json,
@@ -8445,17 +8471,17 @@ function Cg(e, t) {
     ...e,
     valueType: K.Collection,
     item: {
-      label: kg(e.label),
+      label: Sg(e.label),
       properties: Ha(n, ["id"]),
       open: !0
     }
   };
 }
-var Ng = (e) => e.valueType === K.Json && e.editorKind === void 0;
-function Tg(e) {
+var Tg = (e) => e.valueType === K.Json && e.editorKind === void 0;
+function Ig(e) {
   const t = Uo(e.component, e.component.slice(e.component.lastIndexOf(":") + 1));
   if (!t) return e;
-  const n = new Set(e.properties.map((r) => r.path)), o = e.properties.map((r) => Ng(r) && r.path in t ? Ig(r, t[r.path]) : r), i = Object.entries(t).filter(([r]) => !n.has(r)).map(([r, s]) => ({
+  const n = new Set(e.properties.map((r) => r.path)), o = e.properties.map((r) => Tg(r) && r.path in t ? Pg(r, t[r.path]) : r), i = Object.entries(t).filter(([r]) => !n.has(r)).map(([r, s]) => ({
     ...Wo(r, s),
     description: "Shown as sample content on the design surface until you set it."
   }));
@@ -8464,7 +8490,7 @@ function Tg(e) {
     properties: [...o, ...i]
   } : e;
 }
-function Ig(e, t) {
+function Pg(e, t) {
   const { editorKind: n, item: o, properties: i, choices: r, ...s } = e, l = Wo(e.path, t);
   return {
     ...l,
@@ -8472,7 +8498,7 @@ function Ig(e, t) {
     valueType: l.valueType
   };
 }
-var Xi = "Placement", Pg = [{
+var Xi = "Placement", xg = [{
   path: Je,
   label: "Left",
   group: Xi,
@@ -8483,31 +8509,31 @@ var Xi = "Placement", Pg = [{
   group: Xi,
   valueType: K.Number
 }];
-function xg(e) {
+function Og(e) {
   const t = new Set(e.properties.map((n) => n.path));
   return {
     ...e,
-    properties: [...e.properties, ...Pg.filter((n) => !t.has(n.path))]
+    properties: [...e.properties, ...xg.filter((n) => !t.has(n.path))]
   };
 }
-var Zi = "PrimeReact", Og = 1;
-function Dg(e, t, n) {
+var Zi = "PrimeReact", Dg = 1;
+function Rg(e, t, n) {
   const o = en(e.map((p) => p.manifest)), i = e.flatMap((p) => p.descriptors ?? []), r = new Set(i.map((p) => p.component)), s = e.flatMap((p) => p.manifest.components.map((h) => ({
     component: Fn(p.manifest.name, h),
     displayName: h,
     properties: []
-  }))).filter((p) => !r.has(p.component)), l = [...i, ...s].map(yg).map(Tg).map(xg), c = [...l, ...Rg(l, o, t)], u = new Set(Object.values(o).flat()), d = new Map(l.map((p) => [p.component, p]));
+  }))).filter((p) => !r.has(p.component)), l = [...i, ...s].map(wg).map(Ig).map(Og), c = [...l, ...Fg(l, o, t)], u = new Set(Object.values(o).flat()), d = new Map(l.map((p) => [p.component, p]));
   return {
-    id: Og++,
+    id: Dg++,
     bundles: e,
     registry: Sr(e),
     packages: o,
     descriptors: c,
     catalog: Es(c),
     profile: t,
-    compositionProfile: hg(t),
+    compositionProfile: fg(t),
     ...n ? { appearance: n } : {},
-    icons: mg(t.packages, e),
+    icons: hg(t.packages, e),
     iconAdapters: dl(e),
     designTime: ug(e, t),
     packageDescriptorOf: (p) => {
@@ -8518,11 +8544,11 @@ function Dg(e, t, n) {
     isKnownComponent: (p) => u.has(p),
     legacyTypeOf: (p) => {
       const h = Gm(p, t, o), f = h?.package === Zi ? `${Zi}.${Br(h.name)}` : void 0;
-      return f !== void 0 && vg.has(f) ? f : void 0;
+      return f !== void 0 && bg.has(f) ? f : void 0;
     }
   };
 }
-function Rg(e, t, n) {
+function Fg(e, t, n) {
   const o = [];
   for (const i of new Set(Object.values(t).flat())) {
     const r = Tt(i, n, t), s = r && e.find((l) => l.component === Fn(r.package, r.name));
@@ -8533,7 +8559,7 @@ function Rg(e, t, n) {
   }
   return o;
 }
-var zo = "Cratis.Icons.Lucide", Fg = {
+var zo = "Cratis.Icons.Lucide", Eg = {
   name: zo,
   version: "1.52.0",
   kind: dt.IconLibrary,
@@ -8555,20 +8581,20 @@ var zo = "Cratis.Icons.Lucide", Fg = {
     attributionUrl: "https://lucide.dev",
     iconCount: 1858
   }
-}, Eg = {
+}, Mg = {
   library: zo,
   loadEntries: async () => (await import("./catalog-CZx3FR-E.js")).default
-}, Mg = qd, Ag = {
+}, Ag = qd, _g = {
   library: zo,
-  loadGlyph: async ({ key: e }) => (await Mg[e]?.())?.default
-}, _g = {
-  manifest: Fg,
+  loadGlyph: async ({ key: e }) => (await Ag[e]?.())?.default
+}, $g = {
+  manifest: Eg,
   components: {},
   iconLibrary: {
-    catalog: Eg,
-    adapter: Ag
+    catalog: Mg,
+    adapter: _g
   }
-}, $g = [
+}, Lg = [
   zd,
   Hd,
   Gd
@@ -8579,10 +8605,10 @@ var zo = "Cratis.Icons.Lucide", Fg = {
   Mr,
   gr,
   _r,
-  ...$g,
-  _g
-], Lg = Pt.map((e) => e.manifest), Sy = Sr(Pt), Cy = en(Lg), Ny = Pt.flatMap((e) => e.themes ?? []);
-function Bg(e) {
+  ...Lg,
+  $g
+], Bg = Pt.map((e) => e.manifest), Cy = Sr(Pt), Ny = en(Bg), Ty = Pt.flatMap((e) => e.themes ?? []);
+function jg(e) {
   const t = Ds(e).map((i) => i.name), n = Qo(e, dt.Styling).map((i) => i.name), o = Qo(e, dt.Blueprint)[0];
   return o ? [
     ...t,
@@ -8595,16 +8621,16 @@ var Ga = (e) => e === void 0 || e.activePack === "" && e.mappings.length === 0 ?
   mappings: e.mappings.map((t) => ({ ...t })),
   bindings: []
 };
-function jg(e, t) {
+function Ug(e, t) {
   return t.filter((n) => $s(n, e));
 }
-function Ug(e, t) {
+function Wg(e, t) {
   return [...new Set(Object.values(t).flat())].map((n) => Tt(n, e, t)).filter((n) => n !== void 0 && n.shadows.length > 0).sort((n, o) => n.name.localeCompare(o.name));
 }
 var Rn = /* @__PURE__ */ (function(e) {
   return e.Fallback = "fallback", e.Explicit = "explicit", e.Automatic = "automatic", e;
 })({});
-function Wg(e) {
+function zg(e) {
   const t = [
     so,
     ...e.packages,
@@ -8614,17 +8640,17 @@ function Wg(e) {
   ];
   return [...new Set(t.filter((n) => n.length > 0))];
 }
-function zg(e, t) {
+function Hg(e, t) {
   return e.find((n) => n.manifest.name === t)?.manifest.layouts[0] ?? "";
 }
-function Hg(e, t) {
+function Gg(e, t) {
   const n = e.root?.template;
   if (!(n?.source !== Ss.Blueprint || n.blueprint === void 0))
     return t.find((o) => o.manifest.name === n.blueprint)?.manifest.layouts.includes(n.id) ? n.id : void 0;
 }
 var qa = "UI Profile";
 function Ka(e, t) {
-  const n = t.map((c) => c.manifest), o = Wg(e), i = zs(o, n), r = Hg(e, t) ?? zg(t, e.shell), s = {
+  const n = t.map((c) => c.manifest), o = zg(e), i = zs(o, n), r = Gg(e, t) ?? Hg(t, e.shell), s = {
     name: qa,
     targetPlatform: "web",
     packages: i.packages,
@@ -8632,7 +8658,7 @@ function Ka(e, t) {
     ...e.root ? { root: e.root } : {},
     theme: e.theme.length > 0 ? e.theme : void 0,
     sampleData: Ga(e.sampleData),
-    appearance: Gg(e),
+    appearance: qg(e),
     ...e.identity === void 0 ? {} : { identity: e.identity }
   }, l = new Set(o);
   return {
@@ -8650,13 +8676,13 @@ function Ka(e, t) {
         requiredBy: n.filter((d) => i.packages.includes(d.name) && d.dependencies.some((p) => p.name === c)).map((d) => d.name)
       }] : [];
     }),
-    collisions: Ug(s, en(n)),
-    compatibleThemes: jg(s, t.flatMap((c) => c.themes ?? [])),
+    collisions: Wg(s, en(n)),
+    compatibleThemes: Ug(s, t.flatMap((c) => c.themes ?? [])),
     layout: r,
     isValid: _s(i)
   };
 }
-function Gg(e) {
+function qg(e) {
   const t = {
     ...e.colorScheme === "dark" ? { colorScheme: hs.Dark } : {},
     ...e.accent.length > 0 ? { accent: e.accent } : {},
@@ -8665,8 +8691,8 @@ function Gg(e) {
   };
   return Object.keys(t).length === 0 ? void 0 : t;
 }
-function qg(e) {
-  const t = e.map((s) => s.manifest), n = Bg(t), o = n.find((s) => t.find((l) => l.name === s)?.kind === dt.Blueprint) ?? "", i = {
+function Kg(e) {
+  const t = e.map((s) => s.manifest), n = jg(t), o = n.find((s) => t.find((l) => l.name === s)?.kind === dt.Blueprint) ?? "", i = {
     packages: n.filter((s) => s !== o && s !== so),
     shell: o,
     templatePacks: [],
@@ -8681,7 +8707,7 @@ function qg(e) {
     theme: r?.name ?? ""
   };
 }
-function Kg(e, t) {
+function Vg(e, t) {
   return {
     name: qa,
     targetPlatform: "web",
@@ -8691,11 +8717,11 @@ function Kg(e, t) {
     sampleData: Ga(t)
   };
 }
-function Ty(e, t = Pt, n, o) {
-  const i = e ? Kg(e, o) : Ka(qg(t), t).profile;
-  return Dg(t, i, n);
+function Iy(e, t = Pt, n, o) {
+  const i = e ? Vg(e, o) : Ka(Kg(t), t).profile;
+  return Rg(t, i, n);
 }
-function Vg(e, t) {
+function Jg(e, t) {
   const n = no(e), o = mo(e, {
     kind: Vt.Screen,
     name: be
@@ -8705,8 +8731,8 @@ function Vg(e, t) {
     configuration: i
   };
 }
-var Jg = ({ document: e, runtime: t, resolveBinding: n, registry: o = t.registry }) => {
-  const { element: i, configuration: r } = U(() => Vg(e, t.catalog), [e, t.catalog]), s = U(() => go(i, t.compositionProfile, t.packages), [
+var Qg = ({ document: e, runtime: t, resolveBinding: n, registry: o = t.registry }) => {
+  const { element: i, configuration: r } = U(() => Jg(e, t.catalog), [e, t.catalog]), s = U(() => go(i, t.compositionProfile, t.packages), [
     i,
     t.compositionProfile,
     t.packages
@@ -8727,12 +8753,12 @@ var Jg = ({ document: e, runtime: t, resolveBinding: n, registry: o = t.registry
       })
     })
   });
-}, Qg = (e) => {
+}, Yg = (e) => {
   const t = bt(e);
   return Pa.has(t) || t in Ta;
-}, Yg = (e, t) => {
+}, Xg = (e, t) => {
   const n = (o) => {
-    const i = Qg(o.element.componentName), r = U(() => ({
+    const i = Yg(o.element.componentName), r = U(() => ({
       ...o.element,
       properties: xa(e, o.element.componentName, o.element.properties)
     }), [o.element]);
@@ -8746,11 +8772,11 @@ var Jg = ({ document: e, runtime: t, resolveBinding: n, registry: o = t.registry
   };
   return n.displayName = `Miniature(${t.displayName ?? t.name ?? "Component"})`, n;
 };
-function Xg(e) {
-  return Object.fromEntries(Object.entries(e).map(([t, n]) => [t, Yg(t, n)]));
+function Zg(e) {
+  return Object.fromEntries(Object.entries(e).map(([t, n]) => [t, Xg(t, n)]));
 }
-var Iy = 240, Py = 112;
-function Zg(e, t = 240, n = Number.POSITIVE_INFINITY) {
+var Py = 240, xy = 112;
+function ev(e, t = 240, n = Number.POSITIVE_INFINITY) {
   const o = e && e.width > 0 && e.height > 0 ? e : Sa({
     width: 1 / 0,
     height: 1 / 0
@@ -8763,7 +8789,7 @@ function Zg(e, t = 240, n = Number.POSITIVE_INFINITY) {
     scale: s
   };
 }
-function ev(e, t = 240) {
+function tv(e, t = 240) {
   const n = typeof IntersectionObserver < "u", [o, i] = j(!n);
   return ce(() => {
     const r = e.current;
@@ -8776,23 +8802,23 @@ function ev(e, t = 240) {
     n
   ]), o;
 }
-var tv = [
+var nv = [
   "#f66",
   "#fa0",
   "#3c3"
-], nv = () => {
-}, er = 16, xy = ({ document: e, runtime: t, windowSize: n, width: o, title: i, openTitle: r, onClick: s, placeholder: l }) => {
-  const c = V(null), u = ev(c), d = U(() => Zg(n, o ?? 240, o === void 0 ? 112 : void 0), [
+], ov = () => {
+}, er = 16, Oy = ({ document: e, runtime: t, windowSize: n, width: o, title: i, openTitle: r, onClick: s, placeholder: l }) => {
+  const c = V(null), u = tv(c), d = U(() => ev(n, o ?? 240, o === void 0 ? 112 : void 0), [
     n?.width,
     n?.height,
     o
-  ]), p = U(() => jo(t), [t]), h = U(() => Xg(t.registry), [t.registry]), f = {
+  ]), p = U(() => jo(t), [t]), h = U(() => Zg(t.registry), [t.registry]), f = {
     width: d.width,
     height: er + d.bodyHeight
   }, g = /* @__PURE__ */ b(le, { children: [/* @__PURE__ */ b("div", {
     className: "screen-thumbnail__title-bar",
     style: { height: er },
-    children: [tv.map((v) => /* @__PURE__ */ a("span", {
+    children: [nv.map((v) => /* @__PURE__ */ a("span", {
       className: "screen-thumbnail__light",
       style: { borderColor: v }
     }, v)), i && /* @__PURE__ */ a("span", {
@@ -8812,10 +8838,10 @@ var tv = [
         "--studio-surface-viewport-height": `${d.canvasHeight}px`
       },
       "data-studio-viewport": "",
-      children: /* @__PURE__ */ a(Jg, {
+      children: /* @__PURE__ */ a(Qg, {
         document: e,
         runtime: t,
-        resolveBinding: nv,
+        resolveBinding: ov,
         registry: h
       })
     }) : l
@@ -8841,28 +8867,28 @@ var tv = [
     "aria-label": i,
     children: g
   });
-}, rt = /* @__PURE__ */ new Map(), ov = 200;
-function Oy(e) {
+}, rt = /* @__PURE__ */ new Map(), iv = 200;
+function Dy(e) {
   if (!e) return;
   if (rt.has(e)) return rt.get(e);
   const t = ta(e), n = t.readable ? t.document : void 0;
-  return rt.size >= ov && rt.delete(rt.keys().next().value), rt.set(e, n), n;
+  return rt.size >= iv && rt.delete(rt.keys().next().value), rt.set(e, n), n;
 }
-var Dy = {
+var Ry = {
   [H.Stack]: "Stack",
   [H.Row]: "Row",
   [H.Grid]: "Grid",
   [H.Container]: "Container",
   [H.Wrap]: "Wrap",
   [H.Canvas]: "Canvas"
-}, iv = {
+}, rv = {
   [H.Stack]: st,
   [H.Row]: Ml,
   [H.Grid]: Rr,
   [H.Container]: bo,
   [H.Wrap]: yo,
   [H.Canvas]: cc
-}, rv = {
+}, av = {
   text: vl,
   button: Wt,
   card: xl,
@@ -9003,7 +9029,7 @@ var Dy = {
   themeSwitcher: vn,
   layoutModeSwitcher: En,
   arcPageHeader: Ut
-}, av = [
+}, sv = [
   [/dialog/i, ht],
   [/table|grid/i, mt],
   [/menu|bar$/i, st],
@@ -9016,35 +9042,35 @@ var Dy = {
   [/message|toast/i, Tr],
   [/tree/i, _n],
   [/page|screen/i, Mn]
-], sv = (e) => rv[e] ?? av.find(([t]) => t.test(e))?.[1] ?? Or, lv = {
+], lv = (e) => av[e] ?? sv.find(([t]) => t.test(e))?.[1] ?? Or, cv = {
   [kr.manifest.name]: Dr,
   [Cr.manifest.name]: Fr,
   [Mr.manifest.name]: Or,
   [gr.manifest.name]: yo,
   [_r.manifest.name]: Ut,
   [Ar.manifest.name]: Gl
-}, cv = Ol, Ry = {
+}, dv = Ol, Fy = {
   layout: (e) => {
-    const t = iv[e];
+    const t = rv[e];
     return /* @__PURE__ */ a(t, { "aria-hidden": "true" });
   },
   component: (e) => {
-    const t = sv(e);
+    const t = lv(e);
     return /* @__PURE__ */ a(t, { "aria-hidden": "true" });
   },
   drawer: {
     layout: /* @__PURE__ */ a(Rr, { "aria-hidden": "true" }),
     package: (e) => {
-      const t = lv[e] ?? cv;
+      const t = cv[e] ?? dv;
       return /* @__PURE__ */ a(t, { "aria-hidden": "true" });
     }
   }
-}, Fy = Pt.map((e) => ({
+}, Ey = Pt.map((e) => ({
   package: e.manifest.name,
   components: e.manifest.components,
   descriptors: e.descriptors ?? []
 }));
-function Ey(e, t, n) {
+function My(e, t, n) {
   return e.map((o) => ({
     type: o.type,
     name: t[o.item],
@@ -9052,10 +9078,10 @@ function Ey(e, t, n) {
     icon: n?.[o.item]
   }));
 }
-var My = /* @__PURE__ */ (function(e) {
+var Ay = /* @__PURE__ */ (function(e) {
   return e.Auto = "auto", e.Manual = "manual", e;
 })({});
-function Ay(e) {
+function _y(e) {
   return [
     {
       kind: xt.DataContext,
@@ -9078,68 +9104,68 @@ function Ay(e) {
   ];
 }
 export {
-  Ov as BindingMode,
-  Dv as BindingNullBehavior,
-  Rv as BindingSourceKind,
-  My as CommandFormMode,
-  Fv as DestinationKind,
+  Dv as BindingMode,
+  Rv as BindingNullBehavior,
+  Fv as BindingSourceKind,
+  Ay as CommandFormMode,
+  Ev as DestinationKind,
   Q as LayoutArrangement,
   H as LayoutItem,
   ie as Ownership,
-  Jg as PlayScreenView,
+  Qg as PlayScreenView,
   Ae as SceneDocumentProblem,
   Ca as ScreenEditorControlProviders,
-  by as ScreenEditorOverlay,
-  yy as ScreenEditorPrimeReactProvider,
+  yy as ScreenEditorOverlay,
+  wy as ScreenEditorPrimeReactProvider,
   Aa as ScreenEditorWindow,
-  wy as ScreenEditorWorkspace,
-  xy as ScreenThumbnail,
+  ky as ScreenEditorWorkspace,
+  Oy as ScreenThumbnail,
   oe as StructureEditRejection,
-  Tv as StructuredValueEditor,
-  yv as asList,
-  Ay as bindingSourceChoices,
+  Iv as StructuredValueEditor,
+  wv as asList,
+  _y as bindingSourceChoices,
   Vm as browserWindowSizeStorage,
   St as commandNameOf,
-  ky as createScreenEditorEnvironment,
-  Dg as createScreenEditorRuntime,
+  Sy as createScreenEditorEnvironment,
+  Rg as createScreenEditorRuntime,
   Jm as createWindowSizeMemory,
-  iv as defaultLayoutIcons,
-  Dy as defaultLayoutLabels,
-  Ry as defaultPaletteIcons,
-  Fy as defaultPaletteSources,
+  rv as defaultLayoutIcons,
+  Ry as defaultLayoutLabels,
+  Fy as defaultPaletteIcons,
+  Ey as defaultPaletteSources,
   Ap as defaultScreenEditorStrings,
   nr as defaultStructuredEditorStrings,
   Sa as defaultWindowSize,
   Zm as fitWindowSize,
-  vv as identified,
+  bv as identified,
   ls as isCollectionOfRecords,
   Ym as isLegacyDefaultWindow,
   as as isObjectWithFields,
-  hv as isPrimitiveList,
+  fv as isPrimitiveList,
   ln as isRecord,
-  bv as isStringMap,
+  yv as isStringMap,
   Ho as isStructured,
-  gv as movedItem,
-  wv as newItem,
+  vv as movedItem,
+  kv as newItem,
   ir as numberListEditorKind,
   ta as readSceneDocument,
-  Oy as readThumbnailDocument,
+  Dy as readThumbnailDocument,
   Xm as resolveInitialWindowSize,
   is as scalarEditorKind,
   ng as screenEditorPrimeReactDefaults,
-  Ty as screenEditorRuntimeForProfile,
+  Iy as screenEditorRuntimeForProfile,
   pt as sliceNamedBy,
   rr as stringListEditorKind,
   ss as stringMapEditorKind,
   rs as stringOrListEditorKind,
   Hn as structuredProblem,
-  Zg as thumbnailGeometry,
-  Py as thumbnailMaxBodyHeight,
-  Iy as thumbnailWidth,
-  Ey as toLayoutContainerDescriptors,
+  ev as thumbnailGeometry,
+  xy as thumbnailMaxBodyHeight,
+  Py as thumbnailWidth,
+  My as toLayoutContainerDescriptors,
   cg as toSceneCandidates,
-  fv as withField,
+  gv as withField,
   os as withIdentities,
-  kv as withItem,
-  Sv as withoutItem
+  Sv as withItem,
+  Cv as withoutItem
 };