diff --git a/packages/dockview-core/src/api/component.api.ts b/packages/dockview-core/src/api/component.api.ts index d4a8aae02..02f4292a7 100644 --- a/packages/dockview-core/src/api/component.api.ts +++ b/packages/dockview-core/src/api/component.api.ts @@ -830,6 +830,8 @@ export class DockviewApi implements CommonApi { options?: { position?: Box; popoutUrl?: string; + onOpened?: (id: string, window: Window) => void; + onClosing?: (id: string, window: Window) => void; } ): void { this.component.addPopoutGroup(item, options); diff --git a/packages/dockview-core/src/dockview/dockviewComponent.ts b/packages/dockview-core/src/dockview/dockviewComponent.ts index a46177a95..b28dde011 100644 --- a/packages/dockview-core/src/dockview/dockviewComponent.ts +++ b/packages/dockview-core/src/dockview/dockviewComponent.ts @@ -287,6 +287,8 @@ export interface IDockviewComponent extends IBaseGrid { options?: { position?: Box; popoutUrl?: string; + onOpened?: (id: string, window: Window) => void; + onClosing?: (id: string, window: Window) => void; } ): void; } @@ -514,6 +516,8 @@ export class DockviewComponent skipRemoveGroup?: boolean; position?: Box; popoutUrl?: string; + onOpened?: (id: string, window: Window) => void; + onClosing?: (id: string, window: Window) => void; } ): void { let group: DockviewGroupPanel; @@ -562,6 +566,8 @@ export class DockviewComponent width: box.width, height: box.height, }, + onOpened: options?.onOpened, + onClosing: options?.onClosing } ); diff --git a/packages/dockview-core/src/dockview/dockviewPopoutGroupPanel.ts b/packages/dockview-core/src/dockview/dockviewPopoutGroupPanel.ts index c95fdce1f..371fda793 100644 --- a/packages/dockview-core/src/dockview/dockviewPopoutGroupPanel.ts +++ b/packages/dockview-core/src/dockview/dockviewPopoutGroupPanel.ts @@ -13,6 +13,8 @@ export class DockviewPopoutGroupPanel extends CompositeDisposable { className: string; popoutUrl: string; box: Box; + onOpened?: (id: string, window: Window) => void; + onClosing?: (id: string, window: Window) => void; } ) { super(); @@ -23,6 +25,8 @@ export class DockviewPopoutGroupPanel extends CompositeDisposable { top: this.options.box.top, width: this.options.box.width, height: this.options.box.height, + onOpened: this.options.onOpened, + onClosing: this.options.onClosing, }); group.model.location = { diff --git a/packages/dockview-core/src/popoutWindow.ts b/packages/dockview-core/src/popoutWindow.ts index 672a6d4e5..68dfc6736 100644 --- a/packages/dockview-core/src/popoutWindow.ts +++ b/packages/dockview-core/src/popoutWindow.ts @@ -5,6 +5,8 @@ import { Box } from './types'; export type PopoutWindowOptions = { url: string; + onOpened?: (id: string, window: Window) => void; + onClosing?: (id: string, window: Window) => void; } & Box; export class PopoutWindow extends CompositeDisposable { @@ -51,6 +53,10 @@ export class PopoutWindow extends CompositeDisposable { if (this._window) { this._onWillClose.fire(); + if (this.options.onClosing) { + this.options.onClosing(this.target, this._window.value); + } + this._window.disposable.dispose(); this._window.value.close(); this._window = null; @@ -125,6 +131,10 @@ export class PopoutWindow extends CompositeDisposable { this.close(); }); }); + + if (this.options.onOpened) { + this.options.onOpened(this.target, externalWindow); + } } private createPopoutWindowContainer(): HTMLElement {