dockview 1.0.3 → 1.3.0

package/dist/esm/groupview/groupview.js

@@ -1,12 +1,3 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import { DockviewApi } from '../api/component.api';
 import { getPanelData } from '../dnd/dataTransfer';
 import { Droptarget, Position } from '../dnd/droptarget';
@@ -21,7 +12,6 @@ export var GroupChangeKind2;
     GroupChangeKind2["ADD_PANEL"] = "ADD_PANEL";
     GroupChangeKind2["REMOVE_PANEL"] = "REMOVE_PANEL";
     GroupChangeKind2["PANEL_ACTIVE"] = "PANEL_ACTIVE";
-    GroupChangeKind2["GROUP_ACTIVE"] = "GROUP_ACTIVE";
 })(GroupChangeKind2 || (GroupChangeKind2 = {}));
 export class Groupview extends CompositeDisposable {
     constructor(container, accessor, id, options, parent) {
@@ -42,15 +32,10 @@ export class Groupview extends CompositeDisposable {
         this.onMove = this._onMove.event;
         this._onDidGroupChange = new Emitter();
         this.onDidGroupChange = this._onDidGroupChange.event;
-        this.closePanel = (panel) => __awaiter(this, void 0, void 0, function* () {
-            if (panel.close && !(yield panel.close())) {
-                return false;
-            }
-            this.doClose(panel);
-            return true;
-        });
+        this._onDidDrop = new Emitter();
+        this.onDidDrop = this._onDidDrop.event;
         this.container.classList.add('groupview');
-        this.addDisposables(this._onMove, this._onDidGroupChange);
+        this.addDisposables(this._onMove, this._onDidGroupChange, this._onDidChange, this._onDidDrop);
         this.tabsContainer = new TabsContainer(this.accessor, this.parent, {
             tabHeight: options.tabHeight,
         });
@@ -114,6 +99,9 @@ export class Groupview extends CompositeDisposable {
     get maximumWidth() {
         return Number.MAX_SAFE_INTEGER;
     }
+    get hasWatermark() {
+        return !!(this.watermark && this.container.contains(this.watermark.element));
+    }
     initialize() {
         var _a, _b;
         if ((_a = this.options) === null || _a === void 0 ? void 0 : _a.panels) {
@@ -192,10 +180,10 @@ export class Groupview extends CompositeDisposable {
     containsPanel(panel) {
         return this.panels.includes(panel);
     }
-    init(params) {
+    init(_params) {
         //noop
     }
-    update(params) {
+    update(_params) {
         //noop
     }
     focus() {
@@ -207,6 +195,8 @@ export class Groupview extends CompositeDisposable {
             options.index > this.panels.length) {
             options.index = this.panels.length;
         }
+        // ensure the group is updated before we fire any events
+        panel.updateParentGroup(this.parent, true);
         if (this._activePanel === panel) {
             this.accessor.doSetGroupActive(this.parent);
             return;
@@ -227,43 +217,19 @@ export class Groupview extends CompositeDisposable {
         return this._removePanel(panelToRemove);
     }
     closeAllPanels() {
-        var _a;
-        return __awaiter(this, void 0, void 0, function* () {
-            const index = this._activePanel
-                ? this.panels.indexOf(this._activePanel)
-                : -1;
-            if (this._activePanel && index > -1) {
-                if (this.panels.indexOf(this._activePanel) < 0) {
-                    console.warn('active panel not tracked');
-                }
-                const canClose = !((_a = this._activePanel) === null || _a === void 0 ? void 0 : _a.close) || (yield this._activePanel.close());
-                if (!canClose) {
-                    return false;
-                }
-            }
-            for (let i = 0; i < this.panels.length; i++) {
-                if (i === index) {
-                    continue;
-                }
-                const panel = this.panels[i];
-                this.openPanel(panel);
-                if (panel.close) {
-                    const canClose = yield panel.close();
-                    if (!canClose) {
-                        return false;
-                    }
-                }
-            }
-            if (this.panels.length > 0) {
-                // take a copy since we will be edting the array as we iterate through
-                const arrPanelCpy = [...this.panels];
-                yield Promise.all(arrPanelCpy.map((p) => this.doClose(p)));
+        if (this.panels.length > 0) {
+            // take a copy since we will be edting the array as we iterate through
+            const arrPanelCpy = [...this.panels];
+            for (const panel of arrPanelCpy) {
+                this.doClose(panel);
             }
-            else {
-                this.accessor.removeGroup(this.parent);
-            }
-            return true;
-        });
+        }
+        else {
+            this.accessor.removeGroup(this.parent);
+        }
+    }
+    closePanel(panel) {
+        this.doClose(panel);
     }
     doClose(panel) {
         this.accessor.removePanel(panel);
@@ -406,8 +372,11 @@ export class Groupview extends CompositeDisposable {
             this.tabsContainer.show();
         }
     }
-    canDisplayOverlay(dragOverEvent, target) {
+    canDisplayOverlay(event, target) {
         // custom overlay handler
+        if (this.accessor.options.showDndOverlay) {
+            return this.accessor.options.showDndOverlay(event, target);
+        }
         return false;
     }
     handleDropEvent(event, position, index) {
@@ -433,14 +402,16 @@ export class Groupview extends CompositeDisposable {
             });
         }
         else {
-            // custom drop handler
+            this._onDidDrop.fire({ nativeEvent: event, position, index });
         }
     }
     dispose() {
+        var _a;
+        super.dispose();
+        (_a = this.watermark) === null || _a === void 0 ? void 0 : _a.dispose();
         for (const panel of this.panels) {
             panel.dispose();
         }
-        super.dispose();
         this.dropTarget.dispose();
         this.tabsContainer.dispose();
         this.contentContainer.dispose();

package/dist/esm/groupview/groupviewPanel.d.ts

@@ -1,8 +1,11 @@
 import { IFrameworkPart } from '../panel/types';
 import { IDockviewComponent } from '../dockview/dockviewComponent';
 import { Groupview, GroupOptions } from './groupview';
-import { GridviewPanel } from '../gridview/gridviewPanel';
-export declare class GroupviewPanel extends GridviewPanel {
+import { GridviewPanel, IGridviewPanel } from '../gridview/gridviewPanel';
+export interface IGroupviewPanel extends IGridviewPanel {
+    model: Groupview;
+}
+export declare class GroupviewPanel extends GridviewPanel implements IGroupviewPanel {
     private readonly _model;
     get model(): Groupview;
     get minimumHeight(): number;

package/dist/esm/groupview/panel/content.d.ts

@@ -24,7 +24,7 @@ export declare class ContentContainer extends CompositeDisposable implements ICo
     show(): void;
     hide(): void;
     openPanel(panel: IGroupPanel): void;
-    layout(width: number, height: number): void;
+    layout(_width: number, _height: number): void;
     closePanel(): void;
     dispose(): void;
 }

package/dist/esm/groupview/panel/content.js

@@ -12,6 +12,7 @@ export class ContentContainer extends CompositeDisposable {
         this._element = document.createElement('div');
         this._element.className = 'content-container';
         this._element.tabIndex = -1;
+        this.addDisposables(this._onDidFocus, this._onDidBlur);
         // for hosted containers
         // 1) register a drop target on the host
         // 2) register window dragStart events to disable pointer events
@@ -55,7 +56,7 @@ export class ContentContainer extends CompositeDisposable {
         }
         this.disposable.value = disposable;
     }
-    layout(width, height) {
+    layout(_width, _height) {
         // noop
     }
     closePanel() {

package/dist/esm/groupview/tab.d.ts

@@ -10,33 +10,30 @@ export declare enum MouseEventKind {
     CONTEXT_MENU = "CONTEXT_MENU"
 }
 export interface LayoutMouseEvent {
-    kind: MouseEventKind;
-    event: MouseEvent;
-    panel?: IGroupPanel;
-    tab?: boolean;
+    readonly kind: MouseEventKind;
+    readonly event: MouseEvent;
+    readonly panel?: IGroupPanel;
+    readonly tab?: boolean;
 }
 export interface ITab {
-    panelId: string;
-    element: HTMLElement;
+    readonly panelId: string;
+    readonly element: HTMLElement;
     setContent: (element: ITabRenderer) => void;
     onChanged: Event<LayoutMouseEvent>;
     onDrop: Event<DroptargetEvent>;
     setActive(isActive: boolean): void;
 }
 export declare class Tab extends CompositeDisposable implements ITab {
-    panelId: string;
-    private readonly accessor;
-    private group;
-    private _element;
-    private droptarget;
+    readonly panelId: string;
+    private readonly group;
+    private readonly _element;
+    private readonly droptarget;
     private content?;
     private readonly _onChanged;
     readonly onChanged: Event<LayoutMouseEvent>;
     private readonly _onDropped;
     readonly onDrop: Event<DroptargetEvent>;
-    private readonly panelTransfer;
     get element(): HTMLElement;
-    private iframes;
     constructor(panelId: string, accessor: IDockviewComponent, group: GroupviewPanel);
     setActive(isActive: boolean): void;
     setContent(part: ITabRenderer): void;

package/dist/esm/groupview/tab.js

@@ -1,9 +1,10 @@
 import { addDisposableListener, Emitter } from '../events';
 import { CompositeDisposable } from '../lifecycle';
 import { getPanelData, LocalSelectionTransfer, PanelTransfer, } from '../dnd/dataTransfer';
-import { getElementsByTagName, toggleClass } from '../dom';
+import { toggleClass } from '../dom';
 import { Droptarget } from '../dnd/droptarget';
 import { DockviewDropTargets } from './dnd';
+import { DragHandler } from '../dnd/abstractDragHandler';
 export var MouseEventKind;
 (function (MouseEventKind) {
     MouseEventKind["CLICK"] = "CLICK";
@@ -13,42 +14,34 @@ export class Tab extends CompositeDisposable {
     constructor(panelId, accessor, group) {
         super();
         this.panelId = panelId;
-        this.accessor = accessor;
         this.group = group;
         this._onChanged = new Emitter();
         this.onChanged = this._onChanged.event;
         this._onDropped = new Emitter();
         this.onDrop = this._onDropped.event;
-        this.panelTransfer = LocalSelectionTransfer.getInstance();
-        this.iframes = [];
         this.addDisposables(this._onChanged, this._onDropped);
         this._element = document.createElement('div');
         this._element.className = 'tab';
         this._element.tabIndex = 0;
         this._element.draggable = true;
-        this.addDisposables(addDisposableListener(this._element, 'dragstart', (event) => {
-            this.iframes = [
-                ...getElementsByTagName('iframe'),
-                ...getElementsByTagName('webview'),
-            ];
-            for (const iframe of this.iframes) {
-                iframe.style.pointerEvents = 'none';
+        this.addDisposables(new (class Handler extends DragHandler {
+            constructor() {
+                super(...arguments);
+                this.panelTransfer = LocalSelectionTransfer.getInstance();
             }
-            this.element.classList.add('dragged');
-            setTimeout(() => this.element.classList.remove('dragged'), 0);
-            this.panelTransfer.setData([
-                new PanelTransfer(this.accessor.id, this.group.id, this.panelId),
-            ], PanelTransfer.prototype);
-            if (event.dataTransfer) {
-                event.dataTransfer.effectAllowed = 'move';
+            getData() {
+                this.panelTransfer.setData([new PanelTransfer(accessor.id, group.id, panelId)], PanelTransfer.prototype);
+                return {
+                    dispose: () => {
+                        this.panelTransfer.clearData(PanelTransfer.prototype);
+                    },
+                };
             }
-        }), addDisposableListener(this._element, 'dragend', (ev) => {
-            for (const iframe of this.iframes) {
-                iframe.style.pointerEvents = 'auto';
+            dispose() {
+                //
             }
-            this.iframes = [];
-            this.panelTransfer.clearData(PanelTransfer.prototype);
-        }), addDisposableListener(this._element, 'mousedown', (event) => {
+        })(this._element));
+        this.addDisposables(addDisposableListener(this._element, 'mousedown', (event) => {
             if (event.defaultPrevented) {
                 return;
             }

package/dist/esm/groupview/titlebar/tabsContainer.js

@@ -155,12 +155,10 @@ export class TabsContainer extends CompositeDisposable {
             if (!isLeftClick || event.event.defaultPrevented) {
                 return;
             }
-            switch (event.kind) {
-                case MouseEventKind.CLICK:
-                    this.group.model.openPanel(panel, {
-                        skipFocus: alreadyFocused,
-                    });
-                    break;
+            if (event.kind === MouseEventKind.CLICK) {
+                this.group.model.openPanel(panel, {
+                    skipFocus: alreadyFocused,
+                });
             }
         }), tabToAdd.onDrop((event) => {
             this._onDrop.fire({

package/dist/esm/hostedContainer.js

@@ -23,10 +23,10 @@ export class HostedContainer {
         /**
          * When dragging somebody
          */
-        window.addEventListener('dragstart', (ev) => {
+        window.addEventListener('dragstart', () => {
             this.element.style.pointerEvents = 'none';
         });
-        window.addEventListener('dragend', (ev) => {
+        window.addEventListener('dragend', () => {
             this.element.style.pointerEvents = '';
         });
         window.addEventListener('mousemove', (ev) => {

package/dist/esm/index.d.ts

@@ -1,5 +1,3 @@
-export * from './events';
-export * from './lifecycle';
 export * from './dnd/dataTransfer';
 export * from './api/component.api';
 export * from './splitview/core/splitview';
@@ -20,8 +18,10 @@ export * from './splitview/splitviewPanel';
 export * from './paneview/paneviewPanel';
 export * from './groupview/groupPanel';
 export * from './react';
+export { Event } from './events';
+export { IDisposable } from './lifecycle';
 export { Position } from './dnd/droptarget';
-export { StateObject, State, FocusEvent, PanelDimensionChangeEvent, VisibilityEvent, ActiveEvent, PanelApi, } from './api/panelApi';
+export { FocusEvent, PanelDimensionChangeEvent, VisibilityEvent, ActiveEvent, PanelApi, } from './api/panelApi';
 export { SizeEvent, GridviewPanelApi, GridConstraintChangeEvent, } from './api/gridviewPanelApi';
 export { TitleEvent, SuppressClosableEvent, DockviewPanelApi, } from './api/groupPanelApi';
 export { PanelSizeEvent, PanelConstraintChangeEvent, SplitviewPanelApi, } from './api/splitviewPanelApi';

package/dist/esm/index.js

@@ -1,5 +1,3 @@
-export * from './events';
-export * from './lifecycle';
 export * from './dnd/dataTransfer';
 export * from './api/component.api';
 export * from './splitview/core/splitview';
@@ -20,4 +18,5 @@ export * from './splitview/splitviewPanel';
 export * from './paneview/paneviewPanel';
 export * from './groupview/groupPanel';
 export * from './react'; // TODO: should be conditional on whether user wants the React wrappers
+export { Event } from './events';
 export { Position } from './dnd/droptarget';

package/dist/esm/lifecycle.js

@@ -14,7 +14,7 @@ export class CompositeDisposable {
         return new CompositeDisposable(...args);
     }
     addDisposables(...args) {
-        args === null || args === void 0 ? void 0 : args.forEach((arg) => this.disposables.push(arg));
+        args.forEach((arg) => this.disposables.push(arg));
     }
     dispose() {
         this.disposables.forEach((arg) => arg.dispose());
@@ -33,6 +33,7 @@ export class MutableDisposable {
     dispose() {
         if (this._disposable) {
             this._disposable.dispose();
+            this._disposable = Disposable.NONE;
         }
     }
 }

package/dist/esm/panel/types.d.ts

@@ -1,4 +1,3 @@
-import { State } from '../api/panelApi';
 import { IDisposable } from '../lifecycle';
 import { LayoutPriority } from '../splitview/core/splitview';
 /**
@@ -9,7 +8,6 @@ export interface Parameters {
 }
 export interface PanelInitParameters {
     params: Parameters;
-    state?: State;
 }
 export interface PanelUpdateEvent<T extends Parameters = Parameters> {
     params: Partial<T>;

package/dist/esm/paneview/defaultPaneviewHeader.d.ts

@@ -13,6 +13,6 @@ export declare class DefaultHeader extends CompositeDisposable implements IPaneH
     init(params: PanePanelInitParameter & {
         api: PaneviewPanelApiImpl;
     }): void;
-    update(params: PanelUpdateEvent): void;
+    update(_params: PanelUpdateEvent): void;
     dispose(): void;
 }

package/dist/esm/paneview/defaultPaneviewHeader.js

@@ -27,7 +27,7 @@ export class DefaultHeader extends CompositeDisposable {
             this._expander.textContent = e.isExpanded ? '<' : '>';
         });
     }
-    update(params) {
+    update(_params) {
         //
     }
     dispose() {

package/dist/esm/paneview/draggablePaneviewPanel.d.ts

@@ -1,6 +1,5 @@
 import { PaneTransfer } from '../dnd/dataTransfer';
 import { DroptargetEvent } from '../dnd/droptarget';
-import { Event } from '../events';
 import { Orientation } from '../splitview/core/splitview';
 import { IPaneviewPanel, PaneviewPanel } from './paneviewPanel';
 export interface PaneviewDropEvent2 extends DroptargetEvent {
@@ -11,7 +10,8 @@ export declare abstract class DraggablePaneviewPanel extends PaneviewPanel {
     private handler;
     private target;
     private readonly _onDidDrop;
-    readonly onDidDrop: Event<PaneviewDropEvent2>;
+    readonly onDidDrop: import("../events").Event<PaneviewDropEvent2>;
     constructor(id: string, component: string, headerComponent: string | undefined, orientation: Orientation, isExpanded: boolean, disableDnd: boolean);
     private initDragFeatures;
+    private onDrop;
 }

package/dist/esm/paneview/draggablePaneviewPanel.js

@@ -30,7 +30,7 @@ export class DraggablePaneviewPanel extends PaneviewPanel {
         })(this.header);
         this.target = new Droptarget(this.element, {
             validOverlays: 'vertical',
-            canDisplayOverlay: (event) => {
+            canDisplayOverlay: () => {
                 const data = getPaneData();
                 if (!data) {
                     return true;
@@ -39,34 +39,37 @@ export class DraggablePaneviewPanel extends PaneviewPanel {
             },
         });
         this.addDisposables(this._onDidDrop, this.handler, this.target, this.target.onDrop((event) => {
-            const data = getPaneData();
-            if (!data) {
-                this._onDidDrop.fire(Object.assign(Object.assign({}, event), { panel: this, getData: () => getPaneData() }));
-                return;
-            }
-            const containerApi = this.params
-                .containerApi;
-            const panelId = data.paneId;
-            const existingPanel = containerApi.getPanel(panelId);
-            if (!existingPanel) {
-                this._onDidDrop.fire(Object.assign(Object.assign({}, event), { panel: this, getData: () => getPaneData() }));
-                return;
-            }
-            const allPanels = containerApi.getPanels();
-            const fromIndex = allPanels.indexOf(existingPanel);
-            let toIndex = containerApi.getPanels().indexOf(this);
-            if (event.position === Position.Left ||
-                event.position === Position.Top) {
-                toIndex = Math.max(0, toIndex - 1);
-            }
-            if (event.position === Position.Right ||
-                event.position === Position.Bottom) {
-                if (fromIndex > toIndex) {
-                    toIndex++;
-                }
-                toIndex = Math.min(allPanels.length - 1, toIndex);
-            }
-            containerApi.movePanel(fromIndex, toIndex);
+            this.onDrop(event);
         }));
     }
+    onDrop(event) {
+        const data = getPaneData();
+        if (!data) {
+            this._onDidDrop.fire(Object.assign(Object.assign({}, event), { panel: this, getData: () => getPaneData() }));
+            return;
+        }
+        const containerApi = this._params
+            .containerApi;
+        const panelId = data.paneId;
+        const existingPanel = containerApi.getPanel(panelId);
+        if (!existingPanel) {
+            this._onDidDrop.fire(Object.assign(Object.assign({}, event), { panel: this, getData: () => getPaneData() }));
+            return;
+        }
+        const allPanels = containerApi.getPanels();
+        const fromIndex = allPanels.indexOf(existingPanel);
+        let toIndex = containerApi.getPanels().indexOf(this);
+        if (event.position === Position.Left ||
+            event.position === Position.Top) {
+            toIndex = Math.max(0, toIndex - 1);
+        }
+        if (event.position === Position.Right ||
+            event.position === Position.Bottom) {
+            if (fromIndex > toIndex) {
+                toIndex++;
+            }
+            toIndex = Math.min(allPanels.length - 1, toIndex);
+        }
+        containerApi.movePanel(fromIndex, toIndex);
+    }
 }

package/dist/esm/paneview/paneview.d.ts

@@ -29,7 +29,9 @@ export declare class Paneview extends CompositeDisposable implements IDisposable
     addPane(pane: PaneviewPanel, size?: number | Sizing, index?: number, skipLayout?: boolean): void;
     getViewSize(index: number): number;
     getPanes(): PaneviewPanel[];
-    removePane(index: number): PaneItem;
+    removePane(index: number, options?: {
+        skipDispose: boolean;
+    }): PaneItem;
     moveView(from: number, to: number): void;
     layout(size: number, orthogonalSize: number): void;
     private setupAnimation;

package/dist/esm/paneview/paneview.js

@@ -21,7 +21,7 @@ export class Paneview extends CompositeDisposable {
         });
         // if we've added views from the descriptor we need to
         // add the panes to our Pane array and setup animation
-        this.getPanes().forEach((pane, index) => {
+        this.getPanes().forEach((pane) => {
             const disposable = new CompositeDisposable(pane.onDidChangeExpansionState(() => {
                 this.setupAnimation();
                 this._onDidChange.fire(undefined);
@@ -37,7 +37,7 @@ export class Paneview extends CompositeDisposable {
             this.paneItems.push(paneItem);
             pane.orthogonalSize = this.splitview.orthogonalSize;
         });
-        this.addDisposables(this.splitview.onDidSashEnd(() => {
+        this.addDisposables(this._onDidChange, this.splitview.onDidSashEnd(() => {
             this._onDidChange.fire(undefined);
         }), this.splitview.onDidAddView(() => {
             this._onDidChange.fire();
@@ -89,17 +89,20 @@ export class Paneview extends CompositeDisposable {
     getPanes() {
         return this.splitview.getViews();
     }
-    removePane(index) {
+    removePane(index, options = { skipDispose: false }) {
         const paneItem = this.paneItems.splice(index, 1)[0];
         this.splitview.removeView(index);
-        paneItem.disposable.dispose();
+        if (!options.skipDispose) {
+            paneItem.disposable.dispose();
+            paneItem.pane.dispose();
+        }
         return paneItem;
     }
     moveView(from, to) {
         if (from === to) {
             return;
         }
-        const view = this.removePane(from);
+        const view = this.removePane(from, { skipDispose: true });
         this.skipAnimation = true;
         try {
             this.addPane(view.pane, view.pane.size, to, false);
@@ -127,15 +130,16 @@ export class Paneview extends CompositeDisposable {
     }
     dispose() {
         super.dispose();
-        this.splitview.dispose();
         if (this.animationTimer) {
             clearTimeout(this.animationTimer);
             this.animationTimer = undefined;
         }
         this.paneItems.forEach((paneItem) => {
             paneItem.disposable.dispose();
+            paneItem.pane.dispose();
         });
         this.paneItems = [];
+        this.splitview.dispose();
         this.element.remove();
     }
 }

package/dist/esm/paneview/paneviewComponent.d.ts

@@ -18,9 +18,6 @@ export interface SerializedPaneviewPanel {
         params?: {
             [index: string]: any;
         };
-        state?: {
-            [index: string]: any;
-        };
     };
     size: number;
     expanded?: boolean;
@@ -44,7 +41,7 @@ export declare class PaneFramework extends DraggablePaneviewPanel {
     getBodyComponent(): IPaneBodyPart;
     getHeaderComponent(): IPaneHeaderPart;
 }
-export interface AddPaneviewCompponentOptions {
+export interface AddPaneviewComponentOptions {
     id: string;
     component: string;
     headerComponent?: string;
@@ -67,7 +64,7 @@ export interface IPaneviewComponent extends IDisposable {
     readonly onDidRemoveView: Event<PaneviewPanel>;
     readonly onDidDrop: Event<PaneviewDropEvent2>;
     readonly onDidLayoutChange: Event<void>;
-    addPanel(options: AddPaneviewCompponentOptions): IDisposable;
+    addPanel(options: AddPaneviewComponentOptions): IPaneviewPanel;
     layout(width: number, height: number): void;
     toJSON(): SerializedPaneview;
     fromJSON(serializedPaneview: SerializedPaneview, deferComponentLayout?: boolean): void;
@@ -82,6 +79,7 @@ export interface IPaneviewComponent extends IDisposable {
 export declare class PaneviewComponent extends CompositeDisposable implements IPaneviewComponent {
     private element;
     private _disposable;
+    private _viewDisposables;
     private _paneview;
     private readonly _onDidLayoutChange;
     readonly onDidLayoutChange: Event<void>;
@@ -102,7 +100,7 @@ export declare class PaneviewComponent extends CompositeDisposable implements IP
     constructor(element: HTMLElement, options: PaneviewComponentOptions);
     focus(): void;
     updateOptions(options: Partial<PaneviewComponentOptions>): void;
-    addPanel(options: AddPaneviewCompponentOptions): IDisposable;
+    addPanel(options: AddPaneviewComponentOptions): IPaneviewPanel;
     getPanels(): PaneviewPanel[];
     removePanel(panel: PaneviewPanel): void;
     movePanel(from: number, to: number): void;
@@ -114,4 +112,7 @@ export declare class PaneviewComponent extends CompositeDisposable implements IP
     resizeToFit(): void;
     toJSON(): SerializedPaneview;
     fromJSON(serializedPaneview: SerializedPaneview, deferComponentLayout?: boolean): void;
+    private doAddPanel;
+    private doRemovePanel;
+    dispose(): void;
 }