windmill-components 1.46.3 → 1.55.0

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

@@ -12,9 +12,9 @@ declare const __propDef: {
         default: {};
     };
 };
-export declare type FlowCardHeaderProps = typeof __propDef.props;
-export declare type FlowCardHeaderEvents = typeof __propDef.events;
-export declare type FlowCardHeaderSlots = typeof __propDef.slots;
+export type FlowCardHeaderProps = typeof __propDef.props;
+export type FlowCardHeaderEvents = typeof __propDef.events;
+export type FlowCardHeaderSlots = typeof __propDef.slots;
 export default class FlowCardHeader extends SvelteComponentTyped<FlowCardHeaderProps, FlowCardHeaderEvents, FlowCardHeaderSlots> {
 }
 export {};

package/components/flows/content/BranchPredicateEditor.svelte

@@ -0,0 +1,30 @@
+<script>import { getContext } from 'svelte';
+import { flowStore } from '../flowStore';
+import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte';
+import SimpleEditor from '../../SimpleEditor.svelte';
+import { flowStateStore } from '../flowState';
+import { getStepPropPicker } from '../previousResults';
+export let branch;
+export let parentModule;
+export let previousModule;
+const { previewArgs } = getContext('FlowEditorContext');
+let editor = undefined;
+$: stepPropPicker = getStepPropPicker($flowStateStore, parentModule, previousModule, parentModule.id, $flowStore, $previewArgs, false, true);
+</script>
+
+<PropPickerWrapper
+	notSelectable
+	pickableProperties={stepPropPicker.pickableProperties}
+	on:select={({ detail }) => {
+		editor?.insertAtCursor(detail)
+	}}
+>
+	<SimpleEditor
+		bind:this={editor}
+		lang="javascript"
+		bind:code={branch.expr}
+		class="small-editor"
+		shouldBindKey={false}
+		extraLib={stepPropPicker.extraLib}
+	/>
+</PropPickerWrapper>

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

@@ -0,0 +1,23 @@
+import { SvelteComponentTyped } from "svelte";
+import type { FlowModule } from '../../../gen';
+declare const __propDef: {
+    props: {
+        branch: {
+            summary?: string;
+            expr: string;
+            modules: Array<FlowModule>;
+        };
+        parentModule: FlowModule;
+        previousModule: FlowModule | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type BranchPredicateEditorProps = typeof __propDef.props;
+export type BranchPredicateEditorEvents = typeof __propDef.events;
+export type BranchPredicateEditorSlots = typeof __propDef.slots;
+export default class BranchPredicateEditor extends SvelteComponentTyped<BranchPredicateEditorProps, BranchPredicateEditorEvents, BranchPredicateEditorSlots> {
+}
+export {};

package/components/flows/content/CapturePayload.svelte

@@ -84,24 +84,28 @@ async function getCaptureInput() {
 		<div class="box p-2 my-2  mb-4">
 			<ObjectViewer topBrackets={true} json={captureInput} />
 		</div>
-		<div class="flex flex-row-reverse gap-2" slot="submission">
+		<svelte:fragment slot="actions">
 			<Button
 				size="sm"
+				variant="border"
 				on:click={() => {
 					$previewArgs = captureInput
-					$flowStore.schema = jsonSchema
-					sendUserToast('Copied as flow inputs and test args')
-				}}>Copy as flow inputs and test args</Button
+					sendUserToast('Copied as test args')
+				}}
 			>
+				Copy only as test args
+			</Button>
 			<Button
 				size="sm"
-				variant="border"
 				on:click={() => {
 					$previewArgs = captureInput
-					sendUserToast('Copied as test args')
-				}}>Copy only as test args</Button
+					$flowStore.schema = jsonSchema
+					sendUserToast('Copied as flow inputs and test args')
+				}}
 			>
-		</div>
+				Copy as flow inputs and test args
+			</Button>
+		</svelte:fragment>
 		<h3 class="mt-2">Derived inputs schema</h3>
 		<div class="box p-2">
 			<SchemaViewer schema={jsonSchema} />

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

