windmill-components 1.623.2 → 1.655.0

package/package/components/FilterSearchbar.svelte.d.ts

@@ -0,0 +1,87 @@
+import { z } from 'zod';
+import { type IconType } from '../utils';
+export type FilterSchemaRec = Record<string, FilterSchema>;
+export type FilterSchema = ({
+    type: 'string' | 'number' | 'boolean';
+    allowMultiple?: boolean;
+    format?: 'json';
+} | {
+    type: 'date';
+    mode?: 'single' | 'end' | 'start';
+    otherField?: string;
+    allowMultiple?: undefined;
+} | {
+    type: 'oneof';
+    options: {
+        value: string;
+        label?: string;
+        description?: string;
+    }[];
+    allowCustomValue?: boolean;
+    allowNegative?: boolean;
+    allowMultiple?: boolean;
+}) & {
+    label?: string;
+    description?: string;
+    icon?: IconType;
+    hidden?: boolean;
+};
+export type FilterInstanceRec<T extends FilterSchemaRec> = {
+    [K in keyof T]: FilterInstance<T[K]>;
+};
+export type FilterInstance<T extends FilterSchema> = T extends {
+    type: 'string';
+} ? string : T extends {
+    type: 'number';
+} ? number : T extends {
+    type: 'boolean';
+} ? boolean : T extends {
+    type: 'date';
+} ? Date : T extends {
+    type: 'oneof';
+    options: any;
+    allowCustomValue?: infer A;
+} ? A extends true ? string : T['options'] extends {
+    value: string;
+}[] ? _NegativeFilterInstance<T> : never : never;
+type _NegativeFilterInstance<T extends {
+    options: {
+        value: string;
+    }[];
+}> = T extends {
+    allowNegative: true;
+} ? T['options'][number]['value'] | `!${T['options'][number]['value']}` : T['options'][number]['value'];
+/**
+ * Converts a FilterSchemaRec to a Zod schema for validation
+ */
+export declare function filterSchemaRecToZodSchema<T extends FilterSchemaRec>(schemaRec: T): z.ZodObject<{
+    [K in keyof T]: z.ZodType<FilterInstance<T[K]>>;
+}>;
+/**
+ * Creates a URL-synced filter instance that automatically syncs with URL search parameters
+ */
+export declare function useUrlSyncedFilterInstance<T extends FilterSchemaRec>(schemaRec: T): {
+    val: Partial<FilterInstanceRec<T>>;
+};
+export type FilterValidationError = {
+    fields: string[];
+    error: string;
+};
+/**
+ * Validates a filter instance against its schema.
+ * Returns a list of validation errors, each with the affected fields and an error message.
+ */
+export declare function validateFilterInstance<T extends FilterSchemaRec>(schemaRec: T, instance: Partial<FilterInstanceRec<T>>): FilterValidationError[];
+type Props<SchemaT extends FilterSchemaRec> = {
+    schema: SchemaT;
+    value: Partial<FilterInstanceRec<SchemaT>>;
+    presets?: {
+        name: string;
+        value: string;
+    }[];
+    class?: string;
+    placeholder?: string;
+};
+declare const FilterSearchbar: import("svelte").Component<Props<FilterSchemaRec>, {}, "value">;
+type FilterSearchbar = ReturnType<typeof FilterSearchbar>;
+export default FilterSearchbar;

package/package/components/FlowBuilder.svelte

@@ -1,15 +1,15 @@
 <script lang="ts">import { FlowService, DraftService, CaptureService } from '../gen';
 import { initHistory, redo, undo } from '../history.svelte';
 import { enterpriseLicense, userStore, workspaceStore, usedTriggerKinds } from '../stores';
-import { cleanValueProperties, encodeState, generateRandomString, orderedJsonStringify, readFieldsRecursively, replaceFalseWithUndefined } from '../utils';
+import { cleanValueProperties, encodeState, generateRandomString, orderedJsonStringify, readFieldsRecursively, replaceFalseWithUndefined, isMac } from '../utils';
 import { sendUserToast } from '../toast';
 import { Drawer } from './common';
 import DeployOverrideConfirmationModal from './common/confirmationModal/DeployOverrideConfirmationModal.svelte';
 import AIChangesWarningModal from './copilot/chat/flow/AIChangesWarningModal.svelte';
-import { onMount, setContext, untrack } from 'svelte';
+import { createRawSnippet, onMount, setContext, untrack } from 'svelte';
 import { writable } from 'svelte/store';
 import CenteredPage from './CenteredPage.svelte';
