dockview-core 1.15.2 → 1.16.0

package/dist/esm/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/esm/api/component.api.js

@@ -70,12 +70,6 @@ export class SplitviewApi {
     constructor(component) {
         this.component = component;
     }
-    /**
-     * Update configuratable options.
-     */
-    updateOptions(options) {
-        this.component.updateOptions(options);
-    }
     /**
      * Removes an existing panel and optionally provide a `Sizing` method
      * for the subsequent resize.
@@ -129,6 +123,18 @@ export class SplitviewApi {
     clear() {
         this.component.clear();
     }
+    /**
+     * Update configuratable options.
+     */
+    updateOptions(options) {
+        this.component.updateOptions(options);
+    }
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose() {
+        this.component.dispose();
+    }
 }
 export class PaneviewApi {
     /**
@@ -256,6 +262,18 @@ export class PaneviewApi {
     clear() {
         this.component.clear();
     }
+    /**
+     * Update configuratable options.
+     */
+    updateOptions(options) {
+        this.component.updateOptions(options);
+    }
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose() {
+        this.component.dispose();
+    }
 }
 export class GridviewApi {
     /**
@@ -396,6 +414,15 @@ export class GridviewApi {
     clear() {
         this.component.clear();
     }
+    updateOptions(options) {
+        this.component.updateOptions(options);
+    }
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose() {
+        this.component.dispose();
+    }
 }
 export class DockviewApi {
     /**
@@ -688,4 +715,13 @@ export class DockviewApi {
     setGap(gap) {
         this.component.updateOptions({ gap });
     }
+    updateOptions(options) {
+        this.component.updateOptions(options);
+    }
+    /**
+     * Release resources and teardown component. Do not call when using framework versions of dockview.
+     */
+    dispose() {
+        this.component.dispose();
+    }
 }

package/dist/esm/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/esm/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/esm/api/entryPoints.js

@@ -0,0 +1,21 @@
+import { GridviewApi, PaneviewApi, SplitviewApi, } from '../api/component.api';
+import { DockviewComponent } from '../dockview/dockviewComponent';
+import { GridviewComponent } from '../gridview/gridviewComponent';
+import { PaneviewComponent } from '../paneview/paneviewComponent';
+import { SplitviewComponent } from '../splitview/splitviewComponent';
+export function createDockview(element, options) {
+    const component = new DockviewComponent(element, options);
+    return component.api;
+}
+export function createSplitview(element, options) {
+    const component = new SplitviewComponent(element, options);
+    return new SplitviewApi(component);
+}
+export function createGridview(element, options) {
+    const component = new GridviewComponent(element, options);
+    return new GridviewApi(component);
+}
+export function createPaneview(element, options) {
+    const component = new PaneviewComponent(element, options);
+    return new PaneviewApi(component);
+}

package/dist/esm/dnd/abstractDragHandler.js

@@ -1,4 +1,4 @@
-import { getElementsByTagName } from '../dom';
+import { disableIframePointEvents } from '../dom';
 import { addDisposableListener, Emitter } from '../events';
 import { CompositeDisposable, MutableDisposable, } from '../lifecycle';
 export class DragHandler extends CompositeDisposable {
@@ -21,20 +21,12 @@ export class DragHandler extends CompositeDisposable {
                 event.preventDefault();
                 return;
             }
-            const iframes = [
-                ...getElementsByTagName('iframe'),
-                ...getElementsByTagName('webview'),
-            ];
+            const iframes = disableIframePointEvents();
             this.pointerEventsDisposable.value = {
                 dispose: () => {
-                    for (const iframe of iframes) {
-                        iframe.style.pointerEvents = 'auto';
-                    }
+                    iframes.release();
                 },
             };
-            for (const iframe of iframes) {
-                iframe.style.pointerEvents = 'none';
-            }
             this.el.classList.add('dv-dragged');
             setTimeout(() => this.el.classList.remove('dv-dragged'), 0);
             this.dataDisposable.value = this.getData(event);

package/dist/esm/dockview/components/panel/content.js

@@ -1,5 +1,5 @@
 import { CompositeDisposable, MutableDisposable, } from '../../../lifecycle';
-import { Emitter } from '../../../events';
+import { Emitter, } from '../../../events';
 import { trackFocus } from '../../../dom';
 import { Droptarget } from '../../../dnd/droptarget';
 import { getPanelData } from '../../../dnd/dataTransfer';

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

@@ -20,7 +20,7 @@ export class VoidContainer extends CompositeDisposable {
         this._element.className = 'void-container';
         this._element.tabIndex = 0;
         this._element.draggable = true;
-        this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'click', () => {
+        this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
             this.accessor.doSetGroupActive(this.group);
         }));
         const handler = new GroupDragHandler(this._element, accessor, group);

