dockview-core 1.15.2 → 1.16.0

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

@@ -1,8 +1,8 @@
 import { FloatingGroupOptions, IDockviewComponent, MovePanelEvent, SerializedDockview } from '../dockview/dockviewComponent';
-import { AddGroupOptions, AddPanelOptions, DockviewDndOverlayEvent, MovementOptions } from '../dockview/options';
+import { AddGroupOptions, AddPanelOptions, DockviewComponentOptions, DockviewDndOverlayEvent, MovementOptions } from '../dockview/options';
 import { Parameters } from '../panel/types';
 import { Direction } from '../gridview/baseComponentGridview';
-import { AddComponentOptions, IGridviewComponent, SerializedGridviewComponent } from '../gridview/gridviewComponent';
+import { AddComponentOptions, GridviewComponentUpdateOptions, IGridviewComponent, SerializedGridviewComponent } from '../gridview/gridviewComponent';
 import { IGridviewPanel } from '../gridview/gridviewPanel';
 import { AddPaneviewComponentOptions, SerializedPaneview, IPaneviewComponent } from '../paneview/paneviewComponent';
 import { IPaneviewPanel } from '../paneview/paneviewPanel';
@@ -16,6 +16,7 @@ import { PaneviewDropEvent } from '../paneview/draggablePaneviewPanel';
 import { GroupDragEvent, TabDragEvent } from '../dockview/components/titlebar/tabsContainer';
 import { Box } from '../types';
 import { DockviewDidDropEvent, DockviewWillDropEvent, WillShowOverlayLocationEvent } from '../dockview/dockviewGroupPanelModel';
+import { PaneviewComponentOptions } from '../paneview/options';
 export interface CommonApi<T = any> {
     readonly height: number;
     readonly width: number;
@@ -26,6 +27,7 @@ export interface CommonApi<T = any> {
     fromJSON(data: T): void;
     toJSON(): T;
     clear(): void;
+    dispose(): void;
 }
 export declare class SplitviewApi implements CommonApi<SerializedSplitview> {
     private readonly component;
@@ -75,10 +77,6 @@ export declare class SplitviewApi implements CommonApi<SerializedSplitview> {
      */
     get onDidRemoveView(): Event<IView>;
     constructor(component: ISplitviewComponent);
-    /**
-     * Update configuratable options.
-     */
-    updateOptions(options: SplitviewComponentUpdateOptions): void;
     /**
      * Removes an existing panel and optionally provide a `Sizing` method
      * for the subsequent resize.
@@ -114,6 +112,14 @@ export declare class SplitviewApi implements CommonApi<SerializedSplitview> {
      * Remove all panels and clear the component.
      */
     clear(): void;
+    /**
+     * Update configuratable options.
+     */
+    updateOptions(options: Partial<SplitviewComponentUpdateOptions>): void;
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose(): void;
 }
 export declare class PaneviewApi implements CommonApi<SerializedPaneview> {
     private readonly component;
@@ -194,6 +200,14 @@ export declare class PaneviewApi implements CommonApi<SerializedPaneview> {
      * Reset the component back to an empty and default state.
      */
     clear(): void;
+    /**
+     * Update configuratable options.
+     */
+    updateOptions(options: Partial<PaneviewComponentOptions>): void;
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose(): void;
 }
 export declare class GridviewApi implements CommonApi<SerializedGridviewComponent> {
     private readonly component;
@@ -291,6 +305,11 @@ export declare class GridviewApi implements CommonApi<SerializedGridviewComponen
      * Reset the component back to an empty and default state.
      */
     clear(): void;
+    updateOptions(options: Partial<GridviewComponentUpdateOptions>): void;
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose(): void;
 }
 export declare class DockviewApi implements CommonApi<SerializedDockview> {
     private readonly component;
@@ -493,4 +512,9 @@ export declare class DockviewApi implements CommonApi<SerializedDockview> {
         }) => void;
     }): Promise<void>;
     setGap(gap: number | undefined): void;
+    updateOptions(options: Partial<DockviewComponentOptions>): void;
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose(): void;
 }

package/dist/cjs/api/component.api.js

