windmill-components 1.408.1 → 1.430.2

package/package/components/graph/graphBuilder.js

@@ -2,7 +2,20 @@ import {} from '@xyflow/svelte';
 import { getDependeeAndDependentComponents } from '../flows/flowExplorer';
 import { dfsByModule } from '../flows/previousResults';
 import { defaultIfEmptyString } from '../../utils';
-export default function graphBuilder(modules, extra, failureModule, preprocessorModule, eventHandlers, success, useDataflow, selectedId, moving) {
+export function isTriggerStep(module) {
+    return (module?.value != undefined &&
+        (module.value.type === 'script' || module.value.type === 'rawscript') &&
+        module.value.is_trigger === true);
+}
+export function buildPrefix(prefix, id) {
+    return (prefix ?? '') + id + ':';
+}
+export function graphBuilder(modules, extra, failureModule, preprocessorModule, eventHandlers, success, useDataflow, selectedId, moving, simplifiableFlow, flowPathForTriggerNode, expandedSubflows
+// triggerProps?: {
+// 	path?: string
+// 	flowIsSimplifiable?: boolean
+// }
+) {
     const nodes = [];
     const edges = [];
     try {
@@ -10,9 +23,14 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
             return { nodes, edges };
         }
         function addNode(module, offset, type, subModules) {
-            if (nodes.some((n) => n.id === module.id)) {
+            const duplicated = nodes.find((n) => n.id === module.id);
+            if (duplicated) {
+                console.log('Duplicated node detected: ', module, duplicated);
                 throw new Error(`Duplicated node detected: ${module.id}`);
             }
+            if (module.id.startsWith('subflow:')) {
+                extra.insertable = false;
+            }
             nodes.push({
                 id: module.id,
                 data: {
@@ -58,7 +76,7 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
             // No cycle detected for this path
             return false;
         }
-        function addEdge(sourceId, targetId, options) {
+        function addEdge(sourceId, targetId, prefix, options) {
             parents[targetId] = [...(parents[targetId] ?? []), sourceId];
             const mods = options?.subModules ?? modules;
             let index = mods?.findIndex((m) => m.id === targetId) ?? -1;
@@ -73,17 +91,18 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                 target: targetId,
                 type: options?.type ?? 'edge',
                 data: {
-                    insertable: extra.insertable,
                     modules: options?.subModules ?? modules,
                     sourceId,
                     targetId,
                     moving,
                     eventHandlers,
+                    simplifiedTriggerView: simplifiableFlow?.simplifiedFlow,
                     disableMoveIds: options?.disableMoveIds,
                     enableTrigger: sourceId === 'Input',
                     // If the index is -1, it means that the target module is not in the modules array, so we set it to the length of the array
                     index: index >= 0 ? index : mods?.length ?? 0,
-                    ...extra
+                    ...extra,
+                    insertable: extra.insertable && !options?.disableInsert && prefix == undefined
                 }
             });
         }
@@ -98,6 +117,33 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                 ...extra
             }
         };
+        let triggerNode = undefined;
+        if (flowPathForTriggerNode) {
+            triggerNode = {
+                id: 'Trigger',
+                position: { x: -1, y: -1 },
+                type: 'trigger',
+                data: {
+                    simplifiableFlow: simplifiableFlow,
+                    path: flowPathForTriggerNode,
+                    newFlow: extra.newFlow,
+                    eventHandlers: eventHandlers,
+                    modules: modules,
+                    isEditor: extra.insertable
+                }
+            };
+            nodes.push(triggerNode);
+            if (preprocessorModule != null && preprocessorModule != undefined) {
+                addEdge('Trigger', preprocessorModule.id, undefined, {
+                    type: 'empty'
+                });
+            }
+            else {
+                addEdge('Trigger', 'Input', undefined, {
+                    type: 'empty'
+                });
+            }
+        }
         const resultNode = {
             id: 'result',
             data: {
@@ -109,22 +155,34 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
             position: { x: -1, y: -1 },
             type: 'result'
         };
-        nodes.push(inputNode);
-        nodes.push(resultNode);
-        function processModules(modules, beforeNode, nextNode, currentOffset = 0, disableMoveIds = [], parentIndex) {
+        if (simplifiableFlow?.simplifiedFlow !== true) {
+            nodes.push(inputNode);
+            nodes.push(resultNode);
+        }
+        function processModules(modules, beforeNode, nextNode, simplifiedTriggerView, prefix, currentOffset = 0, disableMoveIds = [], parentIndex, branchChosen) {
+            if (prefix != undefined) {
+                modules.forEach((m) => {
+                    if (!m['oid']) {
+                        m['oid'] = m.id;
+                    }
+                    m.id = 'subflow:' + prefix + m['oid'];
+                });
+            }
             let previousId = undefined;
             if (modules.length === 0) {
-                addEdge(beforeNode.id, nextNode.id, {
-                    subModules: modules,
-                    disableMoveIds
-                });
+                if (nextNode) {
+                    addEdge(beforeNode.id, nextNode.id, prefix, {
+                        subModules: modules,
+                        disableMoveIds
+                    });
+                }
             }
             else {
                 modules.forEach((module, index) => {
                     const localDisableMoveIds = [...disableMoveIds, module.id];
                     // Add the edge between the previous node and the current one
-                    if (index > 0 && previousId) {
-                        addEdge(previousId, module.id, {
+                    if (index > 0 && previousId && expandedSubflows[module.id] == undefined) {
+                        addEdge(previousId, module.id, prefix, {
                             subModules: modules,
                             disableMoveIds
                         });
@@ -162,10 +220,10 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                                 type: 'noBranch'
                             };
                             nodes.push(startNode);
-                            addEdge(module.id, startNode.id, {
+                            addEdge(module.id, startNode.id, prefix, {
                                 type: 'empty'
                             });
-                            addEdge(startNode.id, endNode.id, {
+                            addEdge(startNode.id, endNode.id, prefix, {
                                 type: 'empty'
                             });
                         }
@@ -187,16 +245,18 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                                     type: 'branchAllStart'
                                 };
                                 nodes.push(startNode);
-                                addEdge(module.id, startNode.id, {
+                                addEdge(module.id, startNode.id, prefix, {
                                     type: 'empty'
                                 });
-                                processModules(branch.modules, startNode, endNode, currentOffset, localDisableMoveIds, parentIndex ? `${parentIndex}-${index}-${branchIndex}` : `${index}-${branchIndex}`);
+                                processModules(branch.modules, startNode, endNode, false, prefix, currentOffset, localDisableMoveIds, parentIndex ? `${parentIndex}-${index}-${branchIndex}` : `${index}-${branchIndex}`);
                             });
                         }
                         previousId = endNode.id;
                     }
                     else if (module.value.type === 'forloopflow') {
-                        addNode(module, currentOffset, 'module', modules);
+                        if (!simplifiedTriggerView) {
+                            addNode(module, currentOffset, 'module', modules);
+                        }
                         const startNode = {
                             id: `${module.id}-start`,
                             data: {
@@ -204,15 +264,23 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                                 id: module.id,
                                 module: module,
                                 modules: modules,
+                                simplifiedTriggerView,
                                 eventHandlers: eventHandlers,
                                 ...extra
                             },
                             position: { x: -1, y: -1 },
                             type: 'forLoopStart'
                         };
-                        addEdge(module.id, startNode.id, {
-                            type: 'empty'
-                        });
+                        if (!simplifiedTriggerView) {
+                            addEdge(module.id, startNode.id, prefix, {
+                                type: 'empty'
+                            });
+                        }
+                        else if (previousId) {
+                            addEdge(previousId, startNode.id, prefix, {
+                                type: 'empty'
+                            });
+                        }
                         const endNode = {
                             id: `${module.id}-end`,
                             data: {
@@ -221,6 +289,7 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                                 module: module,
                                 modules: modules,
                                 eventHandlers: eventHandlers,
+                                simplifiedTriggerView,
                                 ...extra
                             },
                             position: { x: -1, y: -1 },
@@ -229,7 +298,7 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                         nodes.push(startNode);
                         nodes.push(endNode);
                         const selectedIterIndex = extra.flowModuleStates?.[module.id]?.selectedForloopIndex;
-                        processModules(module.value.modules, startNode, endNode, currentOffset + 25, localDisableMoveIds, parentIndex
+                        processModules(module.value.modules, startNode, endNode, false, prefix, currentOffset + 25, localDisableMoveIds, parentIndex
                             ? `${parentIndex}-${index}-${selectedIterIndex ?? '?'}`
                             : `${index}-${selectedIterIndex ?? '?'}`);
                         previousId = endNode.id;
@@ -248,7 +317,7 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                             position: { x: -1, y: -1 },
                             type: 'whileLoopStart'
                         };
-                        addEdge(module.id, startNode.id, {
+                        addEdge(module.id, startNode.id, prefix, {
                             type: 'empty'
                         });
                         const endNode = {
@@ -260,7 +329,7 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                         nodes.push(startNode);
                         nodes.push(endNode);
                         const selectedIterIndex = extra.flowModuleStates?.[module.id]?.selectedForloopIndex;
-                        processModules(module.value.modules, startNode, endNode, currentOffset + 25, localDisableMoveIds, parentIndex
+                        processModules(module.value.modules, startNode, endNode, false, prefix, currentOffset + 25, localDisableMoveIds, parentIndex
                             ? `${parentIndex}-${index}-${selectedIterIndex ?? '?'}`
                             : `${index}-${selectedIterIndex ?? '?'}`);
                         previousId = endNode.id;
@@ -291,8 +360,9 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                             type: 'noBranch'
                         };
                         nodes.push(defaultBranch);
-                        addEdge(module.id, defaultBranch.id, { type: 'empty' });
-                        processModules(module.value.default, defaultBranch, endNode, currentOffset, localDisableMoveIds, parentIndex ? `${parentIndex}-${index}` : index.toString());
+                        addEdge(module.id, defaultBranch.id, prefix, { type: 'empty' });
+                        const branchChosen = extra.flowModuleStates?.[module.id]?.branchChosen;
+                        processModules(module.value.default, defaultBranch, endNode, false, prefix, currentOffset, localDisableMoveIds, parentIndex ? `${parentIndex}-${index}` : index.toString(), branchChosen == 0);
                         module.value.branches.forEach((branch, branchIndex) => {
                             // Start node by branch
                             const startNode = {
@@ -311,46 +381,104 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                                 type: 'branchOneStart'
                             };
                             nodes.push(startNode);
-                            addEdge(module.id, startNode.id, { type: 'empty' });
-                            processModules(branch.modules, startNode, endNode, currentOffset, localDisableMoveIds, parentIndex ? `${parentIndex}-${index}` : index.toString());
+                            addEdge(module.id, startNode.id, prefix, { type: 'empty' });
+                            processModules(branch.modules, startNode, endNode, false, prefix, currentOffset, localDisableMoveIds, parentIndex ? `${parentIndex}-${index}` : index.toString(), branchChosen == branchIndex + 1);
                         });
                         previousId = endNode.id;
                     }
                     else {
-                        addNode(module, currentOffset, 'module', modules);
-                        previousId = module.id;
+                        let expanded = expandedSubflows[module.id];
+                        if (expanded) {
+                            const startId = `${module.id}-subflow-start`;
+                            const idWithoutPrefix = module.id.startsWith('subflow:')
+                                ? module.id.substring(8)
+                                : module.id;
+                            const startNode = {
+                                id: startId,
+                                data: {
+                                    offset: currentOffset,
+                                    label: `Start of subflow ${idWithoutPrefix}`,
+                                    id: startId,
+                                    subflowId: module.id,
+                                    modules: modules,
+                                    eventHandlers: eventHandlers,
+                                    ...extra
+                                },
+                                position: { x: -1, y: -1 },
+                                type: 'subflowBound'
+                            };
+                            nodes.push(startNode);
+                            if (previousId) {
+                                addEdge(previousId, startNode.id, prefix, { type: 'empty' });
+                            }
+                            else {
+                                addEdge(beforeNode.id, startNode.id, prefix, { type: 'empty' });
+                            }
+                            const endId = `${module.id}-subflow-end`;
+                            const endNode = {
+                                id: endId,
+                                data: {
+                                    offset: currentOffset,
+                                    label: `End of subflow ${idWithoutPrefix}`,
+                                    id: endId,
+                                    subflowId: module.id,
+                                    modules: modules,
+                                    eventHandlers: eventHandlers,
+                                    ...extra
+                                },
+                                position: { x: -1, y: -1 },
+                                type: 'subflowBound'
+                            };
+                            nodes.push(endNode);
+                            processModules(expanded, startNode, endNode, false, buildPrefix(prefix, module['oid'] ?? module.id), currentOffset, localDisableMoveIds);
+                            previousId = endNode.id;
+                        }
+                        else {
+                            addNode(module, currentOffset, 'module', modules);
+                            previousId = module.id;
+                        }
                     }
-                    if (index === 0) {
-                        addEdge(beforeNode.id, module.id, {
+                    if (index === 0 && expandedSubflows[module.id] == undefined) {
+                        addEdge(beforeNode.id, module.id, prefix, {
                             subModules: modules,
-                            disableMoveIds
+                            disableMoveIds,
+                            disableInsert: simplifiedTriggerView
                         });
                     }
-                    if (index === modules.length - 1 && previousId) {
-                        addEdge(previousId, nextNode.id, {
+                    if (index === modules.length - 1 && previousId && nextNode) {
+                        addEdge(previousId, nextNode.id, prefix, {
                             subModules: modules,
                             disableMoveIds
                         });
                     }
                 });
-                if (failureModule) {
-                    const id = parentIndex ? `failure-${parentIndex}` : 'failure';
+            }
+        }
+        if (simplifiableFlow?.simplifiedFlow === true && triggerNode) {
+            processModules(modules, triggerNode, undefined, true, undefined);
+        }
+        else {
+            processModules(modules, inputNode, resultNode, false, undefined);
+        }
+        if (failureModule) {
+            let toAdd = {};
+            Object.keys(extra.flowModuleStates ?? {}).forEach((id) => {
+                if (id.startsWith('failure-')) {
                     const failureState = extra.flowModuleStates?.[id];
-                    if (failureState && failureState.parent_module) {
-                        addNode({
-                            ...failureModule,
-                            id: id
-                        }, 0, 'module');
-                        addEdge(failureState.parent_module, id, { type: 'empty' });
+                    if (failureState?.parent_module) {
+                        toAdd[failureState.parent_module] = id;
                     }
                 }
-            }
+            });
+            Object.entries(toAdd).forEach((x) => {
+                addNode({ ...failureModule, id: x[1] }, 0, 'module');
+                addEdge(x[0], x[1], undefined, { type: 'empty' });
+            });
         }
-        processModules(modules, inputNode, resultNode);
         if (preprocessorModule) {
             addNode(preprocessorModule, 0, 'module');
             const id = JSON.parse(JSON.stringify(preprocessorModule.id));
-            addEdge(id, 'Input', { type: 'empty' });
+            addEdge(id, 'Input', undefined, { type: 'empty' });
         }
         if (failureModule && !extra.flowModuleStates) {
             addNode(failureModule, 0, 'module');
@@ -374,7 +502,7 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                                 pid = parent.id;
                             }
                         }
-                        addEdge(pid, selectedId, {
+                        addEdge(pid, selectedId, undefined, {
                             customId: `dep-${pid}-${selectedId}-${input}-${index}`,
                             type: 'dataflowedge'
                         });
@@ -382,7 +510,7 @@ export default function graphBuilder(modules, extra, failureModule, preprocessor
                 });
                 Object.entries(deps.dependents).forEach((x, i) => {
                     let pid = x[0];
-                    addEdge(selectedId, pid, {
+                    addEdge(selectedId, pid, undefined, {
                         customId: `dep-${selectedId}-${pid}-${i}`,
                         type: 'dataflowedge'
                     });

package/package/components/graph/model.d.ts

@@ -53,6 +53,7 @@ export type GraphModuleState = {
     parent_module?: string;
     selectedForloop?: string;
     selectedForloopIndex?: number;
+    selectedForLoopSetManually?: boolean;
     flow_jobs_success?: (boolean | undefined)[];
     flow_jobs?: string[];
     iteration_total?: number;

package/package/components/graph/renderers/edges/BaseEdge.svelte

@@ -66,45 +66,6 @@ const { useDataflow } = getContext('FlowGraphContext');
 				}}
 			/>
 		</div>
-		{#if data.enableTrigger}
-			<div
-				class="edgeButtonContainer nodrag nopan"
-				style:transform="translate(100%, 50%) translate({sourceX}px,{sourceY + 2}px)"
-			>
-				<InsertModuleButton
-					disableAi={data.disableAi}
-					on:new={(e) => {
-						// console.log('new', e)
-						data?.eventHandlers.insert({
-							modules: data.modules,
-							index: data.index,
-							kind: e.detail.kind,
-							inlineScript: e.detail.inlineScript
-						})
-					}}
-					on:pickScript={(e) => {
-						// console.log('pickScript', e)
-						data?.eventHandlers.insert({
-							modules: data.modules,
-							index: data.index,
-							script: e.detail,
-							kind: e.detail.kind
-						})
-					}}
-					on:pickFlow={(e) => {
-						// console.log('pickFlow', e)
-						data?.eventHandlers.insert({
-							modules: data.modules,
-							index: data.index,
-							flow: e.detail
-						})
-					}}
-					kind="trigger"
-					index={data?.index ?? 0}
-					modules={data?.modules ?? []}
-				/>
-			</div>
-		{/if}
 	{/if}
 
 	{#if data?.moving}

package/package/components/graph/renderers/edges/HiddenBaseEdge.svelte

@@ -0,0 +1,5 @@
+<script>import { BaseEdge } from '@xyflow/svelte';
+export let markerEnd = undefined;
+</script>
+
+<BaseEdge path={''} {markerEnd} class="hidden" />

package/package/components/graph/renderers/edges/HiddenBaseEdge.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        markerEnd?: string | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type HiddenBaseEdgeProps = typeof __propDef.props;
+export type HiddenBaseEdgeEvents = typeof __propDef.events;
+export type HiddenBaseEdgeSlots = typeof __propDef.slots;
+export default class HiddenBaseEdge extends SvelteComponent<HiddenBaseEdgeProps, HiddenBaseEdgeEvents, HiddenBaseEdgeSlots> {
+}
+export {};

package/package/components/graph/renderers/nodes/ForLoopEndNode.svelte

@@ -5,15 +5,30 @@ export let data;
 </script>
 
 <NodeWrapper offset={data.offset} let:darkMode>
-	<VirtualItem
-		label={'Collect result of each iteration'}
-		selectable={true}
-		selected={false}
-		id={data.id}
-		bgColor={getStateColor(undefined, darkMode)}
-		borderColor={getStateColor(data.flowModuleStates?.[data.id]?.type, darkMode)}
-		on:select={(e) => {
-			data?.eventHandlers?.select(e.detail)
-		}}
-	/>
+	{#if data.simplifiedTriggerView}
+		<VirtualItem
+			label={'Each event is processed'}
+			selectable={false}
+			selected={false}
+			id={data.id}
+			hideId
+			bgColor={getStateColor(undefined, darkMode)}
+			borderColor={getStateColor(data.flowModuleStates?.[data.id]?.type, darkMode)}
+			on:select={(e) => {
+				data?.eventHandlers?.select(e.detail)
+			}}
+		/>
+	{:else}
+		<VirtualItem
+			label={'Collect result of each iteration'}
+			selectable={true}
+			selected={false}
+			id={data.id}
+			bgColor={getStateColor(undefined, darkMode)}
+			borderColor={getStateColor(data.flowModuleStates?.[data.id]?.type, darkMode)}
+			on:select={(e) => {
+				data?.eventHandlers?.select(e.detail)
+			}}
+		/>
+	{/if}
 </NodeWrapper>

package/package/components/graph/renderers/nodes/ForLoopEndNode.svelte.d.ts

@@ -9,6 +9,7 @@ declare const __propDef: {
             insertable: boolean;
             flowModuleStates: Record<string, GraphModuleState> | undefined;
             eventHandlers: GraphEventHandlers;
+            simplifiedTriggerView: boolean;
         };
     };
     events: {

package/package/components/graph/renderers/nodes/ForLoopStartNode.svelte

@@ -1,20 +1,41 @@
 <script>import VirtualItem from '../../../flows/map/VirtualItem.svelte';
 import NodeWrapper from './NodeWrapper.svelte';
 import { getStateColor } from '../../util';
+import { getContext } from 'svelte';
 export let data;
+const propPickerContext = getContext('PropPickerContext');
+const pickablePropertiesFiltered = propPickerContext?.pickablePropertiesFiltered;
+$: filteredInput = filterIterFromInput($pickablePropertiesFiltered?.flow_input);
+function filterIterFromInput(inputJson) {
+    if (!inputJson || typeof inputJson !== 'object' || !inputJson.iter)
+        return {};
+    return { iter: inputJson.iter };
+}
+function computeStatus(state) {
+    if (state?.type == 'InProgress' || state?.type == 'Success' || state?.type == 'Failure') {
+        let r = state?.flow_jobs_success?.[state?.selectedForloopIndex ?? 0];
+        if (r == undefined)
+            return 'InProgress';
+        return r ? 'Success' : 'InProgress';
+    }
+}
 </script>
 
+
+
 <NodeWrapper let:darkMode offset={data.offset}>
 	<VirtualItem
-		label={'Do one iteration'}
+		label={data.simplifiedTriggerView ? 'For each new event' : 'Do one iteration'}
 		selectable={false}
 		selected={false}
 		id={data.id}
 		hideId
 		bgColor={getStateColor(undefined, darkMode)}
-		borderColor={getStateColor(data.flowModuleStates?.[data.id]?.type, darkMode)}
+		borderColor={getStateColor(computeStatus(data.flowModuleStates?.[data.id]), darkMode)}
 		on:select={(e) => {
 			data?.eventHandlers?.select(e.detail)
 		}}
+		inputJson={filteredInput}
+		prefix="flow_input"
 	/>
 </NodeWrapper>

package/package/components/graph/renderers/nodes/ForLoopStartNode.svelte.d.ts

@@ -10,6 +10,7 @@ declare const __propDef: {
             modules: FlowModule[];
             flowModuleStates: Record<string, GraphModuleState> | undefined;
             eventHandlers: GraphEventHandlers;
+            simplifiedTriggerView: boolean;
         };
     };
     events: {

package/package/components/graph/renderers/nodes/InputNode.svelte

@@ -2,18 +2,24 @@
 import NodeWrapper from './NodeWrapper.svelte';
 import { getStateColor } from '../../util';
 import { getContext } from 'svelte';
-import FlowCopilotButton from '../../../flows/map/FlowCopilotButton.svelte';
 import InsertModuleButton from '../../../flows/map/InsertModuleButton.svelte';
 export let data;
 const { selectedId } = getContext('FlowGraphContext');
+const propPickerContext = getContext('PropPickerContext');
+const pickablePropertiesFiltered = propPickerContext?.pickablePropertiesFiltered;
+function filterIterFromInput(inputJson) {
+    if (!inputJson || typeof inputJson !== 'object')
+        return {};
+    const newJson = { ...inputJson };
+    delete newJson.iter;
+    return newJson;
+}
+$: filteredInput = filterIterFromInput($pickablePropertiesFiltered?.flow_input);
 </script>
 
 <NodeWrapper let:darkMode>
-	{#if data.insertable && !data.disableAi && !data.hasPreprocessor}
-		<FlowCopilotButton className="-top-[4.25rem]" />
-	{/if}
 	{#if data.insertable && !data.hasPreprocessor}
-		<div class="absolute -top-8 left-1/2 transform -translate-x-1/2 z-10">
+		<div class="absolute bottom-full left-0 right-0 flex center-center mb-3.5">
 			<InsertModuleButton
 				disableAi={data.disableAi}
 				index={data.index ?? 0}
@@ -36,6 +42,8 @@ const { selectedId } = getContext('FlowGraphContext');
 						detail: 'preprocessor'
 					})
 				}}
+				class="w-[14px] h-[14px]"
+				iconSize={10}
 			/>
 		</div>
 	{/if}
@@ -50,5 +58,8 @@ const { selectedId } = getContext('FlowGraphContext');
 		on:select={(e) => {
 			data.eventHandlers?.select(e.detail)
 		}}
+		inputJson={filteredInput}
+		prefix="flow_input"
+		alwaysPluggable
 	/>
 </NodeWrapper>

package/package/components/graph/renderers/nodes/InputNode.svelte.d.ts

@@ -10,7 +10,6 @@ declare const __propDef: {
             moving: string | undefined;
             eventHandlers: GraphEventHandlers;
             index: number;
-            enableTrigger: boolean;
             disableAi: boolean;
             disableMoveIds: string[];
         };