dockview-core 4.3.1 → 4.4.1

package/dist/esm/api/component.api.d.ts

@@ -419,6 +419,7 @@ export declare class DockviewApi implements CommonApi<SerializedDockview> {
     get onUnhandledDragOverEvent(): Event<DockviewDndOverlayEvent>;
     get onDidPopoutGroupSizeChange(): Event<PopoutGroupChangeSizeEvent>;
     get onDidPopoutGroupPositionChange(): Event<PopoutGroupChangePositionEvent>;
+    get onDidOpenPopoutWindowFail(): Event<void>;
     /**
      * All panel objects.
      */

package/dist/esm/api/component.api.js

@@ -574,6 +574,9 @@ export class DockviewApi {
     get onDidPopoutGroupPositionChange() {
         return this.component.onDidPopoutGroupPositionChange;
     }
+    get onDidOpenPopoutWindowFail() {
+        return this.component.onDidOpenPopoutWindowFail;
+    }
     /**
      * All panel objects.
      */

package/dist/esm/dockview/components/tab/tab.d.ts

@@ -23,5 +23,6 @@ export declare class Tab extends CompositeDisposable {
     constructor(panel: IDockviewPanel, accessor: DockviewComponent, group: DockviewGroupPanel);
     setActive(isActive: boolean): void;
     setContent(part: ITabRenderer): void;
+    updateDragAndDropState(): void;
     dispose(): void;
 }

package/dist/esm/dockview/components/tab/tab.js

@@ -41,7 +41,7 @@ export class Tab extends CompositeDisposable {
         this._element = document.createElement('div');
         this._element.className = 'dv-tab';
         this._element.tabIndex = 0;
-        this._element.draggable = true;
+        this._element.draggable = !this.accessor.options.disableDnd;
         toggleClass(this.element, 'dv-inactive-tab', true);
         const dragHandler = new TabDragHandler(this._element, this.accessor, this.group, this.panel);
         this.dropTarget = new Droptarget(this._element, {
@@ -89,6 +89,9 @@ export class Tab extends CompositeDisposable {
         this.content = part;
         this._element.appendChild(this.content.element);
     }
+    updateDragAndDropState() {
+        this._element.draggable = !this.accessor.options.disableDnd;
+    }
     dispose() {
         super.dispose();
     }

package/dist/esm/dockview/components/titlebar/tabs.d.ts

@@ -42,4 +42,5 @@ export declare class Tabs extends CompositeDisposable {
     delete(id: string): void;
     private addTab;
     private toggleDropdown;
+    updateDragAndDropState(): void;
 }

package/dist/esm/dockview/components/titlebar/tabs.js

@@ -186,4 +186,9 @@ export class Tabs extends CompositeDisposable {
                 .map((x) => x.value.panel.id);
         this._onOverflowTabsChange.fire({ tabs, reset: options.reset });
     }
+    updateDragAndDropState() {
+        for (const tab of this._tabs) {
+            tab.value.updateDragAndDropState();
+        }
+    }
 }

package/dist/esm/dockview/components/titlebar/tabsContainer.d.ts

@@ -38,6 +38,7 @@ export interface ITabsContainer extends IDisposable {
     setPrefixActionsElement(element: HTMLElement | undefined): void;
     show(): void;
     hide(): void;
+    updateDragAndDropState(): void;
 }
 export declare class TabsContainer extends CompositeDisposable implements ITabsContainer {
     private readonly accessor;
@@ -82,4 +83,5 @@ export declare class TabsContainer extends CompositeDisposable implements ITabsC
     closePanel(panel: IDockviewPanel): void;
     private updateClassnames;
     private toggleDropdown;
+    updateDragAndDropState(): void;
 }

package/dist/esm/dockview/components/titlebar/tabsContainer.js

@@ -228,4 +228,8 @@ export class TabsContainer extends CompositeDisposable {
             });
         }));
     }
