Merge pull request #112 from mathuo/111-api-improvements

feat: fix typo

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

@@ -134,7 +134,7 @@ describe('component.api', () => {
                 'onDidActivePanelChange',
                 'onDidAddPanel',
                 'onDidRemovePanel',
-                'onDidLayoutfromJSON',
+                'onDidLayoutFromJSON',
             ];
 
             for (const _ of list) {

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

@@ -1,4 +1,4 @@
-import { IDockviewComponent } from '../../dockview/dockviewComponent';
+import { DockviewComponent } from '../../dockview/dockviewComponent';
 import { DockviewPanelApiImpl, TitleEvent } from '../../api/groupPanelApi';
 import { IDockviewPanel } from '../../groupview/groupPanel';
 import { GroupPanel } from '../../groupview/groupviewPanel';
@@ -10,9 +10,9 @@ describe('groupPanelApi', () => {
             title: 'test_title',
         };
 
-        const accessor: Partial<IDockviewComponent> = {};
+        const accessor: Partial<DockviewComponent> = {};
         const groupViewPanel = new GroupPanel(
-            <IDockviewComponent>accessor,
+            <DockviewComponent>accessor,
             '',
             {}
         );
@@ -44,9 +44,9 @@ describe('groupPanelApi', () => {
             id: 'test_id',
         };
 
-        const accessor: Partial<IDockviewComponent> = {};
+        const accessor: Partial<DockviewComponent> = {};
         const groupViewPanel = new GroupPanel(
-            <IDockviewComponent>accessor,
+            <DockviewComponent>accessor,
             '',
             {}
         );
@@ -66,7 +66,7 @@ describe('groupPanelApi', () => {
         expect(cut.group).toBe(groupViewPanel);
 
         const groupViewPanel2 = new GroupPanel(
-            <IDockviewComponent>accessor,
+            <DockviewComponent>accessor,
             '',
             {}
         );

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

@@ -1,7 +1,4 @@
-import {
-    DockviewComponent,
-    IDockviewComponent,
-} from '../../dockview/dockviewComponent';
+import { DockviewComponent } from '../../dockview/dockviewComponent';
 import {
     GroupPanelPartInitParameters,
     IContentRenderer,
@@ -153,7 +150,7 @@ class TestGroupPanel implements IDockviewPanel {
     constructor(
         public readonly id: string,
         public readonly title: string,
-        accessor: IDockviewComponent
+        accessor: DockviewComponent
     ) {
         this.api = new DockviewPanelApiImpl(this, this._group);
         this._group = new GroupPanel(accessor, id, {});

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

@@ -1,7 +1,4 @@
-import {
-    IDockviewComponent,
-    DockviewComponent,
-} from '../../dockview/dockviewComponent';
+import { DockviewComponent } from '../../dockview/dockviewComponent';
 import {
     GroupviewPanelState,
     IDockviewPanel,
@@ -210,7 +207,7 @@ class TestPanel implements IDockviewPanel {
 
 describe('groupview', () => {
     let groupview: GroupPanel;
-    let dockview: IDockviewComponent;
+    let dockview: DockviewComponent;
     let options: GroupOptions;
 
     let removePanelMock: jest.Mock;
@@ -528,7 +525,7 @@ describe('groupview', () => {
     });
 
     test("that openPanel with skipSetActive doesn't set panel to active", () => {
-        const dockviewComponent: IDockviewComponent = new DockviewComponent(
+        const dockviewComponent = new DockviewComponent(
             document.createElement('div'),
             {
                 components: {

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

@@ -369,7 +369,7 @@ export class DockviewApi implements CommonApi<SerializedDockview> {
     }
 
     get onDidLayoutFromJSON(): Event<void> {
-        return this.component.onDidLayoutfromJSON;
+        return this.component.onDidLayoutFromJSON;
     }
 
     get onDidLayoutChange(): Event<void> {

packages/dockview/src/dockview/dockviewComponent.ts

@@ -63,7 +63,7 @@ export interface SerializedDockview {
 }
 
 export type DockviewComponentUpdateOptions = Pick<
-DockviewComponentOptions,
+    DockviewComponentOptions,
     | 'orientation'
     | 'components'
     | 'frameworkComponents'
@@ -98,13 +98,11 @@ export interface IDockviewComponent extends IBaseGrid<GroupPanel> {
     addPanel(options: AddPanelOptions): IDockviewPanel;
     removePanel(panel: IDockviewPanel): void;
     getGroupPanel: (id: string) => IDockviewPanel | undefined;
-    fireMouseEvent(event: LayoutMouseEvent): void;
     createWatermarkComponent(): IWatermarkRenderer;
     // lifecycle
     addEmptyGroup(options?: AddGroupOptions): void;
     closeAllGroups(): void;
     // events
-    onTabInteractionEvent: Event<LayoutMouseEvent>;
     onTabContextMenu: Event<TabContextMenuEvent>;
     moveToNext(options?: MovementOptions): void;
     moveToPrevious(options?: MovementOptions): void;
@@ -115,7 +113,7 @@ export interface IDockviewComponent extends IBaseGrid<GroupPanel> {
     //
     readonly onDidRemovePanel: Event<IDockviewPanel>;
     readonly onDidAddPanel: Event<IDockviewPanel>;
-    readonly onDidLayoutfromJSON: Event<void>;
+    readonly onDidLayoutFromJSON: Event<void>;
     readonly onDidActivePanelChange: Event<IDockviewPanel | undefined>;
 }
 
@@ -127,11 +125,6 @@ export class DockviewComponent
     private _api: DockviewApi;
     private _options: DockviewComponentOptions;
 
-    // events
-    private readonly _onTabInteractionEvent = new Emitter<LayoutMouseEvent>();
-    readonly onTabInteractionEvent: Event<LayoutMouseEvent> =
-        this._onTabInteractionEvent.event;
-
     private readonly _onTabContextMenu = new Emitter<TabContextMenuEvent>();
     readonly onTabContextMenu: Event<TabContextMenuEvent> =
         this._onTabContextMenu.event;
@@ -147,7 +140,7 @@ export class DockviewComponent
     readonly onDidAddPanel: Event<IDockviewPanel> = this._onDidAddPanel.event;
 
     private readonly _onDidLayoutfromJSON = new Emitter<void>();
-    readonly onDidLayoutfromJSON: Event<void> = this._onDidLayoutfromJSON.event;
+    readonly onDidLayoutFromJSON: Event<void> = this._onDidLayoutfromJSON.event;
 
     private readonly _onDidActivePanelChange = new Emitter<
         IDockviewPanel | undefined
@@ -204,7 +197,6 @@ export class DockviewComponent
         });
 
         this.addDisposables(
-            this._onTabInteractionEvent,
             this._onTabContextMenu,
             this._onDidDrop,
             Event.any(
@@ -278,9 +270,7 @@ export class DockviewComponent
         if (options.includePanel && options.group) {
             if (
                 options.group.activePanel !==
-                options.group.panels[
-                    options.group.panels.length - 1
-                ]
+                options.group.panels[options.group.panels.length - 1]
             ) {
                 options.group.model.moveToNext({ suppressRoll: true });
                 return;
@@ -288,7 +278,7 @@ export class DockviewComponent
         }
 
         const location = getGridLocation(options.group.element);
-        const next = <GroupPanel>this.gridview.next(location)?.view
+        const next = <GroupPanel>this.gridview.next(location)?.view;
         this.doSetGroupActive(next);
     }
 
@@ -301,10 +291,7 @@ export class DockviewComponent
         }
 
         if (options.includePanel && options.group) {
-            if (
-                options.group.activePanel !==
-                options.group.panels[0]
-            ) {
+            if (options.group.activePanel !== options.group.panels[0]) {
                 options.group.model.moveToPrevious({ suppressRoll: true });
                 return;
             }
@@ -362,14 +349,14 @@ export class DockviewComponent
         }
 
         this.gridview.deserialize(
-            grid,
-            new DefaultDeserializer(this, {
-                createPanel: (id, group) => {
-                    const panelData = panels[id];
-                    return this.deserializer!.fromJSON(panelData, group);
-                },
-            })
-        );
+          grid,
+          new DefaultDeserializer(this, {
+              createPanel: (id, group) => {
+                  const panelData = panels[id];
+                  return this.deserializer!.fromJSON(panelData, group);
+              },
+          })
+      );
 
         if (typeof activeGroup === 'string') {
             const panel = this.getPanel(activeGroup);
@@ -411,27 +398,27 @@ export class DockviewComponent
         let referenceGroup: GroupPanel | undefined;
 
         if (options.position?.referencePanel) {
-          const referencePanel = this.getGroupPanel(
-              options.position.referencePanel
-          );
+            const referencePanel = this.getGroupPanel(
+                options.position.referencePanel
+            );
 
-          if (!referencePanel) {
-              throw new Error(
-                  `referencePanel ${options.position.referencePanel} does not exist`
-              );
-          }
+            if (!referencePanel) {
+                throw new Error(
+                    `referencePanel ${options.position.referencePanel} does not exist`
+                );
+            }
 
             referenceGroup = this.findGroup(referencePanel);
         } else {
             referenceGroup = this.activeGroup;
         }
 
-      let panel: IDockviewPanel
+        let panel: IDockviewPanel;
 
         if (referenceGroup) {
             const target = toTarget(options.position?.direction || 'within');
             if (target === Position.Center) {
-               panel = this.createPanel(options, referenceGroup)
+                panel = this.createPanel(options, referenceGroup);
                 referenceGroup.model.openPanel(panel);
             } else {
                 const location = getGridLocation(referenceGroup.element);
@@ -441,13 +428,13 @@ export class DockviewComponent
                     target
                 );
                 const group = this.createGroupAtLocation(relativeLocation);
-                panel = this.createPanel(options, group)
+                panel = this.createPanel(options, group);
                 group.model.openPanel(panel);
             }
         } else {
-          const group = this.createGroupAtLocation();
-          panel = this.createPanel(options, group);
-          group.model.openPanel(panel);
+            const group = this.createGroupAtLocation();
+            panel = this.createPanel(options, group);
+            group.model.openPanel(panel);
         }
 
         return panel;
@@ -624,25 +611,25 @@ export class DockviewComponent
                     target
                 );
 
-                const group = this.createGroupAtLocation( dropLocation);
+                const group = this.createGroupAtLocation(dropLocation);
                 group.model.openPanel(groupItem);
             }
         }
     }
 
     override doSetGroupActive(
-        group: GroupPanel | undefined,
-        skipFocus?: boolean
-    ): void {
-        const isGroupAlreadyFocused = this._activeGroup === group;
-        super.doSetGroupActive(group, skipFocus);
+      group: GroupPanel | undefined,
+      skipFocus?: boolean
+  ): void {
+      const isGroupAlreadyFocused = this._activeGroup === group;
+      super.doSetGroupActive(group, skipFocus);
 
-        if (!isGroupAlreadyFocused && this._activeGroup?.activePanel) {
-            this._onDidActivePanelChange.fire(
-                this._activeGroup?.activePanel
-            );
-        }
-    }
+      if (!isGroupAlreadyFocused && this._activeGroup?.activePanel) {
+          this._onDidActivePanelChange.fire(
+              this._activeGroup?.activePanel
+          );
+      }
+  }
 
     createGroup(options?: GroupOptions): GroupPanel {
         if (!options) {
@@ -713,13 +700,21 @@ export class DockviewComponent
         return view;
     }
 
-    private createPanel(options: AddPanelOptions, group: GroupPanel): IDockviewPanel {
+    private createPanel(
+        options: AddPanelOptions,
+        group: GroupPanel
+    ): IDockviewPanel {
         const view = new DefaultGroupPanelView({
             content: this.createContentComponent(options.id, options.component),
             tab: this.createTabComponent(options.id, options.tabComponent),
         });
 
-        const panel = new DockviewGroupPanel(options.id, this, this._api, group);
+        const panel = new DockviewGroupPanel(
+            options.id,
+            this,
+            this._api,
+            group
+        );
         panel.init({
             view,
             title: options.title || options.id,
@@ -757,12 +752,10 @@ export class DockviewComponent
         );
     }
 
-    private createGroupAtLocation(
-        location: number[] = [0]
-    ): GroupPanel {
+    private createGroupAtLocation(location: number[] = [0]): GroupPanel {
         const group = this.createGroup();
         this.doAddGroup(group, location);
-        return group
+        return group;
     }
 
     private findGroup(panel: IDockviewPanel): GroupPanel | undefined {

packages/dockview/src/gridview/basePanelView.ts

@@ -20,7 +20,6 @@ export interface BasePanelViewExported<T extends PanelApiImpl> {
     readonly width: number;
     readonly height: number;
     readonly params: Record<string, any> | undefined;
-    focus(): void;
     toJSON(): object;
     update(event: PanelUpdateEvent): void;
 }

packages/dockview/src/groupview/groupview.ts

@@ -1,7 +1,7 @@
 import { DockviewApi } from '../api/component.api';
 import { getPanelData, PanelTransfer } from '../dnd/dataTransfer';
 import { Droptarget, Position } from '../dnd/droptarget';
-import { IDockviewComponent } from '../dockview/dockviewComponent';
+import { DockviewComponent } from '../dockview/dockviewComponent';
 import { isAncestor, toggleClass } from '../dom';
 import { addDisposableListener, Emitter, Event } from '../events';
 import { IGridPanelView } from '../gridview/baseComponentGridview';
@@ -217,7 +217,7 @@ export class Groupview extends CompositeDisposable implements IGroupview {
 
     constructor(
         private readonly container: HTMLElement,
-        private accessor: IDockviewComponent,
+        private accessor: DockviewComponent,
         public id: string,
         private readonly options: GroupOptions,
         private readonly parent: GroupPanel

packages/dockview/src/groupview/groupviewPanel.ts

@@ -1,5 +1,5 @@
 import { IFrameworkPart } from '../panel/types';
-import { IDockviewComponent } from '../dockview/dockviewComponent';
+import { DockviewComponent } from '../dockview/dockviewComponent';
 import {
     GridviewPanelApi,
     GridviewPanelApiImpl,
@@ -70,7 +70,7 @@ export class GroupPanel extends GridviewPanel implements IGroupviewPanel {
     }
 
     constructor(
-        accessor: IDockviewComponent,
+        accessor: DockviewComponent,
         id: string,
         options: GroupOptions
     ) {

packages/dockview/src/groupview/titlebar/tabsContainer.ts

@@ -7,7 +7,7 @@ import { addDisposableListener, Emitter, Event } from '../../events';
 import { ITab, MouseEventKind, Tab } from '../tab';
 import { last } from '../../array';
 import { IDockviewPanel } from '../groupPanel';
-import { IDockviewComponent } from '../../dockview/dockviewComponent';
+import { DockviewComponent } from '../../dockview/dockviewComponent';
 import { getPanelData } from '../../dnd/dataTransfer';
 import { GroupPanel } from '../groupviewPanel';
 import { Droptarget } from '../../dnd/droptarget';
@@ -138,7 +138,7 @@ export class TabsContainer
     }
 
     constructor(
-        private accessor: IDockviewComponent,
+        private accessor: DockviewComponent,
         private group: GroupPanel,
         options: { tabHeight?: number }
     ) {