diff --git a/packages/editor-ui/src/components/mixins/nodeBase.ts b/packages/editor-ui/src/components/mixins/nodeBase.ts index 9effd9e6b7..bbe9810fd1 100644 --- a/packages/editor-ui/src/components/mixins/nodeBase.ts +++ b/packages/editor-ui/src/components/mixins/nodeBase.ts @@ -69,27 +69,38 @@ export const nodeBase = mixins(nodeIndex).extend({ methods: { __addNode (node: INodeUi) { // TODO: Later move the node-connection definitions to a special file + + let nodeTypeData = this.$store.getters.nodeType(node.type); + const nodeConnectors: IConnectionsUi = { main: { input: { uuid: '-input', maxConnections: -1, endpoint: 'Rectangle', - endpointStyle: { width: 10, height: 24, fill: '#777', stroke: '#777', lineWidth: 0 }, + endpointStyle: { + width: nodeTypeData.outputs.length > 2 ? 9 : 10, + height: nodeTypeData.outputs.length > 2 ? 18 : 24, + fill: '#777', + stroke: '#777', + lineWidth: 0, + }, dragAllowedWhenFull: true, }, output: { uuid: '-output', maxConnections: -1, endpoint: 'Dot', - endpointStyle: { radius: 11, fill: '#555', outlineStroke: 'none' }, + endpointStyle: { + radius: nodeTypeData.outputs.length > 2 ? 7 : 11, + fill: '#555', + outlineStroke: 'none', + }, dragAllowedWhenFull: true, }, }, }; - let nodeTypeData = this.$store.getters.nodeType(node.type); - if (!nodeTypeData) { // If node type is not know use by default the base.noOp data to display it nodeTypeData = this.$store.getters.nodeType('n8n-nodes-base.noOp'); @@ -113,6 +124,12 @@ export const nodeBase = mixins(nodeIndex).extend({ [0, 0.5, -1, 0], [0, 0.75, -1, 0], ], + 4: [ + [0, 0.2, -1, 0], + [0, 0.4, -1, 0], + [0, 0.6, -1, 0], + [0, 0.8, -1, 0], + ], }, output: { 1: [ @@ -127,6 +144,12 @@ export const nodeBase = mixins(nodeIndex).extend({ [1, 0.5, 1, 0], [1, 0.75, 1, 0], ], + 4: [ + [1, 0.2, 1, 0], + [1, 0.4, 1, 0], + [1, 0.6, 1, 0], + [1, 0.8, 1, 0], + ], }, };