chore(nodes,edges): remove v-bind

package/src/components/Edges/EdgeWrapper.vue

@@ -166,34 +166,32 @@ export default {
   >
     <component
       :is="type"
-      v-bind="{
-        id: edge.id,
-        sourceNode: edge.sourceNode,
-        targetNode: edge.targetNode,
-        source: edge.source,
-        target: edge.target,
-        updatable: props.updatable,
-        selected: edge.selected,
-        animated: edge.animated,
-        label: edge.label,
-        labelStyle: edge.labelStyle,
-        labelShowBg: edge.labelShowBg,
-        labelBgStyle: edge.labelBgStyle,
-        labelBgPadding: edge.labelBgPadding,
-        labelBgBorderRadius: edge.labelBgBorderRadius,
-        data: edge.data,
-        style: getStyle(),
-        markerStart: `url(#${getMarkerId(edge.markerStart)})`,
-        markerEnd: `url(#${getMarkerId(edge.markerEnd)})`,
-        sourcePosition,
-        targetPosition,
-        sourceX: edge.sourceX,
-        sourceY: edge.sourceY,
-        targetX: edge.targetX,
-        targetY: edge.targetY,
-        sourceHandleId: edge.sourceHandle,
-        targetHandleId: edge.targetHandle,
-      }"
+      :id="edge.id"
+      :source-node="edge.sourceNode"
+      :target-node="edge.targetNode"
+      :source="edge.source"
+      :target="edge.target"
+      :updatable="props.updatable"
+      :selected="edge.selected"
+      :animated="edge.animated"
+      :label="edge.label"
+      :label-style="edge.labelStyle"
+      :label-show-bg="edge.labelShowBg"
+      :label-bg-style="edge.labelBgStyle"
+      :label-bg-padding="edge.labelBgPadding"
+      :label-bg-border-radius="edge.labelBgBorderRadius"
+      :data="edge.data"
+      :style="getStyle()"
+      :marker-start="`url(#${getMarkerId(edge.markerStart)})`"
+      :marker-end="`url(#${getMarkerId(edge.markerEnd)})`"
+      :source-position="sourcePosition"
+      :target-position="targetPosition"
+      :source-x="edge.sourceX"
+      :source-y="edge.sourceY"
+      :target-x="edge.targetX"
+      :target-y="edge.targetY"
+      :source-handle-id="edge.sourceHandle"
+      :target-handle-id="edge.targetHandle"
     />
     <g
       v-if="props.updatable"

package/src/components/Nodes/NodeWrapper.vue

@@ -191,26 +191,24 @@ export default {
     >
       <component
         :is="type"
-        v-bind="{
-          nodeElement,
-          id: node.id,
-          type: node.type,
-          data: node.data,
-          selected: !!node.selected,
-          connectable: props.connectable,
-          position: node.position,
-          computedPosition: node.computedPosition,
-          dimensions: node.dimensions,
-          isValidTargetPos: node.isValidTargetPos,
-          isValidSourcePos: node.isValidSourcePos,
-          parentNode: node.parentNode,
-          dragging: !!node.dragging,
-          zIndex: node.dragging || node.selected ? 1000 : node.computedPosition.z,
-          targetPosition: node.targetPosition,
-          sourcePosition: node.sourcePosition,
-          label: node.label,
-          dragHandle: node.dragHandle,
-        }"
+        :id="node.id"
+        :node-element="nodeElement"
+        :type="node.type"
+        :data="node.data"
+        :selected="!!node.selected"
+        :connectable="props.connectable"
+        :position="node.position"
+        :computed-position="node.computedPosition"
+        :dimensions="node.dimensions"
+        :is-valid-target-pos="node.isValidTargetPos"
+        :is-valid-source-pos="node.isValidSourcePos"
+        :parent-node="node.parentNode"
+        :dragging="!!node.dragging"
+        :z-index="node.computedPosition.z"
+        :target-position="node.targetPosition"
+        :source-position="node.sourcePosition"
+        :label="node.label"
+        :drag-handle="node.dragHandle"
       />
     </div>
   </DraggableCore>