From 463b5d70ef3296bf2ecd570be94ad2af027d221e Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Mon, 14 Nov 2022 19:31:05 +0100
Subject: [PATCH] refactor(core): add `connecting` class to `SelectionPane`
 while connecting

---
 packages/core/src/container/Viewport/Viewport.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/core/src/container/Viewport/Viewport.vue b/packages/core/src/container/Viewport/Viewport.vue
index 5441731a..8c9dbade 100644
--- a/packages/core/src/container/Viewport/Viewport.vue
+++ b/packages/core/src/container/Viewport/Viewport.vue
@@ -31,6 +31,7 @@ const {
   noPanClassName,
   setState,
   emits,
+  connectionStartHandle,
 } = $(useVueFlow())
 
 const viewportEl = templateRef<HTMLDivElement>('viewport', null)
@@ -39,6 +40,8 @@ let isZoomingOrPanning = $ref(false)
 
 let isDragging = $ref(false)
 
+const isConnecting = $computed(() => !!connectionStartHandle)
+
 const viewChanged = (prevTransform: ViewpaneTransform, eventTransform: ZoomTransform): boolean =>
   (prevTransform.x !== eventTransform.x && !isNaN(eventTransform.x)) ||
   (prevTransform.y !== eventTransform.y && !isNaN(eventTransform.y)) ||
@@ -232,6 +235,6 @@ export default {
     <Transform>
       <slot />
     </Transform>
-    <SelectionPane :class="{ dragging: isDragging, draggable: panOnDrag }" />
+    <SelectionPane :class="{ connecting: isConnecting, dragging: isDragging, draggable: panOnDrag }" />
   </div>
 </template>