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

package/src/components/Nodes/NodeWrapper.vue

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