refactor: moving files

packages/dockview-core/src/__tests__/__mocks__/mockDockviewPanelMode.ts

@@ -1,11 +1,11 @@
 import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel';
-import { DockviewGroupPanel } from '../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
 import {
     GroupPanelPartInitParameters,
     GroupPanelUpdateEvent,
     IContentRenderer,
     ITabRenderer,
-} from '../../groupview/types';
+} from '../../dockview/types';
 
 export class DockviewPanelModelMock implements IDockviewPanelModel {
     constructor(

packages/dockview-core/src/__tests__/api/dockviewPanelApi.spec.ts

@@ -1,7 +1,7 @@
 import { DockviewPanelApiImpl, TitleEvent } from '../../api/dockviewPanelApi';
 import { DockviewComponent } from '../../dockview/dockviewComponent';
 import { DockviewPanel, IDockviewPanel } from '../../dockview/dockviewPanel';
-import { DockviewGroupPanel } from '../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
 
 describe('groupPanelApi', () => {
     test('title', () => {

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

@@ -3,15 +3,13 @@ import {
     GroupPanelPartInitParameters,
     IContentRenderer,
     ITabRenderer,
-} from '../../groupview/types';
-import { PanelUpdateEvent } from '../../panel/types';
-import { Orientation } from '../../splitview/core/splitview';
-import { CompositeDisposable } from '../../lifecycle';
-import {
     GroupPanelUpdateEvent,
     GroupviewPanelState,
     IGroupPanelInitParameters,
-} from '../../groupview/types';
+} from '../../dockview/types';
+import { PanelUpdateEvent } from '../../panel/types';
+import { Orientation } from '../../splitview/core/splitview';
+import { CompositeDisposable } from '../../lifecycle';
 import { Emitter } from '../../events';
 import { IDockviewPanel } from '../../dockview/dockviewPanel';
 import {
@@ -22,7 +20,7 @@ import { DefaultDockviewDeserialzier } from '../../dockview/deserializer';
 import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel';
 import { DockviewPanelModelMock } from '../__mocks__/mockDockviewPanelMode';
 import { DefaultTab } from '../../dockview/components/tab/defaultTab';
-import { DockviewGroupPanel } from '../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
 
 class PanelContentPartTest implements IContentRenderer {
     element: HTMLElement = document.createElement('div');

packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts

@@ -2,7 +2,7 @@ import { DockviewComponent } from '../../dockview/dockviewComponent';
 import { DockviewApi } from '../../api/component.api';
 import { DockviewPanel } from '../../dockview/dockviewPanel';
 import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel';
-import { DockviewGroupPanel } from '../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
 
 describe('dockviewPanel', () => {
     test('update title', () => {

packages/dockview-core/src/__tests__/dockview/dockviewPanelModel.spec.ts

@@ -3,7 +3,7 @@ import {
     IDockviewComponent,
 } from '../../dockview/dockviewComponent';
 import { DockviewPanelModel } from '../../dockview/dockviewPanelModel';
-import { IContentRenderer, ITabRenderer } from '../../groupview/types';
+import { IContentRenderer, ITabRenderer } from '../../dockview/types';
 
 describe('dockviewGroupPanel', () => {
     test('that dispose is called on content and tab renderers when present', () => {

packages/dockview-core/src/__tests__/gridview/gridviewPanel.spec.ts

@@ -1,5 +1,5 @@
 import { DockviewComponent } from '../../dockview/dockviewComponent';
-import { DockviewGroupPanel } from '../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
 
 describe('gridviewPanel', () => {
     test('get panel', () => {

packages/dockview-core/src/__tests__/groupview/dockviewGroupPanelModel.spec.ts

@@ -3,18 +3,16 @@ import {
     GroupPanelUpdateEvent,
     GroupviewPanelState,
     IGroupPanelInitParameters,
-} from '../../groupview/types';
-import {
     GroupPanelPartInitParameters,
     IContentRenderer,
     ITabRenderer,
     IWatermarkRenderer,
-} from '../../groupview/types';
+} from '../../dockview/types';
 import { PanelUpdateEvent } from '../../panel/types';
 import {
     DockviewGroupPanelModel,
     GroupOptions,
-} from '../../groupview/dockviewGroupPanelModel';
+} from '../../dockview/dockviewGroupPanelModel';
 import { fireEvent } from '@testing-library/dom';
 import { LocalSelectionTransfer, PanelTransfer } from '../../dnd/dataTransfer';
 import { CompositeDisposable } from '../../lifecycle';
@@ -24,7 +22,7 @@ import {
     IDockviewPanelModel,
     DockviewPanelModel,
 } from '../../dockview/dockviewPanelModel';
-import { DockviewGroupPanel } from '../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
 
 enum GroupChangeKind2 {
     ADD_PANEL,

packages/dockview-core/src/__tests__/groupview/panel/content.spec.ts

@@ -1,10 +1,10 @@
 import { fireEvent } from '@testing-library/dom';
 import { Emitter, Event } from '../../../events';
-import { ContentContainer } from '../../../groupview/panel/content';
+import { ContentContainer } from '../../../dockview/components/panel/content';
 import {
     GroupPanelContentPartInitParameters,
     IContentRenderer,
-} from '../../../groupview/types';
+} from '../../../dockview/types';
 import { CompositeDisposable } from '../../../lifecycle';
 import { PanelUpdateEvent } from '../../../panel/types';
 import { IDockviewPanel } from '../../../dockview/dockviewPanel';

packages/dockview-core/src/__tests__/groupview/tab.spec.ts

@@ -1,9 +1,9 @@
 import { fireEvent } from '@testing-library/dom';
 import { LocalSelectionTransfer, PanelTransfer } from '../../dnd/dataTransfer';
 import { DockviewComponent } from '../../dockview/dockviewComponent';
-import { DockviewGroupPanel } from '../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
-import { DockviewGroupPanelModel } from '../../groupview/dockviewGroupPanelModel';
+import { DockviewGroupPanelModel } from '../../dockview/dockviewGroupPanelModel';
-import { Tab } from '../../groupview/tab';
+import { Tab } from '../../dockview/components/tab/tab';
 
 describe('tab', () => {
     test('that empty tab has inactive-tab class', () => {

packages/dockview-core/src/__tests__/groupview/titlebar/tabsContainer.spec.ts

@@ -1,13 +1,13 @@
 import { DockviewComponent } from '../../../dockview/dockviewComponent';
-import { TabsContainer } from '../../../groupview/titlebar/tabsContainer';
+import { TabsContainer } from '../../../dockview/components/titlebar/tabsContainer';
 import { fireEvent } from '@testing-library/dom';
 import {
     LocalSelectionTransfer,
     PanelTransfer,
 } from '../../../dnd/dataTransfer';
 import { TestPanel } from '../dockviewGroupPanelModel.spec';
-import { DockviewGroupPanelModel } from '../../../groupview/dockviewGroupPanelModel';
+import { DockviewGroupPanelModel } from '../../../dockview/dockviewGroupPanelModel';
-import { DockviewGroupPanel } from '../../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../../dockview/dockviewGroupPanel';
 
 describe('tabsContainer', () => {
     test('that an external event does not render a drop target and calls through to the group mode', () => {

packages/dockview-core/src/actionbar/actionsContainer.ts

@@ -2,7 +2,7 @@ export class ActionContainer {
     private _element: HTMLElement;
     private _list: HTMLElement;
 
-    get element() {
+    get element(): HTMLElement {
         return this._element;
     }
 
@@ -16,7 +16,7 @@ export class ActionContainer {
         this._element.appendChild(this._list);
     }
 
-    public add(element: HTMLElement) {
+    public add(element: HTMLElement): void {
         const listItem = document.createElement('li');
         listItem.className = 'action-item';
         this._list.appendChild(element);

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

@@ -12,7 +12,7 @@ import { Direction } from '../gridview/baseComponentGridview';
 import {
     AddComponentOptions,
     IGridviewComponent,
-    SerializedGridview,
+    SerializedGridviewComponent,
 } from '../gridview/gridviewComponent';
 import { IGridviewPanel } from '../gridview/gridviewPanel';
 
@@ -33,7 +33,7 @@ import { ISplitviewPanel } from '../splitview/splitviewPanel';
 import {
     DockviewGroupPanel,
     IDockviewGroupPanel,
-} from '../groupview/dockviewGroupPanel';
+} from '../dockview/dockviewGroupPanel';
 import { Emitter, Event } from '../events';
 import { IDockviewPanel } from '../dockview/dockviewPanel';
 import { PaneviewDropEvent } from '../paneview/draggablePaneviewPanel';
@@ -229,7 +229,7 @@ export class PaneviewApi implements CommonApi<SerializedPaneview> {
     }
 }
 
-export class GridviewApi implements CommonApi<SerializedGridview> {
+export class GridviewApi implements CommonApi<SerializedGridviewComponent> {
     get minimumHeight(): number {
         return this.component.minimumHeight;
     }
@@ -315,11 +315,11 @@ export class GridviewApi implements CommonApi<SerializedGridview> {
         return this.component.getPanel(id);
     }
 
-    fromJSON(data: SerializedGridview): void {
+    fromJSON(data: SerializedGridviewComponent): void {
         return this.component.fromJSON(data);
     }
 
-    toJSON(): SerializedGridview {
+    toJSON(): SerializedGridviewComponent {
         return this.component.toJSON();
     }
 

packages/dockview-core/src/api/dockviewPanelApi.ts

@@ -1,6 +1,6 @@
 import { Emitter, Event } from '../events';
 import { GridviewPanelApiImpl, GridviewPanelApi } from './gridviewPanelApi';
-import { DockviewGroupPanel } from '../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../dockview/dockviewGroupPanel';
 import { MutableDisposable } from '../lifecycle';
 import { IDockviewPanel } from '../dockview/dockviewPanel';
 

packages/dockview-core/src/dnd/abstractDragHandler.ts

@@ -21,7 +21,7 @@ export abstract class DragHandler extends CompositeDisposable {
 
     abstract getData(dataTransfer?: DataTransfer | null): IDisposable;
 
-    private configure() {
+    private configure(): void {
         this.addDisposables(
             this._onDragStart,
             addDisposableListener(this.el, 'dragstart', (event) => {

packages/dockview-core/src/dnd/ghost.ts

@@ -3,7 +3,7 @@ import { addClasses } from '../dom';
 export function addGhostImage(
     dataTransfer: DataTransfer,
     ghostElement: HTMLElement
-) {
+): void {
     // class dockview provides to force ghost image to be drawn on a different layer and prevent weird rendering issues
     addClasses(ghostElement, 'dv-dragged');
 

packages/dockview-core/src/dnd/groupDragHandler.ts

@@ -1,4 +1,4 @@
-import { DockviewGroupPanel } from '../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../dockview/dockviewGroupPanel';
 import { IDisposable } from '../lifecycle';
 import { DragHandler } from './abstractDragHandler';
 import { LocalSelectionTransfer, PanelTransfer } from './dataTransfer';

packages/dockview-core/src/dockview/components/panel/content.ts

@@ -2,10 +2,10 @@ import {
     CompositeDisposable,
     IDisposable,
     MutableDisposable,
-} from '../../lifecycle';
+} from '../../../lifecycle';
-import { Emitter, Event } from '../../events';
+import { Emitter, Event } from '../../../events';
-import { trackFocus } from '../../dom';
+import { trackFocus } from '../../../dom';
-import { IDockviewPanel } from '../../dockview/dockviewPanel';
+import { IDockviewPanel } from '../../dockviewPanel';
 
 export interface IContentContainer extends IDisposable {
     onDidFocus: Event<void>;

packages/dockview-core/src/dockview/components/tab/defaultTab.ts

@@ -1,11 +1,8 @@
 import { CompositeDisposable } from '../../../lifecycle';
-import {
+import { ITabRenderer, GroupPanelPartInitParameters } from '../../types';
-    ITabRenderer,
-    GroupPanelPartInitParameters,
-} from '../../../groupview/types';
 import { addDisposableListener } from '../../../events';
 import { PanelUpdateEvent } from '../../../panel/types';
-import { DockviewGroupPanel } from '../../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockviewGroupPanel';
 import { createCloseButton } from '../../../svg';
 
 export class DefaultTab extends CompositeDisposable implements ITabRenderer {

packages/dockview-core/src/dockview/components/tab/tab.ts

@@ -1,17 +1,16 @@
-import { addDisposableListener, Emitter, Event } from '../events';
+import { addDisposableListener, Emitter, Event } from '../../../events';
-import { CompositeDisposable, IDisposable } from '../lifecycle';
+import { CompositeDisposable, IDisposable } from '../../../lifecycle';
 import {
     getPanelData,
     LocalSelectionTransfer,
     PanelTransfer,
-} from '../dnd/dataTransfer';
+} from '../../../dnd/dataTransfer';
-import { toggleClass } from '../dom';
+import { toggleClass } from '../../../dom';
-import { IDockviewComponent } from '../dockview/dockviewComponent';
+import { IDockviewComponent } from '../../dockviewComponent';
-import { ITabRenderer } from './types';
+import { DockviewDropTargets, ITabRenderer } from '../../types';
-import { DockviewGroupPanel } from './dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockviewGroupPanel';
-import { DroptargetEvent, Droptarget } from '../dnd/droptarget';
+import { DroptargetEvent, Droptarget } from '../../../dnd/droptarget';
-import { DockviewDropTargets } from './dnd';
+import { DragHandler } from '../../../dnd/abstractDragHandler';
-import { DragHandler } from '../dnd/abstractDragHandler';
 
 export interface ITab {
     readonly panelId: string;

packages/dockview-core/src/dockview/components/titlebar/tabsContainer.ts

@@ -2,14 +2,14 @@ import {
     IDisposable,
     CompositeDisposable,
     IValueDisposable,
-} from '../../lifecycle';
+} from '../../../lifecycle';
-import { addDisposableListener, Emitter, Event } from '../../events';
+import { addDisposableListener, Emitter, Event } from '../../../events';
-import { ITab, Tab } from '../tab';
+import { ITab, Tab } from '../tab/tab';
-import { DockviewComponent } from '../../dockview/dockviewComponent';
+import { DockviewComponent } from '../../dockviewComponent';
-import { DockviewGroupPanel } from '../dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockviewGroupPanel';
 import { VoidContainer } from './voidContainer';
-import { toggleClass } from '../../dom';
+import { toggleClass } from '../../../dom';
-import { IDockviewPanel } from '../../dockview/dockviewPanel';
+import { IDockviewPanel } from '../../dockviewPanel';
 
 export interface TabDropIndexEvent {
     event: DragEvent;

packages/dockview-core/src/dockview/components/titlebar/voidContainer.ts

@@ -1,12 +1,12 @@
-import { last } from '../../array';
+import { last } from '../../../array';
-import { getPanelData } from '../../dnd/dataTransfer';
+import { getPanelData } from '../../../dnd/dataTransfer';
-import { Droptarget, DroptargetEvent } from '../../dnd/droptarget';
+import { Droptarget, DroptargetEvent } from '../../../dnd/droptarget';
-import { GroupDragHandler } from '../../dnd/groupDragHandler';
+import { GroupDragHandler } from '../../../dnd/groupDragHandler';
-import { DockviewComponent } from '../../dockview/dockviewComponent';
+import { DockviewComponent } from '../../dockviewComponent';
-import { addDisposableListener, Emitter, Event } from '../../events';
+import { addDisposableListener, Emitter, Event } from '../../../events';
-import { CompositeDisposable } from '../../lifecycle';
+import { CompositeDisposable } from '../../../lifecycle';
-import { DockviewDropTargets } from '../dnd';
+import { DockviewGroupPanel } from '../../dockviewGroupPanel';
-import { DockviewGroupPanel } from '../dockviewGroupPanel';
+import { DockviewDropTargets } from '../../types';
 
 export class VoidContainer extends CompositeDisposable {
     private readonly _element: HTMLElement;

packages/dockview-core/src/dockview/components/watermark/watermark.ts

@@ -1,12 +1,9 @@
-import {
+import { GroupPanelPartInitParameters, IWatermarkRenderer } from '../../types';
-    GroupPanelPartInitParameters,
-    IWatermarkRenderer,
-} from '../../../groupview/types';
 import { ActionContainer } from '../../../actionbar/actionsContainer';
 import { addDisposableListener } from '../../../events';
 import { toggleClass } from '../../../dom';
 import { CompositeDisposable } from '../../../lifecycle';
-import { DockviewGroupPanel } from '../../../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from '../../dockviewGroupPanel';
 import { PanelUpdateEvent } from '../../../panel/types';
 import { createCloseButton } from '../../../svg';
 

packages/dockview-core/src/dockview/deserializer.ts

@@ -1,5 +1,5 @@
-import { GroupviewPanelState, ITabRenderer } from '../groupview/types';
+import { GroupviewPanelState, ITabRenderer } from './types';
-import { DockviewGroupPanel } from '../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
 import { DockviewPanel, IDockviewPanel } from './dockviewPanel';
 import { IDockviewComponent } from './dockviewComponent';
 import { createComponent } from '../panel/componentFactory';
@@ -14,6 +14,14 @@ export interface IPanelDeserializer {
     ): IDockviewPanel;
 }
 
+// depreciated
+interface LegacyState extends GroupviewPanelState {
+    view?: {
+        tab?: { id: string };
+        content: { id: string };
+    };
+}
+
 export class DefaultDockviewDeserialzier implements IPanelDeserializer {
     constructor(private readonly layout: IDockviewComponent) {}
 
@@ -24,9 +32,8 @@ export class DefaultDockviewDeserialzier implements IPanelDeserializer {
         const panelId = panelData.id;
         const params = panelData.params;
         const title = panelData.title;
-        const viewData = panelData.view!;
 
-        let tab: ITabRenderer;
+        const viewData = (panelData as LegacyState).view!;
 
         const contentComponent = viewData
             ? viewData.content.id
@@ -35,6 +42,8 @@ export class DefaultDockviewDeserialzier implements IPanelDeserializer {
             ? viewData.tab?.id
             : panelData.tabComponent;
 
+        let tab: ITabRenderer;
+
         if (tabComponent) {
             tab = createComponent(
                 panelId,

packages/dockview-core/src/dockview/dockviewComponent.ts

@@ -11,11 +11,10 @@ import { CompositeDisposable } from '../lifecycle';
 import { Event, Emitter } from '../events';
 import { Watermark } from './components/watermark/watermark';
 import {
-    IContentRenderer,
-    ITabRenderer,
     IWatermarkRenderer,
     GroupviewPanelState,
-} from '../groupview/types';
+    DockviewDropTargets,
+} from './types';
 import { sequentialNumberGenerator } from '../math';
 import { IPanelDeserializer } from './deserializer';
 import { createComponent } from '../panel/componentFactory';
@@ -37,19 +36,14 @@ import {
 } from '../gridview/baseComponentGridview';
 import { DockviewApi } from '../api/component.api';
 import { Orientation, Sizing } from '../splitview/core/splitview';
-import { DefaultTab } from './components/tab/defaultTab';
 import {
     GroupOptions,
     GroupPanelViewState,
     GroupviewDropEvent,
-} from '../groupview/dockviewGroupPanelModel';
+} from './dockviewGroupPanelModel';
-import {
+import { DockviewGroupPanel, IDockviewGroupPanel } from './dockviewGroupPanel';
-    DockviewGroupPanel,
-    IDockviewGroupPanel,
-} from '../groupview/dockviewGroupPanel';
 import { DockviewPanelModel } from './dockviewPanelModel';
 import { getPanelData } from '../dnd/dataTransfer';
-import { DockviewDropTargets } from '../groupview/dnd';
 
 export interface PanelReference {
     update: (event: { params: { [key: string]: any } }) => void;

packages/dockview-core/src/dockview/dockviewGroupPanelModel.ts

@@ -1,20 +1,25 @@
 import { DockviewApi } from '../api/component.api';
 import { getPanelData, PanelTransfer } from '../dnd/dataTransfer';
 import { Droptarget, Position } from '../dnd/droptarget';
-import { DockviewComponent } from '../dockview/dockviewComponent';
+import { DockviewComponent } from './dockviewComponent';
 import { isAncestor, toggleClass } from '../dom';
 import { addDisposableListener, Emitter, Event } from '../events';
 import { IGridPanelView } from '../gridview/baseComponentGridview';
 import { IViewSize } from '../gridview/gridview';
-import { CompositeDisposable, IDisposable } from '../lifecycle';
+import { CompositeDisposable } from '../lifecycle';
 import { PanelInitParameters, PanelUpdateEvent } from '../panel/types';
-import { ContentContainer, IContentContainer } from './panel/content';
+import {
-import { ITabsContainer, TabsContainer } from './titlebar/tabsContainer';
+    ContentContainer,
-import { IWatermarkRenderer } from './types';
+    IContentContainer,
+} from './components/panel/content';
+import {
+    ITabsContainer,
+    TabsContainer,
+} from './components/titlebar/tabsContainer';
+import { DockviewDropTargets, IWatermarkRenderer } from './types';
 import { DockviewGroupPanel } from './dockviewGroupPanel';
-import { DockviewDropTargets } from './dnd';
+import { IDockviewPanel } from './dockviewPanel';
-import { IDockviewPanel } from '../dockview/dockviewPanel';
+import { IGroupControlRenderer } from './options';
-import { IGroupControlRenderer } from '../dockview/options';
 
 export interface DndService {
     canDisplayOverlay(

packages/dockview-core/src/dockview/dockviewPanel.ts

@@ -7,8 +7,8 @@ import {
     GroupPanelUpdateEvent,
     GroupviewPanelState,
     IGroupPanelInitParameters,
-} from '../groupview/types';
+} from './types';
-import { DockviewGroupPanel } from '../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
 import { CompositeDisposable, IDisposable } from '../lifecycle';
 import { IPanel, Parameters } from '../panel/types';
 import { IDockviewPanelModel } from './dockviewPanelModel';

packages/dockview-core/src/dockview/dockviewPanelModel.ts

@@ -4,17 +4,12 @@ import {
     IContentRenderer,
     ITabRenderer,
     GroupPanelUpdateEvent,
-} from '../groupview/types';
+} from './types';
-import { DockviewGroupPanel } from '../groupview/dockviewGroupPanel';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
 import { IDisposable } from '../lifecycle';
 import { createComponent } from '../panel/componentFactory';
 import { IDockviewComponent } from './dockviewComponent';
 
-export interface SerializedGroupPanelView {
-    tab?: { id: string };
-    content: { id: string };
-}
-
 export interface IDockviewPanelModel extends IDisposable {
     readonly contentComponent: string;
     readonly tabComponent?: string;

packages/dockview-core/src/dockview/options.ts

@@ -6,14 +6,14 @@ import {
     ITabRenderer,
     WatermarkConstructor,
     IWatermarkRenderer,
-} from '../groupview/types';
+    DockviewDropTargets,
+} from './types';
 import {
     DockviewGroupPanel,
     DockviewGroupPanelApi,
-} from '../groupview/dockviewGroupPanel';
+} from './dockviewGroupPanel';
 import { ISplitviewStyles, Orientation } from '../splitview/core/splitview';
 import { FrameworkFactory } from '../types';
-import { DockviewDropTargets } from '../groupview/dnd';
 import { PanelTransfer } from '../dnd/dataTransfer';
 import { IDisposable } from '../lifecycle';
 import { Position } from '../dnd/droptarget';

packages/dockview-core/src/dockview/types.ts

@@ -1,4 +1,4 @@
-import { IDockviewComponent } from '../dockview/dockviewComponent';
+import { IDockviewComponent } from './dockviewComponent';
 import { DockviewPanelApi } from '../api/dockviewPanelApi';
 import {
     PanelInitParameters,
@@ -7,13 +7,16 @@ import {
     Parameters,
 } from '../panel/types';
 import { DockviewApi } from '../api/component.api';
-import { DockviewGroupPanel } from './dockviewGroupPanel';
 import { Event } from '../events';
-import {
-    IDockviewPanelModel,
-    SerializedGroupPanelView,
-} from '../dockview/dockviewPanelModel';
 import { Optional } from '../types';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
+
+export enum DockviewDropTargets {
+    Tab,
+    Panel,
+    TabContainer,
+    Edge,
+}
 
 export interface HeaderPartInitParameters {
     title: string;
@@ -94,5 +97,4 @@ export interface GroupviewPanelState {
     tabComponent?: string;
     title?: string;
     params?: { [key: string]: any };
-    view?: SerializedGroupPanelView; // depreciated
 }

packages/dockview-core/src/dom.ts

@@ -25,7 +25,10 @@ export function watchElementResize(
     };
 }
 
-export const removeClasses = (element: HTMLElement, ...classes: string[]) => {
+export const removeClasses = (
+    element: HTMLElement,
+    ...classes: string[]
+): void => {
     for (const classname of classes) {
         if (element.classList.contains(classname)) {
             element.classList.remove(classname);
@@ -33,7 +36,10 @@ export const removeClasses = (element: HTMLElement, ...classes: string[]) => {
     }
 };
 
-export const addClasses = (element: HTMLElement, ...classes: string[]) => {
+export const addClasses = (
+    element: HTMLElement,
+    ...classes: string[]
+): void => {
     for (const classname of classes) {
         if (!element.classList.contains(classname)) {
             element.classList.add(classname);
@@ -45,7 +51,7 @@ export const toggleClass = (
     element: HTMLElement,
     className: string,
     isToggled: boolean
-) => {
+): void => {
     const hasClass = element.classList.contains(className);
     if (isToggled && !hasClass) {
         element.classList.add(className);
@@ -74,8 +80,8 @@ export function getElementsByTagName(tag: string): HTMLElement[] {
 }
 
 export interface IFocusTracker extends IDisposable {
-    onDidFocus: Event<void>;
+    readonly onDidFocus: Event<void>;
-    onDidBlur: Event<void>;
+    readonly onDidBlur: Event<void>;
     refreshState?(): void;
 }
 
@@ -153,11 +159,11 @@ class FocusTracker extends CompositeDisposable implements IFocusTracker {
         }
     }
 
-    refreshState() {
+    refreshState(): void {
         this._refreshStateHandler();
     }
 
-    public dispose() {
+    public dispose(): void {
         super.dispose();
 
         this._onDidBlur.dispose();

packages/dockview-core/src/events.ts

@@ -5,7 +5,7 @@ export interface Event<T> {
 }
 
 export interface EmitterOptions {
-    replay?: boolean;
+    readonly replay?: boolean;
 }
 
 export namespace Event {
@@ -35,7 +35,7 @@ export class Emitter<T> implements IDisposable {
 
     constructor(private readonly options?: EmitterOptions) {}
 
-    get event() {
+    get event(): Event<T> {
         if (!this._event) {
             this._event = (listener: (e: T) => void): IDisposable => {
                 if (this.options?.replay && this._last !== undefined) {
@@ -57,14 +57,14 @@ export class Emitter<T> implements IDisposable {
         return this._event;
     }
 
-    public fire(e: T) {
+    public fire(e: T): void {
         this._last = e;
         for (const listener of this._listeners) {
             listener(e);
         }
     }
 
-    public dispose() {
+    public dispose(): void {
         this._listeners = [];
         this._disposed = true;
     }

packages/dockview-core/src/gridview/baseComponentGridview.ts

@@ -92,40 +92,40 @@ export abstract class BaseGrid<T extends IGridPanelView>
 
     protected readonly _bufferOnDidLayoutChange = new TickDelayedEvent();
 
-    get id() {
+    get id(): string {
         return this._id;
     }
 
-    get element() {
+    get element(): HTMLElement {
         return this._element;
     }
 
-    get size() {
+    get size(): number {
         return this._groups.size;
     }
 
-    get groups() {
+    get groups(): T[] {
         return Array.from(this._groups.values()).map((_) => _.value);
     }
 
-    get width() {
+    get width(): number {
         return this.gridview.width;
     }
 
-    get height() {
+    get height(): number {
         return this.gridview.height;
     }
 
-    get minimumHeight() {
+    get minimumHeight(): number {
         return this.gridview.minimumHeight;
     }
-    get maximumHeight() {
+    get maximumHeight(): number {
         return this.gridview.maximumHeight;
     }
-    get minimumWidth() {
+    get minimumWidth(): number {
         return this.gridview.minimumWidth;
     }
-    get maximumWidth() {
+    get maximumWidth(): number {
         return this.gridview.maximumWidth;
     }
 
@@ -176,16 +176,20 @@ export abstract class BaseGrid<T extends IGridPanelView>
 
     public abstract clear(): void;
 
-    public setVisible(panel: T, visible: boolean) {
+    public setVisible(panel: T, visible: boolean): void {
         this.gridview.setViewVisible(getGridLocation(panel.element), visible);
         this._onDidLayoutChange.fire();
     }
 
-    public isVisible(panel: T) {
+    public isVisible(panel: T): boolean {
         return this.gridview.isViewVisible(getGridLocation(panel.element));
     }
 
-    protected doAddGroup(group: T, location: number[] = [0], size?: number) {
+    protected doAddGroup(
+        group: T,
+        location: number[] = [0],
+        size?: number
+    ): void {
         this.gridview.addView(group, size ?? Sizing.Distribute, location);
 
         this._onDidAddGroup.fire(group);
@@ -196,7 +200,7 @@ export abstract class BaseGrid<T extends IGridPanelView>
     protected doRemoveGroup(
         group: T,
         options?: { skipActive?: boolean; skipDispose?: boolean }
-    ) {
+    ): T {
         if (!this._groups.has(group.id)) {
             throw new Error('invalid operation');
         }
@@ -228,7 +232,7 @@ export abstract class BaseGrid<T extends IGridPanelView>
         return this._groups.get(id)?.value;
     }
 
-    public doSetGroupActive(group: T | undefined, skipFocus?: boolean) {
+    public doSetGroupActive(group: T | undefined, skipFocus?: boolean): void {
         if (this._activeGroup === group) {
             return;
         }
@@ -251,11 +255,11 @@ export abstract class BaseGrid<T extends IGridPanelView>
         this._onDidActiveGroupChange.fire(group);
     }
 
-    public removeGroup(group: T) {
+    public removeGroup(group: T): void {
         this.doRemoveGroup(group);
     }
 
-    public moveToNext(options?: MovementOptions2) {
+    public moveToNext(options?: MovementOptions2): void {
         if (!options) {
             options = {};
         }
@@ -271,7 +275,7 @@ export abstract class BaseGrid<T extends IGridPanelView>
         this.doSetGroupActive(next as T);
     }
 
-    public moveToPrevious(options?: MovementOptions2) {
+    public moveToPrevious(options?: MovementOptions2): void {
         if (!options) {
             options = {};
         }

packages/dockview-core/src/gridview/branchNode.ts

@@ -22,6 +22,8 @@ export class BranchNode extends CompositeDisposable implements IView {
     private splitview: Splitview;
     private _orthogonalSize: number;
     private _size: number;
+    private _childrenDisposable: IDisposable = Disposable.NONE;
+
     public readonly children: Node[] = [];
 
     private readonly _onDidChange = new Emitter<{
@@ -61,11 +63,11 @@ export class BranchNode extends CompositeDisposable implements IView {
         return this.splitview.maximumSize;
     }
 
-    get orthogonalSize() {
+    get orthogonalSize(): number {
         return this._orthogonalSize;
     }
 
-    get size() {
+    get size(): number {
         return this._size;
     }
 
@@ -168,7 +170,7 @@ export class BranchNode extends CompositeDisposable implements IView {
         this.setupChildrenEvents();
     }
 
-    setVisible(visible: boolean) {
+    setVisible(visible: boolean): void {
         for (const child of this.children) {
             child.setVisible(visible);
         }
@@ -258,7 +260,7 @@ export class BranchNode extends CompositeDisposable implements IView {
         return this.splitview.getViewCachedVisibleSize(index);
     }
 
-    public removeChild(index: number, sizing?: Sizing) {
+    public removeChild(index: number, sizing?: Sizing): void {
         if (index < 0 || index >= this.children.length) {
             throw new Error('Invalid index');
         }
@@ -279,9 +281,7 @@ export class BranchNode extends CompositeDisposable implements IView {
         return child;
     }
 
-    private _childrenDisposable: IDisposable = Disposable.NONE;
+    private setupChildrenEvents(): void {
-
-    private setupChildrenEvents() {
         this._childrenDisposable.dispose();
 
         this._childrenDisposable = Event.any(
@@ -295,7 +295,7 @@ export class BranchNode extends CompositeDisposable implements IView {
         });
     }
 
-    public dispose() {
+    public dispose(): void {
         super.dispose();
         this._childrenDisposable.dispose();
         this.children.forEach((child) => child.dispose());

packages/dockview-core/src/gridview/gridview.ts

@@ -261,6 +261,14 @@ export interface INodeDescriptor {
 export interface IViewDeserializer {
     fromJSON: (data: ISerializedLeafNode) => IGridView;
 }
+
+export interface SerializedGridview<T> {
+    root: SerializedGridObject<T>;
+    width: number;
+    height: number;
+    orientation: Orientation;
+}
+
 export class Gridview implements IDisposable {
     private _root: BranchNode | undefined;
     public readonly element: HTMLElement;
@@ -277,7 +285,41 @@ export class Gridview implements IDisposable {
         return this._root ? this._root.children.length : 0;
     }
 
-    public serialize() {
+    public get orientation(): Orientation {
+        return this.root.orientation;
+    }
+
+    public set orientation(orientation: Orientation) {
+        if (this.root.orientation === orientation) {
+            return;
+        }
+
+        const { size, orthogonalSize } = this.root;
+        this.root = flipNode(this.root, orthogonalSize, size);
+        this.root.layout(size, orthogonalSize);
+    }
+
+    get width(): number {
+        return this.root.width;
+    }
+    get height(): number {
+        return this.root.height;
+    }
+
+    get minimumWidth(): number {
+        return this.root.minimumWidth;
+    }
+    get minimumHeight(): number {
+        return this.root.minimumHeight;
+    }
+    get maximumWidth(): number {
+        return this.root.maximumHeight;
+    }
+    get maximumHeight(): number {
+        return this.root.maximumHeight;
+    }
+
+    public serialize(): SerializedGridview<any> {
         const root = serializeBranchNode(this.getView(), this.orientation);
 
         return {
@@ -288,7 +330,7 @@ export class Gridview implements IDisposable {
         };
     }
 
-    public dispose() {
+    public dispose(): void {
         this.disposable.dispose();
         this._onDidChange.dispose();
         this.root.dispose();
@@ -296,7 +338,7 @@ export class Gridview implements IDisposable {
         this.element.remove();
     }
 
-    public clear() {
+    public clear(): void {
         const orientation = this.root.orientation;
         this.root = new BranchNode(
             orientation,
@@ -307,7 +349,7 @@ export class Gridview implements IDisposable {
         );
     }
 
-    public deserialize(json: any, deserializer: IViewDeserializer) {
+    public deserialize(json: any, deserializer: IViewDeserializer): void {
         const orientation = json.orientation;
         const height =
             orientation === Orientation.VERTICAL ? json.height : json.width;
@@ -378,20 +420,6 @@ export class Gridview implements IDisposable {
         return result;
     }
 
-    public get orientation() {
-        return this.root.orientation;
-    }
-
-    public set orientation(orientation: Orientation) {
-        if (this.root.orientation === orientation) {
-            return;
-        }
-
-        const { size, orthogonalSize } = this.root;
-        this.root = flipNode(this.root, orthogonalSize, size);
-        this.root.layout(size, orthogonalSize);
-    }
-
     private get root(): BranchNode {
         return this._root!;
     }
@@ -448,11 +476,11 @@ export class Gridview implements IDisposable {
         });
     }
 
-    public next(location: number[]) {
+    public next(location: number[]): LeafNode {
         return this.progmaticSelect(location);
     }
 
-    public previous(location: number[]) {
+    public previous(location: number[]): LeafNode {
         return this.progmaticSelect(location, true);
     }
 
@@ -492,7 +520,7 @@ export class Gridview implements IDisposable {
         return { box, children };
     }
 
-    private progmaticSelect(location: number[], reverse = false) {
+    private progmaticSelect(location: number[], reverse = false): LeafNode {
         const [path, node] = this.getNode(location);
 
         if (!(node instanceof LeafNode)) {
@@ -513,26 +541,6 @@ export class Gridview implements IDisposable {
         return findLeaf(this.root, reverse);
     }
 
-    get width(): number {
-        return this.root.width;
-    }
-    get height(): number {
-        return this.root.height;
-    }
-
-    get minimumWidth(): number {
-        return this.root.minimumWidth;
-    }
-    get minimumHeight(): number {
-        return this.root.minimumHeight;
-    }
-    get maximumWidth(): number {
-        return this.root.maximumHeight;
-    }
-    get maximumHeight(): number {
-        return this.root.maximumHeight;
-    }
-
     constructor(
         readonly proportionalLayout: boolean,
         readonly styles: ISplitviewStyles | undefined,
@@ -581,7 +589,11 @@ export class Gridview implements IDisposable {
         parent.moveChild(from, to);
     }
 
-    public addView(view: IGridView, size: number | Sizing, location: number[]) {
+    public addView(
+        view: IGridView,
+        size: number | Sizing,
+        location: number[]
+    ): void {
         const [rest, index] = tail(location);
 
         const [pathToParent, parent] = this.getNode(rest);
@@ -636,7 +648,7 @@ export class Gridview implements IDisposable {
         }
     }
 
-    public remove(view: IGridView, sizing?: Sizing) {
+    public remove(view: IGridView, sizing?: Sizing): IGridView {
         const location = getGridLocation(view.element);
         return this.removeView(location, sizing);
     }
@@ -721,7 +733,7 @@ export class Gridview implements IDisposable {
         return node.view;
     }
 
-    public layout(width: number, height: number) {
+    public layout(width: number, height: number): void {
         const [size, orthogonalSize] =
             this.root.orientation === Orientation.HORIZONTAL
                 ? [height, width]

packages/dockview-core/src/gridview/gridviewComponent.ts

@@ -2,6 +2,7 @@ import {
     getRelativeLocation,
     SerializedGridObject,
     getGridLocation,
+    SerializedGridview,
 } from './gridview';
 import { tail, sequenceEquals } from '../array';
 import { CompositeDisposable } from '../lifecycle';
@@ -26,13 +27,8 @@ import { createComponent } from '../panel/componentFactory';
 import { Emitter, Event } from '../events';
 import { Position } from '../dnd/droptarget';
 
-export interface SerializedGridview {
+export interface SerializedGridviewComponent {
-    grid: {
+    grid: SerializedGridview<GridPanelViewState>;
-        height: number;
-        width: number;
-        orientation: Orientation;
-        root: SerializedGridObject<GridPanelViewState>;
-    };
     activePanel?: string;
 }
 
@@ -64,8 +60,8 @@ export interface IGridviewComponent extends IBaseGrid<GridviewPanel> {
     addPanel(options: AddComponentOptions): IGridviewPanel;
     removePanel(panel: IGridviewPanel, sizing?: Sizing): void;
     focus(): void;
-    fromJSON(serializedGridview: SerializedGridview): void;
+    fromJSON(serializedGridview: SerializedGridviewComponent): void;
-    toJSON(): SerializedGridview;
+    toJSON(): SerializedGridviewComponent;
     movePanel(
         panel: IGridviewPanel,
         options: { direction: Direction; reference: string; size?: number }
@@ -84,7 +80,7 @@ export class GridviewComponent
     private readonly _onDidLayoutfromJSON = new Emitter<void>();
     readonly onDidLayoutFromJSON: Event<void> = this._onDidLayoutfromJSON.event;
 
-    get orientation() {
+    get orientation(): Orientation {
         return this.gridview.orientation;
     }
 
@@ -92,7 +88,7 @@ export class GridviewComponent
         this.gridview.orientation = value;
     }
 
-    get options() {
+    get options(): GridviewComponentOptions {
         return this._options;
     }
 
@@ -135,7 +131,7 @@ export class GridviewComponent
         this.layout(this.gridview.width, this.gridview.height, true);
     }
 
-    removePanel(panel: GridviewPanel) {
+    removePanel(panel: GridviewPanel): void {
         this.removeGroup(panel);
     }
 
@@ -144,7 +140,7 @@ export class GridviewComponent
      *
      * @returns A JSON respresentation of the layout
      */
-    public toJSON(): SerializedGridview {
+    public toJSON(): SerializedGridviewComponent {
         const data = this.gridview.serialize() as {
             height: number;
             width: number;
@@ -168,11 +164,11 @@ export class GridviewComponent
         });
     }
 
-    focus() {
+    focus(): void {
         this.activeGroup?.focus();
     }
 
-    public fromJSON(serializedGridview: SerializedGridview) {
+    public fromJSON(serializedGridview: SerializedGridviewComponent): void {
         this.clear();
 
         const { grid, activePanel } = serializedGridview;
@@ -339,7 +335,7 @@ export class GridviewComponent
         return view;
     }
 
-    private registerPanel(panel: GridviewPanel) {
+    private registerPanel(panel: GridviewPanel): void {
         const disposable = new CompositeDisposable(
             panel.api.onDidFocusChange((event) => {
                 if (!event.isFocused) {
@@ -366,7 +362,7 @@ export class GridviewComponent
         referenceGroup: IGridPanelComponentView,
         groupId: string,
         target: Position
-    ) {
+    ): void {
         const sourceGroup = this.getPanel(groupId);
 
         if (!sourceGroup) {
@@ -411,11 +407,11 @@ export class GridviewComponent
         this.doAddGroup(targetGroup, location);
     }
 
-    removeGroup(group: GridviewPanel) {
+    removeGroup(group: GridviewPanel): void {
         super.removeGroup(group);
     }
 
-    public dispose() {
+    public dispose(): void {
         super.dispose();
 
         this._onDidLayoutfromJSON.dispose();

packages/dockview-core/src/gridview/gridviewPanel.ts

@@ -62,11 +62,11 @@ export abstract class GridviewPanel
         return this._priority;
     }
 
-    get snap() {
+    get snap(): boolean {
         return this._snap;
     }
 
-    get minimumWidth() {
+    get minimumWidth(): number {
         const width =
             typeof this._minimumWidth === 'function'
                 ? this._minimumWidth()
@@ -80,7 +80,7 @@ export abstract class GridviewPanel
         return width;
     }
 
-    get minimumHeight() {
+    get minimumHeight(): number {
         const height =
             typeof this._minimumHeight === 'function'
                 ? this._minimumHeight()
@@ -94,7 +94,7 @@ export abstract class GridviewPanel
         return height;
     }
 
-    get maximumHeight() {
+    get maximumHeight(): number {
         const height =
             typeof this._maximumHeight === 'function'
                 ? this._maximumHeight()
@@ -108,7 +108,7 @@ export abstract class GridviewPanel
         return height;
     }
 
-    get maximumWidth() {
+    get maximumWidth(): number {
         const width =
             typeof this._maximumWidth === 'function'
                 ? this._maximumWidth()
@@ -122,7 +122,7 @@ export abstract class GridviewPanel
         return width;
     }
 
-    get isActive() {
+    get isActive(): boolean {
         return this.api.isActive;
     }
 
@@ -177,11 +177,11 @@ export abstract class GridviewPanel
         );
     }
 
-    setVisible(isVisible: boolean) {
+    setVisible(isVisible: boolean): void {
         this.api._onDidVisibilityChange.fire({ isVisible });
     }
 
-    setActive(isActive: boolean) {
+    setActive(isActive: boolean): void {
         this.api._onDidActiveChange.fire({ isActive });
     }
 
@@ -209,7 +209,7 @@ export abstract class GridviewPanel
         }
     }
 
-    private updateConstraints() {
+    private updateConstraints(): void {
         this.api._onDidConstraintsChange.fire({
             minimumWidth: this._evaluatedMinimumWidth,
             maximumWidth: this._evaluatedMaximumWidth,

packages/dockview-core/src/gridview/leafNode.ts

@@ -43,7 +43,7 @@ export class LeafNode implements IView {
         return this.view.priority;
     }
 
-    get snap() {
+    get snap(): boolean | undefined {
         return this.view.snap;
     }
 
@@ -71,25 +71,25 @@ export class LeafNode implements IView {
             : this.maximumHeight;
     }
 
-    get orthogonalSize() {
+    get orthogonalSize(): number {
         return this._orthogonalSize;
     }
 
-    get size() {
+    get size(): number {
         return this._size;
     }
 
-    get element() {
+    get element(): HTMLElement {
         return this.view.element;
     }
 
-    get width() {
+    get width(): number {
         return this.orientation === Orientation.HORIZONTAL
             ? this.orthogonalSize
             : this.size;
     }
 
-    get height() {
+    get height(): number {
         return this.orientation === Orientation.HORIZONTAL
             ? this.size
             : this.orthogonalSize;
@@ -122,21 +122,21 @@ export class LeafNode implements IView {
         });
     }
 
-    public setVisible(visible: boolean) {
+    public setVisible(visible: boolean): void {
         if (this.view.setVisible) {
             this.view.setVisible(visible);
             this._onDidChange.fire({});
         }
     }
 
-    public layout(size: number, orthogonalSize: number) {
+    public layout(size: number, orthogonalSize: number): void {
         this._size = size;
         this._orthogonalSize = orthogonalSize;
 
         this.view.layout(this.width, this.height);
     }
 
-    public dispose() {
+    public dispose(): void {
         this._onDidChange.dispose();
         this._disposable.dispose();
     }

packages/dockview-core/src/groupview/dnd.ts

@@ -1,6 +0,0 @@
-export enum DockviewDropTargets {
-    Tab,
-    Panel,
-    TabContainer,
-    Edge,
-}

packages/dockview-core/src/index.ts

@@ -23,16 +23,15 @@ export * from './splitview/core/options';
 
 export * from './paneview/paneview';
 export * from './gridview/gridview';
-export * from './groupview/dockviewGroupPanelModel';
+export * from './dockview/dockviewGroupPanelModel';
 export * from './gridview/baseComponentGridview';
 
 export * from './paneview/draggablePaneviewPanel';
 
-export * from './groupview/panel/content';
+export * from './dockview/components/panel/content';
-export * from './groupview/tab';
+export * from './dockview/components/tab/tab';
-export * from './groupview/dnd';
+export * from './dockview/types';
-export * from './groupview/types';
+export * from './dockview/dockviewGroupPanel';
-export * from './groupview/dockviewGroupPanel';
 
 export * from './dockview/options';
 export * from './dockview/dockviewPanel';
@@ -48,7 +47,7 @@ export { PaneviewComponentOptions } from './paneview/options';
 export * from './gridview/gridviewPanel';
 export * from './splitview/splitviewPanel';
 export * from './paneview/paneviewPanel';
-export * from './groupview/types';
+export * from './dockview/types';
 
 export {
     Position,

packages/dockview-core/src/lifecycle.ts

@@ -3,8 +3,8 @@ export interface IDisposable {
 }
 
 export interface IValueDisposable<T> {
-    value: T;
+    readonly value: T;
-    disposable: IDisposable;
+    readonly disposable: IDisposable;
 }
 
 export namespace Disposable {
@@ -26,11 +26,11 @@ export class CompositeDisposable {
         this.disposables = args;
     }
 
-    public addDisposables(...args: IDisposable[]) {
+    public addDisposables(...args: IDisposable[]): void {
         args.forEach((arg) => this.disposables.push(arg));
     }
 
-    public dispose() {
+    public dispose(): void {
         this.disposables.forEach((arg) => arg.dispose());
     }
 }
@@ -45,7 +45,7 @@ export class MutableDisposable implements IDisposable {
         this._disposable = disposable;
     }
 
-    public dispose() {
+    public dispose(): void {
         if (this._disposable) {
             this._disposable.dispose();
             this._disposable = Disposable.NONE;

packages/dockview-core/src/types.ts

@@ -1,15 +1,11 @@
-export interface Constructor<T> {
-    new (): T;
-}
-
 export interface FrameworkFactory<T> {
     createComponent: (id: string, componentId: string, component: any) => T;
 }
 
-export type FunctionOrValue<T> = (() => T) | T;
-
 export function isBooleanValue(value: any): value is boolean {
     return typeof value === 'boolean';
 }
 
+export type FunctionOrValue<T> = (() => T) | T;
+
 export type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;

packages/dockview/src/__tests__/react/dockview/groupControlsRenderer.spec.ts

@@ -1,26 +1,32 @@
-import { GroupPanel, GroupviewPanelApi, Groupview } from 'dockview-core';
+import {
+    DockviewGroupPanel,
+    DockviewGroupPanelApi,
+    DockviewGroupPanelModel,
+} from 'dockview-core';
 import { ReactGroupControlsRendererPart } from '../../../dockview/groupControlsRenderer';
 
 describe('groupControlsRenderer', () => {
     test('#1', () => {
-        const groupviewMock = jest.fn<Partial<Groupview>, []>(() => {
+        const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
-            return {
+            () => {
-                onDidAddPanel: jest.fn(),
+                return {
-                onDidRemovePanel: jest.fn(),
+                    onDidAddPanel: jest.fn(),
-                onDidActivePanelChange: jest.fn(),
+                    onDidRemovePanel: jest.fn(),
-            };
+                    onDidActivePanelChange: jest.fn(),
-        });
+                };
+            }
+        );
 
-        const groupview = new groupviewMock() as Groupview;
+        const groupview = new groupviewMock() as DockviewGroupPanelModel;
 
-        const groupPanelMock = jest.fn<Partial<GroupPanel>, []>(() => {
+        const groupPanelMock = jest.fn<Partial<DockviewGroupPanel>, []>(() => {
             return {
-                api: {} as GroupviewPanelApi as any,
+                api: {} as DockviewGroupPanelApi as any,
                 model: groupview,
             };
         });
 
-        const groupPanel = new groupPanelMock() as GroupPanel;
+        const groupPanel = new groupPanelMock() as DockviewGroupPanel;
 
         const cut = new ReactGroupControlsRendererPart(
             jest.fn(),

packages/dockview/src/dockview/dockview.tsx

@@ -10,7 +10,7 @@ import {
     IContentRenderer,
     ITabRenderer,
     watchElementResize,
-    GroupPanel,
+    DockviewGroupPanel,
     DefaultDockviewDeserialzier,
 } from 'dockview-core';
 import { ReactPanelContentPart } from './reactContentPart';
@@ -27,9 +27,9 @@ import {
 function createGroupControlElement(
     component: React.FunctionComponent<IDockviewGroupControlProps> | undefined,
     store: ReactPortalStore
-): ((groupPanel: GroupPanel) => IGroupControlRenderer) | undefined {
+): ((groupPanel: DockviewGroupPanel) => IGroupControlRenderer) | undefined {
     return component
-        ? (groupPanel: GroupPanel) => {
+        ? (groupPanel: DockviewGroupPanel) => {
               return new ReactGroupControlsRendererPart(
                   component,
                   store,

packages/dockview/src/dockview/groupControlsRenderer.ts

@@ -5,13 +5,13 @@ import {
     DockviewCompositeDisposable,
     DockviewMutableDisposable,
     DockviewApi,
-    GroupPanel,
+    DockviewGroupPanel,
-    GroupviewPanelApi,
+    DockviewGroupPanelApi,
     PanelUpdateEvent,
 } from 'dockview-core';
 
 export interface IDockviewGroupControlProps {
-    api: GroupviewPanelApi;
+    api: DockviewGroupPanelApi;
     containerApi: DockviewApi;
     panels: IDockviewPanel[];
     activePanel: IDockviewPanel | undefined;
@@ -31,26 +31,26 @@ export class ReactGroupControlsRendererPart {
         return this._part;
     }
 
-    get group(): GroupPanel {
+    get group(): DockviewGroupPanel {
         return this._group;
     }
 
     constructor(
         private readonly component: React.FunctionComponent<IDockviewGroupControlProps>,
         private readonly reactPortalStore: ReactPortalStore,
-        private readonly _group: GroupPanel
+        private readonly _group: DockviewGroupPanel
     ) {
         this._element = document.createElement('div');
         this._element.className = 'dockview-react-part';
     }
 
-    focus() {
+    focus(): void {
         // TODO
     }
 
     public init(parameters: {
         containerApi: DockviewApi;
-        api: GroupviewPanelApi;
+        api: DockviewGroupPanelApi;
     }): void {
         this.mutableDisposable.value = new DockviewCompositeDisposable(
             this._group.model.onDidAddPanel(() => {
@@ -81,20 +81,20 @@ export class ReactGroupControlsRendererPart {
         );
     }
 
-    public update(event: PanelUpdateEvent) {
+    public update(event: PanelUpdateEvent): void {
         this._part?.update(event.params);
     }
 
-    public dispose() {
+    public dispose(): void {
         this.mutableDisposable.dispose();
         this._part?.dispose();
     }
 
-    private updatePanels() {
+    private updatePanels(): void {
         this.update({ params: { panels: this._group.model.panels } });
     }
 
-    private updateActivePanel() {
+    private updateActivePanel(): void {
         this.update({
             params: {
                 activePanel: this._group.model.activePanel,
@@ -102,7 +102,7 @@ export class ReactGroupControlsRendererPart {
         });
     }
 
-    private updateGroupActive() {
+    private updateGroupActive(): void {
         this.update({
             params: {
                 isGroupActive: this._group.api.isActive,

packages/dockview/src/dockview/reactContentPart.ts

@@ -4,7 +4,7 @@ import { IDockviewPanelProps } from '../dockview/dockview';
 import {
     DockviewEmitter,
     DockviewEvent,
-    GroupPanel,
+    DockviewGroupPanel,
     PanelUpdateEvent,
     IContentRenderer,
     GroupPanelContentPartInitParameters,
@@ -14,7 +14,7 @@ export class ReactPanelContentPart implements IContentRenderer {
     private _element: HTMLElement;
     private part?: ReactPart<IDockviewPanelProps>;
     //
-    private _group: GroupPanel | undefined;
+    private _group: DockviewGroupPanel | undefined;
 
     private readonly _onDidFocus = new DockviewEmitter<void>();
     readonly onDidFocus: DockviewEvent<void> = this._onDidFocus.event;
@@ -35,7 +35,7 @@ export class ReactPanelContentPart implements IContentRenderer {
         this._element.className = 'dockview-react-part';
     }
 
-    focus() {
+    focus(): void {
         // TODO
     }
 
@@ -57,7 +57,7 @@ export class ReactPanelContentPart implements IContentRenderer {
     }
 
     public updateParentGroup(
-        group: GroupPanel,
+        group: DockviewGroupPanel,
         _isPanelVisible: boolean
     ): void {
         this._group = group;
@@ -67,7 +67,7 @@ export class ReactPanelContentPart implements IContentRenderer {
         // noop
     }
 
-    public dispose() {
+    public dispose(): void {
         this._onDidFocus.dispose();
         this._onDidBlur.dispose();
         this.part?.dispose();

packages/dockview/src/dockview/reactHeaderPart.ts

@@ -3,7 +3,7 @@ import { ReactPart, ReactPortalStore } from '../react';
 import { IGroupPanelBaseProps } from './dockview';
 import {
     PanelUpdateEvent,
-    GroupPanel,
+    DockviewGroupPanel,
     ITabRenderer,
     GroupPanelPartInitParameters,
 } from 'dockview-core';
@@ -12,7 +12,7 @@ export class ReactPanelHeaderPart implements ITabRenderer {
     private _element: HTMLElement;
     private part?: ReactPart<IGroupPanelBaseProps>;
 
-    get element() {
+    get element(): HTMLElement {
         return this._element;
     }
 
@@ -25,7 +25,7 @@ export class ReactPanelHeaderPart implements ITabRenderer {
         this._element.className = 'dockview-react-part';
     }
 
-    focus() {
+    focus(): void {
         //noop
     }
 
@@ -42,22 +42,22 @@ export class ReactPanelHeaderPart implements ITabRenderer {
         );
     }
 
-    public update(event: PanelUpdateEvent) {
+    public update(event: PanelUpdateEvent): void {
         this.part?.update(event.params);
     }
 
-    public layout(_width: number, _height: number) {
+    public layout(_width: number, _height: number): void {
         // noop - retrieval from api
     }
 
     public updateParentGroup(
-        _group: GroupPanel,
+        _group: DockviewGroupPanel,
         _isPanelVisible: boolean
     ): void {
         // noop - retrieval from api
     }
 
-    public dispose() {
+    public dispose(): void {
         this.part?.dispose();
     }
 }

packages/dockview/src/dockview/reactWatermarkPart.ts

@@ -3,7 +3,7 @@ import { ReactPart, ReactPortalStore } from '../react';
 import { IGroupPanelBaseProps } from './dockview';
 import {
     PanelUpdateEvent,
-    GroupPanel,
+    DockviewGroupPanel,
     GroupPanelPartInitParameters,
     IWatermarkRenderer,
 } from 'dockview-core';
@@ -15,12 +15,12 @@ export interface IWatermarkPanelProps extends IGroupPanelBaseProps {
 export class ReactWatermarkPart implements IWatermarkRenderer {
     private _element: HTMLElement;
     private part?: ReactPart<IWatermarkPanelProps>;
-    private _groupRef: { value: GroupPanel | undefined } = {
+    private _groupRef: { value: DockviewGroupPanel | undefined } = {
         value: undefined,
     };
     private parameters: GroupPanelPartInitParameters | undefined;
 
-    get element() {
+    get element(): HTMLElement {
         return this._element;
     }
 
@@ -55,11 +55,11 @@ export class ReactWatermarkPart implements IWatermarkRenderer {
         );
     }
 
-    focus() {
+    focus(): void {
         // noop
     }
 
-    update(params: PanelUpdateEvent) {
+    update(params: PanelUpdateEvent): void {
         if (this.parameters) {
             this.parameters.params = params.params;
         }
@@ -67,22 +67,19 @@ export class ReactWatermarkPart implements IWatermarkRenderer {
         this.part?.update({ params: this.parameters?.params || {} });
     }
 
-    toJSON() {
+    layout(_width: number, _height: number): void {
-        return {
-            id: this.id,
-        };
-    }
-
-    layout(_width: number, _height: number) {
         // noop - retrieval from api
     }
 
-    updateParentGroup(group: GroupPanel, _isPanelVisible: boolean): void {
+    updateParentGroup(
+        group: DockviewGroupPanel,
+        _isPanelVisible: boolean
+    ): void {
         // noop - retrieval from api
         this._groupRef.value = group;
     }
 
-    dispose() {
+    dispose(): void {
         this.part?.dispose();
     }
 }

packages/dockview/src/dockview/v2/reactContentRenderer.ts

@@ -1,9 +1,10 @@
 import {
     GroupPanelPartInitParameters,
     IContentRenderer,
-    GroupPanel,
+    DockviewGroupPanel,
     HostedContainer,
     PanelUpdateEvent,
+    DockviewEvent,
 } from 'dockview-core';
 import { ReactPart, ReactPortalStore } from '../../react';
 import { IDockviewPanelProps } from '../dockview';
@@ -13,7 +14,7 @@ export class ReactContentRenderer implements IContentRenderer {
 
     private _element: HTMLElement;
     private part?: ReactPart<IDockviewPanelProps>;
-    private _group: GroupPanel | undefined;
+    private _group: DockviewGroupPanel | undefined;
 
     private parameters: GroupPanelPartInitParameters | undefined;
 
@@ -21,11 +22,11 @@ export class ReactContentRenderer implements IContentRenderer {
         return this._element;
     }
 
-    get onDidBlur() {
+    get onDidBlur(): DockviewEvent<void> {
         return this._hostedContainer.onDidBlur;
     }
 
-    get onDidFocus() {
+    get onDidFocus(): DockviewEvent<void> {
         return this._hostedContainer.onDidFocus;
     }
 
@@ -46,7 +47,7 @@ export class ReactContentRenderer implements IContentRenderer {
         this._element.style.width = '100%';
     }
 
-    focus() {
+    focus(): void {
         // noop
     }
 
@@ -74,13 +75,7 @@ export class ReactContentRenderer implements IContentRenderer {
         );
     }
 
-    public toJSON() {
+    public update(params: PanelUpdateEvent): void {
-        return {
-            id: this.id,
-        };
-    }
-
-    public update(params: PanelUpdateEvent) {
         if (this.parameters) {
             this.parameters.params = params.params;
         }
@@ -89,7 +84,7 @@ export class ReactContentRenderer implements IContentRenderer {
     }
 
     public updateParentGroup(
-        group: GroupPanel,
+        group: DockviewGroupPanel,
         _isPanelVisible: boolean
     ): void {
         this._group = group;
@@ -99,7 +94,7 @@ export class ReactContentRenderer implements IContentRenderer {
         this._hostedContainer.layout(this.element);
     }
 
-    public dispose() {
+    public dispose(): void {
         this.part?.dispose();
     }
 }

packages/dockview/src/dockview/v2/webviewContentRenderer.ts

@@ -1,7 +1,7 @@
 import {
     GroupPanelPartInitParameters,
     IContentRenderer,
-    GroupPanel,
+    DockviewGroupPanel,
     HostedContainer,
     PanelUpdateEvent,
 } from 'dockview-core';
@@ -24,7 +24,7 @@ export class WebviewContentRenderer implements IContentRenderer {
         this._element.style.width = '100%';
     }
 
-    focus() {
+    focus(): void {
         // noop
     }
 
@@ -32,14 +32,14 @@ export class WebviewContentRenderer implements IContentRenderer {
         this.parameters = parameters;
     }
 
-    public update(params: PanelUpdateEvent) {
+    public update(params: PanelUpdateEvent): void {
         if (this.parameters) {
             this.parameters.params = params.params;
         }
     }
 
     public updateParentGroup(
-        _group: GroupPanel,
+        _group: DockviewGroupPanel,
         _isPanelVisible: boolean
     ): void {
         //
@@ -49,7 +49,7 @@ export class WebviewContentRenderer implements IContentRenderer {
         this._hostedContainer.layout(this._element);
     }
 
-    public dispose() {
+    public dispose(): void {
         //
     }
 }