-import { Badge, Button, UndoRedo } from './common';
+import { Button } from './common';
 import FlowEditor from './flows/FlowEditor.svelte';
 import ScriptEditorDrawer from './flows/content/ScriptEditorDrawer.svelte';
 import FlowEditorDrawer from './flows/content/FlowEditorDrawer.svelte';
@@ -20,7 +20,7 @@ import { SelectionManager } from './graph/selectionUtils.svelte';
 import { NoteEditor } from './graph/noteEditor.svelte';
 import { setNoteEditorContext } from './graph/noteEditor.svelte';
 import { cleanFlow } from './flows/utils.svelte';
-import { Calendar, Pen, Save, DiffIcon, HistoryIcon, FileJson, Settings } from 'lucide-svelte';
+import { Calendar, Save, DiffIcon, HistoryIcon, FileJson, Settings, Undo, Redo, BookOpen, Circle, CheckCircle, RefreshCw, CheckCheck, Disc } from 'lucide-svelte';
 import Awareness from './Awareness.svelte';
 import { getAllModules } from './flows/flowExplorer';
 import {} from './copilot/flow';
@@ -28,8 +28,10 @@ import { loadFlowModuleState } from './flows/flowStateUtils.svelte';
 import Dropdown from './DropdownV2.svelte';
 import FlowTutorials from './FlowTutorials.svelte';
 import FlowHistory from './flows/FlowHistory.svelte';
-import FlowEditorTutorial from './flows/FlowEditorTutorial.svelte';
-import Summary from './Summary.svelte';
+import { resetAllTodos, skipAllTodos } from '../tutorialUtils';
+import { tutorialsToDo } from '../stores';
+import { getTutorialIndex } from '../tutorials/config';
+import SummaryPathDisplay from './SummaryPathDisplay.svelte';
 import FlowYamlEditor from './flows/header/FlowYamlEditor.svelte';
 import {} from './triggers';
 import DeployButton from './DeployButton.svelte';
@@ -42,9 +44,20 @@ import { validateRetryConfig } from '../utils';
 import { setStepHistoryLoaderContext, StepHistoryLoader } from './stepHistoryLoader.svelte';
 import { ModulesTestStates } from './modulesTest.svelte';
 import FlowAssetsHandler, { initFlowGraphAssetsCtx } from './flows/FlowAssetsHandler.svelte';
-import { inputSizeClasses } from './text_input/TextInput.svelte';
+import { isRuleActive } from '../workspaceProtectionRules.svelte';
+import { buildForkEditUrl } from '../utils/editInFork';
+import { isCloudHosted } from '../cloud';
 let { initialPath = $bindable(''), pathStoreInit = undefined, newFlow, selectedId, initialArgs = {}, loading = false, flowStore, flowStateStore, savedFlow = $bindable(undefined), diffDrawer = undefined, customUi = {}, disableAi = false, disabledFlowInputs = false, savedPrimarySchedule = undefined, version = undefined, setSavedraftCb = undefined, draftTriggersFromUrl = undefined, selectedTriggerIndexFromUrl = undefined, children, loadedFromHistoryFromUrl, noInitial = false, onSaveInitial, onSaveDraft, onDeploy, onDeployError, onDetails, onSaveDraftError, onSaveDraftOnlyAtNewPath, onHistoryRestore } = $props();
 let initialPathStore = writable(initialPath);
+// For preserve_on_behalf_of feature
+let preserveOnBehalfOf = writable(false);
+let savedOnBehalfOfEmail = writable(savedFlow?.on_behalf_of_email);
+// Keep savedOnBehalfOfEmail in sync when savedFlow is loaded asynchronously
+$effect(() => {
+    if (savedFlow?.on_behalf_of_email !== undefined) {
+        savedOnBehalfOfEmail.set(savedFlow.on_behalf_of_email);
+    }
+});
 // used for new flows for captures
 let fakeInitialPath = 'u/' +
     ($userStore?.username?.includes('@')
@@ -120,7 +133,7 @@ async function compareVersions() {
         onLatest = true;
     }
 }
-const primaryScheduleStore = writable(savedPrimarySchedule); // kept for legacy reasons
+const primaryScheduleStore = writable(untrack(() => savedPrimarySchedule)); // kept for legacy reasons
 const triggersCount = writable(undefined);
 const simplifiedPoll = writable(false);
 // used to set the primary schedule in the legacy primaryScheduleStore
