n8n-editor-ui 1.47.0 → 1.47.1

package/dist/assets/{NodeView.v2-DyU_S0rY.js.map → NodeView.v2-D_CKj9CS.js.map}

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["workflowRunning","nodeDisabledTitle","emit","__emit","$style","useCssModule","node","inject","CanvasNodeKey","i18n","useI18n","data","computed","executeNode","toggleDisableNode","deleteNode","openContextMenu","_e","_type","useNodeConnections","inputs","outputs","mainInputs","unref","input","NodeConnectionType","nonMainInputs","requiredNonMainInputs","mainOutputs","output","nonMainOutputs","label","classes","styles","stylesObject","spacerCount","slots","_useSlots","Render","Component","CanvasNodeConfigurable","CanvasNodeConfiguration","CanvasNodeDefault","h","handle","CanvasNodeHandleKey","props","__props","handleType","isConnectableStart","isConnectableEnd","renderProps","CanvasHandleMainInput","CanvasHandleMainOutput","CanvasHandleNonMain","toRef","provide","nodeTypesStore","useNodeTypesStore","nodeType","inputsWithPosition","mapEndpointWithPosition","Position","outputsWithPosition","position","offsetAxis","endpoint","index","endpoints","id","selected","onDelete","onActivate","edgeStyle","isEdgeToolbarVisible","edgeToolbarStyle","path","edgeToolbarClasses","getBezierPath","connection","getSelectedEdges","getSelectedNodes","useVueFlow","hoveredEdges","ref","onMounted","onKeyDown","onUnmounted","onNodeDragStop","e","onSetNodeActive","onDeleteNode","onDeleteConnection","onConnect","args","onMouseEnterEdge","event","onMouseLeaveEdge","mapLegacyConnectionsToCanvasConnections","legacyConnections","nodes","mappedConnections","fromNodeName","fromId","_a","fromConnectionType","toPorts","fromIndex","toPort","toId","toConnectionType","toIndex","parseCanvasConnectionHandleString","type","resolvedType","isValidNodeConnectionType","resolvedIndex","mapCanvasConnectionToLegacyConnection","sourceNode","targetNode","sourceNodeName","sourceType","sourceIndex","targetNodeName","targetType","targetIndex","mapLegacyEndpointsToCanvasConnectionPort","endpointIndex","required","getUniqueNodeName","name","existingNames","i","newName","uuid","useCanvasMapping","workflow","workflowObject","locale","renderTypeByNodeType","acc","renderType","nodeInputsById","nodeTypeDescription","workflowObjectNode","NodeHelpers.getNodeInputs","nodeOutputsById","NodeHelpers.getNodeOutputs","elements","connections","getConnectionType","getConnectionLabel","_","pinData","_b","uiStore","useUIStore","runButtonText","useCanvasOperations","workflowsStore","useWorkflowsStore","historyStore","useHistoryStore","ndvStore","useNDVStore","telemetry","useTelemetry","externalHooks","useExternalHooks","updateNodePosition","trackHistory","trackBulk","oldPosition","newPosition","MoveNodeCommand","renameNode","currentName","RenameNodeCommand","revertRenameNode","previousName","RemoveNodeCommand","trackDeleteNode","revertDeleteNode","STICKY_NODE_TYPE","QUICKSTART_NOTE_NAME","setNodeActive","setNodeActiveByName","createConnection","isConnectionAllowed","mappedConnection","deleteConnection","RemoveConnectionCommand","revertDeleteConnection","NodeCreation","defineAsyncComponent","__vitePreload","n","NodeDetailsView","router","useRouter","route","useRoute","toast","useToast","tagsStore","useTagsStore","sourceControlStore","useSourceControlStore","nodeCreatorStore","useNodeCreatorStore","settingsStore","useSettingsStore","credentialsStore","useCredentialsStore","environmentsStore","useEnvironmentsStore","externalSecretsStore","useExternalSecretsStore","rootStore","useRootStore","collaborationStore","useCollaborationStore","executionsStore","useExecutionsStore","runWorkflow","useRunWorkflow","isLoading","readOnlyNotification","isProductionExecutionPreview","isExecutionPreview","canOpenNDV","hideNodeIssues","workflowId","editableWorkflow","editableWorkflowObject","isDemoRoute","VIEWS","isReadOnlyRoute","isReadOnlyEnvironment","triggerNodes","initialize","loadPromises","EnterpriseEditionFeature","error","initializeEditableWorkflow","addUndoRedoEventBindings","addPostMessageEventBindings","onBeforeUnmount","removePostMessageEventBindings","removeUndoRedoEventBindings","historyBus","onRevertDeleteNode","onRevertDeleteConnection","onRevertRenameNode","onPostMessageReceived","targetWorkflow","tags","tagIds","tag","onRunWorkflow","onUpdateNodePosition","onCreateConnection","onAddNodes","dragAndDrop","currentPosition","nodePosition","isAutoAdd","openDetail","onNodeCreate","lastAddedNode","NodeViewUtils.NODE_SIZE","NodeViewUtils.GRID_SIZE","newNodesOffset","from","to","fromNode","toNode","lastNodeInputs","nodeUi","_options","checkIfEditingIsAllowed","newNodeData","createNodeWithDefaultCredentials","nodeVersion","messageContext","message","json","importWorkflowExact","openExecution","onSwitchSelectedNode","nodeName","onOpenConnectionNodeCreator","connectionType","onToggleNodeCreator","options","_executionId","_workflow","onUpdateNodeValue","parameterData"],"ignoreList":[],"sources":["../../src/components/canvas/elements/nodes/CanvasNodeToolbar.vue","../../src/composables/useNodeConnections.ts","../../src/components/canvas/elements/nodes/render-types/CanvasNodeDefault.vue","../../src/components/canvas/elements/nodes/render-types/CanvasNodeConfiguration.vue","../../src/components/canvas/elements/nodes/render-types/CanvasNodeConfigurable.vue","../../src/components/canvas/elements/nodes/CanvasNodeRenderer.vue","../../src/components/canvas/elements/handles/render-types/CanvasHandleMainInput.vue","../../src/components/canvas/elements/handles/render-types/CanvasHandleMainOutput.vue","../../src/components/canvas/elements/handles/render-types/CanvasHandleNonMain.vue","../../src/components/canvas/elements/handles/HandleRenderer.vue","../../src/components/canvas/elements/nodes/CanvasNode.vue","../../src/components/canvas/elements/edges/CanvasEdgeToolbar.vue","../../src/components/canvas/elements/edges/CanvasEdge.vue","../../src/components/canvas/Canvas.vue","../../src/utils/canvasUtilsV2.ts","../../src/composables/useCanvasMapping.ts","../../src/components/canvas/WorkflowCanvas.vue","../../src/components/canvas/elements/buttons/CanvasExecuteWorkflowButton.vue","../../src/composables/useCanvasOperations.ts","../../src/views/NodeView.v2.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeKey } from '@/constants';\nimport { useI18n } from '@/composables/useI18n';\n\nconst emit = defineEmits(['delete']);\nconst $style = useCssModule();\n\nconst node = inject(CanvasNodeKey);\n\nconst i18n = useI18n();\n\nconst data = computed(() => node?.data.value);\n\n// @TODO\nconst workflowRunning = false;\n\n// @TODO\nconst nodeDisabledTitle = 'Test';\n\n// @TODO\nfunction executeNode() {}\n\n// @TODO\nfunction toggleDisableNode() {}\n\nfunction deleteNode() {\n\temit('delete');\n}\n\n// @TODO\nfunction openContextMenu(_e: MouseEvent, _type: string) {}\n</script>\n\n<template>\n\t<div :class=\"$style.canvasNodeToolbar\">\n\t\t<div :class=\"$style.canvasNodeToolbarItems\">\n\t\t\t<N8nIconButton\n\t\t\t\tv-if=\"data?.renderType !== 'configuration'\"\n\t\t\t\tdata-test-id=\"execute-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\ttext\n\t\t\t\tsize=\"small\"\n\t\t\t\ticon=\"play\"\n\t\t\t\t:disabled=\"workflowRunning\"\n\t\t\t\t:title=\"i18n.baseText('node.testStep')\"\n\t\t\t\t@click=\"executeNode\"\n\t\t\t/>\n\t\t\t<N8nIconButton\n\t\t\t\tdata-test-id=\"disable-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\ttext\n\t\t\t\tsize=\"small\"\n\t\t\t\ticon=\"power-off\"\n\t\t\t\t:title=\"nodeDisabledTitle\"\n\t\t\t\t@click=\"toggleDisableNode\"\n\t\t\t/>\n\t\t\t<N8nIconButton\n\t\t\t\tdata-test-id=\"delete-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\tsize=\"small\"\n\t\t\t\ttext\n\t\t\t\ticon=\"trash\"\n\t\t\t\t:title=\"i18n.baseText('node.delete')\"\n\t\t\t\t@click=\"deleteNode\"\n\t\t\t/>\n\t\t\t<N8nIconButton\n\t\t\t\tdata-test-id=\"overflow-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\tsize=\"small\"\n\t\t\t\ttext\n\t\t\t\ticon=\"ellipsis-h\"\n\t\t\t\t@click=\"(e: MouseEvent) => openContextMenu(e, 'node-button')\"\n\t\t\t/>\n\t\t</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.canvasNodeToolbar {\n\tpadding-bottom: var(--spacing-3xs);\n}\n\n.canvasNodeToolbarItems {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n</style>\n","import type { CanvasElementData } from '@/types';\nimport type { MaybeRef } from 'vue';\nimport { computed, unref } from 'vue';\nimport { NodeConnectionType } from 'n8n-workflow';\n\nexport function useNodeConnections({\n\tinputs,\n\toutputs,\n}: {\n\tinputs: MaybeRef<CanvasElementData['inputs']>;\n\toutputs: MaybeRef<CanvasElementData['outputs']>;\n}) {\n\t/**\n\t * Inputs\n\t */\n\n\tconst mainInputs = computed(() =>\n\t\tunref(inputs).filter((input) => input.type === NodeConnectionType.Main),\n\t);\n\n\tconst nonMainInputs = computed(() =>\n\t\tunref(inputs).filter((input) => input.type !== NodeConnectionType.Main),\n\t);\n\n\tconst requiredNonMainInputs = computed(() =>\n\t\tnonMainInputs.value.filter((input) => input.required),\n\t);\n\n\t/**\n\t * Outputs\n\t */\n\n\tconst mainOutputs = computed(() =>\n\t\tunref(outputs).filter((output) => output.type === NodeConnectionType.Main),\n\t);\n\tconst nonMainOutputs = computed(() =>\n\t\tunref(outputs).filter((output) => output.type !== NodeConnectionType.Main),\n\t);\n\n\treturn {\n\t\tmainInputs,\n\t\tnonMainInputs,\n\t\trequiredNonMainInputs,\n\t\tmainOutputs,\n\t\tnonMainOutputs,\n\t};\n}\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { useNodeConnections } from '@/composables/useNodeConnections';\nimport { CanvasNodeKey } from '@/constants';\n\nconst node = inject(CanvasNodeKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => node?.label.value ?? '');\nconst inputs = computed(() => node?.data.value.inputs ?? []);\nconst outputs = computed(() => node?.data.value.outputs ?? []);\n\nconst { mainOutputs } = useNodeConnections({\n\tinputs,\n\toutputs,\n});\n\nconst classes = computed(() => {\n\treturn {\n\t\t[$style.node]: true,\n\t\t[$style.selected]: node?.selected.value,\n\t};\n});\n\nconst styles = computed(() => {\n\treturn {\n\t\t'--node-main-output-count': mainOutputs.value.length,\n\t};\n});\n</script>\n\n<template>\n\t<div v-if=\"node\" :class=\"classes\" :style=\"styles\" data-test-id=\"canvas-node-default\">\n\t\t<slot />\n\t\t<div v-if=\"label\" :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.node {\n\theight: calc(100px + max(0, var(--node-main-output-count, 1) - 4) * 50px);\n\twidth: 100px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--canvas-node--background, var(--color-node-background));\n\tborder: 2px solid var(--canvas-node--border-color, var(--color-foreground-xdark));\n\tborder-radius: var(--border-radius-large);\n}\n\n.label {\n\ttop: 100%;\n\tposition: absolute;\n\tfont-size: var(--font-size-m);\n\ttext-align: center;\n\twidth: 100%;\n\tmin-width: 200px;\n\tmargin-top: var(--spacing-2xs);\n}\n\n.selected {\n\tbox-shadow: 0 0 0 4px var(--color-canvas-selected);\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeKey } from '@/constants';\n\nconst node = inject(CanvasNodeKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => node?.label.value ?? '');\n\nconst classes = computed(() => {\n\treturn {\n\t\t[$style.node]: true,\n\t\t[$style.selected]: node?.selected.value,\n\t};\n});\n</script>\n\n<template>\n\t<div :class=\"classes\" data-test-id=\"canvas-node-configuration\">\n\t\t<slot />\n\t\t<div v-if=\"label\" :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.node {\n\twidth: 75px;\n\theight: 75px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--canvas-node--background, var(--node-type-supplemental-background));\n\tborder: 2px solid var(--canvas-node--border-color, var(--color-foreground-dark));\n\tborder-radius: 50%;\n}\n\n.selected {\n\tbox-shadow: 0 0 0 4px var(--color-canvas-selected);\n}\n\n.label {\n\ttop: 100%;\n\tposition: absolute;\n\tfont-size: var(--font-size-m);\n\ttext-align: center;\n\twidth: 100%;\n\tmin-width: 200px;\n\tmargin-top: var(--spacing-2xs);\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeKey, NODE_INSERT_SPACER_BETWEEN_INPUT_GROUPS } from '@/constants';\nimport { useNodeConnections } from '@/composables/useNodeConnections';\n\nconst node = inject(CanvasNodeKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => node?.label.value ?? '');\nconst inputs = computed(() => node?.data.value.inputs ?? []);\nconst outputs = computed(() => node?.data.value.outputs ?? []);\n\nconst { nonMainInputs, requiredNonMainInputs } = useNodeConnections({\n\tinputs,\n\toutputs,\n});\n\nconst classes = computed(() => {\n\treturn {\n\t\t[$style.node]: true,\n\t\t[$style.selected]: node?.selected.value,\n\t};\n});\n\nconst styles = computed(() => {\n\tconst stylesObject: {\n\t\t[key: string]: string | number;\n\t} = {};\n\n\tif (requiredNonMainInputs.value.length > 0) {\n\t\tlet spacerCount = 0;\n\t\tif (NODE_INSERT_SPACER_BETWEEN_INPUT_GROUPS) {\n\t\t\tconst requiredNonMainInputsCount = requiredNonMainInputs.value.length;\n\t\t\tconst optionalNonMainInputsCount = nonMainInputs.value.length - requiredNonMainInputsCount;\n\t\t\tspacerCount = requiredNonMainInputsCount > 0 && optionalNonMainInputsCount > 0 ? 1 : 0;\n\t\t}\n\n\t\tstylesObject['--configurable-node-input-count'] = nonMainInputs.value.length + spacerCount;\n\t}\n\n\treturn stylesObject;\n});\n</script>\n\n<template>\n\t<div :class=\"classes\" :style=\"styles\" data-test-id=\"canvas-node-configurable\">\n\t\t<slot />\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.node {\n\t--configurable-node-min-input-count: 4;\n\t--configurable-node-input-width: 65px;\n\n\twidth: calc(\n\t\tmax(var(--configurable-node-input-count, 5), var(--configurable-node-min-input-count)) *\n\t\t\tvar(--configurable-node-input-width)\n\t);\n\theight: 100px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--canvas-node--background, var(--color-node-background));\n\tborder: 2px solid var(--canvas-node--border-color, var(--color-foreground-xdark));\n\tborder-radius: var(--border-radius-large);\n}\n\n.label {\n\ttop: 100%;\n\tfont-size: var(--font-size-m);\n\ttext-align: center;\n\tmargin-left: var(--spacing-s);\n\tmax-width: calc(\n\t\tvar(--node-width) - var(--configurable-node-icon-offset) - var(--configurable-node-icon-size) -\n\t\t\t2 * var(--spacing-s)\n\t);\n}\n\n.selected {\n\tbox-shadow: 0 0 0 4px var(--color-canvas-selected);\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { h, inject } from 'vue';\nimport CanvasNodeDefault from '@/components/canvas/elements/nodes/render-types/CanvasNodeDefault.vue';\nimport CanvasNodeConfiguration from '@/components/canvas/elements/nodes/render-types/CanvasNodeConfiguration.vue';\nimport CanvasNodeConfigurable from '@/components/canvas/elements/nodes/render-types/CanvasNodeConfigurable.vue';\nimport { CanvasNodeKey } from '@/constants';\n\nconst node = inject(CanvasNodeKey);\n\nconst slots = defineSlots<{\n\tdefault?: () => unknown;\n}>();\n\nconst Render = () => {\n\tlet Component;\n\tswitch (node?.data.value.renderType) {\n\t\tcase 'configurable':\n\t\t\tComponent = CanvasNodeConfigurable;\n\t\t\tbreak;\n\n\t\tcase 'configuration':\n\t\t\tComponent = CanvasNodeConfiguration;\n\t\t\tbreak;\n\n\t\tcase 'trigger':\n\t\t\tComponent = CanvasNodeDefault;\n\t\t\tbreak;\n\n\t\tdefault:\n\t\t\tComponent = CanvasNodeDefault;\n\t}\n\n\treturn h(Component, slots.default);\n};\n</script>\n\n<template>\n\t<Render />\n</template>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst handle = inject(CanvasNodeHandleKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => handle?.label.value ?? '');\n</script>\n<template>\n\t<div :class=\"['canvas-node-handle-main-input', $style.handle]\">\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: 8px;\n\theight: 16px;\n\tborder-radius: 0;\n\tbackground: var(--color-foreground-xdark);\n\n\t&:hover {\n\t\tbackground: var(--color-primary);\n\t}\n}\n\n.label {\n\tposition: absolute;\n\ttop: 50%;\n\tright: 12px;\n\ttransform: translate(0, -50%);\n\tfont-size: var(--font-size-2xs);\n\tcolor: var(--color-foreground-xdark);\n\tbackground: var(--color-background-light);\n\tz-index: 1;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst handle = inject(CanvasNodeHandleKey);\n\n// const group = svg.node('g');\n// const containerBorder = svg.node('rect', {\n// \trx: 3,\n// \t'stroke-width': 2,\n// \tfillOpacity: 0,\n// \theight: ep.params.dimensions - 2,\n// \twidth: ep.params.dimensions - 2,\n// \ty: 1,\n// \tx: 1,\n// });\n// const plusPath = svg.node('path', {\n// \td: 'm16.40655,10.89837l-3.30491,0l0,-3.30491c0,-0.40555 -0.32889,-0.73443 -0.73443,-0.73443l-0.73443,0c-0.40554,0 -0.73442,0.32888 -0.73442,0.73443l0,3.30491l-3.30491,0c-0.40555,0 -0.73443,0.32888 -0.73443,0.73442l0,0.73443c0,0.40554 0.32888,0.73443 0.73443,0.73443l3.30491,0l0,3.30491c0,0.40554 0.32888,0.73442 0.73442,0.73442l0.73443,0c0.40554,0 0.73443,-0.32888 0.73443,-0.73442l0,-3.30491l3.30491,0c0.40554,0 0.73442,-0.32889 0.73442,-0.73443l0,-0.73443c0,-0.40554 -0.32888,-0.73442 -0.73442,-0.73442z',\n// });\n// if (ep.params.size !== 'medium') {\n// \tep.addClass(ep.params.size);\n// }\n// group.appendChild(containerBorder);\n// group.appendChild(plusPath);\n//\n// ep.setupOverlays();\n// ep.setVisible(false);\n// return group;\n\nconst $style = useCssModule();\n\nconst label = computed(() => handle?.label.value ?? '');\n</script>\n<template>\n\t<div :class=\"['canvas-node-handle-main-output', $style.handle]\">\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t\t<div :class=\"$style.circle\" />\n\t\t<!-- @TODO Determine whether handle is connected and find a way to make it work without pointer-events: none -->\n\t\t<!--\t\t<svg :class=\"$style.plus\" viewBox=\"0 0 70 24\">-->\n\t\t<!--\t\t\t<line x1=\"0\" y1=\"12\" x2=\"46\" y2=\"12\" stroke=\"var(&#45;&#45;color-foreground-xdark)\" />-->\n\t\t<!--\t\t\t<rect-->\n\t\t<!--\t\t\t\tx=\"46\"-->\n\t\t<!--\t\t\t\ty=\"2\"-->\n\t\t<!--\t\t\t\twidth=\"20\"-->\n\t\t<!--\t\t\t\theight=\"20\"-->\n\t\t<!--\t\t\t\tstroke=\"var(&#45;&#45;color-foreground-xdark)\"-->\n\t\t<!--\t\t\t\tstroke-width=\"2\"-->\n\t\t<!--\t\t\t\trx=\"4\"-->\n\t\t<!--\t\t\t\tfill=\"#ffffff\"-->\n\t\t<!--\t\t\t/>-->\n\t\t<!--\t\t\t<g transform=\"translate(44, 0)\">-->\n\t\t<!--\t\t\t\t<path-->\n\t\t<!--\t\t\t\t\tfill=\"var(&#45;&#45;color-foreground-xdark)\"-->\n\t\t<!--\t\t\t\t\td=\"m16.40655,10.89837l-3.30491,0l0,-3.30491c0,-0.40555 -0.32889,-0.73443 -0.73443,-0.73443l-0.73443,0c-0.40554,0 -0.73442,0.32888 -0.73442,0.73443l0,3.30491l-3.30491,0c-0.40555,0 -0.73443,0.32888 -0.73443,0.73442l0,0.73443c0,0.40554 0.32888,0.73443 0.73443,0.73443l3.30491,0l0,3.30491c0,0.40554 0.32888,0.73442 0.73442,0.73442l0.73443,0c0.40554,0 0.73443,-0.32888 0.73443,-0.73442l0,-3.30491l3.30491,0c0.40554,0 0.73442,-0.32889 0.73442,-0.73443l0,-0.73443c0,-0.40554 -0.32888,-0.73442 -0.73442,-0.73442z\"-->\n\t\t<!--\t\t\t\t></path>-->\n\t\t<!--\t\t\t</g>-->\n\t\t<!--\t\t</svg>-->\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: 16px;\n\theight: 16px;\n}\n\n.circle {\n\twidth: 16px;\n\theight: 16px;\n\tborder-radius: 100%;\n\tbackground: var(--color-foreground-xdark);\n\n\t&:hover {\n\t\tbackground: var(--color-primary);\n\t}\n}\n\n.plus {\n\tposition: absolute;\n\tleft: 16px;\n\ttop: 50%;\n\ttransform: translate(0, -50%);\n\twidth: 70px;\n\theight: 24px;\n\n\t:global(.vue-flow__handle.connecting) & {\n\t\tdisplay: none;\n\t}\n}\n\n.label {\n\tposition: absolute;\n\ttop: 50%;\n\tleft: 20px;\n\ttransform: translate(0, -50%);\n\tfont-size: var(--font-size-2xs);\n\tcolor: var(--color-foreground-xdark);\n\tbackground: var(--color-background-light);\n\tz-index: 1;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst handle = inject(CanvasNodeHandleKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => handle?.label.value ?? '');\n</script>\n<template>\n\t<div :class=\"['canvas-node-handle-non-main', $style.handle]\">\n\t\t<div :class=\"$style.diamond\" />\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: 14px;\n\theight: 14px;\n\tborder-radius: 0;\n}\n\n.diamond {\n\twidth: 14px;\n\theight: 14px;\n\ttransform: rotate(45deg);\n\tbackground: hsl(\n\t\tvar(--node-type-supplemental-color-h) var(--node-type-supplemental-color-s)\n\t\t\tvar(--node-type-supplemental-color-l)\n\t);\n\n\t&:hover {\n\t\tbackground: var(--color-primary);\n\t}\n}\n\n.label {\n\tposition: absolute;\n\ttop: 18px;\n\tleft: 50%;\n\ttransform: translate(-50%, 0);\n\tfont-size: var(--font-size-2xs);\n\tcolor: var(--color-foreground-xdark);\n\tbackground: var(--color-background-light);\n\tz-index: 1;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, h, provide, toRef, useCssModule } from 'vue';\nimport type { CanvasConnectionPort, CanvasElementPortWithPosition } from '@/types';\n\nimport { Handle } from '@vue-flow/core';\nimport { NodeConnectionType } from 'n8n-workflow';\nimport CanvasHandleMainInput from '@/components/canvas/elements/handles/render-types/CanvasHandleMainInput.vue';\nimport CanvasHandleMainOutput from '@/components/canvas/elements/handles/render-types/CanvasHandleMainOutput.vue';\nimport CanvasHandleNonMain from '@/components/canvas/elements/handles/render-types/CanvasHandleNonMain.vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst props = defineProps<{\n\tmode: 'output' | 'input';\n\tlabel?: string;\n\ttype: CanvasConnectionPort['type'];\n\tindex: CanvasConnectionPort['index'];\n\tposition: CanvasElementPortWithPosition['position'];\n\toffset: CanvasElementPortWithPosition['offset'];\n}>();\n\nconst $style = useCssModule();\n\nconst handleType = computed(() => (props.mode === 'input' ? 'target' : 'source'));\n\nconst isConnectableStart = computed(() => {\n\treturn props.mode === 'output';\n});\n\nconst isConnectableEnd = computed(() => {\n\treturn props.mode === 'input';\n});\n\nconst Render = (renderProps: { label?: string }) => {\n\tlet Component;\n\n\tif (props.type === NodeConnectionType.Main) {\n\t\tif (props.mode === 'input') {\n\t\t\tComponent = CanvasHandleMainInput;\n\t\t} else {\n\t\t\tComponent = CanvasHandleMainOutput;\n\t\t}\n\t} else {\n\t\tComponent = CanvasHandleNonMain;\n\t}\n\n\treturn h(Component, renderProps);\n};\n\n/**\n * Provide\n */\n\nconst label = toRef(props, 'label');\n\nprovide(CanvasNodeHandleKey, {\n\tlabel,\n});\n</script>\n\n<template>\n\t<Handle\n\t\t:id=\"`${mode}s/${type}/${index}`\"\n\t\t:class=\"[$style.handle]\"\n\t\t:type=\"handleType\"\n\t\t:position=\"position\"\n\t\t:style=\"offset\"\n\t\t:connectable-start=\"isConnectableStart\"\n\t\t:connectable-end=\"isConnectableEnd\"\n\t>\n\t\t<Render :label=\"label\" />\n\t</Handle>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: auto;\n\theight: auto;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tborder: 0;\n\tbackground: none;\n\n\t> * {\n\t\tpointer-events: none;\n\t}\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { Position } from '@vue-flow/core';\nimport { computed, provide, toRef } from 'vue';\nimport type {\n\tCanvasElementData,\n\tCanvasConnectionPort,\n\tCanvasElementPortWithPosition,\n} from '@/types';\nimport NodeIcon from '@/components/NodeIcon.vue';\nimport { useNodeTypesStore } from '@/stores/nodeTypes.store';\nimport CanvasNodeToolbar from '@/components/canvas/elements/nodes/CanvasNodeToolbar.vue';\nimport CanvasNodeRenderer from '@/components/canvas/elements/nodes/CanvasNodeRenderer.vue';\nimport HandleRenderer from '@/components/canvas/elements/handles/HandleRenderer.vue';\nimport { useNodeConnections } from '@/composables/useNodeConnections';\nimport { CanvasNodeKey } from '@/constants';\nimport type { NodeProps } from '@vue-flow/core';\n\nconst emit = defineEmits<{\n\tdelete: [id: string];\n\tactivate: [id: string];\n}>();\n\nconst props = defineProps<NodeProps<CanvasElementData>>();\n\nconst inputs = computed(() => props.data.inputs);\nconst outputs = computed(() => props.data.outputs);\n\nconst nodeTypesStore = useNodeTypesStore();\n\nconst { mainInputs, nonMainInputs, mainOutputs, nonMainOutputs } = useNodeConnections({\n\tinputs,\n\toutputs,\n});\n\nconst nodeType = computed(() => {\n\treturn nodeTypesStore.getNodeType(props.data.type, props.data.typeVersion);\n});\n\n/**\n * Inputs\n */\n\nconst inputsWithPosition = computed(() => {\n\treturn [\n\t\t...mainInputs.value.map(mapEndpointWithPosition(Position.Left, 'top')),\n\t\t...nonMainInputs.value.map(mapEndpointWithPosition(Position.Bottom, 'left')),\n\t];\n});\n\n/**\n * Outputs\n */\n\nconst outputsWithPosition = computed(() => {\n\treturn [\n\t\t...mainOutputs.value.map(mapEndpointWithPosition(Position.Right, 'top')),\n\t\t...nonMainOutputs.value.map(mapEndpointWithPosition(Position.Top, 'left')),\n\t];\n});\n\n/**\n * Endpoints\n */\n\nconst mapEndpointWithPosition =\n\t(position: Position, offsetAxis: 'top' | 'left') =>\n\t(\n\t\tendpoint: CanvasConnectionPort,\n\t\tindex: number,\n\t\tendpoints: CanvasConnectionPort[],\n\t): CanvasElementPortWithPosition => {\n\t\treturn {\n\t\t\t...endpoint,\n\t\t\tposition,\n\t\t\toffset: {\n\t\t\t\t[offsetAxis]: `${(100 / (endpoints.length + 1)) * (index + 1)}%`,\n\t\t\t},\n\t\t};\n\t};\n\n/**\n * Provide\n */\n\nconst id = toRef(props, 'id');\nconst data = toRef(props, 'data');\nconst label = toRef(props, 'label');\nconst selected = toRef(props, 'selected');\n\nprovide(CanvasNodeKey, {\n\tid,\n\tdata,\n\tlabel,\n\tselected,\n\tnodeType,\n});\n\nfunction onDelete() {\n\temit('delete', props.id);\n}\n\nfunction onActivate() {\n\temit('activate', props.id);\n}\n</script>\n\n<template>\n\t<div :class=\"$style.canvasNode\" data-test-id=\"canvas-node\">\n\t\t<template v-for=\"source in outputsWithPosition\" :key=\"`${source.type}/${source.index}`\">\n\t\t\t<HandleRenderer\n\t\t\t\tmode=\"output\"\n\t\t\t\tdata-test-id=\"canvas-node-output-handle\"\n\t\t\t\t:type=\"source.type\"\n\t\t\t\t:label=\"source.label\"\n\t\t\t\t:index=\"source.index\"\n\t\t\t\t:position=\"source.position\"\n\t\t\t\t:offset=\"source.offset\"\n\t\t\t/>\n\t\t</template>\n\n\t\t<template v-for=\"target in inputsWithPosition\" :key=\"`${target.type}/${target.index}`\">\n\t\t\t<HandleRenderer\n\t\t\t\tmode=\"input\"\n\t\t\t\tdata-test-id=\"canvas-node-input-handle\"\n\t\t\t\t:type=\"target.type\"\n\t\t\t\t:label=\"target.label\"\n\t\t\t\t:index=\"target.index\"\n\t\t\t\t:position=\"target.position\"\n\t\t\t\t:offset=\"target.offset\"\n\t\t\t/>\n\t\t</template>\n\n\t\t<CanvasNodeToolbar\n\t\t\tv-if=\"nodeType\"\n\t\t\tdata-test-id=\"canvas-node-toolbar\"\n\t\t\t:class=\"$style.canvasNodeToolbar\"\n\t\t\t@delete=\"onDelete\"\n\t\t/>\n\n\t\t<CanvasNodeRenderer v-if=\"nodeType\" @dblclick=\"onActivate\">\n\t\t\t<NodeIcon :node-type=\"nodeType\" :size=\"40\" :shrink=\"false\" />\n\t\t\t<!--\t\t\t:color-default=\"iconColorDefault\"-->\n\t\t\t<!--\t\t\t:disabled=\"data.disabled\"-->\n\t\t</CanvasNodeRenderer>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.canvasNode {\n\t&:hover {\n\t\t.canvasNodeToolbar {\n\t\t\tdisplay: flex;\n\t\t\topacity: 1;\n\t\t}\n\t}\n}\n\n.canvasNodeToolbar {\n\tdisplay: none;\n\tposition: absolute;\n\ttop: 0;\n\tleft: 50%;\n\ttransform: translate(-50%, -100%);\n\topacity: 0;\n\ttransition: opacity 0.3s ease;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { useI18n } from '@/composables/useI18n';\nimport { computed, useCssModule } from 'vue';\n\nconst emit = defineEmits<{\n\tdelete: [];\n}>();\n\nconst $style = useCssModule();\n\nconst i18n = useI18n();\n\nconst classes = computed(() => ({\n\t[$style.canvasEdgeToolbar]: true,\n}));\n\nfunction onDelete() {\n\temit('delete');\n}\n</script>\n\n<template>\n\t<div :class=\"classes\" data-test-id=\"canvas-edge-toolbar\">\n\t\t<N8nIconButton\n\t\t\tdata-test-id=\"delete-connection-button\"\n\t\t\ttype=\"tertiary\"\n\t\t\tsize=\"small\"\n\t\t\ticon=\"trash\"\n\t\t\t:title=\"i18n.baseText('node.delete')\"\n\t\t\t@click=\"onDelete\"\n\t\t/>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.canvasEdgeToolbar {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tpointer-events: all;\n}\n</style>\n","<script lang=\"ts\" setup>\n/* eslint-disable vue/no-multiple-template-root */\nimport type { Connection, EdgeProps } from '@vue-flow/core';\nimport { BaseEdge, EdgeLabelRenderer, getBezierPath } from '@vue-flow/core';\nimport CanvasEdgeToolbar from './CanvasEdgeToolbar.vue';\nimport { computed, useCssModule } from 'vue';\n\nconst emit = defineEmits<{\n\tdelete: [connection: Connection];\n}>();\n\nconst props = defineProps<\n\tEdgeProps & {\n\t\thovered?: boolean;\n\t}\n>();\n\nconst $style = useCssModule();\n\nconst edgeStyle = computed(() => ({\n\tstrokeWidth: 2,\n\t...props.style,\n}));\n\nconst isEdgeToolbarVisible = computed(() => props.selected || props.hovered);\n\nconst edgeToolbarStyle = computed(() => {\n\treturn {\n\t\ttransform: `translate(-50%, -50%) translate(${path.value[1]}px,${path.value[2]}px)`,\n\t};\n});\n\nconst edgeToolbarClasses = computed(() => ({\n\t[$style.edgeToolbar]: true,\n\t[$style.edgeToolbarVisible]: isEdgeToolbarVisible.value,\n\tnodrag: true,\n\tnopan: true,\n}));\n\nconst path = computed(() =>\n\tgetBezierPath({\n\t\tsourceX: props.sourceX,\n\t\tsourceY: props.sourceY,\n\t\tsourcePosition: props.sourcePosition,\n\t\ttargetX: props.targetX,\n\t\ttargetY: props.targetY,\n\t\ttargetPosition: props.targetPosition,\n\t}),\n);\n\nconst connection = computed<Connection>(() => ({\n\tsource: props.source,\n\ttarget: props.target,\n\tsourceHandle: props.sourceHandleId,\n\ttargetHandle: props.targetHandleId,\n}));\n\nfunction onDelete() {\n\temit('delete', connection.value);\n}\n</script>\n\n<template>\n\t<BaseEdge\n\t\t:id=\"id\"\n\t\t:style=\"edgeStyle\"\n\t\t:path=\"path[0]\"\n\t\t:marker-end=\"markerEnd\"\n\t\t:label=\"data?.label\"\n\t\t:label-x=\"path[1]\"\n\t\t:label-y=\"path[2]\"\n\t\t:label-style=\"{ fill: 'white' }\"\n\t\t:label-show-bg=\"true\"\n\t\t:label-bg-style=\"{ fill: 'red' }\"\n\t\t:label-bg-padding=\"[2, 4]\"\n\t\t:label-bg-border-radius=\"2\"\n\t\t:class=\"$style.edge\"\n\t/>\n\t<EdgeLabelRenderer>\n\t\t<CanvasEdgeToolbar :class=\"edgeToolbarClasses\" :style=\"edgeToolbarStyle\" @delete=\"onDelete\" />\n\t</EdgeLabelRenderer>\n</template>\n\n<style lang=\"scss\" module>\n.edgeToolbar {\n\tposition: absolute;\n\topacity: 0;\n\n\t&.edgeToolbarVisible {\n\t\topacity: 1;\n\t}\n\n\t&:hover {\n\t\topacity: 1;\n\t}\n}\n</style>\n","<script lang=\"ts\" setup>\nimport type { CanvasConnection, CanvasElement } from '@/types';\nimport type { EdgeMouseEvent, NodeDragEvent, Connection } from '@vue-flow/core';\nimport { useVueFlow, VueFlow, PanelPosition } from '@vue-flow/core';\nimport { Background } from '@vue-flow/background';\nimport { Controls } from '@vue-flow/controls';\nimport { MiniMap } from '@vue-flow/minimap';\nimport CanvasNode from './elements/nodes/CanvasNode.vue';\nimport CanvasEdge from './elements/edges/CanvasEdge.vue';\nimport { onMounted, onUnmounted, ref, useCssModule } from 'vue';\n\nconst $style = useCssModule();\n\nconst emit = defineEmits<{\n\t'update:modelValue': [elements: CanvasElement[]];\n\t'update:node:position': [id: string, position: { x: number; y: number }];\n\t'update:node:active': [id: string];\n\t'delete:node': [id: string];\n\t'delete:connection': [connection: Connection];\n\t'create:connection': [connection: Connection];\n}>();\n\nconst props = withDefaults(\n\tdefineProps<{\n\t\tid?: string;\n\t\telements: CanvasElement[];\n\t\tconnections: CanvasConnection[];\n\t\tcontrolsPosition?: PanelPosition;\n\t}>(),\n\t{\n\t\tid: 'canvas',\n\t\telements: () => [],\n\t\tconnections: () => [],\n\t\tcontrolsPosition: PanelPosition.BottomLeft,\n\t},\n);\n\nconst { getSelectedEdges, getSelectedNodes } = useVueFlow({ id: props.id });\n\nconst hoveredEdges = ref<Record<string, boolean>>({});\n\nonMounted(() => {\n\tdocument.addEventListener('keydown', onKeyDown);\n});\n\nonUnmounted(() => {\n\tdocument.removeEventListener('keydown', onKeyDown);\n});\n\nfunction onNodeDragStop(e: NodeDragEvent) {\n\te.nodes.forEach((node) => {\n\t\temit('update:node:position', node.id, node.position);\n\t});\n}\n\nfunction onSetNodeActive(id: string) {\n\temit('update:node:active', id);\n}\n\nfunction onDeleteNode(id: string) {\n\temit('delete:node', id);\n}\n\nfunction onDeleteConnection(connection: Connection) {\n\temit('delete:connection', connection);\n}\n\nfunction onConnect(...args: unknown[]) {\n\temit('create:connection', args[0] as Connection);\n}\n\nfunction onKeyDown(e: KeyboardEvent) {\n\tif (e.key === 'Delete') {\n\t\tgetSelectedEdges.value.forEach(onDeleteConnection);\n\t\tgetSelectedNodes.value.forEach(({ id }) => onDeleteNode(id));\n\t}\n}\n\nfunction onMouseEnterEdge(event: EdgeMouseEvent) {\n\thoveredEdges.value[event.edge.id] = true;\n}\n\nfunction onMouseLeaveEdge(event: EdgeMouseEvent) {\n\thoveredEdges.value[event.edge.id] = false;\n}\n</script>\n\n<template>\n\t<VueFlow\n\t\t:id=\"id\"\n\t\t:nodes=\"elements\"\n\t\t:edges=\"connections\"\n\t\t:apply-changes=\"false\"\n\t\tfit-view-on-init\n\t\tpan-on-scroll\n\t\t:min-zoom=\"0.2\"\n\t\t:max-zoom=\"2\"\n\t\tdata-test-id=\"canvas\"\n\t\t@node-drag-stop=\"onNodeDragStop\"\n\t\t@edge-mouse-enter=\"onMouseEnterEdge\"\n\t\t@edge-mouse-leave=\"onMouseLeaveEdge\"\n\t\t@connect=\"onConnect\"\n\t>\n\t\t<template #node-canvas-node=\"canvasNodeProps\">\n\t\t\t<CanvasNode v-bind=\"canvasNodeProps\" @delete=\"onDeleteNode\" @activate=\"onSetNodeActive\" />\n\t\t</template>\n\n\t\t<template #edge-canvas-edge=\"canvasEdgeProps\">\n\t\t\t<CanvasEdge\n\t\t\t\tv-bind=\"canvasEdgeProps\"\n\t\t\t\t:hovered=\"hoveredEdges[canvasEdgeProps.id]\"\n\t\t\t\t@delete=\"onDeleteConnection\"\n\t\t\t/>\n\t\t</template>\n\n\t\t<Background data-test-id=\"canvas-background\" pattern-color=\"#aaa\" :gap=\"16\" />\n\n\t\t<MiniMap data-test-id=\"canvas-minimap\" pannable />\n\n\t\t<Controls\n\t\t\tdata-test-id=\"canvas-controls\"\n\t\t\t:class=\"$style.canvasControls\"\n\t\t\t:position=\"controlsPosition\"\n\t\t></Controls>\n\t</VueFlow>\n</template>\n\n<style lang=\"scss\" module></style>\n\n<style lang=\"scss\">\n.vue-flow__controls {\n\tdisplay: flex;\n\tgap: var(--spacing-2xs);\n\tbox-shadow: none;\n}\n\n.vue-flow__controls-button {\n\twidth: 42px;\n\theight: 42px;\n\tborder: var(--border-base);\n\tborder-radius: var(--border-radius-base);\n\tpadding: 0;\n\ttransition-property: transform, background, border, color;\n\ttransition-duration: 300ms;\n\ttransition-timing-function: ease;\n\n\t&:hover {\n\t\tborder-color: var(--color-button-secondary-hover-active-border);\n\t\tbackground-color: var(--color-button-secondary-active-background);\n\t\ttransform: scale(1.1);\n\n\t\tsvg {\n\t\t\tfill: var(--color-primary);\n\t\t}\n\t}\n\n\tsvg {\n\t\tmax-height: 16px;\n\t\tmax-width: 16px;\n\t\ttransition-property: fill;\n\t\ttransition-duration: 300ms;\n\t\ttransition-timing-function: ease;\n\t}\n}\n</style>\n","import type { IConnection, IConnections, INodeTypeDescription } from 'n8n-workflow';\nimport type { INodeUi } from '@/Interface';\nimport type { CanvasConnection, CanvasConnectionPortType, CanvasConnectionPort } from '@/types';\nimport type { Connection } from '@vue-flow/core';\nimport { v4 as uuid } from 'uuid';\nimport { isValidNodeConnectionType } from '@/utils/typeGuards';\nimport { NodeConnectionType } from 'n8n-workflow';\n\nexport function mapLegacyConnectionsToCanvasConnections(\n\tlegacyConnections: IConnections,\n\tnodes: INodeUi[],\n): CanvasConnection[] {\n\tconst mappedConnections: CanvasConnection[] = [];\n\n\tObject.keys(legacyConnections).forEach((fromNodeName) => {\n\t\tconst fromId = nodes.find((node) => node.name === fromNodeName)?.id;\n\t\tconst fromConnectionTypes = Object.keys(legacyConnections[fromNodeName]);\n\n\t\tfromConnectionTypes.forEach((fromConnectionType) => {\n\t\t\tconst fromPorts = legacyConnections[fromNodeName][fromConnectionType];\n\t\t\tfromPorts.forEach((toPorts, fromIndex) => {\n\t\t\t\ttoPorts.forEach((toPort) => {\n\t\t\t\t\tconst toId = nodes.find((node) => node.name === toPort.node)?.id;\n\t\t\t\t\tconst toConnectionType = toPort.type;\n\t\t\t\t\tconst toIndex = toPort.index;\n\n\t\t\t\t\tif (fromId && toId) {\n\t\t\t\t\t\tmappedConnections.push({\n\t\t\t\t\t\t\tid: `[${fromId}/${fromConnectionType}/${fromIndex}][${toId}/${toConnectionType}/${toIndex}]`,\n\t\t\t\t\t\t\tsource: fromId,\n\t\t\t\t\t\t\ttarget: toId,\n\t\t\t\t\t\t\tsourceHandle: `outputs/${fromConnectionType}/${fromIndex}`,\n\t\t\t\t\t\t\ttargetHandle: `inputs/${toConnectionType}/${toIndex}`,\n\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\tfromNodeName,\n\t\t\t\t\t\t\t\tsource: {\n\t\t\t\t\t\t\t\t\tindex: fromIndex,\n\t\t\t\t\t\t\t\t\ttype: fromConnectionType as CanvasConnectionPortType,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\ttarget: {\n\t\t\t\t\t\t\t\t\tindex: toIndex,\n\t\t\t\t\t\t\t\t\ttype: toConnectionType as CanvasConnectionPortType,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t});\n\n\treturn mappedConnections;\n}\n\nexport function parseCanvasConnectionHandleString(handle: string | null | undefined) {\n\tconst [, type, index] = (handle ?? '').split('/');\n\n\tconst resolvedType = isValidNodeConnectionType(type) ? type : NodeConnectionType.Main;\n\n\tlet resolvedIndex = parseInt(index, 10);\n\tif (isNaN(resolvedIndex)) {\n\t\tresolvedIndex = 0;\n\t}\n\n\treturn {\n\t\ttype: resolvedType,\n\t\tindex: resolvedIndex,\n\t};\n}\n\nexport function mapCanvasConnectionToLegacyConnection(\n\tsourceNode: INodeUi,\n\ttargetNode: INodeUi,\n\tconnection: Connection,\n): [IConnection, IConnection] {\n\t// Output\n\tconst sourceNodeName = sourceNode?.name ?? '';\n\tconst { type: sourceType, index: sourceIndex } = parseCanvasConnectionHandleString(\n\t\tconnection.sourceHandle,\n\t);\n\n\t// Input\n\tconst targetNodeName = targetNode?.name ?? '';\n\tconst { type: targetType, index: targetIndex } = parseCanvasConnectionHandleString(\n\t\tconnection.targetHandle,\n\t);\n\n\treturn [\n\t\t{\n\t\t\tnode: sourceNodeName,\n\t\t\ttype: sourceType,\n\t\t\tindex: sourceIndex,\n\t\t},\n\t\t{\n\t\t\tnode: targetNodeName,\n\t\t\ttype: targetType,\n\t\t\tindex: targetIndex,\n\t\t},\n\t];\n}\n\nexport function mapLegacyEndpointsToCanvasConnectionPort(\n\tendpoints: INodeTypeDescription['inputs'],\n): CanvasConnectionPort[] {\n\tif (typeof endpoints === 'string') {\n\t\tconsole.warn('Node endpoints have not been evaluated', endpoints);\n\t\treturn [];\n\t}\n\n\treturn endpoints.map((endpoint, endpointIndex) => {\n\t\tconst type = typeof endpoint === 'string' ? endpoint : endpoint.type;\n\t\tconst label = typeof endpoint === 'string' ? undefined : endpoint.displayName;\n\t\tconst index =\n\t\t\tendpoints\n\t\t\t\t.slice(0, endpointIndex + 1)\n\t\t\t\t.filter((e) => (typeof e === 'string' ? e : e.type) === type).length - 1;\n\t\tconst required = typeof endpoint === 'string' ? false : endpoint.required;\n\n\t\treturn {\n\t\t\ttype,\n\t\t\tindex,\n\t\t\tlabel,\n\t\t\t...(required ? { required } : {}),\n\t\t};\n\t});\n}\n\nexport function getUniqueNodeName(name: string, existingNames: Set<string>): string {\n\tif (!existingNames.has(name)) {\n\t\treturn name;\n\t}\n\n\tfor (let i = 1; i < 100; i++) {\n\t\tconst newName = `${name} ${i}`;\n\t\tif (!existingNames.has(newName)) {\n\t\t\treturn newName;\n\t\t}\n\t}\n\n\treturn `${name} ${uuid()}`;\n}\n","import { useI18n } from '@/composables/useI18n';\nimport { useNodeTypesStore } from '@/stores/nodeTypes.store';\nimport type { Ref } from 'vue';\nimport { computed } from 'vue';\nimport type {\n\tCanvasConnection,\n\tCanvasConnectionPort,\n\tCanvasElement,\n\tCanvasElementData,\n} from '@/types';\nimport {\n\tmapLegacyConnectionsToCanvasConnections,\n\tmapLegacyEndpointsToCanvasConnectionPort,\n} from '@/utils/canvasUtilsV2';\nimport type { Workflow } from 'n8n-workflow';\nimport { NodeHelpers } from 'n8n-workflow';\nimport type { IWorkflowDb } from '@/Interface';\n\nexport function useCanvasMapping({\n\tworkflow,\n\tworkflowObject,\n}: {\n\tworkflow: Ref<IWorkflowDb>;\n\tworkflowObject: Ref<Workflow>;\n}) {\n\tconst locale = useI18n();\n\tconst nodeTypesStore = useNodeTypesStore();\n\n\tconst renderTypeByNodeType = computed(\n\t\t() =>\n\t\t\tworkflow.value.nodes.reduce<Record<string, CanvasElementData['renderType']>>((acc, node) => {\n\t\t\t\tlet renderType: CanvasElementData['renderType'] = 'default';\n\t\t\t\tswitch (true) {\n\t\t\t\t\tcase nodeTypesStore.isTriggerNode(node.type):\n\t\t\t\t\t\trenderType = 'trigger';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase nodeTypesStore.isConfigNode(workflowObject.value, node, node.type):\n\t\t\t\t\t\trenderType = 'configuration';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase nodeTypesStore.isConfigurableNode(workflowObject.value, node, node.type):\n\t\t\t\t\t\trenderType = 'configurable';\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tacc[node.type] = renderType;\n\t\t\t\treturn acc;\n\t\t\t}, {}) ?? {},\n\t);\n\n\tconst nodeInputsById = computed(() =>\n\t\tworkflow.value.nodes.reduce<Record<string, CanvasConnectionPort[]>>((acc, node) => {\n\t\t\tconst nodeTypeDescription = nodeTypesStore.getNodeType(node.type);\n\t\t\tconst workflowObjectNode = workflowObject.value.getNode(node.name);\n\n\t\t\tacc[node.id] =\n\t\t\t\tworkflowObjectNode && nodeTypeDescription\n\t\t\t\t\t? mapLegacyEndpointsToCanvasConnectionPort(\n\t\t\t\t\t\t\tNodeHelpers.getNodeInputs(\n\t\t\t\t\t\t\t\tworkflowObject.value,\n\t\t\t\t\t\t\t\tworkflowObjectNode,\n\t\t\t\t\t\t\t\tnodeTypeDescription,\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t)\n\t\t\t\t\t: [];\n\n\t\t\treturn acc;\n\t\t}, {}),\n\t);\n\n\tconst nodeOutputsById = computed(() =>\n\t\tworkflow.value.nodes.reduce<Record<string, CanvasConnectionPort[]>>((acc, node) => {\n\t\t\tconst nodeTypeDescription = nodeTypesStore.getNodeType(node.type);\n\t\t\tconst workflowObjectNode = workflowObject.value.getNode(node.name);\n\n\t\t\tacc[node.id] =\n\t\t\t\tworkflowObjectNode && nodeTypeDescription\n\t\t\t\t\t? mapLegacyEndpointsToCanvasConnectionPort(\n\t\t\t\t\t\t\tNodeHelpers.getNodeOutputs(\n\t\t\t\t\t\t\t\tworkflowObject.value,\n\t\t\t\t\t\t\t\tworkflowObjectNode,\n\t\t\t\t\t\t\t\tnodeTypeDescription,\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t)\n\t\t\t\t\t: [];\n\n\t\t\treturn acc;\n\t\t}, {}),\n\t);\n\n\tconst elements = computed<CanvasElement[]>(() => [\n\t\t...workflow.value.nodes.map<CanvasElement>((node) => {\n\t\t\tconst data: CanvasElementData = {\n\t\t\t\tid: node.id,\n\t\t\t\ttype: node.type,\n\t\t\t\ttypeVersion: node.typeVersion,\n\t\t\t\tinputs: nodeInputsById.value[node.id] ?? [],\n\t\t\t\toutputs: nodeOutputsById.value[node.id] ?? [],\n\t\t\t\trenderType: renderTypeByNodeType.value[node.type] ?? 'default',\n\t\t\t};\n\n\t\t\treturn {\n\t\t\t\tid: node.id,\n\t\t\t\tlabel: node.name,\n\t\t\t\ttype: 'canvas-node',\n\t\t\t\tposition: { x: node.position[0], y: node.position[1] },\n\t\t\t\tdata,\n\t\t\t};\n\t\t}),\n\t]);\n\n\tconst connections = computed<CanvasConnection[]>(() => {\n\t\tconst mappedConnections = mapLegacyConnectionsToCanvasConnections(\n\t\t\tworkflow.value.connections ?? [],\n\t\t\tworkflow.value.nodes ?? [],\n\t\t);\n\n\t\treturn mappedConnections.map((connection) => {\n\t\t\tconst type = getConnectionType(connection);\n\t\t\tconst label = getConnectionLabel(connection);\n\n\t\t\treturn {\n\t\t\t\t...connection,\n\t\t\t\ttype,\n\t\t\t\tlabel,\n\t\t\t};\n\t\t});\n\t});\n\n\tfunction getConnectionType(_: CanvasConnection): string {\n\t\treturn 'canvas-edge';\n\t}\n\n\tfunction getConnectionLabel(connection: CanvasConnection): string {\n\t\tconst pinData = workflow.value.pinData?.[connection.data?.fromNodeName ?? ''];\n\n\t\tif (pinData?.length) {\n\t\t\treturn locale.baseText('ndv.output.items', {\n\t\t\t\tadjustToNumber: pinData.length,\n\t\t\t\tinterpolate: { count: String(pinData.length) },\n\t\t\t});\n\t\t}\n\n\t\treturn '';\n\t}\n\n\treturn {\n\t\tconnections,\n\t\telements,\n\t};\n}\n","<script setup lang=\"ts\">\nimport Canvas from '@/components/canvas/Canvas.vue';\nimport { toRef, useCssModule } from 'vue';\nimport type { Workflow } from 'n8n-workflow';\nimport type { IWorkflowDb } from '@/Interface';\nimport { useCanvasMapping } from '@/composables/useCanvasMapping';\n\nconst props = defineProps<{\n\tid?: string;\n\tworkflow: IWorkflowDb;\n\tworkflowObject: Workflow;\n}>();\n\nconst $style = useCssModule();\n\nconst workflow = toRef(props, 'workflow');\nconst workflowObject = toRef(props, 'workflowObject');\n\nconst { elements, connections } = useCanvasMapping({ workflow, workflowObject });\n</script>\n\n<template>\n\t<div :class=\"$style.wrapper\">\n\t\t<div :class=\"$style.canvas\">\n\t\t\t<Canvas v-if=\"workflow\" :elements=\"elements\" :connections=\"connections\" v-bind=\"$attrs\" />\n\t\t</div>\n\t\t<slot />\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.wrapper {\n\tdisplay: block;\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n.canvas {\n\twidth: 100%;\n\theight: 100%;\n\tposition: relative;\n\tdisplay: block;\n}\n\n.executionButtons {\n\tposition: absolute;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tleft: 50%;\n\ttransform: translateX(-50%);\n\tbottom: var(--spacing-l);\n\twidth: auto;\n\n\t@media (max-width: $breakpoint-2xs) {\n\t\tbottom: 150px;\n\t}\n\n\tbutton {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tmargin-left: 0.625rem;\n\n\t\t&:first-child {\n\t\t\tmargin: 0;\n\t\t}\n\t}\n}\n</style>\n","<script setup lang=\"ts\">\nimport KeyboardShortcutTooltip from '@/components/KeyboardShortcutTooltip.vue';\nimport { computed } from 'vue';\nimport { useI18n } from '@/composables/useI18n';\nimport { useUIStore } from '@/stores/ui.store';\n\ndefineEmits(['click']);\n\nconst uiStore = useUIStore();\nconst locale = useI18n();\n\nconst workflowRunning = computed(() => uiStore.isActionActive('workflowRunning'));\n\nconst runButtonText = computed(() => {\n\tif (!workflowRunning.value) {\n\t\treturn locale.baseText('nodeView.runButtonText.executeWorkflow');\n\t}\n\n\treturn locale.baseText('nodeView.runButtonText.executingWorkflow');\n});\n</script>\n\n<template>\n\t<KeyboardShortcutTooltip :label=\"runButtonText\" :shortcut=\"{ metaKey: true, keys: ['↵'] }\">\n\t\t<N8nButton\n\t\t\t:loading=\"workflowRunning\"\n\t\t\t:label=\"runButtonText\"\n\t\t\tsize=\"large\"\n\t\t\ticon=\"flask\"\n\t\t\ttype=\"primary\"\n\t\t\tdata-test-id=\"execute-workflow-button\"\n\t\t\t@click.stop=\"$emit('click', $event)\"\n\t\t/>\n\t</KeyboardShortcutTooltip>\n</template>\n","import type { CanvasElement } from '@/types';\nimport type { INodeUi, XYPosition } from '@/Interface';\nimport { QUICKSTART_NOTE_NAME, STICKY_NODE_TYPE } from '@/constants';\nimport { useWorkflowsStore } from '@/stores/workflows.store';\nimport { useHistoryStore } from '@/stores/history.store';\nimport { useUIStore } from '@/stores/ui.store';\nimport { useTelemetry } from '@/composables/useTelemetry';\nimport { useExternalHooks } from '@/composables/useExternalHooks';\nimport {\n\tMoveNodeCommand,\n\tRemoveConnectionCommand,\n\tRemoveNodeCommand,\n\tRenameNodeCommand,\n} from '@/models/history';\nimport type { Connection } from '@vue-flow/core';\nimport { getUniqueNodeName, mapCanvasConnectionToLegacyConnection } from '@/utils/canvasUtilsV2';\nimport type { IConnection } from 'n8n-workflow';\nimport { useNDVStore } from '@/stores/ndv.store';\n\nexport function useCanvasOperations() {\n\tconst workflowsStore = useWorkflowsStore();\n\tconst historyStore = useHistoryStore();\n\tconst uiStore = useUIStore();\n\tconst ndvStore = useNDVStore();\n\n\tconst telemetry = useTelemetry();\n\tconst externalHooks = useExternalHooks();\n\n\t/**\n\t * Node operations\n\t */\n\n\tfunction updateNodePosition(\n\t\tid: string,\n\t\tposition: CanvasElement['position'],\n\t\t{ trackHistory = false, trackBulk = true } = {},\n\t) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (trackHistory && trackBulk) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tconst oldPosition: XYPosition = [...node.position];\n\t\tconst newPosition: XYPosition = [position.x, position.y];\n\n\t\tworkflowsStore.setNodePositionById(id, newPosition);\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new MoveNodeCommand(node.name, oldPosition, newPosition));\n\n\t\t\tif (trackBulk) {\n\t\t\t\thistoryStore.stopRecordingUndo();\n\t\t\t}\n\t\t}\n\t}\n\n\tasync function renameNode(currentName: string, newName: string, { trackHistory = false } = {}) {\n\t\tif (currentName === newName) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tnewName = getUniqueNodeName(newName, workflowsStore.canvasNames);\n\n\t\t// Rename the node and update the connections\n\t\tconst workflow = workflowsStore.getCurrentWorkflow(true);\n\t\tworkflow.renameNode(currentName, newName);\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new RenameNodeCommand(currentName, newName));\n\t\t}\n\n\t\t// Update also last selected node and execution data\n\t\tworkflowsStore.renameNodeSelectedAndExecution({ old: currentName, new: newName });\n\n\t\tworkflowsStore.setNodes(Object.values(workflow.nodes));\n\t\tworkflowsStore.setConnections(workflow.connectionsBySourceNode);\n\n\t\tconst isRenamingActiveNode = ndvStore.activeNodeName === currentName;\n\t\tif (isRenamingActiveNode) {\n\t\t\tndvStore.activeNodeName = newName;\n\t\t}\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.stopRecordingUndo();\n\t\t}\n\t}\n\n\tasync function revertRenameNode(currentName: string, previousName: string) {\n\t\tawait renameNode(currentName, previousName);\n\t}\n\n\tfunction deleteNode(id: string, { trackHistory = false, trackBulk = true } = {}) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (trackHistory && trackBulk) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tworkflowsStore.removeNodeById(id);\n\t\tworkflowsStore.removeNodeConnectionsById(id);\n\t\tworkflowsStore.removeNodeExecutionDataById(id);\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new RemoveNodeCommand(node));\n\n\t\t\tif (trackBulk) {\n\t\t\t\thistoryStore.stopRecordingUndo();\n\t\t\t}\n\t\t}\n\n\t\ttrackDeleteNode(id);\n\t}\n\n\tfunction revertDeleteNode(node: INodeUi) {\n\t\tworkflowsStore.addNode(node);\n\t}\n\n\tfunction trackDeleteNode(id: string) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (node.type === STICKY_NODE_TYPE) {\n\t\t\ttelemetry.track('User deleted workflow note', {\n\t\t\t\tworkflow_id: workflowsStore.workflowId,\n\t\t\t\tis_welcome_note: node.name === QUICKSTART_NOTE_NAME,\n\t\t\t});\n\t\t} else {\n\t\t\tvoid externalHooks.run('node.deleteNode', { node });\n\t\t\ttelemetry.track('User deleted node', {\n\t\t\t\tnode_type: node.type,\n\t\t\t\tworkflow_id: workflowsStore.workflowId,\n\t\t\t});\n\t\t}\n\t}\n\n\tfunction setNodeActive(id: string) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tndvStore.activeNodeName = node.name;\n\t}\n\n\tfunction setNodeActiveByName(name: string) {\n\t\tndvStore.activeNodeName = name;\n\t}\n\n\t/**\n\t * Connection operations\n\t */\n\n\tfunction createConnection(connection: Connection) {\n\t\tconst sourceNode = workflowsStore.getNodeById(connection.source);\n\t\tconst targetNode = workflowsStore.getNodeById(connection.target);\n\t\tif (!sourceNode || !targetNode || !isConnectionAllowed(sourceNode, targetNode)) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst mappedConnection = mapCanvasConnectionToLegacyConnection(\n\t\t\tsourceNode,\n\t\t\ttargetNode,\n\t\t\tconnection,\n\t\t);\n\t\tworkflowsStore.addConnection({\n\t\t\tconnection: mappedConnection,\n\t\t});\n\n\t\tuiStore.stateIsDirty = true;\n\t}\n\n\tfunction deleteConnection(\n\t\tconnection: Connection,\n\t\t{ trackHistory = false, trackBulk = true } = {},\n\t) {\n\t\tconst sourceNode = workflowsStore.getNodeById(connection.source);\n\t\tconst targetNode = workflowsStore.getNodeById(connection.target);\n\t\tif (!sourceNode || !targetNode) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst mappedConnection = mapCanvasConnectionToLegacyConnection(\n\t\t\tsourceNode,\n\t\t\ttargetNode,\n\t\t\tconnection,\n\t\t);\n\n\t\tif (trackHistory && trackBulk) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tworkflowsStore.removeConnection({\n\t\t\tconnection: mappedConnection,\n\t\t});\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new RemoveConnectionCommand(mappedConnection));\n\n\t\t\tif (trackBulk) {\n\t\t\t\thistoryStore.stopRecordingUndo();\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction revertDeleteConnection(connection: [IConnection, IConnection]) {\n\t\tworkflowsStore.addConnection({\n\t\t\tconnection,\n\t\t});\n\t}\n\n\t// @TODO Figure out a way to improve this\n\tfunction isConnectionAllowed(sourceNode: INodeUi, targetNode: INodeUi): boolean {\n\t\t// const targetNodeType = nodeTypesStore.getNodeType(\n\t\t// \ttargetNode.type,\n\t\t// \ttargetNode.typeVersion,\n\t\t// );\n\t\t//\n\t\t// if (targetNodeType?.inputs?.length) {\n\t\t// \tconst workflow = this.workflowHelpers.getCurrentWorkflow();\n\t\t// \tconst workflowNode = workflow.getNode(targetNode.name);\n\t\t// \tlet inputs: Array<ConnectionTypes | INodeInputConfiguration> = [];\n\t\t// \tif (targetNodeType) {\n\t\t// \t\tinputs = NodeHelpers.getNodeInputs(workflow, workflowNode, targetNodeType);\n\t\t// \t}\n\t\t//\n\t\t// \tfor (const input of inputs || []) {\n\t\t// \t\tif (typeof input === 'string' || input.type !== targetInfoType || !input.filter) {\n\t\t// \t\t\t// No filters defined or wrong connection type\n\t\t// \t\t\tcontinue;\n\t\t// \t\t}\n\t\t//\n\t\t// \t\tif (input.filter.nodes.length) {\n\t\t// \t\t\tif (!input.filter.nodes.includes(sourceNode.type)) {\n\t\t// \t\t\t\tthis.dropPrevented = true;\n\t\t// \t\t\t\tthis.showToast({\n\t\t// \t\t\t\t\ttitle: this.$locale.baseText('nodeView.showError.nodeNodeCompatible.title'),\n\t\t// \t\t\t\t\tmessage: this.$locale.baseText('nodeView.showError.nodeNodeCompatible.message', {\n\t\t// \t\t\t\t\t\tinterpolate: { sourceNodeName: sourceNode.name, targetNodeName: targetNode.name },\n\t\t// \t\t\t\t\t}),\n\t\t// \t\t\t\t\ttype: 'error',\n\t\t// \t\t\t\t\tduration: 5000,\n\t\t// \t\t\t\t});\n\t\t// \t\t\t\treturn false;\n\t\t// \t\t\t}\n\t\t// \t\t}\n\t\t// \t}\n\t\t// }\n\t\treturn sourceNode.id !== targetNode.id;\n\t}\n\n\treturn {\n\t\tupdateNodePosition,\n\t\tsetNodeActive,\n\t\tsetNodeActiveByName,\n\t\trenameNode,\n\t\trevertRenameNode,\n\t\tdeleteNode,\n\t\trevertDeleteNode,\n\t\ttrackDeleteNode,\n\t\tcreateConnection,\n\t\tdeleteConnection,\n\t\trevertDeleteConnection,\n\t\tisConnectionAllowed,\n\t};\n}\n","<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent, onBeforeUnmount, onMounted, ref, useCssModule } from 'vue';\nimport { useRoute, useRouter } from 'vue-router';\nimport WorkflowCanvas from '@/components/canvas/WorkflowCanvas.vue';\nimport { useNodeTypesStore } from '@/stores/nodeTypes.store';\nimport { useUIStore } from '@/stores/ui.store';\nimport CanvasExecuteWorkflowButton from '@/components/canvas/elements/buttons/CanvasExecuteWorkflowButton.vue';\nimport { useI18n } from '@/composables/useI18n';\nimport { useWorkflowsStore } from '@/stores/workflows.store';\nimport { useRunWorkflow } from '@/composables/useRunWorkflow';\nimport type {\n\tAddedNodesAndConnections,\n\tINodeUi,\n\tITag,\n\tIUpdateInformation,\n\tIWorkflowDataUpdate,\n\tToggleNodeCreatorOptions,\n\tXYPosition,\n} from '@/Interface';\nimport { useTagsStore } from '@/stores/tags.store';\nimport type { Connection } from '@vue-flow/core';\nimport type { CanvasElement } from '@/types';\nimport { EnterpriseEditionFeature, VIEWS } from '@/constants';\nimport { useSourceControlStore } from '@/stores/sourceControl.store';\nimport { useNodeCreatorStore } from '@/stores/nodeCreator.store';\nimport { useExternalHooks } from '@/composables/useExternalHooks';\nimport * as NodeViewUtils from '@/utils/nodeViewUtils';\nimport type { ExecutionSummary, IConnection, INodeTypeDescription } from 'n8n-workflow';\nimport { NodeConnectionType } from 'n8n-workflow';\nimport { useToast } from '@/composables/useToast';\nimport { v4 as uuid } from 'uuid';\nimport { useSettingsStore } from '@/stores/settings.store';\nimport { useCredentialsStore } from '@/stores/credentials.store';\nimport useEnvironmentsStore from '@/stores/environments.ee.store';\nimport { useExternalSecretsStore } from '@/stores/externalSecrets.ee.store';\nimport { useRootStore } from '@/stores/root.store';\nimport { useCollaborationStore } from '@/stores/collaboration.store';\nimport { getUniqueNodeName } from '@/utils/canvasUtilsV2';\nimport { historyBus } from '@/models/history';\nimport { useCanvasOperations } from '@/composables/useCanvasOperations';\nimport { useExecutionsStore } from '@/stores/executions.store';\n\nconst NodeCreation = defineAsyncComponent(\n\tasync () => await import('@/components/Node/NodeCreation.vue'),\n);\n\nconst NodeDetailsView = defineAsyncComponent(\n\tasync () => await import('@/components/NodeDetailsView.vue'),\n);\n\nconst $style = useCssModule();\n\nconst router = useRouter();\nconst route = useRoute();\nconst i18n = useI18n();\nconst externalHooks = useExternalHooks();\nconst toast = useToast();\n\nconst nodeTypesStore = useNodeTypesStore();\nconst uiStore = useUIStore();\nconst workflowsStore = useWorkflowsStore();\nconst tagsStore = useTagsStore();\nconst sourceControlStore = useSourceControlStore();\nconst nodeCreatorStore = useNodeCreatorStore();\nconst settingsStore = useSettingsStore();\nconst credentialsStore = useCredentialsStore();\nconst environmentsStore = useEnvironmentsStore();\nconst externalSecretsStore = useExternalSecretsStore();\nconst rootStore = useRootStore();\nconst collaborationStore = useCollaborationStore();\nconst executionsStore = useExecutionsStore();\n\nconst { runWorkflow } = useRunWorkflow({ router });\nconst {\n\tupdateNodePosition,\n\trenameNode,\n\trevertRenameNode,\n\tsetNodeActive,\n\tdeleteNode,\n\trevertDeleteNode,\n\tcreateConnection,\n\tdeleteConnection,\n\trevertDeleteConnection,\n\tsetNodeActiveByName,\n} = useCanvasOperations();\n\nconst isLoading = ref(true);\nconst readOnlyNotification = ref<null | { visible: boolean }>(null);\n\nconst isProductionExecutionPreview = ref(false);\nconst isExecutionPreview = ref(false);\n\nconst canOpenNDV = ref(true);\nconst hideNodeIssues = ref(false);\n\nconst workflowId = computed<string>(() => route.params.workflowId as string);\nconst workflow = computed(() => workflowsStore.workflowsById[workflowId.value]);\n\nconst editableWorkflow = computed(() => workflowsStore.workflow);\nconst editableWorkflowObject = computed(() => workflowsStore.getCurrentWorkflow());\n\nconst isDemoRoute = computed(() => route.name === VIEWS.DEMO);\nconst isReadOnlyRoute = computed(() => route?.meta?.readOnlyCanvas === true);\nconst isReadOnlyEnvironment = computed(() => {\n\treturn sourceControlStore.preferences.branchReadOnly;\n});\n\nconst triggerNodes = computed<INodeUi[]>(() => {\n\treturn workflowsStore.workflowTriggerNodes;\n});\n\nconst isCanvasAddButtonVisible = computed(() => {\n\treturn (\n\t\ttriggerNodes.value.length > 0 &&\n\t\t!isLoading.value &&\n\t\t!isDemoRoute.value &&\n\t\t!isReadOnlyEnvironment.value\n\t);\n});\n\nonMounted(() => {\n\tvoid initialize();\n});\n\nasync function initialize() {\n\tisLoading.value = true;\n\n\tconst loadPromises: Array<Promise<unknown>> = [\n\t\tnodeTypesStore.getNodeTypes(),\n\t\tworkflowsStore.fetchWorkflow(workflowId.value),\n\t];\n\n\tif (!settingsStore.isPreviewMode && !isDemoRoute.value) {\n\t\tloadPromises.push(\n\t\t\tworkflowsStore.fetchActiveWorkflows(),\n\t\t\tcredentialsStore.fetchAllCredentials(),\n\t\t\tcredentialsStore.fetchCredentialTypes(true),\n\t\t);\n\n\t\tif (settingsStore.isEnterpriseFeatureEnabled(EnterpriseEditionFeature.Variables)) {\n\t\t\tloadPromises.push(environmentsStore.fetchAllVariables());\n\t\t}\n\n\t\tif (settingsStore.isEnterpriseFeatureEnabled(EnterpriseEditionFeature.ExternalSecrets)) {\n\t\t\tloadPromises.push(externalSecretsStore.fetchAllSecrets());\n\t\t}\n\t}\n\n\ttry {\n\t\tawait Promise.all(loadPromises);\n\t} catch (error) {\n\t\treturn toast.showError(\n\t\t\terror,\n\t\t\ti18n.baseText('nodeView.showError.mounted1.title'),\n\t\t\ti18n.baseText('nodeView.showError.mounted1.message') + ':',\n\t\t);\n\t}\n\n\tinitializeEditableWorkflow(workflowId.value);\n\n\taddUndoRedoEventBindings();\n\taddPostMessageEventBindings();\n\n\tif (window.parent) {\n\t\twindow.parent.postMessage(\n\t\t\tJSON.stringify({ command: 'n8nReady', version: rootStore.versionCli }),\n\t\t\t'*',\n\t\t);\n\t}\n\n\tisLoading.value = false;\n}\n\nonBeforeUnmount(() => {\n\tremovePostMessageEventBindings();\n\tremoveUndoRedoEventBindings();\n});\n\nfunction addUndoRedoEventBindings() {\n\t// historyBus.on('nodeMove', onMoveNode);\n\t// historyBus.on('revertAddNode', onRevertAddNode);\n\thistoryBus.on('revertRemoveNode', onRevertDeleteNode);\n\t// historyBus.on('revertAddConnection', onRevertAddConnection);\n\thistoryBus.on('revertRemoveConnection', onRevertDeleteConnection);\n\thistoryBus.on('revertRenameNode', onRevertRenameNode);\n\t// historyBus.on('enableNodeToggle', onRevertEnableToggle);\n}\n\nfunction removeUndoRedoEventBindings() {\n\t// historyBus.off('nodeMove', onMoveNode);\n\t// historyBus.off('revertAddNode', onRevertAddNode);\n\thistoryBus.off('revertRemoveNode', onRevertDeleteNode);\n\t// historyBus.off('revertAddConnection', onRevertAddConnection);\n\thistoryBus.off('revertRemoveConnection', onRevertDeleteConnection);\n\thistoryBus.off('revertRenameNode', onRevertRenameNode);\n\t// historyBus.off('enableNodeToggle', onRevertEnableToggle);\n}\n\nfunction addPostMessageEventBindings() {\n\twindow.addEventListener('message', onPostMessageReceived);\n}\n\nfunction removePostMessageEventBindings() {\n\twindow.removeEventListener('message', onPostMessageReceived);\n}\n\n// @TODO Maybe move this to the store\nfunction initializeEditableWorkflow(id: string) {\n\tconst targetWorkflow = workflowsStore.workflowsById[id];\n\n\tworkflowsStore.addWorkflow(targetWorkflow);\n\tworkflowsStore.setWorkflow(targetWorkflow);\n\tworkflowsStore.setActive(targetWorkflow.active || false);\n\tworkflowsStore.setWorkflowId(targetWorkflow.id);\n\tworkflowsStore.setWorkflowName({ newName: targetWorkflow.name, setStateDirty: false });\n\tworkflowsStore.setWorkflowSettings(targetWorkflow.settings ?? {});\n\tworkflowsStore.setWorkflowPinData(targetWorkflow.pinData ?? {});\n\tworkflowsStore.setWorkflowVersionId(targetWorkflow.versionId);\n\tworkflowsStore.setWorkflowMetadata(targetWorkflow.meta);\n\tif (targetWorkflow.usedCredentials) {\n\t\tworkflowsStore.setUsedCredentials(targetWorkflow.usedCredentials);\n\t}\n\n\tconst tags = (targetWorkflow.tags ?? []) as ITag[];\n\tconst tagIds = tags.map((tag) => tag.id);\n\tworkflowsStore.setWorkflowTagIds(tagIds || []);\n\ttagsStore.upsertTags(tags);\n\n\t// @TODO Figure out a better way to handle this. Maybe show a message on why the state becomes dirty\n\t// if (!this.credentialsUpdated) {\n\t// \tthis.uiStore.stateIsDirty = false;\n\t// }\n\n\tvoid externalHooks.run('workflow.open', {\n\t\tworkflowId: workflow.value.id,\n\t\tworkflowName: workflow.value.name,\n\t});\n\n\t// @TODO Figure out a better way to handle this\n\t// if (selectedExecution?.workflowId !== workflow.id) {\n\t// \tthis.executionsStore.activeExecution = null;\n\t// \tworkflowsStore.currentWorkflowExecutions = [];\n\t// } else {\n\t// \tthis.executionsStore.activeExecution = selectedExecution;\n\t// }\n\n\tcollaborationStore.notifyWorkflowOpened(workflow.value.id);\n}\n\nasync function onRunWorkflow() {\n\tawait runWorkflow({});\n}\n\nfunction onUpdateNodePosition(id: string, position: CanvasElement['position']) {\n\tupdateNodePosition(id, position, { trackHistory: true });\n}\n\nfunction onDeleteNode(id: string) {\n\tdeleteNode(id, { trackHistory: true });\n}\n\nfunction onRevertDeleteNode({ node }: { node: INodeUi }) {\n\trevertDeleteNode(node);\n}\n\nfunction onSetNodeActive(id: string) {\n\tsetNodeActive(id);\n}\n\n/**\n * Map new node connection format to the old one and add it to the store\n *\n * @param connection\n */\n\nfunction onCreateConnection(connection: Connection) {\n\tcreateConnection(connection);\n}\n\nfunction onDeleteConnection(connection: Connection) {\n\tdeleteConnection(connection, { trackHistory: true });\n}\n\nfunction onRevertDeleteConnection({ connection }: { connection: [IConnection, IConnection] }) {\n\trevertDeleteConnection(connection);\n}\n\nasync function onAddNodes(\n\t{ nodes, connections }: AddedNodesAndConnections,\n\tdragAndDrop = false,\n\tposition?: XYPosition,\n) {\n\tlet currentPosition = position;\n\tfor (const { type, name, position: nodePosition, isAutoAdd, openDetail } of nodes) {\n\t\ttry {\n\t\t\tawait onNodeCreate(\n\t\t\t\t{\n\t\t\t\t\tname,\n\t\t\t\t\ttype,\n\t\t\t\t\tposition: nodePosition ?? currentPosition,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tdragAndDrop,\n\t\t\t\t\topenNDV: openDetail ?? false,\n\t\t\t\t\ttrackHistory: true,\n\t\t\t\t\tisAutoAdd,\n\t\t\t\t},\n\t\t\t);\n\t\t} catch (error) {\n\t\t\ttoast.showError(error, i18n.baseText('error'));\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst lastAddedNode = editableWorkflow.value.nodes[editableWorkflow.value.nodes.length - 1];\n\t\tcurrentPosition = [\n\t\t\tlastAddedNode.position[0] + NodeViewUtils.NODE_SIZE * 2 + NodeViewUtils.GRID_SIZE,\n\t\t\tlastAddedNode.position[1],\n\t\t];\n\t}\n\n\tconst newNodesOffset = editableWorkflow.value.nodes.length - nodes.length;\n\tfor (const { from, to } of connections) {\n\t\tconst fromNode = editableWorkflow.value.nodes[newNodesOffset + from.nodeIndex];\n\t\tconst toNode = editableWorkflow.value.nodes[newNodesOffset + to.nodeIndex];\n\n\t\tonCreateConnection({\n\t\t\tsource: fromNode.id,\n\t\t\tsourceHandle: `outputs/${NodeConnectionType.Main}/${from.outputIndex ?? 0}`,\n\t\t\ttarget: toNode.id,\n\t\t\ttargetHandle: `inputs/${NodeConnectionType.Main}/${to.inputIndex ?? 0}`,\n\t\t});\n\t}\n\n\tconst lastAddedNode = editableWorkflow.value.nodes[editableWorkflow.value.nodes.length - 1];\n\tconst lastNodeInputs = editableWorkflowObject.value.getParentNodesByDepth(lastAddedNode.name, 1);\n\n\t// If the last added node has multiple inputs, move them down\n\tif (lastNodeInputs.length > 1) {\n\t\tlastNodeInputs.slice(1).forEach((node, index) => {\n\t\t\tconst nodeUi = workflowsStore.getNodeByName(node.name);\n\t\t\tif (!nodeUi) return;\n\n\t\t\tupdateNodePosition(nodeUi.id, {\n\t\t\t\tx: nodeUi.position[0],\n\t\t\t\ty: nodeUi.position[1] + 100 * (index + 1),\n\t\t\t});\n\t\t});\n\t}\n}\n\ntype AddNodeData = {\n\tname?: string;\n\ttype: string;\n\tposition?: XYPosition;\n};\n\ntype AddNodeOptions = {\n\tdragAndDrop?: boolean;\n\topenNDV?: boolean;\n\ttrackHistory?: boolean;\n\tisAutoAdd?: boolean;\n};\n\nasync function onNodeCreate(node: AddNodeData, _options: AddNodeOptions = {}): Promise<INodeUi> {\n\tif (!checkIfEditingIsAllowed()) {\n\t\tthrow new Error(i18n.baseText('nodeViewV2.showError.editingNotAllowed'));\n\t}\n\n\tconst newNodeData = await createNodeWithDefaultCredentials(node);\n\tif (!newNodeData) {\n\t\tthrow new Error(i18n.baseText('nodeViewV2.showError.failedToCreateNode'));\n\t}\n\n\t/**\n\t * @TODO Check if maximum node type limit reached\n\t */\n\n\tnewNodeData.name = getUniqueNodeName(newNodeData.name, workflowsStore.canvasNames);\n\n\tworkflowsStore.addNode(newNodeData);\n\n\t// @TODO Figure out why this is needed and if we can do better...\n\t// this.matchCredentials(node);\n\n\t// @TODO Connect added node to last selected node\n\t// const lastSelectedNode = uiStore.getLastSelectedNode;\n\t// const lastSelectedNodeOutputIndex = uiStore.lastSelectedNodeOutputIndex;\n\t// const lastSelectedNodeEndpointUuid = uiStore.lastSelectedNodeEndpointUuid;\n\t// const lastSelectedConnection = canvasStore.lastSelectedConnection;\n\t//\n\t// historyStore.startRecordingUndo();\n\t//\n\t// const newNodeData = await injectNode(\n\t// \tnodeTypeName,\n\t// \toptions,\n\t// \tshowDetail,\n\t// \ttrackHistory,\n\t// \tisAutoAdd,\n\t// );\n\t// if (!newNodeData) {\n\t// \treturn;\n\t// }\n\t//\n\t// const outputIndex = lastSelectedNodeOutputIndex || 0;\n\t// const targetEndpoint = lastSelectedNodeEndpointUuid || '';\n\t//\n\t// // Handle connection of scoped_endpoint types\n\t// if (lastSelectedNodeEndpointUuid && !isAutoAdd) {\n\t// \tconst lastSelectedEndpoint = this.instance.getEndpoint(lastSelectedNodeEndpointUuid);\n\t// \tif (\n\t// \t\tlastSelectedEndpoint &&\n\t// \t\tthis.checkNodeConnectionAllowed(\n\t// \t\t\tlastSelectedNode,\n\t// \t\t\tnewNodeData,\n\t// \t\t\tlastSelectedEndpoint.scope as NodeConnectionType,\n\t// \t\t)\n\t// \t) {\n\t// \t\tconst connectionType = lastSelectedEndpoint.scope as ConnectionTypes;\n\t// \t\tconst newNodeElement = this.instance.getManagedElement(newNodeData.id);\n\t// \t\tconst newNodeConnections = this.instance.getEndpoints(newNodeElement);\n\t// \t\tconst viableConnection = newNodeConnections.find((conn) => {\n\t// \t\t\treturn (\n\t// \t\t\t\tconn.scope === connectionType &&\n\t// \t\t\t\tlastSelectedEndpoint.parameters.connection !== conn.parameters.connection\n\t// \t\t\t);\n\t// \t\t});\n\t//\n\t// \t\tthis.instance?.connect({\n\t// \t\t\tuuids: [targetEndpoint, viableConnection?.uuid || ''],\n\t// \t\t\tdetachable: !this.isReadOnlyRoute && !this.readOnlyEnv,\n\t// \t\t});\n\t// \t\tthis.historyStore.stopRecordingUndo();\n\t// \t\treturn;\n\t// \t}\n\t// }\n\t// If a node is last selected then connect between the active and its child ones\n\t// if (lastSelectedNode && !isAutoAdd) {\n\t// \tawait this.$nextTick();\n\t//\n\t// \tif (lastSelectedConnection?.__meta) {\n\t// \t\tthis.__deleteJSPlumbConnection(lastSelectedConnection, trackHistory);\n\t//\n\t// \t\tconst targetNodeName = lastSelectedConnection.__meta.targetNodeName;\n\t// \t\tconst targetOutputIndex = lastSelectedConnection.__meta.targetOutputIndex;\n\t// \t\tthis.connectTwoNodes(\n\t// \t\t\tnewNodeData.name,\n\t// \t\t\t0,\n\t// \t\t\ttargetNodeName,\n\t// \t\t\ttargetOutputIndex,\n\t// \t\t\tNodeConnectionType.Main,\n\t// \t\t);\n\t// \t}\n\t//\n\t// \t// Connect active node to the newly created one\n\t// \tthis.connectTwoNodes(\n\t// \t\tlastSelectedNode.name,\n\t// \t\toutputIndex,\n\t// \t\tnewNodeData.name,\n\t// \t\t0,\n\t// \t\tNodeConnectionType.Main,\n\t// \t);\n\t// }\n\t// this.historyStore.stopRecordingUndo();\n\n\treturn newNodeData;\n}\n\nasync function createNodeWithDefaultCredentials(node: Partial<INodeUi>) {\n\tconst nodeTypeDescription = nodeTypesStore.getNodeType(\n\t\tnode.type as string,\n\t) as INodeTypeDescription;\n\n\tlet nodeVersion = nodeTypeDescription.defaultVersion;\n\tif (typeof nodeVersion === 'undefined') {\n\t\tnodeVersion = Array.isArray(nodeTypeDescription.version)\n\t\t\t? nodeTypeDescription.version.slice(-1)[0]\n\t\t\t: nodeTypeDescription.version;\n\t}\n\n\tconst newNodeData: INodeUi = {\n\t\tid: uuid(),\n\t\tname: node.name ?? (nodeTypeDescription.defaults.name as string),\n\t\ttype: nodeTypeDescription.name,\n\t\ttypeVersion: nodeVersion,\n\t\tposition: node.position ?? [0, 0],\n\t\tparameters: {},\n\t};\n\n\t/**\n\t * @TODO Implement this\n\t */\n\n\t// // Load the default parameter values because only values which differ\n\t// // from the defaults get saved\n\t// if (nodeType !== null) {\n\t// \tlet nodeParameters = null;\n\t// \ttry {\n\t// \t\tnodeParameters = NodeHelpers.getNodeParameters(\n\t// \t\t\tnodeType.properties,\n\t// \t\t\tnode.parameters,\n\t// \t\t\ttrue,\n\t// \t\t\tfalse,\n\t// \t\t\tnode,\n\t// \t\t);\n\t// \t} catch (e) {\n\t// \t\tconsole.error(\n\t// \t\t\ti18n.baseText('nodeView.thereWasAProblemLoadingTheNodeParametersOfNode') +\n\t// \t\t\t`: \"${node.name}\"`,\n\t// \t\t);\n\t// \t\tconsole.error(e);\n\t// \t}\n\t// \tnode.parameters = nodeParameters !== null ? nodeParameters : {};\n\t//\n\t// \t// if it's a webhook and the path is empty set the UUID as the default path\n\t// \tif (\n\t// \t\t[WEBHOOK_NODE_TYPE, FORM_TRIGGER_NODE_TYPE].includes(node.type) &&\n\t// \t\tnode.parameters.path === ''\n\t// \t) {\n\t// \t\tnode.parameters.path = node.webhookId as string;\n\t// \t}\n\t// }\n\t// const credentialPerType = nodeTypeData.credentials\n\t// \t?.map((type) => credentialsStore.getUsableCredentialByType(type.name))\n\t// \t.flat();\n\t//\n\t// if (credentialPerType && credentialPerType.length === 1) {\n\t// \tconst defaultCredential = credentialPerType[0];\n\t//\n\t// \tconst selectedCredentials = credentialsStore.getCredentialById(defaultCredential.id);\n\t// \tconst selected = { id: selectedCredentials.id, name: selectedCredentials.name };\n\t// \tconst credentials = {\n\t// \t\t[defaultCredential.type]: selected,\n\t// \t};\n\t//\n\t// \tawait loadNodesProperties(\n\t// \t\t[newNodeData].map((node) => ({ name: node.type, version: node.typeVersion })),\n\t// \t);\n\t//\n\t// \tconst nodeType = nodeTypesStore.getNodeType(newNodeData.type, newNodeData.typeVersion);\n\t// \tconst nodeParameters = NodeHelpers.getNodeParameters(\n\t// \t\tnodeType?.properties ?? [],\n\t// \t\t{},\n\t// \t\ttrue,\n\t// \t\tfalse,\n\t// \t\tnewNodeData,\n\t// \t);\n\t//\n\t// \tif (nodeTypeData.credentials) {\n\t// \t\tconst authentication = nodeTypeData.credentials.find(\n\t// \t\t\t(type) => type.name === defaultCredential.type,\n\t// \t\t);\n\t// \t\tif (authentication?.displayOptions?.hide) {\n\t// \t\t\treturn newNodeData;\n\t// \t\t}\n\t//\n\t// \t\tconst authDisplayOptions = authentication?.displayOptions?.show;\n\t// \t\tif (!authDisplayOptions) {\n\t// \t\t\tnewNodeData.credentials = credentials;\n\t// \t\t\treturn newNodeData;\n\t// \t\t}\n\t//\n\t// \t\tif (Object.keys(authDisplayOptions).length === 1 && authDisplayOptions.authentication) {\n\t// \t\t\t// ignore complex case when there's multiple dependencies\n\t// \t\t\tnewNodeData.credentials = credentials;\n\t//\n\t// \t\t\tlet parameters: { [key: string]: string } = {};\n\t// \t\t\tfor (const displayOption of Object.keys(authDisplayOptions)) {\n\t// \t\t\t\tif (nodeParameters && !nodeParameters[displayOption]) {\n\t// \t\t\t\t\tparameters = {};\n\t// \t\t\t\t\tnewNodeData.credentials = undefined;\n\t// \t\t\t\t\tbreak;\n\t// \t\t\t\t}\n\t// \t\t\t\tconst optionValue = authDisplayOptions[displayOption]?.[0];\n\t// \t\t\t\tif (optionValue && typeof optionValue === 'string') {\n\t// \t\t\t\t\tparameters[displayOption] = optionValue;\n\t// \t\t\t\t}\n\t// \t\t\t\tnewNodeData.parameters = {\n\t// \t\t\t\t\t...newNodeData.parameters,\n\t// \t\t\t\t\t...parameters,\n\t// \t\t\t\t};\n\t// \t\t\t}\n\t// \t\t}\n\t// \t}\n\t// }\n\n\treturn newNodeData;\n}\n\n/**\n * @TODO Implement if needed\n */\n// async loadNodesProperties(nodeInfos: INodeTypeNameVersion[]): Promise<void> {\n// \tconst allNodes: INodeTypeDescription[] = this.nodeTypesStore.allNodeTypes;\n//\n// const nodesToBeFetched: INodeTypeNameVersion[] = [];\n// allNodes.forEach((node) => {\n// \tconst nodeVersions = Array.isArray(node.version) ? node.version : [node.version];\n// \tif (\n// \t\t!!nodeInfos.find((n) => n.name === node.name && nodeVersions.includes(n.version)) &&\n// \t\t!node.hasOwnProperty('properties')\n// \t) {\n// \t\tnodesToBeFetched.push({\n// \t\t\tname: node.name,\n// \t\t\tversion: Array.isArray(node.version) ? node.version.slice(-1)[0] : node.version,\n// \t\t});\n// \t}\n// });\n//\n// if (nodesToBeFetched.length > 0) {\n// \t// Only call API if node information is actually missing\n// \tthis.canvasStore.startLoading();\n// \tawait this.nodeTypesStore.getNodesInformation(nodesToBeFetched);\n// \tthis.canvasStore.stopLoading();\n// }\n// }\n\n/**\n * @TODO Probably not needed and can be merged into addNode\n */\nasync function injectNode(\n\t_nodeTypeName: string,\n\t_options: AddNodeOptions = {},\n\t_showDetail = true,\n\t_trackHistory = false,\n\t_isAutoAdd = false,\n) {\n\t// const nodeTypeData: INodeTypeDescription | null =\n\t// \tthis.nodeTypesStore.getNodeType(nodeTypeName);\n\t//\n\t// if (nodeTypeData === null) {\n\t// \tthis.showMessage({\n\t// \t\ttitle: i18n.baseText('nodeView.showMessage.addNodeButton.title'),\n\t// \t\tmessage: i18n.baseText('nodeView.showMessage.addNodeButton.message', {\n\t// \t\t\tinterpolate: { nodeTypeName },\n\t// \t\t}),\n\t// \t\ttype: 'error',\n\t// \t});\n\t// \treturn;\n\t// }\n\t//\n\t// if (\n\t// \tnodeTypeData.maxNodes !== undefined &&\n\t// \tthis.workflowHelpers.getNodeTypeCount(nodeTypeName) >= nodeTypeData.maxNodes\n\t// ) {\n\t// \tthis.showMaxNodeTypeError(nodeTypeData);\n\t// \treturn;\n\t// }\n\t//\n\t// const newNodeData = await this.getNewNodeWithDefaultCredential(nodeTypeData, {\n\t// \tname: options.name,\n\t// });\n\t//\n\t// // when pulling new connection from node or injecting into a connection\n\t// const lastSelectedNode = this.lastSelectedNode;\n\t//\n\t// if (options.position) {\n\t// \tnewNodeData.position = NodeViewUtils.getNewNodePosition(\n\t// \t\tthis.canvasStore.getNodesWithPlaceholderNode(),\n\t// \t\toptions.position,\n\t// \t);\n\t// } else if (lastSelectedNode) {\n\t// \tconst lastSelectedConnection = this.canvasStore.lastSelectedConnection;\n\t// \tif (lastSelectedConnection) {\n\t// \t\t// set when injecting into a connection\n\t// \t\tconst [diffX] = NodeViewUtils.getConnectorLengths(lastSelectedConnection);\n\t// \t\tif (diffX <= NodeViewUtils.MAX_X_TO_PUSH_DOWNSTREAM_NODES) {\n\t// \t\t\tthis.pushDownstreamNodes(\n\t// \t\t\t\tlastSelectedNode.name,\n\t// \t\t\t\tNodeViewUtils.PUSH_NODES_OFFSET,\n\t// \t\t\t\ttrackHistory,\n\t// \t\t\t);\n\t// \t\t}\n\t// \t}\n\t//\n\t// \t// set when pulling connections\n\t// \tif (this.canvasStore.newNodeInsertPosition) {\n\t// \t\tnewNodeData.position = NodeViewUtils.getNewNodePosition(this.nodes, [\n\t// \t\t\tthis.canvasStore.newNodeInsertPosition[0] + NodeViewUtils.GRID_SIZE,\n\t// \t\t\tthis.canvasStore.newNodeInsertPosition[1] - NodeViewUtils.NODE_SIZE / 2,\n\t// \t\t]);\n\t// \t\tthis.canvasStore.newNodeInsertPosition = null;\n\t// \t} else {\n\t// \t\tlet yOffset = 0;\n\t// \t\tconst workflow = this.workflowHelpers.getCurrentWorkflow();\n\t//\n\t// \t\tif (lastSelectedConnection) {\n\t// \t\t\tconst sourceNodeType = this.nodeTypesStore.getNodeType(\n\t// \t\t\t\tlastSelectedNode.type,\n\t// \t\t\t\tlastSelectedNode.typeVersion,\n\t// \t\t\t);\n\t//\n\t// \t\t\tif (sourceNodeType) {\n\t// \t\t\t\tconst offsets = [\n\t// \t\t\t\t\t[-100, 100],\n\t// \t\t\t\t\t[-140, 0, 140],\n\t// \t\t\t\t\t[-240, -100, 100, 240],\n\t// \t\t\t\t];\n\t//\n\t// \t\t\t\tconst sourceNodeOutputs = NodeHelpers.getNodeOutputs(\n\t// \t\t\t\t\tworkflow,\n\t// \t\t\t\t\tlastSelectedNode,\n\t// \t\t\t\t\tsourceNodeType,\n\t// \t\t\t\t);\n\t// \t\t\t\tconst sourceNodeOutputTypes = NodeHelpers.getConnectionTypes(sourceNodeOutputs);\n\t//\n\t// \t\t\t\tconst sourceNodeOutputMainOutputs = sourceNodeOutputTypes.filter(\n\t// \t\t\t\t\t(output) => output === NodeConnectionType.Main,\n\t// \t\t\t\t);\n\t//\n\t// \t\t\t\tif (sourceNodeOutputMainOutputs.length > 1) {\n\t// \t\t\t\t\tconst offset = offsets[sourceNodeOutputMainOutputs.length - 2];\n\t// \t\t\t\t\tconst sourceOutputIndex = lastSelectedConnection.__meta\n\t// \t\t\t\t\t\t? lastSelectedConnection.__meta.sourceOutputIndex\n\t// \t\t\t\t\t\t: 0;\n\t// \t\t\t\t\tyOffset = offset[sourceOutputIndex];\n\t// \t\t\t\t}\n\t// \t\t\t}\n\t// \t\t}\n\t//\n\t// \t\tlet outputs: Array<ConnectionTypes | INodeOutputConfiguration> = [];\n\t// \t\ttry {\n\t// \t\t\t// It fails when the outputs are an expression. As those nodes have\n\t// \t\t\t// normally no outputs by default and the only reason we need the\n\t// \t\t\t// outputs here is to calculate the position, it is fine to assume\n\t// \t\t\t// that they have no outputs and are so treated as a regular node\n\t// \t\t\t// with only \"main\" outputs.\n\t// \t\t\toutputs = NodeHelpers.getNodeOutputs(workflow, newNodeData, nodeTypeData);\n\t// \t\t} catch (e) {}\n\t// \t\tconst outputTypes = NodeHelpers.getConnectionTypes(outputs);\n\t// \t\tconst lastSelectedNodeType = this.nodeTypesStore.getNodeType(\n\t// \t\t\tlastSelectedNode.type,\n\t// \t\t\tlastSelectedNode.typeVersion,\n\t// \t\t);\n\t//\n\t// \t\t// If node has only scoped outputs, position it below the last selected node\n\t// \t\tif (\n\t// \t\t\toutputTypes.length > 0 &&\n\t// \t\t\toutputTypes.every((outputName) => outputName !== NodeConnectionType.Main)\n\t// \t\t) {\n\t// \t\t\tconst lastSelectedNodeWorkflow = workflow.getNode(lastSelectedNode.name);\n\t// \t\t\tconst lastSelectedInputs = NodeHelpers.getNodeInputs(\n\t// \t\t\t\tworkflow,\n\t// \t\t\t\tlastSelectedNodeWorkflow,\n\t// \t\t\t\tlastSelectedNodeType,\n\t// \t\t\t);\n\t// \t\t\tconst lastSelectedInputTypes = NodeHelpers.getConnectionTypes(lastSelectedInputs);\n\t//\n\t// \t\t\tconst scopedConnectionIndex = (lastSelectedInputTypes || [])\n\t// \t\t\t\t.filter((input) => input !== NodeConnectionType.Main)\n\t// \t\t\t\t.findIndex((inputType) => outputs[0] === inputType);\n\t//\n\t// \t\t\tnewNodeData.position = NodeViewUtils.getNewNodePosition(\n\t// \t\t\t\tthis.nodes,\n\t// \t\t\t\t[\n\t// \t\t\t\t\tlastSelectedNode.position[0] +\n\t// \t\t\t\t\t(NodeViewUtils.NODE_SIZE /\n\t// \t\t\t\t\t\t(Math.max(lastSelectedNodeType?.inputs?.length ?? 1), 1)) *\n\t// \t\t\t\t\tscopedConnectionIndex,\n\t// \t\t\t\t\tlastSelectedNode.position[1] + NodeViewUtils.PUSH_NODES_OFFSET,\n\t// \t\t\t\t],\n\t// \t\t\t\t[100, 0],\n\t// \t\t\t);\n\t// \t\t} else {\n\t// \t\t\t// Has only main outputs or no outputs at all\n\t// \t\t\tconst inputs = NodeHelpers.getNodeInputs(\n\t// \t\t\t\tworkflow,\n\t// \t\t\t\tlastSelectedNode,\n\t// \t\t\t\tlastSelectedNodeType,\n\t// \t\t\t);\n\t// \t\t\tconst inputsTypes = NodeHelpers.getConnectionTypes(inputs);\n\t//\n\t// \t\t\tlet pushOffset = NodeViewUtils.PUSH_NODES_OFFSET;\n\t// \t\t\tif (!!inputsTypes.find((input) => input !== NodeConnectionType.Main)) {\n\t// \t\t\t\t// If the node has scoped inputs, push it down a bit more\n\t// \t\t\t\tpushOffset += 150;\n\t// \t\t\t}\n\t//\n\t// \t\t\t// If a node is active then add the new node directly after the current one\n\t// \t\t\tnewNodeData.position = NodeViewUtils.getNewNodePosition(\n\t// \t\t\t\tthis.nodes,\n\t// \t\t\t\t[lastSelectedNode.position[0] + pushOffset, lastSelectedNode.position[1] + yOffset],\n\t// \t\t\t\t[100, 0],\n\t// \t\t\t);\n\t// \t\t}\n\t// \t}\n\t// } else {\n\t// \t// If added node is a trigger and it's the first one added to the canvas\n\t// \t// we place it at canvasAddButtonPosition to replace the canvas add button\n\t// \tconst position =\n\t// \t\tthis.nodeTypesStore.isTriggerNode(nodeTypeName) && !this.containsTrigger\n\t// \t\t\t? this.canvasStore.canvasAddButtonPosition\n\t// \t\t\t: // If no node is active find a free spot\n\t// \t\t\t(this.lastClickPosition as XYPosition);\n\t//\n\t// \tnewNodeData.position = NodeViewUtils.getNewNodePosition(this.nodes, position);\n\t// }\n\t//\n\t// const localizedName = this.locale.localizeNodeName(newNodeData.name, newNodeData.type);\n\t//\n\t// newNodeData.name = this.uniqueNodeName(localizedName);\n\t//\n\t// if (nodeTypeData.webhooks?.length) {\n\t// \tnewNodeData.webhookId = uuid();\n\t// }\n\t//\n\t// await this.addNodes([newNodeData], undefined, trackHistory);\n\t// this.workflowsStore.setNodePristine(newNodeData.name, true);\n\t//\n\t// this.uiStore.stateIsDirty = true;\n\t//\n\t// if (nodeTypeName === STICKY_NODE_TYPE) {\n\t// \tthis.$telemetry.trackNodesPanel('nodeView.addSticky', {\n\t// \t\tworkflow_id: this.workflowsStore.workflowId,\n\t// \t});\n\t// } else {\n\t// \tvoid this.externalHooks.run('nodeView.addNodeButton', { nodeTypeName });\n\t// \tuseSegment().trackAddedTrigger(nodeTypeName);\n\t// \tconst trackProperties: ITelemetryTrackProperties = {\n\t// \t\tnode_type: nodeTypeName,\n\t// \t\tnode_version: newNodeData.typeVersion,\n\t// \t\tis_auto_add: isAutoAdd,\n\t// \t\tworkflow_id: this.workflowsStore.workflowId,\n\t// \t\tdrag_and_drop: options.dragAndDrop,\n\t// \t};\n\t//\n\t// \tif (lastSelectedNode) {\n\t// \t\ttrackProperties.input_node_type = lastSelectedNode.type;\n\t// \t}\n\t//\n\t// \tthis.$telemetry.trackNodesPanel('nodeView.addNodeButton', trackProperties);\n\t// }\n\t//\n\t// // Automatically deselect all nodes and select the current one and also active\n\t// // current node. But only if it's added manually by the user (not by undo/redo mechanism)\n\t// if (trackHistory) {\n\t// \tthis.deselectAllNodes();\n\t// \tsetTimeout(() => {\n\t// \t\tthis.nodeSelectedByName(\n\t// \t\t\tnewNodeData.name,\n\t// \t\t\tshowDetail && nodeTypeName !== STICKY_NODE_TYPE,\n\t// \t\t);\n\t// \t});\n\t// }\n\t//\n\t// return newNodeData;\n}\n\nfunction checkIfEditingIsAllowed(): boolean {\n\tif (readOnlyNotification.value?.visible) {\n\t\treturn false;\n\t}\n\n\tif (isReadOnlyRoute.value || isReadOnlyEnvironment.value) {\n\t\tconst messageContext = isReadOnlyRoute.value ? 'executions' : 'workflows';\n\t\treadOnlyNotification.value = toast.showMessage({\n\t\t\ttitle: i18n.baseText(\n\t\t\t\tisReadOnlyEnvironment.value\n\t\t\t\t\t? `readOnlyEnv.showMessage.${messageContext}.title`\n\t\t\t\t\t: 'readOnly.showMessage.executions.title',\n\t\t\t),\n\t\t\tmessage: i18n.baseText(\n\t\t\t\tisReadOnlyEnvironment.value\n\t\t\t\t\t? `readOnlyEnv.showMessage.${messageContext}.message`\n\t\t\t\t\t: 'readOnly.showMessage.executions.message',\n\t\t\t),\n\t\t\ttype: 'info',\n\t\t\tdangerouslyUseHTMLString: true,\n\t\t}) as unknown as { visible: boolean };\n\n\t\treturn false;\n\t}\n\n\treturn true;\n}\n\nasync function onPostMessageReceived(message: MessageEvent) {\n\tif (!message || typeof message.data !== 'string' || !message.data?.includes?.('\"command\"')) {\n\t\treturn;\n\t}\n\ttry {\n\t\tconst json = JSON.parse(message.data);\n\t\tif (json && json.command === 'openWorkflow') {\n\t\t\ttry {\n\t\t\t\tawait importWorkflowExact(json.data);\n\t\t\t\tcanOpenNDV.value = json.canOpenNDV ?? true;\n\t\t\t\thideNodeIssues.value = json.hideNodeIssues ?? false;\n\t\t\t\tisExecutionPreview.value = false;\n\t\t\t} catch (e) {\n\t\t\t\tif (window.top) {\n\t\t\t\t\twindow.top.postMessage(\n\t\t\t\t\t\tJSON.stringify({\n\t\t\t\t\t\t\tcommand: 'error',\n\t\t\t\t\t\t\tmessage: i18n.baseText('openWorkflow.workflowImportError'),\n\t\t\t\t\t\t}),\n\t\t\t\t\t\t'*',\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\ttoast.showMessage({\n\t\t\t\t\ttitle: i18n.baseText('openWorkflow.workflowImportError'),\n\t\t\t\t\tmessage: (e as Error).message,\n\t\t\t\t\ttype: 'error',\n\t\t\t\t});\n\t\t\t}\n\t\t} else if (json && json.command === 'openExecution') {\n\t\t\ttry {\n\t\t\t\t// If this NodeView is used in preview mode (in iframe) it will not have access to the main app store\n\t\t\t\t// so everything it needs has to be sent using post messages and passed down to child components\n\t\t\t\tisProductionExecutionPreview.value = json.executionMode !== 'manual';\n\n\t\t\t\tawait openExecution(json.executionId);\n\t\t\t\tcanOpenNDV.value = json.canOpenNDV ?? true;\n\t\t\t\thideNodeIssues.value = json.hideNodeIssues ?? false;\n\t\t\t\tisExecutionPreview.value = true;\n\t\t\t} catch (e) {\n\t\t\t\tif (window.top) {\n\t\t\t\t\twindow.top.postMessage(\n\t\t\t\t\t\tJSON.stringify({\n\t\t\t\t\t\t\tcommand: 'error',\n\t\t\t\t\t\t\tmessage: i18n.baseText('nodeView.showError.openExecution.title'),\n\t\t\t\t\t\t}),\n\t\t\t\t\t\t'*',\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\ttoast.showMessage({\n\t\t\t\t\ttitle: i18n.baseText('nodeView.showError.openExecution.title'),\n\t\t\t\t\tmessage: (e as Error).message,\n\t\t\t\t\ttype: 'error',\n\t\t\t\t});\n\t\t\t}\n\t\t} else if (json?.command === 'setActiveExecution') {\n\t\t\texecutionsStore.activeExecution = (await executionsStore.fetchExecution(\n\t\t\t\tjson.executionId,\n\t\t\t)) as ExecutionSummary;\n\t\t}\n\t} catch (e) {}\n}\n\nasync function onSwitchSelectedNode(nodeName: string) {\n\tsetNodeActiveByName(nodeName);\n}\n\nasync function onOpenConnectionNodeCreator(node: string, connectionType: NodeConnectionType) {\n\tnodeCreatorStore.openSelectiveNodeCreator({ node, connectionType });\n}\n\nfunction onToggleNodeCreator(options: ToggleNodeCreatorOptions) {\n\tnodeCreatorStore.openNodeCreator(options);\n}\n\nasync function openExecution(_executionId: string) {\n\t// @TODO\n}\n\nasync function importWorkflowExact(_workflow: IWorkflowDataUpdate) {\n\t// @TODO\n}\n\nasync function onRevertRenameNode({\n\tcurrentName,\n\tnewName,\n}: {\n\tcurrentName: string;\n\tnewName: string;\n}) {\n\tawait revertRenameNode(currentName, newName);\n}\n\nfunction onUpdateNodeValue(parameterData: IUpdateInformation) {\n\tif (parameterData.name === 'name' && parameterData.oldValue) {\n\t\t// The name changed so we have to take care that\n\t\t// the connections get changed.\n\t\tvoid renameNode(parameterData.oldValue as string, parameterData.value as string);\n\t}\n}\n</script>\n\n<template>\n\t<WorkflowCanvas\n\t\tv-if=\"editableWorkflow && editableWorkflowObject\"\n\t\t:workflow=\"editableWorkflow\"\n\t\t:workflow-object=\"editableWorkflowObject\"\n\t\t@update:node:position=\"onUpdateNodePosition\"\n\t\t@update:node:active=\"onSetNodeActive\"\n\t\t@delete:node=\"onDeleteNode\"\n\t\t@create:connection=\"onCreateConnection\"\n\t\t@delete:connection=\"onDeleteConnection\"\n\t>\n\t\t<div :class=\"$style.executionButtons\">\n\t\t\t<CanvasExecuteWorkflowButton @click=\"onRunWorkflow\" />\n\t\t</div>\n\t\t<Suspense>\n\t\t\t<NodeCreation\n\t\t\t\tv-if=\"!isReadOnlyRoute && !isReadOnlyEnvironment\"\n\t\t\t\t:create-node-active=\"uiStore.isCreateNodeActive\"\n\t\t\t\t:node-view-scale=\"1\"\n\t\t\t\t@toggle-node-creator=\"onToggleNodeCreator\"\n\t\t\t\t@add-nodes=\"onAddNodes\"\n\t\t\t/>\n\t\t</Suspense>\n\t\t<Suspense>\n\t\t\t<NodeDetailsView\n\t\t\t\t:read-only=\"isReadOnlyRoute || isReadOnlyEnvironment\"\n\t\t\t\t:is-production-execution-preview=\"isProductionExecutionPreview\"\n\t\t\t\t:renaming=\"false\"\n\t\t\t\t@value-changed=\"onUpdateNodeValue\"\n\t\t\t\t@switch-selected-node=\"onSwitchSelectedNode\"\n\t\t\t\t@open-connection-node-creator=\"onOpenConnectionNodeCreator\"\n\t\t\t/>\n\t\t\t<!--\n\t\t\t\t:renaming=\"renamingActive\"\n\t\t\t\t@stop-execution=\"stopExecution\"\n\t\t\t\t@save-keyboard-shortcut=\"onSaveKeyboardShortcut\"\n\t\t\t-->\n\t\t</Suspense>\n\t</WorkflowCanvas>\n</template>\n\n<style lang=\"scss\" module>\n.executionButtons {\n\tposition: absolute;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tleft: 50%;\n\ttransform: translateX(-50%);\n\tbottom: var(--spacing-l);\n\twidth: auto;\n\n\t@media (max-width: $breakpoint-2xs) {\n\t\tbottom: 150px;\n\t}\n\n\tbutton {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tmargin-left: 0.625rem;\n\n\t\t&:first-child {\n\t\t\tmargin: 0;\n\t\t}\n\t}\n}\n</style>\n"],"file":"assets/NodeView.v2-DyU_S0rY.js"}
+{"version":3,"mappings":"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","names":["workflowRunning","nodeDisabledTitle","emit","__emit","$style","useCssModule","node","inject","CanvasNodeKey","i18n","useI18n","data","computed","executeNode","toggleDisableNode","deleteNode","openContextMenu","_e","_type","useNodeConnections","inputs","outputs","mainInputs","unref","input","NodeConnectionType","nonMainInputs","requiredNonMainInputs","mainOutputs","output","nonMainOutputs","label","classes","styles","stylesObject","spacerCount","slots","_useSlots","Render","Component","CanvasNodeConfigurable","CanvasNodeConfiguration","CanvasNodeDefault","h","handle","CanvasNodeHandleKey","props","__props","handleType","isConnectableStart","isConnectableEnd","renderProps","CanvasHandleMainInput","CanvasHandleMainOutput","CanvasHandleNonMain","toRef","provide","nodeTypesStore","useNodeTypesStore","nodeType","inputsWithPosition","mapEndpointWithPosition","Position","outputsWithPosition","position","offsetAxis","endpoint","index","endpoints","id","selected","onDelete","onActivate","edgeStyle","isEdgeToolbarVisible","edgeToolbarStyle","path","edgeToolbarClasses","getBezierPath","connection","getSelectedEdges","getSelectedNodes","useVueFlow","hoveredEdges","ref","onMounted","onKeyDown","onUnmounted","onNodeDragStop","e","onSetNodeActive","onDeleteNode","onDeleteConnection","onConnect","args","onMouseEnterEdge","event","onMouseLeaveEdge","mapLegacyConnectionsToCanvasConnections","legacyConnections","nodes","mappedConnections","fromNodeName","fromId","_a","fromConnectionType","toPorts","fromIndex","toPort","toId","toConnectionType","toIndex","parseCanvasConnectionHandleString","type","resolvedType","isValidNodeConnectionType","resolvedIndex","mapCanvasConnectionToLegacyConnection","sourceNode","targetNode","sourceNodeName","sourceType","sourceIndex","targetNodeName","targetType","targetIndex","mapLegacyEndpointsToCanvasConnectionPort","endpointIndex","required","getUniqueNodeName","name","existingNames","i","newName","uuid","useCanvasMapping","workflow","workflowObject","locale","renderTypeByNodeType","acc","renderType","nodeInputsById","nodeTypeDescription","workflowObjectNode","NodeHelpers.getNodeInputs","nodeOutputsById","NodeHelpers.getNodeOutputs","elements","connections","getConnectionType","getConnectionLabel","_","pinData","_b","uiStore","useUIStore","runButtonText","useCanvasOperations","workflowsStore","useWorkflowsStore","historyStore","useHistoryStore","ndvStore","useNDVStore","telemetry","useTelemetry","externalHooks","useExternalHooks","updateNodePosition","trackHistory","trackBulk","oldPosition","newPosition","MoveNodeCommand","renameNode","currentName","RenameNodeCommand","revertRenameNode","previousName","RemoveNodeCommand","trackDeleteNode","revertDeleteNode","STICKY_NODE_TYPE","QUICKSTART_NOTE_NAME","setNodeActive","setNodeActiveByName","createConnection","isConnectionAllowed","mappedConnection","deleteConnection","RemoveConnectionCommand","revertDeleteConnection","NodeCreation","defineAsyncComponent","__vitePreload","n","NodeDetailsView","router","useRouter","route","useRoute","toast","useToast","tagsStore","useTagsStore","sourceControlStore","useSourceControlStore","nodeCreatorStore","useNodeCreatorStore","settingsStore","useSettingsStore","credentialsStore","useCredentialsStore","environmentsStore","useEnvironmentsStore","externalSecretsStore","useExternalSecretsStore","rootStore","useRootStore","collaborationStore","useCollaborationStore","executionsStore","useExecutionsStore","runWorkflow","useRunWorkflow","isLoading","readOnlyNotification","isProductionExecutionPreview","isExecutionPreview","canOpenNDV","hideNodeIssues","workflowId","editableWorkflow","editableWorkflowObject","isDemoRoute","VIEWS","isReadOnlyRoute","isReadOnlyEnvironment","triggerNodes","initialize","loadPromises","EnterpriseEditionFeature","error","initializeEditableWorkflow","addUndoRedoEventBindings","addPostMessageEventBindings","onBeforeUnmount","removePostMessageEventBindings","removeUndoRedoEventBindings","historyBus","onRevertDeleteNode","onRevertDeleteConnection","onRevertRenameNode","onPostMessageReceived","targetWorkflow","tags","tagIds","tag","onRunWorkflow","onUpdateNodePosition","onCreateConnection","onAddNodes","dragAndDrop","currentPosition","nodePosition","isAutoAdd","openDetail","onNodeCreate","lastAddedNode","NodeViewUtils.NODE_SIZE","NodeViewUtils.GRID_SIZE","newNodesOffset","from","to","fromNode","toNode","lastNodeInputs","nodeUi","_options","checkIfEditingIsAllowed","newNodeData","createNodeWithDefaultCredentials","nodeVersion","messageContext","message","json","importWorkflowExact","openExecution","onSwitchSelectedNode","nodeName","onOpenConnectionNodeCreator","connectionType","onToggleNodeCreator","options","_executionId","_workflow","onUpdateNodeValue","parameterData"],"ignoreList":[],"sources":["../../src/components/canvas/elements/nodes/CanvasNodeToolbar.vue","../../src/composables/useNodeConnections.ts","../../src/components/canvas/elements/nodes/render-types/CanvasNodeDefault.vue","../../src/components/canvas/elements/nodes/render-types/CanvasNodeConfiguration.vue","../../src/components/canvas/elements/nodes/render-types/CanvasNodeConfigurable.vue","../../src/components/canvas/elements/nodes/CanvasNodeRenderer.vue","../../src/components/canvas/elements/handles/render-types/CanvasHandleMainInput.vue","../../src/components/canvas/elements/handles/render-types/CanvasHandleMainOutput.vue","../../src/components/canvas/elements/handles/render-types/CanvasHandleNonMain.vue","../../src/components/canvas/elements/handles/HandleRenderer.vue","../../src/components/canvas/elements/nodes/CanvasNode.vue","../../src/components/canvas/elements/edges/CanvasEdgeToolbar.vue","../../src/components/canvas/elements/edges/CanvasEdge.vue","../../src/components/canvas/Canvas.vue","../../src/utils/canvasUtilsV2.ts","../../src/composables/useCanvasMapping.ts","../../src/components/canvas/WorkflowCanvas.vue","../../src/components/canvas/elements/buttons/CanvasExecuteWorkflowButton.vue","../../src/composables/useCanvasOperations.ts","../../src/views/NodeView.v2.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeKey } from '@/constants';\nimport { useI18n } from '@/composables/useI18n';\n\nconst emit = defineEmits(['delete']);\nconst $style = useCssModule();\n\nconst node = inject(CanvasNodeKey);\n\nconst i18n = useI18n();\n\nconst data = computed(() => node?.data.value);\n\n// @TODO\nconst workflowRunning = false;\n\n// @TODO\nconst nodeDisabledTitle = 'Test';\n\n// @TODO\nfunction executeNode() {}\n\n// @TODO\nfunction toggleDisableNode() {}\n\nfunction deleteNode() {\n\temit('delete');\n}\n\n// @TODO\nfunction openContextMenu(_e: MouseEvent, _type: string) {}\n</script>\n\n<template>\n\t<div :class=\"$style.canvasNodeToolbar\">\n\t\t<div :class=\"$style.canvasNodeToolbarItems\">\n\t\t\t<N8nIconButton\n\t\t\t\tv-if=\"data?.renderType !== 'configuration'\"\n\t\t\t\tdata-test-id=\"execute-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\ttext\n\t\t\t\tsize=\"small\"\n\t\t\t\ticon=\"play\"\n\t\t\t\t:disabled=\"workflowRunning\"\n\t\t\t\t:title=\"i18n.baseText('node.testStep')\"\n\t\t\t\t@click=\"executeNode\"\n\t\t\t/>\n\t\t\t<N8nIconButton\n\t\t\t\tdata-test-id=\"disable-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\ttext\n\t\t\t\tsize=\"small\"\n\t\t\t\ticon=\"power-off\"\n\t\t\t\t:title=\"nodeDisabledTitle\"\n\t\t\t\t@click=\"toggleDisableNode\"\n\t\t\t/>\n\t\t\t<N8nIconButton\n\t\t\t\tdata-test-id=\"delete-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\tsize=\"small\"\n\t\t\t\ttext\n\t\t\t\ticon=\"trash\"\n\t\t\t\t:title=\"i18n.baseText('node.delete')\"\n\t\t\t\t@click=\"deleteNode\"\n\t\t\t/>\n\t\t\t<N8nIconButton\n\t\t\t\tdata-test-id=\"overflow-node-button\"\n\t\t\t\ttype=\"tertiary\"\n\t\t\t\tsize=\"small\"\n\t\t\t\ttext\n\t\t\t\ticon=\"ellipsis-h\"\n\t\t\t\t@click=\"(e: MouseEvent) => openContextMenu(e, 'node-button')\"\n\t\t\t/>\n\t\t</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.canvasNodeToolbar {\n\tpadding-bottom: var(--spacing-3xs);\n}\n\n.canvasNodeToolbarItems {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n</style>\n","import type { CanvasElementData } from '@/types';\nimport type { MaybeRef } from 'vue';\nimport { computed, unref } from 'vue';\nimport { NodeConnectionType } from 'n8n-workflow';\n\nexport function useNodeConnections({\n\tinputs,\n\toutputs,\n}: {\n\tinputs: MaybeRef<CanvasElementData['inputs']>;\n\toutputs: MaybeRef<CanvasElementData['outputs']>;\n}) {\n\t/**\n\t * Inputs\n\t */\n\n\tconst mainInputs = computed(() =>\n\t\tunref(inputs).filter((input) => input.type === NodeConnectionType.Main),\n\t);\n\n\tconst nonMainInputs = computed(() =>\n\t\tunref(inputs).filter((input) => input.type !== NodeConnectionType.Main),\n\t);\n\n\tconst requiredNonMainInputs = computed(() =>\n\t\tnonMainInputs.value.filter((input) => input.required),\n\t);\n\n\t/**\n\t * Outputs\n\t */\n\n\tconst mainOutputs = computed(() =>\n\t\tunref(outputs).filter((output) => output.type === NodeConnectionType.Main),\n\t);\n\tconst nonMainOutputs = computed(() =>\n\t\tunref(outputs).filter((output) => output.type !== NodeConnectionType.Main),\n\t);\n\n\treturn {\n\t\tmainInputs,\n\t\tnonMainInputs,\n\t\trequiredNonMainInputs,\n\t\tmainOutputs,\n\t\tnonMainOutputs,\n\t};\n}\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { useNodeConnections } from '@/composables/useNodeConnections';\nimport { CanvasNodeKey } from '@/constants';\n\nconst node = inject(CanvasNodeKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => node?.label.value ?? '');\nconst inputs = computed(() => node?.data.value.inputs ?? []);\nconst outputs = computed(() => node?.data.value.outputs ?? []);\n\nconst { mainOutputs } = useNodeConnections({\n\tinputs,\n\toutputs,\n});\n\nconst classes = computed(() => {\n\treturn {\n\t\t[$style.node]: true,\n\t\t[$style.selected]: node?.selected.value,\n\t};\n});\n\nconst styles = computed(() => {\n\treturn {\n\t\t'--node-main-output-count': mainOutputs.value.length,\n\t};\n});\n</script>\n\n<template>\n\t<div v-if=\"node\" :class=\"classes\" :style=\"styles\" data-test-id=\"canvas-node-default\">\n\t\t<slot />\n\t\t<div v-if=\"label\" :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.node {\n\theight: calc(100px + max(0, var(--node-main-output-count, 1) - 4) * 50px);\n\twidth: 100px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--canvas-node--background, var(--color-node-background));\n\tborder: 2px solid var(--canvas-node--border-color, var(--color-foreground-xdark));\n\tborder-radius: var(--border-radius-large);\n}\n\n.label {\n\ttop: 100%;\n\tposition: absolute;\n\tfont-size: var(--font-size-m);\n\ttext-align: center;\n\twidth: 100%;\n\tmin-width: 200px;\n\tmargin-top: var(--spacing-2xs);\n}\n\n.selected {\n\tbox-shadow: 0 0 0 4px var(--color-canvas-selected);\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeKey } from '@/constants';\n\nconst node = inject(CanvasNodeKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => node?.label.value ?? '');\n\nconst classes = computed(() => {\n\treturn {\n\t\t[$style.node]: true,\n\t\t[$style.selected]: node?.selected.value,\n\t};\n});\n</script>\n\n<template>\n\t<div :class=\"classes\" data-test-id=\"canvas-node-configuration\">\n\t\t<slot />\n\t\t<div v-if=\"label\" :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.node {\n\twidth: 75px;\n\theight: 75px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--canvas-node--background, var(--node-type-supplemental-background));\n\tborder: 2px solid var(--canvas-node--border-color, var(--color-foreground-dark));\n\tborder-radius: 50%;\n}\n\n.selected {\n\tbox-shadow: 0 0 0 4px var(--color-canvas-selected);\n}\n\n.label {\n\ttop: 100%;\n\tposition: absolute;\n\tfont-size: var(--font-size-m);\n\ttext-align: center;\n\twidth: 100%;\n\tmin-width: 200px;\n\tmargin-top: var(--spacing-2xs);\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeKey, NODE_INSERT_SPACER_BETWEEN_INPUT_GROUPS } from '@/constants';\nimport { useNodeConnections } from '@/composables/useNodeConnections';\n\nconst node = inject(CanvasNodeKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => node?.label.value ?? '');\nconst inputs = computed(() => node?.data.value.inputs ?? []);\nconst outputs = computed(() => node?.data.value.outputs ?? []);\n\nconst { nonMainInputs, requiredNonMainInputs } = useNodeConnections({\n\tinputs,\n\toutputs,\n});\n\nconst classes = computed(() => {\n\treturn {\n\t\t[$style.node]: true,\n\t\t[$style.selected]: node?.selected.value,\n\t};\n});\n\nconst styles = computed(() => {\n\tconst stylesObject: {\n\t\t[key: string]: string | number;\n\t} = {};\n\n\tif (requiredNonMainInputs.value.length > 0) {\n\t\tlet spacerCount = 0;\n\t\tif (NODE_INSERT_SPACER_BETWEEN_INPUT_GROUPS) {\n\t\t\tconst requiredNonMainInputsCount = requiredNonMainInputs.value.length;\n\t\t\tconst optionalNonMainInputsCount = nonMainInputs.value.length - requiredNonMainInputsCount;\n\t\t\tspacerCount = requiredNonMainInputsCount > 0 && optionalNonMainInputsCount > 0 ? 1 : 0;\n\t\t}\n\n\t\tstylesObject['--configurable-node-input-count'] = nonMainInputs.value.length + spacerCount;\n\t}\n\n\treturn stylesObject;\n});\n</script>\n\n<template>\n\t<div :class=\"classes\" :style=\"styles\" data-test-id=\"canvas-node-configurable\">\n\t\t<slot />\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.node {\n\t--configurable-node-min-input-count: 4;\n\t--configurable-node-input-width: 65px;\n\n\twidth: calc(\n\t\tmax(var(--configurable-node-input-count, 5), var(--configurable-node-min-input-count)) *\n\t\t\tvar(--configurable-node-input-width)\n\t);\n\theight: 100px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--canvas-node--background, var(--color-node-background));\n\tborder: 2px solid var(--canvas-node--border-color, var(--color-foreground-xdark));\n\tborder-radius: var(--border-radius-large);\n}\n\n.label {\n\ttop: 100%;\n\tfont-size: var(--font-size-m);\n\ttext-align: center;\n\tmargin-left: var(--spacing-s);\n\tmax-width: calc(\n\t\tvar(--node-width) - var(--configurable-node-icon-offset) - var(--configurable-node-icon-size) -\n\t\t\t2 * var(--spacing-s)\n\t);\n}\n\n.selected {\n\tbox-shadow: 0 0 0 4px var(--color-canvas-selected);\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { h, inject } from 'vue';\nimport CanvasNodeDefault from '@/components/canvas/elements/nodes/render-types/CanvasNodeDefault.vue';\nimport CanvasNodeConfiguration from '@/components/canvas/elements/nodes/render-types/CanvasNodeConfiguration.vue';\nimport CanvasNodeConfigurable from '@/components/canvas/elements/nodes/render-types/CanvasNodeConfigurable.vue';\nimport { CanvasNodeKey } from '@/constants';\n\nconst node = inject(CanvasNodeKey);\n\nconst slots = defineSlots<{\n\tdefault?: () => unknown;\n}>();\n\nconst Render = () => {\n\tlet Component;\n\tswitch (node?.data.value.renderType) {\n\t\tcase 'configurable':\n\t\t\tComponent = CanvasNodeConfigurable;\n\t\t\tbreak;\n\n\t\tcase 'configuration':\n\t\t\tComponent = CanvasNodeConfiguration;\n\t\t\tbreak;\n\n\t\tcase 'trigger':\n\t\t\tComponent = CanvasNodeDefault;\n\t\t\tbreak;\n\n\t\tdefault:\n\t\t\tComponent = CanvasNodeDefault;\n\t}\n\n\treturn h(Component, slots.default);\n};\n</script>\n\n<template>\n\t<Render />\n</template>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst handle = inject(CanvasNodeHandleKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => handle?.label.value ?? '');\n</script>\n<template>\n\t<div :class=\"['canvas-node-handle-main-input', $style.handle]\">\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: 8px;\n\theight: 16px;\n\tborder-radius: 0;\n\tbackground: var(--color-foreground-xdark);\n\n\t&:hover {\n\t\tbackground: var(--color-primary);\n\t}\n}\n\n.label {\n\tposition: absolute;\n\ttop: 50%;\n\tright: 12px;\n\ttransform: translate(0, -50%);\n\tfont-size: var(--font-size-2xs);\n\tcolor: var(--color-foreground-xdark);\n\tbackground: var(--color-background-light);\n\tz-index: 1;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst handle = inject(CanvasNodeHandleKey);\n\n// const group = svg.node('g');\n// const containerBorder = svg.node('rect', {\n// \trx: 3,\n// \t'stroke-width': 2,\n// \tfillOpacity: 0,\n// \theight: ep.params.dimensions - 2,\n// \twidth: ep.params.dimensions - 2,\n// \ty: 1,\n// \tx: 1,\n// });\n// const plusPath = svg.node('path', {\n// \td: 'm16.40655,10.89837l-3.30491,0l0,-3.30491c0,-0.40555 -0.32889,-0.73443 -0.73443,-0.73443l-0.73443,0c-0.40554,0 -0.73442,0.32888 -0.73442,0.73443l0,3.30491l-3.30491,0c-0.40555,0 -0.73443,0.32888 -0.73443,0.73442l0,0.73443c0,0.40554 0.32888,0.73443 0.73443,0.73443l3.30491,0l0,3.30491c0,0.40554 0.32888,0.73442 0.73442,0.73442l0.73443,0c0.40554,0 0.73443,-0.32888 0.73443,-0.73442l0,-3.30491l3.30491,0c0.40554,0 0.73442,-0.32889 0.73442,-0.73443l0,-0.73443c0,-0.40554 -0.32888,-0.73442 -0.73442,-0.73442z',\n// });\n// if (ep.params.size !== 'medium') {\n// \tep.addClass(ep.params.size);\n// }\n// group.appendChild(containerBorder);\n// group.appendChild(plusPath);\n//\n// ep.setupOverlays();\n// ep.setVisible(false);\n// return group;\n\nconst $style = useCssModule();\n\nconst label = computed(() => handle?.label.value ?? '');\n</script>\n<template>\n\t<div :class=\"['canvas-node-handle-main-output', $style.handle]\">\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t\t<div :class=\"$style.circle\" />\n\t\t<!-- @TODO Determine whether handle is connected and find a way to make it work without pointer-events: none -->\n\t\t<!--\t\t<svg :class=\"$style.plus\" viewBox=\"0 0 70 24\">-->\n\t\t<!--\t\t\t<line x1=\"0\" y1=\"12\" x2=\"46\" y2=\"12\" stroke=\"var(&#45;&#45;color-foreground-xdark)\" />-->\n\t\t<!--\t\t\t<rect-->\n\t\t<!--\t\t\t\tx=\"46\"-->\n\t\t<!--\t\t\t\ty=\"2\"-->\n\t\t<!--\t\t\t\twidth=\"20\"-->\n\t\t<!--\t\t\t\theight=\"20\"-->\n\t\t<!--\t\t\t\tstroke=\"var(&#45;&#45;color-foreground-xdark)\"-->\n\t\t<!--\t\t\t\tstroke-width=\"2\"-->\n\t\t<!--\t\t\t\trx=\"4\"-->\n\t\t<!--\t\t\t\tfill=\"#ffffff\"-->\n\t\t<!--\t\t\t/>-->\n\t\t<!--\t\t\t<g transform=\"translate(44, 0)\">-->\n\t\t<!--\t\t\t\t<path-->\n\t\t<!--\t\t\t\t\tfill=\"var(&#45;&#45;color-foreground-xdark)\"-->\n\t\t<!--\t\t\t\t\td=\"m16.40655,10.89837l-3.30491,0l0,-3.30491c0,-0.40555 -0.32889,-0.73443 -0.73443,-0.73443l-0.73443,0c-0.40554,0 -0.73442,0.32888 -0.73442,0.73443l0,3.30491l-3.30491,0c-0.40555,0 -0.73443,0.32888 -0.73443,0.73442l0,0.73443c0,0.40554 0.32888,0.73443 0.73443,0.73443l3.30491,0l0,3.30491c0,0.40554 0.32888,0.73442 0.73442,0.73442l0.73443,0c0.40554,0 0.73443,-0.32888 0.73443,-0.73442l0,-3.30491l3.30491,0c0.40554,0 0.73442,-0.32889 0.73442,-0.73443l0,-0.73443c0,-0.40554 -0.32888,-0.73442 -0.73442,-0.73442z\"-->\n\t\t<!--\t\t\t\t></path>-->\n\t\t<!--\t\t\t</g>-->\n\t\t<!--\t\t</svg>-->\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: 16px;\n\theight: 16px;\n}\n\n.circle {\n\twidth: 16px;\n\theight: 16px;\n\tborder-radius: 100%;\n\tbackground: var(--color-foreground-xdark);\n\n\t&:hover {\n\t\tbackground: var(--color-primary);\n\t}\n}\n\n.plus {\n\tposition: absolute;\n\tleft: 16px;\n\ttop: 50%;\n\ttransform: translate(0, -50%);\n\twidth: 70px;\n\theight: 24px;\n\n\t:global(.vue-flow__handle.connecting) & {\n\t\tdisplay: none;\n\t}\n}\n\n.label {\n\tposition: absolute;\n\ttop: 50%;\n\tleft: 20px;\n\ttransform: translate(0, -50%);\n\tfont-size: var(--font-size-2xs);\n\tcolor: var(--color-foreground-xdark);\n\tbackground: var(--color-background-light);\n\tz-index: 1;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, inject, useCssModule } from 'vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst handle = inject(CanvasNodeHandleKey);\n\nconst $style = useCssModule();\n\nconst label = computed(() => handle?.label.value ?? '');\n</script>\n<template>\n\t<div :class=\"['canvas-node-handle-non-main', $style.handle]\">\n\t\t<div :class=\"$style.diamond\" />\n\t\t<div :class=\"$style.label\">{{ label }}</div>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: 14px;\n\theight: 14px;\n\tborder-radius: 0;\n}\n\n.diamond {\n\twidth: 14px;\n\theight: 14px;\n\ttransform: rotate(45deg);\n\tbackground: hsl(\n\t\tvar(--node-type-supplemental-color-h) var(--node-type-supplemental-color-s)\n\t\t\tvar(--node-type-supplemental-color-l)\n\t);\n\n\t&:hover {\n\t\tbackground: var(--color-primary);\n\t}\n}\n\n.label {\n\tposition: absolute;\n\ttop: 18px;\n\tleft: 50%;\n\ttransform: translate(-50%, 0);\n\tfont-size: var(--font-size-2xs);\n\tcolor: var(--color-foreground-xdark);\n\tbackground: var(--color-background-light);\n\tz-index: 1;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, h, provide, toRef, useCssModule } from 'vue';\nimport type { CanvasConnectionPort, CanvasElementPortWithPosition } from '@/types';\n\nimport { Handle } from '@vue-flow/core';\nimport { NodeConnectionType } from 'n8n-workflow';\nimport CanvasHandleMainInput from '@/components/canvas/elements/handles/render-types/CanvasHandleMainInput.vue';\nimport CanvasHandleMainOutput from '@/components/canvas/elements/handles/render-types/CanvasHandleMainOutput.vue';\nimport CanvasHandleNonMain from '@/components/canvas/elements/handles/render-types/CanvasHandleNonMain.vue';\nimport { CanvasNodeHandleKey } from '@/constants';\n\nconst props = defineProps<{\n\tmode: 'output' | 'input';\n\tlabel?: string;\n\ttype: CanvasConnectionPort['type'];\n\tindex: CanvasConnectionPort['index'];\n\tposition: CanvasElementPortWithPosition['position'];\n\toffset: CanvasElementPortWithPosition['offset'];\n}>();\n\nconst $style = useCssModule();\n\nconst handleType = computed(() => (props.mode === 'input' ? 'target' : 'source'));\n\nconst isConnectableStart = computed(() => {\n\treturn props.mode === 'output';\n});\n\nconst isConnectableEnd = computed(() => {\n\treturn props.mode === 'input';\n});\n\nconst Render = (renderProps: { label?: string }) => {\n\tlet Component;\n\n\tif (props.type === NodeConnectionType.Main) {\n\t\tif (props.mode === 'input') {\n\t\t\tComponent = CanvasHandleMainInput;\n\t\t} else {\n\t\t\tComponent = CanvasHandleMainOutput;\n\t\t}\n\t} else {\n\t\tComponent = CanvasHandleNonMain;\n\t}\n\n\treturn h(Component, renderProps);\n};\n\n/**\n * Provide\n */\n\nconst label = toRef(props, 'label');\n\nprovide(CanvasNodeHandleKey, {\n\tlabel,\n});\n</script>\n\n<template>\n\t<Handle\n\t\t:id=\"`${mode}s/${type}/${index}`\"\n\t\t:class=\"[$style.handle]\"\n\t\t:type=\"handleType\"\n\t\t:position=\"position\"\n\t\t:style=\"offset\"\n\t\t:connectable-start=\"isConnectableStart\"\n\t\t:connectable-end=\"isConnectableEnd\"\n\t>\n\t\t<Render :label=\"label\" />\n\t</Handle>\n</template>\n\n<style lang=\"scss\" module>\n.handle {\n\twidth: auto;\n\theight: auto;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tborder: 0;\n\tbackground: none;\n\n\t> * {\n\t\tpointer-events: none;\n\t}\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { Position } from '@vue-flow/core';\nimport { computed, provide, toRef } from 'vue';\nimport type {\n\tCanvasElementData,\n\tCanvasConnectionPort,\n\tCanvasElementPortWithPosition,\n} from '@/types';\nimport NodeIcon from '@/components/NodeIcon.vue';\nimport { useNodeTypesStore } from '@/stores/nodeTypes.store';\nimport CanvasNodeToolbar from '@/components/canvas/elements/nodes/CanvasNodeToolbar.vue';\nimport CanvasNodeRenderer from '@/components/canvas/elements/nodes/CanvasNodeRenderer.vue';\nimport HandleRenderer from '@/components/canvas/elements/handles/HandleRenderer.vue';\nimport { useNodeConnections } from '@/composables/useNodeConnections';\nimport { CanvasNodeKey } from '@/constants';\nimport type { NodeProps } from '@vue-flow/core';\n\nconst emit = defineEmits<{\n\tdelete: [id: string];\n\tactivate: [id: string];\n}>();\n\nconst props = defineProps<NodeProps<CanvasElementData>>();\n\nconst inputs = computed(() => props.data.inputs);\nconst outputs = computed(() => props.data.outputs);\n\nconst nodeTypesStore = useNodeTypesStore();\n\nconst { mainInputs, nonMainInputs, mainOutputs, nonMainOutputs } = useNodeConnections({\n\tinputs,\n\toutputs,\n});\n\nconst nodeType = computed(() => {\n\treturn nodeTypesStore.getNodeType(props.data.type, props.data.typeVersion);\n});\n\n/**\n * Inputs\n */\n\nconst inputsWithPosition = computed(() => {\n\treturn [\n\t\t...mainInputs.value.map(mapEndpointWithPosition(Position.Left, 'top')),\n\t\t...nonMainInputs.value.map(mapEndpointWithPosition(Position.Bottom, 'left')),\n\t];\n});\n\n/**\n * Outputs\n */\n\nconst outputsWithPosition = computed(() => {\n\treturn [\n\t\t...mainOutputs.value.map(mapEndpointWithPosition(Position.Right, 'top')),\n\t\t...nonMainOutputs.value.map(mapEndpointWithPosition(Position.Top, 'left')),\n\t];\n});\n\n/**\n * Endpoints\n */\n\nconst mapEndpointWithPosition =\n\t(position: Position, offsetAxis: 'top' | 'left') =>\n\t(\n\t\tendpoint: CanvasConnectionPort,\n\t\tindex: number,\n\t\tendpoints: CanvasConnectionPort[],\n\t): CanvasElementPortWithPosition => {\n\t\treturn {\n\t\t\t...endpoint,\n\t\t\tposition,\n\t\t\toffset: {\n\t\t\t\t[offsetAxis]: `${(100 / (endpoints.length + 1)) * (index + 1)}%`,\n\t\t\t},\n\t\t};\n\t};\n\n/**\n * Provide\n */\n\nconst id = toRef(props, 'id');\nconst data = toRef(props, 'data');\nconst label = toRef(props, 'label');\nconst selected = toRef(props, 'selected');\n\nprovide(CanvasNodeKey, {\n\tid,\n\tdata,\n\tlabel,\n\tselected,\n\tnodeType,\n});\n\nfunction onDelete() {\n\temit('delete', props.id);\n}\n\nfunction onActivate() {\n\temit('activate', props.id);\n}\n</script>\n\n<template>\n\t<div :class=\"$style.canvasNode\" data-test-id=\"canvas-node\">\n\t\t<template v-for=\"source in outputsWithPosition\" :key=\"`${source.type}/${source.index}`\">\n\t\t\t<HandleRenderer\n\t\t\t\tmode=\"output\"\n\t\t\t\tdata-test-id=\"canvas-node-output-handle\"\n\t\t\t\t:type=\"source.type\"\n\t\t\t\t:label=\"source.label\"\n\t\t\t\t:index=\"source.index\"\n\t\t\t\t:position=\"source.position\"\n\t\t\t\t:offset=\"source.offset\"\n\t\t\t/>\n\t\t</template>\n\n\t\t<template v-for=\"target in inputsWithPosition\" :key=\"`${target.type}/${target.index}`\">\n\t\t\t<HandleRenderer\n\t\t\t\tmode=\"input\"\n\t\t\t\tdata-test-id=\"canvas-node-input-handle\"\n\t\t\t\t:type=\"target.type\"\n\t\t\t\t:label=\"target.label\"\n\t\t\t\t:index=\"target.index\"\n\t\t\t\t:position=\"target.position\"\n\t\t\t\t:offset=\"target.offset\"\n\t\t\t/>\n\t\t</template>\n\n\t\t<CanvasNodeToolbar\n\t\t\tv-if=\"nodeType\"\n\t\t\tdata-test-id=\"canvas-node-toolbar\"\n\t\t\t:class=\"$style.canvasNodeToolbar\"\n\t\t\t@delete=\"onDelete\"\n\t\t/>\n\n\t\t<CanvasNodeRenderer v-if=\"nodeType\" @dblclick=\"onActivate\">\n\t\t\t<NodeIcon :node-type=\"nodeType\" :size=\"40\" :shrink=\"false\" />\n\t\t\t<!--\t\t\t:color-default=\"iconColorDefault\"-->\n\t\t\t<!--\t\t\t:disabled=\"data.disabled\"-->\n\t\t</CanvasNodeRenderer>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.canvasNode {\n\t&:hover {\n\t\t.canvasNodeToolbar {\n\t\t\tdisplay: flex;\n\t\t\topacity: 1;\n\t\t}\n\t}\n}\n\n.canvasNodeToolbar {\n\tdisplay: none;\n\tposition: absolute;\n\ttop: 0;\n\tleft: 50%;\n\ttransform: translate(-50%, -100%);\n\topacity: 0;\n\ttransition: opacity 0.3s ease;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { useI18n } from '@/composables/useI18n';\nimport { computed, useCssModule } from 'vue';\n\nconst emit = defineEmits<{\n\tdelete: [];\n}>();\n\nconst $style = useCssModule();\n\nconst i18n = useI18n();\n\nconst classes = computed(() => ({\n\t[$style.canvasEdgeToolbar]: true,\n}));\n\nfunction onDelete() {\n\temit('delete');\n}\n</script>\n\n<template>\n\t<div :class=\"classes\" data-test-id=\"canvas-edge-toolbar\">\n\t\t<N8nIconButton\n\t\t\tdata-test-id=\"delete-connection-button\"\n\t\t\ttype=\"tertiary\"\n\t\t\tsize=\"small\"\n\t\t\ticon=\"trash\"\n\t\t\t:title=\"i18n.baseText('node.delete')\"\n\t\t\t@click=\"onDelete\"\n\t\t/>\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.canvasEdgeToolbar {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tpointer-events: all;\n}\n</style>\n","<script lang=\"ts\" setup>\n/* eslint-disable vue/no-multiple-template-root */\nimport type { Connection, EdgeProps } from '@vue-flow/core';\nimport { BaseEdge, EdgeLabelRenderer, getBezierPath } from '@vue-flow/core';\nimport CanvasEdgeToolbar from './CanvasEdgeToolbar.vue';\nimport { computed, useCssModule } from 'vue';\n\nconst emit = defineEmits<{\n\tdelete: [connection: Connection];\n}>();\n\nconst props = defineProps<\n\tEdgeProps & {\n\t\thovered?: boolean;\n\t}\n>();\n\nconst $style = useCssModule();\n\nconst edgeStyle = computed(() => ({\n\tstrokeWidth: 2,\n\t...props.style,\n}));\n\nconst isEdgeToolbarVisible = computed(() => props.selected || props.hovered);\n\nconst edgeToolbarStyle = computed(() => {\n\treturn {\n\t\ttransform: `translate(-50%, -50%) translate(${path.value[1]}px,${path.value[2]}px)`,\n\t};\n});\n\nconst edgeToolbarClasses = computed(() => ({\n\t[$style.edgeToolbar]: true,\n\t[$style.edgeToolbarVisible]: isEdgeToolbarVisible.value,\n\tnodrag: true,\n\tnopan: true,\n}));\n\nconst path = computed(() =>\n\tgetBezierPath({\n\t\tsourceX: props.sourceX,\n\t\tsourceY: props.sourceY,\n\t\tsourcePosition: props.sourcePosition,\n\t\ttargetX: props.targetX,\n\t\ttargetY: props.targetY,\n\t\ttargetPosition: props.targetPosition,\n\t}),\n);\n\nconst connection = computed<Connection>(() => ({\n\tsource: props.source,\n\ttarget: props.target,\n\tsourceHandle: props.sourceHandleId,\n\ttargetHandle: props.targetHandleId,\n}));\n\nfunction onDelete() {\n\temit('delete', connection.value);\n}\n</script>\n\n<template>\n\t<BaseEdge\n\t\t:id=\"id\"\n\t\t:style=\"edgeStyle\"\n\t\t:path=\"path[0]\"\n\t\t:marker-end=\"markerEnd\"\n\t\t:label=\"data?.label\"\n\t\t:label-x=\"path[1]\"\n\t\t:label-y=\"path[2]\"\n\t\t:label-style=\"{ fill: 'white' }\"\n\t\t:label-show-bg=\"true\"\n\t\t:label-bg-style=\"{ fill: 'red' }\"\n\t\t:label-bg-padding=\"[2, 4]\"\n\t\t:label-bg-border-radius=\"2\"\n\t\t:class=\"$style.edge\"\n\t/>\n\t<EdgeLabelRenderer>\n\t\t<CanvasEdgeToolbar :class=\"edgeToolbarClasses\" :style=\"edgeToolbarStyle\" @delete=\"onDelete\" />\n\t</EdgeLabelRenderer>\n</template>\n\n<style lang=\"scss\" module>\n.edgeToolbar {\n\tposition: absolute;\n\topacity: 0;\n\n\t&.edgeToolbarVisible {\n\t\topacity: 1;\n\t}\n\n\t&:hover {\n\t\topacity: 1;\n\t}\n}\n</style>\n","<script lang=\"ts\" setup>\nimport type { CanvasConnection, CanvasElement } from '@/types';\nimport type { EdgeMouseEvent, NodeDragEvent, Connection } from '@vue-flow/core';\nimport { useVueFlow, VueFlow, PanelPosition } from '@vue-flow/core';\nimport { Background } from '@vue-flow/background';\nimport { Controls } from '@vue-flow/controls';\nimport { MiniMap } from '@vue-flow/minimap';\nimport CanvasNode from './elements/nodes/CanvasNode.vue';\nimport CanvasEdge from './elements/edges/CanvasEdge.vue';\nimport { onMounted, onUnmounted, ref, useCssModule } from 'vue';\n\nconst $style = useCssModule();\n\nconst emit = defineEmits<{\n\t'update:modelValue': [elements: CanvasElement[]];\n\t'update:node:position': [id: string, position: { x: number; y: number }];\n\t'update:node:active': [id: string];\n\t'delete:node': [id: string];\n\t'delete:connection': [connection: Connection];\n\t'create:connection': [connection: Connection];\n}>();\n\nconst props = withDefaults(\n\tdefineProps<{\n\t\tid?: string;\n\t\telements: CanvasElement[];\n\t\tconnections: CanvasConnection[];\n\t\tcontrolsPosition?: PanelPosition;\n\t}>(),\n\t{\n\t\tid: 'canvas',\n\t\telements: () => [],\n\t\tconnections: () => [],\n\t\tcontrolsPosition: PanelPosition.BottomLeft,\n\t},\n);\n\nconst { getSelectedEdges, getSelectedNodes } = useVueFlow({ id: props.id });\n\nconst hoveredEdges = ref<Record<string, boolean>>({});\n\nonMounted(() => {\n\tdocument.addEventListener('keydown', onKeyDown);\n});\n\nonUnmounted(() => {\n\tdocument.removeEventListener('keydown', onKeyDown);\n});\n\nfunction onNodeDragStop(e: NodeDragEvent) {\n\te.nodes.forEach((node) => {\n\t\temit('update:node:position', node.id, node.position);\n\t});\n}\n\nfunction onSetNodeActive(id: string) {\n\temit('update:node:active', id);\n}\n\nfunction onDeleteNode(id: string) {\n\temit('delete:node', id);\n}\n\nfunction onDeleteConnection(connection: Connection) {\n\temit('delete:connection', connection);\n}\n\nfunction onConnect(...args: unknown[]) {\n\temit('create:connection', args[0] as Connection);\n}\n\nfunction onKeyDown(e: KeyboardEvent) {\n\tif (e.key === 'Delete') {\n\t\tgetSelectedEdges.value.forEach(onDeleteConnection);\n\t\tgetSelectedNodes.value.forEach(({ id }) => onDeleteNode(id));\n\t}\n}\n\nfunction onMouseEnterEdge(event: EdgeMouseEvent) {\n\thoveredEdges.value[event.edge.id] = true;\n}\n\nfunction onMouseLeaveEdge(event: EdgeMouseEvent) {\n\thoveredEdges.value[event.edge.id] = false;\n}\n</script>\n\n<template>\n\t<VueFlow\n\t\t:id=\"id\"\n\t\t:nodes=\"elements\"\n\t\t:edges=\"connections\"\n\t\t:apply-changes=\"false\"\n\t\tfit-view-on-init\n\t\tpan-on-scroll\n\t\t:min-zoom=\"0.2\"\n\t\t:max-zoom=\"2\"\n\t\tdata-test-id=\"canvas\"\n\t\t@node-drag-stop=\"onNodeDragStop\"\n\t\t@edge-mouse-enter=\"onMouseEnterEdge\"\n\t\t@edge-mouse-leave=\"onMouseLeaveEdge\"\n\t\t@connect=\"onConnect\"\n\t>\n\t\t<template #node-canvas-node=\"canvasNodeProps\">\n\t\t\t<CanvasNode v-bind=\"canvasNodeProps\" @delete=\"onDeleteNode\" @activate=\"onSetNodeActive\" />\n\t\t</template>\n\n\t\t<template #edge-canvas-edge=\"canvasEdgeProps\">\n\t\t\t<CanvasEdge\n\t\t\t\tv-bind=\"canvasEdgeProps\"\n\t\t\t\t:hovered=\"hoveredEdges[canvasEdgeProps.id]\"\n\t\t\t\t@delete=\"onDeleteConnection\"\n\t\t\t/>\n\t\t</template>\n\n\t\t<Background data-test-id=\"canvas-background\" pattern-color=\"#aaa\" :gap=\"16\" />\n\n\t\t<MiniMap data-test-id=\"canvas-minimap\" pannable />\n\n\t\t<Controls\n\t\t\tdata-test-id=\"canvas-controls\"\n\t\t\t:class=\"$style.canvasControls\"\n\t\t\t:position=\"controlsPosition\"\n\t\t></Controls>\n\t</VueFlow>\n</template>\n\n<style lang=\"scss\" module></style>\n\n<style lang=\"scss\">\n.vue-flow__controls {\n\tdisplay: flex;\n\tgap: var(--spacing-2xs);\n\tbox-shadow: none;\n}\n\n.vue-flow__controls-button {\n\twidth: 42px;\n\theight: 42px;\n\tborder: var(--border-base);\n\tborder-radius: var(--border-radius-base);\n\tpadding: 0;\n\ttransition-property: transform, background, border, color;\n\ttransition-duration: 300ms;\n\ttransition-timing-function: ease;\n\n\t&:hover {\n\t\tborder-color: var(--color-button-secondary-hover-active-border);\n\t\tbackground-color: var(--color-button-secondary-active-background);\n\t\ttransform: scale(1.1);\n\n\t\tsvg {\n\t\t\tfill: var(--color-primary);\n\t\t}\n\t}\n\n\tsvg {\n\t\tmax-height: 16px;\n\t\tmax-width: 16px;\n\t\ttransition-property: fill;\n\t\ttransition-duration: 300ms;\n\t\ttransition-timing-function: ease;\n\t}\n}\n</style>\n","import type { IConnection, IConnections, INodeTypeDescription } from 'n8n-workflow';\nimport type { INodeUi } from '@/Interface';\nimport type { CanvasConnection, CanvasConnectionPortType, CanvasConnectionPort } from '@/types';\nimport type { Connection } from '@vue-flow/core';\nimport { v4 as uuid } from 'uuid';\nimport { isValidNodeConnectionType } from '@/utils/typeGuards';\nimport { NodeConnectionType } from 'n8n-workflow';\n\nexport function mapLegacyConnectionsToCanvasConnections(\n\tlegacyConnections: IConnections,\n\tnodes: INodeUi[],\n): CanvasConnection[] {\n\tconst mappedConnections: CanvasConnection[] = [];\n\n\tObject.keys(legacyConnections).forEach((fromNodeName) => {\n\t\tconst fromId = nodes.find((node) => node.name === fromNodeName)?.id;\n\t\tconst fromConnectionTypes = Object.keys(legacyConnections[fromNodeName]);\n\n\t\tfromConnectionTypes.forEach((fromConnectionType) => {\n\t\t\tconst fromPorts = legacyConnections[fromNodeName][fromConnectionType];\n\t\t\tfromPorts.forEach((toPorts, fromIndex) => {\n\t\t\t\ttoPorts.forEach((toPort) => {\n\t\t\t\t\tconst toId = nodes.find((node) => node.name === toPort.node)?.id;\n\t\t\t\t\tconst toConnectionType = toPort.type;\n\t\t\t\t\tconst toIndex = toPort.index;\n\n\t\t\t\t\tif (fromId && toId) {\n\t\t\t\t\t\tmappedConnections.push({\n\t\t\t\t\t\t\tid: `[${fromId}/${fromConnectionType}/${fromIndex}][${toId}/${toConnectionType}/${toIndex}]`,\n\t\t\t\t\t\t\tsource: fromId,\n\t\t\t\t\t\t\ttarget: toId,\n\t\t\t\t\t\t\tsourceHandle: `outputs/${fromConnectionType}/${fromIndex}`,\n\t\t\t\t\t\t\ttargetHandle: `inputs/${toConnectionType}/${toIndex}`,\n\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\tfromNodeName,\n\t\t\t\t\t\t\t\tsource: {\n\t\t\t\t\t\t\t\t\tindex: fromIndex,\n\t\t\t\t\t\t\t\t\ttype: fromConnectionType as CanvasConnectionPortType,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\ttarget: {\n\t\t\t\t\t\t\t\t\tindex: toIndex,\n\t\t\t\t\t\t\t\t\ttype: toConnectionType as CanvasConnectionPortType,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t});\n\n\treturn mappedConnections;\n}\n\nexport function parseCanvasConnectionHandleString(handle: string | null | undefined) {\n\tconst [, type, index] = (handle ?? '').split('/');\n\n\tconst resolvedType = isValidNodeConnectionType(type) ? type : NodeConnectionType.Main;\n\n\tlet resolvedIndex = parseInt(index, 10);\n\tif (isNaN(resolvedIndex)) {\n\t\tresolvedIndex = 0;\n\t}\n\n\treturn {\n\t\ttype: resolvedType,\n\t\tindex: resolvedIndex,\n\t};\n}\n\nexport function mapCanvasConnectionToLegacyConnection(\n\tsourceNode: INodeUi,\n\ttargetNode: INodeUi,\n\tconnection: Connection,\n): [IConnection, IConnection] {\n\t// Output\n\tconst sourceNodeName = sourceNode?.name ?? '';\n\tconst { type: sourceType, index: sourceIndex } = parseCanvasConnectionHandleString(\n\t\tconnection.sourceHandle,\n\t);\n\n\t// Input\n\tconst targetNodeName = targetNode?.name ?? '';\n\tconst { type: targetType, index: targetIndex } = parseCanvasConnectionHandleString(\n\t\tconnection.targetHandle,\n\t);\n\n\treturn [\n\t\t{\n\t\t\tnode: sourceNodeName,\n\t\t\ttype: sourceType,\n\t\t\tindex: sourceIndex,\n\t\t},\n\t\t{\n\t\t\tnode: targetNodeName,\n\t\t\ttype: targetType,\n\t\t\tindex: targetIndex,\n\t\t},\n\t];\n}\n\nexport function mapLegacyEndpointsToCanvasConnectionPort(\n\tendpoints: INodeTypeDescription['inputs'],\n): CanvasConnectionPort[] {\n\tif (typeof endpoints === 'string') {\n\t\tconsole.warn('Node endpoints have not been evaluated', endpoints);\n\t\treturn [];\n\t}\n\n\treturn endpoints.map((endpoint, endpointIndex) => {\n\t\tconst type = typeof endpoint === 'string' ? endpoint : endpoint.type;\n\t\tconst label = typeof endpoint === 'string' ? undefined : endpoint.displayName;\n\t\tconst index =\n\t\t\tendpoints\n\t\t\t\t.slice(0, endpointIndex + 1)\n\t\t\t\t.filter((e) => (typeof e === 'string' ? e : e.type) === type).length - 1;\n\t\tconst required = typeof endpoint === 'string' ? false : endpoint.required;\n\n\t\treturn {\n\t\t\ttype,\n\t\t\tindex,\n\t\t\tlabel,\n\t\t\t...(required ? { required } : {}),\n\t\t};\n\t});\n}\n\nexport function getUniqueNodeName(name: string, existingNames: Set<string>): string {\n\tif (!existingNames.has(name)) {\n\t\treturn name;\n\t}\n\n\tfor (let i = 1; i < 100; i++) {\n\t\tconst newName = `${name} ${i}`;\n\t\tif (!existingNames.has(newName)) {\n\t\t\treturn newName;\n\t\t}\n\t}\n\n\treturn `${name} ${uuid()}`;\n}\n","import { useI18n } from '@/composables/useI18n';\nimport { useNodeTypesStore } from '@/stores/nodeTypes.store';\nimport type { Ref } from 'vue';\nimport { computed } from 'vue';\nimport type {\n\tCanvasConnection,\n\tCanvasConnectionPort,\n\tCanvasElement,\n\tCanvasElementData,\n} from '@/types';\nimport {\n\tmapLegacyConnectionsToCanvasConnections,\n\tmapLegacyEndpointsToCanvasConnectionPort,\n} from '@/utils/canvasUtilsV2';\nimport type { Workflow } from 'n8n-workflow';\nimport { NodeHelpers } from 'n8n-workflow';\nimport type { IWorkflowDb } from '@/Interface';\n\nexport function useCanvasMapping({\n\tworkflow,\n\tworkflowObject,\n}: {\n\tworkflow: Ref<IWorkflowDb>;\n\tworkflowObject: Ref<Workflow>;\n}) {\n\tconst locale = useI18n();\n\tconst nodeTypesStore = useNodeTypesStore();\n\n\tconst renderTypeByNodeType = computed(\n\t\t() =>\n\t\t\tworkflow.value.nodes.reduce<Record<string, CanvasElementData['renderType']>>((acc, node) => {\n\t\t\t\tlet renderType: CanvasElementData['renderType'] = 'default';\n\t\t\t\tswitch (true) {\n\t\t\t\t\tcase nodeTypesStore.isTriggerNode(node.type):\n\t\t\t\t\t\trenderType = 'trigger';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase nodeTypesStore.isConfigNode(workflowObject.value, node, node.type):\n\t\t\t\t\t\trenderType = 'configuration';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase nodeTypesStore.isConfigurableNode(workflowObject.value, node, node.type):\n\t\t\t\t\t\trenderType = 'configurable';\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tacc[node.type] = renderType;\n\t\t\t\treturn acc;\n\t\t\t}, {}) ?? {},\n\t);\n\n\tconst nodeInputsById = computed(() =>\n\t\tworkflow.value.nodes.reduce<Record<string, CanvasConnectionPort[]>>((acc, node) => {\n\t\t\tconst nodeTypeDescription = nodeTypesStore.getNodeType(node.type);\n\t\t\tconst workflowObjectNode = workflowObject.value.getNode(node.name);\n\n\t\t\tacc[node.id] =\n\t\t\t\tworkflowObjectNode && nodeTypeDescription\n\t\t\t\t\t? mapLegacyEndpointsToCanvasConnectionPort(\n\t\t\t\t\t\t\tNodeHelpers.getNodeInputs(\n\t\t\t\t\t\t\t\tworkflowObject.value,\n\t\t\t\t\t\t\t\tworkflowObjectNode,\n\t\t\t\t\t\t\t\tnodeTypeDescription,\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t)\n\t\t\t\t\t: [];\n\n\t\t\treturn acc;\n\t\t}, {}),\n\t);\n\n\tconst nodeOutputsById = computed(() =>\n\t\tworkflow.value.nodes.reduce<Record<string, CanvasConnectionPort[]>>((acc, node) => {\n\t\t\tconst nodeTypeDescription = nodeTypesStore.getNodeType(node.type);\n\t\t\tconst workflowObjectNode = workflowObject.value.getNode(node.name);\n\n\t\t\tacc[node.id] =\n\t\t\t\tworkflowObjectNode && nodeTypeDescription\n\t\t\t\t\t? mapLegacyEndpointsToCanvasConnectionPort(\n\t\t\t\t\t\t\tNodeHelpers.getNodeOutputs(\n\t\t\t\t\t\t\t\tworkflowObject.value,\n\t\t\t\t\t\t\t\tworkflowObjectNode,\n\t\t\t\t\t\t\t\tnodeTypeDescription,\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t)\n\t\t\t\t\t: [];\n\n\t\t\treturn acc;\n\t\t}, {}),\n\t);\n\n\tconst elements = computed<CanvasElement[]>(() => [\n\t\t...workflow.value.nodes.map<CanvasElement>((node) => {\n\t\t\tconst data: CanvasElementData = {\n\t\t\t\tid: node.id,\n\t\t\t\ttype: node.type,\n\t\t\t\ttypeVersion: node.typeVersion,\n\t\t\t\tinputs: nodeInputsById.value[node.id] ?? [],\n\t\t\t\toutputs: nodeOutputsById.value[node.id] ?? [],\n\t\t\t\trenderType: renderTypeByNodeType.value[node.type] ?? 'default',\n\t\t\t};\n\n\t\t\treturn {\n\t\t\t\tid: node.id,\n\t\t\t\tlabel: node.name,\n\t\t\t\ttype: 'canvas-node',\n\t\t\t\tposition: { x: node.position[0], y: node.position[1] },\n\t\t\t\tdata,\n\t\t\t};\n\t\t}),\n\t]);\n\n\tconst connections = computed<CanvasConnection[]>(() => {\n\t\tconst mappedConnections = mapLegacyConnectionsToCanvasConnections(\n\t\t\tworkflow.value.connections ?? [],\n\t\t\tworkflow.value.nodes ?? [],\n\t\t);\n\n\t\treturn mappedConnections.map((connection) => {\n\t\t\tconst type = getConnectionType(connection);\n\t\t\tconst label = getConnectionLabel(connection);\n\n\t\t\treturn {\n\t\t\t\t...connection,\n\t\t\t\ttype,\n\t\t\t\tlabel,\n\t\t\t};\n\t\t});\n\t});\n\n\tfunction getConnectionType(_: CanvasConnection): string {\n\t\treturn 'canvas-edge';\n\t}\n\n\tfunction getConnectionLabel(connection: CanvasConnection): string {\n\t\tconst pinData = workflow.value.pinData?.[connection.data?.fromNodeName ?? ''];\n\n\t\tif (pinData?.length) {\n\t\t\treturn locale.baseText('ndv.output.items', {\n\t\t\t\tadjustToNumber: pinData.length,\n\t\t\t\tinterpolate: { count: String(pinData.length) },\n\t\t\t});\n\t\t}\n\n\t\treturn '';\n\t}\n\n\treturn {\n\t\tconnections,\n\t\telements,\n\t};\n}\n","<script setup lang=\"ts\">\nimport Canvas from '@/components/canvas/Canvas.vue';\nimport { toRef, useCssModule } from 'vue';\nimport type { Workflow } from 'n8n-workflow';\nimport type { IWorkflowDb } from '@/Interface';\nimport { useCanvasMapping } from '@/composables/useCanvasMapping';\n\nconst props = defineProps<{\n\tid?: string;\n\tworkflow: IWorkflowDb;\n\tworkflowObject: Workflow;\n}>();\n\nconst $style = useCssModule();\n\nconst workflow = toRef(props, 'workflow');\nconst workflowObject = toRef(props, 'workflowObject');\n\nconst { elements, connections } = useCanvasMapping({ workflow, workflowObject });\n</script>\n\n<template>\n\t<div :class=\"$style.wrapper\">\n\t\t<div :class=\"$style.canvas\">\n\t\t\t<Canvas v-if=\"workflow\" :elements=\"elements\" :connections=\"connections\" v-bind=\"$attrs\" />\n\t\t</div>\n\t\t<slot />\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.wrapper {\n\tdisplay: block;\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n.canvas {\n\twidth: 100%;\n\theight: 100%;\n\tposition: relative;\n\tdisplay: block;\n}\n\n.executionButtons {\n\tposition: absolute;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tleft: 50%;\n\ttransform: translateX(-50%);\n\tbottom: var(--spacing-l);\n\twidth: auto;\n\n\t@media (max-width: $breakpoint-2xs) {\n\t\tbottom: 150px;\n\t}\n\n\tbutton {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tmargin-left: 0.625rem;\n\n\t\t&:first-child {\n\t\t\tmargin: 0;\n\t\t}\n\t}\n}\n</style>\n","<script setup lang=\"ts\">\nimport KeyboardShortcutTooltip from '@/components/KeyboardShortcutTooltip.vue';\nimport { computed } from 'vue';\nimport { useI18n } from '@/composables/useI18n';\nimport { useUIStore } from '@/stores/ui.store';\n\ndefineEmits(['click']);\n\nconst uiStore = useUIStore();\nconst locale = useI18n();\n\nconst workflowRunning = computed(() => uiStore.isActionActive('workflowRunning'));\n\nconst runButtonText = computed(() => {\n\tif (!workflowRunning.value) {\n\t\treturn locale.baseText('nodeView.runButtonText.executeWorkflow');\n\t}\n\n\treturn locale.baseText('nodeView.runButtonText.executingWorkflow');\n});\n</script>\n\n<template>\n\t<KeyboardShortcutTooltip :label=\"runButtonText\" :shortcut=\"{ metaKey: true, keys: ['↵'] }\">\n\t\t<N8nButton\n\t\t\t:loading=\"workflowRunning\"\n\t\t\t:label=\"runButtonText\"\n\t\t\tsize=\"large\"\n\t\t\ticon=\"flask\"\n\t\t\ttype=\"primary\"\n\t\t\tdata-test-id=\"execute-workflow-button\"\n\t\t\t@click.stop=\"$emit('click', $event)\"\n\t\t/>\n\t</KeyboardShortcutTooltip>\n</template>\n","import type { CanvasElement } from '@/types';\nimport type { INodeUi, XYPosition } from '@/Interface';\nimport { QUICKSTART_NOTE_NAME, STICKY_NODE_TYPE } from '@/constants';\nimport { useWorkflowsStore } from '@/stores/workflows.store';\nimport { useHistoryStore } from '@/stores/history.store';\nimport { useUIStore } from '@/stores/ui.store';\nimport { useTelemetry } from '@/composables/useTelemetry';\nimport { useExternalHooks } from '@/composables/useExternalHooks';\nimport {\n\tMoveNodeCommand,\n\tRemoveConnectionCommand,\n\tRemoveNodeCommand,\n\tRenameNodeCommand,\n} from '@/models/history';\nimport type { Connection } from '@vue-flow/core';\nimport { getUniqueNodeName, mapCanvasConnectionToLegacyConnection } from '@/utils/canvasUtilsV2';\nimport type { IConnection } from 'n8n-workflow';\nimport { useNDVStore } from '@/stores/ndv.store';\n\nexport function useCanvasOperations() {\n\tconst workflowsStore = useWorkflowsStore();\n\tconst historyStore = useHistoryStore();\n\tconst uiStore = useUIStore();\n\tconst ndvStore = useNDVStore();\n\n\tconst telemetry = useTelemetry();\n\tconst externalHooks = useExternalHooks();\n\n\t/**\n\t * Node operations\n\t */\n\n\tfunction updateNodePosition(\n\t\tid: string,\n\t\tposition: CanvasElement['position'],\n\t\t{ trackHistory = false, trackBulk = true } = {},\n\t) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (trackHistory && trackBulk) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tconst oldPosition: XYPosition = [...node.position];\n\t\tconst newPosition: XYPosition = [position.x, position.y];\n\n\t\tworkflowsStore.setNodePositionById(id, newPosition);\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new MoveNodeCommand(node.name, oldPosition, newPosition));\n\n\t\t\tif (trackBulk) {\n\t\t\t\thistoryStore.stopRecordingUndo();\n\t\t\t}\n\t\t}\n\t}\n\n\tasync function renameNode(currentName: string, newName: string, { trackHistory = false } = {}) {\n\t\tif (currentName === newName) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tnewName = getUniqueNodeName(newName, workflowsStore.canvasNames);\n\n\t\t// Rename the node and update the connections\n\t\tconst workflow = workflowsStore.getCurrentWorkflow(true);\n\t\tworkflow.renameNode(currentName, newName);\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new RenameNodeCommand(currentName, newName));\n\t\t}\n\n\t\t// Update also last selected node and execution data\n\t\tworkflowsStore.renameNodeSelectedAndExecution({ old: currentName, new: newName });\n\n\t\tworkflowsStore.setNodes(Object.values(workflow.nodes));\n\t\tworkflowsStore.setConnections(workflow.connectionsBySourceNode);\n\n\t\tconst isRenamingActiveNode = ndvStore.activeNodeName === currentName;\n\t\tif (isRenamingActiveNode) {\n\t\t\tndvStore.activeNodeName = newName;\n\t\t}\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.stopRecordingUndo();\n\t\t}\n\t}\n\n\tasync function revertRenameNode(currentName: string, previousName: string) {\n\t\tawait renameNode(currentName, previousName);\n\t}\n\n\tfunction deleteNode(id: string, { trackHistory = false, trackBulk = true } = {}) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (trackHistory && trackBulk) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tworkflowsStore.removeNodeById(id);\n\t\tworkflowsStore.removeNodeConnectionsById(id);\n\t\tworkflowsStore.removeNodeExecutionDataById(id);\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new RemoveNodeCommand(node));\n\n\t\t\tif (trackBulk) {\n\t\t\t\thistoryStore.stopRecordingUndo();\n\t\t\t}\n\t\t}\n\n\t\ttrackDeleteNode(id);\n\t}\n\n\tfunction revertDeleteNode(node: INodeUi) {\n\t\tworkflowsStore.addNode(node);\n\t}\n\n\tfunction trackDeleteNode(id: string) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (node.type === STICKY_NODE_TYPE) {\n\t\t\ttelemetry.track('User deleted workflow note', {\n\t\t\t\tworkflow_id: workflowsStore.workflowId,\n\t\t\t\tis_welcome_note: node.name === QUICKSTART_NOTE_NAME,\n\t\t\t});\n\t\t} else {\n\t\t\tvoid externalHooks.run('node.deleteNode', { node });\n\t\t\ttelemetry.track('User deleted node', {\n\t\t\t\tnode_type: node.type,\n\t\t\t\tworkflow_id: workflowsStore.workflowId,\n\t\t\t});\n\t\t}\n\t}\n\n\tfunction setNodeActive(id: string) {\n\t\tconst node = workflowsStore.getNodeById(id);\n\t\tif (!node) {\n\t\t\treturn;\n\t\t}\n\n\t\tndvStore.activeNodeName = node.name;\n\t}\n\n\tfunction setNodeActiveByName(name: string) {\n\t\tndvStore.activeNodeName = name;\n\t}\n\n\t/**\n\t * Connection operations\n\t */\n\n\tfunction createConnection(connection: Connection) {\n\t\tconst sourceNode = workflowsStore.getNodeById(connection.source);\n\t\tconst targetNode = workflowsStore.getNodeById(connection.target);\n\t\tif (!sourceNode || !targetNode || !isConnectionAllowed(sourceNode, targetNode)) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst mappedConnection = mapCanvasConnectionToLegacyConnection(\n\t\t\tsourceNode,\n\t\t\ttargetNode,\n\t\t\tconnection,\n\t\t);\n\t\tworkflowsStore.addConnection({\n\t\t\tconnection: mappedConnection,\n\t\t});\n\n\t\tuiStore.stateIsDirty = true;\n\t}\n\n\tfunction deleteConnection(\n\t\tconnection: Connection,\n\t\t{ trackHistory = false, trackBulk = true } = {},\n\t) {\n\t\tconst sourceNode = workflowsStore.getNodeById(connection.source);\n\t\tconst targetNode = workflowsStore.getNodeById(connection.target);\n\t\tif (!sourceNode || !targetNode) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst mappedConnection = mapCanvasConnectionToLegacyConnection(\n\t\t\tsourceNode,\n\t\t\ttargetNode,\n\t\t\tconnection,\n\t\t);\n\n\t\tif (trackHistory && trackBulk) {\n\t\t\thistoryStore.startRecordingUndo();\n\t\t}\n\n\t\tworkflowsStore.removeConnection({\n\t\t\tconnection: mappedConnection,\n\t\t});\n\n\t\tif (trackHistory) {\n\t\t\thistoryStore.pushCommandToUndo(new RemoveConnectionCommand(mappedConnection));\n\n\t\t\tif (trackBulk) {\n\t\t\t\thistoryStore.stopRecordingUndo();\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction revertDeleteConnection(connection: [IConnection, IConnection]) {\n\t\tworkflowsStore.addConnection({\n\t\t\tconnection,\n\t\t});\n\t}\n\n\t// @TODO Figure out a way to improve this\n\tfunction isConnectionAllowed(sourceNode: INodeUi, targetNode: INodeUi): boolean {\n\t\t// const targetNodeType = nodeTypesStore.getNodeType(\n\t\t// \ttargetNode.type,\n\t\t// \ttargetNode.typeVersion,\n\t\t// );\n\t\t//\n\t\t// if (targetNodeType?.inputs?.length) {\n\t\t// \tconst workflow = this.workflowHelpers.getCurrentWorkflow();\n\t\t// \tconst workflowNode = workflow.getNode(targetNode.name);\n\t\t// \tlet inputs: Array<ConnectionTypes | INodeInputConfiguration> = [];\n\t\t// \tif (targetNodeType) {\n\t\t// \t\tinputs = NodeHelpers.getNodeInputs(workflow, workflowNode, targetNodeType);\n\t\t// \t}\n\t\t//\n\t\t// \tfor (const input of inputs || []) {\n\t\t// \t\tif (typeof input === 'string' || input.type !== targetInfoType || !input.filter) {\n\t\t// \t\t\t// No filters defined or wrong connection type\n\t\t// \t\t\tcontinue;\n\t\t// \t\t}\n\t\t//\n\t\t// \t\tif (input.filter.nodes.length) {\n\t\t// \t\t\tif (!input.filter.nodes.includes(sourceNode.type)) {\n\t\t// \t\t\t\tthis.dropPrevented = true;\n\t\t// \t\t\t\tthis.showToast({\n\t\t// \t\t\t\t\ttitle: this.$locale.baseText('nodeView.showError.nodeNodeCompatible.title'),\n\t\t// \t\t\t\t\tmessage: this.$locale.baseText('nodeView.showError.nodeNodeCompatible.message', {\n\t\t// \t\t\t\t\t\tinterpolate: { sourceNodeName: sourceNode.name, targetNodeName: targetNode.name },\n\t\t// \t\t\t\t\t}),\n\t\t// \t\t\t\t\ttype: 'error',\n\t\t// \t\t\t\t\tduration: 5000,\n\t\t// \t\t\t\t});\n\t\t// \t\t\t\treturn false;\n\t\t// \t\t\t}\n\t\t// \t\t}\n\t\t// \t}\n\t\t// }\n\t\treturn sourceNode.id !== targetNode.id;\n\t}\n\n\treturn {\n\t\tupdateNodePosition,\n\t\tsetNodeActive,\n\t\tsetNodeActiveByName,\n\t\trenameNode,\n\t\trevertRenameNode,\n\t\tdeleteNode,\n\t\trevertDeleteNode,\n\t\ttrackDeleteNode,\n\t\tcreateConnection,\n\t\tdeleteConnection,\n\t\trevertDeleteConnection,\n\t\tisConnectionAllowed,\n\t};\n}\n","<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent, onBeforeUnmount, onMounted, ref, useCssModule } from 'vue';\nimport { useRoute, useRouter } from 'vue-router';\nimport WorkflowCanvas from '@/components/canvas/WorkflowCanvas.vue';\nimport { useNodeTypesStore } from '@/stores/nodeTypes.store';\nimport { useUIStore } from '@/stores/ui.store';\nimport CanvasExecuteWorkflowButton from '@/components/canvas/elements/buttons/CanvasExecuteWorkflowButton.vue';\nimport { useI18n } from '@/composables/useI18n';\nimport { useWorkflowsStore } from '@/stores/workflows.store';\nimport { useRunWorkflow } from '@/composables/useRunWorkflow';\nimport type {\n\tAddedNodesAndConnections,\n\tINodeUi,\n\tITag,\n\tIUpdateInformation,\n\tIWorkflowDataUpdate,\n\tToggleNodeCreatorOptions,\n\tXYPosition,\n} from '@/Interface';\nimport { useTagsStore } from '@/stores/tags.store';\nimport type { Connection } from '@vue-flow/core';\nimport type { CanvasElement } from '@/types';\nimport { EnterpriseEditionFeature, VIEWS } from '@/constants';\nimport { useSourceControlStore } from '@/stores/sourceControl.store';\nimport { useNodeCreatorStore } from '@/stores/nodeCreator.store';\nimport { useExternalHooks } from '@/composables/useExternalHooks';\nimport * as NodeViewUtils from '@/utils/nodeViewUtils';\nimport type { ExecutionSummary, IConnection, INodeTypeDescription } from 'n8n-workflow';\nimport { NodeConnectionType } from 'n8n-workflow';\nimport { useToast } from '@/composables/useToast';\nimport { v4 as uuid } from 'uuid';\nimport { useSettingsStore } from '@/stores/settings.store';\nimport { useCredentialsStore } from '@/stores/credentials.store';\nimport useEnvironmentsStore from '@/stores/environments.ee.store';\nimport { useExternalSecretsStore } from '@/stores/externalSecrets.ee.store';\nimport { useRootStore } from '@/stores/root.store';\nimport { useCollaborationStore } from '@/stores/collaboration.store';\nimport { getUniqueNodeName } from '@/utils/canvasUtilsV2';\nimport { historyBus } from '@/models/history';\nimport { useCanvasOperations } from '@/composables/useCanvasOperations';\nimport { useExecutionsStore } from '@/stores/executions.store';\n\nconst NodeCreation = defineAsyncComponent(\n\tasync () => await import('@/components/Node/NodeCreation.vue'),\n);\n\nconst NodeDetailsView = defineAsyncComponent(\n\tasync () => await import('@/components/NodeDetailsView.vue'),\n);\n\nconst $style = useCssModule();\n\nconst router = useRouter();\nconst route = useRoute();\nconst i18n = useI18n();\nconst externalHooks = useExternalHooks();\nconst toast = useToast();\n\nconst nodeTypesStore = useNodeTypesStore();\nconst uiStore = useUIStore();\nconst workflowsStore = useWorkflowsStore();\nconst tagsStore = useTagsStore();\nconst sourceControlStore = useSourceControlStore();\nconst nodeCreatorStore = useNodeCreatorStore();\nconst settingsStore = useSettingsStore();\nconst credentialsStore = useCredentialsStore();\nconst environmentsStore = useEnvironmentsStore();\nconst externalSecretsStore = useExternalSecretsStore();\nconst rootStore = useRootStore();\nconst collaborationStore = useCollaborationStore();\nconst executionsStore = useExecutionsStore();\n\nconst { runWorkflow } = useRunWorkflow({ router });\nconst {\n\tupdateNodePosition,\n\trenameNode,\n\trevertRenameNode,\n\tsetNodeActive,\n\tdeleteNode,\n\trevertDeleteNode,\n\tcreateConnection,\n\tdeleteConnection,\n\trevertDeleteConnection,\n\tsetNodeActiveByName,\n} = useCanvasOperations();\n\nconst isLoading = ref(true);\nconst readOnlyNotification = ref<null | { visible: boolean }>(null);\n\nconst isProductionExecutionPreview = ref(false);\nconst isExecutionPreview = ref(false);\n\nconst canOpenNDV = ref(true);\nconst hideNodeIssues = ref(false);\n\nconst workflowId = computed<string>(() => route.params.workflowId as string);\nconst workflow = computed(() => workflowsStore.workflowsById[workflowId.value]);\n\nconst editableWorkflow = computed(() => workflowsStore.workflow);\nconst editableWorkflowObject = computed(() => workflowsStore.getCurrentWorkflow());\n\nconst isDemoRoute = computed(() => route.name === VIEWS.DEMO);\nconst isReadOnlyRoute = computed(() => route?.meta?.readOnlyCanvas === true);\nconst isReadOnlyEnvironment = computed(() => {\n\treturn sourceControlStore.preferences.branchReadOnly;\n});\n\nconst triggerNodes = computed<INodeUi[]>(() => {\n\treturn workflowsStore.workflowTriggerNodes;\n});\n\nconst isCanvasAddButtonVisible = computed(() => {\n\treturn (\n\t\ttriggerNodes.value.length > 0 &&\n\t\t!isLoading.value &&\n\t\t!isDemoRoute.value &&\n\t\t!isReadOnlyEnvironment.value\n\t);\n});\n\nonMounted(() => {\n\tvoid initialize();\n});\n\nasync function initialize() {\n\tisLoading.value = true;\n\n\tconst loadPromises: Array<Promise<unknown>> = [\n\t\tnodeTypesStore.getNodeTypes(),\n\t\tworkflowsStore.fetchWorkflow(workflowId.value),\n\t];\n\n\tif (!settingsStore.isPreviewMode && !isDemoRoute.value) {\n\t\tloadPromises.push(\n\t\t\tworkflowsStore.fetchActiveWorkflows(),\n\t\t\tcredentialsStore.fetchAllCredentials(),\n\t\t\tcredentialsStore.fetchCredentialTypes(true),\n\t\t);\n\n\t\tif (settingsStore.isEnterpriseFeatureEnabled(EnterpriseEditionFeature.Variables)) {\n\t\t\tloadPromises.push(environmentsStore.fetchAllVariables());\n\t\t}\n\n\t\tif (settingsStore.isEnterpriseFeatureEnabled(EnterpriseEditionFeature.ExternalSecrets)) {\n\t\t\tloadPromises.push(externalSecretsStore.fetchAllSecrets());\n\t\t}\n\t}\n\n\ttry {\n\t\tawait Promise.all(loadPromises);\n\t} catch (error) {\n\t\treturn toast.showError(\n\t\t\terror,\n\t\t\ti18n.baseText('nodeView.showError.mounted1.title'),\n\t\t\ti18n.baseText('nodeView.showError.mounted1.message') + ':',\n\t\t);\n\t}\n\n\tinitializeEditableWorkflow(workflowId.value);\n\n\taddUndoRedoEventBindings();\n\taddPostMessageEventBindings();\n\n\tif (window.parent) {\n\t\twindow.parent.postMessage(\n\t\t\tJSON.stringify({ command: 'n8nReady', version: rootStore.versionCli }),\n\t\t\t'*',\n\t\t);\n\t}\n\n\tisLoading.value = false;\n}\n\nonBeforeUnmount(() => {\n\tremovePostMessageEventBindings();\n\tremoveUndoRedoEventBindings();\n});\n\nfunction addUndoRedoEventBindings() {\n\t// historyBus.on('nodeMove', onMoveNode);\n\t// historyBus.on('revertAddNode', onRevertAddNode);\n\thistoryBus.on('revertRemoveNode', onRevertDeleteNode);\n\t// historyBus.on('revertAddConnection', onRevertAddConnection);\n\thistoryBus.on('revertRemoveConnection', onRevertDeleteConnection);\n\thistoryBus.on('revertRenameNode', onRevertRenameNode);\n\t// historyBus.on('enableNodeToggle', onRevertEnableToggle);\n}\n\nfunction removeUndoRedoEventBindings() {\n\t// historyBus.off('nodeMove', onMoveNode);\n\t// historyBus.off('revertAddNode', onRevertAddNode);\n\thistoryBus.off('revertRemoveNode', onRevertDeleteNode);\n\t// historyBus.off('revertAddConnection', onRevertAddConnection);\n\thistoryBus.off('revertRemoveConnection', onRevertDeleteConnection);\n\thistoryBus.off('revertRenameNode', onRevertRenameNode);\n\t// historyBus.off('enableNodeToggle', onRevertEnableToggle);\n}\n\nfunction addPostMessageEventBindings() {\n\twindow.addEventListener('message', onPostMessageReceived);\n}\n\nfunction removePostMessageEventBindings() {\n\twindow.removeEventListener('message', onPostMessageReceived);\n}\n\n// @TODO Maybe move this to the store\nfunction initializeEditableWorkflow(id: string) {\n\tconst targetWorkflow = workflowsStore.workflowsById[id];\n\n\tworkflowsStore.addWorkflow(targetWorkflow);\n\tworkflowsStore.setWorkflow(targetWorkflow);\n\tworkflowsStore.setActive(targetWorkflow.active || false);\n\tworkflowsStore.setWorkflowId(targetWorkflow.id);\n\tworkflowsStore.setWorkflowName({ newName: targetWorkflow.name, setStateDirty: false });\n\tworkflowsStore.setWorkflowSettings(targetWorkflow.settings ?? {});\n\tworkflowsStore.setWorkflowPinData(targetWorkflow.pinData ?? {});\n\tworkflowsStore.setWorkflowVersionId(targetWorkflow.versionId);\n\tworkflowsStore.setWorkflowMetadata(targetWorkflow.meta);\n\tif (targetWorkflow.usedCredentials) {\n\t\tworkflowsStore.setUsedCredentials(targetWorkflow.usedCredentials);\n\t}\n\n\tconst tags = (targetWorkflow.tags ?? []) as ITag[];\n\tconst tagIds = tags.map((tag) => tag.id);\n\tworkflowsStore.setWorkflowTagIds(tagIds || []);\n\ttagsStore.upsertTags(tags);\n\n\t// @TODO Figure out a better way to handle this. Maybe show a message on why the state becomes dirty\n\t// if (!this.credentialsUpdated) {\n\t// \tthis.uiStore.stateIsDirty = false;\n\t// }\n\n\tvoid externalHooks.run('workflow.open', {\n\t\tworkflowId: workflow.value.id,\n\t\tworkflowName: workflow.value.name,\n\t});\n\n\t// @TODO Figure out a better way to handle this\n\t// if (selectedExecution?.workflowId !== workflow.id) {\n\t// \tthis.executionsStore.activeExecution = null;\n\t// \tworkflowsStore.currentWorkflowExecutions = [];\n\t// } else {\n\t// \tthis.executionsStore.activeExecution = selectedExecution;\n\t// }\n\n\tcollaborationStore.notifyWorkflowOpened(workflow.value.id);\n}\n\nasync function onRunWorkflow() {\n\tawait runWorkflow({});\n}\n\nfunction onUpdateNodePosition(id: string, position: CanvasElement['position']) {\n\tupdateNodePosition(id, position, { trackHistory: true });\n}\n\nfunction onDeleteNode(id: string) {\n\tdeleteNode(id, { trackHistory: true });\n}\n\nfunction onRevertDeleteNode({ node }: { node: INodeUi }) {\n\trevertDeleteNode(node);\n}\n\nfunction onSetNodeActive(id: string) {\n\tsetNodeActive(id);\n}\n\n/**\n * Map new node connection format to the old one and add it to the store\n *\n * @param connection\n */\n\nfunction onCreateConnection(connection: Connection) {\n\tcreateConnection(connection);\n}\n\nfunction onDeleteConnection(connection: Connection) {\n\tdeleteConnection(connection, { trackHistory: true });\n}\n\nfunction onRevertDeleteConnection({ connection }: { connection: [IConnection, IConnection] }) {\n\trevertDeleteConnection(connection);\n}\n\nasync function onAddNodes(\n\t{ nodes, connections }: AddedNodesAndConnections,\n\tdragAndDrop = false,\n\tposition?: XYPosition,\n) {\n\tlet currentPosition = position;\n\tfor (const { type, name, position: nodePosition, isAutoAdd, openDetail } of nodes) {\n\t\ttry {\n\t\t\tawait onNodeCreate(\n\t\t\t\t{\n\t\t\t\t\tname,\n\t\t\t\t\ttype,\n\t\t\t\t\tposition: nodePosition ?? currentPosition,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tdragAndDrop,\n\t\t\t\t\topenNDV: openDetail ?? false,\n\t\t\t\t\ttrackHistory: true,\n\t\t\t\t\tisAutoAdd,\n\t\t\t\t},\n\t\t\t);\n\t\t} catch (error) {\n\t\t\ttoast.showError(error, i18n.baseText('error'));\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst lastAddedNode = editableWorkflow.value.nodes[editableWorkflow.value.nodes.length - 1];\n\t\tcurrentPosition = [\n\t\t\tlastAddedNode.position[0] + NodeViewUtils.NODE_SIZE * 2 + NodeViewUtils.GRID_SIZE,\n\t\t\tlastAddedNode.position[1],\n\t\t];\n\t}\n\n\tconst newNodesOffset = editableWorkflow.value.nodes.length - nodes.length;\n\tfor (const { from, to } of connections) {\n\t\tconst fromNode = editableWorkflow.value.nodes[newNodesOffset + from.nodeIndex];\n\t\tconst toNode = editableWorkflow.value.nodes[newNodesOffset + to.nodeIndex];\n\n\t\tonCreateConnection({\n\t\t\tsource: fromNode.id,\n\t\t\tsourceHandle: `outputs/${NodeConnectionType.Main}/${from.outputIndex ?? 0}`,\n\t\t\ttarget: toNode.id,\n\t\t\ttargetHandle: `inputs/${NodeConnectionType.Main}/${to.inputIndex ?? 0}`,\n\t\t});\n\t}\n\n\tconst lastAddedNode = editableWorkflow.value.nodes[editableWorkflow.value.nodes.length - 1];\n\tconst lastNodeInputs = editableWorkflowObject.value.getParentNodesByDepth(lastAddedNode.name, 1);\n\n\t// If the last added node has multiple inputs, move them down\n\tif (lastNodeInputs.length > 1) {\n\t\tlastNodeInputs.slice(1).forEach((node, index) => {\n\t\t\tconst nodeUi = workflowsStore.getNodeByName(node.name);\n\t\t\tif (!nodeUi) return;\n\n\t\t\tupdateNodePosition(nodeUi.id, {\n\t\t\t\tx: nodeUi.position[0],\n\t\t\t\ty: nodeUi.position[1] + 100 * (index + 1),\n\t\t\t});\n\t\t});\n\t}\n}\n\ntype AddNodeData = {\n\tname?: string;\n\ttype: string;\n\tposition?: XYPosition;\n};\n\ntype AddNodeOptions = {\n\tdragAndDrop?: boolean;\n\topenNDV?: boolean;\n\ttrackHistory?: boolean;\n\tisAutoAdd?: boolean;\n};\n\nasync function onNodeCreate(node: AddNodeData, _options: AddNodeOptions = {}): Promise<INodeUi> {\n\tif (!checkIfEditingIsAllowed()) {\n\t\tthrow new Error(i18n.baseText('nodeViewV2.showError.editingNotAllowed'));\n\t}\n\n\tconst newNodeData = await createNodeWithDefaultCredentials(node);\n\tif (!newNodeData) {\n\t\tthrow new Error(i18n.baseText('nodeViewV2.showError.failedToCreateNode'));\n\t}\n\n\t/**\n\t * @TODO Check if maximum node type limit reached\n\t */\n\n\tnewNodeData.name = getUniqueNodeName(newNodeData.name, workflowsStore.canvasNames);\n\n\tworkflowsStore.addNode(newNodeData);\n\n\t// @TODO Figure out why this is needed and if we can do better...\n\t// this.matchCredentials(node);\n\n\t// @TODO Connect added node to last selected node\n\t// const lastSelectedNode = uiStore.getLastSelectedNode;\n\t// const lastSelectedNodeOutputIndex = uiStore.lastSelectedNodeOutputIndex;\n\t// const lastSelectedNodeEndpointUuid = uiStore.lastSelectedNodeEndpointUuid;\n\t// const lastSelectedConnection = canvasStore.lastSelectedConnection;\n\t//\n\t// historyStore.startRecordingUndo();\n\t//\n\t// const newNodeData = await injectNode(\n\t// \tnodeTypeName,\n\t// \toptions,\n\t// \tshowDetail,\n\t// \ttrackHistory,\n\t// \tisAutoAdd,\n\t// );\n\t// if (!newNodeData) {\n\t// \treturn;\n\t// }\n\t//\n\t// const outputIndex = lastSelectedNodeOutputIndex || 0;\n\t// const targetEndpoint = lastSelectedNodeEndpointUuid || '';\n\t//\n\t// // Handle connection of scoped_endpoint types\n\t// if (lastSelectedNodeEndpointUuid && !isAutoAdd) {\n\t// \tconst lastSelectedEndpoint = this.instance.getEndpoint(lastSelectedNodeEndpointUuid);\n\t// \tif (\n\t// \t\tlastSelectedEndpoint &&\n\t// \t\tthis.checkNodeConnectionAllowed(\n\t// \t\t\tlastSelectedNode,\n\t// \t\t\tnewNodeData,\n\t// \t\t\tlastSelectedEndpoint.scope as NodeConnectionType,\n\t// \t\t)\n\t// \t) {\n\t// \t\tconst connectionType = lastSelectedEndpoint.scope as ConnectionTypes;\n\t// \t\tconst newNodeElement = this.instance.getManagedElement(newNodeData.id);\n\t// \t\tconst newNodeConnections = this.instance.getEndpoints(newNodeElement);\n\t// \t\tconst viableConnection = newNodeConnections.find((conn) => {\n\t// \t\t\treturn (\n\t// \t\t\t\tconn.scope === connectionType &&\n\t// \t\t\t\tlastSelectedEndpoint.parameters.connection !== conn.parameters.connection\n\t// \t\t\t);\n\t// \t\t});\n\t//\n\t// \t\tthis.instance?.connect({\n\t// \t\t\tuuids: [targetEndpoint, viableConnection?.uuid || ''],\n\t// \t\t\tdetachable: !this.isReadOnlyRoute && !this.readOnlyEnv,\n\t// \t\t});\n\t// \t\tthis.historyStore.stopRecordingUndo();\n\t// \t\treturn;\n\t// \t}\n\t// }\n\t// If a node is last selected then connect between the active and its child ones\n\t// if (lastSelectedNode && !isAutoAdd) {\n\t// \tawait this.$nextTick();\n\t//\n\t// \tif (lastSelectedConnection?.__meta) {\n\t// \t\tthis.__deleteJSPlumbConnection(lastSelectedConnection, trackHistory);\n\t//\n\t// \t\tconst targetNodeName = lastSelectedConnection.__meta.targetNodeName;\n\t// \t\tconst targetOutputIndex = lastSelectedConnection.__meta.targetOutputIndex;\n\t// \t\tthis.connectTwoNodes(\n\t// \t\t\tnewNodeData.name,\n\t// \t\t\t0,\n\t// \t\t\ttargetNodeName,\n\t// \t\t\ttargetOutputIndex,\n\t// \t\t\tNodeConnectionType.Main,\n\t// \t\t);\n\t// \t}\n\t//\n\t// \t// Connect active node to the newly created one\n\t// \tthis.connectTwoNodes(\n\t// \t\tlastSelectedNode.name,\n\t// \t\toutputIndex,\n\t// \t\tnewNodeData.name,\n\t// \t\t0,\n\t// \t\tNodeConnectionType.Main,\n\t// \t);\n\t// }\n\t// this.historyStore.stopRecordingUndo();\n\n\treturn newNodeData;\n}\n\nasync function createNodeWithDefaultCredentials(node: Partial<INodeUi>) {\n\tconst nodeTypeDescription = nodeTypesStore.getNodeType(\n\t\tnode.type as string,\n\t) as INodeTypeDescription;\n\n\tlet nodeVersion = nodeTypeDescription.defaultVersion;\n\tif (typeof nodeVersion === 'undefined') {\n\t\tnodeVersion = Array.isArray(nodeTypeDescription.version)\n\t\t\t? nodeTypeDescription.version.slice(-1)[0]\n\t\t\t: nodeTypeDescription.version;\n\t}\n\n\tconst newNodeData: INodeUi = {\n\t\tid: uuid(),\n\t\tname: node.name ?? (nodeTypeDescription.defaults.name as string),\n\t\ttype: nodeTypeDescription.name,\n\t\ttypeVersion: nodeVersion,\n\t\tposition: node.position ?? [0, 0],\n\t\tparameters: {},\n\t};\n\n\t/**\n\t * @TODO Implement this\n\t */\n\n\t// // Load the default parameter values because only values which differ\n\t// // from the defaults get saved\n\t// if (nodeType !== null) {\n\t// \tlet nodeParameters = null;\n\t// \ttry {\n\t// \t\tnodeParameters = NodeHelpers.getNodeParameters(\n\t// \t\t\tnodeType.properties,\n\t// \t\t\tnode.parameters,\n\t// \t\t\ttrue,\n\t// \t\t\tfalse,\n\t// \t\t\tnode,\n\t// \t\t);\n\t// \t} catch (e) {\n\t// \t\tconsole.error(\n\t// \t\t\ti18n.baseText('nodeView.thereWasAProblemLoadingTheNodeParametersOfNode') +\n\t// \t\t\t`: \"${node.name}\"`,\n\t// \t\t);\n\t// \t\tconsole.error(e);\n\t// \t}\n\t// \tnode.parameters = nodeParameters !== null ? nodeParameters : {};\n\t//\n\t// \t// if it's a webhook and the path is empty set the UUID as the default path\n\t// \tif (\n\t// \t\t[WEBHOOK_NODE_TYPE, FORM_TRIGGER_NODE_TYPE].includes(node.type) &&\n\t// \t\tnode.parameters.path === ''\n\t// \t) {\n\t// \t\tnode.parameters.path = node.webhookId as string;\n\t// \t}\n\t// }\n\t// const credentialPerType = nodeTypeData.credentials\n\t// \t?.map((type) => credentialsStore.getUsableCredentialByType(type.name))\n\t// \t.flat();\n\t//\n\t// if (credentialPerType && credentialPerType.length === 1) {\n\t// \tconst defaultCredential = credentialPerType[0];\n\t//\n\t// \tconst selectedCredentials = credentialsStore.getCredentialById(defaultCredential.id);\n\t// \tconst selected = { id: selectedCredentials.id, name: selectedCredentials.name };\n\t// \tconst credentials = {\n\t// \t\t[defaultCredential.type]: selected,\n\t// \t};\n\t//\n\t// \tawait loadNodesProperties(\n\t// \t\t[newNodeData].map((node) => ({ name: node.type, version: node.typeVersion })),\n\t// \t);\n\t//\n\t// \tconst nodeType = nodeTypesStore.getNodeType(newNodeData.type, newNodeData.typeVersion);\n\t// \tconst nodeParameters = NodeHelpers.getNodeParameters(\n\t// \t\tnodeType?.properties ?? [],\n\t// \t\t{},\n\t// \t\ttrue,\n\t// \t\tfalse,\n\t// \t\tnewNodeData,\n\t// \t);\n\t//\n\t// \tif (nodeTypeData.credentials) {\n\t// \t\tconst authentication = nodeTypeData.credentials.find(\n\t// \t\t\t(type) => type.name === defaultCredential.type,\n\t// \t\t);\n\t// \t\tif (authentication?.displayOptions?.hide) {\n\t// \t\t\treturn newNodeData;\n\t// \t\t}\n\t//\n\t// \t\tconst authDisplayOptions = authentication?.displayOptions?.show;\n\t// \t\tif (!authDisplayOptions) {\n\t// \t\t\tnewNodeData.credentials = credentials;\n\t// \t\t\treturn newNodeData;\n\t// \t\t}\n\t//\n\t// \t\tif (Object.keys(authDisplayOptions).length === 1 && authDisplayOptions.authentication) {\n\t// \t\t\t// ignore complex case when there's multiple dependencies\n\t// \t\t\tnewNodeData.credentials = credentials;\n\t//\n\t// \t\t\tlet parameters: { [key: string]: string } = {};\n\t// \t\t\tfor (const displayOption of Object.keys(authDisplayOptions)) {\n\t// \t\t\t\tif (nodeParameters && !nodeParameters[displayOption]) {\n\t// \t\t\t\t\tparameters = {};\n\t// \t\t\t\t\tnewNodeData.credentials = undefined;\n\t// \t\t\t\t\tbreak;\n\t// \t\t\t\t}\n\t// \t\t\t\tconst optionValue = authDisplayOptions[displayOption]?.[0];\n\t// \t\t\t\tif (optionValue && typeof optionValue === 'string') {\n\t// \t\t\t\t\tparameters[displayOption] = optionValue;\n\t// \t\t\t\t}\n\t// \t\t\t\tnewNodeData.parameters = {\n\t// \t\t\t\t\t...newNodeData.parameters,\n\t// \t\t\t\t\t...parameters,\n\t// \t\t\t\t};\n\t// \t\t\t}\n\t// \t\t}\n\t// \t}\n\t// }\n\n\treturn newNodeData;\n}\n\n/**\n * @TODO Implement if needed\n */\n// async loadNodesProperties(nodeInfos: INodeTypeNameVersion[]): Promise<void> {\n// \tconst allNodes: INodeTypeDescription[] = this.nodeTypesStore.allNodeTypes;\n//\n// const nodesToBeFetched: INodeTypeNameVersion[] = [];\n// allNodes.forEach((node) => {\n// \tconst nodeVersions = Array.isArray(node.version) ? node.version : [node.version];\n// \tif (\n// \t\t!!nodeInfos.find((n) => n.name === node.name && nodeVersions.includes(n.version)) &&\n// \t\t!node.hasOwnProperty('properties')\n// \t) {\n// \t\tnodesToBeFetched.push({\n// \t\t\tname: node.name,\n// \t\t\tversion: Array.isArray(node.version) ? node.version.slice(-1)[0] : node.version,\n// \t\t});\n// \t}\n// });\n//\n// if (nodesToBeFetched.length > 0) {\n// \t// Only call API if node information is actually missing\n// \tthis.canvasStore.startLoading();\n// \tawait this.nodeTypesStore.getNodesInformation(nodesToBeFetched);\n// \tthis.canvasStore.stopLoading();\n// }\n// }\n\n/**\n * @TODO Probably not needed and can be merged into addNode\n */\nasync function injectNode(\n\t_nodeTypeName: string,\n\t_options: AddNodeOptions = {},\n\t_showDetail = true,\n\t_trackHistory = false,\n\t_isAutoAdd = false,\n) {\n\t// const nodeTypeData: INodeTypeDescription | null =\n\t// \tthis.nodeTypesStore.getNodeType(nodeTypeName);\n\t//\n\t// if (nodeTypeData === null) {\n\t// \tthis.showMessage({\n\t// \t\ttitle: i18n.baseText('nodeView.showMessage.addNodeButton.title'),\n\t// \t\tmessage: i18n.baseText('nodeView.showMessage.addNodeButton.message', {\n\t// \t\t\tinterpolate: { nodeTypeName },\n\t// \t\t}),\n\t// \t\ttype: 'error',\n\t// \t});\n\t// \treturn;\n\t// }\n\t//\n\t// if (\n\t// \tnodeTypeData.maxNodes !== undefined &&\n\t// \tthis.workflowHelpers.getNodeTypeCount(nodeTypeName) >= nodeTypeData.maxNodes\n\t// ) {\n\t// \tthis.showMaxNodeTypeError(nodeTypeData);\n\t// \treturn;\n\t// }\n\t//\n\t// const newNodeData = await this.getNewNodeWithDefaultCredential(nodeTypeData, {\n\t// \tname: options.name,\n\t// });\n\t//\n\t// // when pulling new connection from node or injecting into a connection\n\t// const lastSelectedNode = this.lastSelectedNode;\n\t//\n\t// if (options.position) {\n\t// \tnewNodeData.position = NodeViewUtils.getNewNodePosition(\n\t// \t\tthis.canvasStore.getNodesWithPlaceholderNode(),\n\t// \t\toptions.position,\n\t// \t);\n\t// } else if (lastSelectedNode) {\n\t// \tconst lastSelectedConnection = this.canvasStore.lastSelectedConnection;\n\t// \tif (lastSelectedConnection) {\n\t// \t\t// set when injecting into a connection\n\t// \t\tconst [diffX] = NodeViewUtils.getConnectorLengths(lastSelectedConnection);\n\t// \t\tif (diffX <= NodeViewUtils.MAX_X_TO_PUSH_DOWNSTREAM_NODES) {\n\t// \t\t\tthis.pushDownstreamNodes(\n\t// \t\t\t\tlastSelectedNode.name,\n\t// \t\t\t\tNodeViewUtils.PUSH_NODES_OFFSET,\n\t// \t\t\t\ttrackHistory,\n\t// \t\t\t);\n\t// \t\t}\n\t// \t}\n\t//\n\t// \t// set when pulling connections\n\t// \tif (this.canvasStore.newNodeInsertPosition) {\n\t// \t\tnewNodeData.position = NodeViewUtils.getNewNodePosition(this.nodes, [\n\t// \t\t\tthis.canvasStore.newNodeInsertPosition[0] + NodeViewUtils.GRID_SIZE,\n\t// \t\t\tthis.canvasStore.newNodeInsertPosition[1] - NodeViewUtils.NODE_SIZE / 2,\n\t// \t\t]);\n\t// \t\tthis.canvasStore.newNodeInsertPosition = null;\n\t// \t} else {\n\t// \t\tlet yOffset = 0;\n\t// \t\tconst workflow = this.workflowHelpers.getCurrentWorkflow();\n\t//\n\t// \t\tif (lastSelectedConnection) {\n\t// \t\t\tconst sourceNodeType = this.nodeTypesStore.getNodeType(\n\t// \t\t\t\tlastSelectedNode.type,\n\t// \t\t\t\tlastSelectedNode.typeVersion,\n\t// \t\t\t);\n\t//\n\t// \t\t\tif (sourceNodeType) {\n\t// \t\t\t\tconst offsets = [\n\t// \t\t\t\t\t[-100, 100],\n\t// \t\t\t\t\t[-140, 0, 140],\n\t// \t\t\t\t\t[-240, -100, 100, 240],\n\t// \t\t\t\t];\n\t//\n\t// \t\t\t\tconst sourceNodeOutputs = NodeHelpers.getNodeOutputs(\n\t// \t\t\t\t\tworkflow,\n\t// \t\t\t\t\tlastSelectedNode,\n\t// \t\t\t\t\tsourceNodeType,\n\t// \t\t\t\t);\n\t// \t\t\t\tconst sourceNodeOutputTypes = NodeHelpers.getConnectionTypes(sourceNodeOutputs);\n\t//\n\t// \t\t\t\tconst sourceNodeOutputMainOutputs = sourceNodeOutputTypes.filter(\n\t// \t\t\t\t\t(output) => output === NodeConnectionType.Main,\n\t// \t\t\t\t);\n\t//\n\t// \t\t\t\tif (sourceNodeOutputMainOutputs.length > 1) {\n\t// \t\t\t\t\tconst offset = offsets[sourceNodeOutputMainOutputs.length - 2];\n\t// \t\t\t\t\tconst sourceOutputIndex = lastSelectedConnection.__meta\n\t// \t\t\t\t\t\t? lastSelectedConnection.__meta.sourceOutputIndex\n\t// \t\t\t\t\t\t: 0;\n\t// \t\t\t\t\tyOffset = offset[sourceOutputIndex];\n\t// \t\t\t\t}\n\t// \t\t\t}\n\t// \t\t}\n\t//\n\t// \t\tlet outputs: Array<ConnectionTypes | INodeOutputConfiguration> = [];\n\t// \t\ttry {\n\t// \t\t\t// It fails when the outputs are an expression. As those nodes have\n\t// \t\t\t// normally no outputs by default and the only reason we need the\n\t// \t\t\t// outputs here is to calculate the position, it is fine to assume\n\t// \t\t\t// that they have no outputs and are so treated as a regular node\n\t// \t\t\t// with only \"main\" outputs.\n\t// \t\t\toutputs = NodeHelpers.getNodeOutputs(workflow, newNodeData, nodeTypeData);\n\t// \t\t} catch (e) {}\n\t// \t\tconst outputTypes = NodeHelpers.getConnectionTypes(outputs);\n\t// \t\tconst lastSelectedNodeType = this.nodeTypesStore.getNodeType(\n\t// \t\t\tlastSelectedNode.type,\n\t// \t\t\tlastSelectedNode.typeVersion,\n\t// \t\t);\n\t//\n\t// \t\t// If node has only scoped outputs, position it below the last selected node\n\t// \t\tif (\n\t// \t\t\toutputTypes.length > 0 &&\n\t// \t\t\toutputTypes.every((outputName) => outputName !== NodeConnectionType.Main)\n\t// \t\t) {\n\t// \t\t\tconst lastSelectedNodeWorkflow = workflow.getNode(lastSelectedNode.name);\n\t// \t\t\tconst lastSelectedInputs = NodeHelpers.getNodeInputs(\n\t// \t\t\t\tworkflow,\n\t// \t\t\t\tlastSelectedNodeWorkflow,\n\t// \t\t\t\tlastSelectedNodeType,\n\t// \t\t\t);\n\t// \t\t\tconst lastSelectedInputTypes = NodeHelpers.getConnectionTypes(lastSelectedInputs);\n\t//\n\t// \t\t\tconst scopedConnectionIndex = (lastSelectedInputTypes || [])\n\t// \t\t\t\t.filter((input) => input !== NodeConnectionType.Main)\n\t// \t\t\t\t.findIndex((inputType) => outputs[0] === inputType);\n\t//\n\t// \t\t\tnewNodeData.position = NodeViewUtils.getNewNodePosition(\n\t// \t\t\t\tthis.nodes,\n\t// \t\t\t\t[\n\t// \t\t\t\t\tlastSelectedNode.position[0] +\n\t// \t\t\t\t\t(NodeViewUtils.NODE_SIZE /\n\t// \t\t\t\t\t\t(Math.max(lastSelectedNodeType?.inputs?.length ?? 1), 1)) *\n\t// \t\t\t\t\tscopedConnectionIndex,\n\t// \t\t\t\t\tlastSelectedNode.position[1] + NodeViewUtils.PUSH_NODES_OFFSET,\n\t// \t\t\t\t],\n\t// \t\t\t\t[100, 0],\n\t// \t\t\t);\n\t// \t\t} else {\n\t// \t\t\t// Has only main outputs or no outputs at all\n\t// \t\t\tconst inputs = NodeHelpers.getNodeInputs(\n\t// \t\t\t\tworkflow,\n\t// \t\t\t\tlastSelectedNode,\n\t// \t\t\t\tlastSelectedNodeType,\n\t// \t\t\t);\n\t// \t\t\tconst inputsTypes = NodeHelpers.getConnectionTypes(inputs);\n\t//\n\t// \t\t\tlet pushOffset = NodeViewUtils.PUSH_NODES_OFFSET;\n\t// \t\t\tif (!!inputsTypes.find((input) => input !== NodeConnectionType.Main)) {\n\t// \t\t\t\t// If the node has scoped inputs, push it down a bit more\n\t// \t\t\t\tpushOffset += 150;\n\t// \t\t\t}\n\t//\n\t// \t\t\t// If a node is active then add the new node directly after the current one\n\t// \t\t\tnewNodeData.position = NodeViewUtils.getNewNodePosition(\n\t// \t\t\t\tthis.nodes,\n\t// \t\t\t\t[lastSelectedNode.position[0] + pushOffset, lastSelectedNode.position[1] + yOffset],\n\t// \t\t\t\t[100, 0],\n\t// \t\t\t);\n\t// \t\t}\n\t// \t}\n\t// } else {\n\t// \t// If added node is a trigger and it's the first one added to the canvas\n\t// \t// we place it at canvasAddButtonPosition to replace the canvas add button\n\t// \tconst position =\n\t// \t\tthis.nodeTypesStore.isTriggerNode(nodeTypeName) && !this.containsTrigger\n\t// \t\t\t? this.canvasStore.canvasAddButtonPosition\n\t// \t\t\t: // If no node is active find a free spot\n\t// \t\t\t(this.lastClickPosition as XYPosition);\n\t//\n\t// \tnewNodeData.position = NodeViewUtils.getNewNodePosition(this.nodes, position);\n\t// }\n\t//\n\t// const localizedName = this.locale.localizeNodeName(newNodeData.name, newNodeData.type);\n\t//\n\t// newNodeData.name = this.uniqueNodeName(localizedName);\n\t//\n\t// if (nodeTypeData.webhooks?.length) {\n\t// \tnewNodeData.webhookId = uuid();\n\t// }\n\t//\n\t// await this.addNodes([newNodeData], undefined, trackHistory);\n\t// this.workflowsStore.setNodePristine(newNodeData.name, true);\n\t//\n\t// this.uiStore.stateIsDirty = true;\n\t//\n\t// if (nodeTypeName === STICKY_NODE_TYPE) {\n\t// \tthis.$telemetry.trackNodesPanel('nodeView.addSticky', {\n\t// \t\tworkflow_id: this.workflowsStore.workflowId,\n\t// \t});\n\t// } else {\n\t// \tvoid this.externalHooks.run('nodeView.addNodeButton', { nodeTypeName });\n\t// \tuseSegment().trackAddedTrigger(nodeTypeName);\n\t// \tconst trackProperties: ITelemetryTrackProperties = {\n\t// \t\tnode_type: nodeTypeName,\n\t// \t\tnode_version: newNodeData.typeVersion,\n\t// \t\tis_auto_add: isAutoAdd,\n\t// \t\tworkflow_id: this.workflowsStore.workflowId,\n\t// \t\tdrag_and_drop: options.dragAndDrop,\n\t// \t};\n\t//\n\t// \tif (lastSelectedNode) {\n\t// \t\ttrackProperties.input_node_type = lastSelectedNode.type;\n\t// \t}\n\t//\n\t// \tthis.$telemetry.trackNodesPanel('nodeView.addNodeButton', trackProperties);\n\t// }\n\t//\n\t// // Automatically deselect all nodes and select the current one and also active\n\t// // current node. But only if it's added manually by the user (not by undo/redo mechanism)\n\t// if (trackHistory) {\n\t// \tthis.deselectAllNodes();\n\t// \tsetTimeout(() => {\n\t// \t\tthis.nodeSelectedByName(\n\t// \t\t\tnewNodeData.name,\n\t// \t\t\tshowDetail && nodeTypeName !== STICKY_NODE_TYPE,\n\t// \t\t);\n\t// \t});\n\t// }\n\t//\n\t// return newNodeData;\n}\n\nfunction checkIfEditingIsAllowed(): boolean {\n\tif (readOnlyNotification.value?.visible) {\n\t\treturn false;\n\t}\n\n\tif (isReadOnlyRoute.value || isReadOnlyEnvironment.value) {\n\t\tconst messageContext = isReadOnlyRoute.value ? 'executions' : 'workflows';\n\t\treadOnlyNotification.value = toast.showMessage({\n\t\t\ttitle: i18n.baseText(\n\t\t\t\tisReadOnlyEnvironment.value\n\t\t\t\t\t? `readOnlyEnv.showMessage.${messageContext}.title`\n\t\t\t\t\t: 'readOnly.showMessage.executions.title',\n\t\t\t),\n\t\t\tmessage: i18n.baseText(\n\t\t\t\tisReadOnlyEnvironment.value\n\t\t\t\t\t? `readOnlyEnv.showMessage.${messageContext}.message`\n\t\t\t\t\t: 'readOnly.showMessage.executions.message',\n\t\t\t),\n\t\t\ttype: 'info',\n\t\t\tdangerouslyUseHTMLString: true,\n\t\t}) as unknown as { visible: boolean };\n\n\t\treturn false;\n\t}\n\n\treturn true;\n}\n\nasync function onPostMessageReceived(message: MessageEvent) {\n\tif (!message || typeof message.data !== 'string' || !message.data?.includes?.('\"command\"')) {\n\t\treturn;\n\t}\n\ttry {\n\t\tconst json = JSON.parse(message.data);\n\t\tif (json && json.command === 'openWorkflow') {\n\t\t\ttry {\n\t\t\t\tawait importWorkflowExact(json.data);\n\t\t\t\tcanOpenNDV.value = json.canOpenNDV ?? true;\n\t\t\t\thideNodeIssues.value = json.hideNodeIssues ?? false;\n\t\t\t\tisExecutionPreview.value = false;\n\t\t\t} catch (e) {\n\t\t\t\tif (window.top) {\n\t\t\t\t\twindow.top.postMessage(\n\t\t\t\t\t\tJSON.stringify({\n\t\t\t\t\t\t\tcommand: 'error',\n\t\t\t\t\t\t\tmessage: i18n.baseText('openWorkflow.workflowImportError'),\n\t\t\t\t\t\t}),\n\t\t\t\t\t\t'*',\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\ttoast.showMessage({\n\t\t\t\t\ttitle: i18n.baseText('openWorkflow.workflowImportError'),\n\t\t\t\t\tmessage: (e as Error).message,\n\t\t\t\t\ttype: 'error',\n\t\t\t\t});\n\t\t\t}\n\t\t} else if (json && json.command === 'openExecution') {\n\t\t\ttry {\n\t\t\t\t// If this NodeView is used in preview mode (in iframe) it will not have access to the main app store\n\t\t\t\t// so everything it needs has to be sent using post messages and passed down to child components\n\t\t\t\tisProductionExecutionPreview.value = json.executionMode !== 'manual';\n\n\t\t\t\tawait openExecution(json.executionId);\n\t\t\t\tcanOpenNDV.value = json.canOpenNDV ?? true;\n\t\t\t\thideNodeIssues.value = json.hideNodeIssues ?? false;\n\t\t\t\tisExecutionPreview.value = true;\n\t\t\t} catch (e) {\n\t\t\t\tif (window.top) {\n\t\t\t\t\twindow.top.postMessage(\n\t\t\t\t\t\tJSON.stringify({\n\t\t\t\t\t\t\tcommand: 'error',\n\t\t\t\t\t\t\tmessage: i18n.baseText('nodeView.showError.openExecution.title'),\n\t\t\t\t\t\t}),\n\t\t\t\t\t\t'*',\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\ttoast.showMessage({\n\t\t\t\t\ttitle: i18n.baseText('nodeView.showError.openExecution.title'),\n\t\t\t\t\tmessage: (e as Error).message,\n\t\t\t\t\ttype: 'error',\n\t\t\t\t});\n\t\t\t}\n\t\t} else if (json?.command === 'setActiveExecution') {\n\t\t\texecutionsStore.activeExecution = (await executionsStore.fetchExecution(\n\t\t\t\tjson.executionId,\n\t\t\t)) as ExecutionSummary;\n\t\t}\n\t} catch (e) {}\n}\n\nasync function onSwitchSelectedNode(nodeName: string) {\n\tsetNodeActiveByName(nodeName);\n}\n\nasync function onOpenConnectionNodeCreator(node: string, connectionType: NodeConnectionType) {\n\tnodeCreatorStore.openSelectiveNodeCreator({ node, connectionType });\n}\n\nfunction onToggleNodeCreator(options: ToggleNodeCreatorOptions) {\n\tnodeCreatorStore.openNodeCreator(options);\n}\n\nasync function openExecution(_executionId: string) {\n\t// @TODO\n}\n\nasync function importWorkflowExact(_workflow: IWorkflowDataUpdate) {\n\t// @TODO\n}\n\nasync function onRevertRenameNode({\n\tcurrentName,\n\tnewName,\n}: {\n\tcurrentName: string;\n\tnewName: string;\n}) {\n\tawait revertRenameNode(currentName, newName);\n}\n\nfunction onUpdateNodeValue(parameterData: IUpdateInformation) {\n\tif (parameterData.name === 'name' && parameterData.oldValue) {\n\t\t// The name changed so we have to take care that\n\t\t// the connections get changed.\n\t\tvoid renameNode(parameterData.oldValue as string, parameterData.value as string);\n\t}\n}\n</script>\n\n<template>\n\t<WorkflowCanvas\n\t\tv-if=\"editableWorkflow && editableWorkflowObject\"\n\t\t:workflow=\"editableWorkflow\"\n\t\t:workflow-object=\"editableWorkflowObject\"\n\t\t@update:node:position=\"onUpdateNodePosition\"\n\t\t@update:node:active=\"onSetNodeActive\"\n\t\t@delete:node=\"onDeleteNode\"\n\t\t@create:connection=\"onCreateConnection\"\n\t\t@delete:connection=\"onDeleteConnection\"\n\t>\n\t\t<div :class=\"$style.executionButtons\">\n\t\t\t<CanvasExecuteWorkflowButton @click=\"onRunWorkflow\" />\n\t\t</div>\n\t\t<Suspense>\n\t\t\t<NodeCreation\n\t\t\t\tv-if=\"!isReadOnlyRoute && !isReadOnlyEnvironment\"\n\t\t\t\t:create-node-active=\"uiStore.isCreateNodeActive\"\n\t\t\t\t:node-view-scale=\"1\"\n\t\t\t\t@toggle-node-creator=\"onToggleNodeCreator\"\n\t\t\t\t@add-nodes=\"onAddNodes\"\n\t\t\t/>\n\t\t</Suspense>\n\t\t<Suspense>\n\t\t\t<NodeDetailsView\n\t\t\t\t:read-only=\"isReadOnlyRoute || isReadOnlyEnvironment\"\n\t\t\t\t:is-production-execution-preview=\"isProductionExecutionPreview\"\n\t\t\t\t:renaming=\"false\"\n\t\t\t\t@value-changed=\"onUpdateNodeValue\"\n\t\t\t\t@switch-selected-node=\"onSwitchSelectedNode\"\n\t\t\t\t@open-connection-node-creator=\"onOpenConnectionNodeCreator\"\n\t\t\t/>\n\t\t\t<!--\n\t\t\t\t:renaming=\"renamingActive\"\n\t\t\t\t@stop-execution=\"stopExecution\"\n\t\t\t\t@save-keyboard-shortcut=\"onSaveKeyboardShortcut\"\n\t\t\t-->\n\t\t</Suspense>\n\t</WorkflowCanvas>\n</template>\n\n<style lang=\"scss\" module>\n.executionButtons {\n\tposition: absolute;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tleft: 50%;\n\ttransform: translateX(-50%);\n\tbottom: var(--spacing-l);\n\twidth: auto;\n\n\t@media (max-width: $breakpoint-2xs) {\n\t\tbottom: 150px;\n\t}\n\n\tbutton {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tmargin-left: 0.625rem;\n\n\t\t&:first-child {\n\t\t\tmargin: 0;\n\t\t}\n\t}\n}\n</style>\n"],"file":"assets/NodeView.v2-D_CKj9CS.js"}