feat(core): allow passing a number as connectable prop

Author: bcakmakoglu

packages/core/src/components/Handle/Handle.vue

@@ -4,7 +4,7 @@ import { computed, ref } from 'vue'
 import type { HandleProps } from '../../types/handle'
 import { Position } from '../../types'
 import { useHandle, useNode, useVueFlow } from '../../composables'
-import { getDimensions, isDef, isFunction, isMouseEvent, isString } from '../../utils'
+import { getDimensions, isDef, isFunction, isMouseEvent, isNumber, isString } from '../../utils'
 
 const {
   position = Position.Top,
@@ -59,6 +59,20 @@ const isConnectable = computed(() => {
     })
   }
 
+  if (isNumber(connectable)) {
+    return (
+      connectedEdges.value.filter((edge) => {
+        const id = edge[`${type.value}Handle`]
+
+        if (edge[type.value] !== nodeId) {
+          return false
+        }
+
+        return id ? id === handleId.value : true
+      }).length < connectable
+    )
+  }
+
   if (isFunction(connectable)) {
     return connectable(node, connectedEdges.value)
   }

packages/core/src/types/handle.ts

@@ -46,7 +46,7 @@ export type HandleConnectableFunc = (node: GraphNode, connectedEdges: GraphEdge[
  *
  * if set to single and the handle already has more than one connection, it will act the same as setting it to false
  */
-export type HandleConnectable = boolean | 'single' | HandleConnectableFunc
+export type HandleConnectable = boolean | number | 'single' | HandleConnectableFunc
 
 export interface HandleProps {
   /** Unique id of handle element */