@@ -366,6 +379,7 @@ async function saveFlow(deploymentMsg, triggersToDeploy) {
                     dedicated_worker: flow.dedicated_worker,
                     visible_to_runner_only: flow.visible_to_runner_only,
                     on_behalf_of_email: flow.on_behalf_of_email,
+                    preserve_on_behalf_of: $preserveOnBehalfOf || undefined,
                     deployment_message: deploymentMsg || undefined
                 }
             });
@@ -405,6 +419,7 @@ async function saveFlow(deploymentMsg, triggersToDeploy) {
                     ws_error_handler_muted: flow.ws_error_handler_muted,
                     visible_to_runner_only: flow.visible_to_runner_only,
                     on_behalf_of_email: flow.on_behalf_of_email,
+                    preserve_on_behalf_of: $preserveOnBehalfOf || undefined,
                     deployment_message: deploymentMsg || undefined
                 }
             });
@@ -428,7 +443,7 @@ async function saveFlow(deploymentMsg, triggersToDeploy) {
 let timeout = undefined;
 function saveSessionDraft() {
     timeout && clearTimeout(timeout);
-    timeout = setTimeout(() => {
+    timeout = window.setTimeout(() => {
         try {
             localStorage.setItem(initialPath && initialPath != '' ? `flow-${initialPath}` : 'flow', encodeState({
                 flow: flowStore.val,
@@ -450,8 +465,8 @@ function saveSessionDraft() {
 const selectionManager = new SelectionManager();
 const selectedIdStore = $derived(selectionManager.getSelectedId());
 // Initialize with selected id if provided
-if (selectedId) {
-    selectionManager.selectId(selectedId);
+if (untrack(() => selectedId)) {
+    selectionManager.selectId(untrack(() => selectedId) ?? '');
 }
 else {
     selectionManager.selectId('settings-metadata');
@@ -459,12 +474,11 @@ else {
 export function getSelectedId() {
     return selectedIdStore;
 }
-const previewArgsStore = $state({ val: initialArgs });
+const previewArgsStore = $state({ val: untrack(() => initialArgs) });
 const scriptEditorDrawer = writable(undefined);
 const flowEditorDrawer = writable(undefined);
-const moving = writable(undefined);
-const history = initHistory(flowStore.val);
-const pathStore = writable(pathStoreInit ?? initialPath);
+const history = initHistory(untrack(() => flowStore).val);
+const pathStore = writable(untrack(() => pathStoreInit) ?? initialPath);
 const captureOn = writable(false);
 const showCaptureHint = writable(undefined);
 const flowInputEditorStateStore = writable({
@@ -486,25 +500,26 @@ setContext('FlowEditorContext', {
     previewArgs: previewArgsStore,
     scriptEditorDrawer,
     flowEditorDrawer,
-    moving,
     history,
-    flowStateStore,
-    flowStore,
+    flowStateStore: untrack(() => flowStateStore),
+    flowStore: untrack(() => flowStore),
     pathStore,
     stepsInputArgs,
     saveDraft,
     initialPathStore,
     fakeInitialPath,
     flowInputsStore: writable({}),
-    customUi,
+    customUi: untrack(() => customUi),
     insertButtonOpen,
     executionCount: writable(0),
     flowInputEditorState: flowInputEditorStateStore,
     modulesTestStates,
-    outputPickerOpenFns
+    outputPickerOpenFns,
+    preserveOnBehalfOf,
+    savedOnBehalfOfEmail
 });
 // Set up NoteEditor context for note editing capabilities
-const noteEditor = new NoteEditor(flowStore, () => {
+const noteEditor = new NoteEditor(untrack(() => flowStore), () => {
     // Enable notes display when a note is created
     flowEditor?.enableNotes?.();
 });
@@ -514,8 +529,8 @@ setContext('FlowGraphAssetContext', initFlowGraphAssetsCtx({ getModules: () => f
 const triggersState = $state(new Triggers([
     { type: 'webhook', path: '', isDraft: false },
     { type: 'default_email', path: '', isDraft: false },
-    ...(draftTriggersFromUrl ?? savedFlow?.draft?.draft_triggers ?? [])
-], selectedTriggerIndexFromUrl, saveSessionDraft));
+    ...(untrack(() => draftTriggersFromUrl) ?? savedFlow?.draft?.draft_triggers ?? [])
+], untrack(() => selectedTriggerIndexFromUrl), saveSessionDraft));
 setContext('TriggerContext', {
     triggersCount,
     simplifiedPoll,
@@ -535,6 +550,26 @@ export async function loadTriggers() {
         savedFlow = filterDraftTriggers(savedFlow, triggersState);
     }
 }
+function handleUndo() {
+    const currentModules = flowStore.val?.value?.modules;
+    flowStore.val = undo(history, flowStore.val);
+    const newModules = flowStore.val?.value?.modules;
+    const restoredModules = newModules?.filter((node) => !currentModules?.some((currentNode) => currentNode?.id === node?.id));
+    for (const mod of restoredModules) {
+        if (mod) {
+            try {
+                loadFlowModuleState(mod).then((state) => (flowStateStore.val[mod.id] = state));
+            }
+            catch (e) {
+                console.error('Error loading state for restored node', e);
+            }
+        }
+    }
+    selectionManager.selectId('Input');
+}
+function handleRedo() {
+    flowStore.val = redo(history);
+}
 function onKeyDown(event) {
     let classes = event.target?.['className'];
     if ((typeof classes === 'string' && classes.includes('inputarea')) ||
@@ -544,14 +579,13 @@ function onKeyDown(event) {
     switch (event.key) {
         case 'Z':
             if (event.ctrlKey || event.metaKey) {
-                flowStore.val = redo(history);
+                handleRedo();
                 event.preventDefault();
             }
             break;
         case 'z':
             if (event.ctrlKey || event.metaKey) {
-                flowStore.val = undo(history, flowStore.val);
-                selectionManager.selectId('Input');
+                handleUndo();
                 event.preventDefault();
             }
             break;
@@ -594,19 +628,25 @@ function generateIds() {
     ];
 }
 const dropdownItems = [];
-if (customUi.topBar?.extraDeployOptions != false) {
+if (untrack(() => customUi).topBar?.extraDeployOptions != false) {
     if (savedFlow?.draft_only === false || savedFlow?.draft_only === undefined) {
         dropdownItems.push({
             label: 'Exit & see details',
             onClick: () => onDetails?.({ path: $pathStore })
         });
     }
-    if (!newFlow) {
+    if (!untrack(() => newFlow)) {
         dropdownItems.push({
             label: 'Fork',
             onClick: () => window.open(`/flows/add?template=${initialPath}`)
         });
     }
+    if (!untrack(() => newFlow) && !isCloudHosted() && !isRuleActive('DisableWorkspaceForking')) {
+        dropdownItems.push({
+            label: 'Edit in workspace fork',
+            onClick: () => window.open(buildForkEditUrl('flow', initialPath))
+        });
+    }
 }
 let flowCopilotContext = $state({
     shouldUpdatePropertyType: writable({}),
@@ -627,9 +667,84 @@ export function triggerTutorial() {
         flowTutorials?.runTutorialById(tutorial);
     }
 }
-let moreItems = $state([]);
+let baseMenuItems = $state([]);
+const mod = isMac() ? '⌘' : 'Ctrl+';
+function getMoreItems() {
+    return [
+        ...baseMenuItems,
+        {
+            displayName: 'Undo',
+            icon: Undo,
+            action: () => handleUndo(),
+            disabled: $history.index === 0,
+            shortcut: `${mod}Z`,
+            separatorTop: baseMenuItems.length > 0
+        },
+        {
+            displayName: 'Redo',
+            icon: Redo,
+            action: () => handleRedo(),
+            disabled: $history.index === $history.history.length - 1,
+            shortcut: `${mod}⇧Z`
+        },
+        {
+            displayName: 'Tutorials',
+            icon: BookOpen,
+            separatorTop: true,
+            extra: (() => {
+                const remaining = [
+                    getTutorialIndex('flow-live-tutorial'),
+                    getTutorialIndex('troubleshoot-flow')
+                ].filter((i) => $tutorialsToDo.includes(i)).length;
+                return remaining > 0
+                    ? createRawSnippet(() => ({
+                        render: () => `<span class="ml-auto inline-flex items-center justify-center w-4 h-4 text-[10px] font-medium text-white rounded-full bg-surface-accent-primary">${remaining}</span>`
+                    }))
+                    : undefined;
+            })(),
+            submenuItems: [
+                {
+                    displayName: 'Build a flow',
+                    action: () => flowTutorials?.runTutorialById('flow-live-tutorial'),
+                    icon: $tutorialsToDo.includes(getTutorialIndex('flow-live-tutorial'))
+                        ? Circle
+                        : CheckCircle,
+                    iconColor: $tutorialsToDo.includes(getTutorialIndex('flow-live-tutorial'))
+                        ? undefined
+                        : 'green'
+                },
+                {
+                    displayName: 'Fix a broken flow',
+                    action: () => flowTutorials?.runTutorialById('troubleshoot-flow'),
+                    icon: $tutorialsToDo.includes(getTutorialIndex('troubleshoot-flow'))
+                        ? Circle
+                        : CheckCircle,
+                    iconColor: $tutorialsToDo.includes(getTutorialIndex('troubleshoot-flow'))
+                        ? undefined
+                        : 'green'
+                },
+                {
+                    displayName: 'Reset tutorials',
+                    action: () => resetAllTodos(),
+                    icon: RefreshCw,
+                    separatorTop: true
+                },
+                {
+                    displayName: 'Skip tutorials',
+                    action: () => skipAllTodos(),
+                    icon: CheckCheck
+                }
+            ]
+        },
+        {
+            displayName: 'Test flow & record',
+            icon: Disc,
+            action: () => flowPreviewButtons?.openRecordingPreview()
+        }
+    ];
+}
 function onCustomUiChange(customUi, hasAiDiff) {
-    moreItems = [
+    baseMenuItems = [
         ...(customUi?.topBar?.history != false
             ? [
                 {
@@ -709,7 +824,7 @@ $effect.pre(() => {
 export async function loadFlowState() {
     await stepHistoryLoader.loadIndividualStepsStates(flowStore.val, flowStateStore, $workspaceStore, $initialPathStore, $pathStore);
 }
-let stepHistoryLoader = new StepHistoryLoader(loadedFromHistoryFromUrl?.stepsState ?? {}, loadedFromHistoryFromUrl?.flowJobInitial, saveSessionDraft, noInitial);
+let stepHistoryLoader = new StepHistoryLoader(untrack(() => loadedFromHistoryFromUrl)?.stepsState ?? {}, untrack(() => loadedFromHistoryFromUrl)?.flowJobInitial, saveSessionDraft, untrack(() => noInitial));
 setStepHistoryLoaderContext(stepHistoryLoader);
 export function setLoadedFromHistory(loadedFromHistoryUrl) {
     if (!loadedFromHistoryUrl) {
@@ -788,46 +903,18 @@ const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 		<div class="flex flex-col flex-1 h-screen">
 			<!-- Nav between steps-->
 			<div
-				class="justify-between flex flex-row items-center pl-2.5 pr-6 space-x-4 scrollbar-hidden overflow-x-auto max-h-12 h-full relative"
+				class="justify-between flex flex-row items-center pl-2 pr-4 space-x-4 scrollbar-hidden overflow-x-auto max-h-12 h-full relative"
 			>
-				<div class="flex w-full max-w-md gap-4 items-center">
-					<Summary
-						disabled={customUi?.topBar?.editableSummary == false}
-						bind:value={flowStore.val.summary}
-					/>
-					<UndoRedo
-						undoProps={{ disabled: $history.index === 0 }}
-						redoProps={{ disabled: $history.index === $history.history.length - 1 }}
-						on:undo={() => {
-							const currentModules = flowStore.val?.value?.modules
-							// console.log('undo before', flowStore.val, JSON.stringify(flowStore.val, null, 2))
-							flowStore.val = undo(history, flowStore.val)
-							// console.log('undo after', flowStore.val, JSON.stringify(flowStore.val, null, 2))
-
-							const newModules = flowStore.val?.value?.modules
-							const restoredModules = newModules?.filter(
-								(node) => !currentModules?.some((currentNode) => currentNode?.id === node?.id)
-							)
-
-							for (const mod of restoredModules) {
-								if (mod) {
-									try {
-										loadFlowModuleState(mod).then((state) => (flowStateStore.val[mod.id] = state))
-									} catch (e) {
-										console.error('Error loading state for restored node', e)
-									}
-								}
-							}
-
-							selectionManager.selectId('Input')
-						}}
-						on:redo={() => {
-							flowStore.val = redo(history)
-						}}
+				<div class="flex w-full gap-8 items-center min-w-0">
+					<SummaryPathDisplay
+						bind:summary={flowStore.val.summary}
+						bind:path={$pathStore}
+						kind="flow"
+						editable
 					/>
 				</div>
 
-				<div class="gap-4 flex-row hidden md:flex w-full whitespace-nowrap max-w-md">
+				<div class="gap-4 flex-row hidden md:flex whitespace-nowrap">
 					{#if triggersState.triggers?.some((t) => t.type === 'schedule')}
 						{@const primaryScheduleIndex = triggersState.triggers.findIndex((t) => t.isPrimary)}
 						{@const scheduleIndex = triggersState.triggers.findIndex((t) => t.type === 'schedule')}
@@ -849,44 +936,19 @@ const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 								''}
 						</Button>
 					{/if}
-
-					{#if customUi?.topBar?.path != false}
-						<div class="flex justify-start items-center w-full">
-							<button
-								onclick={async () => {
-									select('settings-metadata')
-									document.getElementById('path')?.focus()
-								}}
-							>
-								<Badge
-									color="gray"
-									class="text-primary rounded-r-none border border-r-0 {inputSizeClasses.md}"
-								>
-									<Pen size={12} class="mr-2" /> Path
-								</Badge>
-							</button>
-							<input
-								type="text"
-								readonly
-								value={$pathStore && $pathStore != '' ? $pathStore : 'Choose a path'}
-								class="font-mono !text-2xs !min-w-[96px] !max-w-[300px] !w-full !h-[28px] !my-0 !py-0 !border-l-0 cursor-default !rounded-l-none {inputSizeClasses.md}"
-								onfocus={({ currentTarget }) => {
-									currentTarget.select()
-								}}
-							/>
-						</div>
-					{/if}
 				</div>
 				<div class="flex flex-row gap-2 items-center">
 					{#if $enterpriseLicense && !newFlow}
 						<Awareness />
 					{/if}
-					<div>
-						{#if moreItems?.length > 0}
-							<Dropdown items={moreItems} />
+					<div class="relative">
+						<Dropdown items={getMoreItems} />
+						{#if $tutorialsToDo.includes(getTutorialIndex('flow-live-tutorial')) || $tutorialsToDo.includes(getTutorialIndex('troubleshoot-flow'))}
+							<span
+								class="absolute top-0.5 right-0.5 block w-2 h-2 rounded-full bg-surface-accent-primary pointer-events-none"
+							></span>
 						{/if}
 					</div>
-					<FlowEditorTutorial />
 					{#if customUi?.topBar?.diff != false}
 						<Button
 							variant="default"
@@ -922,6 +984,7 @@ const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 						</Button>
 					{/if}
 					<FlowPreviewButtons
+						{suspendStatus}
 						on:openTriggers={(e) => {
 							select('Trigger')
 							handleSelectTriggerFromKind(triggersState, triggersCount, initialPath, e.detail.kind)

package/package/components/FlowGraphViewer.svelte

@@ -4,16 +4,7 @@ import FlowGraphViewerStep from './FlowGraphViewerStep.svelte';
 import FlowGraphV2 from './graph/FlowGraphV2.svelte';
 import { dfs } from './flows/dfs';
 import { workspaceStore } from '../stores';
-export let flow;
-export let overflowAuto = false;
-export let noSide = false;
-export let download = false;
-export let noGraph = false;
-export let triggerNode = false;
-export let stepDetail = undefined;
-export let workspace = $workspaceStore;
-export let minHeight = 400;
-export let noBorder = false;
+let { flow, overflowAuto = false, noSide = false, download = false, noGraph = false, triggerNode = false, stepDetail = $bindable(undefined), workspace = $workspaceStore, minHeight = 400, noBorder = false } = $props();
 const dispatch = createEventDispatcher();
 </script>
 

package/package/components/FlowGraphViewer.svelte.d.ts

@@ -1,18 +1,5 @@
 import type { FlowModule, FlowValue } from '../gen';
-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 FlowGraphViewer: $$__sveltets_2_IsomorphicComponent<{
+interface Props {
     flow: {
         summary: string;
         description?: string;
@@ -29,11 +16,25 @@ declare const FlowGraphViewer: $$__sveltets_2_IsomorphicComponent<{
     workspace?: string | undefined;
     minHeight?: number;
     noBorder?: 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> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const FlowGraphViewer: $$__sveltets_2_IsomorphicComponent<Props, {
     triggerDetail: CustomEvent<any>;
     select: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "stepDetail">;
 type FlowGraphViewer = InstanceType<typeof FlowGraphViewer>;
 export default FlowGraphViewer;