@cyoda/workflow-react 0.3.0 → 0.4.0

package/dist/index.cjs

@@ -33,8 +33,8 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/components/WorkflowEditor.tsx
-var import_react23 = require("react");
-var import_workflow_core10 = require("@cyoda/workflow-core");
+var import_react24 = require("react");
+var import_workflow_core11 = require("@cyoda/workflow-core");
 var import_workflow_layout2 = require("@cyoda/workflow-layout");
 
 // src/i18n/context.ts
@@ -122,6 +122,12 @@ var defaultMessages = {
     processes: "Processes",
     criterion: "Criterion",
     criteria: "Criteria",
+    annotations: "Annotations",
+    annotationsAdd: "Add annotations",
+    annotationsApply: "Apply",
+    annotationsRevert: "Revert",
+    annotationsRemove: "Remove",
+    annotationsDocChanged: "Document changed underneath \u2014 Revert to reload.",
     executionMode: "Execution mode",
     addProcessor: "Add processor",
     removeProcessor: "Remove",
@@ -265,6 +271,8 @@ function summarize(patch) {
       return `Reorder processor`;
     case "setCriterion":
       return patch.criterion ? `Set criterion` : `Clear criterion`;
+    case "setAnnotations":
+      return patch.annotations ? `Set annotations` : `Clear annotations`;
     case "setImportMode":
       return `Set import mode to "${patch.mode}"`;
     case "setEntity":
@@ -2718,7 +2726,17 @@ function CanvasInner({
               onHelp && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
                 /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { height: 1, background: "#E2E8F0" } }),
                 /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CtrlBtn, { onClick: onHelp, title: helpLabel ?? "Help", testId: "canvas-help", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(HelpIcon, {}) })
-              ] })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { height: 1, background: "#E2E8F0" } }),
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                CtrlBtn,
+                {
+                  onClick: () => onSelectionChange(activeWorkflow ? { kind: "workflow", workflow: activeWorkflow } : null),
+                  title: "Workflow settings",
+                  testId: "canvas-workflow-settings",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(WorkflowSettingsIcon, {})
+                }
+              )
             ]
           }
         ),
@@ -2838,6 +2856,16 @@ function HelpIcon() {
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
   ] });
 }
+function WorkflowSettingsIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "4", y1: "6", x2: "20", y2: "6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "4", y1: "12", x2: "20", y2: "12" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "4", y1: "18", x2: "20", y2: "18" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "9", cy: "6", r: "2", fill: "white" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "15", cy: "12", r: "2", fill: "white" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "8", cy: "18", r: "2", fill: "white" })
+  ] });
+}
 function Canvas(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_reactflow4.ReactFlowProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CanvasInner, { ...props }) });
 }
@@ -2858,8 +2886,8 @@ function resolveConnection(doc, connection) {
 }
 
 // src/inspector/Inspector.tsx