@@ -8,9 +8,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type CapturePayloadProps = typeof __propDef.props;
-export declare type CapturePayloadEvents = typeof __propDef.events;
-export declare type CapturePayloadSlots = typeof __propDef.slots;
+export type CapturePayloadProps = typeof __propDef.props;
+export type CapturePayloadEvents = typeof __propDef.events;
+export type CapturePayloadSlots = typeof __propDef.slots;
 export default class CapturePayload extends SvelteComponentTyped<CapturePayloadProps, CapturePayloadEvents, CapturePayloadSlots> {
     get openDrawer(): () => void;
 }

package/components/flows/content/DynamicInputHelpBox.svelte

@@ -1,7 +1,6 @@
 <script>import { faChevronDown, faChevronUp } from '@fortawesome/free-solid-svg-icons';
 import Icon from 'svelte-awesome';
 import { slide } from 'svelte/transition';
-export let importPath = undefined;
 $: opened = false;
 </script>
 
@@ -24,37 +23,14 @@ $: opened = false;
 		role="alert"
 		id="dynamic-input-help-box"
 	>
-		<p class="font-bold">Dynamic arg help</p>
-		<p>
-			When a field is using the "Raw Javascript Editor", its value is computed dynamically as the
-			evaluation of its corresponding javascript snippet.
-		</p>
-		That snippet can be a single line:
-		<pre><code>last_result.myarg</code></pre>
-		or a multiline:
-		<pre
-			><code
-				>let x = 5;
-x + 2</code
-			></pre
-		>
+		the last line must always be the final expression.
 		<p>
 			If it is multiline, the statement before the final expression <b
 				>MUST END WITH ; and a newline</b
 			>
 		</p>
-		The snippet can also be a string template:
-		<code
-			>`Hello $&#123;params.name&#125;, all your base $&#123;previous_result.base_name&#125; belong
-			to us`</code
-		>
-		However, the last line must always be the final expression.
-		<p>
-			The snippet can use any javascript primitives, and the following flow specific objects and
-			functions:
-		</p>
 		<ul class="ml-4">
-			<li><b>result.id</b>: the result of step at id 'id'</li>
+			<li><b>{'results.<id>'}</b>: the result of step at id 'id'</li>
 			<li><b>flow_input</b>: the object containing the flow input arguments</li>
 			<li><b>params</b>: the object containing the current step static values</li>
 			<li>
@@ -65,11 +41,5 @@ x + 2</code
 				<b>resource(path)</b>: the function returning the resource at a given path as an object
 			</li>
 		</ul>
-		<p>To re-enable editor assistance, import the helper functions types using:</p>
-		<code>
-			{`import { results, flow_input, variable, resource, params } from 'windmill${
-				importPath ? `@${importPath}` : ''
-			}'`}
-		</code>
 	</div>
 {/if}

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

@@ -1,16 +1,14 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
-    props: {
-        importPath?: string | undefined;
-    };
+    props: Record<string, never>;
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
 };
-export declare type DynamicInputHelpBoxProps = typeof __propDef.props;
-export declare type DynamicInputHelpBoxEvents = typeof __propDef.events;
-export declare type DynamicInputHelpBoxSlots = typeof __propDef.slots;
+export type DynamicInputHelpBoxProps = typeof __propDef.props;
+export type DynamicInputHelpBoxEvents = typeof __propDef.events;
+export type DynamicInputHelpBoxSlots = typeof __propDef.slots;
 export default class DynamicInputHelpBox extends SvelteComponentTyped<DynamicInputHelpBoxProps, DynamicInputHelpBoxEvents, DynamicInputHelpBoxSlots> {
 }
 export {};

package/components/flows/content/FlowBranchAllWrapper.svelte

@@ -9,11 +9,11 @@ export let branch;
 			<input bind:value={branch.summary} placeholder={'Summary'} />
 		</div>
 		<div class="p-4">
-			<div class="mt-6 mb-2 text-sm font-bold">Skip failures</div>
+			<div class="mt-2 mb-2 text-sm font-bold">Skip failures</div>
 			<Toggle
 				bind:checked={branch.skip_failure}
 				options={{
-					right: 'Skip failure'
+					right: 'Skip failures'
 				}}
 			/>
 		</div>

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

