From 86ead92839b1c41ce47817735c6baed3f1a9c7b2 Mon Sep 17 00:00:00 2001
From: Braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Tue, 20 Jul 2021 20:39:42 +0200
Subject: [PATCH] fix: scale being incorrect when passed to draggable causing
 weirdly fast drags chore: upgrade revue-draggable to latest on tag next

---
 package.json                      | 2 +-
 src/components/Nodes/wrapNode.tsx | 8 +++++---
 yarn.lock                         | 8 ++++----
 3 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/package.json b/package.json
index 7a67c3f5..8f8a7b8e 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
     "lint": "yarn lint:js"
   },
   "dependencies": {
-    "@braks/revue-draggable": "^0.2.1-5",
+    "@braks/revue-draggable": "^0.2.1-6",
     "@types/d3": "^7.0.0",
     "d3": "^7.0.0",
     "d3-selection": "^3.0.0",
diff --git a/src/components/Nodes/wrapNode.tsx b/src/components/Nodes/wrapNode.tsx
index a8d02330..50b21248 100644
--- a/src/components/Nodes/wrapNode.tsx
+++ b/src/components/Nodes/wrapNode.tsx
@@ -1,5 +1,5 @@
 import { Node, RevueFlowStore, WrapNodeProps } from '../../types';
-import { computed, CSSProperties, DefineComponent, defineComponent, inject, onMounted, provide, ref, watchEffect } from 'vue';
+import { computed, CSSProperties, DefineComponent, defineComponent, inject, onMounted, onUpdated, provide, ref } from 'vue';
 import { DraggableEventHandler, DraggableCore } from '@braks/revue-draggable';
 
 export default (NodeComponent: DefineComponent<WrapNodeProps>) => {
@@ -134,7 +134,7 @@ export default (NodeComponent: DefineComponent<WrapNodeProps>) => {
         props.onNodeDragStop?.(event as MouseEvent, node.value as Node);
       };
 
-      watchEffect(() => {
+      onUpdated(() => {
         if (nodeElement.value && !props.isHidden) {
           store?.updateNodeDimensions([{ id: props.id || '', nodeElement: nodeElement.value, forceUpdate: true }]);
         }
@@ -162,12 +162,14 @@ export default (NodeComponent: DefineComponent<WrapNodeProps>) => {
         }
       ]);
 
+      const scale = computed(() => store.transform[2] || 1);
+
       return () => (
         <DraggableCore
           start={onDragStart}
           move={onDrag}
           stop={onDragStop}
-          scale={store.transform[2]}
+          scale={scale.value}
           disabled={!props.isDraggable}
           cancel=".nodrag"
           grid={grid.value}
diff --git a/yarn.lock b/yarn.lock
index d8eb1d75..b1333022 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -262,10 +262,10 @@
     "@babel/helper-validator-identifier" "^7.14.5"
     to-fast-properties "^2.0.0"
 
-"@braks/revue-draggable@^0.2.1-5":
-  version "0.2.1-5"
-  resolved "https://registry.yarnpkg.com/@braks/revue-draggable/-/revue-draggable-0.2.1-5.tgz#280f9cb4dfd5c3bc88dff0f8c70ffa8966536328"
-  integrity sha512-+oDuUvTVd5ST6brdtfXYJMnFrmyQat9W7yUKpKBTI0od3ycfaGgMCT9w+OoQ3rlBi2cV6gFXlhZVIeLi+v55aA==
+"@braks/revue-draggable@^0.2.1-6":
+  version "0.2.1-6"
+  resolved "https://registry.yarnpkg.com/@braks/revue-draggable/-/revue-draggable-0.2.1-6.tgz#6a0b5bf837d7c6a5b2380f3a2b6687271121980b"
+  integrity sha512-umY2rLspfkrYfRqDCnV3RvvSiqQPio4Mjdpcp/T+IF/kj0ym7UgA11c017wEQmzUmXwHrgL050bC/LBW5/KJNQ==
   dependencies:
     "@vueuse/core" "^5.1.3"
     vue-demi latest