@cratis/event-models 0.114.1 → 0.115.0

package/dist/index.js

@@ -1652,8 +1652,8 @@ var lc = 56, ta = ({ drag: e }) => e ? He(/* @__PURE__ */ a("div", {
   flexShrink: 0,
   display: "inline-block"
 }), On = ({ rowType: e, height: t, name: n, description: r, actorId: i, onRenamed: o, validateName: s, onActorAdded: d, onDragStart: u, dragging: l = !1, badge: c, personaAvatar: f, children: y }) => {
-  const { readOnly: h, messages: m } = K(), [g, v] = F(!1), [p, w] = F(!1), b = A(void 0), S = A(null), C = A(null), O = A(null), N = oe(() => [C], []), L = oe(() => [O], []);
-  ze(N, () => v(!1), g), ze(L, () => w(!1), p);
+  const { readOnly: h, messages: m } = K(), [g, v] = F(!1), [p, w] = F(!1), b = A(void 0), S = A(null), C = A(null), L = A(null), N = oe(() => [C], []), O = oe(() => [L], []);
+  ze(N, () => v(!1), g), ze(O, () => w(!1), p);
   const j = n ?? ra(e, m), H = ia(e), M = H && !h ? o : void 0, T = H && !h ? d : void 0, W = i && !h ? u : void 0, X = h ? [] : c?.actions ?? [], D = h ? void 0 : c?.onActivate, z = X.length > 0 || !!D, I = f ?? c?.avatar, k = H && (!!I || !!c && !h), E = () => {
     if (X.length > 0) {
       w((P) => !P);
@@ -1696,7 +1696,7 @@ var lc = 56, ta = ({ drag: e }) => e ? He(/* @__PURE__ */ a("div", {
       children: [
         k && /* @__PURE__ */ x("div", {
           className: "event-modeling-grid-row-label-info",
-          ref: O,
+          ref: L,
           children: [/* @__PURE__ */ a("button", {
             className: "event-modeling-grid-row-label-info-btn",
             onClick: (P) => {
@@ -1855,14 +1855,14 @@ var ma = ({ collectionId: e, topOffset: t, contentRows: n, rowHeights: r, actors
         height: r[p],
         name: f[p],
         onRenamed: d ? (N) => {
-          y((L) => ({
-            ...L,
+          y((O) => ({
+            ...O,
             [p]: N
           })), d(p, N);
         } : void 0,
-        validateName: (N) => Object.entries(f).find(([L]) => L !== p)?.[1]?.toLowerCase() === N.toLowerCase() ? "Name already in use" : void 0,
+        validateName: (N) => Object.entries(f).find(([O]) => O !== p)?.[1]?.toLowerCase() === N.toLowerCase() ? "Name already in use" : void 0,
         onActorAdded: o ? (N) => o(p, N) : void 0
-      }, C = w === void 0 || b.length === 0 ? [/* @__PURE__ */ a(Ae, { children: w !== void 0 && c ? c(p, S) : /* @__PURE__ */ a(On, { ...S }) }, p)] : [], O = b.flatMap((N, L) => {
+      }, C = w === void 0 || b.length === 0 ? [/* @__PURE__ */ a(Ae, { children: w !== void 0 && c ? c(p, S) : /* @__PURE__ */ a(On, { ...S }) }, p)] : [], L = b.flatMap((N, O) => {
         const j = g?.rowType === p, H = {
           rowType: p,
           height: r[p],
@@ -1880,12 +1880,12 @@ var ma = ({ collectionId: e, topOffset: t, contentRows: n, rowHeights: r, actors
           dragging: g?.actorId === N.id
         };
         return [
-          ...j && g.dropIndex === L ? [/* @__PURE__ */ a(Rn, {}, `drop-${p}-${L}`)] : [],
+          ...j && g.dropIndex === O ? [/* @__PURE__ */ a(Rn, {}, `drop-${p}-${O}`)] : [],
           /* @__PURE__ */ a(Ae, { children: l ? l(N, H) : /* @__PURE__ */ a(On, { ...H }) }, N.id),
-          ...j && L === b.length - 1 && g.dropIndex === b.length ? [/* @__PURE__ */ a(Rn, {}, `drop-${p}-end`)] : []
+          ...j && O === b.length - 1 && g.dropIndex === b.length ? [/* @__PURE__ */ a(Rn, {}, `drop-${p}-end`)] : []
         ];
       });
-      return [...C, ...O];
+      return [...C, ...L];
     })]
   });
 }, ga = ({ moduleId: e, collectionId: t, marginLeft: n, dragging: r = !1, ref: i, children: o }) => /* @__PURE__ */ a("div", {
@@ -2663,21 +2663,21 @@ function Ha({ collectionId: e, initialModules: t, onAddModule: n, onModulesReord
   const { readOnly: l } = K(), c = q((D) => {
     if (s) s(D);
     else throw D;
-  }, [s]), f = A(Ta(t)), [y, h] = F(f.current), m = A(!1), [g, v] = F(!1), p = A(/* @__PURE__ */ new Set()), [w, b] = F(/* @__PURE__ */ new Set()), S = A(!1), [C, O] = F(!1), N = (D, z) => {
+  }, [s]), f = A(Ta(t)), [y, h] = F(f.current), m = A(!1), [g, v] = F(!1), p = A(/* @__PURE__ */ new Set()), [w, b] = F(/* @__PURE__ */ new Set()), S = A(!1), [C, L] = F(!1), N = (D, z) => {
     z ? p.current.add(D) : p.current.delete(D), b(new Set(p.current));
-  }, L = q((D) => {
+  }, O = q((D) => {
     const z = D(f.current);
     f.current = z, h(z), u?.(z.modules);
   }, [u]);
   re(() => {
-    t !== f.current.snapshot && L((D) => Je(D, t));
-  }, [t, L]);
+    t !== f.current.snapshot && O((D) => Je(D, t));
+  }, [t, O]);
   const j = q(async () => {
     if (!(l || !n || m.current)) {
       m.current = !0, v(!0);
       try {
         const D = await n();
-        D && L((z) => Je({
+        D && O((z) => Je({
           ...z,
           additions: [...z.additions, D]
         }, z.snapshot));
@@ -2691,28 +2691,28 @@ function Ha({ collectionId: e, initialModules: t, onAddModule: n, onModulesReord
     l,
     n,
     c,
-    L
+    O
   ]), H = q(async (D) => {
     const z = D.id.toString();
     if (!i || p.current.has(z)) return;
     N(z, !0);
     const I = !D.collapsed;
-    L((k) => Pa(k, D.id, I));
+    O((k) => Pa(k, D.id, I));
     try {
-      await Et(() => i(D.id, I), () => L((k) => Fa(k, D.id)), c);
+      await Et(() => i(D.id, I), () => O((k) => Fa(k, D.id)), c);
     } finally {
       N(z, !1);
     }
   }, [
     i,
     c,
-    L
+    O
   ]), M = q(async (D, z) => {
     const I = D.id.toString();
     if (!(l || !o || p.current.has(I))) {
-      N(I, !0), L((k) => Da(k, D.id, z));
+      N(I, !0), O((k) => Da(k, D.id, z));
       try {
-        await Et(() => o(D.id, z), () => L((k) => $a(k, D.id)), c);
+        await Et(() => o(D.id, z), () => O((k) => $a(k, D.id)), c);
       } finally {
         N(I, !1);
       }
@@ -2721,19 +2721,19 @@ function Ha({ collectionId: e, initialModules: t, onAddModule: n, onModulesReord
     l,
     o,
     c,
-    L
+    O
   ]), T = q(async (D, z) => {
     if (l || !r || S.current) return;
-    S.current = !0, O(!0);
+    S.current = !0, L(!0);
     const I = f.current.order;
-    L((k) => _a(k, z));
+    O((k) => _a(k, z));
     try {
-      await Et(() => r(z), () => L((k) => Ba(k, I)), c);
+      await Et(() => r(z), () => O((k) => Ba(k, I)), c);
     } finally {
-      S.current = !1, O(!1);
+      S.current = !1, L(!1);
     }
   }, [
-    L,
+    O,
     r,
     c,
     l
@@ -3308,19 +3308,19 @@ function zr(e, t) {
   return t.add(e.id.toString()), e.subFeatures.flatMap((n) => t.has(n.id.toString()) ? [] : [n, ...zr(n, t)]);
 }
 function gs({ ref: e, initialFeatures: t, moduleId: n, widthOf: r, isCollapsed: i, forceCollapsed: o = !1, onCollapseChanged: s, occupiesColumn: d, renderHeader: u, renderColumn: l, renderFeatureBoundary: c, onAddFeature: f, onRenameFeature: y, onFeaturesReordered: h, onFeaturesChanged: m }) {
-  const { readOnly: g, messages: v } = K(), { targets: p, register: w } = cs(), b = A(us(t)), [S, C] = F(b.current), O = A(!1), N = A(/* @__PURE__ */ new Set()), L = q((R) => {
+  const { readOnly: g, messages: v } = K(), { targets: p, register: w } = cs(), b = A(us(t)), [S, C] = F(b.current), L = A(!1), N = A(/* @__PURE__ */ new Set()), O = q((R) => {
     const G = R(b.current);
     G !== b.current && (b.current = G, C(G), m?.(G.features));
   }, [m]);
   re(() => {
-    t !== b.current.snapshot && L((R) => Ht(R, t));
-  }, [t, L]);
+    t !== b.current.snapshot && O((R) => Ht(R, t));
+  }, [t, O]);
   const j = q(async (R, G) => {
-    if (!(g || !f || O.current)) {
-      O.current = !0;
+    if (!(g || !f || L.current)) {
+      L.current = !0;
       try {
         const _ = await f(R, G);
-        _ && L((J) => ({
+        _ && O((J) => ({
           ...J,
           features: Br(J.features, _, G),
           pendingAdditions: [...J.pendingAdditions, {
@@ -3329,31 +3329,31 @@ function gs({ ref: e, initialFeatures: t, moduleId: n, widthOf: r, isCollapsed:
           }]
         }));
       } finally {
-        O.current = !1;
+        L.current = !1;
       }
     }
   }, [
     g,
     f,
-    L
+    O
   ]);
   tt(e, () => ({
     addFeature: (R) => j(R),
     addSubFeature: (R, G) => j(G, R),
-    updateFeature: (R, G) => L((_) => ({
+    updateFeature: (R, G) => O((_) => ({
       ..._,
       features: on(_.features, R, G)
     }))
-  }), [j, L]);
-  const H = q((R) => L((G) => ms(G, R)), [L]), M = q((R, G) => {
+  }), [j, O]);
+  const H = q((R) => O((G) => ms(G, R)), [O]), M = q((R, G) => {
     const _ = R.toString();
-    !y || g || N.current.has(_) || (N.current.add(_), L((J) => ({
+    !y || g || N.current.has(_) || (N.current.add(_), O((J) => ({
       ...J,
       features: ln(J.features, _, G),
       pendingRenames: new Map(J.pendingRenames).set(_, G)
     })), y(R, G).catch(() => H(R)).finally(() => N.current.delete(_)));
   }, [
-    L,
+    O,
     y,
     g,
     H
@@ -3363,24 +3363,24 @@ function gs({ ref: e, initialFeatures: t, moduleId: n, widthOf: r, isCollapsed:
     S.pendingCollapses
   ]), W = q((R) => {
     const G = !T(R);
-    L((_) => ({
+    O((_) => ({
       ..._,
       features: sn(_.features, R.id.toString(), G),
       pendingCollapses: new Map(_.pendingCollapses).set(R.id.toString(), G)
     })), s?.(R.id, G);
   }, [
-    L,
+    O,
     T,
     s
   ]), X = q((R) => {
-    L((G) => {
+    O((G) => {
       const _ = new Map(G.pendingCollapses);
       return _.delete(R.id.toString()), Ht({
         ...G,
         pendingCollapses: _
       }, G.snapshot);
     }), s?.(R.id, R.collapsed);
-  }, [L, s]), D = S.features, z = oe(() => D.map((R) => {
+  }, [O, s]), D = S.features, z = oe(() => D.map((R) => {
     const G = zr(R, /* @__PURE__ */ new Set());
     return {
       feature: R,
@@ -3392,12 +3392,12 @@ function gs({ ref: e, initialFeatures: t, moduleId: n, widthOf: r, isCollapsed:
     d,
     r
   ]), I = z.flatMap((R) => [R.feature, ...R.children]).filter(d), k = new Set(z.filter((R) => R.children.length).map((R) => R.feature.id.toString())), E = new Set(z.flatMap((R) => R.children.map((G) => G.id.toString()))), $ = D.map((R) => R.id), Y = q((R, G) => {
-    L((_) => ({
+    O((_) => ({
       ..._,
       features: Wt(_.features, G),
       order: G
     })), h?.(Wt(b.current.features, G));
-  }, [L, h]), { featureDrag: Q, handleFeatureDragStart: P } = ds(n, $, h ? Y : void 0), V = (R) => ({
+  }, [O, h]), { featureDrag: Q, handleFeatureDragStart: P } = ds(n, $, h ? Y : void 0), V = (R) => ({
     collapsed: T(R),
     dragging: Q?.featureId.equals(R.id) ?? !1,
     onDragStart: P,
@@ -3803,7 +3803,7 @@ var vs = ({ type: e }) => /* @__PURE__ */ a("svg", {
       title: C.disabled ? C.disabledTooltip ?? C.tooltip : C.tooltip,
       "aria-label": C.tooltip,
       disabled: C.disabled,
-      onClick: (O) => C.onActivate(e, O.currentTarget.getBoundingClientRect()),
+      onClick: (L) => C.onActivate(e, L.currentTarget.getBoundingClientRect()),
       children: [C.icon, C.indicator && /* @__PURE__ */ a("span", {
         className: "event-modeling-feature-chat-dot",
         "aria-hidden": "true"
@@ -3843,7 +3843,7 @@ var vs = ({ type: e }) => /* @__PURE__ */ a("svg", {
           borderColor: "var(--text-color)",
           color: "var(--text-color)"
         } : void 0,
-        onClick: (O) => C.onActivate(e, O.currentTarget.getBoundingClientRect()),
+        onClick: (L) => C.onActivate(e, L.currentTarget.getBoundingClientRect()),
         children: C.icon
       }, C.tooltip)),
       !m.readOnly && /* @__PURE__ */ a(ws, {
@@ -3893,7 +3893,7 @@ var vs = ({ type: e }) => /* @__PURE__ */ a("svg", {
         title: C.disabled ? C.disabledTooltip ?? C.tooltip : C.tooltip,
         "aria-label": C.tooltip,
         disabled: C.disabled,
-        onClick: (O) => C.onActivate(e, O.currentTarget.getBoundingClientRect()),
+        onClick: (L) => C.onActivate(e, L.currentTarget.getBoundingClientRect()),
         children: C.icon
       }, C.tooltip)),
       !m.readOnly && /* @__PURE__ */ a(Rr, { suggestions: m.actions.featureHeaderSuggestions ?? [] }),
@@ -4043,9 +4043,9 @@ var ks = ({ state: e, specification: t }) => {
   }), s = new Set(e.map((u) => u.id.toString())), d = r.filter((u) => !s.has(u.id.toString()));
   return d.length || o.some((u, l) => u !== e[l]) ? [...o, ...d] : e;
 }, Ps = 1, Ds = ({ sliceId: e, width: t, collapsed: n, specifications: r, runInfoFor: i, renderRows: o }) => {
-  const { editing: s, actions: d, messages: u } = K(), l = ve(), [c, f] = F(r), [y, h] = F(!1), [m, g] = F(!1), [v, p] = F(!1), w = A(0), b = A(!1), S = A(!1), C = A(!1), O = A(/* @__PURE__ */ new Set()), N = Os(l, s), L = N ? r : c;
+  const { editing: s, actions: d, messages: u } = K(), l = ve(), [c, f] = F(r), [y, h] = F(!1), [m, g] = F(!1), [v, p] = F(!1), w = A(0), b = A(!1), S = A(!1), C = A(!1), L = A(/* @__PURE__ */ new Set()), N = Os(l, s), O = N ? r : c;
   re(() => {
-    f((k) => Ls(k, r, N, Date.now() <= w.current, O.current));
+    f((k) => Ls(k, r, N, Date.now() <= w.current, L.current));
   }, [r, N]);
   const j = async () => {
     if (b.current || !s.onSpecificationAdded) return;
@@ -4067,7 +4067,7 @@ var ks = ({ state: e, specification: t }) => {
       b.current = !1, p(!1);
     }
   }, H = (k) => {
-    O.current.has(k.toString()) || (O.current.add(k.toString()), w.current = 0, f((E) => E.filter(($) => !$.id.equals(k))), s.onSpecificationRemoved?.(e, k));
+    L.current.has(k.toString()) || (L.current.add(k.toString()), w.current = 0, f((E) => E.filter(($) => !$.id.equals(k))), s.onSpecificationRemoved?.(e, k));
   }, M = (k, E) => {
     f(($) => $.map((Y) => Y.id.equals(k) ? {
       ...Y,
@@ -4097,7 +4097,7 @@ var ks = ({ state: e, specification: t }) => {
       }
     }
   }, D = d.specificationsGenerate, z = d.specificationsRunAll, I = !l && D && (!D.when || D.when(e));
-  return n ? null : /* @__PURE__ */ x(ee, { children: [L.map((k, E) => {
+  return n ? null : /* @__PURE__ */ x(ee, { children: [O.map((k, E) => {
     const { state: $, message: Y } = i(k);
     return /* @__PURE__ */ x("div", {
       "data-slice-spec-col": "true",
@@ -4239,16 +4239,16 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
   re(() => () => {
     m.current && clearTimeout(m.current);
   }, []);
-  const w = q((O) => {
-    if (O.stopPropagation(), m.current) {
+  const w = q((L) => {
+    if (L.stopPropagation(), m.current) {
       clearTimeout(m.current), m.current = null;
       return;
     }
     m.current = setTimeout(() => {
       m.current = null, o?.();
     }, zs);
-  }, [o]), b = q((O) => {
-    O.stopPropagation(), m.current && (clearTimeout(m.current), m.current = null), s?.();
+  }, [o]), b = q((L) => {
+    L.stopPropagation(), m.current && (clearTimeout(m.current), m.current = null), s?.();
   }, [s]), S = r ? {
     outline: `2px solid ${t}`,
     outlineOffset: 2
@@ -4262,9 +4262,9 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
       ref: v,
       className: "event-modeling-card__title",
       style: { fontSize: p.fontSizePx },
-      children: p.lines.length > 1 ? p.lines.map((O, N) => /* @__PURE__ */ a("span", {
+      children: p.lines.length > 1 ? p.lines.map((L, N) => /* @__PURE__ */ a("span", {
         className: "event-modeling-card__title-line",
-        children: O
+        children: L
       }, N)) : p.lines[0]
     }), d]
   }), u] });
@@ -4729,7 +4729,7 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
   const { editing: s, messages: d } = K(), u = ve(), { onGivenEventAdded: l, onGivenEventValuesSet: c, onGivenReadModelSet: f, onGivenReadModelValuesSet: y, onGivenEventRemoved: h, onGivenReadModelRemoved: m, onSpecificationItemOpened: g } = s, [v, p] = F(n.given), [w, b] = F(n.givenReadModel), [S, C] = F(() => ({
     ...jr(n.given),
     ...n.givenReadModel ? { [n.givenReadModel.id.toString()]: n.givenReadModel.values ?? {} } : {}
-  })), O = u || !(l || c || f || y || h || m || g), N = O ? n.given : v, L = O ? n.givenReadModel : w, j = oe(() => nl(r), [r]), H = oe(() => new Map(j.map((P) => [P.id.toString(), P])), [j]), M = (P, V, te, R, G, _) => g?.({
+  })), L = u || !(l || c || f || y || h || m || g), N = L ? n.given : v, O = L ? n.givenReadModel : w, j = oe(() => nl(r), [r]), H = oe(() => new Map(j.map((P) => [P.id.toString(), P])), [j]), M = (P, V, te, R, G, _) => g?.({
     sliceId: e,
     specificationId: n.id,
     itemId: P,
@@ -4763,7 +4763,7 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
     p((V) => V.filter((te) => !te.id.equals(P))), h?.(e, n.id, P);
   }, D = () => {
     b(void 0), m?.(e, n.id);
-  }, z = (P) => (V) => c?.(e, n.id, P, V), I = !u && t === B.stateChange && !!l, k = !u && !!i && !!f && !!g && rl(!0, !!L), E = L && (o ?? L.name), $ = L?.id ?? L?.readModelItemId, Y = L && $ && E !== void 0 && /* @__PURE__ */ a(yt, {
+  }, z = (P) => (V) => c?.(e, n.id, P, V), I = !u && t === B.stateChange && !!l, k = !u && !!i && !!f && !!g && rl(!0, !!O), E = O && (o ?? O.name), $ = O?.id ?? O?.readModelItemId, Y = O && $ && E !== void 0 && /* @__PURE__ */ a(yt, {
     name: E,
     onRemoved: m ? D : void 0,
     children: /* @__PURE__ */ a(Le, {
@@ -4806,26 +4806,26 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
   });
 }, ol = ({ sliceId: e, sliceType: t, specification: n, command: r, renamedCommandName: i, events: o = [] }) => {
   const { editing: s, messages: d } = K(), u = ve(), { onWhenCommandSet: l, onWhenCommandValuesSet: c, onSpecificationItemOpened: f } = s, [y, h] = F(n.when), [m, g] = F(n.when?.values ?? {}), v = u || !(l || c || f) ? n.when : y, p = (N) => {
-    const L = de.create();
+    const O = de.create();
     h({
-      id: L,
+      id: O,
       commandId: N.id,
       name: N.name,
       values: {}
-    }), g({}), l?.(e, n.id, L, N.id, N.name);
-  }, w = (N, L, j, H, M) => f?.({
+    }), g({}), l?.(e, n.id, O, N.id, N.name);
+  }, w = (N, O, j, H, M) => f?.({
     sliceId: e,
     specificationId: n.id,
     itemId: N,
     kind: Be.command,
     name: j,
-    schema: L && r?.id.equals(L) ? r.schema : void 0,
+    schema: O && r?.id.equals(O) ? r.schema : void 0,
     values: M,
     host: H,
     onValuesSet: (T) => {
       y?.id.equals(N) && g(T), c?.(e, n.id, T);
     }
-  }), b = t === B.stateChange ? r : void 0, S = t === B.stateView ? o : [], C = v && (v.commandId && r?.id.equals(v.commandId) ? i ?? v.name : v.name), O = !u && !!f && !!c;
+  }), b = t === B.stateChange ? r : void 0, S = t === B.stateView ? o : [], C = v && (v.commandId && r?.id.equals(v.commandId) ? i ?? v.name : v.name), L = !u && !!f && !!c;
   return /* @__PURE__ */ x(un, {
     headline: d.specifications.when,
     actions: !u && t !== B.stateChange && t !== B.stateView && !v && r && l && /* @__PURE__ */ a(cn, {
@@ -4837,12 +4837,12 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
       v && C && /* @__PURE__ */ a(Le, {
         name: C,
         colors: et,
-        onOpen: O ? (N) => w(v.id, v.commandId, C, N, m) : void 0
+        onOpen: L ? (N) => w(v.id, v.commandId, C, N, m) : void 0
       }, v.id.toString()),
       b && /* @__PURE__ */ a(Le, {
         name: b.name,
         colors: et,
-        onOpen: O ? (N) => w(b.id, b.id, b.name, N, m) : void 0
+        onOpen: L ? (N) => w(b.id, b.id, b.name, N, m) : void 0
       }, b.id.toString()),
       S.map((N) => /* @__PURE__ */ a(Le, {
         name: N.name,
@@ -4905,7 +4905,7 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
     disabled: n
   });
 }, cl = ({ sliceId: e, sliceType: t, specification: n, events: r, command: i, readModel: o, renamedEventNames: s = {}, extra: d }) => {
-  const { editing: u, messages: l } = K(), c = ve(), { onThenEventAdded: f, onThenEventValuesSet: y, onThenErrorAdded: h, onThenRuleErrorAdded: m, onThenErrorRenamed: g, onThenEventRemoved: v, onThenErrorRemoved: p, onThenReadModelValuesSet: w, onSpecificationItemOpened: b } = u, [S, C] = F(n.thenEvents), [O, N] = F(n.thenErrors), [L, j] = F(() => jr(n.thenEvents)), [H, M] = F({}), T = c || !(f || y || h || m || g || v || p || w || b), W = T ? n.thenEvents : S, X = T ? n.thenErrors : O, D = oe(() => new Map(r.map((_) => [_.id.toString(), _])), [r]), z = oe(() => sl(i, r), [i, r]), I = !c && t !== B.stateView, k = (_) => {
+  const { editing: u, messages: l } = K(), c = ve(), { onThenEventAdded: f, onThenEventValuesSet: y, onThenErrorAdded: h, onThenRuleErrorAdded: m, onThenErrorRenamed: g, onThenEventRemoved: v, onThenErrorRemoved: p, onThenReadModelValuesSet: w, onSpecificationItemOpened: b } = u, [S, C] = F(n.thenEvents), [L, N] = F(n.thenErrors), [O, j] = F(() => jr(n.thenEvents)), [H, M] = F({}), T = c || !(f || y || h || m || g || v || p || w || b), W = T ? n.thenEvents : S, X = T ? n.thenErrors : L, D = oe(() => new Map(r.map((_) => [_.id.toString(), _])), [r]), z = oe(() => sl(i, r), [i, r]), I = !c && t !== B.stateView, k = (_) => {
     const J = de.create();
     C((ae) => [...ae, {
       id: J,
@@ -4950,7 +4950,7 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
           kind: Be.event,
           name: ae,
           schema: J?.schema,
-          values: L[_.id.toString()] ?? {},
+          values: O[_.id.toString()] ?? {},
           host: Ie,
           onValuesSet: (Ye) => {
             j((rt) => ({
@@ -5186,12 +5186,12 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
     })]
   })
 }), gl = ({ feature: e, options: t, moduleId: n, collection: r, rows: i, heights: o, slices: s, externalEvents: d, slots: u, editor: l, onSliceArea: c, sliceAreas: f, renderHeader: y, onSlicesChanged: h }) => {
-  const m = A(null), g = (S) => s.slice(0, s.findIndex((C) => C.id.equals(S))).filter((C) => C.sliceType === B.stateChange).flatMap((C) => C.events), v = (S) => s.slice(s.findIndex((C) => C.id.equals(S)) + 1).filter((C) => C.sliceType === B.stateChange).flatMap((C) => C.events), p = q(async (S, C, O) => {
+  const m = A(null), g = (S) => s.slice(0, s.findIndex((C) => C.id.equals(S))).filter((C) => C.sliceType === B.stateChange).flatMap((C) => C.events), v = (S) => s.slice(s.findIndex((C) => C.id.equals(S)) + 1).filter((C) => C.sliceType === B.stateChange).flatMap((C) => C.events), p = q(async (S, C, L) => {
     const N = f.get(C.toString());
-    N?.moveIn(S, O);
+    N?.moveIn(S, L);
     try {
-      const L = await l.onMoveSlice?.(S, e.id, C, O) ?? !1;
-      return N?.completeMoveIn(S.id, L), L;
+      const O = await l.onMoveSlice?.(S, e.id, C, L) ?? !1;
+      return N?.completeMoveIn(S.id, O), O;
     } catch {
       return N?.completeMoveIn(S.id, !1), !1;
     }
@@ -5200,7 +5200,7 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
     e.id,
     f
   ]), w = q((S, C) => {
-    !l.onMoveSlice || C.equals(e.id) || !m.current?.moveOut(S.id) || p(S, C, Number.MAX_SAFE_INTEGER).then((O) => m.current?.completeMoveOut(S.id, O));
+    !l.onMoveSlice || C.equals(e.id) || !m.current?.moveOut(S.id) || p(S, C, Number.MAX_SAFE_INTEGER).then((L) => m.current?.completeMoveOut(S.id, L));
   }, [
     l.onMoveSlice,
     e.id,
@@ -5258,22 +5258,22 @@ var zs = 250, Vs = "Inter, Helvetica, Arial, sans-serif", Ue = ({ name: e, backg
           onSliceDragStart: C.onSliceDragStart,
           onAddSlice: l.onAddSlice ? C.addSlice : void 0,
           onToggleCollapse: l.onSliceCollapseChanged ? () => {
-            m.current?.updateSlices((O) => O.map((N) => N.id.equals(S.id) ? {
+            m.current?.updateSlices((L) => L.map((N) => N.id.equals(S.id) ? {
               ...N,
               collapsed: !C.sliceCollapsed
             } : N)), l.onSliceCollapseChanged?.(e.id, S.id, !C.sliceCollapsed);
           } : void 0,
-          onRenamed: l.onSliceRenamed ? (O) => {
-            m.current?.updateSlices((N) => N.map((L) => L.id.equals(S.id) ? {
-              ...L,
-              name: O
-            } : L)), l.onSliceRenamed?.(e.id, S.id, O);
+          onRenamed: l.onSliceRenamed ? (L) => {
+            m.current?.updateSlices((N) => N.map((O) => O.id.equals(S.id) ? {
+              ...O,
+              name: L
+            } : O)), l.onSliceRenamed?.(e.id, S.id, L);
           } : void 0,
-          onMoveToFeature: l.onMoveSlice ? (O) => w(S, O) : void 0,
-          onDuplicated: l.onSliceDuplicated ? (O) => {
-            l.onSliceDuplicated?.(e.id, S.id, O), m.current?.addProjectedSlice({
+          onMoveToFeature: l.onMoveSlice ? (L) => w(S, L) : void 0,
+          onDuplicated: l.onSliceDuplicated ? (L) => {
+            l.onSliceDuplicated?.(e.id, S.id, L), m.current?.addProjectedSlice({
               ...S,
-              id: O,
+              id: L,
               name: ud(e.slices.map((N) => N.name), S.name),
               specifications: [],
               commentCount: 0,
@@ -5415,7 +5415,7 @@ function fl(e, t) {
     features: n.features.map((r) => Qr(t, r))
   }));
 }
-var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect: r, onCollectionMoving: i, onCollectionMoved: o, canMove: s, onAddModule: d, onModulesReordered: u, onCollapseChanged: l, onRenameModule: c, onModulesChanged: f, onFeaturesChanged: y, onPersistenceError: h, rowLabels: m, onActorsReordered: g, onAddFeature: v, onRenameFeature: p, onFeatureCollapseChanged: w, onFeaturesReordered: b, onAddSlice: S, onReorderSlices: C, onMoveSlice: O, validateSliceDrop: N, onSliceCollapseChanged: L, onSliceRenamed: j, onSliceDuplicated: H }) => {
+var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect: r, onCollectionMoving: i, onCollectionMoved: o, canMove: s, onAddModule: d, onModulesReordered: u, onCollapseChanged: l, onRenameModule: c, onModulesChanged: f, onFeaturesChanged: y, onPersistenceError: h, rowLabels: m, onActorsReordered: g, onAddFeature: v, onRenameFeature: p, onFeatureCollapseChanged: w, onFeaturesReordered: b, onAddSlice: S, onReorderSlices: C, onMoveSlice: L, validateSliceDrop: N, onSliceCollapseChanged: O, onSliceRenamed: j, onSliceDuplicated: H }) => {
   const { readOnly: M, editing: T } = K(), [W, X] = F(/* @__PURE__ */ new Map()), D = q((ie, ce) => X((be) => new Map(be).set(ie.toString(), ce)), []), z = oe(() => fl(e.modules, W), [e.modules, W]), I = M ? {
     onFeatureCollapseChanged: D,
     onSliceCollapseChanged: (ie, ce, be) => D(ce, be)
@@ -5426,12 +5426,12 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
     onFeaturesReordered: b,
     onAddSlice: S,
     onReorderSlices: C,
-    onMoveSlice: O,
+    onMoveSlice: L,
     validateSliceDrop: N,
-    onSliceCollapseChanged: L,
+    onSliceCollapseChanged: O,
     onSliceRenamed: j,
     onSliceDuplicated: H
-  }, [k, E] = F(e.modules), [$, Y] = F(/* @__PURE__ */ new Map()), Q = A(null), [P, V] = F(0), te = !!(d || u || l || c || g || v || p || w || b || S || C || O || L || j || H || s && i && o || pl(T)), R = M || !te, G = M ? z : e.modules, _ = (R ? G : k).map((ie) => ({
+  }, [k, E] = F(e.modules), [$, Y] = F(/* @__PURE__ */ new Map()), Q = A(null), [P, V] = F(0), te = !!(d || u || l || c || g || v || p || w || b || S || C || L || O || j || H || s && i && o || pl(T)), R = M || !te, G = M ? z : e.modules, _ = (R ? G : k).map((ie) => ({
     ...ie,
     features: R ? ie.features : $.get(ie.id.toString()) ?? ie.features
   })), J = {
@@ -5760,7 +5760,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
         height: Math.min(k.height, I.contentHeight)
       }
     }];
-  })), [t]), C = oe(() => kl(v, (I) => S.get(I)?.content), [v, S]), O = (I, k) => {
+  })), [t]), C = oe(() => kl(v, (I) => S.get(I)?.content), [v, S]), L = (I, k) => {
     for (const E of S.values())
       if (E.id.toString() !== k.toString() && Jo(I, E.rect))
         return E;
@@ -5771,7 +5771,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
       x: k.anchor.x + (I.clientX - k.startClientX) / E,
       y: k.anchor.y + (I.clientY - k.startClientY) / E
     };
-  }, L = (I, k) => (E) => {
+  }, O = (I, k) => (E) => {
     m.current.pending.size > 0 || (E.stopPropagation(), E.preventDefault(), E.currentTarget.setPointerCapture(E.pointerId), p.current = {
       sourceId: I,
       anchor: k,
@@ -5785,7 +5785,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
   }, j = (I) => {
     const k = p.current;
     if (!k) return;
-    const E = N(I, k), $ = O(E, k.sourceId);
+    const E = N(I, k), $ = L(E, k.sourceId);
     w.current = $?.id.toString() ?? null, f({
       sourceId: k.sourceId.toString(),
       pointer: E,
@@ -5794,7 +5794,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
   }, H = async (I) => {
     const k = p.current, E = w.current;
     if (p.current = null, w.current = null, f(null), !k) return;
-    const $ = O(N(I, k), k.sourceId), Y = Zo($, E, (V) => S.get(V), k.sourceId.toString());
+    const $ = L(N(I, k), k.sourceId), Y = Zo($, E, (V) => S.get(V), k.sourceId.toString());
     if (!Y || !u || m.current.pending.size > 0) return;
     const Q = {
       id: de.create(),
@@ -5887,7 +5887,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
             top: E.y
           },
           title: d.dragToLink,
-          onPointerDown: L(I, E),
+          onPointerDown: O(I, E),
           onPointerMove: j,
           onPointerUp: H,
           onPointerCancel: T
@@ -6014,7 +6014,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
       ...W,
       position: T
     }), w());
-  }, O = (M, T) => {
+  }, L = (M, T) => {
     const W = o.current.get(M);
     !W || s.current.has(M) || W.position.x === T.position.x && W.position.y === T.position.y && W.width === T.width && W.height === T.height || (l.current.add(M), o.current.change(M, {
       ...W,
@@ -6024,7 +6024,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
     if (!u.current.delete(M)) return;
     const T = o.current.get(M);
     T && n.onStickyNoteMoved && b(M, T, () => n.onStickyNoteMoved?.(M, T.position));
-  }, L = (M) => {
+  }, O = (M) => {
     if (!l.current.delete(M)) return;
     const T = o.current.get(M);
     T && n.onStickyNoteResized && b(M, T, () => n.onStickyNoteResized?.(M, {
@@ -6081,7 +6081,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
               y: z
             }) : ct,
             onMoveEnd: n.onStickyNoteMoved ? N : void 0,
-            onResize: n.onStickyNoteResized ? (X, D, z, I, k) => O(X, {
+            onResize: n.onStickyNoteResized ? (X, D, z, I, k) => L(X, {
               position: {
                 x: D,
                 y: z
@@ -6089,7 +6089,7 @@ var bl = () => 1, yl = ({ collection: e, getZoom: t = bl, slots: n, onDeselect:
               width: I,
               height: k
             }) : ct,
-            onResizeEnd: n.onStickyNoteResized ? L : void 0,
+            onResizeEnd: n.onStickyNoteResized ? O : void 0,
             onTextChange: n.onStickyNoteTextChanged ? j : ct,
             onExpandedChange: (X, D) => g((z) => D ? X : z === X ? void 0 : z)
           }), s.current.has(M.id) && /* @__PURE__ */ a("span", {
@@ -6170,35 +6170,35 @@ var Fl = ({ collections: e, links: t, stickyNotes: n, readOnly: r, editor: i, ca
         height: E
       });
     });
-  }, []), O = Un(e.estimateSize), { renderCollection: N } = e, L = Un(q((I) => (k) => N(I, k), [N])), j = oe(() => So(c), [c]), H = oe(() => Pl(j.map((I) => ({
+  }, []), L = Un(e.estimateSize), { renderCollection: N } = e, O = Un(q((I) => (k) => N(I, k), [N])), j = oe(() => So(c), [c]), H = oe(() => Pl(j.map((I) => ({
     position: I.position,
-    size: O(I)
-  }))), [j, O]), { countSlices: M } = e, T = oe(() => _l(c.reduce((I, k) => I + M(k), 0)), [c, M]), W = oe(() => j.flatMap((I) => {
+    size: L(I)
+  }))), [j, L]), { countSlices: M } = e, T = oe(() => _l(c.reduce((I, k) => I + M(k), 0)), [c, M]), W = oe(() => j.flatMap((I) => {
     const k = v.get(I.id.toString());
     return k ? [{
       id: I.id,
       position: I.position,
       width: k.width,
       height: k.height,
-      contentHeight: O(I).height
+      contentHeight: L(I).height
     }] : [];
   }), [
     j,
     v,
-    O
+    L
   ]), X = o?.onTransformChange, D = q((I, k) => {
     w.current = I, X?.(I, k);
   }, [X]), z = /* @__PURE__ */ x(ee, { children: [
     j.map((I) => /* @__PURE__ */ a(ni, {
       collection: I,
-      estimatedSize: O(I),
+      estimatedSize: L(I),
       measuredSize: v.get(I.id.toString()),
       onSize: C,
       getZoom: b,
       canMove: y && !f.has(I.id.toString()),
       onCollectionMoving: y ? h : void 0,
       onCollectionMoved: y ? m : void 0,
-      content: L(I)
+      content: O(I)
     }, I.id.toString())),
     /* @__PURE__ */ a(Il, {
       links: t,
@@ -6463,10 +6463,10 @@ function jl(e, t, n, r) {
   }, []), f = q((g, v, p) => {
     const w = document.querySelector(`[data-slice-drop-target="true"][data-slice-module-id="${g.toString()}"][data-slice-feature-id="${p.toString()}"]`);
     return p.equals(v) ? w?.dataset.sliceAcceptsReorder === "true" : w?.dataset.sliceAcceptsMove === "true";
-  }, []), y = q((g, v, p, w, b, S, C, O = null) => {
+  }, []), y = q((g, v, p, w, b, S, C, L = null) => {
     const N = e.slices.findIndex((j) => j.id.equals(g));
     if (N === -1) return;
-    const L = c(g, e.id, N);
+    const O = c(g, e.id, N);
     o({
       sliceId: g,
       moduleId: t,
@@ -6475,14 +6475,14 @@ function jl(e, t, n, r) {
       sourceIndex: N,
       ghostLabel: v,
       ghostWidth: b,
-      ghost: O,
+      ghost: L,
       currentX: p,
       currentY: w,
       dropIndex: N,
       headerY: S,
       zoom: C,
-      isValid: (L?.isValid ?? !0) && f(t, e.id, e.id),
-      invalidReason: L?.reason
+      isValid: (O?.isValid ?? !0) && f(t, e.id, e.id),
+      invalidReason: O?.reason
     });
   }, [
     e,
@@ -6512,8 +6512,8 @@ function jl(e, t, n, r) {
       const w = s.current;
       if (!w) return;
       const b = h(w.moduleId, p.clientX), S = m(b, p.clientX), C = c(w.sliceId, b, S);
-      o((O) => O ? {
-        ...O,
+      o((L) => L ? {
+        ...L,
         currentX: p.clientX,
         currentY: p.clientY,
         targetFeatureId: b,
@@ -6627,11 +6627,11 @@ var Zl = ({ featureId: e, name: t, status: n, width: r, collapsed: i, isDragging
   const { readOnly: f } = K(), y = Qa(t.id.toString()), { ref: h, onMouseEnter: m, onMouseLeave: g } = ns(y?.connectedSliceIds), v = A(null), p = Zt(v), [w, b] = F(!1), S = A(!1), C = pr({
     sliceType: t.sliceType,
     eventCount: n
-  }), O = () => {
+  }), L = () => {
     S.current = !0, m();
   }, N = () => {
     S.current = !1, w || g();
-  }, L = (j) => {
+  }, O = (j) => {
     const H = j.relatedTarget;
     (!(H instanceof Node) || !j.currentTarget.contains(H)) && b(!1);
   };
@@ -6658,10 +6658,10 @@ var Zl = ({ featureId: e, name: t, status: n, width: r, collapsed: i, isDragging
         collapsed: r,
         isDragging: i,
         onDragStart: f ? void 0 : o,
-        onMouseEnter: O,
+        onMouseEnter: L,
         onMouseLeave: N,
         onFocusCapture: () => b(!0),
-        onBlurCapture: L,
+        onBlurCapture: O,
         children: [s ?? /* @__PURE__ */ a(oi, {
           slice: t,
           height: d,
@@ -6845,7 +6845,7 @@ var Zl = ({ featureId: e, name: t, status: n, width: r, collapsed: i, isDragging
   return `${n} (${Array.from({ length: i.size + 1 }, (o, s) => s + 1).find((o) => !i.has(o))})`;
 };
 function md({ ref: e, initialSlices: t, moduleId: n, featureId: r, featureCollapsed: i, hideEmptyPlaceholder: o = !1, onSlicesChanged: s, createSlice: d, onAddSlice: u, onReorderSlices: l, onMoveSlice: c, validateSliceDrop: f, renderSlice: y }) {
-  const { readOnly: h, messages: m } = K(), g = A(ed(t)), v = A(void 0), [p, w] = F(g.current), { slices: b } = p, S = A(!1), [C, O] = F(!1), N = q((E) => {
+  const { readOnly: h, messages: m } = K(), g = A(ed(t)), v = A(void 0), [p, w] = F(g.current), { slices: b } = p, S = A(!1), [C, L] = F(!1), N = q((E) => {
     const $ = g.current, Y = E($);
     Y !== $ && (g.current = Y, w(Y), Y.slices !== $.slices && (v.current = Y.slices, s?.(Y.slices)));
   }, [s]);
@@ -6855,7 +6855,7 @@ function md({ ref: e, initialSlices: t, moduleId: n, featureId: r, featureCollap
       snapshot: t
     } : qe(E, t));
   }, [t, N]);
-  const L = q((E) => {
+  const O = q((E) => {
     N(($) => {
       const Y = E($.slices);
       return Y === $.slices ? $ : {
@@ -6865,12 +6865,12 @@ function md({ ref: e, initialSlices: t, moduleId: n, featureId: r, featureCollap
     });
   }, [N]), j = q((E, $) => N((Y) => rd(Y, E, $)), [N]), H = q((E, $) => N((Y) => ld(Y, E, $)), [N]), M = q((E, $) => N((Y) => dd(Y, E, $)), [N]), T = q((E) => [...g.current.additions, ...g.current.incoming].some(($) => $.slice.id.equals(E)) || !g.current.slices.some(($) => $.id.equals(E)) ? !1 : (N(($) => ad($, E)), !0), [N]), W = q((E, $) => N((Y) => sd(Y, E, $)), [N]), X = q((E, $, Y) => {
     if (h || !u || S.current) return;
-    S.current = !0, O(!0);
+    S.current = !0, L(!0);
     const Q = d(Ql(E, Y));
     N((P) => nd(P, Q, $)), Promise.resolve().then(() => u(Q, $)).then((P) => {
       N((V) => Xn(V, Q.id, P));
     }).catch(() => N((P) => Xn(P, Q.id))).finally(() => {
-      S.current = !1, O(!1);
+      S.current = !1, L(!1);
     });
   }, [
     h,
@@ -6880,7 +6880,7 @@ function md({ ref: e, initialSlices: t, moduleId: n, featureId: r, featureCollap
   ]);
   tt(e, () => ({
     addSlice: X,
-    updateSlices: L,
+    updateSlices: O,
     addProjectedSlice: j,
     moveIn: H,
     completeMoveIn: M,
@@ -6888,7 +6888,7 @@ function md({ ref: e, initialSlices: t, moduleId: n, featureId: r, featureCollap
     completeMoveOut: W
   }), [
     X,
-    L,
+    O,
     j,
     H,
     M,
@@ -6952,7 +6952,7 @@ function md({ ref: e, initialSlices: t, moduleId: n, featureId: r, featureCollap
           isDragging: I?.sliceId.equals(E.id) ?? !1,
           onSliceDragStart: [...p.additions, ...p.incoming].some((te) => te.slice.id.equals(E.id)) ? void 0 : k,
           addSlice: X,
-          updateSlices: L
+          updateSlices: O
         })
       }, E.id.toString())), Y && $ === b.length - 1 && I?.dropIndex === b.length && P.push(/* @__PURE__ */ a(jn, {
         isValid: I.isValid,
@@ -7197,46 +7197,53 @@ var Sc = ({ slice: e, contentRows: t, rowHeights: n }) => /* @__PURE__ */ a(ee,
       })
     })
   });
-}, Nd = ({ elements: e, windowSize: t, layout: n, collapsed: r = !1, conn: i, rowHeight: o, actorId: s }) => {
-  const { readOnly: d, sliceId: u } = De(), { editing: l, actions: c, readOnly: f } = K(), { onPrototypeOpened: y, onPrototypeAdded: h } = l, m = A(null), [g, v] = F(), p = Si().prototypeThumbnail, w = { height: o }, b = "event-modeling-grid-slice-cell event-modeling-grid-slice-cell--centered event-modeling-grid-slice-cell--ui";
+}, Nd = ({ elements: e, windowSize: t, layout: n, collapsed: r = !1, conn: i, rowHeight: o, actorId: s, hasScreen: d = !1, renderThumbnail: u }) => {
+  const { readOnly: l, sliceId: c } = De(), { editing: f, actions: y, readOnly: h } = K(), { onPrototypeOpened: m, onPrototypeAdded: g } = f, v = A(null), [p, w] = F(), b = Si().prototypeThumbnail, S = { height: o }, C = "event-modeling-grid-slice-cell event-modeling-grid-slice-cell--centered event-modeling-grid-slice-cell--ui";
   if (r) return /* @__PURE__ */ a("div", {
-    style: w,
-    className: b
+    style: S,
+    className: C
+  });
+  const L = e.length > 0 || d, N = !l && c && m && c && m ? () => m(c, s, v.current?.getBoundingClientRect() ?? new DOMRect()) : h ? () => w(v.current?.getBoundingClientRect() ?? new DOMRect()) : void 0, O = /* @__PURE__ */ a(wi, {
+    elements: [...e],
+    windowSize: t,
+    layout: n,
+    onClick: N,
+    openTitle: h ? b.openPreview : void 0
   });
-  const S = e.length > 0, C = !d && u && y && u && y ? () => y(u, s, m.current?.getBoundingClientRect() ?? new DOMRect()) : f ? () => v(m.current?.getBoundingClientRect() ?? new DOMRect()) : void 0;
   return /* @__PURE__ */ x("div", {
-    style: w,
-    className: b,
+    style: S,
+    className: C,
     children: [
-      i.bottomOutgoing && S && /* @__PURE__ */ a(Ke, {}),
-      i.bottomIncoming && S && /* @__PURE__ */ a(Qe, {}),
+      i.bottomOutgoing && L && /* @__PURE__ */ a(Ke, {}),
+      i.bottomIncoming && L && /* @__PURE__ */ a(Qe, {}),
       /* @__PURE__ */ x("div", {
         className: "event-modeling-grid-slice-cell-items",
-        children: [S && /* @__PURE__ */ a("div", {
-          ref: m,
-          className: `event-modeling-grid-ui-preview${C ? " event-modeling-grid-ui-preview--clickable" : ""}`,
+        children: [L && /* @__PURE__ */ a("div", {
+          ref: v,
+          className: `event-modeling-grid-ui-preview${N ? " event-modeling-grid-ui-preview--clickable" : ""}`,
           "data-flow-node": ue.ui,
-          children: /* @__PURE__ */ a(wi, {
-            elements: [...e],
+          children: u ? u({
+            elements: e,
             windowSize: t,
             layout: n,
-            onClick: C,
-            openTitle: f ? p.openPreview : void 0
-          })
-        }), g && /* @__PURE__ */ a(yi, {
+            onClick: N,
+            openTitle: h ? b.openPreview : void 0,
+            fallback: O
+          }) : O
+        }), p && /* @__PURE__ */ a(yi, {
           elements: e,
           windowSize: t,
           layout: n,
-          sourceRect: g,
-          onClose: () => v(void 0)
+          sourceRect: p,
+          onClose: () => w(void 0)
         })]
       }),
-      !d && u && h && !S && /* @__PURE__ */ a(Ge, {
+      !l && c && g && !L && /* @__PURE__ */ a(Ge, {
         placement: Te.add,
         children: /* @__PURE__ */ a(kd, {
-          templates: c.prototypeTemplates ?? [],
-          onFromScratch: (O) => h(u, s, O),
-          onFromTemplate: (O, N) => O.onChosen(u, s, N)
+          templates: y.prototypeTemplates ?? [],
+          onFromScratch: (j) => g(c, s, j),
+          onFromTemplate: (j, H) => j.onChosen(c, s, H)
         })
       })
     ]
@@ -7491,8 +7498,8 @@ var Od = ({ id: e, name: t, sourceEventId: n, isSelected: r = !1, onSelected: i,
   const { actions: d, selection: u, messages: l } = K(), c = ve(), [f, y] = F(r), [h, m] = F(void 0);
   re(() => y(r), [r]);
   const g = t === he.command, v = g ? d.commandCard : d.readModelCard, p = g ? et : nt, w = g ? l.interaction.command : l.interaction.readModel, b = !c && !!s, S = u.onArtifactSelected, C = () => {
-    const O = h?.trim() ?? "";
-    m(void 0), !(!O || !s) && (s(O), y(O));
+    const L = h?.trim() ?? "";
+    m(void 0), !(!L || !s) && (s(L), y(L));
   };
   return h !== void 0 ? /* @__PURE__ */ a(dn, {
     value: h,
@@ -7624,7 +7631,7 @@ var Od = ({ id: e, name: t, sourceEventId: n, isSelected: r = !1, onSelected: i,
     schema: b.schema,
     showDetails: o,
     onRenamed: y && ((H) => y(e.id, b.id, H))
-  }, b.id.toString()), O = S && /* @__PURE__ */ a(er, {
+  }, b.id.toString()), L = S && /* @__PURE__ */ a(er, {
     sliceId: e.id,
     kind: he.readModel,
     artifactId: S.id,
@@ -7655,7 +7662,7 @@ var Od = ({ id: e, name: t, sourceEventId: n, isSelected: r = !1, onSelected: i,
         })
       })
     }, H.id.toString());
-  }, L = !f && v.length > 0 && /* @__PURE__ */ a(Ge, {
+  }, O = !f && v.length > 0 && /* @__PURE__ */ a(Ge, {
     placement: Te.add,
     children: v.map((H) => /* @__PURE__ */ a(hn, { action: H }, H.tooltip))
   });
@@ -7672,7 +7679,7 @@ var Od = ({ id: e, name: t, sourceEventId: n, isSelected: r = !1, onSelected: i,
         hasLeftCard: !!e.readModel || H,
         hasRightCard: !!e.command,
         cards: /* @__PURE__ */ x(ee, { children: [
-          O,
+          L,
           H && /* @__PURE__ */ a(_d, {
             label: c.interaction.readModel,
             defineLabel: c.interaction.defineReadModel,
@@ -7705,11 +7712,11 @@ var Od = ({ id: e, name: t, sourceEventId: n, isSelected: r = !1, onSelected: i,
           })
         }),
         right: C,
-        rightCorner: L
+        rightCorner: O
       }
     });
   }
-  const j = e.sliceType === B.stateView ? O : e.sliceType === B.automation ? /* @__PURE__ */ x(ee, { children: [O, C] }) : e.sliceType === B.translator ? /* @__PURE__ */ x(ee, { children: [e.externalEvents.map(N), C] }) : C;
+  const j = e.sliceType === B.stateView ? L : e.sliceType === B.automation ? /* @__PURE__ */ x(ee, { children: [L, C] }) : e.sliceType === B.translator ? /* @__PURE__ */ x(ee, { children: [e.externalEvents.map(N), C] }) : C;
   return /* @__PURE__ */ a(Dt, {
     collapsed: t,
     conn: n,
@@ -7719,7 +7726,7 @@ var Od = ({ id: e, name: t, sourceEventId: n, isSelected: r = !1, onSelected: i,
       kind: "centered",
       hasItems: p.length > 0,
       cards: j,
-      corners: L
+      corners: O
     }
   });
 };