-var import_react15 = require("react");
-var import_workflow_core7 = require("@cyoda/workflow-core");
+var import_react16 = require("react");
+var import_workflow_core8 = require("@cyoda/workflow-core");
 
 // src/style/tokens.ts
 var colors = {
@@ -3323,16 +3351,247 @@ var smallSelectStyle = {
   userSelect: "none"
 };
 
-// src/inspector/WorkflowForm.tsx
+// src/inspector/AnnotationsField.tsx
+var import_react9 = require("react");
+
+// src/inspector/CriterionMonacoContext.tsx
+var import_react8 = require("react");
+var CriterionMonacoContext = (0, import_react8.createContext)(null);
+var CriterionMonacoProvider = CriterionMonacoContext.Provider;
+function useCriterionMonaco() {
+  return (0, import_react8.useContext)(CriterionMonacoContext);
+}
+
+// src/components/monacoDisposal.ts
+var installed = false;
+function isMonacoCanceled(reason) {
+  if (reason == null || typeof reason !== "object") return false;
+  return reason.name === "Canceled";
+}
+function installMonacoCancellationFilter() {
+  if (installed || typeof window === "undefined") return;
+  installed = true;
+  window.addEventListener("unhandledrejection", (e) => {
+    if (isMonacoCanceled(e.reason)) e.preventDefault();
+  });
+}
+installMonacoCancellationFilter();
+
+// src/inspector/annotationsJson.ts
+var import_workflow_core3 = require("@cyoda/workflow-core");
+function annotationsModelUri(key) {
+  return `cyoda://annotations/${key}.json`;
+}
+function annotationBytes(value) {
+  return new TextEncoder().encode(JSON.stringify(value)).length;
+}
+function sameJson(a, b) {
+  return JSON.stringify(a) === JSON.stringify(b);
+}
+function parseAnnotationsJson(text) {
+  let raw;
+  try {
+    raw = JSON.parse(text);
+  } catch {
+    return { annotations: null, error: "Invalid JSON." };
+  }
+  if (typeof raw !== "object" || raw === null || Array.isArray(raw)) {
+    return { annotations: null, error: "Annotations must be a JSON object." };
+  }
+  const bytes = annotationBytes(raw);
+  if (bytes > import_workflow_core3.ANNOTATIONS_MAX_BYTES) {
+    return {
+      annotations: null,
+      error: `Annotations are ${bytes} bytes, over the ${import_workflow_core3.ANNOTATIONS_MAX_BYTES}-byte limit.`
+    };
+  }
+  return { annotations: raw, error: null };
+}
+
+// src/inspector/AnnotationsField.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
+var pretty = (v) => JSON.stringify(v, null, 2);
+function AnnotationsField(props) {
+  const messages = useMessages();
+  if (props.value === void 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: sectionStyle, children: [
+      props.showLabel !== false && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SectionLabel, {}),
+      !props.disabled && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "button",
+        {
+          type: "button",
+          style: primaryBtn,
+          "data-testid": "inspector-annotations-add",
+          onClick: () => props.onCommit({}),
+          children: messages.inspector.annotationsAdd
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(AnnotationsEditor, { ...props, value: props.value }, props.modelKey);
+}
+function AnnotationsEditor({
+  value,
+  disabled,
+  modelKey,
+  onCommit,
+  onRemove,
+  showLabel
+}) {
+  const messages = useMessages();
+  const monaco = useCriterionMonaco();
+  const [buffer, setBuffer] = (0, import_react9.useState)(() => pretty(value));
+  const [docChanged, setDocChanged] = (0, import_react9.useState)(false);
+  const prevValueRef = (0, import_react9.useRef)(value);
+  (0, import_react9.useEffect)(() => {
+    if (sameJson(prevValueRef.current, value)) return;
+    const parsed = parseAnnotationsJson(buffer).annotations;
+    if (parsed !== null && sameJson(parsed, value)) {
+      setDocChanged(false);
+    } else if (parsed !== null && sameJson(parsed, prevValueRef.current)) {
+      setBuffer(pretty(value));
+      setDocChanged(false);
+    } else {
+      setDocChanged(true);
+    }
+    prevValueRef.current = value;
+  }, [value, buffer]);
+  const result = parseAnnotationsJson(buffer);
+  const dirty = result.annotations !== null && !sameJson(result.annotations, value);
+  const applyEnabled = !disabled && result.annotations !== null && dirty;
+  const apply = () => {
+    if (!applyEnabled || result.annotations === null) return;
+    onCommit(result.annotations);
+    setDocChanged(false);
+  };
+  const revert = () => {
+    setBuffer(pretty(value));
+    setDocChanged(false);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: sectionStyle, children: [
+    showLabel !== false && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SectionLabel, {}),
+    monaco ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      MonacoJsonPane,
+      {
+        monaco,
+        buffer,
+        disabled,
+        modelUri: annotationsModelUri(modelKey),
+        onChange: setBuffer
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      "textarea",
+      {
+        value: buffer,
+        disabled,
+        rows: 12,
+        "data-testid": "annotations-json-editor",
+        style: textareaStyle,
+        onChange: (e) => setBuffer(e.target.value)
+      }
+    ),
+    result.error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { role: "alert", "data-testid": "annotations-error", style: errorStyle, children: result.error }),
+    docChanged && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { role: "alert", "data-testid": "annotations-doc-changed", style: warnStyle, children: messages.inspector.annotationsDocChanged }),
+    !disabled && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: apply,
+          disabled: !applyEnabled,
+          style: applyEnabled ? primaryBtn : disabledBtn,
+          "data-testid": "inspector-annotations-apply",
+          children: messages.inspector.annotationsApply
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", onClick: revert, disabled: !dirty, style: ghostBtn, "data-testid": "inspector-annotations-revert", children: messages.inspector.annotationsRevert }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", onClick: onRemove, style: dangerBtn, "data-testid": "inspector-annotations-remove", children: messages.inspector.annotationsRemove })
+    ] })
+  ] });
+}
+function MonacoJsonPane({
+  monaco,
+  buffer,
+  disabled,
+  modelUri,
+  onChange
+}) {
+  const containerRef = (0, import_react9.useRef)(null);
+  const editorRef = (0, import_react9.useRef)(null);
+  const modelRef = (0, import_react9.useRef)(null);
+  (0, import_react9.useEffect)(() => {
+    if (!containerRef.current || editorRef.current) return;
+    const model = monaco.editor.createModel(buffer, "json", monaco.Uri.parse(modelUri));
+    modelRef.current = model;
+    const editor = monaco.editor.create(containerRef.current, {
+      model,
+      automaticLayout: true,
+      minimap: { enabled: false },
+      fontSize: 13,
+      tabSize: 2,
+      scrollBeyondLastLine: false,
+      theme: "vs",
+      readOnly: disabled
+    });
+    editorRef.current = editor;
+    installMonacoCancellationFilter();
+    const sub = model.onDidChangeContent(() => onChange(model.getValue()));
+    return () => {
+      sub.dispose();
+      editor.dispose();
+      editorRef.current = null;
+      model.dispose();
+      modelRef.current = null;
+    };
+  }, [monaco, modelUri]);
+  (0, import_react9.useEffect)(() => {
+    const model = modelRef.current;
+    if (model && model.getValue() !== buffer) model.setValue(buffer);
+  }, [buffer]);
+  (0, import_react9.useEffect)(() => {
+    editorRef.current?.updateOptions?.({ readOnly: disabled });
+  }, [disabled]);
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "div",
+    {
+      ref: containerRef,
+      "data-testid": "annotations-json-editor",
+      style: { height: 220, border: `1px solid ${colors.border}`, borderRadius: radii.sm }
+    }
+  );
+}
+function SectionLabel() {
+  const messages = useMessages();
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { fontSize: 11, fontWeight: 600, letterSpacing: "0.08em", textTransform: "uppercase", color: colors.textSecondary }, children: messages.inspector.annotations });
+}
+var sectionStyle = { display: "flex", flexDirection: "column", gap: 8 };
+var textareaStyle = {
+  fontFamily: fonts.mono,
+  fontSize: 12,
+  padding: 8,
+  minHeight: 180,
+  border: `1px solid ${colors.border}`,
+  borderRadius: radii.sm,
+  background: "white",
+  resize: "vertical"
+};
+var ghostBtn = { padding: "6px 10px", background: "white", border: `1px solid ${colors.border}`, borderRadius: radii.sm, fontSize: 12, cursor: "pointer" };
+var primaryBtn = { ...ghostBtn, background: colors.primary, color: "white", borderColor: colors.primary };
+var disabledBtn = { ...primaryBtn, opacity: 0.5, cursor: "not-allowed" };
+var dangerBtn = { ...ghostBtn, background: colors.dangerBg, borderColor: colors.dangerBorder, color: colors.danger };
+var errorStyle = { color: colors.danger, fontSize: 11 };
+var warnStyle = { color: colors.warning, fontSize: 11 };
+
+// src/inspector/WorkflowForm.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function WorkflowForm({
   workflow,
   disabled,
   onDispatch
 }) {
   const messages = useMessages();
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(FieldGroup, { title: messages.inspector.properties, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(FieldGroup, { title: messages.inspector.properties, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       TextField,
       {
         label: messages.inspector.name,
@@ -3342,7 +3601,7 @@ function WorkflowForm({
         testId: "inspector-workflow-name"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       TextField,
       {
         label: messages.inspector.version,
@@ -3357,7 +3616,7 @@ function WorkflowForm({
         testId: "inspector-workflow-version"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       TextField,
       {
         label: messages.inspector.description,
@@ -3373,7 +3632,7 @@ function WorkflowForm({
         testId: "inspector-workflow-desc"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       CheckboxField,
       {
         label: messages.inspector.active,
@@ -3387,7 +3646,7 @@ function WorkflowForm({
         testId: "inspector-workflow-active"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       TextField,
       {
         label: messages.inspector.initialState,
@@ -3401,14 +3660,24 @@ function WorkflowForm({
         }),
         testId: "inspector-workflow-initial"
       }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      AnnotationsField,
+      {
+        value: workflow.annotations,
+        disabled,
+        modelKey: `workflow-${workflow.name}`,
+        onCommit: (annotations) => onDispatch({ op: "setAnnotations", target: { kind: "workflow", workflow: workflow.name }, annotations }),
+        onRemove: () => onDispatch({ op: "setAnnotations", target: { kind: "workflow", workflow: workflow.name } })
+      }
     )
   ] });
 }
 
 // src/inspector/StateForm.tsx
-var import_react8 = require("react");
-var import_workflow_core3 = require("@cyoda/workflow-core");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_react10 = require("react");
+var import_workflow_core4 = require("@cyoda/workflow-core");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function StateForm({
   workflow,
   stateCode,
@@ -3419,7 +3688,7 @@ function StateForm({
   onRequestDelete
 }) {
   const messages = useMessages();
-  const [renameError, setRenameError] = (0, import_react8.useState)(null);
+  const [renameError, setRenameError] = (0, import_react10.useState)(null);
   const outgoing = state.transitions.length;
   const incoming = Object.values(workflow.states).reduce(
     (n, s) => n + s.transitions.filter((t) => t.next === stateCode).length,
@@ -3432,7 +3701,7 @@ function StateForm({
   const handleRename = (next) => {
     if (next === stateCode) return;
     setRenameError(null);
-    if (!import_workflow_core3.NAME_REGEX.test(next)) {
+    if (!import_workflow_core4.NAME_REGEX.test(next)) {
       setRenameError(`"${next}" is not a valid state name`);
       return;
     }
@@ -3442,8 +3711,8 @@ function StateForm({
     }
     onDispatch({ op: "renameState", workflow: workflow.name, from: stateCode, to: next });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(FieldGroup, { title: messages.inspector.properties, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(FieldGroup, { title: messages.inspector.properties, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       TextField,
       {
         label: messages.inspector.name,
@@ -3454,29 +3723,29 @@ function StateForm({
         testId: "inspector-state-name"
       }
     ),
-    renameError && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { role: "alert", style: { color: colors.danger, fontSize: 12 }, children: renameError }),
-    (isInitial || isTerminal || isUnreachable) && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
-      isInitial && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(StateBadge, { color: "#15803d", bg: "#f0fdf4", label: "Initial" }),
-      isTerminal && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(StateBadge, { color: "#0369a1", bg: "#eff6ff", label: "Terminal" }),
-      isUnreachable && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(StateBadge, { color: colors.warning, bg: colors.warningBg, label: "Unreachable" })
+    renameError && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { role: "alert", style: { color: colors.danger, fontSize: 12 }, children: renameError }),
+    (isInitial || isTerminal || isUnreachable) && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
+      isInitial && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StateBadge, { color: "#15803d", bg: "#f0fdf4", label: "Initial" }),
+      isTerminal && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StateBadge, { color: "#0369a1", bg: "#eff6ff", label: "Terminal" }),
+      isUnreachable && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StateBadge, { color: colors.warning, bg: colors.warningBg, label: "Unreachable" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { fontSize: 12, color: colors.textSecondary }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { style: { fontSize: 12, color: colors.textSecondary }, children: [
       outgoing,
       " outgoing \xB7 ",
       incoming,
       " incoming"
     ] }),
-    !isInitial && !disabled && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    !isInitial && !disabled && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "button",
       {
         type: "button",
         onClick: () => onDispatch({ op: "setInitialState", workflow: workflow.name, stateCode }),
-        style: ghostBtn,
+        style: ghostBtn2,
         "data-testid": "inspector-state-set-initial",
         children: "Set as Initial State"
       }
     ),
-    issues && issues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: issues.map((issue, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    issues && issues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: issues.map((issue, i) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "div",
       {
         role: "alert",
@@ -3492,21 +3761,31 @@ function StateForm({
       },
       `${issue.code}-${i}`
     )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      AnnotationsField,
+      {
+        value: state.annotations,
+        disabled,
+        modelKey: `state-${workflow.name}-${stateCode}`,
+        onCommit: (annotations) => onDispatch({ op: "setAnnotations", target: { kind: "state", workflow: workflow.name, stateCode }, annotations }),
+        onRemove: () => onDispatch({ op: "setAnnotations", target: { kind: "state", workflow: workflow.name, stateCode } })
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "button",
       {
         type: "button",
         onClick: onRequestDelete,
         disabled,
         "data-testid": "inspector-state-delete",
-        style: dangerBtn,
+        style: dangerBtn2,
         children: "Delete state\u2026"
       }
     )
   ] });
 }
 function StateBadge({ color, bg, label }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     "span",
     {
       style: {
@@ -3538,7 +3817,7 @@ function reachableStates(wf) {
   }
   return visited;
 }
-var ghostBtn = {
+var ghostBtn2 = {
   alignSelf: "flex-start",
   padding: "5px 10px",
   background: "white",
@@ -3547,7 +3826,7 @@ var ghostBtn = {
   fontSize: 13,
   cursor: "pointer"
 };
-var dangerBtn = {
+var dangerBtn2 = {
   alignSelf: "flex-start",
   padding: "6px 10px",
   background: colors.dangerBg,
@@ -3559,15 +3838,15 @@ var dangerBtn = {
 };
 
 // src/inspector/TransitionForm.tsx
-var import_react14 = require("react");
-var import_workflow_core6 = require("@cyoda/workflow-core");
+var import_react15 = require("react");
+var import_workflow_core7 = require("@cyoda/workflow-core");
 
 // src/inspector/CriterionForm.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 
 // src/modals/DeleteStateModal.tsx
-var import_react9 = require("react");
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_react11 = require("react");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function countAffected(doc, workflow, stateCode) {
   let outgoing = 0;
   let incoming = 0;
@@ -3589,24 +3868,24 @@ function DeleteStateModal({
   onCancel
 }) {
   const messages = useMessages();
-  const counts = (0, import_react9.useMemo)(
+  const counts = (0, import_react11.useMemo)(
     () => countAffected(doc, workflow, stateCode),
     [doc, workflow, stateCode]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(ModalFrame, { onCancel, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h2", { style: { margin: 0, fontSize: 16 }, children: messages.confirmDelete.title }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { style: { margin: "12px 0", fontSize: 13, color: colors.textSecondary }, children: messages.confirmDelete.message }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { style: { padding: 8, background: colors.surfaceMuted, border: `1px solid ${colors.borderSubtle}`, borderRadius: radii.sm, fontSize: 13 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("strong", { children: stateCode }),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { style: { color: colors.textSecondary }, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(ModalFrame, { onCancel, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h2", { style: { margin: 0, fontSize: 16 }, children: messages.confirmDelete.title }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { style: { margin: "12px 0", fontSize: 13, color: colors.textSecondary }, children: messages.confirmDelete.message }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { style: { padding: 8, background: colors.surfaceMuted, border: `1px solid ${colors.borderSubtle}`, borderRadius: radii.sm, fontSize: 13 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("strong", { children: stateCode }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { style: { color: colors.textSecondary }, children: [
         messages.confirmDelete.transitionsAffected,
         ": ",
         counts.outgoing + counts.incoming
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 16 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn2, "data-testid": "modal-delete-cancel", children: messages.confirmDelete.cancel }),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { type: "button", onClick: onConfirm, style: dangerBtn2, "data-testid": "modal-delete-confirm", children: messages.confirmDelete.confirm })
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 16 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn3, "data-testid": "modal-delete-cancel", children: messages.confirmDelete.cancel }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { type: "button", onClick: onConfirm, style: dangerBtn3, "data-testid": "modal-delete-confirm", children: messages.confirmDelete.confirm })
     ] })
   ] });
 }
@@ -3615,9 +3894,9 @@ function ModalFrame({
   onCancel,
   labelledBy
 }) {
-  const frameRef = (0, import_react9.useRef)(null);
-  const previousFocusRef = (0, import_react9.useRef)(null);
-  (0, import_react9.useEffect)(() => {
+  const frameRef = (0, import_react11.useRef)(null);
+  const previousFocusRef = (0, import_react11.useRef)(null);
+  (0, import_react11.useEffect)(() => {
     previousFocusRef.current = document.activeElement ?? null;
     const node = frameRef.current;
     if (node) {
@@ -3630,7 +3909,7 @@ function ModalFrame({
       previousFocusRef.current?.focus?.();
     };
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     "div",
     {
       onClick: onCancel,
@@ -3650,7 +3929,7 @@ function ModalFrame({
         zIndex: 1e3
       },
       "data-testid": "modal-backdrop",
-      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
         "div",
         {
           ref: frameRef,
@@ -3676,7 +3955,7 @@ function ModalFrame({
     }
   );
 }
-var ghostBtn2 = {
+var ghostBtn3 = {
   padding: "6px 12px",
   background: "white",
   border: `1px solid ${colors.border}`,
@@ -3684,42 +3963,19 @@ var ghostBtn2 = {
   fontSize: 13,
   cursor: "pointer"
 };
-var dangerBtn2 = {
-  ...ghostBtn2,
+var dangerBtn3 = {
+  ...ghostBtn3,
   background: colors.danger,
   color: "white",
   borderColor: colors.danger
 };
 
 // src/inspector/CriterionJsonEditor.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 var import_workflow_monaco = require("@cyoda/workflow-monaco");
 
-// src/inspector/CriterionMonacoContext.tsx
-var import_react10 = require("react");
-var CriterionMonacoContext = (0, import_react10.createContext)(null);
-var CriterionMonacoProvider = CriterionMonacoContext.Provider;
-function useCriterionMonaco() {
-  return (0, import_react10.useContext)(CriterionMonacoContext);
-}
-
-// src/components/monacoDisposal.ts
-var installed = false;
-function isMonacoCanceled(reason) {
-  if (reason == null || typeof reason !== "object") return false;
-  return reason.name === "Canceled";
-}
-function installMonacoCancellationFilter() {
-  if (installed || typeof window === "undefined") return;
-  installed = true;
-  window.addEventListener("unhandledrejection", (e) => {
-    if (isMonacoCanceled(e.reason)) e.preventDefault();
-  });
-}
-installMonacoCancellationFilter();
-
 // src/inspector/criterionJson.ts
-var import_workflow_core4 = require("@cyoda/workflow-core");
+var import_workflow_core5 = require("@cyoda/workflow-core");
 function criterionModelUri(key) {
   return `cyoda://criterion/${key}.json`;
 }
@@ -3736,16 +3992,16 @@ function parseCriterionJson(text) {
   } catch {
     return { criterion: null, error: "Invalid JSON." };
   }
-  const res = import_workflow_core4.CriterionSchema.safeParse(raw);
+  const res = import_workflow_core5.CriterionSchema.safeParse(raw);
   if (res.success) {
-    const blocking = (0, import_workflow_core4.criterionBlockingError)(res.data);
+    const blocking = (0, import_workflow_core5.criterionBlockingError)(res.data);
     if (blocking) return { criterion: null, error: blocking };
     return { criterion: res.data, error: null };
   }
   let friendly = null;
   if (typeof raw === "object" && raw !== null && typeof raw.type === "string") {
     try {
-      friendly = (0, import_workflow_core4.criterionBlockingError)(raw);
+      friendly = (0, import_workflow_core5.criterionBlockingError)(raw);
     } catch {
       friendly = null;
     }
@@ -3754,14 +4010,14 @@ function parseCriterionJson(text) {
 }
 
 // src/inspector/CriterionJsonEditor.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function CriterionJsonEditor({ value, disabled, modelKey, onChange }) {
   const monaco = useCriterionMonaco();
-  const onChangeRef = (0, import_react11.useRef)(onChange);
+  const onChangeRef = (0, import_react12.useRef)(onChange);
   onChangeRef.current = onChange;
-  const initialText = (0, import_react11.useRef)(JSON.stringify(value, null, 2)).current;
+  const initialText = (0, import_react12.useRef)(JSON.stringify(value, null, 2)).current;
   if (monaco) {
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       MonacoCriterionEditor,
       {
         monaco,
@@ -3772,7 +4028,7 @@ function CriterionJsonEditor({ value, disabled, modelKey, onChange }) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     TextareaCriterionEditor,
     {
       initialText,
@@ -3786,10 +4042,10 @@ function TextareaCriterionEditor({
   disabled,
   onChangeRef
 }) {
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     onChangeRef.current(parseCriterionJson(initialText));
   }, [initialText, onChangeRef]);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "textarea",
     {
       defaultValue: initialText,
@@ -3808,9 +4064,9 @@ function MonacoCriterionEditor({
   modelKey,
   onChangeRef
 }) {
-  const containerRef = (0, import_react11.useRef)(null);
-  const editorRef = (0, import_react11.useRef)(null);
-  (0, import_react11.useEffect)(() => {
+  const containerRef = (0, import_react12.useRef)(null);
+  const editorRef = (0, import_react12.useRef)(null);
+  (0, import_react12.useEffect)(() => {
     if (!containerRef.current || editorRef.current) return;
     const model = monaco.editor.createModel(
       initialText,
@@ -3841,10 +4097,10 @@ function MonacoCriterionEditor({
       model.dispose();
     };
   }, [monaco, modelKey]);
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     editorRef.current?.updateOptions?.({ readOnly: disabled });
   }, [disabled]);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "div",
     {
       ref: containerRef,
@@ -3866,7 +4122,7 @@ var jsonTextAreaStyle = {
 };
 
 // src/inspector/CriterionForm.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 function defaultCriterion(type) {
   switch (type) {
     case "simple":
@@ -3893,7 +4149,7 @@ function CriterionSection({
   onSelectionChange
 }) {
   const messages = useMessages();
-  const [modalOpen, setModalOpen] = (0, import_react12.useState)(false);
+  const [modalOpen, setModalOpen] = (0, import_react13.useState)(false);
   const path = ["criterion"];
   const removeCriterion = () => {
     onDispatch({ op: "setCriterion", host, path, criterion: void 0 });
@@ -3901,8 +4157,8 @@ function CriterionSection({
       onSelectionChange?.({ kind: "transition", transitionUuid: host.transitionUuid });
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       CriterionSummaryCard,
       {
         criterion,
@@ -3913,7 +4169,7 @@ function CriterionSection({
         onRemove: removeCriterion
       }
     ),
-    modalOpen && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    modalOpen && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       CriterionEditorModal,
       {
         title: criterion ? messages.criterion.editTitle : messages.criterion.addTitle,
@@ -3950,42 +4206,42 @@ function CriterionSummaryCard({
   const messages = useMessages();
   const m = messages.criterion;
   if (!criterion) {
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: cardStyle, "data-testid": "criterion-summary-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SectionHeader, { label: m.heading, badge: "none" }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: summaryTextStyle, children: manual ? m.noneManual : m.noneAutomated }),
-      !manual && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: warningCardStyle, "data-testid": "criterion-automated-warning", children: m.noneAutomatedWarning }),
-      !disabled && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: cardStyle, "data-testid": "criterion-summary-card", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SectionHeader, { label: m.heading, badge: "none" }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { style: summaryTextStyle, children: manual ? m.noneManual : m.noneAutomated }),
+      !manual && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { style: warningCardStyle, "data-testid": "criterion-automated-warning", children: m.noneAutomatedWarning }),
+      !disabled && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         "button",
         {
           type: "button",
           onClick: onAdd,
-          style: primaryBtn,
+          style: primaryBtn2,
           "data-testid": "inspector-criterion-add",
           children: m.add
         }
       )
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: cardStyle, "data-testid": "criterion-summary-card", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SectionHeader, { label: m.heading, badge: criterion.type }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CriterionCompactJson, { criterion }),
-    !disabled && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: 6 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: cardStyle, "data-testid": "criterion-summary-card", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SectionHeader, { label: m.heading, badge: criterion.type }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CriterionCompactJson, { criterion }),
+    !disabled && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: 6 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         "button",
         {
           type: "button",
           onClick: onEdit,
-          style: ghostBtn3,
+          style: ghostBtn4,
           "data-testid": "inspector-criterion-edit",
           children: m.edit
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         "button",
         {
           type: "button",
           onClick: onRemove,
-          style: dangerBtn3,
+          style: dangerBtn4,
           "data-testid": "inspector-criterion-remove",
           children: m.remove
         }
@@ -3996,7 +4252,7 @@ function CriterionSummaryCard({
 function CriterionCompactJson({ criterion }) {
   const text = JSON.stringify(criterion);
   const display = text.length > 140 ? `${text.slice(0, 137)}\u2026` : text;
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     "code",
     {
       "data-testid": "criterion-compact-json",
@@ -4033,7 +4289,7 @@ function CriterionEditorModal({
 }) {
   const messages = useMessages();
   const seed = initialCriterion ?? defaultCriterion("simple");
-  const [result, setResult] = (0, import_react12.useState)(
+  const [result, setResult] = (0, import_react13.useState)(
     () => parseCriterionJson(JSON.stringify(seed))
   );
   const modelKey = criterionModelKey(host);
@@ -4043,12 +4299,12 @@ function CriterionEditorModal({
     onDispatch({ op: "setCriterion", host, path, criterion: result.criterion });
     onApplied();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ModalFrame, { onCancel, labelledBy: "criterion-modal-title", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: modalStyle, "data-testid": "criterion-editor-modal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("header", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h2", { id: "criterion-modal-title", style: { margin: 0, fontSize: 18 }, children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { margin: 0, fontSize: 12, color: colors.textTertiary }, children: context })
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ModalFrame, { onCancel, labelledBy: "criterion-modal-title", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: modalStyle, "data-testid": "criterion-editor-modal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("header", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h2", { id: "criterion-modal-title", style: { margin: 0, fontSize: 18 }, children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { style: { margin: 0, fontSize: 12, color: colors.textTertiary }, children: context })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { style: modalBodyStyle, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { style: modalBodyStyle, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       CriterionJsonEditor,
       {
         value: seed,
@@ -4057,17 +4313,17 @@ function CriterionEditorModal({
         onChange: setResult
       }
     ) }),
-    result.error && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { role: "alert", style: errorStyle, "data-testid": "criterion-modal-blocking-error", children: result.error }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("footer", { style: modalFooterStyle, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { style: { flex: 1 } }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn3, "data-testid": "criterion-modal-cancel", children: messages.criterion.cancel }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    result.error && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { role: "alert", style: errorStyle2, "data-testid": "criterion-modal-blocking-error", children: result.error }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("footer", { style: modalFooterStyle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { style: { flex: 1 } }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn4, "data-testid": "criterion-modal-cancel", children: messages.criterion.cancel }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         "button",
         {
           type: "button",
           onClick: apply,
           disabled: applyDisabled,
-          style: applyDisabled ? disabledPrimaryBtn : primaryBtn,
+          style: applyDisabled ? disabledPrimaryBtn : primaryBtn2,
           "data-testid": "criterion-modal-apply",
           children: messages.criterion.applyModal
         }
@@ -4076,9 +4332,9 @@ function CriterionEditorModal({
   ] }) });
 }
 function SectionHeader({ label, badge }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { style: { fontSize: 11, fontWeight: 600, letterSpacing: "0.08em", textTransform: "uppercase", color: colors.textSecondary }, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { style: { fontSize: 11, padding: "1px 6px", background: colors.surfaceMuted, borderRadius: radii.pill, color: colors.textTertiary }, children: badge })
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { fontSize: 11, fontWeight: 600, letterSpacing: "0.08em", textTransform: "uppercase", color: colors.textSecondary }, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { fontSize: 11, padding: "1px 6px", background: colors.surfaceMuted, borderRadius: radii.pill, color: colors.textTertiary }, children: badge })
   ] });
 }
 var cardStyle = {
@@ -4124,16 +4380,16 @@ var modalFooterStyle = {
   borderTop: `1px solid ${colors.borderSubtle}`,
   background: "white"
 };
-var ghostBtn3 = { padding: "6px 10px", background: "white", border: `1px solid ${colors.border}`, borderRadius: radii.sm, fontSize: 12, cursor: "pointer" };
-var primaryBtn = { ...ghostBtn3, background: colors.primary, color: "white", borderColor: colors.primary };
-var disabledPrimaryBtn = { ...primaryBtn, opacity: 0.5, cursor: "not-allowed" };
-var dangerBtn3 = { ...ghostBtn3, background: colors.dangerBg, borderColor: colors.dangerBorder, color: colors.danger };
-var errorStyle = { color: colors.danger, fontSize: 11 };
+var ghostBtn4 = { padding: "6px 10px", background: "white", border: `1px solid ${colors.border}`, borderRadius: radii.sm, fontSize: 12, cursor: "pointer" };
+var primaryBtn2 = { ...ghostBtn4, background: colors.primary, color: "white", borderColor: colors.primary };
+var disabledPrimaryBtn = { ...primaryBtn2, opacity: 0.5, cursor: "not-allowed" };
+var dangerBtn4 = { ...ghostBtn4, background: colors.dangerBg, borderColor: colors.dangerBorder, color: colors.danger };
+var errorStyle2 = { color: colors.danger, fontSize: 11 };
 
 // src/inspector/ProcessorForm.tsx
-var import_react13 = require("react");
-var import_workflow_core5 = require("@cyoda/workflow-core");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_react14 = require("react");
+var import_workflow_core6 = require("@cyoda/workflow-core");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 var EXECUTION_MODES = [
   "ASYNC_NEW_TX",
   "ASYNC_SAME_TX",
@@ -4193,7 +4449,7 @@ function toProcessor(draft) {
 function validateDraft(draft, existingNames, originalName) {
   const name = draft.name.trim();
   if (name.length === 0) return "Processor name is required.";
-  if (!import_workflow_core5.NAME_REGEX.test(name)) {
+  if (!import_workflow_core6.NAME_REGEX.test(name)) {
     return "Processor name must start with a letter and contain only letters, digits, underscores, or hyphens.";
   }
   if (existingNames.some((existing) => existing === name && existing !== originalName)) {
@@ -4230,8 +4486,8 @@ function ProcessorEditorModal({
   onCancel,
   onApply
 }) {
-  const [draft, setDraft] = (0, import_react13.useState)(() => toDraft(initialProcessor));
-  (0, import_react13.useEffect)(() => {
+  const [draft, setDraft] = (0, import_react14.useState)(() => toDraft(initialProcessor));
+  (0, import_react14.useEffect)(() => {
     setDraft(toDraft(initialProcessor));
   }, [initialProcessor]);
   const error = validateDraft(draft, existingNames, initialProcessor?.name);
@@ -4239,13 +4495,13 @@ function ProcessorEditorModal({
     if (disabled || error) return;
     onApply(toProcessor(draft));
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ModalFrame, { onCancel, labelledBy: "processor-modal-title", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: modalStyle2, "data-testid": "processor-editor-modal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("header", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h2", { id: "processor-modal-title", style: { margin: 0, fontSize: 18 }, children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { style: { margin: 0, fontSize: 12, color: colors.textTertiary }, children: "Processor changes stay local until Apply." })
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ModalFrame, { onCancel, labelledBy: "processor-modal-title", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: modalStyle2, "data-testid": "processor-editor-modal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("header", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h2", { id: "processor-modal-title", style: { margin: 0, fontSize: 18 }, children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { style: { margin: 0, fontSize: 12, color: colors.textTertiary }, children: "Processor changes stay local until Apply." })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: modalBodyStyle2, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FormField, { label: "Name", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: modalBodyStyle2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FormField, { label: "Name", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "input",
         {
           type: "text",
@@ -4255,7 +4511,7 @@ function ProcessorEditorModal({
           style: inputStyle2
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FormField, { label: "Execution mode", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FormField, { label: "Execution mode", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         CustomSelectInput,
         {
           value: draft.executionMode,
@@ -4264,8 +4520,8 @@ function ProcessorEditorModal({
           testId: "processor-execution-mode"
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { style: checkboxRowStyle, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { style: checkboxRowStyle, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           "input",
           {
             type: "checkbox",
@@ -4273,9 +4529,9 @@ function ProcessorEditorModal({
             onChange: (event) => setDraft((current) => ({ ...current, attachEntity: event.target.checked }))
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: "Attach entity" })
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: "Attach entity" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FormField, { label: "Calculation node tags", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FormField, { label: "Calculation node tags", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "input",
         {
           type: "text",
@@ -4288,7 +4544,7 @@ function ProcessorEditorModal({
           style: inputStyle2
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FormField, { label: "Response timeout ms", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FormField, { label: "Response timeout ms", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "input",
         {
           type: "text",
@@ -4300,7 +4556,7 @@ function ProcessorEditorModal({
           style: inputStyle2
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FormField, { label: "Retry policy", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FormField, { label: "Retry policy", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "input",
         {
           type: "text",
@@ -4309,8 +4565,8 @@ function ProcessorEditorModal({
           style: inputStyle2
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { style: checkboxRowStyle, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { style: checkboxRowStyle, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           "input",
           {
             type: "checkbox",
@@ -4323,9 +4579,9 @@ function ProcessorEditorModal({
             "data-testid": "processor-async-result"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: "Async result" })
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: "Async result" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FormField, { label: "Crossover to async ms", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FormField, { label: "Crossover to async ms", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "input",
         {
           type: "text",
@@ -4340,16 +4596,16 @@ function ProcessorEditorModal({
         }
       ) })
     ] }),
-    error && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { role: "alert", style: errorStyle2, "data-testid": "processor-modal-error", children: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("footer", { style: modalFooterStyle2, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn4, "data-testid": "processor-modal-cancel", children: "Cancel" }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    error && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { role: "alert", style: errorStyle3, "data-testid": "processor-modal-error", children: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("footer", { style: modalFooterStyle2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn5, "data-testid": "processor-modal-cancel", children: "Cancel" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "button",
         {
           type: "button",
           onClick: apply,
           disabled: disabled || !!error,
-          style: disabled || error ? disabledPrimaryBtn2 : primaryBtn2,
+          style: disabled || error ? disabledPrimaryBtn2 : primaryBtn3,
           "data-testid": "processor-modal-apply",
           children: "Apply processor"
         }
@@ -4361,8 +4617,8 @@ function FormField({
   label,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: labelStyle2, children: label }),
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: labelStyle2, children: label }),
     children
   ] });
 }
@@ -4376,18 +4632,18 @@ function ProcessorForm({
   onDispatch
 }) {
   const messages = useMessages();
-  const [modalOpen, setModalOpen] = (0, import_react13.useState)(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: summaryCardStyle, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", gap: 8 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("strong", { style: { fontSize: 13 }, children: processor.name }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { fontSize: 12, color: colors.textSecondary }, children: summarizeProcessor(processor) })
+  const [modalOpen, setModalOpen] = (0, import_react14.useState)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: summaryCardStyle, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", gap: 8 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("strong", { style: { fontSize: 13 }, children: processor.name }),
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: { fontSize: 12, color: colors.textSecondary }, children: summarizeProcessor(processor) })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: chipStyle, children: processor.type })
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: chipStyle, children: processor.type })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { type: "button", onClick: () => setModalOpen(true), style: ghostBtn4, children: "Edit" }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { type: "button", onClick: () => setModalOpen(true), style: ghostBtn5, children: "Edit" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "button",
         {
           type: "button",
@@ -4398,11 +4654,11 @@ function ProcessorForm({
             processorUuid,
             toIndex: processorIndex - 1
           }),
-          style: ghostBtn4,
+          style: ghostBtn5,
           children: messages.inspector.moveUp
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "button",
         {
           type: "button",
@@ -4413,23 +4669,23 @@ function ProcessorForm({
             processorUuid,
             toIndex: processorIndex + 1
           }),
-          style: ghostBtn4,
+          style: ghostBtn5,
           children: messages.inspector.moveDown
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "button",
         {
           type: "button",
           disabled,
           onClick: () => onDispatch({ op: "removeProcessor", processorUuid }),
-          style: dangerBtn4,
+          style: dangerBtn5,
           "data-testid": "inspector-processor-delete",
           children: messages.inspector.removeProcessor
         }
       )
     ] }),
-    modalOpen && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    modalOpen && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       ProcessorEditorModal,
       {
         title: `Edit ${processor.name}`,
@@ -4491,7 +4747,7 @@ var checkboxRowStyle = {
   color: colors.textSecondary,
   cursor: "pointer"
 };
-var errorStyle2 = {
+var errorStyle3 = {
   padding: "8px 10px",
   border: `1px solid ${colors.dangerBorder}`,
   background: colors.dangerBg,
@@ -4499,7 +4755,7 @@ var errorStyle2 = {
   color: colors.danger,
   fontSize: 12
 };
-var ghostBtn4 = {
+var ghostBtn5 = {
   padding: "6px 10px",
   background: "white",
   border: `1px solid ${colors.border}`,
@@ -4507,19 +4763,19 @@ var ghostBtn4 = {
   fontSize: 12,
   cursor: "pointer"
 };
-var primaryBtn2 = {
-  ...ghostBtn4,
+var primaryBtn3 = {
+  ...ghostBtn5,
   background: colors.primary,
   color: "white",
   borderColor: colors.primary
 };
 var disabledPrimaryBtn2 = {
-  ...primaryBtn2,
+  ...primaryBtn3,
   opacity: 0.5,
   cursor: "not-allowed"
 };
-var dangerBtn4 = {
-  ...ghostBtn4,
+var dangerBtn5 = {
+  ...ghostBtn5,
   background: colors.dangerBg,
   borderColor: colors.dangerBorder,
   color: colors.danger
@@ -4543,7 +4799,7 @@ var summaryCardStyle = {
 };
 
 // src/inspector/TransitionForm.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function TransitionForm({
   workflow,
   stateCode,
@@ -4558,15 +4814,15 @@ function TransitionForm({
   onSelectionChange
 }) {
   const messages = useMessages();
-  const [renameError, setRenameError] = (0, import_react14.useState)(null);
-  const [processorModal, setProcessorModal] = (0, import_react14.useState)(null);
-  const [scheduleDelayDraft, setScheduleDelayDraft] = (0, import_react14.useState)(
+  const [renameError, setRenameError] = (0, import_react15.useState)(null);
+  const [processorModal, setProcessorModal] = (0, import_react15.useState)(null);
+  const [scheduleDelayDraft, setScheduleDelayDraft] = (0, import_react15.useState)(
     transition.schedule?.delayMs !== void 0 ? String(transition.schedule.delayMs) : ""
   );
-  const [scheduleTimeoutDraft, setScheduleTimeoutDraft] = (0, import_react14.useState)(
+  const [scheduleTimeoutDraft, setScheduleTimeoutDraft] = (0, import_react15.useState)(
     transition.schedule?.timeoutMs !== void 0 ? String(transition.schedule.timeoutMs) : ""
   );
-  const prevTransitionUuidRef = (0, import_react14.useRef)(transitionUuid);
+  const prevTransitionUuidRef = (0, import_react15.useRef)(transitionUuid);
   if (prevTransitionUuidRef.current !== transitionUuid) {
     prevTransitionUuidRef.current = transitionUuid;
     setScheduleDelayDraft(
@@ -4581,7 +4837,7 @@ function TransitionForm({
   const handleRename = (next) => {
     if (next === transition.name) return;
     setRenameError(null);
-    if (!import_workflow_core6.NAME_REGEX.test(next)) {
+    if (!import_workflow_core7.NAME_REGEX.test(next)) {
       setRenameError(`"${next}" is not a valid transition name`);
       return;
     }
@@ -4664,9 +4920,9 @@ function TransitionForm({
       index: index + 1
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: transitionFormStyle, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(FieldGroup, { title: messages.inspector.properties, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: transitionFormStyle, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(FieldGroup, { title: messages.inspector.properties, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         TextField,
         {
           label: messages.inspector.name,
@@ -4677,8 +4933,8 @@ function TransitionForm({
           testId: "inspector-transition-name"
         }
       ),
-      renameError && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { role: "alert", style: { color: colors.danger, fontSize: 12 }, children: renameError }),
-      !disabled && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      renameError && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { role: "alert", style: { color: colors.danger, fontSize: 12 }, children: renameError }),
+      !disabled && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         SelectField,
         {
           label: "Source state",
@@ -4698,7 +4954,7 @@ function TransitionForm({
           testId: "inspector-transition-source-state"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         SelectField,
         {
           label: "Target state",
@@ -4709,7 +4965,7 @@ function TransitionForm({
           testId: "inspector-transition-next"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         SelectField,
         {
           label: messages.inspector.transitionType,
@@ -4723,7 +4979,7 @@ function TransitionForm({
           testId: "inspector-transition-manual"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         CheckboxField,
         {
           label: messages.inspector.disabled,
@@ -4733,7 +4989,7 @@ function TransitionForm({
           testId: "inspector-transition-disabled"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         AnchorSelect,
         {
           label: messages.inspector.sourceAnchor,
@@ -4744,7 +5000,7 @@ function TransitionForm({
           testId: "inspector-transition-source-anchor"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         AnchorSelect,
         {
           label: messages.inspector.targetAnchor,
@@ -4755,12 +5011,12 @@ function TransitionForm({
           testId: "inspector-transition-target-anchor"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", gap: 6 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { type: "button", disabled, onClick: () => reorder(-1), style: ghostBtn5, children: messages.inspector.moveUp }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { type: "button", disabled, onClick: () => reorder(1), style: ghostBtn5, children: messages.inspector.moveDown })
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", gap: 6 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { type: "button", disabled, onClick: () => reorder(-1), style: ghostBtn6, children: messages.inspector.moveUp }),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { type: "button", disabled, onClick: () => reorder(1), style: ghostBtn6, children: messages.inspector.moveDown })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           "p",
           {
             style: {
@@ -4774,20 +5030,20 @@ function TransitionForm({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("hr", { style: { border: "none", borderTop: `1px solid ${colors.borderSubtle}`, margin: 0 } }),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("hr", { style: { border: "none", borderTop: `1px solid ${colors.borderSubtle}`, margin: 0 } }),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         "button",
         {
           type: "button",
           disabled,
           onClick: removeTransition,
-          style: dangerBtn5,
+          style: dangerBtn6,
           "data-testid": "inspector-transition-delete",
           children: "Delete transition"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("hr", { style: { border: "none", borderTop: `1px solid ${colors.borderSubtle}`, margin: 0 } }),
-      issues && issues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: issues.map((issue, i) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("hr", { style: { border: "none", borderTop: `1px solid ${colors.borderSubtle}`, margin: 0 } }),
+      issues && issues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: issues.map((issue, i) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         "div",
         {
           role: "alert",
@@ -4804,12 +5060,12 @@ function TransitionForm({
         `${issue.code}-${i}`
       )) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       TransitionSection,
       {
         title: messages.inspector.criteria,
         testId: "inspector-transition-criteria-section",
-        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           CriterionSection,
           {
             host,
@@ -4825,18 +5081,18 @@ function TransitionForm({
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
       TransitionSection,
       {
         title: "Scheduled transition",
         testId: "inspector-transition-schedule-section",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
             "label",
             {
               style: { display: "flex", flexDirection: "row", alignItems: "center", gap: 8, fontSize: 12, color: colors.textSecondary, cursor: "pointer" },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                   "input",
                   {
                     type: "checkbox",
@@ -4856,14 +5112,14 @@ function TransitionForm({
                     }
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: "Enable schedule" })
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: "Enable schedule" })
               ]
             }
           ),
-          transition.schedule !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4, fontSize: 12, color: colors.textSecondary }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: { fontWeight: 500 }, children: "Delay (ms)" }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          transition.schedule !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4, fontSize: 12, color: colors.textSecondary }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { style: { fontWeight: 500 }, children: "Delay (ms)" }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                 "input",
                 {
                   type: "text",
@@ -4879,9 +5135,9 @@ function TransitionForm({
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4, fontSize: 12, color: colors.textSecondary }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: { fontWeight: 500 }, children: "Timeout (ms)" }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4, fontSize: 12, color: colors.textSecondary }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { style: { fontWeight: 500 }, children: "Timeout (ms)" }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                 "input",
                 {
                   type: "text",
@@ -4898,7 +5154,7 @@ function TransitionForm({
               )
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
             "p",
             {
               style: {
@@ -4918,28 +5174,28 @@ function TransitionForm({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
       TransitionSection,
       {
         title: messages.inspector.processors,
         testId: "inspector-transition-processes-section",
         children: [
-          processorCount === 0 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: emptyProcessorStateStyle, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { style: summaryTextStyle2, children: "No processors run on this transition." }) }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { style: processorHelperStyle, children: "Processors run sequentially in the order shown." }),
-            processors.map((processor, index) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: processorRowStyle, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", gap: 10, alignItems: "center" }, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { style: processorOrderStyle, children: [
+          processorCount === 0 ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: emptyProcessorStateStyle, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { style: summaryTextStyle2, children: "No processors run on this transition." }) }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { style: processorHelperStyle, children: "Processors run sequentially in the order shown." }),
+            processors.map((processor, index) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: processorRowStyle, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", gap: 10, alignItems: "center" }, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("span", { style: processorOrderStyle, children: [
                   index + 1,
                   "."
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: processorTypeChipStyle, children: processor.type }),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 2, minWidth: 0 }, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("strong", { style: { fontSize: 13 }, children: processor.name }),
-                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: summaryTextStyle2, children: summarizeProcessor(processor) })
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { style: processorTypeChipStyle, children: processor.type }),
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 2, minWidth: 0 }, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("strong", { style: { fontSize: 13 }, children: processor.name }),
+                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { style: summaryTextStyle2, children: summarizeProcessor(processor) })
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                   "button",
                   {
                     type: "button",
@@ -4949,23 +5205,23 @@ function TransitionForm({
                       processorUuid: processorUuids[index],
                       processorIndex: index
                     }),
-                    style: ghostBtn5,
+                    style: ghostBtn6,
                     "data-testid": `processor-edit-${index}`,
                     children: "Edit"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                   "button",
                   {
                     type: "button",
                     disabled,
                     onClick: () => duplicateProcessor(processor, index),
-                    style: ghostBtn5,
+                    style: ghostBtn6,
                     "data-testid": `processor-duplicate-${index}`,
                     children: "Duplicate"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                   "button",
                   {
                     type: "button",
@@ -4976,12 +5232,12 @@ function TransitionForm({
                       processorUuid: processorUuids[index],
                       toIndex: index - 1
                     }),
-                    style: ghostBtn5,
+                    style: ghostBtn6,
                     "data-testid": `processor-move-up-${index}`,
                     children: "Move up"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                   "button",
                   {
                     type: "button",
@@ -4992,18 +5248,18 @@ function TransitionForm({
                       processorUuid: processorUuids[index],
                       toIndex: index + 1
                     }),
-                    style: ghostBtn5,
+                    style: ghostBtn6,
                     "data-testid": `processor-move-down-${index}`,
                     children: "Move down"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                   "button",
                   {
                     type: "button",
                     disabled: disabled || !processorUuids[index],
                     onClick: () => processorUuids[index] && onDispatch({ op: "removeProcessor", processorUuid: processorUuids[index] }),
-                    style: dangerBtn5,
+                    style: dangerBtn6,
                     "data-testid": `processor-delete-${index}`,
                     children: "Delete"
                   }
@@ -5011,13 +5267,13 @@ function TransitionForm({
               ] })
             ] }, processorUuids[index] ?? `${processor.name}-${index}`))
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
             "button",
             {
               type: "button",
               disabled,
               onClick: () => setProcessorModal({ mode: "add" }),
-              style: ghostBtn5,
+              style: ghostBtn6,
               "data-testid": "inspector-add-processor",
               children: messages.inspector.addProcessor
             }
@@ -5025,7 +5281,18 @@ function TransitionForm({
         ]
       }
     ),
-    processorModal && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(TransitionSection, { title: "Annotations", testId: "inspector-transition-annotations-section", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      AnnotationsField,
+      {
+        value: transition.annotations,
+        disabled,
+        showLabel: false,
+        modelKey: `transition-${transitionUuid}`,
+        onCommit: (annotations) => onDispatch({ op: "setAnnotations", target: { kind: "transition", transitionUuid }, annotations }),
+        onRemove: () => onDispatch({ op: "setAnnotations", target: { kind: "transition", transitionUuid } })
+      }
+    ) }),
+    processorModal && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       ProcessorEditorModal,
       {
         title: processorModal.mode === "add" ? "Add processor" : "Edit processor",
@@ -5045,8 +5312,8 @@ function TransitionSection({
   testId,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("section", { style: transitionSectionStyle, "data-testid": testId, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("header", { style: sectionHeaderStyle, children: title }),
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("section", { style: transitionSectionStyle, "data-testid": testId, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("header", { style: sectionHeaderStyle, children: title }),
     children
   ] });
 }
@@ -5069,7 +5336,7 @@ var sectionHeaderStyle = {
   textTransform: "uppercase",
   color: colors.textSecondary
 };
-var ghostBtn5 = {
+var ghostBtn6 = {
   padding: "4px 8px",
   background: "white",
   border: `1px solid ${colors.border}`,
@@ -5077,8 +5344,8 @@ var ghostBtn5 = {
   fontSize: 12,
   cursor: "pointer"
 };
-var dangerBtn5 = {
-  ...ghostBtn5,
+var dangerBtn6 = {
+  ...ghostBtn6,
   background: colors.dangerBg,
   borderColor: colors.dangerBorder,
   color: colors.danger
@@ -5153,9 +5420,9 @@ function AnchorSelect({
     { value: "left", label: messages.inspector.anchorLeft },
     { value: "left-bottom", label: messages.inspector.anchorLeftBottom }
   ];
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4, fontSize: 12, color: colors.textSecondary }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: { fontWeight: 500 }, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4, fontSize: 12, color: colors.textSecondary }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { style: { fontWeight: 500 }, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       CustomSelectInput,
       {
         value: value ?? "",
@@ -5170,7 +5437,7 @@ function AnchorSelect({
 }
 
 // src/inspector/Inspector.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function issueKeyForSelection(selection) {
   if (!selection) return null;
   switch (selection.kind) {
@@ -5199,16 +5466,16 @@ function Inspector({
 }) {
   const messages = useMessages();
   const { developerMode } = useEditorConfig();
-  const [tab, setTab] = (0, import_react15.useState)("properties");
+  const [tab, setTab] = (0, import_react16.useState)("properties");
   const effectiveTab = developerMode ? tab : "properties";
-  const resolved = (0, import_react15.useMemo)(() => resolveSelection(doc, selection), [doc, selection]);
+  const resolved = (0, import_react16.useMemo)(() => resolveSelection(doc, selection), [doc, selection]);
   const selectionIssueKey = issueKeyForSelection(selection);
-  const selectionIssues = (0, import_react15.useMemo)(() => {
+  const selectionIssues = (0, import_react16.useMemo)(() => {
     if (!selectionIssueKey) return [];
     return issues.filter((i) => i.targetId === selectionIssueKey);
   }, [issues, selectionIssueKey]);
   const breadcrumb = renderBreadcrumb(resolved);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     "aside",
     {
       style: {
@@ -5224,7 +5491,7 @@ function Inspector({
       },
       "data-testid": "inspector",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
           "header",
           {
             style: {
@@ -5237,8 +5504,8 @@ function Inspector({
               gap: 8
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: breadcrumb }),
-              onClose && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: breadcrumb }),
+              onClose && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                 "button",
                 {
                   type: "button",
@@ -5266,8 +5533,8 @@ function Inspector({
             ]
           }
         ),
-        developerMode && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", borderBottom: `1px solid ${colors.borderSubtle}` }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        developerMode && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { style: { display: "flex", borderBottom: `1px solid ${colors.borderSubtle}` }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
             TabButton,
             {
               active: effectiveTab === "properties",
@@ -5276,7 +5543,7 @@ function Inspector({
               children: messages.inspector.properties
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
             TabButton,
             {
               active: effectiveTab === "json",
@@ -5286,11 +5553,11 @@ function Inspector({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { padding: 12, overflowY: "auto", flex: 1, display: "flex", flexDirection: "column", gap: 16 }, children: [
-          effectiveTab === "properties" && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-            !resolved && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(EmptyState, { message: messages.inspector.empty }),
-            resolved?.kind === "workflow" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(WorkflowForm, { workflow: resolved.workflow, disabled: readOnly, onDispatch }, resolved.workflow.name),
-            resolved?.kind === "state" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { style: { padding: 12, overflowY: "auto", flex: 1, display: "flex", flexDirection: "column", gap: 16 }, children: [
+          effectiveTab === "properties" && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
+            !resolved && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(EmptyState, { message: messages.inspector.empty }),
+            resolved?.kind === "workflow" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkflowForm, { workflow: resolved.workflow, disabled: readOnly, onDispatch }, resolved.workflow.name),
+            resolved?.kind === "state" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               StateForm,
               {
                 workflow: resolved.workflow,
@@ -5303,7 +5570,7 @@ function Inspector({
               },
               `${resolved.workflow.name}:${resolved.stateCode}`
             ),
-            resolved?.kind === "transition" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            resolved?.kind === "transition" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               TransitionForm,
               {
                 workflow: resolved.workflow,
@@ -5320,7 +5587,7 @@ function Inspector({
               },
               resolved.transitionUuid
             ),
-            resolved?.kind === "processor" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            resolved?.kind === "processor" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               ProcessorForm,
               {
                 processor: resolved.processor,
@@ -5334,8 +5601,8 @@ function Inspector({
               resolved.processorUuid
             )
           ] }),
-          developerMode && effectiveTab === "json" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(JsonPreview, { document: doc, resolved }),
-          selectionIssues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(IssuesList, { issues: selectionIssues, title: messages.inspector.issues })
+          developerMode && effectiveTab === "json" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(JsonPreview, { document: doc, resolved }),
+          selectionIssues.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(IssuesList, { issues: selectionIssues, title: messages.inspector.issues })
         ] })
       ]
     }
@@ -5358,7 +5625,7 @@ function TabButton({
   children,
   testId
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     "button",
     {
       type: "button",
@@ -5379,17 +5646,17 @@ function TabButton({
   );
 }
 function EmptyState({ message }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { style: { color: colors.textTertiary, fontSize: 13 }, children: message });
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { style: { color: colors.textTertiary, fontSize: 13 }, children: message });
 }
 function IssuesList({
   issues,
   title
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("section", { style: { display: "flex", flexDirection: "column", gap: 6 }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("header", { style: { fontSize: 11, fontWeight: 600, letterSpacing: "0.08em", textTransform: "uppercase", color: colors.textSecondary }, children: title }),
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("section", { style: { display: "flex", flexDirection: "column", gap: 6 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("header", { style: { fontSize: 11, fontWeight: 600, letterSpacing: "0.08em", textTransform: "uppercase", color: colors.textSecondary }, children: title }),
     issues.map((issue, i) => {
       const tone = severityTone(issue.severity);
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
         "div",
         {
           style: {
@@ -5400,8 +5667,8 @@ function IssuesList({
             fontSize: 12
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("strong", { children: issue.code }),
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children: issue.message })
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("strong", { children: issue.code }),
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { children: issue.message })
           ]
         },
         `${issue.code}-${i}`
@@ -5413,15 +5680,15 @@ function JsonPreview({
   document: doc,
   resolved
 }) {
-  const json = (0, import_react15.useMemo)(() => {
-    if (!resolved) return (0, import_workflow_core7.serializeEditorDocument)(doc);
+  const json = (0, import_react16.useMemo)(() => {
+    if (!resolved) return (0, import_workflow_core8.serializeEditorDocument)(doc);
     if (resolved.kind === "workflow") return JSON.stringify(resolved.workflow, null, 2);
     if (resolved.kind === "state") return JSON.stringify(resolved.state, null, 2);
     if (resolved.kind === "transition") return JSON.stringify(resolved.transition, null, 2);
     if (resolved.kind === "processor") return JSON.stringify(resolved.processor, null, 2);
     return "";
   }, [doc, resolved]);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     "pre",
     {
       style: {
@@ -5444,7 +5711,7 @@ function JsonPreview({
 }
 
 // src/toolbar/Toolbar.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function Toolbar({
   derived,
   readOnly,
@@ -5458,7 +5725,7 @@ function Toolbar({
   toolbarEnd
 }) {
   const messages = useMessages();
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
     "footer",
     {
       style: {
@@ -5473,11 +5740,11 @@ function Toolbar({
       },
       "data-testid": "toolbar",
       children: [
-        toolbarStart && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: slotStyle, "data-testid": "toolbar-start", children: toolbarStart }),
-        toolbarCenter && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { ...slotStyle, flex: 1, justifyContent: "center" }, "data-testid": "toolbar-center", children: toolbarCenter }),
-        !toolbarCenter && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { flex: 1 } }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { role: "status", "aria-live": "polite", style: { display: "inline-flex", gap: 6 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        toolbarStart && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: slotStyle, "data-testid": "toolbar-start", children: toolbarStart }),
+        toolbarCenter && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { ...slotStyle, flex: 1, justifyContent: "center" }, "data-testid": "toolbar-center", children: toolbarCenter }),
+        !toolbarCenter && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { flex: 1 } }),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("span", { role: "status", "aria-live": "polite", style: { display: "inline-flex", gap: 6 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
             ValidationPill,
             {
               severity: "error",
@@ -5489,7 +5756,7 @@ function Toolbar({
               testId: "toolbar-errors"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
             ValidationPill,
             {
               severity: "warning",
@@ -5501,7 +5768,7 @@ function Toolbar({
               testId: "toolbar-warnings"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
             ValidationPill,
             {
               severity: "info",
@@ -5514,7 +5781,7 @@ function Toolbar({
             }
           )
         ] }),
-        onSave && showSaveButton && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        onSave && showSaveButton && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
           "button",
           {
             type: "button",
@@ -5525,7 +5792,7 @@ function Toolbar({
             children: messages.toolbar.save
           }
         ),
-        toolbarEnd && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: slotStyle, "data-testid": "toolbar-end", children: toolbarEnd })
+        toolbarEnd && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: slotStyle, "data-testid": "toolbar-end", children: toolbarEnd })
       ]
     }
   );
@@ -5547,7 +5814,7 @@ function ValidationPill({
   const tone = severityTone(severity);
   const interactive = count > 0 && !!onClick;
   const hasIssues = count > 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
     "button",
     {
       type: "button",
@@ -5574,7 +5841,7 @@ function ValidationPill({
         height: 20
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { style: { fontSize: severity === "info" ? 14 : 10, lineHeight: 1 }, children: SEVERITY_ICON[severity] }),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { style: { fontSize: severity === "info" ? 14 : 10, lineHeight: 1 }, children: SEVERITY_ICON[severity] }),
         count
       ]
     }
@@ -5598,8 +5865,8 @@ var slotStyle = {
 };
 
 // src/toolbar/IssuesDrawer.tsx
-var import_react16 = require("react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_react17 = require("react");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function resolveTarget(doc, targetId) {
   if (!targetId) return null;
   const ids = doc.meta.ids;
@@ -5652,8 +5919,8 @@ function IssuesDrawer({
   onJumpTo
 }) {
   const messages = useMessages();
-  const ref = (0, import_react16.useRef)(null);
-  (0, import_react16.useEffect)(() => {
+  const ref = (0, import_react17.useRef)(null);
+  (0, import_react17.useEffect)(() => {
     if (!open) return;
     function onKey(e) {
       if (e.key === "Escape") {
@@ -5677,18 +5944,18 @@ function IssuesDrawer({
       window.removeEventListener("mousedown", onClick);
     };
   }, [open, onClose]);
-  const filtered = (0, import_react16.useMemo)(
+  const filtered = (0, import_react17.useMemo)(
     () => issues.filter((i) => i.severity === severity),
     [issues, severity]
   );
-  const title = (0, import_react16.useMemo)(() => {
+  const title = (0, import_react17.useMemo)(() => {
     if (severity === "error") return messages.issues.errors;
     if (severity === "warning") return messages.issues.warnings;
     return messages.issues.infos;
   }, [severity, messages]);
   const tone = severityTone(severity);
   if (!open) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "div",
     {
       ref,
@@ -5712,7 +5979,7 @@ function IssuesDrawer({
         flexDirection: "column"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
           "header",
           {
             style: {
@@ -5723,7 +5990,7 @@ function IssuesDrawer({
               gap: 8
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                 "span",
                 {
                   style: {
@@ -5736,12 +6003,12 @@ function IssuesDrawer({
                   "aria-hidden": true
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("strong", { style: { flex: 1, fontSize: 13, color: colors.textPrimary }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("strong", { style: { flex: 1, fontSize: 13, color: colors.textPrimary }, children: [
                 title,
                 " \xB7 ",
                 filtered.length
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                 "button",
                 {
                   type: "button",
@@ -5764,14 +6031,14 @@ function IssuesDrawer({
             ]
           }
         ),
-        filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           "p",
           {
             style: { padding: 12, color: colors.textTertiary, fontSize: 12, margin: 0 },
             "data-testid": "issues-drawer-empty",
             children: messages.issues.none
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           "ul",
           {
             style: {
@@ -5785,7 +6052,7 @@ function IssuesDrawer({
             children: filtered.map((issue, idx) => {
               const target = resolveTarget(doc, issue.targetId);
               const targetLabel = target ? target.kind === "transition" ? `${messages.issues.relatedTransition}: ${target.label}` : target.kind === "state" ? `${messages.issues.relatedState}: ${target.label}` : target.label : null;
-              return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+              return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
                 "li",
                 {
                   style: {
@@ -5799,10 +6066,10 @@ function IssuesDrawer({
                   },
                   "data-testid": `issues-drawer-item-${idx}`,
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { fontSize: 11, fontWeight: 700, color: tone.fg }, children: issue.code }),
-                    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { fontSize: 12, color: colors.textPrimary }, children: issue.message }),
-                    targetLabel && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { fontSize: 11, color: colors.textSecondary }, children: targetLabel }),
-                    target && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { fontSize: 11, fontWeight: 700, color: tone.fg }, children: issue.code }),
+                    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { fontSize: 12, color: colors.textPrimary }, children: issue.message }),
+                    targetLabel && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { fontSize: 11, color: colors.textSecondary }, children: targetLabel }),
+                    target && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                       "button",
                       {
                         type: "button",
@@ -5837,23 +6104,23 @@ function IssuesDrawer({
 }
 
 // src/toolbar/WorkflowTabs.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 
 // src/toolbar/VersionBadge.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_react_dom2 = require("react-dom");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 function VersionBadge({
   version,
   supportedVersions,
   readOnly = false,
   onVersionChange
 }) {
-  const [open, setOpen] = (0, import_react17.useState)(false);
-  const [dropdownPos, setDropdownPos] = (0, import_react17.useState)(null);
-  const buttonRef = (0, import_react17.useRef)(null);
-  const dropdownRef = (0, import_react17.useRef)(null);
-  (0, import_react17.useEffect)(() => {
+  const [open, setOpen] = (0, import_react18.useState)(false);
+  const [dropdownPos, setDropdownPos] = (0, import_react18.useState)(null);
+  const buttonRef = (0, import_react18.useRef)(null);
+  const dropdownRef = (0, import_react18.useRef)(null);
+  (0, import_react18.useEffect)(() => {
     if (!open) return;
     const handler = (e) => {
       const target = e.target;
@@ -5875,7 +6142,7 @@ function VersionBadge({
     setOpen((o) => !o);
   };
   if (readOnly) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       "div",
       {
         "data-testid": "version-badge",
@@ -5894,7 +6161,7 @@ function VersionBadge({
     );
   }
   const dropdown = open && dropdownPos ? (0, import_react_dom2.createPortal)(
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
       "div",
       {
         ref: dropdownRef,
@@ -5913,7 +6180,7 @@ function VersionBadge({
           zIndex: 9999
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
             "div",
             {
               style: {
@@ -5930,7 +6197,7 @@ function VersionBadge({
           ),
           [...supportedVersions].reverse().map((v) => {
             const isCurrent = v === version.replace(/^v/, "");
-            return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+            return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
               "button",
               {
                 type: "button",
@@ -5953,16 +6220,16 @@ function VersionBadge({
                   textAlign: "left"
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("span", { children: [
                     v,
                     " ",
-                    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { style: { fontSize: 11, color: isCurrent ? "#93C5FD" : "#94A3B8" }, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("span", { style: { fontSize: 11, color: isCurrent ? "#93C5FD" : "#94A3B8" }, children: [
                       "cyoda-go ",
                       v,
                       ".x"
                     ] })
                   ] }),
-                  isCurrent && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                  isCurrent && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
                     "span",
                     {
                       style: {
@@ -5986,8 +6253,8 @@ function VersionBadge({
     ),
     document.body
   ) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
       "button",
       {
         ref: buttonRef,
@@ -6010,7 +6277,7 @@ function VersionBadge({
         },
         children: [
           version,
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { style: { fontSize: 10, opacity: 0.7 }, children: open ? "\u25B4" : "\u25BE" })
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { style: { fontSize: 10, opacity: 0.7 }, children: open ? "\u25B4" : "\u25BE" })
         ]
       }
     ),
@@ -6019,7 +6286,7 @@ function VersionBadge({
 }
 
 // src/toolbar/WorkflowTabs.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function WorkflowTabs({
   workflows,
   activeWorkflow,
@@ -6033,10 +6300,10 @@ function WorkflowTabs({
   onVersionChange
 }) {
   const messages = useMessages();
-  const [editingTab, setEditingTab] = (0, import_react18.useState)(null);
-  const [draftName, setDraftName] = (0, import_react18.useState)("");
-  const inputRef = (0, import_react18.useRef)(null);
-  (0, import_react18.useEffect)(() => {
+  const [editingTab, setEditingTab] = (0, import_react19.useState)(null);
+  const [draftName, setDraftName] = (0, import_react19.useState)("");
+  const inputRef = (0, import_react19.useRef)(null);
+  (0, import_react19.useEffect)(() => {
     if (editingTab !== null) inputRef.current?.select();
   }, [editingTab]);
   const startEditing = (name) => {
@@ -6056,7 +6323,7 @@ function WorkflowTabs({
     setEditingTab(null);
   };
   const cancelEdit = () => setEditingTab(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "nav",
     {
       style: {
@@ -6074,7 +6341,7 @@ function WorkflowTabs({
         workflows.map((w) => {
           const active = w.name === activeWorkflow;
           const isEditing = editingTab === w.name;
-          return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
             "div",
             {
               style: {
@@ -6085,7 +6352,7 @@ function WorkflowTabs({
                 background: active ? "white" : "transparent"
               },
               children: [
-                isEditing ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                isEditing ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                   "input",
                   {
                     ref: inputRef,
@@ -6116,7 +6383,7 @@ function WorkflowTabs({
                       width: Math.max(60, draftName.length * 8)
                     }
                   }
-                ) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                ) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                   "button",
                   {
                     type: "button",
@@ -6135,7 +6402,7 @@ function WorkflowTabs({
                     children: w.name || messages.tabs.untitled
                   }
                 ),
-                onClose && !readOnly && workflows.length > 1 && !isEditing && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                onClose && !readOnly && workflows.length > 1 && !isEditing && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                   "button",
                   {
                     type: "button",
@@ -6158,7 +6425,7 @@ function WorkflowTabs({
             w.name
           );
         }),
-        onAdd && !readOnly && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+        onAdd && !readOnly && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
           "button",
           {
             type: "button",
@@ -6183,9 +6450,9 @@ function WorkflowTabs({
             ]
           }
         ),
-        dialectVersion && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { flex: 1 } }),
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+        dialectVersion && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: { flex: 1 } }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             VersionBadge,
             {
               version: dialectVersion,
@@ -6201,9 +6468,9 @@ function WorkflowTabs({
 }
 
 // src/modals/DragConnectModal.tsx
-var import_react19 = require("react");
-var import_workflow_core8 = require("@cyoda/workflow-core");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_react20 = require("react");
+var import_workflow_core9 = require("@cyoda/workflow-core");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function generateDefault(toState, existing) {
   const base = `to_${toState}`;
   if (!existing.has(base)) return base;
@@ -6220,20 +6487,20 @@ function DragConnectModal({
 }) {
   const messages = useMessages();
   const existing = new Set(source.transitions.map((t) => t.name));
-  const [name, setName] = (0, import_react19.useState)(() => generateDefault(toState, existing));
-  const invalidFormat = !!name && !import_workflow_core8.NAME_REGEX.test(name);
+  const [name, setName] = (0, import_react20.useState)(() => generateDefault(toState, existing));
+  const invalidFormat = !!name && !import_workflow_core9.NAME_REGEX.test(name);
   const duplicate = existing.has(name);
   const blocked = name.length === 0 || invalidFormat || duplicate;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(ModalFrame, { onCancel, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("h2", { style: { margin: 0, fontSize: 16 }, children: messages.dragConnect.title }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("p", { style: { margin: "6px 0 14px", fontSize: 12, color: colors.textSecondary }, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(ModalFrame, { onCancel, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("h2", { style: { margin: 0, fontSize: 16 }, children: messages.dragConnect.title }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("p", { style: { margin: "6px 0 14px", fontSize: 12, color: colors.textSecondary }, children: [
       fromState,
       " \u2192 ",
       toState
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { fontSize: 12, color: colors.textSecondary }, children: messages.dragConnect.transitionName }),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("label", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { style: { fontSize: 12, color: colors.textSecondary }, children: messages.dragConnect.transitionName }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "input",
         {
           type: "text",
@@ -6253,17 +6520,17 @@ function DragConnectModal({
         }
       )
     ] }),
-    invalidFormat && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: errorMsg, "data-testid": "dragconnect-error-format", children: messages.dragConnect.invalidName }),
-    duplicate && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: errorMsg, "data-testid": "dragconnect-error-duplicate", children: messages.dragConnect.duplicateName }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 16 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn6, "data-testid": "dragconnect-cancel", children: messages.dragConnect.cancel }),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    invalidFormat && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: errorMsg, "data-testid": "dragconnect-error-format", children: messages.dragConnect.invalidName }),
+    duplicate && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: errorMsg, "data-testid": "dragconnect-error-duplicate", children: messages.dragConnect.duplicateName }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 16 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn7, "data-testid": "dragconnect-cancel", children: messages.dragConnect.cancel }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "button",
         {
           type: "button",
           onClick: () => !blocked && onCreate(name),
           disabled: blocked,
-          style: primaryBtn3,
+          style: primaryBtn4,
           "data-testid": "dragconnect-create",
           children: messages.dragConnect.create
         }
@@ -6276,7 +6543,7 @@ var errorMsg = {
   fontSize: 12,
   color: colors.danger
 };
-var ghostBtn6 = {
+var ghostBtn7 = {
   padding: "6px 12px",
   background: "white",
   border: `1px solid ${colors.border}`,
@@ -6284,33 +6551,33 @@ var ghostBtn6 = {
   fontSize: 13,
   cursor: "pointer"
 };
-var primaryBtn3 = {
-  ...ghostBtn6,
+var primaryBtn4 = {
+  ...ghostBtn7,
   background: colors.primary,
   color: "white",
   borderColor: colors.primary
 };
 
 // src/modals/AddStateModal.tsx
-var import_react20 = require("react");
-var import_workflow_core9 = require("@cyoda/workflow-core");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_react21 = require("react");
+var import_workflow_core10 = require("@cyoda/workflow-core");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function generateName(existing) {
   let n = 1;
   while (existing.includes(`state${n}`)) n++;
   return `state${n}`;
 }
 function AddStateModal({ existingNames, onCreate, onCancel }) {
-  const [name, setName] = (0, import_react20.useState)(() => generateName(existingNames));
-  const [error, setError] = (0, import_react20.useState)(null);
-  const inputRef = (0, import_react20.useRef)(null);
-  (0, import_react20.useEffect)(() => {
+  const [name, setName] = (0, import_react21.useState)(() => generateName(existingNames));
+  const [error, setError] = (0, import_react21.useState)(null);
+  const inputRef = (0, import_react21.useRef)(null);
+  (0, import_react21.useEffect)(() => {
     inputRef.current?.select();
   }, []);
   const validate = (v) => {
     const trimmed = v.trim();
     if (!trimmed) return "Name is required";
-    if (!import_workflow_core9.NAME_REGEX.test(trimmed)) return "Must start with a letter and contain only letters, numbers, and underscores";
+    if (!import_workflow_core10.NAME_REGEX.test(trimmed)) return "Must start with a letter and contain only letters, numbers, and underscores";
     if (existingNames.includes(trimmed)) return `State "${trimmed}" already exists`;
     return null;
   };
@@ -6322,11 +6589,11 @@ function AddStateModal({ existingNames, onCreate, onCancel }) {
     }
     onCreate(name.trim());
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(ModalFrame, { onCancel, labelledBy: "add-state-title", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("h2", { id: "add-state-title", style: { margin: 0, fontSize: 16 }, children: "Add State" }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { marginTop: 16, display: "flex", flexDirection: "column", gap: 6 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("label", { htmlFor: "add-state-name-input", style: { fontSize: 12, color: colors.textSecondary }, children: "State name" }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(ModalFrame, { onCancel, labelledBy: "add-state-title", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h2", { id: "add-state-title", style: { margin: 0, fontSize: 16 }, children: "Add State" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { marginTop: 16, display: "flex", flexDirection: "column", gap: 6 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("label", { htmlFor: "add-state-name-input", style: { fontSize: 12, color: colors.textSecondary }, children: "State name" }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "input",
         {
           ref: inputRef,
@@ -6352,7 +6619,7 @@ function AddStateModal({ existingNames, onCreate, onCancel }) {
           }
         }
       ),
-      error && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      error && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "div",
         {
           id: "add-state-error",
@@ -6362,23 +6629,23 @@ function AddStateModal({ existingNames, onCreate, onCancel }) {
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 20 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 20 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "button",
         {
           type: "button",
           onClick: onCancel,
-          style: ghostBtn7,
+          style: ghostBtn8,
           "data-testid": "add-state-cancel",
           children: "Cancel"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "button",
         {
           type: "button",
           onClick: handleSubmit,
-          style: primaryBtn4,
+          style: primaryBtn5,
           "data-testid": "add-state-confirm",
           children: "Add State"
         }
@@ -6386,7 +6653,7 @@ function AddStateModal({ existingNames, onCreate, onCancel }) {
     ] })
   ] });
 }
-var ghostBtn7 = {
+var ghostBtn8 = {
   padding: "6px 12px",
   background: "white",
   border: `1px solid ${colors.border}`,
@@ -6394,8 +6661,8 @@ var ghostBtn7 = {
   fontSize: 13,
   cursor: "pointer"
 };
-var primaryBtn4 = {
-  ...ghostBtn7,
+var primaryBtn5 = {
+  ...ghostBtn8,
   background: colors.primary,
   color: "white",
   borderColor: colors.primary
@@ -6403,15 +6670,15 @@ var primaryBtn4 = {
 
 // src/modals/HelpModal.tsx
 var import_theme6 = require("@cyoda/workflow-viewer/theme");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function HelpModal({ onCancel }) {
   const messages = useMessages();
   const h = messages.help;
   const node = import_theme6.workflowPalette.node;
   const edge = import_theme6.workflowPalette.edge;
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ModalFrame, { onCancel, labelledBy: "workflow-help-title", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { width: 480, maxWidth: "85vw" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h2", { id: "workflow-help-title", style: { margin: 0, fontSize: 16 }, children: h.title }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ModalFrame, { onCancel, labelledBy: "workflow-help-title", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { width: 480, maxWidth: "85vw" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h2", { id: "workflow-help-title", style: { margin: 0, fontSize: 16 }, children: h.title }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
       "div",
       {
         style: {
@@ -6424,48 +6691,48 @@ function HelpModal({ onCancel }) {
           gap: 16
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Section, { title: h.statesTitle, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ColorRow, { fill: node.initial.fill, border: node.initial.border, label: h.stateInitial }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ColorRow, { fill: node.default.fill, border: node.default.border, label: h.stateDefault }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ColorRow, { fill: node.processing.fill, border: node.processing.border, label: h.stateProcessing }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ColorRow, { fill: node.manualReview.fill, border: node.manualReview.border, label: h.stateManualReview }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ColorRow, { fill: node.terminal.fill, border: node.terminal.border, label: h.stateTerminal }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ColorRow, { fill: "#FFFFFF", border: colors.danger, label: h.stateError }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ColorRow, { fill: "#FFFFFF", border: colors.warning, label: h.stateWarning })
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Section, { title: h.statesTitle, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ColorRow, { fill: node.initial.fill, border: node.initial.border, label: h.stateInitial }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ColorRow, { fill: node.default.fill, border: node.default.border, label: h.stateDefault }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ColorRow, { fill: node.processing.fill, border: node.processing.border, label: h.stateProcessing }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ColorRow, { fill: node.manualReview.fill, border: node.manualReview.border, label: h.stateManualReview }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ColorRow, { fill: node.terminal.fill, border: node.terminal.border, label: h.stateTerminal }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ColorRow, { fill: "#FFFFFF", border: colors.danger, label: h.stateError }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ColorRow, { fill: "#FFFFFF", border: colors.warning, label: h.stateWarning })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Section, { title: h.transitionsTitle, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LineRow, { color: edge.automated, label: h.transitionAutomated }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LineRow, { color: edge.manual, dashed: true, label: h.transitionManual }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LineRow, { color: edge.conditional, label: h.transitionConditional }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LineRow, { color: edge.processing, label: h.transitionProcessing }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LineRow, { color: edge.terminal, label: h.transitionTerminal }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LineRow, { color: edge.loop, label: h.transitionLoop }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LineRow, { color: edge.disabled, label: h.transitionDisabled })
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Section, { title: h.transitionsTitle, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LineRow, { color: edge.automated, label: h.transitionAutomated }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LineRow, { color: edge.manual, dashed: true, label: h.transitionManual }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LineRow, { color: edge.conditional, label: h.transitionConditional }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LineRow, { color: edge.processing, label: h.transitionProcessing }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LineRow, { color: edge.terminal, label: h.transitionTerminal }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LineRow, { color: edge.loop, label: h.transitionLoop }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LineRow, { color: edge.disabled, label: h.transitionDisabled })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Section, { title: h.controlsTitle, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ShortcutRow, { keys: "A", label: h.shortcutAddState }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ShortcutRow, { keys: "L", label: h.shortcutAutoLayout }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ShortcutRow, { keys: "Ctrl/\u2318 Z", label: h.shortcutUndo }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ShortcutRow, { keys: "Ctrl/\u2318 \u21E7 Z", label: h.shortcutRedo }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ShortcutRow, { keys: "Ctrl/\u2318 S", label: h.shortcutSave }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ShortcutRow, { keys: "Delete", label: h.shortcutDelete }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ShortcutRow, { keys: "Esc", label: h.shortcutEscape })
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Section, { title: h.controlsTitle, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ShortcutRow, { keys: "A", label: h.shortcutAddState }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ShortcutRow, { keys: "L", label: h.shortcutAutoLayout }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ShortcutRow, { keys: "Ctrl/\u2318 Z", label: h.shortcutUndo }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ShortcutRow, { keys: "Ctrl/\u2318 \u21E7 Z", label: h.shortcutRedo }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ShortcutRow, { keys: "Ctrl/\u2318 S", label: h.shortcutSave }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ShortcutRow, { keys: "Delete", label: h.shortcutDelete }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ShortcutRow, { keys: "Esc", label: h.shortcutEscape })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Section, { title: h.tipsTitle, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("ul", { style: { margin: 0, paddingLeft: 18, fontSize: 13, color: colors.textSecondary, display: "flex", flexDirection: "column", gap: 6 }, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", { children: h.tipDoubleClick }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", { children: h.tipConnect }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", { children: h.tipSelect }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", { children: h.tipMove })
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Section, { title: h.tipsTitle, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("ul", { style: { margin: 0, paddingLeft: 18, fontSize: 13, color: colors.textSecondary, display: "flex", flexDirection: "column", gap: 6 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("li", { children: h.tipDoubleClick }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("li", { children: h.tipConnect }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("li", { children: h.tipSelect }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("li", { children: h.tipMove })
           ] }) })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { display: "flex", justifyContent: "flex-end", marginTop: 16 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtnStyle, "data-testid": "help-modal-close", children: h.close }) })
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { display: "flex", justifyContent: "flex-end", marginTop: 16 }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtnStyle, "data-testid": "help-modal-close", children: h.close }) })
   ] }) });
 }
 function Section({ title, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       "h3",
       {
         style: {
@@ -6479,12 +6746,12 @@ function Section({ title, children }) {
         children: title
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 6 }, children })
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 6 }, children })
   ] });
 }
 function ColorRow({ fill, border, label }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10, fontSize: 13, color: colors.textPrimary }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10, fontSize: 13, color: colors.textPrimary }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       "span",
       {
         style: {
@@ -6497,12 +6764,12 @@ function ColorRow({ fill, border, label }) {
         }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: label })
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: label })
   ] });
 }
 function LineRow({ color, label, dashed }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10, fontSize: 13, color: colors.textPrimary }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("svg", { width: "28", height: "14", style: { flexShrink: 0 }, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10, fontSize: 13, color: colors.textPrimary }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("svg", { width: "28", height: "14", style: { flexShrink: 0 }, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       "line",
       {
         x1: "2",
@@ -6515,12 +6782,12 @@ function LineRow({ color, label, dashed }) {
         ...dashed ? { strokeDasharray: "3 3" } : {}
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: label })
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: label })
   ] });
 }
 function ShortcutRow({ keys, label }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10, fontSize: 13, color: colors.textPrimary }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10, fontSize: 13, color: colors.textPrimary }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       "kbd",
       {
         style: {
@@ -6540,12 +6807,12 @@ function ShortcutRow({ keys, label }) {
         children: keys
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: label })
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: label })
   ] });
 }
 
 // src/modals/VersionSwitchModal.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function VersionSwitchModal({
   fromVersion,
   toVersion,
@@ -6553,7 +6820,7 @@ function VersionSwitchModal({
   onConfirm,
   onCancel
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       style: {
@@ -6565,7 +6832,7 @@ function VersionSwitchModal({
         justifyContent: "center",
         zIndex: 1e3
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
         "div",
         {
           "data-testid": "version-switch-modal",
@@ -6579,8 +6846,8 @@ function VersionSwitchModal({
             fontFamily: "inherit"
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { padding: "16px 20px 0", display: "flex", alignItems: "flex-start", gap: 12 }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { style: { padding: "16px 20px 0", display: "flex", alignItems: "flex-start", gap: 12 }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                 "div",
                 {
                   style: {
@@ -6597,20 +6864,20 @@ function VersionSwitchModal({
                   children: "\u26A0\uFE0F"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { fontWeight: 600, fontSize: 14, color: "#0F172A", marginBottom: 4 }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { style: { fontWeight: 600, fontSize: 14, color: "#0F172A", marginBottom: 4 }, children: [
                   "Switch to ",
                   toVersion,
                   "?"
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { color: "#475569", lineHeight: 1.5, fontSize: 13 }, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { style: { color: "#475569", lineHeight: 1.5, fontSize: 13 }, children: [
                   "Switching to ",
                   toVersion,
                   " will remove data not supported in that dialect:"
                 ] })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
               "div",
               {
                 style: {
@@ -6623,17 +6890,17 @@ function VersionSwitchModal({
                   fontSize: 12
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { fontWeight: 600, marginBottom: 6 }, children: "Will be removed:" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("ul", { style: { margin: 0, paddingLeft: 16, lineHeight: 1.8 }, children: warnings.map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("li", { children: w }, i)) })
+                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { style: { fontWeight: 600, marginBottom: 6 }, children: "Will be removed:" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("ul", { style: { margin: 0, paddingLeft: 16, lineHeight: 1.8 }, children: warnings.map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("li", { children: w }, i)) })
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { padding: "10px 20px 0 64px", color: "#64748B", fontSize: 12, lineHeight: 1.5 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { style: { padding: "10px 20px 0 64px", color: "#64748B", fontSize: 12, lineHeight: 1.5 }, children: [
               "This cannot be undone. You can switch back to ",
               fromVersion,
               " any time, but the removed data will not be restored."
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
               "div",
               {
                 style: {
@@ -6645,7 +6912,7 @@ function VersionSwitchModal({
                   marginTop: 16
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                     "button",
                     {
                       type: "button",
@@ -6663,7 +6930,7 @@ function VersionSwitchModal({
                       children: "Cancel"
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+                  /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
                     "button",
                     {
                       type: "button",
@@ -6697,17 +6964,17 @@ function VersionSwitchModal({
 }
 
 // src/components/CommentNode.tsx
-var import_react21 = require("react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_react22 = require("react");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function CommentNode({ comment, disabled, onUpdate, onRemove }) {
-  const [editing, setEditing] = (0, import_react21.useState)(false);
-  const [draft, setDraft] = (0, import_react21.useState)(comment.text);
-  const textareaRef = (0, import_react21.useRef)(null);
+  const [editing, setEditing] = (0, import_react22.useState)(false);
+  const [draft, setDraft] = (0, import_react22.useState)(comment.text);
+  const textareaRef = (0, import_react22.useRef)(null);
   const commitEdit = () => {
     setEditing(false);
     if (draft !== comment.text) onUpdate({ text: draft });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     "div",
     {
       "data-testid": `comment-${comment.id}`,
@@ -6728,8 +6995,8 @@ function CommentNode({ comment, disabled, onUpdate, onRemove }) {
         userSelect: "none"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 4, marginBottom: 4 }, children: [
-          !disabled && !editing && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 4, marginBottom: 4 }, children: [
+          !disabled && !editing && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "button",
             {
               type: "button",
@@ -6744,7 +7011,7 @@ function CommentNode({ comment, disabled, onUpdate, onRemove }) {
               children: "\u270F\uFE0F"
             }
           ),
-          !disabled && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          !disabled && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "button",
             {
               type: "button",
@@ -6756,7 +7023,7 @@ function CommentNode({ comment, disabled, onUpdate, onRemove }) {
             }
           )
         ] }),
-        editing ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        editing ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "textarea",
           {
             ref: textareaRef,
@@ -6782,7 +7049,7 @@ function CommentNode({ comment, disabled, onUpdate, onRemove }) {
             },
             "data-testid": `comment-textarea-${comment.id}`
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        ) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "div",
           {
             onDoubleClick: () => {
@@ -6792,7 +7059,7 @@ function CommentNode({ comment, disabled, onUpdate, onRemove }) {
               }
             },
             style: { whiteSpace: "pre-wrap", wordBreak: "break-word", minHeight: 20 },
-            children: comment.text || /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("em", { style: { color: "#94a3b8" }, children: "empty note" })
+            children: comment.text || /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("em", { style: { color: "#94a3b8" }, children: "empty note" })
           }
         )
       ]
@@ -6810,9 +7077,9 @@ var iconBtn = {
 };
 
 // src/components/WorkflowJsonEditor.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 var import_workflow_monaco2 = require("@cyoda/workflow-monaco");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function WorkflowJsonEditor({
   document: document2,
   issues,
@@ -6824,20 +7091,20 @@ function WorkflowJsonEditor({
   onSelectionChange,
   onStatusChange
 }) {
-  const containerRef = (0, import_react22.useRef)(null);
-  const documentRef = (0, import_react22.useRef)(document2);
-  const issuesRef = (0, import_react22.useRef)(issues);
-  const readOnlyRef = (0, import_react22.useRef)(readOnly);
-  const onPatchRef = (0, import_react22.useRef)(onPatch);
-  const onSelectionChangeRef = (0, import_react22.useRef)(onSelectionChange);
-  const onStatusChangeRef = (0, import_react22.useRef)(onStatusChange);
-  const editorRef = (0, import_react22.useRef)(null);
-  const controllerRef = (0, import_react22.useRef)(null);
-  const schemaHandleRef = (0, import_react22.useRef)(null);
-  const cursorBridgeRef = (0, import_react22.useRef)(null);
-  const applyingGraphSelectionRef = (0, import_react22.useRef)(false);
-  const visibleRef = (0, import_react22.useRef)(visible);
-  const [status, setStatus] = (0, import_react22.useState)({ status: "idle" });
+  const containerRef = (0, import_react23.useRef)(null);
+  const documentRef = (0, import_react23.useRef)(document2);
+  const issuesRef = (0, import_react23.useRef)(issues);
+  const readOnlyRef = (0, import_react23.useRef)(readOnly);
+  const onPatchRef = (0, import_react23.useRef)(onPatch);
+  const onSelectionChangeRef = (0, import_react23.useRef)(onSelectionChange);
+  const onStatusChangeRef = (0, import_react23.useRef)(onStatusChange);
+  const editorRef = (0, import_react23.useRef)(null);
+  const controllerRef = (0, import_react23.useRef)(null);
+  const schemaHandleRef = (0, import_react23.useRef)(null);
+  const cursorBridgeRef = (0, import_react23.useRef)(null);
+  const applyingGraphSelectionRef = (0, import_react23.useRef)(false);
+  const visibleRef = (0, import_react23.useRef)(visible);
+  const [status, setStatus] = (0, import_react23.useState)({ status: "idle" });
   documentRef.current = document2;
   issuesRef.current = issues;
   readOnlyRef.current = readOnly;
@@ -6845,7 +7112,7 @@ function WorkflowJsonEditor({
   onPatchRef.current = onPatch;
   onSelectionChangeRef.current = onSelectionChange;
   onStatusChangeRef.current = onStatusChange;
-  const selectedId = (0, import_react22.useMemo)(
+  const selectedId = (0, import_react23.useMemo)(
     () => selectionToJsonId(document2, selection),
     [document2, selection]
   );
@@ -6853,7 +7120,7 @@ function WorkflowJsonEditor({
   const modelUri = config?.modelUri;
   const editorOptions = config?.editorOptions;
   const debounceMs = config?.debounceMs;
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (!monaco || !containerRef.current || editorRef.current) return;
     const model = monaco.editor.createModel(
       "",
@@ -6908,7 +7175,7 @@ function WorkflowJsonEditor({
       model.dispose();
     };
   }, [monaco, modelUri]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const editor = editorRef.current;
     const controller = controllerRef.current;
     if (!editor || !controller || !config) return;
@@ -6916,17 +7183,17 @@ function WorkflowJsonEditor({
     controller.syncFromDocument(document2);
     controller.renderIssues(issues, document2);
   }, [config, document2, issues, readOnly]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (!visible) return;
     editorRef.current?.layout?.();
   }, [visible]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (!config) {
       setStatus({ status: "idle" });
       onStatusChangeRef.current?.({ status: "idle" });
     }
   }, [config]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const editor = editorRef.current;
     if (!editor || !visible || !selectedId) return;
     applyingGraphSelectionRef.current = true;
@@ -6937,7 +7204,7 @@ function WorkflowJsonEditor({
     return () => window.clearTimeout(timeout);
   }, [document2, selectedId, visible]);
   if (!config) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       "div",
       {
         "data-testid": "workflow-json-unavailable",
@@ -6952,11 +7219,11 @@ function WorkflowJsonEditor({
           textAlign: "center",
           background: "#F8FAFC"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(UnavailableMessage, {})
+        children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(UnavailableMessage, {})
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     "div",
     {
       "data-testid": "workflow-json-editor",
@@ -6968,8 +7235,8 @@ function WorkflowJsonEditor({
         minHeight: 0
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(JsonStatusBanner, { status }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(JsonStatusBanner, { status }),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           "div",
           {
             ref: containerRef,
@@ -6982,7 +7249,7 @@ function WorkflowJsonEditor({
 }
 function UnavailableMessage() {
   const messages = useMessages();
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: messages.editorView.unavailable });
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: messages.editorView.unavailable });
 }
 function JsonStatusBanner({ status }) {
   const messages = useMessages();
@@ -6991,7 +7258,7 @@ function JsonStatusBanner({ status }) {
   }
   const tone = status.status === "semantic-errors" ? { border: "#FCD34D", bg: "#FFFBEB", text: "#92400E" } : { border: "#FCA5A5", bg: "#FEF2F2", text: "#991B1B" };
   const body = status.status === "semantic-errors" ? messages.editorView.semanticErrors : status.status === "invalid-schema" ? messages.editorView.invalidSchema : `${messages.editorView.invalidJson}${status.message ? ` ${status.message}` : ""}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     {
       role: "status",
@@ -7035,7 +7302,7 @@ function selectionFromJsonId(doc, id) {
 }
 
 // src/components/WorkflowEditor.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function hasPersistedWorkflowUi(meta) {
   return !!meta && Object.values(meta).some((value) => value !== void 0);
 }
@@ -7081,9 +7348,9 @@ function WorkflowEditor({
   onJsonStatusChange,
   developerMode = false
 }) {
-  const mergedMessages = (0, import_react23.useMemo)(() => mergeMessages(messages), [messages]);
-  const editorConfig = (0, import_react23.useMemo)(() => ({ developerMode }), [developerMode]);
-  const initialDocumentWithLayout = (0, import_react23.useMemo)(() => {
+  const mergedMessages = (0, import_react24.useMemo)(() => mergeMessages(messages), [messages]);
+  const editorConfig = (0, import_react24.useMemo)(() => ({ developerMode }), [developerMode]);
+  const initialDocumentWithLayout = (0, import_react24.useMemo)(() => {
     if (localStorageKey === null) return initialDocument;
     try {
       const stored = localStorage.getItem(localStorageKey);
@@ -7102,36 +7369,36 @@ function WorkflowEditor({
     }
   }, []);
   const [state, actions] = useEditorStore(initialDocumentWithLayout, mode);
-  const [isFullscreen, setIsFullscreen] = (0, import_react23.useState)(false);
-  const [inspectorWidth, setInspectorWidth] = (0, import_react23.useState)(384);
-  const editorContainerRef = (0, import_react23.useRef)(null);
-  const [pendingDelete, setPendingDelete] = (0, import_react23.useState)(null);
-  const [pendingConnect, setPendingConnect] = (0, import_react23.useState)(null);
-  const [pendingAddState, setPendingAddState] = (0, import_react23.useState)(null);
-  const [helpOpen, setHelpOpen] = (0, import_react23.useState)(false);
-  const [reconnectError, setReconnectError] = (0, import_react23.useState)(null);
-  const [layoutKey, setLayoutKey] = (0, import_react23.useState)(0);
-  const [activeSurface, setActiveSurface] = (0, import_react23.useState)("graph");
-  const [jsonStatus, setJsonStatus] = (0, import_react23.useState)({ status: "idle" });
-  const [openIssueSeverity, setOpenIssueSeverity] = (0, import_react23.useState)(null);
-  const [inspectorOpen, setInspectorOpen] = (0, import_react23.useState)(false);
-  const [pendingVersionSwitch, setPendingVersionSwitch] = (0, import_react23.useState)(null);
-  const selectionRef = (0, import_react23.useRef)(state.selection);
-  const documentStateRef = (0, import_react23.useRef)(state.document);
-  const activeWorkflowRef = (0, import_react23.useRef)(state.activeWorkflow);
-  const pendingSelectionRestoreRef = (0, import_react23.useRef)(null);
-  const newStatePositionRef = (0, import_react23.useRef)(null);
-  (0, import_react23.useEffect)(() => {
+  const [isFullscreen, setIsFullscreen] = (0, import_react24.useState)(false);
+  const [inspectorWidth, setInspectorWidth] = (0, import_react24.useState)(384);
+  const editorContainerRef = (0, import_react24.useRef)(null);
+  const [pendingDelete, setPendingDelete] = (0, import_react24.useState)(null);
+  const [pendingConnect, setPendingConnect] = (0, import_react24.useState)(null);
+  const [pendingAddState, setPendingAddState] = (0, import_react24.useState)(null);
+  const [helpOpen, setHelpOpen] = (0, import_react24.useState)(false);
+  const [reconnectError, setReconnectError] = (0, import_react24.useState)(null);
+  const [layoutKey, setLayoutKey] = (0, import_react24.useState)(0);
+  const [activeSurface, setActiveSurface] = (0, import_react24.useState)("graph");
+  const [jsonStatus, setJsonStatus] = (0, import_react24.useState)({ status: "idle" });
+  const [openIssueSeverity, setOpenIssueSeverity] = (0, import_react24.useState)(null);
+  const [inspectorOpen, setInspectorOpen] = (0, import_react24.useState)(false);
+  const [pendingVersionSwitch, setPendingVersionSwitch] = (0, import_react24.useState)(null);
+  const selectionRef = (0, import_react24.useRef)(state.selection);
+  const documentStateRef = (0, import_react24.useRef)(state.document);
+  const activeWorkflowRef = (0, import_react24.useRef)(state.activeWorkflow);
+  const pendingSelectionRestoreRef = (0, import_react24.useRef)(null);
+  const newStatePositionRef = (0, import_react24.useRef)(null);
+  (0, import_react24.useEffect)(() => {
     selectionRef.current = state.selection;
   }, [state.selection]);
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     documentStateRef.current = state.document;
     activeWorkflowRef.current = state.activeWorkflow;
   }, [state.document, state.activeWorkflow]);
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     onChange?.(state.document);
   }, [state.document, onChange]);
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     try {
       const toStore = {};
       for (const [wfName, ui] of Object.entries(state.document.meta.workflowUi)) {
@@ -7150,12 +7417,12 @@ function WorkflowEditor({
     } catch {
     }
   }, [state.document.meta.workflowUi, localStorageKey, onWorkflowUiChange]);
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (!onLayoutMetadataChange || !state.activeWorkflow) return;
     const ui = state.document.meta.workflowUi[state.activeWorkflow];
     if (ui) onLayoutMetadataChange(ui);
   }, [state.document.meta.workflowUi, state.activeWorkflow, onLayoutMetadataChange]);
-  const handleInspectorResizeStart = (0, import_react23.useCallback)((e) => {
+  const handleInspectorResizeStart = (0, import_react24.useCallback)((e) => {
     e.preventDefault();
     const startX = e.clientX;
     const startWidth = inspectorWidth;
@@ -7170,15 +7437,15 @@ function WorkflowEditor({
     document.addEventListener("mousemove", onMove);
     document.addEventListener("mouseup", onUp);
   }, [inspectorWidth]);
-  const handleToggleFullscreen = (0, import_react23.useCallback)(() => {
+  const handleToggleFullscreen = (0, import_react24.useCallback)(() => {
     setIsFullscreen((v) => !v);
   }, []);
   const readOnly = state.mode === "viewer";
-  const derived = (0, import_react23.useMemo)(
+  const derived = (0, import_react24.useMemo)(
     () => deriveFromDocument(state.document),
     [state.document]
   );
-  const dispatch = (0, import_react23.useCallback)(
+  const dispatch = (0, import_react24.useCallback)(
     (patch) => {
       if (patch.op === "setCriterion" && patch.host.kind === "transition") {
         const restoreSelection = {
@@ -7195,13 +7462,13 @@ function WorkflowEditor({
         actions.dispatchTransaction({
           summary: patch.criterion ? "Set criterion" : "Clear criterion",
           patches: [patch],
-          inverses: [(0, import_workflow_core10.invertPatch)(state.document, patch)],
+          inverses: [(0, import_workflow_core11.invertPatch)(state.document, patch)],
           selectionAfter: restoreSelection
         });
         return;
       }
       if (patch.op === "renameState" && selectionRef.current?.kind === "state" && selectionRef.current.stateCode === patch.from && selectionRef.current.workflow === patch.workflow) {
-        const nextDoc = (0, import_workflow_core10.applyPatch)(state.document, patch);
+        const nextDoc = (0, import_workflow_core11.applyPatch)(state.document, patch);
         const newNodeId = Object.entries(nextDoc.meta.ids.states).find(([, ptr]) => ptr.workflow === patch.workflow && ptr.state === patch.to)?.[0] ?? "";
         actions.dispatchTransaction({
           summary: `Rename state "${patch.from}" \u2192 "${patch.to}"`,
@@ -7212,7 +7479,7 @@ function WorkflowEditor({
         return;
       }
       if (patch.op === "moveTransitionSource") {
-        const nextDoc = (0, import_workflow_core10.applyPatch)(state.document, patch);
+        const nextDoc = (0, import_workflow_core11.applyPatch)(state.document, patch);
         const newUuid = transitionUuidByName(nextDoc, patch.workflow, patch.toState, patch.transitionName);
         actions.dispatchTransaction({
           summary: `Move transition "${patch.transitionName}" to "${patch.toState}"`,
@@ -7226,7 +7493,7 @@ function WorkflowEditor({
     },
     [actions, state.document]
   );
-  const handleJsonStatusChange = (0, import_react23.useCallback)(
+  const handleJsonStatusChange = (0, import_react24.useCallback)(
     (status) => {
       setJsonStatus(status);
       onJsonStatusChange?.(status);
@@ -7238,7 +7505,7 @@ function WorkflowEditor({
   const inspectorVisible = chrome?.inspector !== false && inspectorOpen && (!enableJsonEditor || jsonEditorPlacement !== "tab" || activeSurface === "graph");
   const saveBlockedByJson = jsonStatus.status === "invalid-json" || jsonStatus.status === "invalid-schema";
   const saveDisabled = readOnly || derived.errorCount > 0 || saveBlockedByJson;
-  const handleNodeDragStop = (0, import_react23.useCallback)(
+  const handleNodeDragStop = (0, import_react24.useCallback)(
     (nodeId, _x, _y, allPositions) => {
       const ids = state.document.meta.ids.states;
       const patches = [];
@@ -7259,12 +7526,12 @@ function WorkflowEditor({
           }
         }
       }
-      const inverses = patches.map((p) => (0, import_workflow_core10.invertPatch)(state.document, p));
+      const inverses = patches.map((p) => (0, import_workflow_core11.invertPatch)(state.document, p));
       actions.dispatchTransaction({ patches, inverses, summary: "Move state" });
     },
     [state.document, derived.graph, actions]
   );
-  const handleAutoLayout = (0, import_react23.useCallback)(() => {
+  const handleAutoLayout = (0, import_react24.useCallback)(() => {
     const workflow = state.activeWorkflow;
     if (!workflow) return;
     const workflowUi = { ...state.document.meta.workflowUi };
@@ -7279,11 +7546,11 @@ function WorkflowEditor({
     );
     setLayoutKey((k) => k + 1);
   }, [state.activeWorkflow, state.document, actions]);
-  const openAddStateModal = (0, import_react23.useCallback)((position) => {
+  const openAddStateModal = (0, import_react24.useCallback)((position) => {
     const resolved = position ?? newStatePositionRef.current?.() ?? void 0;
     setPendingAddState(resolved ? { position: resolved } : {});
   }, []);
-  const pinnedNodes = (0, import_react23.useMemo)(() => {
+  const pinnedNodes = (0, import_react24.useMemo)(() => {
     const workflow = state.activeWorkflow;
     if (!workflow) return void 0;
     const layoutNodes = externalLayoutMeta?.layout?.nodes ?? state.document.meta.workflowUi[workflow]?.layout?.nodes;
@@ -7303,12 +7570,12 @@ function WorkflowEditor({
     state.document.meta.workflowUi,
     externalLayoutMeta
   ]);
-  const transitionPositions = (0, import_react23.useMemo)(() => {
+  const transitionPositions = (0, import_react24.useMemo)(() => {
     const workflow = state.activeWorkflow;
     if (!workflow) return void 0;
     return state.document.meta.workflowUi[workflow]?.transitionPositions;
   }, [state.activeWorkflow, state.document.meta.workflowUi]);
-  const handleTransitionLabelDragEnd = (0, import_react23.useCallback)(
+  const handleTransitionLabelDragEnd = (0, import_react24.useCallback)(
     (edgeId, x, y) => {
       actions.dispatchTransaction({
         summary: "Move transition label",
@@ -7318,17 +7585,17 @@ function WorkflowEditor({
     },
     [actions]
   );
-  const handleVersionChange = (0, import_react23.useCallback)(
+  const handleVersionChange = (0, import_react24.useCallback)(
     (targetVersion) => {
-      const wireJson = (0, import_workflow_core10.serializeImportPayload)(state.document);
-      const result = (0, import_workflow_core10.parseImportPayload)(wireJson, state.document.meta, { sourceVersion: targetVersion });
+      const wireJson = (0, import_workflow_core11.serializeImportPayload)(state.document);
+      const result = (0, import_workflow_core11.parseImportPayload)(wireJson, state.document.meta, { sourceVersion: targetVersion });
       if (!result.ok || !result.document) return;
       const docWithVersion = {
         ...result.document,
         meta: { ...result.document.meta, cyodaVersion: targetVersion }
       };
       const beforeJson = wireJson;
-      const afterJson = (0, import_workflow_core10.serializeImportPayload)(docWithVersion);
+      const afterJson = (0, import_workflow_core11.serializeImportPayload)(docWithVersion);
       const parseWarnings = result.warnings ?? [];
       const isLossy = beforeJson !== afterJson || parseWarnings.length > 0;
       const warnings = parseWarnings.length > 0 ? parseWarnings : isLossy ? ["Some fields supported in the current version are not present in the target version and will be removed."] : [];
@@ -7356,7 +7623,7 @@ function WorkflowEditor({
     const resolved = resolveConnection(state.document, connection);
     if (resolved) setPendingConnect(resolved);
   };
-  const handleReconnect = (0, import_react23.useCallback)(
+  const handleReconnect = (0, import_react24.useCallback)(
     (edge, connection) => {
       setReconnectError(null);
       const tx = buildReconnectTransaction(state.document, edge, connection);
@@ -7367,7 +7634,7 @@ function WorkflowEditor({
       try {
         actions.dispatchTransaction(tx.transaction);
       } catch (error) {
-        if (error instanceof import_workflow_core10.PatchConflictError) {
+        if (error instanceof import_workflow_core11.PatchConflictError) {
           setReconnectError(error.message);
           return;
         }
@@ -7376,7 +7643,7 @@ function WorkflowEditor({
     },
     [actions, state.document]
   );
-  const confirmConnect = (0, import_react23.useCallback)(
+  const confirmConnect = (0, import_react24.useCallback)(
     (name) => {
       if (!pendingConnect) return;
       const addPatch = {
@@ -7386,7 +7653,7 @@ function WorkflowEditor({
         transition: { name, next: pendingConnect.toState, manual: false, disabled: false }
       };
       const priorUUIDs = new Set(Object.keys(state.document.meta.ids.transitions));
-      const afterApply = (0, import_workflow_core10.applyPatch)(state.document, addPatch);
+      const afterApply = (0, import_workflow_core11.applyPatch)(state.document, addPatch);
       const newUUID = Object.keys(afterApply.meta.ids.transitions).find(
         (u) => !priorUUIDs.has(u)
       );
@@ -7402,7 +7669,7 @@ function WorkflowEditor({
   );
   const workflows = state.document.session.workflows;
   const showTabs = workflows.length > 1 || state.mode !== "viewer";
-  const handleSelectionChange = (0, import_react23.useCallback)(
+  const handleSelectionChange = (0, import_react24.useCallback)(
     (selection) => {
       const pendingRestore = pendingSelectionRestoreRef.current;
       if (!selection && pendingRestore) {
@@ -7420,7 +7687,7 @@ function WorkflowEditor({
     },
     [actions]
   );
-  const confirmAddState = (0, import_react23.useCallback)(
+  const confirmAddState = (0, import_react24.useCallback)(
     (name) => {
       const workflow = state.activeWorkflow;
       const requestedPosition = pendingAddState?.position;
@@ -7448,7 +7715,7 @@ function WorkflowEditor({
     [pendingAddState, state.activeWorkflow, actions]
   );
   const anyModalOpen = pendingDelete !== null || pendingConnect !== null || pendingAddState !== null || helpOpen;
-  const handleKeyDown = (0, import_react23.useCallback)(
+  const handleKeyDown = (0, import_react24.useCallback)(
     (e) => {
       if (anyModalOpen) return;
       if (isTypingTarget(e.target)) return;
@@ -7508,7 +7775,7 @@ function WorkflowEditor({
       inspectorOpen
     ]
   );
-  const handleDeleteKeyDownCapture = (0, import_react23.useCallback)(
+  const handleDeleteKeyDownCapture = (0, import_react24.useCallback)(
     (e) => {
       if (anyModalOpen || readOnly || isTypingTarget(e.target)) return;
       if (e.ctrlKey || e.metaKey || e.altKey) return;
@@ -7528,7 +7795,7 @@ function WorkflowEditor({
     },
     [anyModalOpen, readOnly, state.selection]
   );
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     const handleDocumentDeleteKeyDown = (event) => {
       if (anyModalOpen || readOnly || isTypingTarget(event.target)) return;
       if (event.ctrlKey || event.metaKey || event.altKey) return;
@@ -7551,7 +7818,7 @@ function WorkflowEditor({
       document.removeEventListener("keydown", handleDocumentDeleteKeyDown, true);
     };
   }, [anyModalOpen, readOnly, dispatch]);
-  const pendingConnectState = (0, import_react23.useMemo)(() => {
+  const pendingConnectState = (0, import_react24.useMemo)(() => {
     if (!pendingConnect) return null;
     const wf = state.document.session.workflows.find(
       (w) => w.name === pendingConnect.workflow
@@ -7560,17 +7827,17 @@ function WorkflowEditor({
     return wf.states[pendingConnect.fromState] ?? null;
   }, [pendingConnect, state.document]);
   const orientation = layoutOptions?.orientation ?? "vertical";
-  const effectiveLayoutOptions = (0, import_react23.useMemo)(
+  const effectiveLayoutOptions = (0, import_react24.useMemo)(
     () => ({ ...layoutOptions, pinned: pinnedNodes }),
     [layoutOptions, pinnedNodes]
   );
   const savedViewport = state.activeWorkflow ? state.document.meta.workflowUi[state.activeWorkflow]?.viewports?.[orientation] : void 0;
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (enableJsonEditor) return;
     setJsonStatus({ status: "idle" });
     onJsonStatusChange?.({ status: "idle" });
   }, [enableJsonEditor, onJsonStatusChange]);
-  const handleViewportChange = (0, import_react23.useCallback)(
+  const handleViewportChange = (0, import_react24.useCallback)(
     (viewport) => {
       const workflow = state.activeWorkflow;
       if (!workflow) return;
@@ -7600,17 +7867,17 @@ function WorkflowEditor({
     },
     [actions, orientation, state.activeWorkflow, state.document]
   );
-  const handlePaneDoubleClick = (0, import_react23.useCallback)((x, y) => {
+  const handlePaneDoubleClick = (0, import_react24.useCallback)((x, y) => {
     if (readOnly || anyModalOpen) return;
     openAddStateModal({ x, y });
   }, [anyModalOpen, openAddStateModal, readOnly]);
-  const graphPane = /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+  const graphPane = /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
       "data-testid": "workflow-editor-graph-pane",
       style: { flex: 1, minWidth: 0, minHeight: 0, height: "100%", position: "relative" },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           Canvas,
           {
             graph: derived.graph,
@@ -7655,7 +7922,7 @@ function WorkflowEditor({
             helpLabel: mergedMessages.toolbar.help
           }
         ),
-        reconnectError && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        reconnectError && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           "div",
           {
             role: "alert",
@@ -7680,7 +7947,7 @@ function WorkflowEditor({
         state.activeWorkflow && (() => {
           const comments = state.document.meta.workflowUi[state.activeWorkflow]?.comments;
           if (!comments) return null;
-          return Object.values(comments).map((c) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          return Object.values(comments).map((c) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             CommentNode,
             {
               comment: c,
@@ -7703,12 +7970,12 @@ function WorkflowEditor({
       ]
     }
   );
-  const jsonPane = enableJsonEditor ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  const jsonPane = enableJsonEditor ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "div",
     {
       "data-testid": "workflow-editor-json-pane",
       style: { flex: 1, minWidth: 0, minHeight: 0, height: "100%" },
-      children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         WorkflowJsonEditor,
         {
           document: state.document,
@@ -7724,7 +7991,7 @@ function WorkflowEditor({
       )
     }
   ) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CriterionMonacoProvider, { value: jsonEditor?.monaco ?? null, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(I18nContext.Provider, { value: mergedMessages, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(EditorConfigContext.Provider, { value: editorConfig, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(CriterionMonacoProvider, { value: jsonEditor?.monaco ?? null, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(I18nContext.Provider, { value: mergedMessages, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(EditorConfigContext.Provider, { value: editorConfig, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
       ref: editorContainerRef,
@@ -7745,7 +8012,7 @@ function WorkflowEditor({
       onKeyDown: handleKeyDown,
       tabIndex: -1,
       children: [
-        chrome?.tabs !== false && showTabs && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        chrome?.tabs !== false && showTabs && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           WorkflowTabs,
           {
             workflows,
@@ -7767,14 +8034,14 @@ function WorkflowEditor({
               });
               actions.setActiveWorkflow(to);
             },
-            dialectVersion: `v${state.document.meta.cyodaVersion ?? import_workflow_core10.LATEST_CYODA_VERSION}`,
-            supportedVersions: import_workflow_core10.SUPPORTED_CYODA_VERSIONS,
+            dialectVersion: `v${state.document.meta.cyodaVersion ?? import_workflow_core11.LATEST_CYODA_VERSION}`,
+            supportedVersions: import_workflow_core11.SUPPORTED_CYODA_VERSIONS,
             onVersionChange: handleVersionChange
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { style: { flex: 1, display: "flex", minHeight: 0 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { style: { flex: 1, minWidth: 0, minHeight: 0, display: "flex", flexDirection: "column" }, children: [
-            (enableJsonEditor && jsonEditorPlacement === "tab" || !readOnly && graphVisible) && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { style: { flex: 1, display: "flex", minHeight: 0 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { style: { flex: 1, minWidth: 0, minHeight: 0, display: "flex", flexDirection: "column" }, children: [
+            (enableJsonEditor && jsonEditorPlacement === "tab" || !readOnly && graphVisible) && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
               "div",
               {
                 style: {
@@ -7788,8 +8055,8 @@ function WorkflowEditor({
                 },
                 "data-testid": "workflow-editor-surface-tabs",
                 children: [
-                  enableJsonEditor && jsonEditorPlacement === "tab" && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                  enableJsonEditor && jsonEditorPlacement === "tab" && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
                       SurfaceTab,
                       {
                         active: activeSurface === "graph",
@@ -7797,7 +8064,7 @@ function WorkflowEditor({
                         children: mergedMessages.editorView.graph
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
                       SurfaceTab,
                       {
                         active: activeSurface === "json",
@@ -7806,8 +8073,8 @@ function WorkflowEditor({
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { flex: 1 } }),
-                  !readOnly && activeSurface === "graph" && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+                  /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { style: { flex: 1 } }),
+                  !readOnly && activeSurface === "graph" && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
                     "button",
                     {
                       type: "button",
@@ -7828,7 +8095,7 @@ function WorkflowEditor({
                         cursor: "pointer"
                       },
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { width: "11", height: "11", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { d: "M12 5v14M5 12h14" }) }),
+                        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("svg", { width: "11", height: "11", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("path", { d: "M12 5v14M5 12h14" }) }),
                         mergedMessages.toolbar.addStateButton
                       ]
                     }
@@ -7836,7 +8103,7 @@ function WorkflowEditor({
                 ]
               }
             ),
-            enableJsonEditor && jsonEditorPlacement === "split" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+            enableJsonEditor && jsonEditorPlacement === "split" ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
               "div",
               {
                 style: {
@@ -7849,10 +8116,10 @@ function WorkflowEditor({
                 "data-testid": "workflow-editor-split-view",
                 children: [
                   graphPane,
-                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { borderLeft: "1px solid #E2E8F0", minWidth: 0 }, children: jsonPane })
+                  /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { style: { borderLeft: "1px solid #E2E8F0", minWidth: 0 }, children: jsonPane })
                 ]
               }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+            ) : /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
               "div",
               {
                 style: {
@@ -7864,8 +8131,8 @@ function WorkflowEditor({
                   flexDirection: "column"
                 },
                 children: [
-                  graphVisible ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { flex: 1, minHeight: 0, minWidth: 0 }, children: graphPane }) : null,
-                  enableJsonEditor ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                  graphVisible ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { style: { flex: 1, minHeight: 0, minWidth: 0 }, children: graphPane }) : null,
+                  enableJsonEditor ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
                     "div",
                     {
                       style: {
@@ -7882,8 +8149,8 @@ function WorkflowEditor({
               }
             )
           ] }),
-          inspectorVisible && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          inspectorVisible && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
               "div",
               {
                 onMouseDown: handleInspectorResizeStart,
@@ -7900,7 +8167,7 @@ function WorkflowEditor({
                 onMouseLeave: (e) => e.currentTarget.style.background = "transparent"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
               Inspector,
               {
                 document: state.document,
@@ -7916,7 +8183,7 @@ function WorkflowEditor({
             )
           ] })
         ] }),
-        pendingAddState !== null && state.activeWorkflow && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        pendingAddState !== null && state.activeWorkflow && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           AddStateModal,
           {
             existingNames: Object.keys(
@@ -7928,7 +8195,7 @@ function WorkflowEditor({
             onCancel: () => setPendingAddState(null)
           }
         ),
-        pendingDelete && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        pendingDelete && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           DeleteStateModal,
           {
             document: state.document,
@@ -7938,7 +8205,7 @@ function WorkflowEditor({
             onCancel: () => setPendingDelete(null)
           }
         ),
-        pendingConnect && pendingConnectState && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        pendingConnect && pendingConnectState && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           DragConnectModal,
           {
             source: pendingConnectState,
@@ -7948,11 +8215,11 @@ function WorkflowEditor({
             onCancel: () => setPendingConnect(null)
           }
         ),
-        helpOpen && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(HelpModal, { onCancel: () => setHelpOpen(false) }),
-        pendingVersionSwitch && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        helpOpen && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(HelpModal, { onCancel: () => setHelpOpen(false) }),
+        pendingVersionSwitch && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           VersionSwitchModal,
           {
-            fromVersion: `v${state.document.meta.cyodaVersion ?? import_workflow_core10.LATEST_CYODA_VERSION}`,
+            fromVersion: `v${state.document.meta.cyodaVersion ?? import_workflow_core11.LATEST_CYODA_VERSION}`,
             toVersion: `v${pendingVersionSwitch.targetVersion}`,
             warnings: pendingVersionSwitch.warnings,
             onConfirm: () => {
@@ -7962,8 +8229,8 @@ function WorkflowEditor({
             onCancel: () => setPendingVersionSwitch(null)
           }
         ),
-        chrome?.toolbar !== false && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { style: { position: "relative" }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        chrome?.toolbar !== false && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             Toolbar,
             {
               derived,
@@ -7978,7 +8245,7 @@ function WorkflowEditor({
               toolbarEnd
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             IssuesDrawer,
             {
               open: openIssueSeverity !== null,
@@ -8061,7 +8328,7 @@ function buildReconnectTransaction(doc, edge, connection) {
     toState,
     transitionName: transition.name
   };
-  const afterMove = (0, import_workflow_core10.applyPatch)(doc, movePatch);
+  const afterMove = (0, import_workflow_core11.applyPatch)(doc, movePatch);
   const movedUuid = transitionUuidByName(afterMove, ptr.workflow, toState, transition.name);
   if (!movedUuid) return { ok: false };
   const patches = [movePatch];
@@ -8174,7 +8441,7 @@ function SurfaceTab({
   onClick,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "button",
     {
       type: "button",
@@ -8229,16 +8496,16 @@ function snapToGrid(value, grid = 16) {
 }
 
 // src/save/useSaveFlow.ts
-var import_react24 = require("react");
-var import_workflow_core11 = require("@cyoda/workflow-core");
+var import_react25 = require("react");
+var import_workflow_core12 = require("@cyoda/workflow-core");
 function useSaveFlow(args) {
   const { api, document: doc, concurrencyToken, onSaved, onReload } = args;
-  const [status, setStatus] = (0, import_react24.useState)({ kind: "idle" });
-  const tokenRef = (0, import_react24.useRef)(concurrencyToken);
+  const [status, setStatus] = (0, import_react25.useState)({ kind: "idle" });
+  const tokenRef = (0, import_react25.useRef)(concurrencyToken);
   tokenRef.current = concurrencyToken;
-  const entityRef = (0, import_react24.useRef)(doc.session.entity);
+  const entityRef = (0, import_react25.useRef)(doc.session.entity);
   entityRef.current = doc.session.entity;
-  const payloadRef = (0, import_react24.useRef)({
+  const payloadRef = (0, import_react25.useRef)({
     importMode: doc.session.importMode,
     workflows: doc.session.workflows
   });
@@ -8246,8 +8513,8 @@ function useSaveFlow(args) {
     importMode: doc.session.importMode,
     workflows: doc.session.workflows
   };
-  const savingRef = (0, import_react24.useRef)(false);
-  const performImport = (0, import_react24.useCallback)(
+  const savingRef = (0, import_react25.useRef)(false);
+  const performImport = (0, import_react25.useCallback)(
     async (token) => {
       if (savingRef.current) return;
       const entity = entityRef.current;
@@ -8267,7 +8534,7 @@ function useSaveFlow(args) {
         onSaved(result.concurrencyToken);
         setStatus({ kind: "success", at: Date.now() });
       } catch (err) {
-        if (err instanceof import_workflow_core11.WorkflowApiConflictError) {
+        if (err instanceof import_workflow_core12.WorkflowApiConflictError) {
           setStatus({
             kind: "conflict",
             serverConcurrencyToken: err.serverConcurrencyToken
@@ -8284,28 +8551,28 @@ function useSaveFlow(args) {
     },
     [api, onSaved]
   );
-  const requestSave = (0, import_react24.useCallback)(() => {
+  const requestSave = (0, import_react25.useCallback)(() => {
     const mode = payloadRef.current.importMode;
     const requiresExplicitConfirm = mode === "REPLACE" || mode === "ACTIVATE";
     setStatus({ kind: "confirming", mode, requiresExplicitConfirm });
   }, []);
-  const confirmSave = (0, import_react24.useCallback)(
+  const confirmSave = (0, import_react25.useCallback)(
     () => performImport(tokenRef.current),
     [performImport]
   );
-  const cancel = (0, import_react24.useCallback)(() => setStatus({ kind: "idle" }), []);
-  const forceOverwrite = (0, import_react24.useCallback)(() => performImport(null), [performImport]);
-  const reload = (0, import_react24.useCallback)(() => {
+  const cancel = (0, import_react25.useCallback)(() => setStatus({ kind: "idle" }), []);
+  const forceOverwrite = (0, import_react25.useCallback)(() => performImport(null), [performImport]);
+  const reload = (0, import_react25.useCallback)(() => {
     onReload?.();
     setStatus({ kind: "idle" });
   }, [onReload]);
-  const clear = (0, import_react24.useCallback)(() => setStatus({ kind: "idle" }), []);
+  const clear = (0, import_react25.useCallback)(() => setStatus({ kind: "idle" }), []);
   return { status, requestSave, confirmSave, cancel, forceOverwrite, reload, clear };
 }
 
 // src/save/SaveConfirmModal.tsx
-var import_react25 = require("react");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_react26 = require("react");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 function SaveConfirmModal({
   mode,
   requiresExplicitConfirm,
@@ -8315,17 +8582,17 @@ function SaveConfirmModal({
   onCancel
 }) {
   const messages = useMessages();
-  const [ackMode, setAckMode] = (0, import_react25.useState)(!requiresExplicitConfirm);
-  const [ackWarnings, setAckWarnings] = (0, import_react25.useState)(warningCount === 0);
+  const [ackMode, setAckMode] = (0, import_react26.useState)(!requiresExplicitConfirm);
+  const [ackWarnings, setAckWarnings] = (0, import_react26.useState)(warningCount === 0);
   const blocked = !ackMode || !ackWarnings;
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(ModalFrame, { onCancel, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("h2", { style: { margin: 0, fontSize: 16 }, children: messages.saveConfirm.title }),
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("p", { style: { margin: "12px 0", fontSize: 13, color: colors.textSecondary }, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(ModalFrame, { onCancel, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("h2", { style: { margin: 0, fontSize: 16 }, children: messages.saveConfirm.title }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("p", { style: { margin: "12px 0", fontSize: 13, color: colors.textSecondary }, children: [
       messages.saveConfirm.modeLabel,
       ": ",
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("strong", { children: mode })
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("strong", { children: mode })
     ] }),
-    diffSummary2 && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    diffSummary2 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       "pre",
       {
         style: {
@@ -8344,8 +8611,8 @@ function SaveConfirmModal({
         children: diffSummary2
       }
     ),
-    requiresExplicitConfirm && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("label", { style: checkRow, "data-testid": "save-ack-mode", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    requiresExplicitConfirm && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("label", { style: checkRow, "data-testid": "save-ack-mode", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         "input",
         {
           type: "checkbox",
@@ -8353,10 +8620,10 @@ function SaveConfirmModal({
           onChange: (e) => setAckMode(e.target.checked)
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { children: mode === "REPLACE" ? messages.saveConfirm.ackReplace : messages.saveConfirm.ackActivate })
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { children: mode === "REPLACE" ? messages.saveConfirm.ackReplace : messages.saveConfirm.ackActivate })
     ] }),
-    warningCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("label", { style: checkRow, "data-testid": "save-ack-warnings", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    warningCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("label", { style: checkRow, "data-testid": "save-ack-warnings", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         "input",
         {
           type: "checkbox",
@@ -8364,17 +8631,17 @@ function SaveConfirmModal({
           onChange: (e) => setAckWarnings(e.target.checked)
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { children: messages.saveConfirm.ackWarnings.replace("{count}", String(warningCount)) })
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { children: messages.saveConfirm.ackWarnings.replace("{count}", String(warningCount)) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 16 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn8, "data-testid": "save-cancel", children: messages.saveConfirm.cancel }),
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8, marginTop: 16 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("button", { type: "button", onClick: onCancel, style: ghostBtn9, "data-testid": "save-cancel", children: messages.saveConfirm.cancel }),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         "button",
         {
           type: "button",
           disabled: blocked,
           onClick: onConfirm,
-          style: primaryBtn5,
+          style: primaryBtn6,
           "data-testid": "save-confirm",
           children: messages.saveConfirm.confirm
         }
@@ -8390,7 +8657,7 @@ var checkRow = {
   color: colors.textPrimary,
   margin: "8px 0"
 };
-var ghostBtn8 = {
+var ghostBtn9 = {
   padding: "6px 12px",
   background: "white",
   border: `1px solid ${colors.border}`,
@@ -8398,18 +8665,18 @@ var ghostBtn8 = {
   fontSize: 13,
   cursor: "pointer"
 };
-var primaryBtn5 = {
-  ...ghostBtn8,
+var primaryBtn6 = {
+  ...ghostBtn9,
   background: colors.primary,
   color: "white",
   borderColor: colors.primary
 };
 
 // src/save/ConflictBanner.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function ConflictBanner({ onReload, onForceOverwrite }) {
   const messages = useMessages();
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
     "div",
     {
       style: {
@@ -8425,8 +8692,8 @@ function ConflictBanner({ onReload, onForceOverwrite }) {
       role: "alert",
       "data-testid": "conflict-banner",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { style: { flex: 1 }, children: messages.conflict.message }),
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { style: { flex: 1 }, children: messages.conflict.message }),
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "button",
           {
             type: "button",
@@ -8436,7 +8703,7 @@ function ConflictBanner({ onReload, onForceOverwrite }) {
             children: messages.conflict.reload
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "button",
           {
             type: "button",