@@ -13,9 +13,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type FlowBranchAllWrapperProps = typeof __propDef.props;
-export declare type FlowBranchAllWrapperEvents = typeof __propDef.events;
-export declare type FlowBranchAllWrapperSlots = typeof __propDef.slots;
+export type FlowBranchAllWrapperProps = typeof __propDef.props;
+export type FlowBranchAllWrapperEvents = typeof __propDef.events;
+export type FlowBranchAllWrapperSlots = typeof __propDef.slots;
 export default class FlowBranchAllWrapper extends SvelteComponentTyped<FlowBranchAllWrapperProps, FlowBranchAllWrapperEvents, FlowBranchAllWrapperSlots> {
 }
 export {};

package/components/flows/content/FlowBranchOneWrapper.svelte

@@ -1,17 +1,8 @@
-<script>import { getContext } from 'svelte';
-import FlowCard from '../common/FlowCard.svelte';
-import { flowStore } from '../flowStore';
-import PropPickerWrapper from '../propPicker/PropPickerWrapper.svelte';
-import SimpleEditor from '../../SimpleEditor.svelte';
-import { flowStateStore } from '../flowState';
-import { Pane, Splitpanes } from 'svelte-splitpanes';
-import { getStepPropPicker } from '../previousResults';
+<script>import FlowCard from '../common/FlowCard.svelte';
+import BranchPredicateEditor from './BranchPredicateEditor.svelte';
 export let branch;
 export let parentModule;
 export let previousModule;
-const { previewArgs } = getContext('FlowEditorContext');
-let editor = undefined;
-$: pickableProperties = getStepPropPicker($flowStateStore, parentModule, previousModule, parentModule.id, $flowStore, previewArgs, false, true).pickableProperties;
 </script>
 
 <div class="h-full flex flex-col">