+    updateDragAndDropState() {
+        this.tabs.updateDragAndDropState();
+        this.voidContainer.updateDragAndDropState();
+    }
 }

package/dist/esm/dockview/components/titlebar/voidContainer.d.ts

@@ -15,4 +15,5 @@ export declare class VoidContainer extends CompositeDisposable {
     readonly onWillShowOverlay: Event<WillShowOverlayEvent>;
     get element(): HTMLElement;
     constructor(accessor: DockviewComponent, group: DockviewGroupPanel);
+    updateDragAndDropState(): void;
 }

package/dist/esm/dockview/components/titlebar/voidContainer.js

@@ -17,7 +17,7 @@ export class VoidContainer extends CompositeDisposable {
         this.onDragStart = this._onDragStart.event;
         this._element = document.createElement('div');
         this._element.className = 'dv-void-container';
-        this._element.draggable = true;
+        this._element.draggable = !this.accessor.options.disableDnd;
         this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
             this.accessor.doSetGroupActive(this.group);
         }));
@@ -40,4 +40,7 @@ export class VoidContainer extends CompositeDisposable {
             this._onDrop.fire(event);
         }), this.dropTarget);
     }
+    updateDragAndDropState() {
+        this._element.draggable = !this.accessor.options.disableDnd;
+    }
 }

package/dist/esm/dockview/dockviewComponent.d.ts

