From 81bd9953c5b518ba7365c6a873bd2bced9d7577d Mon Sep 17 00:00:00 2001
From: mathuo <6710312+mathuo@users.noreply.github.com>
Date: Sat, 21 May 2022 18:46:40 +0100
Subject: [PATCH] feat: improve dnd events

---
 packages/dockview/src/dnd/droptarget.ts             | 2 +-
 packages/dockview/src/dockview/dockviewComponent.ts | 3 ++-
 packages/dockview/src/dockview/options.ts           | 8 +++++++-
 packages/dockview/src/groupview/groupview.ts        | 6 +++++-
 packages/dockview/src/index.ts                      | 1 +
 packages/dockview/src/react/dockview/dockview.tsx   | 4 ++--
 6 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/packages/dockview/src/dnd/droptarget.ts b/packages/dockview/src/dnd/droptarget.ts
index 50e6612fa..0b706c8a8 100644
--- a/packages/dockview/src/dnd/droptarget.ts
+++ b/packages/dockview/src/dnd/droptarget.ts
@@ -11,7 +11,7 @@ export enum Position {
     Center = 'Center',
 }
 
-type Quadrant = 'top' | 'bottom' | 'left' | 'right';
+export type Quadrant = 'top' | 'bottom' | 'left' | 'right';
 
 export interface DroptargetEvent {
     position: Position;
diff --git a/packages/dockview/src/dockview/dockviewComponent.ts b/packages/dockview/src/dockview/dockviewComponent.ts
index 91f5dc6d5..d5f6b5c86 100644
--- a/packages/dockview/src/dockview/dockviewComponent.ts
+++ b/packages/dockview/src/dockview/dockviewComponent.ts
@@ -75,6 +75,7 @@ DockviewComponentOptions,
 
 export interface DockviewDropEvent extends GroupviewDropEvent {
     api: DockviewApi;
+    group: GroupPanel
 }
 
 export interface IDockviewComponent extends IBaseGrid<GroupPanel> {
@@ -678,7 +679,7 @@ export class DockviewComponent
                     this.moveGroupOrPanel(view, groupId, itemId, target, index);
                 }),
                 view.model.onDidDrop((event) => {
-                    this._onDidDrop.fire({ ...event, api: this._api });
+                    this._onDidDrop.fire({ ...event, api: this._api, group: view });
                 }),
                 view.model.onDidGroupChange((event) => {
                     switch (event.kind) {
diff --git a/packages/dockview/src/dockview/options.ts b/packages/dockview/src/dockview/options.ts
index 84bde45db..b53851ad9 100644
--- a/packages/dockview/src/dockview/options.ts
+++ b/packages/dockview/src/dockview/options.ts
@@ -49,6 +49,12 @@ export interface ViewFactoryData {
     tab?: string;
 }
 
+export interface DockviewDndOverlayEvent {
+    nativeEvent: DragEvent;
+    target: DockviewDropTargets;
+    group: GroupPanel;
+}
+
 export interface DockviewComponentOptions extends DockviewRenderFunctions {
     watermarkComponent?: WatermarkConstructor;
     watermarkFrameworkComponent?: any;
@@ -56,7 +62,7 @@ export interface DockviewComponentOptions extends DockviewRenderFunctions {
     tabHeight?: number;
     orientation?: Orientation;
     styles?: ISplitviewStyles;
-    showDndOverlay?: (event: DragEvent, target: DockviewDropTargets) => boolean;
+    showDndOverlay?: (event: DockviewDndOverlayEvent) => boolean;
 }
 
 export interface PanelOptions {
diff --git a/packages/dockview/src/groupview/groupview.ts b/packages/dockview/src/groupview/groupview.ts
index 6e3b1c05d..d685a642c 100644
--- a/packages/dockview/src/groupview/groupview.ts
+++ b/packages/dockview/src/groupview/groupview.ts
@@ -659,7 +659,11 @@ export class Groupview extends CompositeDisposable implements IGroupview {
     canDisplayOverlay(event: DragEvent, target: DockviewDropTargets): boolean {
         // custom overlay handler
         if (this.accessor.options.showDndOverlay) {
-            return this.accessor.options.showDndOverlay(event, target);
+            return this.accessor.options.showDndOverlay({
+                nativeEvent: event,
+                target,
+                group: this.accessor.getPanel(this.id)!,
+            });
         }
         return false;
     }
diff --git a/packages/dockview/src/index.ts b/packages/dockview/src/index.ts
index e3f749427..ce1b14f44 100644
--- a/packages/dockview/src/index.ts
+++ b/packages/dockview/src/index.ts
@@ -8,6 +8,7 @@ export * from './gridview/baseComponentGridview';
 
 export * from './groupview/panel/content';
 export * from './groupview/tab';
+export * from './groupview/dnd';
 export * from './groupview/types';
 export * from './dockview/options';
 
diff --git a/packages/dockview/src/react/dockview/dockview.tsx b/packages/dockview/src/react/dockview/dockview.tsx
index 06fbec100..c5a74ad93 100644
--- a/packages/dockview/src/react/dockview/dockview.tsx
+++ b/packages/dockview/src/react/dockview/dockview.tsx
@@ -7,6 +7,7 @@ import { ReactPanelContentPart } from './reactContentPart';
 import { ReactPanelHeaderPart } from './reactHeaderPart';
 import { ReactPanelDeserialzier } from '../deserializer';
 import {
+    DockviewDndOverlayEvent,
     GroupPanelFrameworkComponentFactory,
     TabContextMenuEvent,
 } from '../../dockview/options';
@@ -17,7 +18,6 @@ import { IWatermarkPanelProps, ReactWatermarkPart } from './reactWatermarkPart';
 import { PanelCollection, PanelParameters } from '../types';
 import { watchElementResize } from '../../dom';
 import { IContentRenderer, ITabRenderer } from '../../groupview/types';
-import { DockviewDropTargets } from '../../groupview/dnd';
 
 export interface IGroupPanelBaseProps<T extends {} = Record<string, any>>
     extends PanelParameters<T> {
@@ -43,7 +43,7 @@ export interface IDockviewReactProps {
     tabHeight?: number;
     onTabContextMenu?: (event: TabContextMenuEvent) => void;
     onDidDrop?: (event: DockviewDropEvent) => void;
-    showDndOverlay?: (event: DragEvent, target: DockviewDropTargets) => boolean;
+    showDndOverlay?: (event: DockviewDndOverlayEvent) => boolean;
     hideBorders?: boolean;
     className?: string;
     disableAutoResizing?: boolean;