@@ -20,30 +11,8 @@ $: pickableProperties = getStepPropPicker($flowStateStore, parentModule, previou
 			<input bind:value={branch.summary} placeholder={'Summary'} />
 		</div>
 		<div class="overflow-hidden flex-grow">
-			<Splitpanes>
-				<Pane>
-					<div class="p-6 flex flex-col h-full overflow-clip">
-						<span class="mb-2 text-sm font-bold">Branch predicate</span>
-						<div class="border w-full">
-							<PropPickerWrapper
-								notSelectable
-								{pickableProperties}
-								on:select={({ detail }) => {
-									editor?.insertAtCursor(detail)
-								}}
-							>
-								<SimpleEditor
-									bind:this={editor}
-									lang="javascript"
-									bind:code={branch.expr}
-									class="small-editor"
-									shouldBindKey={false}
-								/>
-							</PropPickerWrapper>
-						</div>
-					</div>
-				</Pane>
-			</Splitpanes>
+			<h3 class="p-2">Predicate expression</h3>
+			<BranchPredicateEditor {branch} {parentModule} {previousModule} />
 		</div>
 	</FlowCard>
 </div>

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

@@ -15,9 +15,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type FlowBranchOneWrapperProps = typeof __propDef.props;
-export declare type FlowBranchOneWrapperEvents = typeof __propDef.events;
-export declare type FlowBranchOneWrapperSlots = typeof __propDef.slots;
+export type FlowBranchOneWrapperProps = typeof __propDef.props;
+export type FlowBranchOneWrapperEvents = typeof __propDef.events;
+export type FlowBranchOneWrapperSlots = typeof __propDef.slots;
 export default class FlowBranchOneWrapper extends SvelteComponentTyped<FlowBranchOneWrapperProps, FlowBranchOneWrapperEvents, FlowBranchOneWrapperSlots> {
 }
 export {};

package/components/flows/content/FlowBranchesAllWrapper.svelte

@@ -0,0 +1,91 @@
+<script>import { Alert, Badge, Button, Tab } from '../../common';
+import TabContent from '../../common/tabs/TabContent.svelte';
+import Tabs from '../../common/tabs/Tabs.svelte';
+import Toggle from '../../Toggle.svelte';
+import FlowCard from '../common/FlowCard.svelte';
+import FlowModuleEarlyStop from './FlowModuleEarlyStop.svelte';
+import FlowModuleSleep from './FlowModuleSleep.svelte';
+import FlowModuleSuspend from './FlowModuleSuspend.svelte';
+// import FlowRetries from './FlowRetries.svelte'
+export let flowModule;
+export let previousModule;
+let value = flowModule.value;
+$: value = flowModule.value;
+let selected = 'early-stop';
+</script>
+
+<div class="h-full flex flex-col w-full">
+	<FlowCard title={value.type == 'branchall' ? 'Run all branches' : 'Run one branch'}>
+		<div class="flex flex-col h-full w-full">
+			<div class="border w-full">
+				<Alert notRounded type="info" title="All branches will be run">
+					The result of this step is the list of the result of each branch.
+				</Alert>
+
+				<div class="p-4 mt-4 w-full">
+					<h3 class="mb-4">{value.branches.length} branch{value.branches.length > 1 ? 'es' : ''}</h3
+					>
+					<div class="flex flex-col gap-y-4 py-2 w-full max-w-xl">
+						{#each value.branches as branch, i}
+							<div class="flex flex-row gap-x-4 w-full">
+								<div class="grow">
+									<input type="text" bind:value={branch.summary} placeholder="Summary" />
+								</div>
+								<div class="w-min-sm">
+									<Toggle
+										bind:checked={branch.skip_failure}
+										options={{
+											right: 'Skip failure'
+										}}
+									/>
+								</div>
+							</div>
+						{/each}
+					</div>
+					<div class="mt-6 mb-2 text-sm font-bold">Run in parallel</div>
+					<Toggle
+						bind:checked={value.parallel}
+						options={{
+							right: 'All branches run in parallel'
+						}}
+					/>
+				</div>
+			</div>
+			{#if flowModule}
+				<Tabs bind:selected>
+					<!-- <Tab value="retries">Retries</Tab> -->
+					<Tab value="early-stop">Early Stop/Break</Tab>
+					<Tab value="suspend">Suspend</Tab>
+					<Tab value="sleep">Sleep</Tab>
+
+					<svelte:fragment slot="content">
+						<div class="overflow-hidden bg-white">
+							<!-- <TabContent value="retries" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowRetries bind:flowModule />
+								</div>
+							</TabContent> -->
+
+							<TabContent value="early-stop" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowModuleEarlyStop bind:flowModule />
+								</div>
+							</TabContent>
+
+							<TabContent value="suspend" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowModuleSuspend bind:flowModule />
+								</div>
+							</TabContent>
+							<TabContent value="sleep" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowModuleSleep previousModuleId={previousModule?.id} bind:flowModule />
+								</div>
+							</TabContent>
+						</div>
+					</svelte:fragment>
+				</Tabs>
+			{/if}
+		</div>
+	</FlowCard>
+</div>

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

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+import type { FlowModule } from '../../../gen';
+declare const __propDef: {
+    props: {
+        flowModule: FlowModule;
+        previousModule: FlowModule | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type FlowBranchesAllWrapperProps = typeof __propDef.props;
+export type FlowBranchesAllWrapperEvents = typeof __propDef.events;
+export type FlowBranchesAllWrapperSlots = typeof __propDef.slots;
+export default class FlowBranchesAllWrapper extends SvelteComponentTyped<FlowBranchesAllWrapperProps, FlowBranchesAllWrapperEvents, FlowBranchesAllWrapperSlots> {
+}
+export {};

package/components/flows/content/FlowBranchesOneWrapper.svelte

@@ -0,0 +1,88 @@
+<script>import { Alert, Badge, Button, Tab } from '../../common';
+import TabContent from '../../common/tabs/TabContent.svelte';
+import Tabs from '../../common/tabs/Tabs.svelte';
+import FlowCard from '../common/FlowCard.svelte';
+import BranchPredicateEditor from './BranchPredicateEditor.svelte';
+import FlowModuleEarlyStop from './FlowModuleEarlyStop.svelte';
+import FlowModuleSleep from './FlowModuleSleep.svelte';
+import FlowModuleSuspend from './FlowModuleSuspend.svelte';
+// import FlowRetries from './FlowRetries.svelte'
+export let flowModule;
+export let previousModule;
+let value = flowModule.value;
+$: value = flowModule.value;
+let selected = 'early-stop';
+</script>
+
+<div class="h-full">
+	<FlowCard title="Run one branch">
+		<div class="flex flex-col h-full overflow-auto">
+			<div class="border">
+				<Alert notRounded type="info" title="Only one branch will be run">
+					The result of this step is the result of the branch.
+				</Alert>
+
+				<div class="p-2">
+					<h3 class="my-4"
+						>{value.branches.length + 1} branch{value.branches.length + 1 > 1 ? 'es' : ''}</h3
+					>
+					<div class="flex flex-col gap-y-4 py-2">
+						<div class="flex flex-row gap-2 text-sm border border-gray-400 p-2">
+							<Badge large={true} color="blue">Default branch</Badge>
+							<p class="italic text-gray-600"
+								>If none of the predicates' expressions evaluated in-order match, this branch is
+								chosen</p
+							>
+						</div>
+						{#each value.branches as branch, i}
+							<div class="flex flex-col gap-x-2 p-2 items-center border border-gray-400">
+								<input
+									class="w-full"
+									type="text"
+									bind:value={branch.summary}
+									placeholder="Summary"
+								/>
+								<BranchPredicateEditor {branch} parentModule={flowModule} {previousModule} />
+							</div>
+						{/each}
+					</div>
+				</div>
+			</div>
+			{#if flowModule}
+				<Tabs bind:selected>
+					<!-- <Tab value="retries">Retries</Tab> -->
+					<Tab value="early-stop">Early Stop/Break</Tab>
+					<Tab value="suspend">Suspend</Tab>
+					<Tab value="sleep">Sleep</Tab>
+
+					<svelte:fragment slot="content">
+						<div class="overflow-hidden bg-white">
+							<!-- <TabContent value="retries" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowRetries bind:flowModule />
+								</div>
+							</TabContent> -->
+
+							<TabContent value="early-stop" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowModuleEarlyStop bind:flowModule />
+								</div>
+							</TabContent>
+
+							<TabContent value="suspend" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowModuleSuspend bind:flowModule />
+								</div>
+							</TabContent>
+							<TabContent value="sleep" class="flex flex-col flex-1 h-full">
+								<div class="p-4 overflow-y-auto">
+									<FlowModuleSleep previousModuleId={previousModule?.id} bind:flowModule />
+								</div>
+							</TabContent>
+						</div>
+					</svelte:fragment>
+				</Tabs>
+			{/if}
+		</div>
+	</FlowCard>
+</div>

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

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+import type { FlowModule } from '../../../gen';
+declare const __propDef: {
+    props: {
+        flowModule: FlowModule;
+        previousModule: FlowModule | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type FlowBranchesOneWrapperProps = typeof __propDef.props;
+export type FlowBranchesOneWrapperEvents = typeof __propDef.events;
+export type FlowBranchesOneWrapperSlots = typeof __propDef.slots;
+export default class FlowBranchesOneWrapper extends SvelteComponentTyped<FlowBranchesOneWrapperProps, FlowBranchesOneWrapperEvents, FlowBranchesOneWrapperSlots> {
+}
+export {};

package/components/flows/content/FlowEditorPanel.svelte

@@ -17,6 +17,8 @@ const { selectedId } = getContext('FlowEditorContext');
 		<FlowSettings {initialPath} defaultTab="schedule" />
 	{:else if $selectedId === 'settings-same-worker'}
 		<FlowSettings {initialPath} defaultTab="same-worker" />
+	{:else if $selectedId === 'settings-graph'}
+		<FlowSettings {initialPath} defaultTab="graph" />
 	{:else if $selectedId === 'failure'}
 		<FlowFailureModule />
 	{:else}

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

@@ -8,9 +8,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type FlowEditorPanelProps = typeof __propDef.props;
-export declare type FlowEditorPanelEvents = typeof __propDef.events;
-export declare type FlowEditorPanelSlots = typeof __propDef.slots;
+export type FlowEditorPanelProps = typeof __propDef.props;
+export type FlowEditorPanelEvents = typeof __propDef.events;
+export type FlowEditorPanelSlots = typeof __propDef.slots;
 export default class FlowEditorPanel extends SvelteComponentTyped<FlowEditorPanelProps, FlowEditorPanelEvents, FlowEditorPanelSlots> {
 }
 export {};

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

@@ -1,14 +1,14 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
-    props: {};
+    props: Record<string, never>;
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
 };
-export declare type FlowFailureModuleProps = typeof __propDef.props;
-export declare type FlowFailureModuleEvents = typeof __propDef.events;
-export declare type FlowFailureModuleSlots = typeof __propDef.slots;
+export type FlowFailureModuleProps = typeof __propDef.props;
+export type FlowFailureModuleEvents = typeof __propDef.events;
+export type FlowFailureModuleSlots = typeof __propDef.slots;
 export default class FlowFailureModule extends SvelteComponentTyped<FlowFailureModuleProps, FlowFailureModuleEvents, FlowFailureModuleSlots> {
 }
 export {};

package/components/flows/content/FlowInput.svelte

@@ -3,40 +3,35 @@ import SchemaEditor from '../../SchemaEditor.svelte';
 import SchemaForm from '../../SchemaForm.svelte';
 import FlowCard from '../common/FlowCard.svelte';
 import { copyFirstStepSchema, flowStore } from '../flowStore';
-import { isEmptyFlowModule } from '../utils';
 import CapturePayload from './CapturePayload.svelte';
 let capturePayload;
 </script>
 
 <CapturePayload bind:this={capturePayload} />
 <FlowCard title="Flow Input">
-	<div slot="header">
-		<div class="flex flex-row space-x-4">
+	<div class="p-6">
+		<div class="flex flex-row items-center space-x-4 pb-2 border-b border-gray-400">
+			<div>Copy input's schema from</div>
 			<Button
-				color="light"
+				color="dark"
 				size="sm"
 				on:click={() => {
 					capturePayload.openDrawer()
 				}}
-				variant="border"
 			>
-				Capture from a request to seed inputs
+				A request
 			</Button>
 			<Button
-				color="light"
+				color="dark"
 				size="sm"
 				disabled={$flowStore.value.modules.length === 0 ||
-					isEmptyFlowModule($flowStore.value.modules[0])}
+					$flowStore.value.modules[0].value.type == 'identity'}
 				on:click={copyFirstStepSchema}
-				variant="border"
 			>
-				Copy from first step schema {#if $flowStore.value.modules.length === 0 || isEmptyFlowModule($flowStore.value.modules[0])}
-					(no steps to copy from!){/if}
+				First step's inputs
 			</Button>
 		</div>
-	</div>
-	<div>
-		<div class="p-6">
+		<div class="pt-6">
 			<SchemaEditor
 				bind:schema={$flowStore.schema}
 				on:change={() => {
@@ -46,6 +41,7 @@ let capturePayload;
 		</div>
 	</div>
 	<div class="p-6">
+		<h2 class="mb-4">Customize Inputs</h2>
 		<SchemaForm bind:schema={$flowStore.schema} editableSchema={true} />
 	</div>
 </FlowCard>

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

@@ -1,14 +1,14 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
-    props: {};
+    props: Record<string, never>;
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
 };
-export declare type FlowInputProps = typeof __propDef.props;
-export declare type FlowInputEvents = typeof __propDef.events;
-export declare type FlowInputSlots = typeof __propDef.slots;
+export type FlowInputProps = typeof __propDef.props;
+export type FlowInputEvents = typeof __propDef.events;
+export type FlowInputSlots = typeof __propDef.slots;
 export default class FlowInput extends SvelteComponentTyped<FlowInputProps, FlowInputEvents, FlowInputSlots> {
 }
 export {};