expose params object for dockview panels

packages/dockview/src/__tests__/api/component.api.spec.ts

@@ -85,7 +85,6 @@ describe('component.api', () => {
                 'maximumWidth',
                 'width',
                 'height',
-                'onGridEvent',
                 'onDidLayoutChange',
                 'orientation',
                 'focus',
@@ -124,7 +123,6 @@ describe('component.api', () => {
                 'height',
                 'size',
                 'totalPanels',
-                'onGridEvent',
                 'onDidLayoutChange',
                 'panels',
                 'groups',

packages/dockview/src/__tests__/dockview/dockviewComponent.spec.ts

@@ -12,10 +12,6 @@ import { Orientation } from '../../splitview/core/splitview';
 import { ReactPanelDeserialzier } from '../../react/deserializer';
 import { Position } from '../../dnd/droptarget';
 import { GroupviewPanel } from '../../groupview/groupviewPanel';
-import {
-    GroupChangeEvent,
-    GroupChangeKind,
-} from '../../gridview/baseComponentGridview';
 import { CompositeDisposable } from '../../lifecycle';
 import {
     GroupPanelUpdateEvent,
@@ -117,6 +113,10 @@ class TestGroupPanel implements IGroupPanel {
         );
     }
 
+    get params(): Record<string, any> {
+        return {};
+    }
+
     get group(): GroupviewPanel | undefined {
         return this._group;
     }
@@ -732,18 +732,16 @@ describe('dockviewComponent', () => {
 
         let counter = 0;
 
-        const disposable = dockview.onGridEvent((e) => {
+        const disposable = new CompositeDisposable(
-            switch (e.kind) {
+            dockview.onDidAddPanel(() => {
-                case GroupChangeKind.ADD_PANEL:
+                counter++;
-                    counter++;
+                expect(counter).toBe(dockview.totalPanels);
-                    expect(counter).toBe(dockview.totalPanels);
+            }),
-                    break;
+            dockview.onDidRemovePanel(() => {
-                case GroupChangeKind.REMOVE_PANEL:
+                counter--;
-                    counter--;
+                expect(counter).toBe(dockview.totalPanels);
-                    expect(counter).toBe(dockview.totalPanels);
+            })
-                    break;
+        );
-            }
-        });
 
         const panel1 = dockview.addPanel({
             id: 'panel1',
@@ -774,18 +772,16 @@ describe('dockviewComponent', () => {
 
         let counter = 0;
 
-        const disposable = dockview.onGridEvent((e) => {
+        const disposable = new CompositeDisposable(
-            switch (e.kind) {
+            dockview.onDidAddGroup(() => {
-                case GroupChangeKind.ADD_GROUP:
+                counter++;
-                    counter++;
+                expect(counter).toBe(dockview.size);
-                    expect(counter).toBe(dockview.size);
+            }),
-                    break;
+            dockview.onDidRemoveGroup(() => {
-                case GroupChangeKind.REMOVE_GROUP:
+                counter--;
-                    counter--;
+                expect(counter).toBe(dockview.size);
-                    expect(counter).toBe(dockview.size);
+            })
-                    break;
+        );
-            }
-        });
 
         const panel1 = dockview.addPanel({
             id: 'panel1',
@@ -814,18 +810,45 @@ describe('dockviewComponent', () => {
     test('events flow', () => {
         dockview.layout(1000, 1000);
 
-        let events: GroupChangeEvent[] = [];
+        let events: {
-        const disposable = dockview.onGridEvent((e) => events.push(e));
+            panel?: IGroupPanel;
+            group?: GroupviewPanel | undefined;
+            type: string;
+        }[] = [];
+
+        const disposable = new CompositeDisposable(
+            dockview.onDidAddGroup((group) => {
+                events.push({ type: 'ADD_GROUP', group });
+            }),
+            dockview.onDidActiveGroupChange((group) => {
+                events.push({ type: 'ACTIVE_GROUP', group });
+            }),
+            dockview.onDidRemoveGroup((group) => {
+                events.push({ type: 'REMOVE_GROUP', group });
+            }),
+            dockview.onDidAddPanel((panel) => {
+                events.push({ type: 'ADD_PANEL', panel });
+            }),
+            dockview.onDidRemovePanel((panel) => {
+                events.push({ type: 'REMOVE_PANEL', panel });
+            }),
+            dockview.onDidActivePanelChange((panel) => {
+                events.push({ type: 'ACTIVE_PANEL', panel });
+            })
+        );
 
         const panel1 = dockview.addPanel({
             id: 'panel1',
             component: 'default',
         });
+
+        expect(panel1.group).toBeTruthy();
+
         expect(events).toEqual([
-            { kind: GroupChangeKind.ADD_GROUP },
+            { type: 'ADD_GROUP', group: panel1.group },
-            { kind: GroupChangeKind.GROUP_ACTIVE },
+            { type: 'ACTIVE_GROUP', group: panel1.group },
-            { kind: GroupChangeKind.ADD_PANEL, panel: panel1 },
+            { type: 'ADD_PANEL', panel: panel1 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel1 },
+            { type: 'ACTIVE_PANEL', panel: panel1 },
         ]);
 
         events = [];
@@ -834,8 +857,8 @@ describe('dockviewComponent', () => {
             component: 'default',
         });
         expect(events).toEqual([
-            { kind: GroupChangeKind.ADD_PANEL, panel: panel2 },
+            { type: 'ADD_PANEL', panel: panel2 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel2 },
+            { type: 'ACTIVE_PANEL', panel: panel2 },
         ]);
 
         events = [];
@@ -844,21 +867,19 @@ describe('dockviewComponent', () => {
             component: 'default',
         });
         expect(events).toEqual([
-            { kind: GroupChangeKind.ADD_PANEL, panel: panel3 },
+            { type: 'ADD_PANEL', panel: panel3 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel3 },
+            { type: 'ACTIVE_PANEL', panel: panel3 },
         ]);
 
         events = [];
         dockview.removePanel(panel1);
-        expect(events).toEqual([
+        expect(events).toEqual([{ type: 'REMOVE_PANEL', panel: panel1 }]);
-            { kind: GroupChangeKind.REMOVE_PANEL, panel: panel1 },
-        ]);
 
         events = [];
         dockview.removePanel(panel3);
         expect(events).toEqual([
-            { kind: GroupChangeKind.REMOVE_PANEL, panel: panel3 },
+            { type: 'REMOVE_PANEL', panel: panel3 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel2 },
+            { type: 'ACTIVE_PANEL', panel: panel2 },
         ]);
 
         events = [];
@@ -867,11 +888,15 @@ describe('dockviewComponent', () => {
             component: 'default',
             position: { referencePanel: panel2.id, direction: 'right' },
         });
+
+        expect(panel4.group).toBeTruthy();
+        expect(panel4.group).not.toBe(panel1.group);
+
         expect(events).toEqual([
-            { kind: GroupChangeKind.ADD_GROUP },
+            { type: 'ADD_GROUP', group: panel4.group },
-            { kind: GroupChangeKind.GROUP_ACTIVE },
+            { type: 'ACTIVE_GROUP', group: panel4.group },
-            { kind: GroupChangeKind.ADD_PANEL, panel: panel4 },
+            { type: 'ADD_PANEL', panel: panel4 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel4 },
+            { type: 'ACTIVE_PANEL', panel: panel4 },
         ]);
 
         events = [];
@@ -881,8 +906,8 @@ describe('dockviewComponent', () => {
             position: { referencePanel: panel4.id, direction: 'within' },
         });
         expect(events).toEqual([
-            { kind: GroupChangeKind.ADD_PANEL, panel: panel5 },
+            { type: 'ADD_PANEL', panel: panel5 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel5 },
+            { type: 'ACTIVE_PANEL', panel: panel5 },
         ]);
 
         events = [];
@@ -893,26 +918,30 @@ describe('dockviewComponent', () => {
             Position.Center
         );
         expect(events).toEqual([
-            { kind: GroupChangeKind.REMOVE_PANEL, panel: panel5 },
+            { type: 'REMOVE_PANEL', panel: panel5 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel4 },
+            { type: 'ACTIVE_PANEL', panel: panel4 },
-            { kind: GroupChangeKind.ADD_PANEL, panel: panel5 },
+            { type: 'ADD_PANEL', panel: panel5 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel5 },
+            { type: 'ACTIVE_PANEL', panel: panel5 },
-            { kind: GroupChangeKind.GROUP_ACTIVE },
+            { type: 'ACTIVE_GROUP', group: panel2.group },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel5 },
+            { type: 'ACTIVE_PANEL', panel: panel5 },
         ]);
 
         events = [];
+
+        const groupReferenceBeforeMove = panel4.group;
+
         dockview.moveGroupOrPanel(
             panel2.group!,
             panel4.group!.id,
             panel4.id,
             Position.Center
         );
+
         expect(events).toEqual([
-            { kind: GroupChangeKind.REMOVE_PANEL, panel: panel4 },
+            { type: 'REMOVE_PANEL', panel: panel4 },
-            { kind: GroupChangeKind.REMOVE_GROUP },
+            { type: 'REMOVE_GROUP', group: groupReferenceBeforeMove },
-            { kind: GroupChangeKind.ADD_PANEL, panel: panel4 },
+            { type: 'ADD_PANEL', panel: panel4 },
-            { kind: GroupChangeKind.PANEL_ACTIVE, panel: panel4 },
+            { type: 'ACTIVE_PANEL', panel: panel4 },
         ]);
 
         disposable.dispose();

packages/dockview/src/__tests__/gridview/gridviewComponent.spec.ts

@@ -1,9 +1,6 @@
-import {
-    GroupChangeEvent,
-    GroupChangeKind,
-} from '../../gridview/baseComponentGridview';
 import { GridviewComponent } from '../../gridview/gridviewComponent';
 import { GridviewPanel } from '../../gridview/gridviewPanel';
+import { CompositeDisposable } from '../../lifecycle';
 import { IFrameworkPart } from '../../panel/types';
 import { Orientation } from '../../splitview/core/splitview';
 
@@ -314,20 +311,35 @@ describe('gridview', () => {
 
         gridview.layout(800, 400);
 
-        let events: GroupChangeEvent[] = [];
+        let events: { group: GridviewPanel | undefined; type: string }[] = [];
-        const disposable = gridview.onGridEvent((e) => events.push(e));
+
+        const disposable = new CompositeDisposable(
+            gridview.onDidAddGroup((group) => {
+                events.push({ type: 'ADD', group });
+            }),
+            gridview.onDidActiveGroupChange((group) => {
+                events.push({ type: 'ACTIVE', group });
+            }),
+            gridview.onDidRemoveGroup((group) => {
+                events.push({ type: 'REMOVE', group });
+            })
+        );
 
         gridview.addPanel({
             id: 'panel_1',
             component: 'default',
         });
 
+        const panel1 = gridview.getPanel('panel_1');
+
         expect(events).toEqual([
             {
-                kind: GroupChangeKind.ADD_GROUP,
+                type: 'ADD',
+                group: panel1,
             },
             {
-                kind: GroupChangeKind.GROUP_ACTIVE,
+                type: 'ACTIVE',
+                group: panel1,
             },
         ]);
         events = [];
@@ -337,12 +349,16 @@ describe('gridview', () => {
             component: 'default',
         });
 
+        const panel2 = gridview.getPanel('panel_2');
+
         expect(events).toEqual([
             {
-                kind: GroupChangeKind.ADD_GROUP,
+                type: 'ADD',
+                group: panel2,
             },
             {
-                kind: GroupChangeKind.GROUP_ACTIVE,
+                type: 'ACTIVE',
+                group: panel2,
             },
         ]);
         events = [];
@@ -352,36 +368,40 @@ describe('gridview', () => {
             component: 'default',
         });
 
+        const panel3 = gridview.getPanel('panel_3');
+
         expect(events).toEqual([
             {
-                kind: GroupChangeKind.ADD_GROUP,
+                type: 'ADD',
+                group: panel3,
             },
             {
-                kind: GroupChangeKind.GROUP_ACTIVE,
+                type: 'ACTIVE',
+                group: panel3,
             },
         ]);
         events = [];
 
-        const panel1 = gridview.getPanel('panel_1');
-        const panel2 = gridview.getPanel('panel_2');
-        const panel3 = gridview.getPanel('panel_3');
-
         gridview.removePanel(panel2);
 
         expect(events).toEqual([
             {
-                kind: GroupChangeKind.REMOVE_GROUP,
+                type: 'REMOVE',
+                group: panel2,
             },
         ]);
         events = [];
 
         gridview.removePanel(panel3);
+
         expect(events).toEqual([
             {
-                kind: GroupChangeKind.REMOVE_GROUP,
+                type: 'REMOVE',
+                group: panel3,
             },
             {
-                kind: GroupChangeKind.GROUP_ACTIVE,
+                type: 'ACTIVE',
+                group: panel1,
             },
         ]);
         events = [];
@@ -390,10 +410,12 @@ describe('gridview', () => {
 
         expect(events).toEqual([
             {
-                kind: GroupChangeKind.REMOVE_GROUP,
+                type: 'REMOVE',
+                group: panel1,
             },
             {
-                kind: GroupChangeKind.GROUP_ACTIVE,
+                type: 'ACTIVE',
+                group: undefined,
             },
         ]);
         events = [];

packages/dockview/src/__tests__/groupview/groupview.spec.ts

@@ -150,6 +150,10 @@ class TestPanel implements IGroupPanel {
         return this._view;
     }
 
+    get params(): Record<string, any> {
+        return {};
+    }
+
     constructor(public readonly id: string, public api: DockviewPanelApi) {
         this.init({
             view: new DefaultGroupPanelView({

packages/dockview/src/api/component.api.ts

@@ -7,7 +7,7 @@ import {
     AddPanelOptions,
     MovementOptions,
 } from '../dockview/options';
-import { Direction, GroupChangeEvent } from '../gridview/baseComponentGridview';
+import { Direction } from '../gridview/baseComponentGridview';
 import {
     AddComponentOptions,
     IGridviewComponent,
@@ -247,10 +247,6 @@ export class GridviewApi implements CommonApi {
         return this.component.height;
     }
 
-    get onGridEvent(): Event<GroupChangeEvent> {
-        return this.component.onGridEvent;
-    }
-
     get onDidLayoutChange(): Event<void> {
         return this.component.onDidLayoutChange;
     }
@@ -370,10 +366,6 @@ export class DockviewApi implements CommonApi {
         return this.component.totalPanels;
     }
 
-    get onGridEvent(): Event<GroupChangeEvent> {
-        return this.component.onGridEvent;
-    }
-
     get onDidActiveGroupChange(): Event<IGroupviewPanel | undefined> {
         return this.component.onDidActiveGroupChange;
     }

packages/dockview/src/dockview/deserializer.ts

@@ -13,7 +13,9 @@ export interface IPanelDeserializer {
 export class DefaultDeserializer implements IViewDeserializer {
     constructor(
         private readonly layout: DockviewComponent,
-        private panelDeserializer: { createPanel: (id: string) => IGroupPanel }
+        private panelDeserializer: {
+            createPanel: (id: string) => IGroupPanel;
+        }
     ) {}
 
     public fromJSON(node: ISerializedLeafNode): IGridView {

packages/dockview/src/dockview/dockviewComponent.ts

@@ -27,7 +27,6 @@ import {
 } from './options';
 import {
     BaseGrid,
-    GroupChangeKind,
     IBaseGrid,
     toTarget,
 } from '../gridview/baseComponentGridview';
@@ -207,7 +206,14 @@ export class DockviewComponent
         this.addDisposables(
             this._onTabInteractionEvent,
             this._onTabContextMenu,
-            this._onDidDrop
+            this._onDidDrop,
+            Event.any(
+                this.onDidAddPanel,
+                this.onDidRemovePanel,
+                this.onDidActivePanelChange
+            )(() => {
+                this._bufferOnDidLayoutChange.fire();
+            })
         );
 
         this._options = options;
@@ -377,7 +383,6 @@ export class DockviewComponent
 
         this.gridview.layout(this.width, this.height);
 
-        this._onGridEvent.fire({ kind: GroupChangeKind.LAYOUT_FROM_JSON });
         this._onDidLayoutfromJSON.fire();
     }
 
@@ -515,7 +520,9 @@ export class DockviewComponent
         const panels = [...group.model.panels]; // reassign since group panels will mutate
 
         for (const panel of panels) {
-            this.removePanel(panel, { removeEmptyGroup: false });
+            this.removePanel(panel, {
+                removeEmptyGroup: false,
+            });
         }
 
         super.doRemoveGroup(group, { skipActive });
@@ -612,10 +619,6 @@ export class DockviewComponent
         super.doSetGroupActive(group, skipFocus);
 
         if (!isGroupAlreadyFocused && this._activeGroup?.model.activePanel) {
-            this._onGridEvent.fire({
-                kind: GroupChangeKind.PANEL_ACTIVE,
-                panel: this._activeGroup?.model.activePanel,
-            });
             this._onDidActivePanelChange.fire(
                 this._activeGroup?.model.activePanel
             );
@@ -660,28 +663,16 @@ export class DockviewComponent
                 view.model.onDidGroupChange((event) => {
                     switch (event.kind) {
                         case GroupChangeKind2.ADD_PANEL:
-                            this._onGridEvent.fire({
-                                kind: GroupChangeKind.ADD_PANEL,
-                                panel: event.panel,
-                            });
                             if (event.panel) {
                                 this._onDidAddPanel.fire(event.panel);
                             }
                             break;
                         case GroupChangeKind2.REMOVE_PANEL:
-                            this._onGridEvent.fire({
-                                kind: GroupChangeKind.REMOVE_PANEL,
-                                panel: event.panel,
-                            });
                             if (event.panel) {
                                 this._onDidRemovePanel.fire(event.panel);
                             }
                             break;
                         case GroupChangeKind2.PANEL_ACTIVE:
-                            this._onGridEvent.fire({
-                                kind: GroupChangeKind.PANEL_ACTIVE,
-                                panel: event.panel,
-                            });
                             this._onDidActivePanelChange.fire(event.panel);
                             break;
                     }
@@ -708,11 +699,7 @@ export class DockviewComponent
             tab: this.createTabComponent(options.id, options.tabComponent),
         });
 
-        const panel: IGroupPanel = new DockviewGroupPanel(
+        const panel = new DockviewGroupPanel(options.id, this, this._api);
-            options.id,
-            this,
-            this._api
-        );
         panel.init({
             view,
             title: options.title || options.id,

packages/dockview/src/dockview/dockviewGroupPanel.ts

@@ -27,6 +27,10 @@ export class DockviewGroupPanel
     private _title: string;
     private _suppressClosable: boolean;
 
+    get params() {
+        return this._params?.params;
+    }
+
     get title() {
         return this._title;
     }

packages/dockview/src/gridview/baseComponentGridview.ts

@@ -10,24 +10,6 @@ import {
 } from '../splitview/core/splitview';
 import { IPanel } from '../panel/types';
 import { MovementOptions2 } from '../dockview/options';
-import { IGroupPanel } from '../groupview/groupPanel';
-
-export enum GroupChangeKind {
-    ADD_PANEL = 'ADD_PANEL',
-    REMOVE_PANEL = 'REMOVE_PANEL',
-    PANEL_ACTIVE = 'PANEL_ACTIVE',
-    //
-    GROUP_ACTIVE = 'GROUP_ACTIVE',
-    ADD_GROUP = 'ADD_GROUP',
-    REMOVE_GROUP = 'REMOVE_GROUP',
-    //
-    LAYOUT_FROM_JSON = 'LAYOUT_FROM_JSON',
-    LAYOUT = 'LAYOUT',
-}
-export interface GroupChangeEvent {
-    readonly kind: GroupChangeKind;
-    readonly panel?: IGroupPanel;
-}
 
 const nextLayoutId = sequentialNumberGenerator();
 
@@ -72,7 +54,6 @@ export interface IBaseGrid<T extends IGridPanelView> {
     readonly activeGroup: T | undefined;
     readonly size: number;
     readonly groups: T[];
-    readonly onGridEvent: Event<GroupChangeEvent>;
     readonly onDidLayoutChange: Event<void>;
     readonly onDidRemoveGroup: Event<T>;
     readonly onDidAddGroup: Event<T>;
@@ -95,9 +76,6 @@ export abstract class BaseGrid<T extends IGridPanelView>
     protected readonly gridview: Gridview;
     //
     protected _activeGroup: T | undefined;
-    //
-    protected readonly _onGridEvent = new Emitter<GroupChangeEvent>();
-    readonly onGridEvent: Event<GroupChangeEvent> = this._onGridEvent.event;
 
     private _onDidLayoutChange = new Emitter<void>();
     readonly onDidLayoutChange = this._onDidLayoutChange.event;
@@ -112,6 +90,8 @@ export abstract class BaseGrid<T extends IGridPanelView>
     readonly onDidActiveGroupChange: Event<T | undefined> =
         this._onDidActiveGroupChange.event;
 
+    protected readonly _bufferOnDidLayoutChange = new TickDelayedEvent();
+
     get id() {
         return this._id;
     }
@@ -171,36 +151,22 @@ export abstract class BaseGrid<T extends IGridPanelView>
 
         this.addDisposables(
             this.gridview.onDidChange(() => {
-                this._onGridEvent.fire({ kind: GroupChangeKind.LAYOUT });
+                this._onDidLayoutChange.fire();
             })
         );
 
         this.addDisposables(
-            (() => {
+            Event.any(
-                const tickDelayedEvent = new TickDelayedEvent();
+                this.onDidAddGroup,
-
+                this.onDidRemoveGroup,
-                return new CompositeDisposable(
+                this.onDidActiveGroupChange
-                    this.onGridEvent((event) => {
+            )(() => {
-                        if (
+                this._bufferOnDidLayoutChange.fire();
-                            [
+            }),
-                                GroupChangeKind.ADD_GROUP,
+            this._bufferOnDidLayoutChange.onEvent(() => {
-                                GroupChangeKind.REMOVE_GROUP,
+                this._onDidLayoutChange.fire();
-                                GroupChangeKind.ADD_PANEL,
+            }),
-                                GroupChangeKind.REMOVE_PANEL,
+            this._bufferOnDidLayoutChange
-                                GroupChangeKind.GROUP_ACTIVE,
-                                GroupChangeKind.PANEL_ACTIVE,
-                                GroupChangeKind.LAYOUT,
-                            ].includes(event.kind)
-                        ) {
-                            tickDelayedEvent.fire();
-                        }
-                    }),
-                    tickDelayedEvent.onEvent(() => {
-                        this._onDidLayoutChange.fire();
-                    }),
-                    tickDelayedEvent
-                );
-            })()
         );
     }
 
@@ -210,7 +176,7 @@ export abstract class BaseGrid<T extends IGridPanelView>
 
     public setVisible(panel: T, visible: boolean) {
         this.gridview.setViewVisible(getGridLocation(panel.element), visible);
-        this._onGridEvent.fire({ kind: GroupChangeKind.LAYOUT });
+        this._onDidLayoutChange.fire();
     }
 
     public isVisible(panel: T) {
@@ -220,7 +186,6 @@ export abstract class BaseGrid<T extends IGridPanelView>
     protected doAddGroup(group: T, location: number[] = [0], size?: number) {
         this.gridview.addView(group, size ?? Sizing.Distribute, location);
 
-        this._onGridEvent.fire({ kind: GroupChangeKind.ADD_GROUP });
         this._onDidAddGroup.fire(group);
 
         this.doSetGroupActive(group);
@@ -243,7 +208,6 @@ export abstract class BaseGrid<T extends IGridPanelView>
             this._groups.delete(group.id);
         }
 
-        this._onGridEvent.fire({ kind: GroupChangeKind.REMOVE_GROUP });
         this._onDidRemoveGroup.fire(group);
 
         if (!options?.skipActive && this._activeGroup === group) {
@@ -281,9 +245,6 @@ export abstract class BaseGrid<T extends IGridPanelView>
 
         this._activeGroup = group;
 
-        this._onGridEvent.fire({
-            kind: GroupChangeKind.GROUP_ACTIVE,
-        });
         this._onDidActiveGroupChange.fire(group);
     }
 
@@ -352,7 +313,6 @@ export abstract class BaseGrid<T extends IGridPanelView>
     public dispose(): void {
         super.dispose();
 
-        this._onGridEvent.dispose();
         this._onDidActiveGroupChange.dispose();
         this._onDidAddGroup.dispose();
         this._onDidRemoveGroup.dispose();

packages/dockview/src/gridview/gridviewComponent.ts

@@ -11,7 +11,6 @@ import { GridviewComponentOptions } from './options';
 import {
     BaseGrid,
     Direction,
-    GroupChangeKind,
     IBaseGrid,
     IGridPanelView,
     toTarget,
@@ -253,7 +252,6 @@ export class GridviewComponent
             }
         }
 
-        this._onGridEvent.fire({ kind: GroupChangeKind.LAYOUT_FROM_JSON });
         this._onDidLayoutfromJSON.fire();
     }
 

packages/dockview/src/groupview/groupPanel.ts

@@ -28,6 +28,7 @@ export interface IGroupPanel extends IDisposable, IPanel {
     readonly api: DockviewPanelApi;
     readonly title: string;
     readonly suppressClosable: boolean;
+    readonly params: Record<string, any> | undefined;
     updateParentGroup(group: GroupviewPanel, isGroupActive: boolean): void;
     init(params: IGroupPanelInitParameters): void;
     toJSON(): GroupviewPanelState;