@@ -140,6 +140,7 @@ export interface IDockviewComponent extends IBaseGrid<DockviewGroupPanel> {
     readonly onDidMaximizedGroupChange: Event<DockviewMaximizedGroupChanged>;
     readonly onDidPopoutGroupSizeChange: Event<PopoutGroupChangeSizeEvent>;
     readonly onDidPopoutGroupPositionChange: Event<PopoutGroupChangePositionEvent>;
+    readonly onDidOpenPopoutWindowFail: Event<void>;
     readonly options: DockviewComponentOptions;
     updateOptions(options: DockviewOptions): void;
     moveGroupOrPanel(options: MoveGroupOrPanelOptions): void;
@@ -202,6 +203,8 @@ export declare class DockviewComponent extends BaseGrid<DockviewGroupPanel> impl
     readonly onDidPopoutGroupSizeChange: Event<PopoutGroupChangeSizeEvent>;
     private readonly _onDidPopoutGroupPositionChange;
     readonly onDidPopoutGroupPositionChange: Event<PopoutGroupChangePositionEvent>;
+    private readonly _onDidOpenPopoutWindowFail;
+    readonly onDidOpenPopoutWindowFail: Event<void>;
     private readonly _onDidLayoutFromJSON;
     readonly onDidLayoutFromJSON: Event<void>;
     private readonly _onDidActivePanelChange;
@@ -236,6 +239,7 @@ export declare class DockviewComponent extends BaseGrid<DockviewGroupPanel> impl
     private orthogonalize;
     updateOptions(options: Partial<DockviewComponentOptions>): void;
     layout(width: number, height: number, forceResize?: boolean | undefined): void;
+    private updateDragAndDropState;
     focus(): void;
     getGroupPanel(id: string): IDockviewPanel | undefined;
     setActivePanel(panel: IDockviewPanel): void;

package/dist/esm/dockview/dockviewComponent.js

@@ -109,6 +109,8 @@ export class DockviewComponent extends BaseGrid {
         this.onDidPopoutGroupSizeChange = this._onDidPopoutGroupSizeChange.event;
         this._onDidPopoutGroupPositionChange = new Emitter();
         this.onDidPopoutGroupPositionChange = this._onDidPopoutGroupPositionChange.event;
+        this._onDidOpenPopoutWindowFail = new Emitter();
+        this.onDidOpenPopoutWindowFail = this._onDidOpenPopoutWindowFail.event;
         this._onDidLayoutFromJSON = new Emitter();
         this.onDidLayoutFromJSON = this._onDidLayoutFromJSON.event;
         this._onDidActivePanelChange = new Emitter({ replay: true });
@@ -173,7 +175,7 @@ export class DockviewComponent extends BaseGrid {
         if (options.debug) {
             this.addDisposables(new StrictEventsSequencing(this));
         }
-        this.addDisposables(this.rootDropTargetContainer, this.overlayRenderContainer, this._onWillDragPanel, this._onWillDragGroup, this._onWillShowOverlay, this._onDidActivePanelChange, this._onDidAddPanel, this._onDidRemovePanel, this._onDidLayoutFromJSON, this._onDidDrop, this._onWillDrop, this._onDidMovePanel, this._onDidAddGroup, this._onDidRemoveGroup, this._onDidActiveGroupChange, this._onUnhandledDragOverEvent, this._onDidMaximizedGroupChange, this._onDidOptionsChange, this._onDidPopoutGroupSizeChange, this._onDidPopoutGroupPositionChange, this.onDidViewVisibilityChangeMicroTaskQueue(() => {
+        this.addDisposables(this.rootDropTargetContainer, this.overlayRenderContainer, this._onWillDragPanel, this._onWillDragGroup, this._onWillShowOverlay, this._onDidActivePanelChange, this._onDidAddPanel, this._onDidRemovePanel, this._onDidLayoutFromJSON, this._onDidDrop, this._onWillDrop, this._onDidMovePanel, this._onDidAddGroup, this._onDidRemoveGroup, this._onDidActiveGroupChange, this._onUnhandledDragOverEvent, this._onDidMaximizedGroupChange, this._onDidOptionsChange, this._onDidPopoutGroupSizeChange, this._onDidPopoutGroupPositionChange, this._onDidOpenPopoutWindowFail, this.onDidViewVisibilityChangeMicroTaskQueue(() => {
             this.updateWatermark();
         }), this.onDidAdd((event) => {
             if (!this._moving) {
@@ -319,13 +321,6 @@ export class DockviewComponent extends BaseGrid {
             if (_window.isDisposed) {
                 return false;
             }
-            if (popoutContainer === null) {
-                popoutWindowDisposable.dispose();
-                return false;
-            }
-            const gready = document.createElement('div');
-            gready.className = 'dv-overlay-render-container';
-            const overlayRenderContainer = new OverlayRenderContainer(gready, this);
             const referenceGroup = (options === null || options === void 0 ? void 0 : options.referenceGroup)
                 ? options.referenceGroup
                 : itemToPopout instanceof DockviewPanel
@@ -333,7 +328,7 @@ export class DockviewComponent extends BaseGrid {
                     : itemToPopout;
             const referenceLocation = itemToPopout.api.location.type;
             /**
-             * The group that is being added doesn't already exist within the DOM, the most likely occurance
+             * The group that is being added doesn't already exist within the DOM, the most likely occurrence
              * of this case is when being called from the `fromJSON(...)` method
              */
             const isGroupAddedToDom = referenceGroup.element.parentElement !== null;
@@ -346,8 +341,28 @@ export class DockviewComponent extends BaseGrid {
             }
             else {
                 group = this.createGroup({ id: groupId });
-                this._onDidAddGroup.fire(group);
+                if (popoutContainer) {
+                    this._onDidAddGroup.fire(group);
+                }
             }
+            if (popoutContainer === null) {
+                console.error('dockview: failed to create popout. perhaps you need to allow pop-ups for this website');
+                popoutWindowDisposable.dispose();
+                this._onDidOpenPopoutWindowFail.fire();
+                // if the popout window was blocked, we need to move the group back to the reference group
+                // and set it to visible
+                this.movingLock(() => moveGroupWithoutDestroying({
+                    from: group,
+                    to: referenceGroup,
+                }));
+                if (!referenceGroup.api.isVisible) {
+                    referenceGroup.api.setVisible(true);
+                }
+                return false;
+            }
+            const gready = document.createElement('div');
+            gready.className = 'dv-overlay-render-container';
+            const overlayRenderContainer = new OverlayRenderContainer(gready, this);
             group.model.renderContainer = overlayRenderContainer;
             group.layout(_window.window.innerWidth, _window.window.innerHeight);
             let floatingBox;
@@ -504,7 +519,7 @@ export class DockviewComponent extends BaseGrid {
             return true;
         })
             .catch((err) => {
-            console.error('dockview: failed to create popout window', err);
+            console.error('dockview: failed to create popout.', err);
             return false;
         });
     }
@@ -713,7 +728,12 @@ export class DockviewComponent extends BaseGrid {
             }
         }
         this.updateDropTargetModel(options);
+        const oldDisableDnd = this.options.disableDnd;
         this._options = Object.assign(Object.assign({}, this.options), options);
+        const newDisableDnd = this.options.disableDnd;
+        if (oldDisableDnd !== newDisableDnd) {
+            this.updateDragAndDropState();
+        }
         if ('theme' in options) {
             this.updateTheme();
         }
@@ -728,6 +748,12 @@ export class DockviewComponent extends BaseGrid {
             }
         }
     }
+    updateDragAndDropState() {
+        // Update draggable state for all tabs and void containers
+        for (const group of this.groups) {
+            group.model.updateDragAndDropState();
+        }
+    }
     focus() {
         var _a;
         (_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.focus();

package/dist/esm/dockview/dockviewGroupPanelModel.d.ts

@@ -123,9 +123,16 @@ export type DockviewGroupLocation = {
     getWindow: () => Window;
     popoutUrl?: string;
 };
+export interface WillShowOverlayLocationEventOptions {
+    readonly kind: DockviewGroupDropLocation;
+    readonly panel: IDockviewPanel | undefined;
+    readonly api: DockviewApi;
+    readonly group: DockviewGroupPanel | undefined;
+    getData: () => PanelTransfer | undefined;
+}
 export declare class WillShowOverlayLocationEvent implements IDockviewEvent {
     private readonly event;
-    private readonly options;
+    readonly options: WillShowOverlayLocationEventOptions;
     get kind(): DockviewGroupDropLocation;
     get nativeEvent(): DragEvent;
     get position(): Position;
@@ -135,13 +142,7 @@ export declare class WillShowOverlayLocationEvent implements IDockviewEvent {
     get group(): DockviewGroupPanel | undefined;
     preventDefault(): void;
     getData(): PanelTransfer | undefined;
-    constructor(event: WillShowOverlayEvent, options: {
-        kind: DockviewGroupDropLocation;
-        panel: IDockviewPanel | undefined;
-        api: DockviewApi;
-        group: DockviewGroupPanel | undefined;
-        getData: () => PanelTransfer | undefined;
-    });
+    constructor(event: WillShowOverlayEvent, options: WillShowOverlayLocationEventOptions);
 }
 export declare class DockviewGroupPanelModel extends CompositeDisposable implements IDockviewGroupPanelModel {
     private readonly container;
@@ -252,6 +253,7 @@ export declare class DockviewGroupPanelModel extends CompositeDisposable impleme
     private updateContainer;
     canDisplayOverlay(event: DragEvent, position: Position, target: DockviewGroupDropLocation): boolean;
     private handleDropEvent;
+    updateDragAndDropState(): void;
     dispose(): void;
 }
 export {};

package/dist/esm/dockview/dockviewGroupPanelModel.js

@@ -648,6 +648,9 @@ export class DockviewGroupPanelModel extends CompositeDisposable {
             }));
         }
     }
+    updateDragAndDropState() {
+        this.tabsContainer.updateDragAndDropState();
+    }
     dispose() {
         var _a, _b, _c;
         super.dispose();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dockview-core",
-  "version": "4.3.1",
+  "version": "4.4.1",
   "description": "Zero dependency layout manager supporting tabs, grids and splitviews",
   "keywords": [
     "splitview",