dockview 1.3.1 → 1.4.2

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

@@ -1,15 +1,15 @@
-import { IDockviewComponent, SerializedDockview } from '../dockview/dockviewComponent';
+import { DockviewDropEvent, IDockviewComponent, SerializedDockview } from '../dockview/dockviewComponent';
 import { AddGroupOptions, AddPanelOptions, MovementOptions } from '../dockview/options';
 import { Direction } from '../gridview/baseComponentGridview';
 import { AddComponentOptions, IGridviewComponent, SerializedGridview } from '../gridview/gridviewComponent';
 import { IGridviewPanel } from '../gridview/gridviewPanel';
-import { IGroupPanel } from '../groupview/groupPanel';
+import { IDockviewPanel } from '../groupview/groupPanel';
 import { AddPaneviewComponentOptions, SerializedPaneview, IPaneviewComponent } from '../paneview/paneviewComponent';
 import { IPaneviewPanel } from '../paneview/paneviewPanel';
 import { AddSplitviewComponentOptions, ISplitviewComponent, SerializedSplitview, SplitviewComponentUpdateOptions } from '../splitview/splitviewComponent';
 import { IView, Orientation, Sizing } from '../splitview/core/splitview';
 import { ISplitviewPanel } from '../splitview/splitviewPanel';
