windmill-components 1.532.0 → 1.542.4

package/package/components/flows/content/FlowModuleTimeout.svelte

@@ -1,8 +1,27 @@
-<script lang="ts">import Section from '../../Section.svelte';
+<script lang="ts">import InputTransformForm from '../../InputTransformForm.svelte';
+import Section from '../../Section.svelte';
 import Toggle from '../../Toggle.svelte';
 import Tooltip from '../../Tooltip.svelte';
+import Label from '../../Label.svelte';
 import { Alert, SecondsInput } from '../../common';
-let { flowModule = $bindable() } = $props();
+import { emptySchema } from '../../../utils';
+import { getContext } from 'svelte';
+import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte';
+import { getStepPropPicker } from '../previousResults';
+let { flowModule = $bindable(), previousModuleId } = $props();
+const { flowStore, flowStateStore, previewArgs } = getContext('FlowEditorContext');
+let schema = $state(emptySchema());
+schema.properties['timeout'] = {
+    type: 'number'
+};
+if (typeof flowModule.timeout === 'number') {
+    flowModule.timeout = {
+        type: 'static',
+        value: flowModule.timeout
+    };
+}
+let stepPropPicker = $derived(getStepPropPicker(flowStateStore.val, undefined, undefined, flowModule.id, flowStore.val, previewArgs.val, false));
+let editor = $state(undefined);
 let istimeoutEnabled = $derived(Boolean(flowModule.timeout));
 </script>
 
@@ -20,24 +39,45 @@ let istimeoutEnabled = $derived(Boolean(flowModule.timeout));
 			if (istimeoutEnabled && flowModule.timeout != undefined) {
 				flowModule.timeout = undefined
 			} else {
-				flowModule.timeout = 300
+				flowModule.timeout = {
+					type: 'static',
+					value: 300
+				}
 			}
 		}}
 		options={{
 			right: 'Add a custom timeout for this step'
 		}}
 	/>
