update(nodes): Add draggable,selectable and connectable as props to nodes

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>

src/container/NodeRenderer/NodeRenderer.vue

@@ -32,7 +32,6 @@ export default {
       :selectable="typeof node.selectable === 'undefined' ? store.elementsSelectable : node.selectable"
       :connectable="typeof node.connectable === 'undefined' ? store.nodesConnectable : node.connectable"
       :snap-grid="snapGrid(node)"
-      :select-nodes-on-drag="store.selectNodesOnDrag"
     >
       <template #default="nodeProps">
         <slot :name="`node-${node.type}`" v-bind="nodeProps"></slot>

src/types/node.ts

@@ -26,19 +26,24 @@ export interface Node<T = any> extends Element<T> {
 }
 
 export interface GraphNode<T = any> extends Node<T> {
-  handleBounds: {
-    source?: HandleElement[]
-    target?: HandleElement[]
-  }
+  computedPosition: XYZPosition
+  handleBounds: HandleBounds
+  dimensions: Dimensions
   parentNode?: GraphNode<T>
   isParent?: boolean
-  computedPosition: XYZPosition
   selected?: boolean
   dragging?: boolean
-  dimensions: Dimensions
 }
 
 export interface NodeProps<T = any> {
+  id: string
+  dimensions: Dimensions
+  handleBounds: HandleBounds
+  computedPosition: XYZPosition
+  position: XYPosition
+  draggable?: boolean
+  selectable?: boolean
+  connectable?: boolean
   label?:
     | string
     | {
@@ -48,26 +53,15 @@ export interface NodeProps<T = any> {
   class?: string
   style?: CSSProperties
   hidden?: boolean
-  id: string
   type?: string
   data?: T
   selected?: boolean
-  connectable?: boolean
   targetPosition?: Position
   sourcePosition?: Position
   dragging?: boolean
   isValidTargetPos?: ValidConnectionFunc
   isValidSourcePos?: ValidConnectionFunc
-  handleBounds: {
-    source?: HandleElement[]
-    target?: HandleElement[]
-  }
-  parentNode?: GraphNode[]
+  parentNode?: GraphNode<T>[]
   isParent?: boolean
-  computedPosition: XYZPosition
-  position: XYPosition
-  draggable?: boolean
-  selectable?: boolean
-  children?: Node[]
-  dimensions?: Dimensions
+  children?: Node<T>[]
 }

src/utils/graph.ts

@@ -77,6 +77,9 @@ export const parseNode = (node: Node, nodeExtent: CoordinateExtent, defaults?: P
         },
         isParent: !!(node.children && node.children.length),
         dragging: false,
+        draggable: undefined,
+        selectable: undefined,
+        connectable: undefined,
         ...defaults,
       }
     : defaults
@@ -101,6 +104,8 @@ export const parseEdge = (edge: Edge, defaults?: Partial<GraphEdge>): GraphEdge
         sourceY: 0,
         targetX: 0,
         targetY: 0,
+        updatable: undefined,
+        selectable: undefined,
         ...defaults,
       }
     : defaults