@@ -128,12 +128,6 @@ var SplitviewApi = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
-    /**
-     * Update configuratable options.
-     */
-    SplitviewApi.prototype.updateOptions = function (options) {
-        this.component.updateOptions(options);
-    };
     /**
      * Removes an existing panel and optionally provide a `Sizing` method
      * for the subsequent resize.
@@ -187,6 +181,18 @@ var SplitviewApi = /** @class */ (function () {
     SplitviewApi.prototype.clear = function () {
         this.component.clear();
     };
+    /**
+     * Update configuratable options.
+     */
+    SplitviewApi.prototype.updateOptions = function (options) {
+        this.component.updateOptions(options);
+    };
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    SplitviewApi.prototype.dispose = function () {
+        this.component.dispose();
+    };
     return SplitviewApi;
 }());
 exports.SplitviewApi = SplitviewApi;
@@ -357,6 +363,18 @@ var PaneviewApi = /** @class */ (function () {
     PaneviewApi.prototype.clear = function () {
         this.component.clear();
     };
+    /**
+     * Update configuratable options.
+     */
+    PaneviewApi.prototype.updateOptions = function (options) {
+        this.component.updateOptions(options);
+    };
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    PaneviewApi.prototype.dispose = function () {
+        this.component.dispose();
+    };
     return PaneviewApi;
 }());
 exports.PaneviewApi = PaneviewApi;
@@ -552,6 +570,15 @@ var GridviewApi = /** @class */ (function () {
     GridviewApi.prototype.clear = function () {
         this.component.clear();
     };
+    GridviewApi.prototype.updateOptions = function (options) {
+        this.component.updateOptions(options);
+    };
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    GridviewApi.prototype.dispose = function () {
+        this.component.dispose();
+    };
     return GridviewApi;
 }());
 exports.GridviewApi = GridviewApi;
@@ -967,6 +994,15 @@ var DockviewApi = /** @class */ (function () {
     DockviewApi.prototype.setGap = function (gap) {
         this.component.updateOptions({ gap: gap });
     };
+    DockviewApi.prototype.updateOptions = function (options) {
+        this.component.updateOptions(options);
+    };
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    DockviewApi.prototype.dispose = function () {
+        this.component.dispose();
+    };
     return DockviewApi;
 }());
 exports.DockviewApi = DockviewApi;

package/dist/cjs/api/dockviewPanelApi.d.ts

@@ -4,7 +4,7 @@ import { DockviewGroupPanel } from '../dockview/dockviewGroupPanel';
 import { DockviewPanel } from '../dockview/dockviewPanel';
 import { DockviewComponent } from '../dockview/dockviewComponent';
 import { Position } from '../dnd/droptarget';
-import { DockviewPanelRenderer } from '../overlayRenderContainer';
+import { DockviewPanelRenderer } from '../overlay/overlayRenderContainer';
 import { DockviewGroupPanelFloatingChangeEvent } from './dockviewGroupPanelApi';
 import { DockviewGroupLocation } from '../dockview/dockviewGroupPanelModel';
 export interface TitleEvent {

package/dist/cjs/api/entryPoints.d.ts

@@ -0,0 +1,9 @@
+import { DockviewApi, GridviewApi, PaneviewApi, SplitviewApi } from '../api/component.api';
+import { DockviewComponentOptions } from '../dockview/options';
+import { GridviewComponentOptions } from '../gridview/options';
+import { PaneviewComponentOptions } from '../paneview/options';
+import { SplitviewComponentOptions } from '../splitview/options';
+export declare function createDockview(element: HTMLElement, options: DockviewComponentOptions): DockviewApi;
+export declare function createSplitview(element: HTMLElement, options: SplitviewComponentOptions): SplitviewApi;
+export declare function createGridview(element: HTMLElement, options: GridviewComponentOptions): GridviewApi;
+export declare function createPaneview(element: HTMLElement, options: PaneviewComponentOptions): PaneviewApi;

package/dist/cjs/api/entryPoints.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createPaneview = exports.createGridview = exports.createSplitview = exports.createDockview = void 0;
+var component_api_1 = require("../api/component.api");
+var dockviewComponent_1 = require("../dockview/dockviewComponent");
+var gridviewComponent_1 = require("../gridview/gridviewComponent");
+var paneviewComponent_1 = require("../paneview/paneviewComponent");
+var splitviewComponent_1 = require("../splitview/splitviewComponent");
+function createDockview(element, options) {
+    var component = new dockviewComponent_1.DockviewComponent(element, options);
+    return component.api;
+}
+exports.createDockview = createDockview;
+function createSplitview(element, options) {
+    var component = new splitviewComponent_1.SplitviewComponent(element, options);
+    return new component_api_1.SplitviewApi(component);
+}
+exports.createSplitview = createSplitview;
+function createGridview(element, options) {
+    var component = new gridviewComponent_1.GridviewComponent(element, options);
+    return new component_api_1.GridviewApi(component);
+}
+exports.createGridview = createGridview;
+function createPaneview(element, options) {
+    var component = new paneviewComponent_1.PaneviewComponent(element, options);
+    return new component_api_1.PaneviewApi(component);
+}
+exports.createPaneview = createPaneview;

package/dist/cjs/dnd/abstractDragHandler.js

@@ -14,42 +14,6 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-var __values = (this && this.__values) || function(o) {
-    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-    if (m) return m.call(o);
-    if (o && typeof o.length === "number") return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
-        }
-    };
-    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DragHandler = void 0;
 var dom_1 = require("../dom");