-import { IGroupviewPanel } from '../groupview/groupviewPanel';
+import { GroupPanel, IGroupviewPanel } from '../groupview/groupviewPanel';
 import { Event } from '../events';
 import { PaneviewDropEvent } from '../react';
 export interface CommonApi<T = any> {
@@ -19,7 +19,6 @@ export interface CommonApi<T = any> {
     readonly onDidLayoutFromJSON: Event<void>;
     focus(): void;
     layout(width: number, height: number): void;
-    resizeToFit(): void;
     fromJSON(data: T): void;
     toJSON(): T;
 }
@@ -31,6 +30,7 @@ export declare class SplitviewApi implements CommonApi<SerializedSplitview> {
     get width(): number;
     get length(): number;
     get orientation(): Orientation;
+    get panels(): ISplitviewPanel[];
     get onDidLayoutFromJSON(): Event<void>;
     get onDidLayoutChange(): Event<void>;
     get onDidAddView(): Event<IView>;
@@ -38,14 +38,10 @@ export declare class SplitviewApi implements CommonApi<SerializedSplitview> {
     constructor(component: ISplitviewComponent);
     updateOptions(options: SplitviewComponentUpdateOptions): void;
     removePanel(panel: ISplitviewPanel, sizing?: Sizing): void;
-    setVisible(panel: ISplitviewPanel, isVisible: boolean): void;
-    getPanels(): ISplitviewPanel[];
     focus(): void;
     getPanel(id: string): ISplitviewPanel | undefined;
-    setActive(panel: ISplitviewPanel): void;
     layout(width: number, height: number): void;
-    addPanel(options: AddSplitviewComponentOptions): void;
-    resizeToFit(): void;
+    addPanel(options: AddSplitviewComponentOptions): ISplitviewPanel;
     movePanel(from: number, to: number): void;
     fromJSON(data: SerializedSplitview): void;
     toJSON(): SerializedSplitview;
@@ -56,20 +52,19 @@ export declare class PaneviewApi implements CommonApi<SerializedPaneview> {
     get maximumSize(): number;
     get height(): number;
     get width(): number;
+    get panels(): IPaneviewPanel[];
     get onDidLayoutChange(): Event<void>;
     get onDidLayoutFromJSON(): Event<void>;
     get onDidAddView(): Event<IPaneviewPanel>;
     get onDidRemoveView(): Event<IPaneviewPanel>;
     get onDidDrop(): Event<PaneviewDropEvent>;
     constructor(component: IPaneviewComponent);
-    getPanels(): IPaneviewPanel[];
     removePanel(panel: IPaneviewPanel): void;
     getPanel(id: string): IPaneviewPanel | undefined;
     movePanel(from: number, to: number): void;
     focus(): void;
     layout(width: number, height: number): void;
-    addPanel(options: AddPaneviewComponentOptions): void;
-    resizeToFit(): void;
+    addPanel(options: AddPaneviewComponentOptions): IPaneviewPanel;
     fromJSON(data: SerializedPaneview): void;
     toJSON(): SerializedPaneview;
 }
@@ -82,9 +77,9 @@ export declare class GridviewApi implements CommonApi<SerializedGridview> {
     get width(): number;
     get height(): number;
     get onDidLayoutChange(): Event<void>;
-    get onDidAddGroup(): Event<IGridviewPanel>;
-    get onDidRemoveGroup(): Event<IGridviewPanel>;
-    get onDidActiveGroupChange(): Event<IGridviewPanel | undefined>;
+    get onDidAddPanel(): Event<IGridviewPanel>;
+    get onDidRemovePanel(): Event<IGridviewPanel>;
+    get onDidActivePanelChange(): Event<IGridviewPanel | undefined>;
     get onDidLayoutFromJSON(): Event<void>;
     get panels(): IGridviewPanel[];
     get orientation(): Orientation;
@@ -92,18 +87,14 @@ export declare class GridviewApi implements CommonApi<SerializedGridview> {
     constructor(component: IGridviewComponent);
     focus(): void;
     layout(width: number, height: number, force?: boolean): void;
-    addPanel(options: AddComponentOptions): void;
+    addPanel(options: AddComponentOptions): IGridviewPanel;
     removePanel(panel: IGridviewPanel, sizing?: Sizing): void;
     movePanel(panel: IGridviewPanel, options: {
         direction: Direction;
         reference: string;
         size?: number;
     }): void;
-    resizeToFit(): void;
     getPanel(id: string): IGridviewPanel | undefined;
-    toggleVisibility(panel: IGridviewPanel): void;
-    setVisible(panel: IGridviewPanel, visible: boolean): void;
-    setActive(panel: IGridviewPanel): void;
     fromJSON(data: SerializedGridview): void;
     toJSON(): SerializedGridview;
 }
@@ -117,32 +108,32 @@ export declare class DockviewApi implements CommonApi<SerializedDockview> {
     get maximumWidth(): number;
     get size(): number;
     get totalPanels(): number;
-    get onDidActiveGroupChange(): Event<IGroupviewPanel | undefined>;
-    get onDidAddGroup(): Event<IGroupviewPanel>;
-    get onDidRemoveGroup(): Event<IGroupviewPanel>;
-    get onDidActivePanelChange(): Event<IGroupPanel | undefined>;
-    get onDidAddPanel(): Event<IGroupPanel>;
-    get onDidRemovePanel(): Event<IGroupPanel>;
+    get onDidActiveGroupChange(): Event<GroupPanel | undefined>;
+    get onDidAddGroup(): Event<GroupPanel>;
+    get onDidRemoveGroup(): Event<GroupPanel>;
+    get onDidActivePanelChange(): Event<IDockviewPanel | undefined>;
+    get onDidAddPanel(): Event<IDockviewPanel>;
+    get onDidRemovePanel(): Event<IDockviewPanel>;
     get onDidLayoutFromJSON(): Event<void>;
     get onDidLayoutChange(): Event<void>;
-    get panels(): IGroupPanel[];
-    get groups(): IGroupviewPanel[];
-    get activePanel(): IGroupPanel | undefined;
-    get activeGroup(): IGroupviewPanel | undefined;
+    get onDidDrop(): Event<DockviewDropEvent>;
+    get panels(): IDockviewPanel[];
+    get groups(): GroupPanel[];
+    get activePanel(): IDockviewPanel | undefined;
+    get activeGroup(): GroupPanel | undefined;
     constructor(component: IDockviewComponent);
     getTabHeight(): number | undefined;
     setTabHeight(height: number | undefined): void;
     focus(): void;
-    getPanel(id: string): IGroupPanel | undefined;
+    getPanel(id: string): IDockviewPanel | undefined;
     layout(width: number, height: number, force?: boolean): void;
-    addPanel(options: AddPanelOptions): IGroupPanel;
+    addPanel(options: AddPanelOptions): IDockviewPanel;
     addEmptyGroup(options?: AddGroupOptions): void;
     moveToNext(options?: MovementOptions): void;
     moveToPrevious(options?: MovementOptions): void;
     closeAllGroups(): void;
     removeGroup(group: IGroupviewPanel): void;
-    resizeToFit(): void;
-    getGroup(id: string): IGroupviewPanel | undefined;
+    getGroup(id: string): GroupPanel | undefined;
     fromJSON(data: SerializedDockview): void;
     toJSON(): SerializedDockview;
 }

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

@@ -21,6 +21,9 @@ export class SplitviewApi {
     get orientation() {
         return this.component.orientation;
     }
+    get panels() {
+        return this.component.panels;
+    }
     get onDidLayoutFromJSON() {
         return this.component.onDidLayoutFromJSON;
     }
@@ -39,29 +42,17 @@ export class SplitviewApi {
     removePanel(panel, sizing) {
         this.component.removePanel(panel, sizing);
     }
-    setVisible(panel, isVisible) {
-        this.component.setVisible(panel, isVisible);
-    }
-    getPanels() {
-        return this.component.getPanels();
-    }
     focus() {
         this.component.focus();
     }
     getPanel(id) {
         return this.component.getPanel(id);
     }
-    setActive(panel) {
-        this.component.setActive(panel);
-    }
     layout(width, height) {
         return this.component.layout(width, height);
     }
     addPanel(options) {
-        this.component.addPanel(options);
-    }
-    resizeToFit() {
-        this.component.resizeToFit();
+        return this.component.addPanel(options);
     }
     movePanel(from, to) {
         this.component.movePanel(from, to);
@@ -89,6 +80,9 @@ export class PaneviewApi {
     get width() {
         return this.component.width;
     }
+    get panels() {
+        return this.component.panels;
+    }
     get onDidLayoutChange() {
         return this.component.onDidLayoutChange;
     }
@@ -112,9 +106,6 @@ export class PaneviewApi {
         };
         return emitter.event;
     }
-    getPanels() {
-        return this.component.getPanels();
-    }
     removePanel(panel) {
         this.component.removePanel(panel);
     }
@@ -131,10 +122,7 @@ export class PaneviewApi {
         this.component.layout(width, height);
     }
     addPanel(options) {
-        this.component.addPanel(options);
-    }
-    resizeToFit() {
-        this.component.resizeToFit();
+        return this.component.addPanel(options);
     }
     fromJSON(data) {
         this.component.fromJSON(data);
@@ -168,13 +156,13 @@ export class GridviewApi {
     get onDidLayoutChange() {
         return this.component.onDidLayoutChange;
     }
-    get onDidAddGroup() {
+    get onDidAddPanel() {
         return this.component.onDidAddGroup;
     }
-    get onDidRemoveGroup() {
+    get onDidRemovePanel() {
         return this.component.onDidRemoveGroup;
     }
-    get onDidActiveGroupChange() {
+    get onDidActivePanelChange() {
         return this.component.onDidActiveGroupChange;
     }
     get onDidLayoutFromJSON() {
@@ -196,7 +184,7 @@ export class GridviewApi {
         this.component.layout(width, height, force);
     }
     addPanel(options) {
-        this.component.addPanel(options);
+        return this.component.addPanel(options);
     }
     removePanel(panel, sizing) {
         this.component.removePanel(panel, sizing);
@@ -204,21 +192,9 @@ export class GridviewApi {
     movePanel(panel, options) {
         this.component.movePanel(panel, options);
     }
-    resizeToFit() {
-        this.component.resizeToFit();
-    }
     getPanel(id) {
         return this.component.getPanel(id);
     }
-    toggleVisibility(panel) {
-        this.component.toggleVisibility(panel);
-    }
-    setVisible(panel, visible) {
-        this.component.setVisible(panel, visible);
-    }
-    setActive(panel) {
-        this.component.setActive(panel);
-    }
     fromJSON(data) {
         return this.component.fromJSON(data);
     }
@@ -278,6 +254,9 @@ export class DockviewApi {
     get onDidLayoutChange() {
         return this.component.onDidLayoutChange;
     }
+    get onDidDrop() {
+        return this.component.onDidDrop;
+    }
     get panels() {
         return this.component.panels;
     }
@@ -323,9 +302,6 @@ export class DockviewApi {
     removeGroup(group) {
         this.component.removeGroup(group);
     }
-    resizeToFit() {
-        return this.component.resizeToFit();
-    }
     getGroup(id) {
         return this.component.getPanel(id);
     }

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

@@ -1,15 +1,15 @@
 import { Emitter } from '../events';
 import { GridviewPanelApiImpl, GridviewPanelApi } from './gridviewPanelApi';
-import { IGroupPanel } from '../groupview/groupPanel';
-import { GroupviewPanel } from '../groupview/groupviewPanel';
+import { IDockviewPanel } from '../groupview/groupPanel';
+import { GroupPanel } from '../groupview/groupviewPanel';
 export interface TitleEvent {
     readonly title: string;
 }
 export interface SuppressClosableEvent {
     readonly suppressClosable: boolean;
 }
-export interface DockviewPanelApi extends Omit<GridviewPanelApi, 'setVisible' | 'visible'> {
-    readonly group: GroupviewPanel | undefined;
+export interface DockviewPanelApi extends Omit<GridviewPanelApi, 'setVisible'> {
+    readonly group: GroupPanel;
     readonly isGroupActive: boolean;
     readonly title: string;
     readonly suppressClosable: boolean;
@@ -33,9 +33,9 @@ export declare class DockviewPanelApiImpl extends GridviewPanelApiImpl implement
     get title(): string;
     get suppressClosable(): boolean;
     get isGroupActive(): boolean;
-    set group(value: GroupviewPanel | undefined);
-    get group(): GroupviewPanel | undefined;
-    constructor(panel: IGroupPanel, group: GroupviewPanel | undefined);
+    set group(value: GroupPanel);
+    get group(): GroupPanel;
+    constructor(panel: IDockviewPanel, group: GroupPanel);
     setTitle(title: string): void;
     close(): void;
 }

package/dist/esm/api/groupPanelApi.js

@@ -16,7 +16,7 @@ export class DockviewPanelApiImpl extends GridviewPanelApiImpl {
         this._onDidGroupChange = new Emitter();
         this.onDidGroupChange = this._onDidGroupChange.event;
         this.disposable = new MutableDisposable();
-        this.group = group;
+        this._group = group;
         this.addDisposables(this.disposable, this._onDidTitleChange, this._titleChanged, this._suppressClosableChanged, this._onDidGroupChange, this._onDidActiveGroupChange);
     }
     get title() {

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

@@ -18,7 +18,6 @@ export interface PanelApi {
     readonly onDidFocusChange: Event<FocusEvent>;
     readonly onDidVisibilityChange: Event<VisibilityEvent>;
     readonly onDidActiveChange: Event<ActiveEvent>;
-    readonly onFocusEvent: Event<void>;
     setVisible(isVisible: boolean): void;
     setActive(): void;
     /**
@@ -56,7 +55,7 @@ export declare class PanelApiImpl extends CompositeDisposable implements PanelAp
     private _isVisible;
     private _width;
     private _height;
-    readonly _onDidPanelDimensionChange: Emitter<PanelDimensionChangeEvent>;
+    readonly _onDidDimensionChange: Emitter<PanelDimensionChangeEvent>;
     readonly onDidDimensionsChange: Event<PanelDimensionChangeEvent>;
     readonly _onDidChangeFocus: Emitter<FocusEvent>;
     readonly onDidFocusChange: Event<FocusEvent>;

package/dist/esm/api/panelApi.js

@@ -12,10 +12,10 @@ export class PanelApiImpl extends CompositeDisposable {
         this._isVisible = true;
         this._width = 0;
         this._height = 0;
-        this._onDidPanelDimensionChange = new Emitter({
+        this._onDidDimensionChange = new Emitter({
             replay: true,
         });
-        this.onDidDimensionsChange = this._onDidPanelDimensionChange.event;
+        this.onDidDimensionsChange = this._onDidDimensionChange.event;
         //
         this._onDidChangeFocus = new Emitter({
             replay: true,
@@ -40,7 +40,7 @@ export class PanelApiImpl extends CompositeDisposable {
         //
         this._onActiveChange = new Emitter();
         this.onActiveChange = this._onActiveChange.event;
-        this.addDisposables(this._onDidPanelDimensionChange, this._onDidChangeFocus, this._onDidVisibilityChange, this._onDidActiveChange, this._onFocusEvent, this._onActiveChange, this._onVisibilityChange, this.onDidFocusChange((event) => {
+        this.addDisposables(this._onDidDimensionChange, this._onDidChangeFocus, this._onDidVisibilityChange, this._onDidActiveChange, this._onFocusEvent, this._onActiveChange, this._onVisibilityChange, this.onDidFocusChange((event) => {
             this._isFocused = event.isFocused;
         }), this.onDidActiveChange((event) => {
             this._isActive = event.isActive;

package/dist/esm/dnd/droptarget.d.ts

@@ -7,12 +7,13 @@ export declare enum Position {
     Right = "Right",
     Center = "Center"
 }
+declare type Quadrant = 'top' | 'bottom' | 'left' | 'right';
 export interface DroptargetEvent {
     position: Position;
     nativeEvent: DragEvent;
 }
 export declare type DropTargetDirections = 'vertical' | 'horizontal' | 'all' | 'none';
-export declare type CanDisplayOverlay = boolean | ((dragEvent: DragEvent) => boolean);
+export declare type CanDisplayOverlay = boolean | ((dragEvent: DragEvent, state: Quadrant | null) => boolean);
 export declare class Droptarget extends CompositeDisposable {
     private readonly element;
     private readonly options;
@@ -34,3 +35,4 @@ export declare class Droptarget extends CompositeDisposable {
     private calculateQuadrant;
     private removeDropTarget;
 }
+export {};

package/dist/esm/dnd/droptarget.js

@@ -23,12 +23,22 @@ export class Droptarget extends CompositeDisposable {
         this.addDisposables(this._onDrop, new DragAndDropObserver(this.element, {
             onDragEnter: () => undefined,
             onDragOver: (e) => {
+                const width = this.element.clientWidth;
+                const height = this.element.clientHeight;
+                if (width === 0 || height === 0) {
+                    return; // avoid div!0
+                }
+                const x = e.offsetX;
+                const y = e.offsetY;
+                const xp = (100 * x) / width;
+                const yp = (100 * y) / height;
+                const quadrant = this.calculateQuadrant(this.options.validOverlays, xp, yp);
                 if (isBooleanValue(this.options.canDisplayOverlay)) {
                     if (!this.options.canDisplayOverlay) {
                         return;
                     }
                 }
-                else if (!this.options.canDisplayOverlay(e)) {
+                else if (!this.options.canDisplayOverlay(e, quadrant)) {
                     return;
                 }
                 if (!this.target) {
@@ -47,16 +57,6 @@ export class Droptarget extends CompositeDisposable {
                 if (!this.target || !this.overlay) {
                     return;
                 }
-                const width = this.target.clientWidth;
-                const height = this.target.clientHeight;
-                if (width === 0 || height === 0) {
-                    return; // avoid div!0
-                }
-                const x = e.offsetX;
-                const y = e.offsetY;
-                const xp = (100 * x) / width;
-                const yp = (100 * y) / height;
-                const quadrant = this.calculateQuadrant(this.options.validOverlays, xp, yp);
                 const isSmallX = width < 100;
                 const isSmallY = height < 100;
                 this.toggleClasses(quadrant, isSmallX, isSmallY);

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

@@ -1,24 +1,7 @@
 import { CompositeDisposable } from '../../../lifecycle';
 import { ITabRenderer, GroupPanelPartInitParameters } from '../../../groupview/types';
 import { PanelUpdateEvent } from '../../../panel/types';
-import { GroupviewPanel } from '../../../groupview/groupviewPanel';
-export declare class WrappedTab implements ITabRenderer {
-    private readonly renderer;
-    private readonly _element;
-    constructor(renderer: ITabRenderer);
-    get innerRenderer(): ITabRenderer;
-    get element(): HTMLElement;
-    get id(): string;
-    show(): void;
-    hide(): void;
-    layout(width: number, height: number): void;
-    update(event: PanelUpdateEvent): void;
-    toJSON(): object;
-    focus(): void;
-    init(parameters: GroupPanelPartInitParameters): void;
-    updateParentGroup(group: GroupviewPanel, isPanelVisible: boolean): void;
-    dispose(): void;
-}
+import { GroupPanel } from '../../../groupview/groupviewPanel';
 export declare class DefaultTab extends CompositeDisposable implements ITabRenderer {
     private _element;
     private _isPanelVisible;
@@ -37,7 +20,7 @@ export declare class DefaultTab extends CompositeDisposable implements ITabRende
     };
     focus(): void;
     init(params: GroupPanelPartInitParameters): void;
-    updateParentGroup(group: GroupviewPanel, isPanelVisible: boolean): void;
+    updateParentGroup(group: GroupPanel, isPanelVisible: boolean): void;
     layout(_width: number, _height: number): void;
     private render;
 }

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

@@ -1,52 +1,5 @@
 import { CompositeDisposable } from '../../../lifecycle';
 import { addDisposableListener } from '../../../events';
-export class WrappedTab {
-    constructor(renderer) {
-        this.renderer = renderer;
-        this._element = document.createElement('element');
-        this.show();
-    }
-    get innerRenderer() {
-        return this.renderer;
-    }
-    get element() {
-        return this._element;
-    }
-    get id() {
-        return this.renderer.id;
-    }
-    show() {
-        if (!this.renderer.element.parentElement) {
-            this._element.appendChild(this.renderer.element);
-        }
-    }
-    hide() {
-        if (this.renderer.element.parentElement) {
-            this.renderer.element.remove();
-        }
-    }
-    layout(width, height) {
-        this.renderer.layout(width, height);
-    }
-    update(event) {
-        this.renderer.update(event);
-    }
-    toJSON() {
-        return this.renderer.toJSON();
-    }
-    focus() {
-        this.renderer.focus();
-    }
-    init(parameters) {
-        this.renderer.init(parameters);
-    }
-    updateParentGroup(group, isPanelVisible) {
-        this.renderer.updateParentGroup(group, isPanelVisible);
-    }
-    dispose() {
-        this.renderer.dispose();
-    }
-}
 export class DefaultTab extends CompositeDisposable {
     constructor() {
         super();
@@ -109,14 +62,20 @@ export class DefaultTab extends CompositeDisposable {
         }
     }
     updateParentGroup(group, isPanelVisible) {
+        const changed = this._isPanelVisible !== isPanelVisible ||
+            this._isGroupActive !== group.isActive;
         this._isPanelVisible = isPanelVisible;
         this._isGroupActive = group.isActive;
-        this.render();
+        if (changed) {
+            this.render();
+        }
     }
     layout(_width, _height) {
         // noop
     }
     render() {
-        this._content.textContent = this.params.title;
+        if (this._content.textContent !== this.params.title) {
+            this._content.textContent = this.params.title;
+        }
     }
 }

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

@@ -1,6 +1,6 @@
 import { GroupPanelPartInitParameters, IWatermarkRenderer } from '../../../groupview/types';
 import { CompositeDisposable } from '../../../lifecycle';
-import { GroupviewPanel } from '../../../groupview/groupviewPanel';
+import { GroupPanel } from '../../../groupview/groupviewPanel';
 import { PanelUpdateEvent } from '../../../panel/types';
 export declare class Watermark extends CompositeDisposable implements IWatermarkRenderer {
     private _element;
@@ -13,7 +13,7 @@ export declare class Watermark extends CompositeDisposable implements IWatermark
     toJSON(): {};
     layout(_width: number, _height: number): void;
     init(params: GroupPanelPartInitParameters): void;
-    updateParentGroup(group: GroupviewPanel, _visible: boolean): void;
+    updateParentGroup(group: GroupPanel, _visible: boolean): void;
     get element(): HTMLElement;
     private render;
     dispose(): void;

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

@@ -1,6 +1,5 @@
-import { WrappedTab } from './components/tab/defaultTab';
 import { GroupPanelPartInitParameters, IActionsRenderer, IContentRenderer, ITabRenderer } from '../groupview/types';
-import { GroupviewPanel } from '../groupview/groupviewPanel';
+import { GroupPanel } from '../groupview/groupviewPanel';
 import { IDisposable } from '../lifecycle';
 import { GroupPanelUpdateEvent } from '../groupview/groupPanel';
 export interface IGroupPanelView extends IDisposable {
@@ -10,7 +9,7 @@ export interface IGroupPanelView extends IDisposable {
     update(event: GroupPanelUpdateEvent): void;
     layout(width: number, height: number): void;
     init(params: GroupPanelPartInitParameters): void;
-    updateParentGroup(group: GroupviewPanel, isPanelVisible: boolean): void;
+    updateParentGroup(group: GroupPanel, isPanelVisible: boolean): void;
     toJSON(): {};
 }
 export declare class DefaultGroupPanelView implements IGroupPanelView {
@@ -18,7 +17,7 @@ export declare class DefaultGroupPanelView implements IGroupPanelView {
     private readonly _tab;
     private readonly _actions;
     get content(): IContentRenderer;
-    get tab(): WrappedTab;
+    get tab(): ITabRenderer;
     get actions(): IActionsRenderer | undefined;
     constructor(renderers: {
         content: IContentRenderer;
@@ -26,7 +25,7 @@ export declare class DefaultGroupPanelView implements IGroupPanelView {
         actions?: IActionsRenderer;
     });
     init(params: GroupPanelPartInitParameters): void;
-    updateParentGroup(group: GroupviewPanel, isPanelVisible: boolean): void;
+    updateParentGroup(group: GroupPanel, isPanelVisible: boolean): void;
     layout(width: number, height: number): void;
     update(event: GroupPanelUpdateEvent): void;
     toJSON(): {};

package/dist/esm/dockview/defaultGroupPanelView.js

@@ -1,9 +1,9 @@
-import { DefaultTab, WrappedTab } from './components/tab/defaultTab';
+import { DefaultTab } from './components/tab/defaultTab';
 export class DefaultGroupPanelView {
     constructor(renderers) {
         var _a;
         this._content = renderers.content;
-        this._tab = new WrappedTab((_a = renderers.tab) !== null && _a !== void 0 ? _a : new DefaultTab());
+        this._tab = (_a = renderers.tab) !== null && _a !== void 0 ? _a : new DefaultTab();
         this._actions =
             renderers.actions ||
                 (this.content.actions
@@ -43,9 +43,7 @@ export class DefaultGroupPanelView {
     toJSON() {
         return {
             content: this.content.toJSON(),
-            tab: this.tab.innerRenderer instanceof DefaultTab
-                ? undefined
-                : this.tab.toJSON(),
+            tab: this.tab instanceof DefaultTab ? undefined : this.tab.toJSON(),
         };
     }
     dispose() {

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

@@ -1,14 +1,17 @@
 import { IGridView, ISerializedLeafNode, IViewDeserializer } from '../gridview/gridview';
-import { GroupviewPanelState, IGroupPanel } from '../groupview/groupPanel';
+import { GroupviewPanelState, IDockviewPanel } from '../groupview/groupPanel';
+import { GroupPanelViewState } from '../groupview/groupview';
+import { GroupPanel } from '../groupview/groupviewPanel';
 import { DockviewComponent } from './dockviewComponent';
 export interface IPanelDeserializer {
-    fromJSON(panelData: GroupviewPanelState): IGroupPanel;
+    fromJSON(panelData: GroupviewPanelState, group: GroupPanel): IDockviewPanel;
+}
+export interface PanelDeserializerOptions {
+    createPanel: (id: string, group: GroupPanel) => IDockviewPanel;
 }
 export declare class DefaultDeserializer implements IViewDeserializer {
     private readonly layout;
     private panelDeserializer;
-    constructor(layout: DockviewComponent, panelDeserializer: {
-        createPanel: (id: string) => IGroupPanel;
-    });
-    fromJSON(node: ISerializedLeafNode): IGridView;
+    constructor(layout: DockviewComponent, panelDeserializer: PanelDeserializerOptions);
+    fromJSON(node: ISerializedLeafNode<GroupPanelViewState>): IGridView;
 }