@likec4/diagram 1.19.1 → 1.20.0

package/dist/likec4diagram/state/machine.js

@@ -0,0 +1,783 @@
+import { nonexhaustive, invariant, nonNullable, getBBoxCenter, getParallelStepsPrefix, DiagramNode } from "@likec4/core";
+import { getViewportForBounds, applyNodeChanges, applyEdgeChanges } from "@xyflow/react";
+import { nodeToRect } from "@xyflow/system";
+import { hasAtLeast, first, clamp, prop } from "remeda";
+import { setup, assertEvent, enqueueActions, and, or, assign, sendTo, spawnChild, stopChild, raise, cancel } from "xstate";
+import { MinZoom } from "../../base/const.js";
+import { AllDisabled } from "../../context/DiagramFeatures.js";
+import { relationshipDetailsActor } from "../../overlays/relationship-details/actor.js";
+import { relationshipsBrowserActor } from "../../overlays/relationships-browser/actor.js";
+import { createLayoutConstraints } from "../useLayoutConstraints.js";
+import { getAligner, toNodeRect } from "./aligners.js";
+import { lastClickedNode, focusNodesEdges, unfocusNodesEdges, updateNavigationHistory, mergeXYNodesEdges, updateActiveWalkthrough, navigateBack, navigateForward, updateNodeData, updateEdgeData, resetEdgeControlPoints } from "./assign.js";
+import { hotkeyActor } from "./hotkeyActor.js";
+import { syncManualLayoutActor } from "./syncManualLayoutActor.js";
+import { focusedBounds } from "./utils.js";
+var DiagramContext;
+((DiagramContext2) => {
+  function findDiagramNode(ctx, xynodeId) {
+    return ctx.view.nodes.find((n) => n.id === xynodeId) ?? null;
+  }
+  DiagramContext2.findDiagramNode = findDiagramNode;
+  function findDiagramEdge(ctx, xyedgeId) {
+    return ctx.view.edges.find((e) => e.id === xyedgeId) ?? null;
+  }
+  DiagramContext2.findDiagramEdge = findDiagramEdge;
+})(DiagramContext || (DiagramContext = {}));
+const diagramMachine = setup({
+  types: {
+    context: {},
+    input: {},
+    children: {},
+    events: {}
+  },
+  actors: {
+    hotkeyActor,
+    syncManualLayoutActor,
+    relationshipsBrowserActor,
+    relationshipDetailsActor
+  },
+  guards: {
+    "enabled: FitView": ({ context }) => context.features.enableFitView,
+    "enabled: FocusMode": ({ context }) => context.features.enableFocusMode,
+    "enabled: Readonly": ({ context }) => context.features.enableReadOnly,
+    "not readonly": ({ context }) => !context.features.enableReadOnly,
+    "is dynamic view": ({ context }) => context.view.__ === "dynamic",
+    "is another view": ({ context, event }) => {
+      assertEvent(event, ["update.view", "navigate.to"]);
+      if (event.type === "update.view") {
+        return context.view.id !== event.view.id;
+      }
+      if (event.type === "navigate.to") {
+        return context.view.id !== event.viewId;
+      }
+      nonexhaustive(event.type);
+    },
+    "click: selected node ": ({ event }) => {
+      assertEvent(event, "xyflow.nodeClick");
+      return event.node.selected === true;
+    },
+    "click: same node": ({ context, event }) => {
+      var _a;
+      assertEvent(event, "xyflow.nodeClick");
+      return ((_a = context.lastClickedNode) == null ? void 0 : _a.id) === event.node.id;
+    },
+    "click: focused node": ({ context, event }) => {
+      assertEvent(event, "xyflow.nodeClick");
+      return context.focusedNode === event.node.id;
+    }
+  },
+  actions: {
+    "trigger:NavigateTo": (_, _params) => {
+    },
+    "trigger:OnChange": (_, _params) => {
+    },
+    "trigger:OpenSource": (_, _params) => {
+    },
+    "xyflow:fitDiagram": ({ context }, params) => {
+      const {
+        bounds = context.view.bounds,
+        duration = 450
+      } = params ?? {};
+      const { width, height, panZoom, transform } = context.xystore.getState();
+      const maxZoom = Math.max(1, transform[2]);
+      const viewport = getViewportForBounds(
+        bounds,
+        width,
+        height,
+        MinZoom,
+        maxZoom,
+        context.fitViewPadding
+      );
+      viewport.x = Math.round(viewport.x);
+      viewport.y = Math.round(viewport.y);
+      panZoom == null ? void 0 : panZoom.setViewport(viewport, duration > 0 ? { duration } : void 0);
+    },
+    "xyflow:setViewportCenter": ({ context }, params) => {
+      const { x, y } = params;
+      invariant(context.xyflow, "xyflow is not initialized");
+      const zoom = context.xyflow.getZoom();
+      context.xyflow.setCenter(Math.round(x), Math.round(y), { zoom });
+    },
+    "xyflow:setViewport": ({ context }, params) => {
+      const {
+        viewport,
+        duration = 350
+      } = params;
+      const { panZoom } = context.xystore.getState();
+      panZoom == null ? void 0 : panZoom.setViewport(viewport, duration > 0 ? { duration } : void 0);
+    },
+    "xyflow:alignNodeFromToAfterNavigate": ({ context }, params) => {
+      const xyflow = nonNullable(context.xyflow, "xyflow is not initialized");
+      const elFrom = xyflow.getInternalNode(params.fromNode);
+      if (!elFrom) return;
+      const fromPos = xyflow.flowToScreenPosition({
+        x: elFrom.internals.positionAbsolute.x,
+        // + dimensions.width / 2,
+        y: elFrom.internals.positionAbsolute.y
+        // + dimensions.height / 2
+      }), toPos = xyflow.flowToScreenPosition(params.toPosition), diff = {
+        x: Math.round(fromPos.x - toPos.x),
+        y: Math.round(fromPos.y - toPos.y)
+      };
+      context.xystore.getState().panBy(diff);
+    },
+    "layout.align": ({ context }, params) => {
+      const { mode } = params;
+      const { xystore } = context;
+      const { nodeLookup, parentLookup } = xystore.getState();
+      const selectedNodes = new Set(nodeLookup.values().filter((n) => n.selected).map((n) => n.id));
+      const nodesToAlign = [...selectedNodes.difference(new Set(parentLookup.keys()))];
+      if (!hasAtLeast(nodesToAlign, 2)) {
+        console.warn("At least 2 nodes must be selected to align");
+        return;
+      }
+      const constraints = createLayoutConstraints(xystore, nodesToAlign);
+      const aligner = getAligner(mode);
+      constraints.onMove((nodes) => {
+        aligner.computeLayout(nodes.map(({ node }) => toNodeRect(node)));
+        nodes.forEach(({ rect, node }) => {
+          rect.positionAbsolute = {
+            ...rect.positionAbsolute,
+            ...aligner.applyPosition(toNodeRect(node))
+          };
+        });
+      });
+    }
+  }
+}).createMachine({
+  initial: "initializing",
+  context: ({ input, self, spawn }) => ({
+    ...input,
+    features: { ...AllDisabled },
+    initialized: false,
+    viewportChangedManually: false,
+    lastOnNavigate: null,
+    lastClickedNode: null,
+    focusedNode: null,
+    activeElementDetails: null,
+    viewportBeforeFocus: null,
+    navigationHistory: {
+      currentIndex: 0,
+      history: []
+    },
+    viewport: { x: 0, y: 0, zoom: 1 },
+    xyflow: null,
+    syncLayoutActorRef: spawn("syncManualLayoutActor", {
+      id: "syncLayout",
+      input: { parent: self, viewId: input.view.id }
+    }),
+    activeWalkthrough: null
+  }),
+  // entry: ({ spawn }) => spawn(layoutActor, { id: 'layout', input: { parent: self } }),
+  states: {
+    initializing: {
+      on: {
+        "xyflow.init": {
+          actions: enqueueActions(({ enqueue, check }) => {
+            enqueue.assign({
+              initialized: true,
+              xyflow: ({ event }) => event.instance,
+              navigationHistory: ({ context, event }) => ({
+                currentIndex: 0,
+                history: [{
+                  viewId: context.view.id,
+                  fromNode: null,
+                  viewport: { ...event.instance.getViewport() }
+                }]
+              })
+            });
+            if (check("enabled: FitView")) {
+              enqueue({
+                type: "xyflow:fitDiagram",
+                params: { duration: 0 }
+              });
+            }
+          }),
+          target: "idle"
+        }
+      }
+    },
+    idle: {
+      id: "idle",
+      on: {
+        "xyflow.nodeClick": [
+          {
+            // TODO: xstate fails to infer the type of the guard
+            guard: and([
+              "enabled: FocusMode",
+              or([
+                "click: same node",
+                "click: selected node "
+              ])
+            ]),
+            actions: [
+              assign({
+                lastClickedNode,
+                focusedNode: ({ event }) => event.node.id
+              })
+            ],
+            target: "focused"
+          },
+          {
+            actions: assign({
+              lastClickedNode
+            })
+          }
+        ],
+        "xyflow.paneClick": {
+          actions: [
+            assign({
+              lastClickedNode: null
+            })
+          ]
+        },
+        "xyflow.paneDblClick": {
+          actions: [
+            { type: "xyflow:fitDiagram" },
+            { type: "trigger:OpenSource", params: ({ context }) => ({ view: context.view.id }) }
+          ]
+        },
+        "saveManualLayout.*": {
+          guard: "not readonly",
+          actions: sendTo((c) => c.context.syncLayoutActorRef, ({ event }) => {
+            if (event.type === "saveManualLayout.schedule") {
+              return { type: "sync" };
+            }
+            if (event.type === "saveManualLayout.cancel") {
+              return { type: "cancel" };
+            }
+            nonexhaustive(event);
+          })
+        },
+        "focus.node": {
+          guard: "enabled: FocusMode",
+          actions: assign({
+            focusedNode: ({ event }) => event.nodeId
+          }),
+          target: "focused"
+        }
+      }
+    },
+    focused: {
+      entry: [
+        assign((s) => ({
+          ...focusNodesEdges(s),
+          viewportBeforeFocus: { ...s.context.viewport }
+        })),
+        spawnChild("hotkeyActor", { id: "hotkey" }),
+        {
+          type: "xyflow:fitDiagram",
+          params: focusedBounds
+        }
+      ],
+      on: {
+        "xyflow.nodeClick": [
+          {
+            guard: "click: focused node",
+            target: "#idle"
+          },
+          {
+            actions: [
+              assign({
+                lastClickedNode,
+                focusedNode: ({ event }) => event.node.id
+              }),
+              assign(focusNodesEdges),
+              {
+                type: "xyflow:fitDiagram",
+                params: focusedBounds
+              }
+            ]
+          }
+        ],
+        "focus.node": {
+          actions: [
+            assign({
+              focusedNode: ({ event }) => event.nodeId
+            }),
+            assign(focusNodesEdges),
+            {
+              type: "xyflow:fitDiagram",
+              params: focusedBounds
+            }
+          ]
+        },
+        "key.esc": {
+          target: "idle"
+        },
+        "xyflow.paneClick": {
+          actions: assign({
+            lastClickedNode: null
+          }),
+          target: "idle"
+        },
+        "saveManualLayout.*": {
+          guard: "not readonly",
+          actions: sendTo((c) => c.context.syncLayoutActorRef, ({ event }) => {
+            if (event.type === "saveManualLayout.schedule") {
+              return { type: "sync" };
+            }
+            if (event.type === "saveManualLayout.cancel") {
+              return { type: "cancel" };
+            }
+            nonexhaustive(event);
+          })
+        }
+      },
+      exit: [
+        stopChild("hotkey"),
+        enqueueActions(({ enqueue, context }) => {
+          if (context.viewportBeforeFocus) {
+            enqueue({ type: "xyflow:setViewport", params: { viewport: context.viewportBeforeFocus } });
+          } else {
+            enqueue({ type: "xyflow:fitDiagram" });
+          }
+          enqueue.assign((s) => ({
+            ...unfocusNodesEdges(s),
+            viewportBeforeFocus: null,
+            focusedNode: null
+          }));
+        })
+      ]
+    },
+    overlay: {
+      entry: spawnChild("hotkeyActor", { id: "hotkey" }),
+      initial: "hole",
+      states: {
+        hole: {
+          target: "#idle"
+        },
+        elementDetails: {
+          guard: ({ context }) => context.activeElementDetails !== null,
+          entry: assign({
+            activeElementDetails: ({ context }) => {
+              const fqn = context.activeElementDetails.fqn;
+              const fromNode = context.activeElementDetails.fromNode;
+              if (fromNode) {
+                const internalNode = nonNullable(
+                  context.xystore.getState().nodeLookup.get(fromNode),
+                  "XY Internal Node not found"
+                );
+                const nodeRect = nodeToRect(internalNode);
+                const zoom = context.xyflow.getZoom();
+                const nodeRectScreen = {
+                  ...context.xyflow.flowToScreenPosition(nodeRect),
+                  width: nodeRect.width * zoom,
+                  height: nodeRect.height * zoom
+                };
+                return { fqn, fromNode, nodeRect, nodeRectScreen };
+              } else {
+                return { fqn, fromNode };
+              }
+            }
+          }),
+          on: {
+            // Catch event and do nothing
+            "open.elementDetails": {
+              actions: assign({
+                activeElementDetails: ({ event, context }) => {
+                  var _a;
+                  return {
+                    ...context.activeElementDetails,
+                    fqn: event.fqn,
+                    fromNode: ((_a = context.activeElementDetails) == null ? void 0 : _a.fromNode) ?? null
+                  };
+                }
+              })
+            },
+            "close.overlay": {
+              target: "#idle"
+            },
+            "key.esc": {
+              target: "#idle"
+            }
+          },
+          exit: assign({
+            activeElementDetails: null
+          })
+        },
+        relationshipsBrowser: {
+          invoke: {
+            id: "relationshipsBrowser",
+            src: "relationshipsBrowserActor",
+            input: ({ context, event }) => {
+              assertEvent(event, "open.relationshipsBrowser");
+              return {
+                subject: event.fqn,
+                scope: context.view
+              };
+            },
+            onDone: {
+              target: "#idle"
+            }
+          },
+          on: {
+            "open.relationshipsBrowser": {
+              actions: sendTo("relationshipsBrowser", ({ event }) => ({
+                type: "navigate.to",
+                subject: event.fqn
+              }))
+            },
+            "close.overlay": {
+              actions: sendTo("relationshipsBrowser", { type: "close" })
+            },
+            "key.esc": {
+              actions: sendTo("relationshipsBrowser", { type: "close" })
+            }
+          }
+        },
+        relationshipDetails: {
+          invoke: {
+            id: "relationshipDetails",
+            src: "relationshipDetailsActor",
+            input: ({ event, context }) => {
+              assertEvent(event, "open.relationshipDetails");
+              return {
+                edgeId: event.edgeId,
+                view: context.view
+              };
+            },
+            onDone: {
+              target: "#idle"
+            }
+          },
+          on: {
+            "close.overlay": {
+              actions: sendTo("relationshipDetails", { type: "close" })
+            },
+            "key.esc": {
+              actions: sendTo("relationshipDetails", { type: "close" })
+            }
+          }
+        }
+      },
+      on: {
+        // We received another view, close overlay and process event again
+        "update.view": {
+          guard: "is another view",
+          actions: raise(({ event }) => event, { delay: 50 }),
+          target: "#idle"
+        }
+      },
+      exit: [
+        stopChild("hotkey")
+      ]
+    },
+    // Navigating to another view (after `navigateTo` event)
+    navigating: {
+      initial: "pending",
+      type: "compound",
+      states: {
+        pending: {
+          entry: enqueueActions(({ enqueue }) => {
+            enqueue.sendTo((c) => c.context.syncLayoutActorRef, { type: "stop" });
+            enqueue.stopChild("layout");
+            enqueue({
+              type: "trigger:NavigateTo",
+              params: ({ context }) => ({
+                viewId: nonNullable(context.lastOnNavigate, "Invalid state, lastOnNavigate is null").toView
+              })
+            });
+          }),
+          on: {
+            "update.view": {
+              actions: enqueueActions(({ enqueue, context, event }) => {
+                const { fromNode, toNode } = findCorrespondingNode(context, event);
+                if (fromNode && toNode) {
+                  enqueue({
+                    type: "xyflow:alignNodeFromToAfterNavigate",
+                    params: {
+                      fromNode: fromNode.id,
+                      toPosition: {
+                        x: toNode.position[0],
+                        y: toNode.position[1]
+                      }
+                    }
+                  });
+                } else {
+                  enqueue({
+                    type: "xyflow:setViewportCenter",
+                    params: getBBoxCenter(event.view.bounds)
+                  });
+                }
+                enqueue.assign(updateNavigationHistory);
+                enqueue.assign(mergeXYNodesEdges);
+                enqueue.raise({ type: "fitDiagram" }, { id: "fitDiagram", delay: 75 });
+              }),
+              target: "done"
+            }
+          }
+        },
+        done: {
+          type: "final"
+        }
+      },
+      onDone: {
+        target: "idle"
+      },
+      exit: assign({
+        syncLayoutActorRef: ({ self, context, spawn }) => spawn("syncManualLayoutActor", { id: "syncLayout", input: { parent: self, viewId: context.view.id } }),
+        lastOnNavigate: null
+      })
+    },
+    walkthrough: {
+      entry: [
+        spawnChild("hotkeyActor", { id: "hotkey" }),
+        assign({
+          viewportBeforeFocus: ({ context }) => context.viewport,
+          activeWalkthrough: ({ context, event }) => {
+            assertEvent(event, "walkthrough.start");
+            const stepId = event.stepId ?? first(context.xyedges).id;
+            return {
+              stepId,
+              parallelPrefix: getParallelStepsPrefix(stepId)
+            };
+          }
+        }),
+        assign(updateActiveWalkthrough),
+        {
+          type: "xyflow:fitDiagram",
+          params: focusedBounds
+        }
+      ],
+      on: {
+        "key.esc": {
+          target: "idle"
+        },
+        "key.arrow.left": {
+          actions: raise({ type: "walkthrough.step", direction: "previous" })
+        },
+        "key.arrow.right": {
+          actions: raise({ type: "walkthrough.step", direction: "next" })
+        },
+        "walkthrough.step": {
+          actions: enqueueActions(({ enqueue, context, event }) => {
+            const { stepId } = context.activeWalkthrough;
+            const stepIndex = context.xyedges.findIndex((e) => e.id === stepId);
+            const nextStepIndex = clamp(event.direction === "next" ? stepIndex + 1 : stepIndex - 1, {
+              min: 0,
+              max: context.xyedges.length - 1
+            });
+            if (nextStepIndex === stepIndex) {
+              return;
+            }
+            const nextStepId = context.xyedges[nextStepIndex].id;
+            enqueue.assign({
+              activeWalkthrough: {
+                stepId: nextStepId,
+                parallelPrefix: getParallelStepsPrefix(nextStepId)
+              }
+            });
+            enqueue.assign(updateActiveWalkthrough);
+            enqueue({
+              type: "xyflow:fitDiagram",
+              params: focusedBounds
+            });
+          })
+        },
+        "walkthrough.end": {
+          target: "idle"
+        },
+        // We received another view, close overlay and process event again
+        "update.view": {
+          guard: "is another view",
+          actions: raise(({ event }) => event, { delay: 50 }),
+          target: "idle"
+        }
+      },
+      exit: enqueueActions(({ enqueue, context }) => {
+        enqueue.stopChild("hotkey");
+        if (context.viewportBeforeFocus) {
+          enqueue({ type: "xyflow:setViewport", params: { viewport: context.viewportBeforeFocus } });
+        } else {
+          enqueue({ type: "xyflow:fitDiagram" });
+        }
+        enqueue.assign((s) => ({
+          activeWalkthrough: null,
+          ...unfocusNodesEdges(s),
+          viewportBeforeFocus: null
+        }));
+      })
+    }
+  },
+  on: {
+    "xyflow.applyNodeChages": {
+      actions: assign({
+        xynodes: ({ context, event }) => applyNodeChanges(event.changes, context.xynodes)
+      })
+    },
+    "xyflow.applyEdgeChages": {
+      actions: assign({
+        xyedges: ({ context, event }) => applyEdgeChanges(event.changes, context.xyedges)
+      })
+    },
+    "xyflow.viewportMoved": {
+      actions: assign({
+        viewportChangedManually: ({ event }) => event.manually,
+        viewport: ({ event }) => event.viewport
+      })
+    },
+    "fitDiagram": {
+      guard: "enabled: FitView",
+      actions: {
+        type: "xyflow:fitDiagram",
+        params: prop("event")
+      }
+    },
+    "navigate.to": {
+      guard: "is another view",
+      actions: [
+        assign({
+          lastOnNavigate: ({ context, event }) => ({
+            fromView: context.view.id,
+            toView: event.viewId,
+            fromNode: event.fromNode ?? null
+          })
+        })
+      ],
+      target: ".navigating"
+    },
+    "navigate.back": {
+      guard: ({ context }) => context.navigationHistory.currentIndex > 0,
+      actions: assign(navigateBack),
+      target: ".navigating"
+    },
+    "navigate.forward": {
+      guard: ({ context }) => context.navigationHistory.currentIndex < context.navigationHistory.history.length - 1,
+      actions: assign(navigateForward),
+      target: ".navigating"
+    },
+    "update.view": {
+      actions: [
+        assign(updateNavigationHistory),
+        enqueueActions(({ enqueue, event, check, context }) => {
+          const isAnotherView = check("is another view");
+          if (isAnotherView) {
+            const viewId = event.view.id;
+            enqueue.sendTo((c) => c.context.syncLayoutActorRef, { type: "stop" });
+            enqueue.stopChild("layout");
+            enqueue.assign({
+              focusedNode: null,
+              syncLayoutActorRef: ({ self, spawn }) => spawn("syncManualLayoutActor", { id: "syncLayout", input: { parent: self, viewId } })
+            });
+            const { fromNode, toNode } = findCorrespondingNode(context, event);
+            if (fromNode && toNode) {
+              enqueue({
+                type: "xyflow:alignNodeFromToAfterNavigate",
+                params: {
+                  fromNode: fromNode.id,
+                  toPosition: {
+                    x: toNode.position[0],
+                    y: toNode.position[1]
+                  }
+                }
+              });
+            } else {
+              enqueue({
+                type: "xyflow:setViewportCenter",
+                params: getBBoxCenter(event.view.bounds)
+              });
+            }
+          } else {
+            enqueue.sendTo((c) => c.context.syncLayoutActorRef, { type: "synced" });
+          }
+          if (isAnotherView || !context.viewportChangedManually) {
+            enqueue.raise({ type: "fitDiagram" }, { id: "fitDiagram", delay: 90 });
+          }
+          enqueue.assign(mergeXYNodesEdges);
+          enqueue.assign({
+            lastOnNavigate: null
+          });
+        })
+      ]
+    },
+    "update.inputs": {
+      actions: assign(({ event }) => ({ ...event.inputs }))
+    },
+    "update.features": {
+      actions: assign({
+        features: ({ event }) => event.features
+      })
+    },
+    "update.nodeData": {
+      actions: assign(updateNodeData)
+    },
+    "update.edgeData": {
+      actions: assign(updateEdgeData)
+    },
+    "layout.align": {
+      guard: "not readonly",
+      actions: [
+        { type: "layout.align", params: ({ event }) => ({ mode: event.mode }) },
+        raise({ type: "saveManualLayout.schedule" })
+      ]
+    },
+    "layout.resetEdgeControlPoints": {
+      guard: "not readonly",
+      actions: [
+        assign(resetEdgeControlPoints),
+        raise({ type: "saveManualLayout.schedule" })
+      ]
+    },
+    "xyflow.resized": {
+      guard: ({ context }) => context.features.enableFitView && !context.viewportChangedManually,
+      actions: [
+        cancel("fitDiagram"),
+        raise({ type: "fitDiagram" }, { id: "fitDiagram", delay: 200 })
+      ]
+    },
+    "open.elementDetails": {
+      actions: assign({
+        activeElementDetails: ({ event, context }) => {
+          var _a;
+          return {
+            fqn: event.fqn,
+            fromNode: event.fromNode ?? ((_a = context.lastClickedNode) == null ? void 0 : _a.id) ?? null,
+            fromNodeScreenPosition: null
+          };
+        }
+      }),
+      target: ".overlay.elementDetails"
+    },
+    "open.relationshipDetails": {
+      target: ".overlay.relationshipDetails"
+    },
+    "open.relationshipsBrowser": {
+      target: ".overlay.relationshipsBrowser"
+    },
+    "open.source": {
+      actions: {
+        type: "trigger:OpenSource",
+        params: prop("event")
+      }
+    },
+    "walkthrough.start": {
+      guard: "is dynamic view",
+      target: ".walkthrough"
+    }
+  },
+  exit: [
+    stopChild("layout"),
+    stopChild("hotkey"),
+    assign({
+      xyflow: null,
+      xystore: null,
+      initialized: false,
+      syncLayoutActorRef: null
+    })
+  ]
+});
+const nodeRef = (node) => DiagramNode.modelRef(node) ?? DiagramNode.deploymentRef(node);
+function findCorrespondingNode(context, event) {
+  var _a;
+  const fromNodeId = (_a = context.lastOnNavigate) == null ? void 0 : _a.fromNode;
+  const fromNode = fromNodeId && context.view.nodes.find((n) => n.id === fromNodeId);
+  const fromRef = fromNode && nodeRef(fromNode);
+  const toNode = fromRef && event.view.nodes.find((n) => nodeRef(n) === fromRef);
+  return { fromNode, toNode };
+}
+export {
+  DiagramContext,
+  diagramMachine
+};