From b206ff160fa2e384d037c36a639d72de0e2314c2 Mon Sep 17 00:00:00 2001
From: Braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Wed, 6 Apr 2022 23:25:25 +0200
Subject: [PATCH] fix(nodes,edges): Cast styles to css properties

---
 package/src/components/Edges/EdgeWrapper.vue | 3 ++-
 package/src/components/Nodes/NodeWrapper.vue | 3 ++-
 yarn.lock                                    | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/package/src/components/Edges/EdgeWrapper.vue b/package/src/components/Edges/EdgeWrapper.vue
index 2bef95c0..c571b1cb 100644
--- a/package/src/components/Edges/EdgeWrapper.vue
+++ b/package/src/components/Edges/EdgeWrapper.vue
@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import { CSSProperties } from 'vue'
 import { useHandle, useVueFlow } from '../../composables'
 import { ConnectionMode, EdgeComponent, GraphEdge, Position } from '../../types'
 import { getEdgePositions, getHandle, getMarkerId } from '../../utils'
@@ -161,7 +162,7 @@ const getClass = computed(() => {
   ]
 })
 
-const getStyle = () => (edge.value.style instanceof Function ? edge.value.style(edge.value) : edge.value.style)
+const getStyle = () => (edge.value.style instanceof Function ? edge.value.style(edge.value) : edge.value.style) as CSSProperties
 </script>
 <script lang="ts">
 export default {
diff --git a/package/src/components/Nodes/NodeWrapper.vue b/package/src/components/Nodes/NodeWrapper.vue
index f876acf8..e9c24712 100644
--- a/package/src/components/Nodes/NodeWrapper.vue
+++ b/package/src/components/Nodes/NodeWrapper.vue
@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import { useDraggableCore } from '@braks/revue-draggable'
+import { CSSProperties } from 'vue'
 import { useVueFlow } from '../../composables'
 import { GraphNode, NodeComponent, SnapGrid } from '../../types'
 import { NodeId, Slots } from '../../context'
@@ -183,7 +184,7 @@ const getStyle = computed(() => {
     transform: `translate(${node.value.computedPosition.x}px,${node.value.computedPosition.y}px)`,
     pointerEvents: props.selectable || props.draggable ? 'all' : 'none',
     ...styles,
-  }
+  } as CSSProperties
 })
 </script>
 <script lang="ts">
diff --git a/yarn.lock b/yarn.lock
index f9218530..f8b6c706 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7111,7 +7111,7 @@ vue-tsc@^0.33.9:
   dependencies:
     "@volar/vue-typescript" "0.33.9"
 
-vue@^3.2.21, vue@^3.2.31:
+vue@^3.2.25, vue@^3.2.31:
   version "3.2.31"
   resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.31.tgz#e0c49924335e9f188352816788a4cca10f817ce6"
   integrity sha512-odT3W2tcffTiQCy57nOT93INw1auq5lYLLYtWpPYQQYQOOdHiqFct9Xhna6GJ+pJQaF67yZABraH47oywkJgFw==