package/dist/esm/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/esm/dockview/dockviewComponent.js

@@ -15,11 +15,11 @@ import { DockviewDidDropEvent, DockviewWillDropEvent, WillShowOverlayLocationEve
 import { DockviewGroupPanel } from './dockviewGroupPanel';
 import { DockviewPanelModel } from './dockviewPanelModel';
 import { getPanelData } from '../dnd/dataTransfer';
-import { Overlay } from '../dnd/overlay';
+import { Overlay } from '../overlay/overlay';
 import { addTestId, toggleClass, watchElementResize } from '../dom';
 import { DockviewFloatingGroupPanel } from './dockviewFloatingGroupPanel';
 import { DEFAULT_FLOATING_GROUP_OVERFLOW_SIZE, DEFAULT_FLOATING_GROUP_POSITION, } from '../constants';
-import { OverlayRenderContainer, } from '../overlayRenderContainer';
+import { OverlayRenderContainer, } from '../overlay/overlayRenderContainer';
 import { PopoutWindow } from '../popoutWindow';
 const DEFAULT_ROOT_OVERLAY_MODEL = {
     activationSize: { type: 'pixels', value: 10 },
@@ -88,7 +88,10 @@ export class DockviewComponent extends BaseGrid {
     get gap() {
         return this.gridview.margin;
     }
-    constructor(options) {
+    get floatingGroups() {
+        return this._floatingGroups;
+    }
+    constructor(parentElement, options) {
         var _a;
         super({
             proportionalLayout: true,
@@ -96,10 +99,11 @@ export class DockviewComponent extends BaseGrid {
             styles: options.hideBorders
                 ? { separatorBorder: 'transparent' }
                 : undefined,
-            parentElement: options.parentElement,
+            parentElement: parentElement,
             disableAutoResizing: options.disableAutoResizing,
             locked: options.locked,
             margin: options.gap,
+            className: options.className,
         });
         this.nextGroupId = sequentialNumberGenerator();
         this._deserializer = new DefaultDockviewDeserialzier(this);
@@ -135,10 +139,10 @@ export class DockviewComponent extends BaseGrid {
         this._onDidActiveGroupChange = new Emitter();
         this.onDidActiveGroupChange = this._onDidActiveGroupChange.event;
         this._moving = false;
-        const gready = document.createElement('div');
-        gready.className = 'dv-overlay-render-container';
-        this.gridview.element.appendChild(gready);
-        this.overlayRenderContainer = new OverlayRenderContainer(gready);
+        // const gready = document.createElement('div');
+        // gready.className = 'dv-overlay-render-container';
+        // this.gridview.element.appendChild(gready);
+        this.overlayRenderContainer = new OverlayRenderContainer(this.gridview.element, this);
         toggleClass(this.gridview.element, 'dv-dockview', true);
         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(() => {
@@ -304,7 +308,7 @@ export class DockviewComponent extends BaseGrid {
             }
             const gready = document.createElement('div');
             gready.className = 'dv-overlay-render-container';
-            const overlayRenderContainer = new OverlayRenderContainer(gready);
+            const overlayRenderContainer = new OverlayRenderContainer(gready, this);
             const referenceGroup = itemToPopout instanceof DockviewPanel
                 ? itemToPopout.group
                 : itemToPopout;
@@ -453,7 +457,6 @@ export class DockviewComponent extends BaseGrid {
                 }
             }
         }
-        group.model.location = { type: 'floating' };
         function getAnchoredBox() {
             if (options === null || options === void 0 ? void 0 : options.position) {
                 const result = {};
@@ -520,10 +523,14 @@ export class DockviewComponent extends BaseGrid {
                 : false,
         });
         const floatingGroupPanel = new DockviewFloatingGroupPanel(group, overlay);
-        const disposable = watchElementResize(group.element, (entry) => {
+        const disposable = new CompositeDisposable(group.api.onDidActiveChange((event) => {
+            if (event.isActive) {
+                overlay.bringToFront();
+            }
+        }), watchElementResize(group.element, (entry) => {
             const { width, height } = entry.contentRect;
             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(() => {
             // this is either a resize or a move
             // to inform the panels .layout(...) the group with it's current size
@@ -539,12 +546,13 @@ export class DockviewComponent extends BaseGrid {
         }), {
             dispose: () => {
                 disposable.dispose();
-                group.model.location = { type: 'grid' };
                 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);
         }
@@ -786,6 +794,8 @@ export class DockviewComponent extends BaseGrid {
                 const group = createGroupFromSerializedState(data);
                 this.addFloatingGroup(group, {
                     position: position,
+                    width: position.width,
+                    height: position.height,
                     skipRemoveGroup: true,
                     inDragMode: false,
                 });
@@ -1126,6 +1136,7 @@ export class DockviewComponent extends BaseGrid {
                     this._groups.delete(group.id);
                     this._onDidRemoveGroup.fire(group);
                 }
+                remove(this._popoutGroups, selectedGroup);
                 const removedGroup = selectedGroup.disposable.dispose();
                 if (!(options === null || options === void 0 ? void 0 : options.skipPopoutReturn) && removedGroup) {
                     this.doAddGroup(removedGroup, [0]);
@@ -1237,6 +1248,31 @@ export class DockviewComponent extends BaseGrid {
                         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
+                     */
+                    const popoutGroup = this._popoutGroups.find((group) => group.popoutGroup === sourceGroup);
+                    const removedPanel = this.movingLock(() => popoutGroup.popoutGroup.model.removePanel(popoutGroup.popoutGroup.panels[0], {
+                        skipSetActive: true,
+                        skipSetActiveGroup: true,
+                    }));
+                    this.doRemoveGroup(sourceGroup, { skipActive: true });
+                    const newGroup = this.createGroupAtLocation(targetLocation);
+                    this.movingLock(() => newGroup.model.openPanel(removedPanel, {
+                        skipSetActive: true,
+                    }));
+                    this.doSetGroupAndPanelActive(newGroup);
+                    this._onDidMovePanel.fire({
+                        panel: this.getGroupPanel(sourceItemId),
+                        from: sourceGroup,
+                    });
+                    return;
+                }
                 // source group will become empty so delete the group
                 const targetGroup = this.movingLock(() => this.doRemoveGroup(sourceGroup, {
                     skipActive: true,

package/dist/esm/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/esm/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/esm/dockview/dockviewGroupPanelModel.js

@@ -533,7 +533,7 @@ export class DockviewGroupPanelModel extends CompositeDisposable {
                 group: this.groupPanel,
             });
             this.watermark = watermark;
-            addDisposableListener(this.watermark.element, 'click', () => {
+            addDisposableListener(this.watermark.element, 'pointerdown', () => {
                 if (!this.isActive) {
                     this.accessor.doSetGroupActive(this.groupPanel);
                 }

package/dist/esm/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/esm/dockview/dockviewPanel.js

@@ -30,7 +30,7 @@ export class DockviewPanel extends CompositeDisposable {
             // 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((event) => {
+        }), this.api.onDidRendererChange(() => {
             this.group.model.rerender(this);
         }));
     }

package/dist/esm/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/esm/dockview/options.js

@@ -32,6 +32,7 @@ export const PROPERTY_KEYS = (() => {
         locked: undefined,
         disableDnd: undefined,
         gap: undefined,
+        className: undefined,
     };
     return Object.keys(properties);
 })();

package/dist/esm/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/esm/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;
+};

package/dist/esm/dom.js

@@ -182,3 +182,23 @@ export function isInDocument(element) {
 export function addTestId(element, id) {
     element.setAttribute('data-testid', id);
 }
+export function disableIframePointEvents() {
+    const iframes = [
+        ...getElementsByTagName('iframe'),
+        ...getElementsByTagName('webview'),
+    ];
+    const original = new WeakMap(); // don't hold onto HTMLElement references longer than required
+    for (const iframe of iframes) {
+        original.set(iframe, iframe.style.pointerEvents);
+        iframe.style.pointerEvents = 'none';
+    }
+    return {
+        release: () => {
+            var _a;
+            for (const iframe of iframes) {
+                iframe.style.pointerEvents = (_a = original.get(iframe)) !== null && _a !== void 0 ? _a : 'auto';
+            }
+            iframes.splice(0, iframes.length); // don't hold onto HTMLElement references longer than required
+        },
+    };
+}

package/dist/esm/gridview/baseComponentGridview.d.ts

@@ -1,7 +1,7 @@
 import { Event, AsapEvent } from '../events';
 import { Gridview, IGridView } from './gridview';
 import { Position } from '../dnd/droptarget';
-import { IValueDisposable } from '../lifecycle';
+import { IDisposable, IValueDisposable } from '../lifecycle';
 import { ISplitviewStyles, Orientation } from '../splitview/splitview';
 import { IPanel } from '../panel/types';
 import { MovementOptions2 } from '../dockview/options';
@@ -16,12 +16,13 @@ export interface BaseGridOptions {
     readonly disableAutoResizing?: boolean;
     readonly locked?: boolean;
     readonly margin?: number;
+    readonly className?: string;
 }
 export interface IGridPanelView extends IGridView, IPanel {
     setActive(isActive: boolean): void;
     readonly isActive: boolean;
 }
-export interface IBaseGrid<T extends IGridPanelView> {
+export interface IBaseGrid<T extends IGridPanelView> extends IDisposable {
     readonly element: HTMLElement;
     readonly id: string;
     readonly width: number;

package/dist/esm/gridview/baseComponentGridview.js

@@ -73,6 +73,9 @@ export class BaseGrid extends Resizable {
         this.onDidViewVisibilityChangeMicroTaskQueue = this._onDidViewVisibilityChangeMicroTaskQueue.onEvent;
         this.element.style.height = '100%';
         this.element.style.width = '100%';
+        if (typeof options.className === 'string') {
+            this.element.classList.add(options.className);
+        }
         options.parentElement.appendChild(this.element);
         this.gridview = new Gridview(!!options.proportionalLayout, options.styles, options.orientation, options.locked, options.margin);
         this.gridview.locked = !!options.locked;

package/dist/esm/gridview/gridviewComponent.d.ts

@@ -62,7 +62,7 @@ export declare class GridviewComponent extends BaseGrid<GridviewPanel> implement
     get options(): GridviewComponentOptions;
     get deserializer(): IPanelDeserializer | undefined;
     set deserializer(value: IPanelDeserializer | undefined);
-    constructor(options: GridviewComponentOptions);
+    constructor(parentElement: HTMLElement, options: GridviewComponentOptions);
     updateOptions(options: Partial<GridviewComponentUpdateOptions>): void;
     removePanel(panel: GridviewPanel): void;
     /**

package/dist/esm/gridview/gridviewComponent.js

@@ -20,13 +20,14 @@ export class GridviewComponent extends BaseGrid {
     set deserializer(value) {
         this._deserializer = value;
     }
-    constructor(options) {
+    constructor(parentElement, options) {
         super({
-            parentElement: options.parentElement,
+            parentElement: parentElement,
             proportionalLayout: options.proportionalLayout,
             orientation: options.orientation,
             styles: options.styles,
             disableAutoResizing: options.disableAutoResizing,
+            className: options.className,
         });
         this._onDidLayoutfromJSON = new Emitter();
         this.onDidLayoutFromJSON = this._onDidLayoutfromJSON.event;

package/dist/esm/gridview/options.d.ts

@@ -13,5 +13,5 @@ export interface GridviewComponentOptions {
     };
     frameworkComponentFactory?: FrameworkFactory<GridviewPanel>;
     styles?: ISplitviewStyles;
-    parentElement: HTMLElement;
+    className?: string;
 }

package/dist/esm/index.d.ts

@@ -35,7 +35,7 @@ export * from './gridview/gridviewPanel';
 export * from './splitview/splitviewPanel';
 export * from './paneview/paneviewPanel';
 export * from './dockview/types';
-export { DockviewPanelRenderer } from './overlayRenderContainer';
+export { DockviewPanelRenderer } from './overlay/overlayRenderContainer';
 export { Position, positionToDirection, directionToPosition, MeasuredValue, DroptargetOverlayModel, } from './dnd/droptarget';
 export { FocusEvent, PanelDimensionChangeEvent, VisibilityEvent, ActiveEvent, PanelApi, } from './api/panelApi';
 export { SizeEvent, GridviewPanelApi, GridConstraintChangeEvent, } from './api/gridviewPanelApi';
@@ -44,3 +44,4 @@ export { PanelSizeEvent, PanelConstraintChangeEvent, SplitviewPanelApi, } from '
 export { ExpansionEvent, PaneviewPanelApi } from './api/paneviewPanelApi';
 export { DockviewGroupPanelApi, DockviewGroupPanelFloatingChangeEvent, } from './api/dockviewGroupPanelApi';
 export { CommonApi, SplitviewApi, PaneviewApi, GridviewApi, DockviewApi, } from './api/component.api';
+export { createDockview, createGridview, createPaneview, createSplitview, } from './api/entryPoints';

package/dist/esm/index.js

@@ -32,3 +32,4 @@ export * from './paneview/paneviewPanel';
 export * from './dockview/types';
 export { positionToDirection, directionToPosition, } from './dnd/droptarget';
 export { SplitviewApi, PaneviewApi, GridviewApi, DockviewApi, } from './api/component.api';
+export { createDockview, createGridview, createPaneview, createSplitview, } from './api/entryPoints';