windmill-components 1.537.1 → 1.542.5

package/package/components/copilot/lib.js

@@ -1,11 +1,14 @@
 import { getCurrentModel, workspaceStore } from '../../stores';
 import { buildClientSchema, printSchema } from 'graphql';
-import { OpenAI } from 'openai';
+import OpenAI from 'openai';
+import Anthropic from '@anthropic-ai/sdk';
 import { get } from 'svelte/store';
 import { OpenAPI, ResourceService } from '../../gen';
 import { EDIT_CONFIG, FIX_CONFIG, GEN_CONFIG } from './prompts';
 import { formatResourceTypes } from './utils';
 import { z } from 'zod';
+import { processToolCall } from './chat/shared';
+import { generateRandomString } from '../../utils';
 export const SUPPORTED_LANGUAGES = new Set(Object.keys(GEN_CONFIG.prompts));
 const OPENAI_MODELS = [
     'gpt-5',
@@ -17,21 +20,51 @@ const OPENAI_MODELS = [
     'o3',
     'o3-mini'
 ];
-// need at least one model for each provider except customai
-export const AI_DEFAULT_MODELS = {
-    openai: OPENAI_MODELS,
-    azure_openai: OPENAI_MODELS,
-    anthropic: ['claude-sonnet-4-0', 'claude-sonnet-4-0/thinking', 'claude-3-5-haiku-latest'],
-    mistral: ['codestral-latest'],
-    deepseek: ['deepseek-chat', 'deepseek-reasoner'],
-    googleai: ['gemini-2.0-flash', 'gemini-1.5-flash', 'gemini-1.5-pro'],
-    groq: ['llama-3.3-70b-versatile', 'llama-3.1-8b-instant'],
-    openrouter: ['meta-llama/llama-3.2-3b-instruct:free'],
-    togetherai: ['meta-llama/Llama-3.3-70B-Instruct-Turbo'],
-    customai: []
+export const AI_PROVIDERS = {
+    openai: {
+        label: 'OpenAI',
+        defaultModels: OPENAI_MODELS
+    },
+    azure_openai: {
+        label: 'Azure OpenAI',
+        defaultModels: OPENAI_MODELS
+    },
+    anthropic: {
+        label: 'Anthropic',
+        defaultModels: ['claude-sonnet-4-0', 'claude-sonnet-4-0/thinking', 'claude-3-5-haiku-latest']
+    },
+    mistral: {
+        label: 'Mistral',
+        defaultModels: ['codestral-latest']
+    },
+    deepseek: {
+        label: 'DeepSeek',
+        defaultModels: ['deepseek-chat', 'deepseek-reasoner']
+    },
+    googleai: {
+        label: 'Google AI',
+        defaultModels: ['gemini-2.0-flash', 'gemini-1.5-flash', 'gemini-1.5-pro']
+    },
+    groq: {
+        label: 'Groq',
+        defaultModels: ['llama-3.3-70b-versatile', 'llama-3.1-8b-instant']
+    },
+    openrouter: {
+        label: 'OpenRouter',
+        defaultModels: ['meta-llama/llama-3.2-3b-instruct:free']
+    },
+    togetherai: {
+        label: 'Together AI',
+        defaultModels: ['meta-llama/Llama-3.3-70B-Instruct-Turbo']
+    },
+    customai: {
+        label: 'Custom AI',
+        defaultModels: []
+    }
 };
-export async function fetchAvailableModels(resourcePath, workspace, provider) {
+export async function fetchAvailableModels(resourcePath, workspace, provider, signal) {
     const models = await fetch(`${location.origin}${OpenAPI.BASE}/w/${workspace}/ai/proxy/models`, {
+        signal,
         headers: {
             'X-Resource-Path': resourcePath,
             'X-Provider': provider,
@@ -44,21 +77,34 @@ export async function fetchAvailableModels(resourcePath, workspace, provider) {
     }
     const data = (await models.json());
     if (data.data.length > 0) {
+        const sortFunc = (provider) => (a, b) => {
+            // First prioritize models in defaultModels array
+            const defaultModels = AI_PROVIDERS[provider]?.defaultModels || [];
+            const aInDefault = defaultModels.includes(a);
+            const bInDefault = defaultModels.includes(b);
+            if (aInDefault && !bInDefault)
+                return -1;
+            if (!aInDefault && bInDefault)
+                return 1;
+            return 0;
+        };
         switch (provider) {
             case 'openai':
                 return data.data
                     .filter((m) => m.id.startsWith('gpt-') || m.id.startsWith('o') || m.id.startsWith('codex'))
-                    .map((m) => m.id);
+                    .map((m) => m.id)
+                    .sort(sortFunc(provider));
             case 'azure_openai':
                 return data.data
                     .filter((m) => (m.id.startsWith('gpt-') || m.id.startsWith('o') || m.id.startsWith('codex')) &&
                     m.lifecycle_status !== 'deprecated' &&
                     (m.capabilities.completion || m.capabilities.chat_completion))
-                    .map((m) => m.id);
+                    .map((m) => m.id)
+                    .sort(sortFunc(provider));
             case 'googleai':
-                return data.data.map((m) => m.id.split('/')[1]);
+                return data.data.map((m) => m.id.split('/')[1]).sort(sortFunc(provider));
             default:
-                return data.data.map((m) => m.id);
+                return data.data.map((m) => m.id).sort(sortFunc(provider));
         }
     }
     return data?.data.map((m) => m.id) ?? [];
@@ -70,9 +116,15 @@ function getModelMaxTokens(provider, model) {
     else if ((provider === 'azure_openai' || provider === 'openai') && model.startsWith('o')) {
         return 100000;
     }
+    else if (model.startsWith('claude-sonnet') || model.startsWith('gemini-2.5')) {
+        return 64000;
+    }
     else if (model.startsWith('gpt-4.1')) {
         return 32768;
     }
+    else if (model.startsWith('claude-opus')) {
+        return 32000;
+    }
     else if (model.startsWith('gpt-4o') || model.startsWith('codestral')) {
         return 16384;
     }
@@ -102,12 +154,13 @@ export function getModelContextWindow(model) {
     }
 }
 function getModelSpecificConfig(modelProvider, tools) {
+    const maxTokens = getModelMaxTokens(modelProvider.provider, modelProvider.model);
     if ((modelProvider.provider === 'openai' || modelProvider.provider === 'azure_openai') &&
         (modelProvider.model.startsWith('o') || modelProvider.model.startsWith('gpt-5'))) {
         return {
             model: modelProvider.model,
             ...(tools && tools.length > 0 ? { tools } : {}),
-            max_completion_tokens: getModelMaxTokens(modelProvider.provider, modelProvider.model)
+            max_completion_tokens: maxTokens
         };
     }
     else {
@@ -125,7 +178,7 @@ function getModelSpecificConfig(modelProvider, tools) {
                     temperature: 0
                 }),
             ...(tools && tools.length > 0 ? { tools } : {}),
-            max_tokens: getModelMaxTokens(modelProvider.provider, modelProvider.model)
+            max_tokens: maxTokens
         };
     }
 }
@@ -178,8 +231,10 @@ export const PROVIDER_COMPLETION_CONFIG_MAP = {
 };
 class WorkspacedAIClients {
     openaiClient;
+    anthropicClient;
     init(workspace) {
         this.initOpenai(workspace);
+        this.initAnthropic(workspace);
     }
     getBaseURL(workspace) {
         return `${location.origin}${OpenAPI.BASE}/w/${workspace}/ai/proxy`;
@@ -195,19 +250,33 @@ class WorkspacedAIClients {
             dangerouslyAllowBrowser: true
         });
     }
+    initAnthropic(workspace) {
+        const baseURL = this.getBaseURL(workspace);
+        this.anthropicClient = new Anthropic({
+            baseURL,
+            apiKey: 'fake-key',
+            dangerouslyAllowBrowser: true
+        });
+    }
     getOpenaiClient() {
         if (!this.openaiClient) {
             throw new Error('OpenAI not initialized');
         }
         return this.openaiClient;
     }
+    getAnthropicClient() {
+        if (!this.anthropicClient) {
+            throw new Error('Anthropic not initialized');
+        }
+        return this.anthropicClient;
+    }
 }
 export const workspaceAIClients = new WorkspacedAIClients();
 export async function testKey({ apiKey, resourcePath, model, abortController, messages, aiProvider }) {
     if (!apiKey && !resourcePath) {
         throw new Error('API key or resource path is required');
     }
-    const modelToTest = model ?? AI_DEFAULT_MODELS[aiProvider][0];
+    const modelToTest = model ?? AI_PROVIDERS[aiProvider].defaultModels[0];
     if (!modelToTest) {
         throw new Error('Missing a model to test');
     }
@@ -339,7 +408,7 @@ const PROMPTS_CONFIGS = {
     edit: EDIT_CONFIG,
     gen: GEN_CONFIG
 };
-function getProviderAndCompletionConfig({ messages, stream, tools, forceModelProvider }) {
+export function getProviderAndCompletionConfig({ messages, stream, tools, forceModelProvider }) {
     const modelProvider = forceModelProvider ?? getCurrentModel();
     const providerConfig = PROVIDER_COMPLETION_CONFIG_MAP[modelProvider.provider];
     const processedMessages = prepareMessages(modelProvider.provider, messages);
@@ -449,7 +518,7 @@ export async function getFimCompletion(prompt, suffix, providerModel, abortContr
 export async function getCompletion(messages, abortController, tools) {
     const { provider, config } = getProviderAndCompletionConfig({ messages, stream: true, tools });
     const openaiClient = workspaceAIClients.getOpenaiClient();
-    const completion = await openaiClient.chat.completions.create(config, {
+    const completion = openaiClient.chat.completions.create(config, {
         signal: abortController.signal,
         headers: {
             'X-Provider': provider
@@ -457,6 +526,112 @@ export async function getCompletion(messages, abortController, tools) {
     });
     return completion;
 }
+function extractFirstJSON(str) {
+    let depth = 0, i = 0;
+    for (; i < str.length; i++) {
+        if (str[i] === '{')
+            depth++;
+        else if (str[i] === '}' && --depth === 0)
+            break;
+    }
+    return str.slice(0, i + 1);
+}
+export async function parseOpenAICompletion(completion, callbacks, messages, addedMessages, tools, helpers) {
+    const finalToolCalls = {};
+    let answer = '';
+    for await (const chunk of completion) {
+        if (!('choices' in chunk && chunk.choices.length > 0 && 'delta' in chunk.choices[0])) {
+            continue;
+        }
+        const c = chunk;
+        const delta = c.choices[0].delta.content;
+        if (delta) {
+            answer += delta;
+            callbacks.onNewToken(delta);
+        }
+        const toolCalls = c.choices[0].delta.tool_calls || [];
+        if (toolCalls.length > 0 && answer) {
+            // if tool calls are present but we have some textual content already, we need to display it to the user first
+            callbacks.onMessageEnd();
+            answer = '';
+        }
+        for (let i = 0; i < toolCalls.length; i++) {
+            const toolCall = toolCalls[i];
+            // Gemini models are missing the index field
+            if (toolCall.index === undefined ||
+                (typeof toolCall.index === 'string' && toolCall.index === '')) {
+                toolCall.index = i;
+            }
+            // Gemini models are missing the id field
+            if (toolCall.id === undefined || (typeof toolCall.id === 'string' && toolCall.id === '')) {
+                toolCall.id = generateRandomString();
+            }
+            const { index } = toolCall;
+            let finalToolCall = finalToolCalls[index];
+            if (!finalToolCall) {
+                finalToolCalls[index] = toolCall;
+            }
+            else {
+                if (toolCall.function?.arguments) {
+                    if (!finalToolCall.function) {
+                        finalToolCall.function = toolCall.function;
+                    }
+                    else {
+                        finalToolCall.function.arguments =
+                            (finalToolCall.function.arguments ?? '') + toolCall.function.arguments;
+                        // Make sure we only have one JSON object, else for Gemini models it sometimes results in two JSON objects
+                        finalToolCall.function.arguments = extractFirstJSON(finalToolCall.function.arguments || '{}');
+                    }
+                }
+            }
+            finalToolCall = finalToolCalls[index];
+            if (finalToolCall?.function) {
+                const { function: { name: funcName }, id: toolCallId } = finalToolCall;
+                if (funcName && toolCallId) {
+                    const tool = tools.find((t) => t.def.function.name === funcName);
+                    if (tool && tool.preAction) {
+                        tool.preAction({ toolCallbacks: callbacks, toolId: toolCallId });
+                    }
+                }
+            }
+        }
+    }
+    if (answer) {
+        const toAdd = { role: 'assistant', content: answer };
+        addedMessages.push(toAdd);
+        messages.push(toAdd);
+    }
+    callbacks.onMessageEnd();
+    const toolCalls = Object.values(finalToolCalls).filter((toolCall) => toolCall.id !== undefined && toolCall.function?.arguments !== undefined);
+    if (toolCalls.length > 0) {
+        const toAdd = {
+            role: 'assistant',
+            tool_calls: toolCalls.map((t) => ({
+                ...t,
+                function: {
+                    ...t.function,
+                    arguments: t.function.arguments || '{}'
+                }
+            }))
+        };
+        messages.push(toAdd);
+        addedMessages.push(toAdd);
+        for (const toolCall of toolCalls) {
+            const messageToAdd = await processToolCall({
+                tools,
+                toolCall,
+                helpers,
+                toolCallbacks: callbacks
+            });
+            messages.push(messageToAdd);
+            addedMessages.push(messageToAdd);
+        }
+    }
+    else {
+        return false;
+    }
+    return true;
+}
 export function getResponseFromEvent(part) {
     return part.choices?.[0]?.delta?.content || '';
 }
@@ -544,7 +719,7 @@ export async function deltaCodeCompletion(messages, generatedCodeDelta, abortCon
             continue;
         }
         if (!match[1].endsWith('`')) {
-            // skip udpating if possible that part of three ticks (end of code block)s
+            // skip updating if possible that part of three ticks (end of code block)s
             delta = getStringEndDelta(code, match[1]);
             generatedCodeDelta.set(delta);
             code = match[1];

package/package/components/custom_ui.d.ts

@@ -65,6 +65,7 @@ export type EditorBarUi = {
     assistants?: boolean;
     multiplayer?: boolean;
     autoformatting?: boolean;
+    editorSettings?: boolean;
     vimMode?: boolean;
     relativeLineNumbers?: boolean;
     aiGen?: boolean;

package/package/components/flows/content/FlowInput.svelte

@@ -35,8 +35,8 @@ let runDisabled = $state(false);
 let editableSchemaForm = $state(undefined);
 let savedPreviewArgs = $state(undefined);
 let isValid = $state(true);
-let dynSelectCode = $state(undefined);
-let dynSelectLang = $state(undefined);
+let dynCode = $state(undefined);
+let dynLang = $state(undefined);
 function updateEditPanelSize(size) {
     if (!$flowInputEditorState)
         return;
@@ -306,7 +306,7 @@ function resetSelected() {
 				on:delete={(e) => {
 					addPropertyV2?.handleDeleteArgument([e.detail])
 				}}
-				showDynSelectOpt
+				showDynOpt
 				displayWebhookWarning
 				editTab={$flowInputEditorState?.selectedTab}
 				{previewSchema}
@@ -345,8 +345,8 @@ function resetSelected() {
 					}
 				}}
 				bind:isValid
-				bind:dynSelectCode
-				bind:dynSelectLang
+				bind:dynCode
+				bind:dynLang
 			>
 				{#snippet openEditTab()}
 					<div class={twMerge('flex flex-row divide-x', ButtonType.ColorVariants.blue.divider)}>

package/package/components/flows/content/FlowModuleComponent.svelte

@@ -564,7 +564,7 @@ function onJobDone() {
 															</Tooltip>
 														</div>
 														<div class="my-8"></div>
-														<FlowRetries bind:flowModuleRetry={flowModule.retry} />
+														<FlowRetries bind:flowModuleRetry={flowModule.retry} bind:flowModule />
 													</Section>
 												{:else if advancedSelected === 'runtime' && advancedRuntimeSelected === 'concurrency'}
 													<Section label="Concurrency limits" class="flex flex-col gap-4" eeOnly>
@@ -626,7 +626,10 @@ function onJobDone() {
 													</Section>
 												{:else if advancedSelected === 'runtime' && advancedRuntimeSelected === 'timeout'}
 													<div>
-														<FlowModuleTimeout bind:flowModule />
+														<FlowModuleTimeout
+															previousModuleId={previousModule?.id}
+															bind:flowModule
+														/>
 													</div>
 												{:else if advancedSelected === 'runtime' && advancedRuntimeSelected === 'priority'}
 													<Section label="Priority" class="flex flex-col gap-4">

package/package/components/flows/content/FlowModuleEarlyStop.svelte

@@ -11,40 +11,50 @@ const { flowStateStore, flowStore, previewArgs } = getContext('FlowEditorContext
 let { flowModule = $bindable() } = $props();
 let editor = $state(undefined);
 let stepPropPicker = $derived(getStepPropPicker(flowStateStore.val, undefined, undefined, flowModule.id, flowStore.val, previewArgs.val, false));
-function checkIfParentLoop(flowStoreValue) {
+function checkIfBreakableParent(flowStoreValue) {
     const flow = JSON.parse(JSON.stringify(flowStoreValue));
     const parents = dfs(flowModule.id, flow, true);
     for (const parent of parents.slice(1)) {
         if (parent.value.type === 'forloopflow' || parent.value.type === 'whileloopflow') {
-            return parent.id;
+            return { stepId: parent.id, isParallel: parent.value.parallel ?? false, type: 'loop' };
+        }
+        else if (parent.value.type === 'branchall' && parent.value.parallel) {
+            return { stepId: parent.id, isParallel: true, type: 'branchall' };
         }
     }
     return null;
 }
 let raise_error_message_stop_after_all_if = $state(flowModule.stop_after_all_iters_if?.error_message !== undefined);
 let raise_error_message_stop_after_if = $state(flowModule.stop_after_if?.error_message !== undefined);
-let isLoop = $derived(flowModule.value.type === 'forloopflow' || flowModule.value.type === 'whileloopflow');
+let { isLoop, isParallelLoop } = $derived(flowModule.value.type === 'forloopflow' || flowModule.value.type === 'whileloopflow'
+    ? { isLoop: true, isParallelLoop: flowModule.value.parallel ?? false }
+    : { isLoop: false, isParallelLoop: false });
 let isBranchAll = $derived(flowModule.value.type === 'branchall');
 let isStopAfterIfEnabled = $derived(Boolean(flowModule.stop_after_if));
 let isStopAfterAllIterationsEnabled = $derived(Boolean(flowModule.stop_after_all_iters_if));
 let result = $derived(flowStateStore.val[flowModule.id]?.previewResult ?? NEVER_TESTED_THIS_FAR);
-let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
+let breakableParent = $derived(checkIfBreakableParent(flowStore.val));
 </script>
 
 <div class="flex flex-col items-start space-y-2">
-	{#if !isBranchAll}
+	{#if !isBranchAll && !isParallelLoop}
 		<Section
 			label={(isLoop
 				? 'Break loop'
-				: parentLoopId
-					? 'Break parent loop module ' + parentLoopId
+				: breakableParent
+					? breakableParent.isParallel
+						? breakableParent.type === 'loop'
+							? 'Skip rest of steps in iteration'
+							: 'Skip rest of steps in branch'
+						: 'Break parent loop module ' + breakableParent.stepId
 					: 'Stop flow early') + (isLoop ? ' (evaluated after each iteration)' : '')}
 			class="w-full"
 		>
 			{#snippet header()}
 				<Tooltip documentationLink="https://www.windmill.dev/docs/flows/early_stop">
 					If defined, at the end of the step, the predicate expression will be evaluated to decide
-					if the flow should stop early or break if inside a for/while loop.
+					if the flow should stop early, skip rest of steps in iteration/branch if inside a parallel
+					for loop or branch all, or break if inside a for/while loop or branch all.
 				</Tooltip>
 			{/snippet}
 
@@ -64,8 +74,12 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 				options={{
 					right: isLoop
 						? 'Break loop'
-						: parentLoopId
-							? 'Break parent loop module'
+						: breakableParent
+							? breakableParent.isParallel
+								? breakableParent.type === 'loop'
+									? 'Skip rest of steps in iteration'
+									: 'Skip rest of steps in branch'
+								: 'Break parent loop module'
 							: 'Stop flow if condition met'
 				}}
 			/>
@@ -83,7 +97,7 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 								? result
 								: undefined
 						: result}
-					{#if !parentLoopId && !isLoop}
+					{#if !breakableParent && !isLoop}
 						<div class="flex flex-col gap-2">
 							<Toggle
 								size="xs"
@@ -140,15 +154,17 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 						</PropPickerWrapper>
 					</div>
 				{:else}
-					{#if !parentLoopId && !isLoop}
+					{#if !breakableParent && !isLoop}
 						<div class="flex flex-col gap-2">
 							<Toggle
+								disabled
 								size="xs"
 								options={{
 									right: 'Label flow as "skipped" if stopped'
 								}}
 							/>
 							<Toggle
+								disabled
 								size="xs"
 								options={{
 									right: 'Raise an error message if stopped'
@@ -165,7 +181,13 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 
 	{#if isLoop || isBranchAll}
 		<Section
-			label={(parentLoopId ? 'Break parent loop module ' + parentLoopId : 'Stop flow early') +
+			label={(breakableParent
+				? breakableParent.isParallel
+					? breakableParent.type === 'loop'
+						? 'Skip rest of steps in iteration'
+						: 'Skip rest of steps in branch'
+					: 'Break parent loop module ' + breakableParent.stepId
+				: 'Stop flow early') +
 				(isBranchAll
 					? ' (evaluated after all branches have been run)'
 					: ' (evaluated after all iterations)')}
@@ -174,7 +196,8 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 			{#snippet header()}
 				<Tooltip documentationLink="https://www.windmill.dev/docs/flows/early_stop">
 					If defined, at the end of the step, the predicate expression will be evaluated to decide
-					if the flow should stop early or break if inside a for/while loop.
+					if the flow should stop early, skip rest of steps in iteration/branch if inside a parallel
+					for loop or branch all, or break if inside a for/while loop or branch all.
 				</Tooltip>
 			{/snippet}
 
@@ -192,7 +215,14 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 					}
 				}}
 				options={{
-					right: (parentLoopId ? 'Break parent loop module' : 'Stop flow') + ' if condition met'
+					right:
+						(breakableParent
+							? breakableParent.isParallel
+								? breakableParent.type === 'loop'
+									? 'Skip rest of steps in iteration'
+									: 'Skip rest of steps in branch'
+								: 'Break parent loop module ' + breakableParent.stepId
+							: 'Stop flow') + ' if condition met'
 				}}
 			/>
 
@@ -202,7 +232,7 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 					: 'bg-surface-secondary'}"
 			>
 				{#if flowModule.stop_after_all_iters_if}
-					{#if !parentLoopId}
+					{#if !breakableParent}
 						<div class="flex flex-col gap-2">
 							<Toggle
 								size="xs"
@@ -258,7 +288,7 @@ let parentLoopId = $derived(checkIfParentLoop(flowStore.val));
 						</PropPickerWrapper>
 					</div>
 				{:else}
-					{#if !parentLoopId}
+					{#if !breakableParent}
 						<div class="flex flex-col gap-2">
 							<Toggle
 								disabled

package/package/components/flows/content/FlowModuleSleep.svelte

@@ -7,13 +7,15 @@ import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte';
 import { SecondsInput } from '../../common';
 import Section from '../../Section.svelte';
 import Label from '../../Label.svelte';
+import { getStepPropPicker } from '../previousResults';
 let { flowModule = $bindable(), previousModuleId } = $props();
-const { selectedId, flowStateStore } = getContext('FlowEditorContext');
+const { selectedId, flowStore, flowStateStore, previewArgs } = getContext('FlowEditorContext');
 let schema = $state(emptySchema());
 schema.properties['sleep'] = {
     type: 'number'
 };
 let editor = $state(undefined);
+let stepPropPicker = $derived(getStepPropPicker(flowStateStore.val, undefined, undefined, flowModule.id, flowStore.val, previewArgs.val, false));
 const result = flowStateStore.val[$selectedId]?.previewResult ?? {};
 let isSleepEnabled = $derived(Boolean(flowModule.sleep));
 </script>
@@ -47,6 +49,7 @@ let isSleepEnabled = $derived(Boolean(flowModule.sleep));
 			<div class="border">
 				<PropPickerWrapper
 					noFlowPlugConnect={true}
+					flow_input={stepPropPicker.pickableProperties.flow_input}
 					notSelectable
 					{result}
 					displayContext={false}

package/package/components/flows/content/FlowModuleSuspend.svelte

@@ -53,7 +53,6 @@ $effect(() => {
 let jsonView = $state(false);
 </script>
 
-A{JSON.stringify(flowModule.suspend?.resume_form)}B
 <Section label="Suspend/Approval/Prompt" class="w-full">
 	{#snippet action()}
 		<SuspendDrawer text="Approval/Prompt helpers" />