windmill-components 1.642.0 → 1.655.0

package/package/components/copilot/chat/flow/AIChangesWarningModal.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">import { Button } from '../../../common';
 import Modal from '../../../common/modal/Modal.svelte';
-import { AlertTriangleIcon } from 'lucide-svelte';
 let { open = $bindable(false), onConfirm } = $props();
 function handleConfirm() {
     open = false;
@@ -9,20 +8,18 @@ function handleConfirm() {
 </script>
 
 <Modal bind:open title="AI Changes Will Be Lost">
-	<div slot="title" class="flex items-center gap-2">
-		<AlertTriangleIcon size={20} class="text-orange-500" />
-		AI Changes Will Be Lost
-	</div>
 	<div class="py-4">
 		<p class="text-gray-700 dark:text-gray-300">
 			You have pending AI changes that will be rejected when saving. Do you want to continue?
 		</p>
 	</div>
-	<div slot="actions">
-		<div class="flex gap-2 justify-end">
-			<Button variant="contained" color="red" on:click={handleConfirm}>
-				Reject changes and save
-			</Button>
+	{#snippet actions()}
+		<div>
+			<div class="flex gap-2 justify-end">
+				<Button variant="contained" color="red" on:click={handleConfirm}>
+					Reject changes and save
+				</Button>
+			</div>
 		</div>
-	</div>
+	{/snippet}
 </Modal>

package/package/components/copilot/lib.d.ts

@@ -1,5 +1,5 @@
 import type { AIProvider, AIProviderModel } from '../../gen';
-import { type DBSchema, type GraphqlSchema, type SQLSchema } from '../../stores';
+import { type DBSchema, type SQLSchema } from '../../stores';
 import OpenAI from 'openai';
 import type { ChatCompletionChunk, ChatCompletionCreateParams, ChatCompletionCreateParamsNonStreaming, ChatCompletionCreateParamsStreaming, ChatCompletionMessageParam } from 'openai/resources/index.mjs';
 import Anthropic from '@anthropic-ai/sdk';
@@ -70,7 +70,8 @@ type CopilotOptions = ScriptGenerationOptions | EditScriptOptions | FixScriptOpi
 export declare function addResourceTypes(scriptOptions: CopilotOptions, prompt: string): Promise<string>;
 export declare const MAX_SCHEMA_LENGTH: number;
 export declare function addThousandsSeparator(n: number): string;
-export declare function stringifySchema(dbSchema: Omit<SQLSchema, 'stringified'> | Omit<GraphqlSchema, 'stringified'>): string;
+export declare function stringifySchema(dbSchema: Omit<SQLSchema, 'stringified'>): string;
+export declare function stringifyGraphqlSchema(schema: unknown): Promise<string>;
 export declare function getProviderAndCompletionConfig<K extends boolean>({ messages, stream, tools, forceModelProvider }: {
     messages: ChatCompletionMessageParam[];
     stream: K;

package/package/components/copilot/lib.js

@@ -1,5 +1,4 @@
 import { workspaceStore } from '../../stores';
-import { buildClientSchema, printSchema } from 'graphql';
 import OpenAI from 'openai';
 import Anthropic from '@anthropic-ai/sdk';
 import { get } from 'svelte/store';
@@ -34,7 +33,7 @@ export const AI_PROVIDERS = {
     },
     anthropic: {
         label: 'Anthropic',
-        defaultModels: ['claude-sonnet-4-0', 'claude-sonnet-4-0/thinking', 'claude-3-5-haiku-latest']
+        defaultModels: ['claude-sonnet-4-6', 'claude-sonnet-4-6/thinking', 'claude-3-5-haiku-latest']
     },
     mistral: {
         label: 'Mistral',
@@ -46,7 +45,7 @@ export const AI_PROVIDERS = {
     },
     googleai: {
         label: 'Google AI',
-        defaultModels: ['gemini-2.0-flash', 'gemini-1.5-flash', 'gemini-1.5-pro']
+        defaultModels: ['gemini-2.5-flash', 'gemini-2.5-pro', 'gemini-2.5-flash-lite', 'gemini-3-flash', 'gemini-3.1-pro', 'gemini-3.1-flash-lite']
     },
     groq: {
         label: 'Groq',
@@ -426,36 +425,33 @@ export function addThousandsSeparator(n) {
 }
 export function stringifySchema(dbSchema) {
     const { schema, lang } = dbSchema;
-    if (lang === 'graphql') {
-        let graphqlSchema = printSchema(buildClientSchema(schema));
-        return graphqlSchema;
-    }
-    else {
-        let smallerSchema = {};
-        for (const schemaKey in schema) {
-            smallerSchema[schemaKey] = {};
-            for (const tableKey in schema[schemaKey]) {
-                smallerSchema[schemaKey][tableKey] = [];
-                for (const colKey in schema[schemaKey][tableKey]) {
-                    const col = schema[schemaKey][tableKey][colKey];
-                    const p = [colKey, col.type, col.required];
-                    if (col.default) {
-                        p.push(col.default);
-                    }
-                    smallerSchema[schemaKey][tableKey].push(p);
+    let smallerSchema = {};
+    for (const schemaKey in schema) {
+        smallerSchema[schemaKey] = {};
+        for (const tableKey in schema[schemaKey]) {
+            smallerSchema[schemaKey][tableKey] = [];
+            for (const colKey in schema[schemaKey][tableKey]) {
+                const col = schema[schemaKey][tableKey][colKey];
+                const p = [colKey, col.type, col.required];
+                if (col.default) {
+                    p.push(col.default);
                 }
+                smallerSchema[schemaKey][tableKey].push(p);
             }
         }
-        let finalSchema = smallerSchema;
-        if (dbSchema.publicOnly) {
-            finalSchema =
-                smallerSchema.public || smallerSchema.PUBLIC || smallerSchema.dbo || smallerSchema;
-        }
-        else if (lang === 'mysql' && Object.keys(smallerSchema).length === 1) {
-            finalSchema = smallerSchema[Object.keys(smallerSchema)[0]];
-        }
-        return JSON.stringify(finalSchema);
     }
+    let finalSchema = smallerSchema;
+    if (dbSchema.publicOnly) {
+        finalSchema = smallerSchema.public || smallerSchema.PUBLIC || smallerSchema.dbo || smallerSchema;
+    }
+    else if (lang === 'mysql' && Object.keys(smallerSchema).length === 1) {
+        finalSchema = smallerSchema[Object.keys(smallerSchema)[0]];
+    }
+    return JSON.stringify(finalSchema);
+}
+export async function stringifyGraphqlSchema(schema) {
+    const { buildClientSchema, printSchema } = await import('graphql');
+    return printSchema(buildClientSchema(schema));
 }
 function addDBSChema(scriptOptions, prompt) {
     const { dbSchema, language } = scriptOptions;

package/package/components/custom_ui.d.ts

@@ -52,6 +52,7 @@ export type DisplayResultUi = {
 };
 export type PreviewPanelUi = {
     disableHistory?: boolean;
+    disableTracing?: boolean;
     disableTriggerCaptures?: boolean;
     disableTriggerButton?: boolean;
     displayResult?: DisplayResultUi;
@@ -81,6 +82,8 @@ export type EditorBarUi = {
     ducklake?: boolean;
     dataTable?: boolean;
     debug?: boolean;
+    history?: boolean;
+    saveToWorkspace?: boolean;
 };
 export type EditableSchemaFormUi = {
     jsonOnly?: boolean;

package/package/components/dbManagerDrawerModel.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { DbInput } from './dbTypes';
+export interface DbManagerUriState {
+    readonly input: DbInput | undefined;
+    readonly effectiveInput: DbInput | undefined;
+    readonly isDatatableInput: boolean;
+    selectedDatatable: string | undefined;
+    selectedSchema: string | undefined;
+    selectedTable: string | undefined;
+    readonly open: boolean;
+    openDrawer: (nInput: DbInput) => void;
+    closeDrawer: () => void;
+}
+export declare function useDbManagerUriState(): DbManagerUriState;

package/package/components/dbManagerDrawerModel.svelte.js

@@ -0,0 +1,182 @@
+import { z } from 'zod';
+import { useSearchParams } from '../svelte5UtilsKit.svelte';
+import { isDbType } from './dbTypes';
+/**
+ * Single URL param `dbm` encodes the full DB manager state:
+ *   firstSegment~path~schema.table
+ *
+ * firstSegment:
+ *   datatable              – database with datatable:// resource (resourceType always postgresql)
+ *   ducklake               – ducklake connection
+ *   postgresql, mysql, …   – regular database (the segment IS the resource type)
+ *
+ * schema.table (third segment, optional):
+ *   schema.table  – both
+ *   .table        – table only
+ *   schema.       – schema only
+ *   (omitted)     – neither
+ *
+ * Default schemas (omitted from URL, restored on parse):
+ *   datatable → public
+ *   ducklake  → main
+ *
+ * Examples:
+ *   datatable~main~.customers          (schema "public" implied)
+ *   ducklake~main~.orders              (schema "main" implied)
+ *   postgresql~$res:u/user/my_pg~public.customers
+ */
+const dbManagerSchema = z.object({
+    dbm: z.string().nullable()
+});
+function parseDbm(raw) {
+    if (!raw || typeof raw !== 'string')
+        return null;
+    const parts = raw.split('~');
+    if (parts.length < 2 || !parts[1])
+        return null;
+    const firstSeg = parts[0];
+    const path = parts[1];
+    const schemaTable = parts[2] ?? '';
+    let type;
+    let resType;
+    if (firstSeg === 'datatable') {
+        type = 'datatable';
+    }
+    else if (firstSeg === 'ducklake') {
+        type = 'ducklake';
+    }
+    else if (isDbType(firstSeg)) {
+        type = 'database';
+        resType = firstSeg;
+    }
+    else {
+        return null;
+    }
+    let schema;
+    let table;
+    if (schemaTable) {
+        const dotIdx = schemaTable.indexOf('.');
+        if (dotIdx === 0) {
+            table = schemaTable.slice(1) || undefined;
+        }
+        else if (dotIdx === schemaTable.length - 1) {
+            schema = schemaTable.slice(0, -1) || undefined;
+        }
+        else if (dotIdx > 0) {
+            schema = schemaTable.slice(0, dotIdx);
+            table = schemaTable.slice(dotIdx + 1);
+        }
+    }
+    // Restore default schema when omitted for datatable/ducklake
+    if (!schema && table && type in defaultSchemas) {
+        schema = defaultSchemas[type];
+    }
+    return { type, path, resType, schema, table };
+}
+const defaultSchemas = { datatable: 'public', ducklake: 'main' };
+function buildDbm(p) {
+    const firstSeg = p.type === 'database' ? p.resType : p.type;
+    const schema = p.schema === defaultSchemas[p.type] ? undefined : p.schema;
+    let schemaTable = '';
+    if (schema && p.table) {
+        schemaTable = `${schema}.${p.table}`;
+    }
+    else if (p.table) {
+        schemaTable = `.${p.table}`;
+    }
+    else if (schema) {
+        schemaTable = `${schema}.`;
+    }
+    return schemaTable ? `${firstSeg}~${p.path}~${schemaTable}` : `${firstSeg}~${p.path}`;
+}
+export function useDbManagerUriState() {
+    const params = useSearchParams(dbManagerSchema);
+    const parsed = $derived(parseDbm(params.dbm));
+    let input = $derived.by(() => {
+        if (!parsed)
+            return undefined;
+        if (parsed.type === 'ducklake') {
+            return {
+                type: 'ducklake',
+                ducklake: parsed.path,
+                specificTable: parsed.table
+            };
+        }
+        // datatable or database
+        const resType = parsed.type === 'datatable' ? 'postgresql' : parsed.resType;
+        if (!isDbType(resType ?? undefined))
+            return undefined;
+        return {
+            type: 'database',
+            resourceType: resType,
+            resourcePath: parsed.type === 'datatable' ? `datatable://${parsed.path}` : parsed.path,
+            specificSchema: parsed.schema,
+            specificTable: parsed.table
+        };
+    });
+    const isDatatableInput = $derived(parsed?.type === 'datatable');
+    function updateField(updates) {
+        const p = parseDbm(params.dbm);
+        if (!p)
+            return;
+        Object.assign(p, updates);
+        params.dbm = buildDbm(p);
+    }
+    function openDrawer(nInput) {
+        if (nInput.type === 'database') {
+            const isDatatable = nInput.resourcePath.startsWith('datatable://');
+            params.dbm = buildDbm({
+                type: isDatatable ? 'datatable' : 'database',
+                path: isDatatable ? nInput.resourcePath.slice('datatable://'.length) : nInput.resourcePath,
+                resType: isDatatable ? undefined : nInput.resourceType,
+                schema: nInput.specificSchema,
+                table: nInput.specificTable
+            });
+        }
+        else {
+            params.dbm = buildDbm({
+                type: 'ducklake',
+                path: nInput.ducklake,
+                table: nInput.specificTable
+            });
+        }
+    }
+    function closeDrawer() {
+        params.dbm = null;
+    }
+    return {
+        get input() {
+            return input;
+        },
+        get effectiveInput() {
+            return input;
+        },
+        get isDatatableInput() {
+            return isDatatableInput;
+        },
+        get selectedDatatable() {
+            return parsed?.type === 'datatable' ? parsed.path : undefined;
+        },
+        set selectedDatatable(v) {
+            if (v)
+                updateField({ path: v });
+        },
+        get selectedSchema() {
+            return parsed?.schema;
+        },
+        set selectedSchema(v) {
+            updateField({ schema: v });
+        },
+        get selectedTable() {
+            return parsed?.table;
+        },
+        set selectedTable(v) {
+            updateField({ table: v });
+        },
+        get open() {
+            return !!input;
+        },
+        openDrawer,
+        closeDrawer
+    };
+}

package/package/components/details/ClipboardPanel.svelte

@@ -2,27 +2,24 @@
 import { Copy } from 'lucide-svelte';
 import { twMerge } from 'tailwind-merge';
 import { inputSizeClasses } from '../text_input/TextInput.svelte';
-export let content;
-export let title = undefined;
-export let size = 'md';
-export let disabled = false;
+let { content, title = undefined, size = 'md', disabled = false, class: className = '' } = $props();
 </script>
 
 {#if title !== undefined}
 	<div class="text-xs font-semibold">{title}</div>
 {/if}
 
-<!-- svelte-ignore a11y-click-events-have-key-events -->
-<!-- svelte-ignore a11y-no-static-element-interactions -->
+<!-- svelte-ignore a11y_click_events_have_key_events -->
+<!-- svelte-ignore a11y_no_static_element_interactions -->
 <div
 	class={twMerge(
 		'grow min-w-0 w-full border flex items-center bg-surface-secondary hover:opacity-60 transition-opacity text-primary justify-between rounded-md',
 		inputSizeClasses[size],
-		$$props.class
+		className
 	)}
 	class:cursor-not-allowed={disabled}
 	class:cursor-pointer={!disabled}
-	on:click={(e) => {
+	onclick={(e) => {
 		if (disabled) {
 			return
 		}

package/package/components/details/ClipboardPanel.svelte.d.ts

@@ -1,24 +1,10 @@
-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> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const ClipboardPanel: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: any;
+interface Props {
     content: string;
-    title?: string | undefined | undefined;
-    size?: "sm" | "md" | undefined;
-    disabled?: boolean | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type ClipboardPanel = InstanceType<typeof ClipboardPanel>;
+    title?: string | undefined;
+    size?: 'sm' | 'md';
+    disabled?: boolean;
+    class?: string;
+}
+declare const ClipboardPanel: import("svelte").Component<Props, {}, "">;
+type ClipboardPanel = ReturnType<typeof ClipboardPanel>;
 export default ClipboardPanel;

package/package/components/details/ErrorHandlerToggleButton.svelte

@@ -4,10 +4,7 @@ import { FlowService, ScriptService } from '../../gen';
 import { sendUserToast } from '../../toast';
 import { workspaceStore } from '../../stores';
 import Tooltip from '../Tooltip.svelte';
-export let kind;
-export let scriptOrFlowPath;
-export let errorHandlerMuted;
-export let iconOnly = true;
+let { kind, scriptOrFlowPath, errorHandlerMuted = $bindable(), iconOnly = true } = $props();
 async function toggleErrorHandler() {
     if ($workspaceStore !== undefined) {
         try {

package/package/components/details/ErrorHandlerToggleButton.svelte.d.ts

@@ -1,23 +1,9 @@
-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> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const ErrorHandlerToggleButton: $$__sveltets_2_IsomorphicComponent<{
-    kind: "script" | "flow";
+interface Props {
+    kind: 'script' | 'flow';
     scriptOrFlowPath: string;
     errorHandlerMuted: boolean | undefined;
     iconOnly?: boolean;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type ErrorHandlerToggleButton = InstanceType<typeof ErrorHandlerToggleButton>;
+}
+declare const ErrorHandlerToggleButton: import("svelte").Component<Props, {}, "errorHandlerMuted">;
+type ErrorHandlerToggleButton = ReturnType<typeof ErrorHandlerToggleButton>;
 export default ErrorHandlerToggleButton;

package/package/components/details/ErrorHandlerToggleButtonV2.svelte

@@ -2,12 +2,8 @@
 import { FlowService, ScriptService } from '../../gen';
 import { sendUserToast } from '../../toast';
 import { workspaceStore } from '../../stores';
-export let kind;
-export let scriptOrFlowPath;
-export let errorHandlerMuted;
-export let textDisabled = false;
-let toggleState = errorHandlerMuted;
-export let color = undefined;
+let { kind, scriptOrFlowPath, errorHandlerMuted = $bindable(), textDisabled = false, color = undefined } = $props();
+let toggleState = $state(errorHandlerMuted);
 async function toggleErrorHandler() {
     toggleState = !toggleState;
     if ($workspaceStore !== undefined) {

package/package/components/details/ErrorHandlerToggleButtonV2.svelte.d.ts

@@ -1,24 +1,10 @@
-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> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const ErrorHandlerToggleButtonV2: $$__sveltets_2_IsomorphicComponent<{
-    kind: "script" | "flow";
+interface Props {
+    kind: 'script' | 'flow';
     scriptOrFlowPath: string;
     errorHandlerMuted: boolean | undefined;
     textDisabled?: boolean;
-    color?: "nord" | "red" | "blue" | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type ErrorHandlerToggleButtonV2 = InstanceType<typeof ErrorHandlerToggleButtonV2>;
+    color?: 'nord' | 'red' | 'blue' | undefined;
+}
+declare const ErrorHandlerToggleButtonV2: import("svelte").Component<Props, {}, "errorHandlerMuted">;
+type ErrorHandlerToggleButtonV2 = ReturnType<typeof ErrorHandlerToggleButtonV2>;
 export default ErrorHandlerToggleButtonV2;

package/package/components/flows/CreateActionsApp.svelte

@@ -3,6 +3,8 @@ import { base } from '../../base';
 import { Button } from '../common';
 import Drawer from '../common/drawer/Drawer.svelte';
 import DrawerContent from '../common/drawer/DrawerContent.svelte';
+import Tabs from '../common/tabs/Tabs.svelte';
+import Tab from '../common/tabs/Tab.svelte';
 import Modal from '../common/modal/Modal.svelte';
 import { LayoutDashboard, Loader2, Plus, Code2 } from 'lucide-svelte';
 import { importStore } from '../apps/store';
@@ -10,10 +12,20 @@ import YAML from 'yaml';
 let drawer = undefined;
 let pendingRaw = $state('');
 let importType = $state('yaml');
+let appKind = $state('lowcode');
 let appTypeModalOpen = $state(false);
 async function importRaw() {
-    $importStore = importType === 'yaml' ? YAML.parse(pendingRaw) : JSON.parse(pendingRaw);
-    await goto('/apps/add?nodraft=true');
+    const parsed = importType === 'yaml' ? YAML.parse(pendingRaw) : JSON.parse(pendingRaw);
+    if (appKind === 'fullcode') {
+        // Navigation to /apps_raw/add triggers a full page reload (for cross-origin isolation),
+        // so the in-memory importStore would be lost. Use sessionStorage instead.
+        sessionStorage.setItem('rawAppImport', JSON.stringify(parsed));
+        await goto('/apps_raw/add?nodraft=true');
+    }
+    else {
+        $importStore = parsed;
+        await goto('/apps/add?nodraft=true');
+    }
     drawer?.closeDrawer?.();
 }
 function openAppTypeModal() {
@@ -42,17 +54,19 @@ function selectFullCode() {
 			variant="accent"
 			dropdownItems={[
 				{
-					label: 'Import low-code app from YAML',
+					label: 'Import low-code app',
 					onClick: () => {
-						drawer?.toggleDrawer?.()
+						appKind = 'lowcode'
 						importType = 'yaml'
+						drawer?.toggleDrawer?.()
 					}
 				},
 				{
-					label: 'Import low-code app from JSON',
+					label: 'Import full-code app',
 					onClick: () => {
+						appKind = 'fullcode'
+						importType = 'yaml'
 						drawer?.toggleDrawer?.()
-						importType = 'json'
 					}
 				}
 			]}
@@ -109,22 +123,32 @@ function selectFullCode() {
 	</div>
 </Modal>
 
-<!-- Raw JSON -->
+<!-- Import Drawer -->
 <Drawer bind:this={drawer} size="800px">
 	<DrawerContent
-		title={'Import low-code app from ' + (importType === 'yaml' ? 'YAML' : 'JSON')}
+		title={appKind === 'fullcode' ? 'Import full-code app' : 'Import low-code app'}
 		on:close={() => drawer?.toggleDrawer?.()}
 	>
-		{#await import('../SimpleEditor.svelte')}
-			<Loader2 class="animate-spin" />
-		{:then Module}
-			<Module.default
-				bind:code={pendingRaw}
-				lang={importType}
-				class="h-full"
-				fixedOverflowWidgets={false}
-			/>
-		{/await}
+		<Tabs bind:selected={importType}>
+			<Tab value="yaml" label="YAML" />
+			<Tab value="json" label="JSON" />
+			{#snippet content()}
+				<div class="relative pt-2 h-full">
+					{#key importType}
+						{#await import('../SimpleEditor.svelte')}
+							<Loader2 class="animate-spin" />
+						{:then Module}
+							<Module.default
+								bind:code={pendingRaw}
+								lang={importType}
+								class="h-full"
+								fixedOverflowWidgets={false}
+							/>
+						{/await}
+					{/key}
+				</div>
+			{/snippet}
+		</Tabs>
 		{#snippet actions()}
 			<Button size="sm" on:click={importRaw}>Import</Button>
 		{/snippet}

package/package/components/flows/DebounceLimit.svelte.d.ts

@@ -11,6 +11,6 @@ type $$ComponentProps = {
     color?: 'nord' | undefined;
     fontClass?: string;
 };
-declare const DebounceLimit: import("svelte").Component<$$ComponentProps, {}, "debounce_key" | "debounce_delay_s" | "debounce_args_to_accumulate" | "max_total_debouncing_time" | "max_total_debounces_amount">;
+declare const DebounceLimit: import("svelte").Component<$$ComponentProps, {}, "debounce_delay_s" | "debounce_key" | "debounce_args_to_accumulate" | "max_total_debouncing_time" | "max_total_debounces_amount">;
 type DebounceLimit = ReturnType<typeof DebounceLimit>;
 export default DebounceLimit;

package/package/components/flows/FlowAssetsHandler.svelte

@@ -101,8 +101,9 @@ async function parseAndUpdateRawScriptModule(v, modId) {
         if (old?.alt_access_type)
             asset.alt_access_type = old.alt_access_type;
     }
-    if (!deepEqual(v.assets, newAssets))
-        v.assets = newAssets;
+    const normalizedAssets = newAssets.length > 0 ? newAssets : undefined;
+    if (!deepEqual(v.assets, normalizedAssets))
+        v.assets = normalizedAssets;
 }
 // Check for raw script modules whose assets were not parsed. Useful for flows created
 // before the assets feature was introduced.

package/package/components/flows/FlowModuleIcon.svelte

@@ -1,11 +1,12 @@
-<script lang="ts">import LanguageIcon from '../common/languageIcons/LanguageIcon.svelte';
+<script lang="ts">import { untrack } from 'svelte';
+import LanguageIcon from '../common/languageIcons/LanguageIcon.svelte';
 import IconedResourceType from '../IconedResourceType.svelte';
 import { Building, Repeat, Square, ArrowDown, GitBranch, Bot } from 'lucide-svelte';
 import BarsStaggered from '../icons/BarsStaggered.svelte';
 let { module, size = 16, width, height } = $props();
 // Use width/height if provided, otherwise use size for both
-const iconWidth = width || size;
-const iconHeight = height || size;
+const iconWidth = untrack(() => width) || untrack(() => size);
+const iconHeight = untrack(() => height) || untrack(() => size);
 </script>
 
 {#if module?.value?.type === 'aiagent'}

package/package/components/flows/common/FlowCardHeader.svelte

@@ -27,8 +27,9 @@ function getCachedValues(path) {
     const key = getCachedKey(path);
     latestHash = cachedValues[key]?.latestHash;
 }
-if (flowModuleValue?.type === 'script' && flowModuleValue.path) {
-    getCachedValues(flowModuleValue.path);
+const untrackedFlowModuleValue = untrack(() => flowModuleValue);
+if (untrackedFlowModuleValue?.type === 'script' && untrackedFlowModuleValue.path) {
+    getCachedValues(untrackedFlowModuleValue.path);
 }
 async function loadLatestHash(value) {
     let script = await ScriptService.getScriptByPath({