windmill-components 1.550.0 → 1.555.1

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

@@ -1,7 +1,7 @@
 interface Props {
     noEditor: boolean;
     disabled: boolean;
-    onTestFlow?: () => void;
+    onTestFlow?: () => Promise<string | undefined>;
     previewOpen: boolean;
 }
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {

package/package/components/flows/content/FlowInputsQuick.svelte

@@ -1,15 +1,17 @@
+<script module lang="ts">"use strict";
+let cachedOwners = {};
+let cachedIntegrations = [];
+</script>
+
 <script lang="ts">import { isCloudHosted } from '../../../cloud';
 import { sendUserToast } from '../../../toast';
 import FlowScriptPickerQuick from '../pickers/FlowScriptPickerQuick.svelte';
-import WorkspaceScriptPickerQuick from '../pickers/WorkspaceScriptPickerQuick.svelte';
 import { defaultScriptLanguages, processLangs } from '../../../scripts';
-import { defaultScripts, enterpriseLicense, userStore } from '../../../stores';
+import { defaultScripts, enterpriseLicense, userStore, workspaceStore } from '../../../stores';
 import { createEventDispatcher, getContext, onDestroy, onMount, untrack } from 'svelte';
-import PickHubScriptQuick from '../pickers/PickHubScriptQuick.svelte';
 import {} from '../../../gen';
 import ListFiltersQuick from '../../home/ListFiltersQuick.svelte';
 import { Folder, User } from 'lucide-svelte';
-import { copilotInfo } from '../../../stores';
 import { twMerge } from 'tailwind-merge';
 import { fade } from 'svelte/transition';
 import { flip } from 'svelte/animate';
@@ -19,14 +21,18 @@ import { SettingsIcon } from 'lucide-svelte';
 import DefaultScriptsInner from '../../DefaultScriptsInner.svelte';
 import GenAiQuick from './GenAiQuick.svelte';
 import FlowToplevelNode from '../pickers/FlowToplevelNode.svelte';
+import { copilotInfo } from '../../../aiStore';
 const dispatch = createEventDispatcher();
 let { summary = undefined, filter = $bindable(''), disableAi = false, preFilter = 'hub', funcDesc, owners = $bindable([]), loading = $bindable(false), small = false, kind, selectedKind = kind, displayPath = false, refreshCount = 0 } = $props();
+if ($workspaceStore && cachedOwners?.[$workspaceStore]) {
+    owners = cachedOwners[$workspaceStore];
+}
 let lang = $state(undefined);
 let filteredWorkspaceItems = $state([]);
 let hubCompletions = $state([]);
 const { insertButtonOpen } = getContext('FlowEditorContext');
 let selected = $state(undefined);
-let integrations = $state([]);
+let integrations = $state(cachedIntegrations);
 let customUi = getContext('customUi');
 function displayLang(lang, kind) {
     if (kind == 'trigger') {
@@ -365,41 +371,56 @@ let aiLength = $derived(funcDesc?.length > 0 && !disableAi && selectedKind != 'f
 			{#if !selected && (preFilter !== 'workspace' || funcDesc?.length > 0)}
 				<div class="pt-2 pb-0 text-2xs font-light text-secondary ml-2">Workspace</div>
 			{/if}
-			<WorkspaceScriptPickerQuick
-				bind:owners
-				bind:ownerFilter={selected}
-				bind:filteredWithOwner={filteredWorkspaceItems}
-				{filter}
-				kind={selectedKind}
-				selected={selectedByKeyboard - inlineScripts?.length - aiLength - topLevelNodes.length}
-				on:pickScript
-				on:pickFlow
-				{displayPath}
-				{refreshCount}
-			/>
+			{#await import('../pickers/WorkspaceScriptPickerQuick.svelte') then Module}
+				<Module.default
+					bind:owners={
+						() => owners,
+						(v) => {
+							$workspaceStore && (cachedOwners[$workspaceStore] = v)
+							owners = v
+						}
+					}
+					bind:ownerFilter={selected}
+					bind:filteredWithOwner={filteredWorkspaceItems}
+					{filter}
+					kind={selectedKind}
+					selected={selectedByKeyboard - inlineScripts?.length - aiLength - topLevelNodes.length}
+					on:pickScript
+					on:pickFlow
+					{displayPath}
+					{refreshCount}
+				/>
+			{/await}
 		{/if}
 		{#if selectedKind != 'preprocessor' && selectedKind != 'flow'}
 			{#if (!selected || selected?.kind === 'integrations') && (preFilter === 'hub' || preFilter === 'all')}
 				{#if !selected && preFilter !== 'hub'}
 					<div class=" pb-0 text-2xs font-light text-secondary ml-2">Hub</div>
 				{/if}
-
-				<PickHubScriptQuick
-					bind:items={hubCompletions}
-					bind:filter
-					bind:apps={integrations}
-					appFilter={selected?.name}
-					kind={selectedKind}
-					selected={selectedByKeyboard -
-						inlineScripts?.length -
-						aiLength -
-						filteredWorkspaceItems?.length -
-						topLevelNodes.length}
-					on:pickScript
-					bind:loading
-					{displayPath}
-					{refreshCount}
-				/>
+				{#await import('../pickers/PickHubScriptQuick.svelte') then Module}
+					<Module.default
+						bind:items={hubCompletions}
+						bind:filter
+						bind:apps={
+							() => integrations,
+							(v) => {
+								cachedIntegrations = v
+								integrations = v
+							}
+						}
+						appFilter={selected?.name}
+						kind={selectedKind}
+						selected={selectedByKeyboard -
+							inlineScripts?.length -
+							aiLength -
+							filteredWorkspaceItems?.length -
+							topLevelNodes.length}
+						on:pickScript
+						bind:loading
+						{displayPath}
+						{refreshCount}
+					/>
+				{/await}
 			{/if}
 		{/if}
 	</Scrollable>

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

@@ -26,8 +26,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     z_$$bindings?: Bindings;
 }
 declare const FlowInputsQuick: $$__sveltets_2_IsomorphicComponent<Props, {
-    pickScript: CustomEvent<any>;
-    pickFlow: CustomEvent<any>;
+    pickScript: any;
+    pickFlow: any;
     new: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;

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

@@ -486,7 +486,7 @@ function onJobDone() {
 														></div>
 													{/if}
 													<InputTransformSchemaForm
-														class="px-1 xl:px-2"
+														class="px-2 xl:px-4"
 														bind:this={inputTransformSchemaForm}
 														pickableProperties={stepPropPicker.pickableProperties}
 														schema={flowStateStore.val[$selectedId]?.schema ?? {}}
@@ -766,19 +766,14 @@ function onJobDone() {
 																	{#if flowModule.value['language'] === 'deno'}
 																		<ToggleButton
 																			value="s3_client"
-																			size="sm"
+																			small
 																			label="S3 lite client"
 																			{item}
 																		/>
 																	{:else}
-																		<ToggleButton
-																			value="s3_client"
-																			size="sm"
-																			label="Boto3"
-																			{item}
-																		/>
-																		<ToggleButton value="polars" size="sm" label="Polars" {item} />
-																		<ToggleButton value="duckdb" size="sm" label="DuckDB" {item} />
+																		<ToggleButton value="s3_client" small label="Boto3" {item} />
+																		<ToggleButton value="polars" small label="Polars" {item} />
+																		<ToggleButton value="duckdb" small label="DuckDB" {item} />
 																	{/if}
 																{/snippet}
 															</ToggleButtonGroup>

package/package/components/flows/flowInfers.d.ts

@@ -1,5 +1,65 @@
 import type { Schema } from '../../common';
 import type { FlowModule, InputTransform } from '../../gen';
+export declare const AI_AGENT_SCHEMA: {
+    $schema: string;
+    properties: {
+        provider: {
+            type: string;
+            format: string;
+        };
+        output_type: {
+            type: string;
+            description: string;
+            enum: string[];
+            default: string;
+        };
+        user_message: {
+            type: string;
+            description: string;
+        };
+        system_prompt: {
+            type: string;
+            description: string;
+        };
+        streaming: {
+            type: string;
+            description: string;
+            default: boolean;
+            showExpr: string;
+        };
+        messages_context_length: {
+            type: string;
+            description: string;
+            showExpr: string;
+        };
+        output_schema: {
+            type: string;
+            description: string;
+            format: string;
+            showExpr: string;
+        };
+        user_images: {
+            type: string;
+            description: string;
+            items: {
+                type: "object";
+                resourceType: string;
+            };
+        };
+        max_completion_tokens: {
+            type: string;
+            description: string;
+        };
+        temperature: {
+            type: string;
+            description: string;
+            showExpr: string;
+        };
+    };
+    required: string[];
+    type: string;
+    order: string[];
+};
 export declare function loadSchemaFromModule(module: FlowModule): Promise<{
     input_transforms: Record<string, InputTransform>;
     schema: Schema;

package/package/components/flows/flowInfers.js

@@ -1,6 +1,76 @@
 import { inferArgs, loadSchemaFromPath } from '../../infer';
 import { loadSchemaFlow } from '../../scripts';
 import { emptySchema } from '../../utils';
+export const AI_AGENT_SCHEMA = {
+    $schema: 'https://json-schema.org/draft/2020-12/schema',
+    properties: {
+        provider: {
+            type: 'object',
+            format: 'ai-provider'
+        },
+        output_type: {
+            type: 'string',
+            description: 'The type of output the AI agent will generate (text or image). Image output requires a configured workspace S3 storage, will ignore tools, and only works with OpenAI, Google AI and OpenRouter gemini-image-preview model.',
+            enum: ['text', 'image'],
+            default: 'text'
+        },
+        user_message: {
+            type: 'string',
+            description: 'The message to give as input to the AI agent. You can turn on chat input mode on the input interface to link this field to the message sent by the user.'
+        },
+        system_prompt: {
+            type: 'string',
+            description: 'The system prompt to give as input to the AI agent.'
+        },
+        streaming: {
+            type: 'boolean',
+            description: 'Whether to stream the output of the AI agent.',
+            default: false,
+            showExpr: "fields.output_type === 'text'"
+        },
+        messages_context_length: {
+            type: 'number',
+            description: 'Maximum number of conversation messages to store and retrieve from memory. If not set or 0, memory is disabled.',
+            showExpr: "fields.output_type === 'text'"
+        },
+        output_schema: {
+            type: 'object',
+            description: 'JSON schema that the AI agent will follow for its response format.',
+            format: 'json-schema',
+            showExpr: "fields.output_type === 'text'"
+        },
+        user_images: {
+            type: 'array',
+            description: 'Array of images to give as input to the AI agent. Requires a configured workspace S3 storage.',
+            items: {
+                type: 'object',
+                resourceType: 's3object'
+            }
+        },
+        max_completion_tokens: {
+            type: 'number',
+            description: 'The maximum number of output tokens.'
+        },
+        temperature: {
+            type: 'number',
+            description: 'Controls randomness in text generation. Range: 0.0 (deterministic) to 2.0 (random).',
+            showExpr: "fields.output_type === 'text'"
+        }
+    },
+    required: ['provider', 'user_message', 'output_type'],
+    type: 'object',
+    order: [
+        'provider',
+        'output_type',
+        'user_message',
+        'system_prompt',
+        'messages_context_length',
+        'output_schema',
+        'user_images',
+        'max_completion_tokens',
+        'temperature'
+    ]
+};
 export async function loadSchemaFromModule(module) {
     const mod = module.value;
     if (mod.type == 'rawscript' || mod.type === 'script' || mod.type === 'flow') {
@@ -42,80 +112,16 @@ export async function loadSchemaFromModule(module) {
         };
     }
     else if (mod.type === 'aiagent') {
-        const schema = {
-            $schema: 'https://json-schema.org/draft/2020-12/schema',
-            properties: {
-                provider: {
-                    type: 'object',
-                    format: 'ai-provider'
-                },
-                output_type: {
-                    type: 'string',
-                    description: 'The type of output the AI agent will generate (text or image). Image output requires a configured workspace S3 storage, will ignore tools, and only works with OpenAI, Google AI and OpenRouter gemini-image-preview model.',
-                    enum: ['text', 'image'],
-                    default: 'text'
-                },
-                user_message: {
-                    type: 'string',
-                    description: 'The message to give as input to the AI agent.'
-                },
-                system_prompt: {
-                    type: 'string',
-                    description: 'The system prompt to give as input to the AI agent.'
-                },
-                streaming: {
-                    type: 'boolean',
-                    description: 'Whether to stream the output of the AI agent (only used if output_type is text).',
-                    default: false,
-                    showExpr: "fields.output_type === 'text'"
-                },
-                user_images: {
-                    type: 'array',
-                    description: 'Array of images to give as input to the AI agent. Requires a configured workspace S3 storage.',
-                    items: {
-                        type: 'object',
-                        resourceType: 's3object'
-                    }
-                },
-                max_completion_tokens: {
-                    type: 'number',
-                    description: 'The maximum number of output tokens.'
-                },
-                temperature: {
-                    type: 'number',
-                    description: 'Controls randomness in text generation. Range: 0.0 (deterministic) to 2.0 (random).',
-                    showExpr: "fields.output_type === 'text'"
-                },
-                output_schema: {
-                    type: 'object',
-                    description: 'JSON schema that the AI agent will follow for its response format (only used if output_type is text).',
-                    format: 'json-schema',
-                    showExpr: "fields.output_type === 'text'"
-                }
-            },
-            required: ['provider', 'user_message', 'output_type'],
-            type: 'object',
-            order: [
-                'provider',
-                'output_type',
-                'user_message',
-                'system_prompt',
-                'user_images',
-                'max_completion_tokens',
-                'temperature',
-                'output_schema'
-            ]
-        };
         let input_transforms = mod.input_transforms ?? {};
         return {
-            input_transforms: Object.keys(schema?.properties ?? {}).reduce((accu, key) => {
+            input_transforms: Object.keys(AI_AGENT_SCHEMA.properties ?? {}).reduce((accu, key) => {
                 accu[key] = input_transforms[key] ?? {
                     type: 'static',
                     value: undefined
                 };
                 return accu;
             }, {}),
-            schema
+            schema: AI_AGENT_SCHEMA
         };
     }
     return {

package/package/components/flows/{flowStore.d.ts → flowStore.svelte.d.ts}

@@ -49,6 +49,7 @@ export declare function getFirstStepSchema(flowState: FlowState, flow: OpenFlow)
                 placeholder?: string | undefined;
                 oneOf?: /*elided*/ any[] | undefined;
                 originalType?: string | undefined;
+                disabled?: boolean | undefined;
             };
         };
         order?: string[] | undefined;

package/package/components/flows/header/FlowPreviewButtons.svelte

@@ -36,7 +36,7 @@ export async function runPreview() {
     }
     previewMode = 'whole';
     flowPreviewContent?.refresh();
-    flowPreviewContent?.test();
+    return await flowPreviewContent?.test();
 }
 export function cancelTest() {
     flowPreviewContent?.cancelTest();

package/package/components/flows/map/FlowErrorHandlerItem.svelte

@@ -7,7 +7,7 @@ import { twMerge } from 'tailwind-merge';
 import { refreshStateStore } from '../../../svelte5Utils.svelte';
 import ModuleAcceptReject, { getAiModuleAction } from '../../copilot/chat/flow/ModuleAcceptReject.svelte';
 import { aiModuleActionToBgColor } from '../../copilot/chat/flow/utils';
-let { small, clazz } = $props();
+let { small, clazz, disableAi } = $props();
 const dispatch = createEventDispatcher();
 const { selectedId, flowStateStore, flowStore } = getContext('FlowEditorContext');
 async function insertFailureModule(inlineScript, wsScript) {
@@ -82,8 +82,10 @@ const action = $derived(getAiModuleAction('failure'));
 		{/if}
 	</div>
 {:else}
+	<!-- Index 0 is used by the tutorial to identify the first "Add step" -->
 	<InsertModuleButton
-		index={0}
+		{disableAi}
+		index="error-handler-button"
 		placement={'bottom-center'}
 		on:new={(e) => {
 			insertFailureModule(e.detail.inlineScript)

package/package/components/flows/map/FlowErrorHandlerItem.svelte.d.ts

@@ -2,6 +2,7 @@ import type { ScriptLang } from '../../../gen';
 type $$ComponentProps = {
     small: boolean;
     clazz: string;
+    disableAi?: boolean;
 };
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {

package/package/components/flows/map/FlowModuleSchemaItem.svelte

@@ -11,7 +11,7 @@ import { dfs as dfsPreviousResults } from '../previousResults';
 import { Drawer } from '../../common';
 import DrawerContent from '../../common/drawer/DrawerContent.svelte';
 import { getDependeeAndDependentComponents } from '../flowExplorer';
-import { replaceId } from '../flowStore';
+import { replaceId } from '../flowStore.svelte';
 import FlowModuleSchemaItemViewer from './FlowModuleSchemaItemViewer.svelte';
 import OutputPicker from '../propPicker/OutputPicker.svelte';
 import OutputPickerInner from '../propPicker/OutputPickerInner.svelte';

package/package/components/flows/map/FlowModuleSchemaMap.svelte

@@ -6,12 +6,13 @@ import { push } from '../../../history.svelte';
 import ConfirmationModal from '../../common/confirmationModal/ConfirmationModal.svelte';
 import Portal from '../../Portal.svelte';
 import { getDependentComponents } from '../flowExplorer';
-import { copilotInfo, tutorialsToDo, workspaceStore } from '../../../stores';
+import { tutorialsToDo, workspaceStore } from '../../../stores';
+import { copilotInfo } from '../../../aiStore';
 import FlowTutorials from '../../FlowTutorials.svelte';
 import { ignoredTutorials } from '../../tutorials/ignoredTutorials';
 import { tutorialInProgress } from '../../../tutorialUtils';
 import FlowGraphV2 from '../../graph/FlowGraphV2.svelte';
-import { replaceId } from '../flowStore';
+import { replaceId } from '../flowStore.svelte';
 import { setScheduledPollSchedule } from '../../triggers';
 import { JobService } from '../../../gen';
 import { dfsByModule } from '../previousResults';
@@ -259,6 +260,7 @@ $effect(() => {
 		class={`z-50 absolute inline-flex flex-col gap-2 top-3 left-1/2 -translate-x-1/2 flex-initial  items-center transition-colors duration-[400ms] ease-linear bg-surface-100`}
 	>
 		<FlowStickyNode
+			{disableAi}
 			{showFlowAiButton}
 			{disableSettings}
 			{disableStaticInputs}
@@ -298,6 +300,7 @@ $effect(() => {
 			{showJobStatus}
 			suspendStatus={suspendStatus.val}
 			{flowHasChanged}
+			chatInputEnabled={Boolean(flowStore.val.value?.chat_input_enabled)}
 			onDelete={(id) => {
 				dependents = getDependentComponents(id, flowStore.val)
 				const cb = () => {

package/package/components/flows/map/FlowStickyNode.svelte

@@ -5,7 +5,7 @@ import { twMerge } from 'tailwind-merge';
 import FlowErrorHandlerItem from './FlowErrorHandlerItem.svelte';
 import FlowAIButton from '../../copilot/chat/flow/FlowAIButton.svelte';
 import Popover from '../../Popover.svelte';
-let { disableSettings, disableStaticInputs, smallErrorHandler, aiChatOpen, showFlowAiButton, toggleAiChat } = $props();
+let { disableSettings, disableStaticInputs, smallErrorHandler, aiChatOpen, showFlowAiButton, toggleAiChat, disableAi } = $props();
 const { selectedId, flowStore } = getContext('FlowEditorContext');
 const nodeClass = 'border w-fit rounded p-1 px-2 bg-surface text-sm cursor-pointer flex items-center h-[28px] hover:!bg-surface-secondary active:!bg-surface';
 const nodeSelectedClass = 'outline outline-offset-1 outline-2 outline-slate-800 dark:bg-white/5 dark:outline-slate-400/60 dark:outline-gray-400';
@@ -45,7 +45,7 @@ const nodeSelectedClass = 'outline outline-offset-1 outline-2 outline-slate-800
 		</Popover>
 	{/if}
 	<Popover>
-		<FlowErrorHandlerItem small={smallErrorHandler} on:generateStep clazz={nodeClass} />
+		<FlowErrorHandlerItem {disableAi} small={smallErrorHandler} on:generateStep clazz={nodeClass} />
 		{#snippet text()}
 			Error Handler
 		{/snippet}

package/package/components/flows/map/FlowStickyNode.svelte.d.ts

@@ -5,6 +5,7 @@ interface Props {
     aiChatOpen?: boolean;
     showFlowAiButton?: boolean;
     toggleAiChat?: () => void;
+    disableAi?: boolean;
 }
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {

package/package/components/flows/map/InsertModuleButton.svelte

@@ -4,7 +4,7 @@ import { twMerge } from 'tailwind-merge';
 import PopupV2 from '../../common/popup/PopupV2.svelte';
 import { flip, offset } from 'svelte-floating-ui/dom';
 import { SchedulePollIcon } from '../../icons';
-let { index = 0, funcDesc = $bindable(''), kind = 'script', iconSize = 12, clazz = '', placement = 'bottom-center' } = $props();
+let { index = 0, funcDesc = $bindable(''), kind = 'script', iconSize = 12, clazz = '', placement = 'bottom-center', disableAi = false } = $props();
 let floatingConfig = {
     strategy: 'fixed',
     // @ts-ignore
@@ -44,7 +44,9 @@ shouldUsePortal={true} -->
 				'w-[17.5px] h-[17.5px] flex items-center justify-center !outline-[1px] outline dark:outline-gray-500 outline-gray-300 text-secondary bg-surface focus:outline-none hover:bg-surface-hover rounded',
 				clazz
 			)}
-			onpointerdown={() => (open = !open)}
+			onpointerdown={() => {
+				open = !open
+			}}
 		>
 			{#if kind === 'trigger'}
 				<SchedulePollIcon size={14} />
@@ -67,6 +69,7 @@ shouldUsePortal={true} -->
 			on:pickScript
 			allowTrigger={index == 0}
 			{kind}
+			{disableAi}
 		/>
 	{/snippet}
 </PopupV2>

package/package/components/flows/map/InsertModuleButton.svelte.d.ts

@@ -2,12 +2,13 @@ type Alignment = 'start' | 'end' | 'center';
 type Side = 'top' | 'bottom';
 type Placement = `${Side}-${Alignment}`;
 interface Props {
-    index?: number;
+    index?: number | 'error-handler-button';
     funcDesc?: string;
     kind?: 'script' | 'trigger' | 'preprocessor' | 'failure';
     iconSize?: number;
     clazz?: string;
     placement?: Placement;
+    disableAi?: boolean;
 }
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
@@ -25,8 +26,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 declare const InsertModuleButton: $$__sveltets_2_IsomorphicComponent<Props, {
     insert: CustomEvent<any>;
     new: CustomEvent<any>;
-    pickFlow: CustomEvent<any>;
-    pickScript: CustomEvent<any>;
+    pickFlow: any;
+    pickScript: any;
 } & {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, "funcDesc">;

package/package/components/flows/map/InsertModuleInner.svelte

@@ -17,6 +17,7 @@ let loading = $state(false);
 let small = $derived(kind === 'preprocessor' || kind === 'failure');
 let width = $state(0);
 let height = $state(0);
+let owners = $state([]);
 let displayPath = $derived(width > 650 || height > 400);
 </script>
 
@@ -46,7 +47,7 @@ let displayPath = $derived(width > 650 || height > 400);
 		{#if selectedKind != 'preprocessor' && selectedKind != 'flow'}
 			<ToggleHubWorkspaceQuick bind:selected={preFilter} />
 		{/if}
-		<RefreshButton {loading} on:click={() => (refreshCount.val += 1)} />
+		<RefreshButton size="md" light {loading} on:click={() => (refreshCount.val += 1)} />
 	</div>
 
 	<div class="flex flex-row grow min-h-0">
@@ -141,6 +142,7 @@ let displayPath = $derived(width > 650 || height > 400);
 			{disableAi}
 			{funcDesc}
 			{kind}
+			bind:owners
 			on:close={() => {
 				dispatch('close')
 			}}

package/package/components/flows/map/InsertModuleInner.svelte.d.ts

@@ -22,8 +22,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
 declare const InsertModuleInner: $$__sveltets_2_IsomorphicComponent<Props, {
     insert: CustomEvent<any>;
     new: CustomEvent<any>;
-    pickScript: CustomEvent<any>;
-    pickFlow: CustomEvent<any>;
+    pickScript: any;
+    pickFlow: any;
     close: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;

package/package/components/flows/map/VirtualItem.svelte

@@ -41,13 +41,12 @@ const outputType = $derived(showJobStatus
 		<div class="flex flex-col w-full">
 			<div
 				style={borderColor ? `border-color: ${borderColor};` : 'border: 0'}
-				class="flex flex-row gap-1 justify-between {center
+				class="flex flex-row justify-between {center
 					? 'items-center'
 					: 'items-baseline'} w-full overflow-hidden rounded-sm border p-2 text-2xs module text-primary border-gray-400 dark:border-gray-600"
 			>
 				{#if icon}
 					{@render icon?.()}
-					<span class="mr-2"></span>
 				{/if}
 				<div class="flex flex-col flex-grow shrink-0 max-w-full min-w-0">
 					{#if label}