-	<div class="mb-4">
-		<span class="text-xs font-bold">Timeout duration</span>
-
-		{#if flowModule.timeout}
-			<SecondsInput bind:seconds={flowModule.timeout} />
+	<Label label="Timeout duration">
+		{#if flowModule.timeout && schema.properties['timeout']}
+			<div class="border">
+				<PropPickerWrapper
+					flow_input={stepPropPicker.pickableProperties.flow_input}
+					notSelectable
+					pickableProperties={stepPropPicker.pickableProperties}
+					on:select={({ detail }) => {
+						editor?.insertAtCursor(detail)
+						editor?.focus()
+					}}
+				>
+					<InputTransformForm
+						bind:arg={flowModule.timeout}
+						argName="timeout"
+						{schema}
+						{previousModuleId}
+						argExtra={{ seconds: true }}
+						bind:editor
+					/>
+				</PropPickerWrapper>
+			</div>
 		{:else}
 			<SecondsInput disabled />
+			<div class="text-secondary">OR use a dynamic expression</div>
 		{/if}
+	</Label>
 
-		<div class="mt-4"></div>
-
+	<div class="mt-4">
 		<Alert title="Only used when testing the full flow" type="info">
 			<p class="text-sm"> The timeout will be ignored when running "Test this step" </p>
 		</Alert>

package/package/components/flows/content/FlowModuleTimeout.svelte.d.ts

@@ -1,6 +1,7 @@
 import type { FlowModule } from '../../../gen';
 interface Props {
     flowModule: FlowModule;
+    previousModuleId: string | undefined;
 }
 declare const FlowModuleTimeout: import("svelte").Component<Props, {}, "flowModule">;
 type FlowModuleTimeout = ReturnType<typeof FlowModuleTimeout>;

package/package/components/flows/content/FlowRetries.svelte

@@ -3,10 +3,31 @@ import ToggleButtonGroup from '../../common/toggleButton-v2/ToggleButtonGroup.sv
 import ToggleButton from '../../common/toggleButton-v2/ToggleButton.svelte';
 import { enterpriseLicense } from '../../../stores';
 import { AlertTriangle } from 'lucide-svelte';
-import { untrack } from 'svelte';
-let { flowModuleRetry = $bindable(), disabled = false } = $props();
+import { untrack, getContext } from 'svelte';
+import Toggle from '../../Toggle.svelte';
+import SimpleEditor from '../../SimpleEditor.svelte';
+import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte';
+import Tooltip from '../../Tooltip.svelte';
+import Section from '../../Section.svelte';
+import { getStepPropPicker } from '../previousResults';
+import { NEVER_TESTED_THIS_FAR } from '../models';
+let { flowModule = $bindable(), flowModuleRetry = $bindable(), disabled = false } = $props();
+const flowEditorContext = getContext('FlowEditorContext');
+const { flowStateStore, flowStore, previewArgs } = flowEditorContext || {
+    flowStateStore: null,
+    flowStore: null,
+    previewArgs: null
+};
 let delayType = $state();
 let loaded = $state(false);
+let editor = $state(undefined);
+let stepPropPicker = $derived(flowModule && flowStateStore?.val && flowStore?.val && previewArgs?.val
+    ? getStepPropPicker(flowStateStore.val, undefined, undefined, flowModule.id, flowStore.val, previewArgs.val, false)
+    : null);
+let isRetryConditionEnabled = $derived(Boolean(flowModuleRetry?.retry_if));
+let result = $derived(flowModule && flowStateStore?.val
+    ? (flowStateStore.val[flowModule.id]?.previewResult ?? NEVER_TESTED_THIS_FAR)
+    : NEVER_TESTED_THIS_FAR);
 function setConstantRetries() {
     flowModuleRetry = {
         ...flowModuleRetry,
@@ -48,7 +69,7 @@ $effect(() => {
 const u32Max = 4294967295;
 </script>
 
-<div class="h-full flex flex-col">
+<div class="h-full flex flex-col gap-4">
 	<ToggleButtonGroup
 		bind:selected={delayType}
 		class={`h-10 ${disabled ? 'disabled' : ''}`}
@@ -69,6 +90,90 @@ const u32Max = 4294967295;
 			<ToggleButton light value="exponential" label="Exponential" {item} />
 		{/snippet}
 	</ToggleButtonGroup>
+
+	{#if delayType === 'constant' || delayType === 'exponential'}
+		<Section label="Retry Condition" class="w-full">
+			{#snippet header()}
+				<Tooltip>
+					Optional condition to determine when to retry. If not specified, will retry on any failure
+					within the configured attempt limits.
+				</Tooltip>
+			{/snippet}
+
+			<Toggle
+				checked={isRetryConditionEnabled}
+				on:change={() => {
+					if (!flowModuleRetry) {
+						return
+					}
+					if (isRetryConditionEnabled && flowModuleRetry.retry_if) {
+						const { retry_if, ...rest } = flowModuleRetry
+						flowModuleRetry = rest
+					} else {
+						flowModuleRetry = {
+							...flowModuleRetry,
+							retry_if: {
+								expr: 'error && error.name !== "PERMANENT_FAILURE"'
+							}
+						}
+					}
+				}}
+				options={{
+					right: 'Only retry if condition is met'
+				}}
+			/>
+
+			<div
+				class="w-full border p-2 mt-2 flex flex-col {flowModuleRetry?.retry_if
+					? ''
+					: 'bg-surface-secondary'}"
+			>
+				{#if flowModuleRetry?.retry_if}
+					<span class="mt-2 text-xs font-bold">Retry condition expression</span>
+					<span class="text-xs text-tertiary mb-2"
+						>Expression should return true to retry, false to skip retry</span
+					>
+					<div class="border w-full">
+						{#if stepPropPicker}
+							<PropPickerWrapper
+								notSelectable
+								pickableProperties={stepPropPicker.pickableProperties}
+								{result}
+								on:select={({ detail }) => {
+									editor?.insertAtCursor(detail)
+									editor?.focus()
+								}}
+							>
+								<SimpleEditor
+									bind:this={editor}
+									lang="javascript"
+									bind:code={flowModuleRetry.retry_if.expr}
+									class="few-lines-editor"
+									extraLib={`declare const result = ${JSON.stringify(result)};` +
+										`\ndeclare const flow_input = ${JSON.stringify(stepPropPicker.pickableProperties.flow_input || {})};`}
+								/>
+							</PropPickerWrapper>
+						{:else}
+							<SimpleEditor
+								bind:this={editor}
+								lang="javascript"
+								bind:code={flowModuleRetry.retry_if.expr}
+								class="few-lines-editor"
+								extraLib={`declare const result = ${JSON.stringify(result)};`}
+							/>
+						{/if}
+					</div>
+				{:else}
+					<span class="mt-2 text-xs font-bold">Retry condition expression</span>
+					<span class="text-xs text-tertiary mb-2"
+						>Expression should return true to retry, false to skip retry</span
+					>
+					<textarea disabled rows="3" class="min-h-[80px]"></textarea>
+				{/if}
+			</div>
+		</Section>
+	{/if}
+
 	<div class="flex h-[calc(100%-22px)]">
 		<div class="w-1/2 h-full overflow-auto pr-2">
 			{#if delayType === 'constant'}

package/package/components/flows/content/FlowRetries.svelte.d.ts

@@ -1,8 +1,9 @@
-import type { Retry } from '../../../gen';
+import type { Retry, FlowModule } from '../../../gen';
 interface Props {
     flowModuleRetry: Retry | undefined;
     disabled?: boolean;
+    flowModule?: FlowModule;
 }
-declare const FlowRetries: import("svelte").Component<Props, {}, "flowModuleRetry">;
+declare const FlowRetries: import("svelte").Component<Props, {}, "flowModule" | "flowModuleRetry">;
 type FlowRetries = ReturnType<typeof FlowRetries>;
 export default FlowRetries;

package/package/components/flows/content/FlowWhileLoop.svelte

@@ -15,6 +15,7 @@ import FlowLoopIterationPreview from '../../FlowLoopIterationPreview.svelte';
 import FlowModuleDeleteAfterUse from './FlowModuleDeleteAfterUse.svelte';
 import FlowModuleSkip from './FlowModuleSkip.svelte';
 import TabsV2 from '../../common/tabs/TabsV2.svelte';
+import { useUiIntent } from '../../copilot/chat/flow/useUiIntent';
 const { flowStateStore } = getContext('FlowEditorContext');
 let { mod = $bindable(), previousModule, parentModule, noEditor } = $props();
 let selected = $state('early-stop');
@@ -22,6 +23,11 @@ let previewOpen = $state(false);
 let jobId = $state(undefined);
 let job = $state(undefined);
 let previewIterationArgs = $derived(flowStateStore.val[mod.id]?.previewArgs ?? {});
+useUiIntent(`whileloopflow-${mod.id}`, {
+    openTab: (tab) => {
+        selected = tab;
+    }
+});
 </script>
 
 <Drawer bind:open={previewOpen} alwaysOpen size="75%">

package/package/components/flows/content/ScriptEditorDrawer.svelte

@@ -14,6 +14,7 @@ let scriptEditorDrawer = $state();
 const dispatch = createEventDispatcher();
 export async function openDrawer(hash, cb) {
     script = undefined;
+    closeAnyway = false;
     scriptEditorDrawer?.openDrawer?.();
     script = await ScriptService.getScriptByHash({
         workspace: $workspaceStore,
@@ -64,7 +65,6 @@ let unsavedModalOpen = $state(false);
 async function checkForUnsavedChanges() {
     if (closeAnyway) {
         scriptEditorDrawer?.closeDrawer();
-        closeAnyway = false;
         return;
     }
     if (savedScript && script) {
@@ -72,6 +72,7 @@ async function checkForUnsavedChanges() {
         const current = cleanValueProperties(script);
         if (orderedJsonStringify(saved) !== orderedJsonStringify(current)) {
             unsavedModalOpen = true;
+            scriptEditorDrawer?.openDrawer();
         }
         else {
             scriptEditorDrawer?.closeDrawer();
@@ -79,6 +80,7 @@ async function checkForUnsavedChanges() {
     }
 }
 let args = $state({});
+let displayEditor = $state(true);
 </script>
 
 <ConfirmationModal
@@ -89,8 +91,9 @@ let args = $state({});
 		unsavedModalOpen = false
 	}}
 	on:confirmed={() => {
-		unsavedModalOpen = false
+		console.log('confirmed')
 		closeAnyway = true
+		unsavedModalOpen = false
 		scriptEditorDrawer?.closeDrawer()
 	}}
 >
@@ -107,7 +110,7 @@ let args = $state({});
 				}
 				unsavedModalOpen = false
 				closeAnyway = true
-				scriptEditorDrawer?.closeDrawer()
+				displayEditor = false
 				diffDrawer?.openDrawer()
 				diffDrawer?.setDiff({
 					title: 'Saved <> Current',
@@ -133,7 +136,6 @@ let args = $state({});
 	bind:this={scriptEditorDrawer}
 	size="1200px"
 	on:close={() => {
-		scriptEditorDrawer?.openDrawer()
 		checkForUnsavedChanges()
 	}}
 >
@@ -146,7 +148,7 @@ let args = $state({});
 			scriptEditorDrawer?.closeDrawer()
 		}}
 	>
-		{#if script}
+		{#if script && displayEditor}
 			{#key script.hash}
 				<ScriptEditor
 					showCaptures={false}
@@ -187,7 +189,7 @@ let args = $state({});
 						return
 					}
 					closeAnyway = true
-					scriptEditorDrawer?.closeDrawer()
+					displayEditor = false
 					diffDrawer?.openDrawer()
 					diffDrawer?.setDiff({
 						mode: 'simple',
@@ -227,10 +229,6 @@ let args = $state({});
 <DiffDrawer
 	bind:this={diffDrawer}
 	on:close={() => {
-		if (!closeAnyway) {
-			scriptEditorDrawer?.openDrawer()
-		} else {
-			closeAnyway = false
-		}
+		displayEditor = true
 	}}
 />

package/package/components/flows/dfs.d.ts

@@ -1,4 +1,4 @@
 import type { FlowModule } from '../../gen';
-export declare function dfs<T>(modules: FlowModule[], f: (x: FlowModule, modules: FlowModule[], branches: FlowModule[][]) => T, { skipToolNodes }?: {
+export declare function dfs<T>(modules: FlowModule[], f: (x: FlowModule, modules: FlowModule[], branches: FlowModule[][]) => T, opts?: {
     skipToolNodes?: boolean;
 }): T[];

package/package/components/flows/dfs.js

@@ -1,27 +1,27 @@
-export function dfs(modules, f, { skipToolNodes = false } = {}) {
+export function dfs(modules, f, opts = {}) {
     let result = [];
     for (const module of modules) {
         if (module.value.type == 'forloopflow' || module.value.type == 'whileloopflow') {
             result = result.concat(f(module, modules, [module.value.modules]));
-            result = result.concat(dfs(module.value.modules, f));
+            result = result.concat(dfs(module.value.modules, f, opts));
         }
         else if (module.value.type == 'branchone') {
             const allBranches = [module.value.default, ...module.value.branches.map((b) => b.modules)];
             result = result.concat(f(module, modules, allBranches));
             for (const branch of allBranches) {
-                result = result.concat(dfs(branch, f));
+                result = result.concat(dfs(branch, f, opts));
             }
         }
         else if (module.value.type == 'branchall') {
             const allBranches = module.value.branches.map((b) => b.modules);
             result = result.concat(f(module, modules, allBranches));
             for (const branch of allBranches) {
-                result = result.concat(dfs(branch, f));
+                result = result.concat(dfs(branch, f, opts));
             }
         }
-        else if (module.value.type == 'aiagent' && !skipToolNodes) {
+        else if (module.value.type == 'aiagent' && !opts.skipToolNodes) {
             result = result.concat(f(module, modules, [module.value.tools]));
-            result = result.concat(dfs(module.value.tools, f));
+            result = result.concat(dfs(module.value.tools, f, opts));
         }
         else {
             result.push(f(module, modules, []));

package/package/components/flows/flowInfers.js

@@ -47,64 +47,37 @@ export async function loadSchemaFromModule(module) {
             properties: {
                 provider: {
                     type: 'object',
-                    oneOf: [
-                        {
-                            type: 'object',
-                            title: 'OpenAI',
-                            properties: {
-                                kind: { type: 'string', enum: ['OpenAI'] },
-                                resource: {
-                                    type: 'object',
-                                    format: 'resource-openai'
-                                },
-                                model: {
-                                    type: 'string',
-                                    enum: ['gpt-5', 'gpt-5-mini', 'gpt-5-nano', 'gpt-4.1', 'gpt-4o', 'gpt-4o-mini']
-                                }
-                            },
-                            required: ['kind', 'resource', 'model']
-                        },
-                        {
-                            type: 'object',
-                            title: 'Anthropic',
-                            properties: {
-                                kind: { type: 'string', enum: ['Anthropic'] },
-                                resource: {
-                                    type: 'object',
-                                    format: 'resource-anthropic'
-                                },
-                                model: {
-                                    type: 'string',
-                                    enum: ['claude-sonnet-4-0', 'claude-3-7-sonnet-latest', 'claude-3-5-haiku-latest']
-                                }
-                            },
-                            required: ['kind', 'resource', 'model']
-                        }
-                    ]
-                },
-                system_prompt: {
-                    type: 'string',
-                    default: 'You are a helpful assistant'
+                    format: 'ai-provider'
                 },
                 user_message: {
                     type: 'string'
                 },
+                system_prompt: {
+                    type: 'string'
+                },
                 max_completion_tokens: {
                     type: 'number'
                 },
                 temperature: {
-                    type: 'number'
+                    type: 'number',
+                    description: 'Controls randomness in text generation. Range: 0.0 (deterministic) to 2.0 (random).'
+                },
+                output_schema: {
+                    type: 'object',
+                    description: 'JSON schema that the AI agent will follow for its response format',
+                    format: 'json-schema'
                 }
             },
-            required: ['provider', 'model', 'system_prompt', 'user_message'],
+            required: ['provider', 'model', 'user_message'],
             type: 'object',
             order: [
                 'provider',
                 'model',
-                'system_prompt',
                 'user_message',
+                'system_prompt',
                 'max_completion_tokens',
-                'temperature'
+                'temperature',
+                'output_schema'
             ]
         };
         let input_transforms = mod.input_transforms ?? {};

package/package/components/flows/flowStateUtils.svelte.js

@@ -113,8 +113,7 @@ export async function createBranchAll(id) {
 export async function createAiAgent(id) {
     const aiAgentFlowModules = {
         id,
-        value: { type: 'aiagent', tools: [], input_transforms: {} },
-        summary: 'AI Agent'
+        value: { type: 'aiagent', tools: [], input_transforms: {} }
     };
     const flowModuleState = await loadFlowModuleState(aiAgentFlowModules);
     return [aiAgentFlowModules, flowModuleState];

package/package/components/flows/flowStore.d.ts

@@ -6,7 +6,51 @@ export declare const importFlowStore: import("svelte/store").Writable<Flow | und
 export declare function initFlow(flow: Flow, flowStore: StateStore<Flow>, flowStateStore: StateStore<FlowState>): Promise<void>;
 export declare function copyFirstStepSchema(flowState: FlowState, flowStore: StateStore<OpenFlow>): Promise<void>;
 export declare function getFirstStepSchema(flowState: FlowState, flow: OpenFlow): Promise<{
-    schema: import("../../common").Schema | undefined;
+    schema: {
+        $schema: string | undefined;
+        type: string;
+        properties: {
+            [x: string]: {
+                type: string | undefined;
+                description?: string | undefined;
+                pattern?: string | undefined;
+                default?: any;
+                enum?: string[] | undefined;
+                contentEncoding?: "base64" | "binary" | undefined;
+                format?: string | undefined;
+                items?: {
+                    type?: "string" | "number" | "bytes" | "object" | "resource" | undefined;
+                    contentEncoding?: "base64" | undefined;
+                    enum?: string[] | undefined;
+                    resourceType?: string | undefined;
+                    properties?: {
+                        [x: string]: /*elided*/ any;
+                    } | undefined;
+                } | undefined;
+                min?: number | undefined;
+                max?: number | undefined;
+                currency?: string | undefined;
+                currencyLocale?: string | undefined;
+                multiselect?: boolean | undefined;
+                customErrorMessage?: string | undefined;
+                properties?: {
+                    [x: string]: /*elided*/ any;
+                } | undefined;
+                required?: string[] | undefined;
+                showExpr?: string | undefined;
+                password?: boolean | undefined;
+                order?: string[] | undefined;
+                nullable?: boolean | undefined;
+                dateFormat?: string | undefined;
+                title?: string | undefined;
+                placeholder?: string | undefined;
+                oneOf?: /*elided*/ any[] | undefined;
+                originalType?: string | undefined;
+            };
+        };
+        order?: string[] | undefined;
+        required: string[];
+    } | undefined;
     mod: {
         id: string;
         summary: string | undefined;

package/package/components/flows/flowStore.js

@@ -29,7 +29,7 @@ export async function getFirstStepSchema(flowState, flow) {
     if (!firstModuleId || !flowState[firstModuleId]) {
         throw new Error('no first step found');
     }
-    const schema = structuredClone(flowState[firstModuleId].schema);
+    const schema = $state.snapshot(flowState[firstModuleId].schema);
     const v = flow.value.modules[0].value;
     if (v.type !== 'rawscript' && v.type !== 'script') {
         throw new Error('only scripts can be used as a input schema');

package/package/components/flows/map/FlowJobsMenu.svelte

@@ -106,7 +106,7 @@ $effect(() => {
 				</MeltButton>
 			{/snippet}
 
-			{#snippet children({ item })}
+			{#snippet children({ item: childrenItem })}
 				<div class="flex flex-col px-1">
 					<input type="number" bind:value={filter} onkeydown={onKeydown} />
 
@@ -115,7 +115,7 @@ $effect(() => {
 							<VirtualList height={300} width="100%" itemCount={items.length} itemSize={24}>
 								{#snippet header()}{/snippet}
 								{#snippet footer()}{/snippet}
-								{#snippet children({ index: idx, style })}
+								{#snippet item({ index: idx, style })}
 									<div {style}>
 										<MenuItem
 											class={twMerge(
@@ -133,7 +133,7 @@ $effect(() => {
 												})
 												menu?.close()
 											}}
-											{item}
+											item={childrenItem}
 										>
 											#{items[idx].index + 1}
 										</MenuItem>