@@ -74,43 +38,16 @@ var DragHandler = /** @class */ (function (_super) {
     DragHandler.prototype.configure = function () {
         var _this = this;
         this.addDisposables(this._onDragStart, (0, events_1.addDisposableListener)(this.el, 'dragstart', function (event) {
-            var e_1, _a;
             if (event.defaultPrevented || _this.isCancelled(event)) {
                 event.preventDefault();
                 return;
             }
-            var iframes = __spreadArray(__spreadArray([], __read((0, dom_1.getElementsByTagName)('iframe')), false), __read((0, dom_1.getElementsByTagName)('webview')), false);
+            var iframes = (0, dom_1.disableIframePointEvents)();
             _this.pointerEventsDisposable.value = {
                 dispose: function () {
-                    var e_2, _a;
-                    try {
-                        for (var iframes_2 = __values(iframes), iframes_2_1 = iframes_2.next(); !iframes_2_1.done; iframes_2_1 = iframes_2.next()) {
-                            var iframe = iframes_2_1.value;
-                            iframe.style.pointerEvents = 'auto';
-                        }
-                    }
-                    catch (e_2_1) { e_2 = { error: e_2_1 }; }
-                    finally {
-                        try {
-                            if (iframes_2_1 && !iframes_2_1.done && (_a = iframes_2.return)) _a.call(iframes_2);
-                        }
-                        finally { if (e_2) throw e_2.error; }
-                    }
+                    iframes.release();
                 },
             };
-            try {
-                for (var iframes_1 = __values(iframes), iframes_1_1 = iframes_1.next(); !iframes_1_1.done; iframes_1_1 = iframes_1.next()) {
-                    var iframe = iframes_1_1.value;
-                    iframe.style.pointerEvents = 'none';
-                }
-            }
-            catch (e_1_1) { e_1 = { error: e_1_1 }; }
-            finally {
-                try {
-                    if (iframes_1_1 && !iframes_1_1.done && (_a = iframes_1.return)) _a.call(iframes_1);
-                }
-                finally { if (e_1) throw e_1.error; }
-            }
             _this.el.classList.add('dv-dragged');
             setTimeout(function () { return _this.el.classList.remove('dv-dragged'); }, 0);
             _this.dataDisposable.value = _this.getData(event);

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

@@ -36,7 +36,7 @@ var VoidContainer = /** @class */ (function (_super) {
         _this._element.className = 'void-container';
         _this._element.tabIndex = 0;
         _this._element.draggable = true;
-        _this.addDisposables(_this._onDrop, _this._onDragStart, (0, events_1.addDisposableListener)(_this._element, 'click', function () {
+        _this.addDisposables(_this._onDrop, _this._onDragStart, (0, events_1.addDisposableListener)(_this._element, 'pointerdown', function () {
             _this.accessor.doSetGroupActive(_this.group);
         }));
         var handler = new groupDragHandler_1.GroupDragHandler(_this._element, accessor, group);

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

@@ -10,9 +10,10 @@ import { Orientation } from '../splitview/splitview';
 import { GroupOptions, GroupPanelViewState, DockviewDidDropEvent, DockviewWillDropEvent, WillShowOverlayLocationEvent } from './dockviewGroupPanelModel';
 import { DockviewGroupPanel } from './dockviewGroupPanel';
 import { Parameters } from '../panel/types';
+import { DockviewFloatingGroupPanel } from './dockviewFloatingGroupPanel';
 import { GroupDragEvent, TabDragEvent } from './components/titlebar/tabsContainer';
 import { AnchoredBox, AnchorPosition, Box } from '../types';
-import { DockviewPanelRenderer, OverlayRenderContainer } from '../overlayRenderContainer';
+import { DockviewPanelRenderer, OverlayRenderContainer } from '../overlay/overlayRenderContainer';
 export interface PanelReference {
     update: (event: {
         params: {
@@ -176,7 +177,8 @@ export declare class DockviewComponent extends BaseGrid<DockviewGroupPanel> impl
     get renderer(): DockviewPanelRenderer;
     get api(): DockviewApi;
     get gap(): number;
-    constructor(options: DockviewComponentOptions);
+    get floatingGroups(): DockviewFloatingGroupPanel[];
+    constructor(parentElement: HTMLElement, options: DockviewComponentOptions);
     addPopoutGroup(itemToPopout: DockviewPanel | DockviewGroupPanel, options?: {
         skipRemoveGroup?: boolean;
         position?: Box;

package/dist/cjs/dockview/dockviewComponent.js

@@ -80,11 +80,11 @@ var dockviewGroupPanelModel_1 = require("./dockviewGroupPanelModel");
 var dockviewGroupPanel_1 = require("./dockviewGroupPanel");
 var dockviewPanelModel_1 = require("./dockviewPanelModel");
 var dataTransfer_1 = require("../dnd/dataTransfer");
-var overlay_1 = require("../dnd/overlay");
+var overlay_1 = require("../overlay/overlay");
 var dom_1 = require("../dom");
 var dockviewFloatingGroupPanel_1 = require("./dockviewFloatingGroupPanel");
 var constants_1 = require("../constants");
-var overlayRenderContainer_1 = require("../overlayRenderContainer");
+var overlayRenderContainer_1 = require("../overlay/overlayRenderContainer");
 var popoutWindow_1 = require("../popoutWindow");
 var DEFAULT_ROOT_OVERLAY_MODEL = {
     activationSize: { type: 'pixels', value: 10 },
@@ -127,7 +127,7 @@ function getDockviewTheme(element) {
 }
 var DockviewComponent = /** @class */ (function (_super) {
     __extends(DockviewComponent, _super);
-    function DockviewComponent(options) {
+    function DockviewComponent(parentElement, options) {
         var _a;
         var _this = _super.call(this, {
             proportionalLayout: true,
@@ -135,10 +135,11 @@ var DockviewComponent = /** @class */ (function (_super) {
             styles: options.hideBorders
                 ? { separatorBorder: 'transparent' }
                 : undefined,
-            parentElement: options.parentElement,
+            parentElement: parentElement,
             disableAutoResizing: options.disableAutoResizing,
             locked: options.locked,
             margin: options.gap,
+            className: options.className,
         }) || this;
         _this.nextGroupId = (0, math_1.sequentialNumberGenerator)();
         _this._deserializer = new deserializer_1.DefaultDockviewDeserialzier(_this);
@@ -174,10 +175,10 @@ var DockviewComponent = /** @class */ (function (_super) {
         _this._onDidActiveGroupChange = new events_1.Emitter();
         _this.onDidActiveGroupChange = _this._onDidActiveGroupChange.event;
         _this._moving = false;
-        var gready = document.createElement('div');
-        gready.className = 'dv-overlay-render-container';
-        _this.gridview.element.appendChild(gready);
-        _this.overlayRenderContainer = new overlayRenderContainer_1.OverlayRenderContainer(gready);
+        // const gready = document.createElement('div');
+        // gready.className = 'dv-overlay-render-container';
+        // this.gridview.element.appendChild(gready);
+        _this.overlayRenderContainer = new overlayRenderContainer_1.OverlayRenderContainer(_this.gridview.element, _this);
         (0, dom_1.toggleClass)(_this.gridview.element, 'dv-dockview', true);
         (0, dom_1.toggleClass)(_this.element, 'dv-debug', !!options.debug);
         _this.addDisposables(_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.onDidViewVisibilityChangeMicroTaskQueue(function () {
@@ -375,6 +376,13 @@ var DockviewComponent = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(DockviewComponent.prototype, "floatingGroups", {
+        get: function () {
+            return this._floatingGroups;
+        },
+        enumerable: false,
+        configurable: true
+    });
     DockviewComponent.prototype.addPopoutGroup = function (itemToPopout, options) {
         var _this = this;
         var _a, _b, _c;
@@ -427,7 +435,7 @@ var DockviewComponent = /** @class */ (function (_super) {
             }
             var gready = document.createElement('div');
             gready.className = 'dv-overlay-render-container';
-            var overlayRenderContainer = new overlayRenderContainer_1.OverlayRenderContainer(gready);
+            var overlayRenderContainer = new overlayRenderContainer_1.OverlayRenderContainer(gready, _this);
             var referenceGroup = itemToPopout instanceof dockviewPanel_1.DockviewPanel
                 ? itemToPopout.group
                 : itemToPopout;
@@ -587,7 +595,6 @@ var DockviewComponent = /** @class */ (function (_super) {
                 }
             }
         }
-        group.model.location = { type: 'floating' };
         function getAnchoredBox() {
             if (options === null || options === void 0 ? void 0 : options.position) {
                 var result = {};
@@ -654,10 +661,14 @@ var DockviewComponent = /** @class */ (function (_super) {
                 : false,
         });
         var floatingGroupPanel = new dockviewFloatingGroupPanel_1.DockviewFloatingGroupPanel(group, overlay);
-        var disposable = (0, dom_1.watchElementResize)(group.element, function (entry) {
+        var disposable = new lifecycle_1.CompositeDisposable(group.api.onDidActiveChange(function (event) {
+            if (event.isActive) {
+                overlay.bringToFront();
+            }
+        }), (0, dom_1.watchElementResize)(group.element, function (entry) {
             var _a = entry.contentRect, width = _a.width, height = _a.height;
             group.layout(width, height); // let the group know it's size is changing so it can fire events to the panel
-        });
+        }));
         floatingGroupPanel.addDisposables(overlay.onDidChange(function () {
             // this is either a resize or a move
             // to inform the panels .layout(...) the group with it's current size
@@ -673,12 +684,13 @@ var DockviewComponent = /** @class */ (function (_super) {
         }), {
             dispose: function () {
                 disposable.dispose();
-                group.model.location = { type: 'grid' };
                 (0, array_1.remove)(_this._floatingGroups, floatingGroupPanel);
+                group.model.location = { type: 'grid' };
                 _this.updateWatermark();
             },
         });
         this._floatingGroups.push(floatingGroupPanel);
+        group.model.location = { type: 'floating' };
         if (!(options === null || options === void 0 ? void 0 : options.skipActiveGroup)) {
             this.doSetGroupAndPanelActive(group);
         }
@@ -959,6 +971,8 @@ var DockviewComponent = /** @class */ (function (_super) {
                     var group = createGroupFromSerializedState_1(data_1);
                     this.addFloatingGroup(group, {
                         position: position,
+                        width: position.width,
+                        height: position.height,
                         skipRemoveGroup: true,
                         inDragMode: false,
                     });
@@ -1401,6 +1415,7 @@ var DockviewComponent = /** @class */ (function (_super) {
                     this._groups.delete(group.id);
                     this._onDidRemoveGroup.fire(group);
                 }
+                (0, array_1.remove)(this._popoutGroups, selectedGroup);
                 var removedGroup = selectedGroup.disposable.dispose();
                 if (!(options === null || options === void 0 ? void 0 : options.skipPopoutReturn) && removedGroup) {
                     this.doAddGroup(removedGroup, [0]);
@@ -1517,6 +1532,35 @@ var DockviewComponent = /** @class */ (function (_super) {
                         return;
                     }
                 }
+                if (sourceGroup.api.location.type === 'popout') {
+                    /**
+                     * the source group is a popout group with a single panel
+                     *
+                     * 1. remove the panel from the group without triggering any events
+                     * 2. remove the popout group
+                     * 3. create a new group at the requested location and add that panel
+                     */
+                    var popoutGroup_1 = this._popoutGroups.find(function (group) { return group.popoutGroup === sourceGroup; });
+                    var removedPanel_2 = this.movingLock(function () {
+                        return popoutGroup_1.popoutGroup.model.removePanel(popoutGroup_1.popoutGroup.panels[0], {
+                            skipSetActive: true,
+                            skipSetActiveGroup: true,
+                        });
+                    });
+                    this.doRemoveGroup(sourceGroup, { skipActive: true });
+                    var newGroup_1 = this.createGroupAtLocation(targetLocation);
+                    this.movingLock(function () {
+                        return newGroup_1.model.openPanel(removedPanel_2, {
+                            skipSetActive: true,
+                        });
+                    });
+                    this.doSetGroupAndPanelActive(newGroup_1);
+                    this._onDidMovePanel.fire({
+                        panel: this.getGroupPanel(sourceItemId),
+                        from: sourceGroup,
+                    });
+                    return;
+                }
                 // source group will become empty so delete the group
                 var targetGroup_1 = this.movingLock(function () {
                     return _this.doRemoveGroup(sourceGroup, {
@@ -1539,25 +1583,25 @@ var DockviewComponent = /** @class */ (function (_super) {
                  * The group we are removing from has many panels, we need to remove the panels we are moving,
                  * create a new group, add the panels to that new group and add the new group in an appropiate position
                  */
-                var removedPanel_2 = this.movingLock(function () {
+                var removedPanel_3 = this.movingLock(function () {
                     return sourceGroup.model.removePanel(sourceItemId, {
                         skipSetActive: false,
                         skipSetActiveGroup: true,
                     });
                 });
-                if (!removedPanel_2) {
+                if (!removedPanel_3) {
                     throw new Error("No panel with id ".concat(sourceItemId));
                 }
                 var dropLocation = (0, gridview_1.getRelativeLocation)(this.gridview.orientation, referenceLocation, destinationTarget);
                 var group_2 = this.createGroupAtLocation(dropLocation);
                 this.movingLock(function () {
-                    return group_2.model.openPanel(removedPanel_2, {
+                    return group_2.model.openPanel(removedPanel_3, {
                         skipSetGroupActive: true,
                     });
                 });
                 this.doSetGroupAndPanelActive(group_2);
                 this._onDidMovePanel.fire({
-                    panel: removedPanel_2,
+                    panel: removedPanel_3,
                     from: sourceGroup,
                 });
             }

package/dist/cjs/dockview/dockviewFloatingGroupPanel.d.ts

@@ -1,4 +1,4 @@
-import { Overlay } from '../dnd/overlay';
+import { Overlay } from '../overlay/overlay';
 import { CompositeDisposable } from '../lifecycle';
 import { AnchoredBox } from '../types';
 import { DockviewGroupPanel, IDockviewGroupPanel } from './dockviewGroupPanel';

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

@@ -10,7 +10,7 @@ import { GroupDragEvent, TabDragEvent } from './components/titlebar/tabsContaine
 import { DockviewGroupPanel } from './dockviewGroupPanel';
 import { IDockviewPanel } from './dockviewPanel';
 import { DockviewDndOverlayEvent } from './options';
-import { OverlayRenderContainer } from '../overlayRenderContainer';
+import { OverlayRenderContainer } from '../overlay/overlayRenderContainer';
 import { TitleEvent } from '../api/dockviewPanelApi';
 interface GroupMoveEvent {
     groupId: string;

package/dist/cjs/dockview/dockviewGroupPanelModel.js

@@ -723,7 +723,7 @@ var DockviewGroupPanelModel = /** @class */ (function (_super) {
                 group: this.groupPanel,
             });
             this.watermark = watermark;
-            (0, events_1.addDisposableListener)(this.watermark.element, 'click', function () {
+            (0, events_1.addDisposableListener)(this.watermark.element, 'pointerdown', function () {
                 if (!_this.isActive) {
                     _this.accessor.doSetGroupActive(_this.groupPanel);
                 }

package/dist/cjs/dockview/dockviewPanel.d.ts

@@ -6,7 +6,7 @@ import { CompositeDisposable, IDisposable } from '../lifecycle';
 import { IPanel, PanelUpdateEvent, Parameters } from '../panel/types';
 import { IDockviewPanelModel } from './dockviewPanelModel';
 import { DockviewComponent } from './dockviewComponent';
-import { DockviewPanelRenderer } from '../overlayRenderContainer';
+import { DockviewPanelRenderer } from '../overlay/overlayRenderContainer';
 export interface IDockviewPanel extends IDisposable, IPanel {
     readonly view: IDockviewPanelModel;
     readonly group: DockviewGroupPanel;

package/dist/cjs/dockview/dockviewPanel.js

@@ -58,7 +58,7 @@ var DockviewPanel = /** @class */ (function (_super) {
             // forward the resize event to the group since if you want to resize a panel
             // you are actually just resizing the panels parent which is the group
             _this.group.api.setSize(event);
-        }), _this.api.onDidRendererChange(function (event) {
+        }), _this.api.onDidRendererChange(function () {
             _this.group.model.rerender(_this);
         }));
         return _this;

package/dist/cjs/dockview/options.d.ts

@@ -9,7 +9,7 @@ import { IDisposable } from '../lifecycle';
 import { DroptargetOverlayModel, Position } from '../dnd/droptarget';
 import { DockviewGroupDropLocation, GroupOptions } from './dockviewGroupPanelModel';
 import { IDockviewPanel } from './dockviewPanel';
-import { DockviewPanelRenderer } from '../overlayRenderContainer';
+import { DockviewPanelRenderer } from '../overlay/overlayRenderContainer';
 import { IGroupHeaderProps } from './framework';
 import { FloatingGroupOptions } from './dockviewComponent';
 export interface IHeaderActionsRenderer extends IDisposable {
@@ -44,6 +44,7 @@ export interface DockviewOptions {
     rootOverlayModel?: DroptargetOverlayModel;
     locked?: boolean;
     disableDnd?: boolean;
+    className?: string;
     /**
      * Pixel gap between groups
      */
@@ -71,7 +72,6 @@ export declare class DockviewUnhandledDragOverEvent implements DockviewDndOverla
 }
 export declare const PROPERTY_KEYS: (keyof DockviewOptions)[];
 export interface DockviewFrameworkOptions {
-    parentElement: HTMLElement;
     defaultTabComponent?: string;
     createRightHeaderActionComponent?: (group: DockviewGroupPanel) => IHeaderActionsRenderer;
     createLeftHeaderActionComponent?: (group: DockviewGroupPanel) => IHeaderActionsRenderer;

package/dist/cjs/dockview/options.js

@@ -41,6 +41,7 @@ exports.PROPERTY_KEYS = (function () {
         locked: undefined,
         disableDnd: undefined,
         gap: undefined,
+        className: undefined,
     };
     return Object.keys(properties);
 })();

package/dist/cjs/dockview/types.d.ts

@@ -3,7 +3,7 @@ import { PanelInitParameters, IPanel } from '../panel/types';
 import { DockviewApi } from '../api/component.api';
 import { Optional } from '../types';
 import { DockviewGroupPanel, IDockviewGroupPanel } from './dockviewGroupPanel';
-import { DockviewPanelRenderer } from '../overlayRenderContainer';
+import { DockviewPanelRenderer } from '../overlay/overlayRenderContainer';
 export interface HeaderPartInitParameters {
     title: string;
 }

package/dist/cjs/dom.d.ts

@@ -27,3 +27,6 @@ export declare function getDomNodePagePosition(domNode: Element): {
  */
 export declare function isInDocument(element: Element): boolean;
 export declare function addTestId(element: HTMLElement, id: string): void;
+export declare function disableIframePointEvents(): {
+    release: () => void;
+};