@revenexx/studio-integrations 1.1.1 → 1.3.0

package/dist/runtime/components/Integrations/NodeConfigField.vue

@@ -26,10 +26,11 @@ const props = defineProps({
   siblingFields: { type: Array, required: false },
   depth: { type: Number, required: false },
   variables: { type: Object, required: false },
+  stateNamespaces: { type: Array, required: false },
   upstreamOutputs: { type: Array, required: false },
   refused: { type: String, required: false }
 });
-const emit = defineEmits(["set"]);
+const emit = defineEmits(["set", "declare-state"]);
 const t = useIntegrationsT();
 const value = computed(() => props.config[props.field.key]);
 function write(v) {
@@ -127,6 +128,30 @@ function onCredentialSelect(v) {
   }
   write(v);
 }
+const stateOptions = computed(() => {
+  const role = props.field.stateRole;
+  const declared = props.stateNamespaces ?? [];
+  const list = role ? declared.filter((n) => n.role === role) : declared;
+  const selected = value.value;
+  if (typeof selected === "string" && selected && !list.some((n) => n.namespace === selected)) {
+    return [{ namespace: selected, role: role ?? "mapping", visibility: void 0 }, ...list];
+  }
+  return list;
+});
+const stateTakenNames = computed(() => (props.stateNamespaces ?? []).map((n) => n.namespace));
+const stateCreateOpen = ref(false);
+const STATE_ACTION_NEW = "__action_new_state_namespace__";
+function onStateSelect(v) {
+  if (v === STATE_ACTION_NEW) {
+    stateCreateOpen.value = true;
+    return;
+  }
+  write(v);
+}
+function onStateDeclared(namespace, role, visibility) {
+  emit("declare-state", namespace, role, visibility);
+  write(namespace);
+}
 function acceptsSftp(field) {
   const t2 = field.credentialType;
   return t2 === "revenexx:sftp" || Array.isArray(t2) && t2.includes("revenexx:sftp");
@@ -195,6 +220,9 @@ function removeKvRow(idx) {
   kvRows.value = kvRows.value.filter((_, i) => i !== idx);
   commitKvRows();
 }
+const isMultiline = computed(
+  () => Boolean(props.field.multiline) && (props.field.type === "string" || props.field.type === "expression")
+);
 const isQueryField = computed(
   () => props.field.type === "array" && props.field.items?.type !== "object" && /(^|__)queries$/.test(props.field.key)
 );
@@ -383,6 +411,7 @@ function setArrayItemField(index, fieldKey, v) {
       :upstream-outputs="upstreamOutputs"
       :invalid="invalid"
       :label="resolveLocalized(field.label)"
+      :multiline="isMultiline"
       @update:model-value="(v) => write(v)"
     />
 
@@ -409,6 +438,25 @@ function setArrayItemField(index, fieldKey, v) {
       :upstream-outputs="upstreamOutputs"
       :invalid="invalid"
       :label="resolveLocalized(field.label)"
+      :multiline="isMultiline"
+      @update:model-value="(v) => write(v)"
+    />
+
+    <!-- plain string the node says takes several lines. Same accessible name as
+         the one-line box below, because it is the same setting. Opens at four
+         rows, grows with what is typed and scrolls past ten — the same rule the
+         expression editor follows, so the two controls for one kind of setting
+         do not behave differently. The two heights are lines × 1.25rem plus the
+         1rem of vertical padding; `rows` alone would not set them, because the
+         shared control sizes itself to its content and ignores it. -->
+    <Textarea
+      v-else-if="field.type === 'string' && isMultiline"
+      :aria-label="resolveLocalized(field.label)"
+      :model-value="value ?? ''"
+      :placeholder="resolveLocalized(field.placeholder)"
+      :rows="4"
+      class="min-h-24 max-h-[13.5rem] resize-none rounded-md border border-black/[0.08] ring-0 shadow-none text-sm bg-white"
+      :class="invalid ? 'border-rose-400 focus-visible:ring-rose-400/40' : ''"
       @update:model-value="(v) => write(v)"
     />
 
@@ -596,6 +644,45 @@ function setArrayItemField(index, fieldKey, v) {
       />
     </template>
 
+    <!-- state-ref — pick one of the workflow's declared namespaces of this
+         field's role. Declaring lives INSIDE the picker, like creating a
+         credential does: a picker whose list is empty must not be a dead end
+         that sends the author to another dialog and back. -->
+    <template v-else-if="field.type === 'state-ref'">
+      <Select
+        :model-value="value ?? ''"
+        @update:model-value="(v) => onStateSelect(v)"
+      >
+        <SelectTrigger :aria-label="resolveLocalized(field.label)" size="sm" class="h-8 w-full rounded-md border border-black/[0.08] ring-0 shadow-none text-sm bg-white">
+          <SelectValue :placeholder="t('integration.nodeConfig.state.placeholder')" />
+        </SelectTrigger>
+        <SelectContent>
+          <SelectItem v-for="o in stateOptions" :key="o.namespace" :value="o.namespace">
+            <span class="flex items-center gap-1.5">
+              <span class="min-w-0 truncate font-mono">{{ o.namespace }}</span>
+              <span
+                v-if="o.visibility === 'shared'"
+                class="shrink-0 rounded-full border px-1.5 py-px text-[10px] font-medium text-muted-foreground"
+              >{{ t("integration.workflows.state.visibility.shared.label") }}</span>
+            </span>
+          </SelectItem>
+          <div v-if="!stateOptions.length" class="px-2 py-1.5 text-sm text-muted-foreground">
+            {{ t("integration.nodeConfig.state.empty") }}
+          </div>
+          <SelectSeparator />
+          <SelectItem :value="STATE_ACTION_NEW" class="font-medium text-violet-600 data-[highlighted]:text-violet-700">
+            {{ t("integration.nodeConfig.state.action.new") }}
+          </SelectItem>
+        </SelectContent>
+      </Select>
+      <IntegrationsStateNamespaceCreateDialog
+        v-model:open="stateCreateOpen"
+        :role="field.stateRole ?? 'mapping'"
+        :taken="stateTakenNames"
+        @declared="onStateDeclared"
+      />
+    </template>
+
     <!-- array of objects (e.g. headers / mappings) -->
     <div v-else-if="field.type === 'array' && field.items?.type === 'object'" class="space-y-2">
       <div

package/dist/runtime/components/Integrations/NodeConfigField.vue.d.ts

@@ -1,4 +1,4 @@
-import type { ConfigField, WorkflowVariable } from '../../types/integrations.js';
+import type { ConfigField, WorkflowStateNamespace, WorkflowStateRole, WorkflowStateVisibility, WorkflowVariable } from '../../types/integrations.js';
 type __VLS_Props = {
     field: ConfigField;
     config: Record<string, unknown>;
@@ -11,6 +11,8 @@ type __VLS_Props = {
     siblingFields?: ConfigField[];
     depth?: number;
     variables?: Record<string, WorkflowVariable>;
+    /** The workflow's declared state namespaces — the options a `state-ref` offers. */
+    stateNamespaces?: WorkflowStateNamespace[];
     upstreamOutputs?: Array<{
         nodeId: string;
         nodeName?: string;
@@ -22,7 +24,9 @@ type __VLS_Props = {
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     set: (key: string, value: unknown) => any;
+    "declare-state": (namespace: string, role: WorkflowStateRole, visibility: WorkflowStateVisibility) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onSet?: ((key: string, value: unknown) => any) | undefined;
+    "onDeclare-state"?: ((namespace: string, role: WorkflowStateRole, visibility: WorkflowStateVisibility) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/runtime/components/Integrations/NodeInspector.d.vue.ts

@@ -1,9 +1,11 @@
-import type { NodeManifestOutput, WorkflowEdge, WorkflowNode, WorkflowTrigger, WorkflowVariable } from '../../types/integrations.js';
+import type { NodeManifestOutput, WorkflowEdge, WorkflowNode, WorkflowStateNamespace, WorkflowStateRole, WorkflowStateVisibility, WorkflowTrigger, WorkflowVariable } from '../../types/integrations.js';
 type __VLS_Props = {
     /** Either a workflow node OR a trigger. Distinguished by presence of `nodeSlug`. */
     selection: WorkflowNode | WorkflowTrigger | null;
     secretKeys: string[];
     variables?: Record<string, WorkflowVariable>;
+    /** The workflow's declared state namespaces — options for `state-ref` fields. */
+    stateNamespaces?: WorkflowStateNamespace[];
     upstreamOutputs?: Array<{
         nodeId: string;
         nodeName?: string;
@@ -29,13 +31,15 @@ type __VLS_Props = {
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     update: (next: WorkflowTrigger | WorkflowNode) => any;
-    close: () => any;
     remove: () => any;
+    close: () => any;
+    "declare-state": (namespace: string, role: WorkflowStateRole, visibility: WorkflowStateVisibility) => any;
     navigate: (id: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onUpdate?: ((next: WorkflowTrigger | WorkflowNode) => any) | undefined;
-    onClose?: (() => any) | undefined;
     onRemove?: (() => any) | undefined;
+    onClose?: (() => any) | undefined;
+    "onDeclare-state"?: ((namespace: string, role: WorkflowStateRole, visibility: WorkflowStateVisibility) => any) | undefined;
     onNavigate?: ((id: string) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/runtime/components/Integrations/NodeInspector.vue

@@ -28,7 +28,8 @@ import {
   ToggleGroupItem
 } from "@revenexx/studio";
 import EventTypeCombobox from "./EventTypeCombobox.vue";
-import { findManifest, nodeCategoryLabel, isVersionExecutable, newestExecutableVersion } from "../../data/integrationNodeCatalog";
+import { findManifest, nodeCategoryLabel, isVersionExecutable, newestExecutableVersion, executableVersionsOf, newerExecutableVersions } from "../../data/integrationNodeCatalog";
+import NodeVersionMoveDialog from "./NodeVersionMoveDialog.vue";
 import {
   collectUpstreamNodes,
   inputPortsForManifest,
@@ -39,6 +40,9 @@ import {
 } from "../../data/nodeInputData";
 import { portDotClass } from "../../data/portTone";
 import { computeLoopBodies, manifestIterates } from "../../data/loopBody";
+import { applyingFields, staleKeys } from "../../utils/settingCondition";
+import { deepClone } from "../../utils/deepClone";
+import { copyToClipboard } from "../../utils/clipboard";
 import { nodeDisplayLabel } from "../../utils/validationFindings";
 import { authChoiceFromConfig, configPatchForAuthChoice } from "../../data/webhookAuth";
 import {
@@ -49,11 +53,13 @@ import {
 } from "../../data/nodeRunData";
 import { resolveDisplayName, resolveLocalized } from "../../utils/localize";
 import { describeRecurrence, parseCron, scheduleTimezone, toCron } from "../../utils/schedule";
+import { errorReason } from "../../utils/apiError";
 const t = useIntegrationsT();
 const props = defineProps({
   selection: { type: [Object, null], required: true },
   secretKeys: { type: Array, required: true },
   variables: { type: Object, required: false },
+  stateNamespaces: { type: Array, required: false },
   upstreamOutputs: { type: Array, required: false },
   autofocusName: { type: Boolean, required: false },
   nodes: { type: Array, required: false },
@@ -63,20 +69,35 @@ const props = defineProps({
   workflowId: { type: [Number, String], required: false },
   refusedFields: { type: Object, required: false }
 });
-const emit = defineEmits(["update", "close", "remove", "navigate"]);
-function clone(v) {
-  return JSON.parse(JSON.stringify(v));
-}
-const draft = ref(clone(props.selection));
+const emit = defineEmits(["update", "close", "remove", "navigate", "declare-state"]);
+const draft = ref(deepClone(props.selection));
 watch(() => props.selection?.id, () => {
-  if (props.selection && props.selection.id !== draft.value.id) draft.value = clone(props.selection);
+  if (props.selection && props.selection.id !== draft.value.id) {
+    draft.value = deepClone(props.selection);
+    pendingState.value = [];
+  }
 });
 const isNode = computed(() => "nodeSlug" in draft.value);
 const draftNode = computed(() => isNode.value ? draft.value : null);
 const draftTrigger = computed(() => isNode.value ? null : draft.value);
-const dirty = computed(() => JSON.stringify(draft.value) !== JSON.stringify(props.selection));
+const pendingState = ref([]);
+const offeredStateNamespaces = computed(() => [
+  ...props.stateNamespaces ?? [],
+  ...pendingState.value
+]);
+function stageStateNamespace(namespace, role, visibility) {
+  if (offeredStateNamespaces.value.some((n) => n.namespace === namespace)) return;
+  pendingState.value = [...pendingState.value, { namespace, role, visibility }];
+}
+const draftChanged = computed(() => JSON.stringify(draft.value) !== JSON.stringify(props.selection));
+const dirty = computed(() => draftChanged.value || pendingState.value.length > 0);
+function commit() {
+  for (const ns of pendingState.value) emit("declare-state", ns.namespace, ns.role, ns.visibility);
+  pendingState.value = [];
+  if (draftChanged.value) emit("update", deepClone(draft.value));
+}
 function save() {
-  if (dirty.value) emit("update", clone(draft.value));
+  commit();
   emit("close");
 }
 const nameInput = ref(null);
@@ -99,6 +120,21 @@ const readyVersion = computed(() => {
   const wn = draftNode.value;
   return wn ? newestExecutableVersion(wn.nodeSlug) : null;
 });
+const versionMoveOpen = ref(false);
+const newerVersions = computed(() => {
+  const wn = draftNode.value;
+  return wn ? newerExecutableVersions(wn.nodeSlug, wn.nodeVersion) : [];
+});
+const canMoveVersion = computed(() => {
+  const wn = draftNode.value;
+  if (!wn) return false;
+  const runnable = executableVersionsOf(wn.nodeSlug);
+  if (!runnable.length) return false;
+  return runnable.length > 1 || runnable[0]?.version !== wn.nodeVersion;
+});
+function applyVersionMove(payload) {
+  patchNode({ nodeVersion: payload.version, config: payload.config });
+}
 const TRIGGER_LABELS = computed(() => ({
   manual: t("integration.nodeInspector.trigger.type.manual"),
   schedule: t("integration.nodeInspector.trigger.type.schedule"),
@@ -150,8 +186,11 @@ watch(showSettingsTab, (hasThem) => {
   if (!hasThem) tab.value = "parameters";
 });
 const SETTINGS_FIELD_KEY = /(^|_)(timeout|retry|retries|backoff)|(timeout|retry|retries|backoff)(ms|sec|seconds|attempts)?$/i;
-const parameterFields = computed(() => (manifest.value?.config ?? []).filter((f) => !SETTINGS_FIELD_KEY.test(f.key)));
-const settingsFields = computed(() => (manifest.value?.config ?? []).filter((f) => SETTINGS_FIELD_KEY.test(f.key)));
+const applyingConfig = computed(
+  () => applyingFields(manifest.value?.config ?? [], draftNode.value?.config ?? {})
+);
+const parameterFields = computed(() => applyingConfig.value.filter((f) => !SETTINGS_FIELD_KEY.test(f.key)));
+const settingsFields = computed(() => applyingConfig.value.filter((f) => SETTINGS_FIELD_KEY.test(f.key)));
 const requiredFields = computed(() => parameterFields.value.filter((f) => f.required));
 const optionalFields = computed(() => parameterFields.value.filter((f) => !f.required));
 function optionalShouldOpen() {
@@ -162,27 +201,14 @@ const optionalOpen = ref(optionalShouldOpen());
 watch([() => props.selection?.id, manifest], () => {
   optionalOpen.value = optionalShouldOpen();
 });
-function dependentKeys(changedKey) {
-  const fields = manifest.value?.config ?? [];
-  const out = /* @__PURE__ */ new Set();
-  const queue = [changedKey];
-  while (queue.length > 0) {
-    const dep = queue.shift();
-    for (const f of fields) {
-      if ((f.dependsOn ?? []).includes(dep) && !out.has(f.key)) {
-        out.add(f.key);
-        queue.push(f.key);
-      }
-    }
-  }
-  out.delete(changedKey);
-  return out;
+function dependentKeys(changedKey, after) {
+  return staleKeys(manifest.value?.config ?? [], changedKey, after);
 }
 function writeConfig(key, value) {
   const wn = draftNode.value;
   if (!wn) return;
   const next = { ...wn.config, [key]: value };
-  const cleared = dependentKeys(key);
+  const cleared = dependentKeys(key, next);
   for (const k of cleared) delete next[k];
   const clearedDynamicSchema = [...cleared].some(
     (k) => (manifest.value?.config ?? []).some((f) => f.key === k && f.type === "dynamic-schema")
@@ -203,12 +229,10 @@ function patchTrigger(patch) {
 }
 async function copyConfig() {
   if (!draftNode.value) return;
-  try {
-    await navigator.clipboard.writeText(JSON.stringify(draftNode.value.config ?? {}, null, 2));
-    toast.success(t("integration.nodeInspector.toast.configCopied"));
-  } catch {
-    toast.error(t("integration.nodeInspector.toast.configCopyFailed"));
-  }
+  await copyToClipboard(JSON.stringify(draftNode.value.config ?? {}, null, 2), {
+    copied: t("integration.nodeInspector.toast.configCopied"),
+    failed: t("integration.nodeInspector.toast.configCopyFailed")
+  });
 }
 async function pasteConfig() {
   if (!draftNode.value) return;
@@ -440,28 +464,24 @@ async function rotateEndpointSecret() {
       toast.error(t("integration.nodeInspector.toast.rotateNoSecret"));
     }
   } catch (e) {
-    toast.error(e.message || t("integration.nodeInspector.toast.rotateFailed"));
+    toast.error(errorReason(e, t("integration.nodeInspector.toast.rotateFailed")));
   } finally {
     rotateBusy.value = false;
   }
 }
 async function copySecret() {
   if (!rotatedSecret.value) return;
-  try {
-    await navigator.clipboard.writeText(rotatedSecret.value);
-    toast.success(t("integration.nodeInspector.toast.secretCopied"));
-  } catch {
-    toast.error(t("integration.nodeInspector.toast.secretCopyFailed"));
-  }
+  await copyToClipboard(rotatedSecret.value, {
+    copied: t("integration.nodeInspector.toast.secretCopied"),
+    failed: t("integration.nodeInspector.toast.secretCopyFailed")
+  });
 }
 async function copyWebhookUrl() {
   if (!webhookUrl.value) return;
-  try {
-    await navigator.clipboard.writeText(webhookUrl.value);
-    toast.success(t("integration.nodeInspector.toast.webhookUrlCopied"));
-  } catch {
-    toast.error(t("integration.nodeInspector.toast.webhookUrlCopyFailed"));
-  }
+  await copyToClipboard(webhookUrl.value, {
+    copied: t("integration.nodeInspector.toast.webhookUrlCopied"),
+    failed: t("integration.nodeInspector.toast.webhookUrlCopyFailed")
+  });
 }
 const definedEvents = typeof useDefinedEvents === "function" ? useDefinedEvents() : { emits: ref([]), load: async () => {
 } };
@@ -526,7 +546,7 @@ async function loadRunData() {
     runData.value = map;
     runInfo.value = { id: source.id, startedAt: source.startedAt };
   } catch (e) {
-    runError.value = e?.message ?? t("integration.nodeInspector.input.runData.loadFailed");
+    runError.value = errorReason(e, t("integration.nodeInspector.input.runData.loadFailed"));
   } finally {
     runLoading.value = false;
   }
@@ -640,11 +660,10 @@ function insertExpression(expression) {
     el.focus();
     return;
   }
-  try {
-    void navigator.clipboard?.writeText(expression);
-  } catch {
-  }
-  toast(t("integration.nodeInspector.toast.expressionCopied"));
+  void copyToClipboard(expression, {
+    copied: t("integration.nodeInspector.toast.expressionCopied"),
+    failed: t("integration.nodeInspector.toast.expressionCopyFailed")
+  });
 }
 const chipClass = "max-w-full cursor-grab truncate rounded-md border border-black/[0.06] bg-slate-50 px-1.5 py-0.5 font-mono text-[11px] text-slate-700 transition hover:border-black/[0.12] hover:bg-slate-100 active:cursor-grabbing";
 const rowClass = "flex w-full min-w-0 cursor-grab items-center gap-1.5 rounded-md px-1.5 py-[3px] text-left font-mono text-[11px] text-slate-700 transition hover:bg-slate-100 active:cursor-grabbing";
@@ -767,7 +786,7 @@ const hasNext = computed(() => seqIndex.value >= 0 && seqIndex.value < sequence.
 function navigate(offset) {
   const target = sequence.value[seqIndex.value + offset];
   if (!target) return;
-  if (dirty.value) emit("update", clone(draft.value));
+  commit();
   emit("navigate", target);
 }
 const outputView = ref("schema");
@@ -873,7 +892,16 @@ async function runTestStep() {
   try {
     const res = await api.post(
       `/nodes/${encodeURIComponent(wn.nodeSlug)}/${encodeURIComponent(wn.nodeVersion)}/execute:test`,
-      { config: wn.config ?? {}, inputs }
+      {
+        config: wn.config ?? {},
+        inputs,
+        // Names the workflow being edited, which is what lets the test run READ
+        // the state namespaces this workflow declares (PO-374). Writes stay
+        // refused: a correlation created by a test click would be
+        // indistinguishable from one a real run made. Omitted for an unsaved
+        // workflow, which has nothing declared yet anyway.
+        ...props.workflowId ? { workflow_id: Number(props.workflowId) } : {}
+      }
     );
     testLogs.value = res.logs ?? [];
     testOutputs.value = {
@@ -966,6 +994,26 @@ async function runTestStep() {
             </PopoverContent>
           </Popover>
         </div>
+        <!-- The version, once it is something the author can change (PO-339).
+             Deliberately a line of its own and deliberately grey: where a newer
+             version merely exists, nothing is wrong, and a coloured mark for a
+             non-problem is what teaches people to stop reading marks. It is
+             absent altogether for a node with one runnable version — there is no
+             choice to offer — and for a node whose pinned version cannot run,
+             where the notice below the tabs carries the same route in the louder
+             tone that state has earned. -->
+        <div v-if="isNode && canMoveVersion && versionExecutable" class="flex items-center gap-1 text-xs text-muted-foreground">
+          <span v-if="newerVersions.length" class="tabular-nums">
+            {{ t("integration.nodeInspector.version.available", { version: newerVersions[0]?.version ?? "" }) }}
+          </span>
+          <button
+            type="button"
+            class="rounded-sm underline decoration-dotted underline-offset-2 hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-primary/40"
+            @click="versionMoveOpen = true"
+          >
+            {{ t("integration.nodeInspector.version.change") }}
+          </button>
+        </div>
       </div>
       <span class="shrink-0 rounded bg-slate-100 px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wider text-slate-600">
         {{ groupLabel }}
@@ -1305,6 +1353,18 @@ async function runTestStep() {
           class="mx-4 mb-1 shrink-0 rounded-md border border-rose-200 bg-rose-50 px-2.5 py-1.5 text-sm text-rose-700"
         >
           {{ readyVersion ? t("integration.nodeInspector.notice.versionNotReady.upgrade", { version: draftNode?.nodeVersion ?? "", ready: readyVersion }) : t("integration.nodeInspector.notice.versionNotReady.none", { version: draftNode?.nodeVersion ?? "" }) }}
+          <!-- The sentence named a version and led nowhere (PO-339). It leads
+               here now; where the node has no runnable version at all there is
+               still nothing to offer, and the notice stays the statement it
+               was. -->
+          <button
+            v-if="readyVersion && canMoveVersion"
+            type="button"
+            class="ml-1 rounded-sm font-medium underline underline-offset-2 hover:text-rose-900 focus:outline-none focus-visible:ring-2 focus-visible:ring-rose-400"
+            @click="versionMoveOpen = true"
+          >
+            {{ t("integration.nodeInspector.version.moveTo", { version: readyVersion }) }}
+          </button>
         </p>
 
         <div
@@ -1757,6 +1817,8 @@ async function runTestStep() {
                 :sibling-fields="manifest.config ?? []"
                 :depth="0"
                 :variables="variables"
+                :state-namespaces="offeredStateNamespaces"
+                @declare-state="stageStateNamespace"
                 :upstream-outputs="upstreamOutputs"
                 :refused="refusedFields?.[field.key]"
                 @set="(k, v) => writeConfig(k, v)"
@@ -1797,6 +1859,8 @@ async function runTestStep() {
                     :sibling-fields="manifest.config ?? []"
                     :depth="0"
                     :variables="variables"
+                    :state-namespaces="offeredStateNamespaces"
+                    @declare-state="stageStateNamespace"
                     :upstream-outputs="upstreamOutputs"
                     :refused="refusedFields?.[field.key]"
                     @set="(k, v) => writeConfig(k, v)"
@@ -1839,6 +1903,8 @@ async function runTestStep() {
                 :sibling-fields="manifest?.config ?? []"
                 :depth="0"
                 :variables="variables"
+                :state-namespaces="offeredStateNamespaces"
+                @declare-state="stageStateNamespace"
                 :upstream-outputs="upstreamOutputs"
                 :refused="refusedFields?.[field.key]"
                 @set="(k, v) => writeConfig(k, v)"
@@ -2128,6 +2194,11 @@ async function runTestStep() {
         </Button>
       </div>
     </div>
+
+    <!-- Asked outside the panes so it is not clipped by either, and mounted
+         unconditionally: the two places that open it sit in different parts of
+         the dialog and neither owns it. -->
+    <NodeVersionMoveDialog v-model:open="versionMoveOpen" :node="draftNode" @move="applyVersionMove" />
   </div>
 </template>
 

package/dist/runtime/components/Integrations/NodeInspector.vue.d.ts

@@ -1,9 +1,11 @@
-import type { NodeManifestOutput, WorkflowEdge, WorkflowNode, WorkflowTrigger, WorkflowVariable } from '../../types/integrations.js';
+import type { NodeManifestOutput, WorkflowEdge, WorkflowNode, WorkflowStateNamespace, WorkflowStateRole, WorkflowStateVisibility, WorkflowTrigger, WorkflowVariable } from '../../types/integrations.js';
 type __VLS_Props = {
     /** Either a workflow node OR a trigger. Distinguished by presence of `nodeSlug`. */
     selection: WorkflowNode | WorkflowTrigger | null;
     secretKeys: string[];
     variables?: Record<string, WorkflowVariable>;
+    /** The workflow's declared state namespaces — options for `state-ref` fields. */
+    stateNamespaces?: WorkflowStateNamespace[];
     upstreamOutputs?: Array<{
         nodeId: string;
         nodeName?: string;
@@ -29,13 +31,15 @@ type __VLS_Props = {
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     update: (next: WorkflowTrigger | WorkflowNode) => any;
-    close: () => any;
     remove: () => any;
+    close: () => any;
+    "declare-state": (namespace: string, role: WorkflowStateRole, visibility: WorkflowStateVisibility) => any;
     navigate: (id: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onUpdate?: ((next: WorkflowTrigger | WorkflowNode) => any) | undefined;
-    onClose?: (() => any) | undefined;
     onRemove?: (() => any) | undefined;
+    onClose?: (() => any) | undefined;
+    "onDeclare-state"?: ((namespace: string, role: WorkflowStateRole, visibility: WorkflowStateVisibility) => any) | undefined;
     onNavigate?: ((id: string) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/runtime/components/Integrations/NodeVersionMoveDialog.d.vue.ts

@@ -0,0 +1,21 @@
+import type { WorkflowNode } from '../../types/integrations.js';
+type __VLS_Props = {
+    node: WorkflowNode | null;
+};
+type __VLS_PublicProps = __VLS_Props & {
+    'open'?: boolean;
+};
+declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+    move: (payload: {
+        version: string;
+        config: Record<string, unknown>;
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+    onMove?: ((payload: {
+        version: string;
+        config: Record<string, unknown>;
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;