From c1bf5deaf97e2debb1326357a988e69c1050ae6b Mon Sep 17 00:00:00 2001
From: mathuo <6710312+mathuo@users.noreply.github.com>
Date: Wed, 5 Jul 2023 20:23:30 +0100
Subject: [PATCH] remove drop-target overlays when not needed

---
 packages/dockview-core/src/dnd/droptarget.ts | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/packages/dockview-core/src/dnd/droptarget.ts b/packages/dockview-core/src/dnd/droptarget.ts
index 1aafbf425..003f8b045 100644
--- a/packages/dockview-core/src/dnd/droptarget.ts
+++ b/packages/dockview-core/src/dnd/droptarget.ts
@@ -95,6 +95,11 @@ export class Droptarget extends CompositeDisposable {
             new DragAndDropObserver(this.element, {
                 onDragEnter: () => undefined,
                 onDragOver: (e) => {
+                    if (this._acceptedTargetZonesSet.size === 0) {
+                        this.removeDropTarget();
+                        return;
+                    }
+
                     const width = this.element.clientWidth;
                     const height = this.element.clientHeight;
 
@@ -129,9 +134,11 @@ export class Droptarget extends CompositeDisposable {
 
                     if (typeof this.options.canDisplayOverlay === 'boolean') {
                         if (!this.options.canDisplayOverlay) {
+                            this.removeDropTarget();
                             return;
                         }
                     } else if (!this.options.canDisplayOverlay(e, quadrant)) {
+                        this.removeDropTarget();
                         return;
                     }
 
@@ -149,14 +156,6 @@ export class Droptarget extends CompositeDisposable {
                         this.element.append(this.targetElement);
                     }
 
-                    if (this.options.acceptedTargetZones.length === 0) {
-                        return;
-                    }
-
-                    if (!this.targetElement || !this.overlayElement) {
-                        return;
-                    }
-
                     this.toggleClasses(quadrant, width, height);
 
                     this.setState(quadrant);