From ce8cf931708e6567c4958907a85c9de33a586439 Mon Sep 17 00:00:00 2001
From: Jos de Jong <wjosdejong@gmail.com>
Date: Wed, 22 Jul 2020 09:49:54 +0200
Subject: [PATCH] hide before and append selector line when dragging

---
 src/JSONNode.scss   | 10 ++++++++++
 src/JSONNode.svelte |  5 ++---
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/JSONNode.scss b/src/JSONNode.scss
index 2d4845f..dec64e6 100644
--- a/src/JSONNode.scss
+++ b/src/JSONNode.scss
@@ -52,6 +52,16 @@
     }
   }
 
+  // selector must not be visible whilst dragging (mouse down)
+  &:active {
+    .before-node-selector,
+    .append-node-selector {
+      .selector {
+        border: none;
+      }
+    }
+  }
+
   .before-node-selector {
     top: -$selector-height/2 - 1px;
   }
diff --git a/src/JSONNode.svelte b/src/JSONNode.svelte
index 3613d08..45d4f8c 100644
--- a/src/JSONNode.svelte
+++ b/src/JSONNode.svelte
@@ -254,7 +254,8 @@
     }
 
     event.stopPropagation()
-    event.preventDefault()
+    // IMPORTANT: do not use event.preventDefault() here,
+    //  else the :active style doesn't work!
 
     // we attache the mouse up event listener to the global document,
     // so we will not miss if the mouse up is happening outside of the editor
@@ -287,7 +288,6 @@
 
   function handleMouseUp (event) {
     if (singleton.mousedown) {
-      event.preventDefault()
       event.stopPropagation()
 
       singleton.mousedown = false
@@ -297,7 +297,6 @@
   }
 
   function handleSelectBefore (event) {
-    event.preventDefault()
     event.stopPropagation()
 
     onSelect({