diff --git a/packages/dockview/src/dockview/components/watermark/watermark.ts b/packages/dockview/src/dockview/components/watermark/watermark.ts index 49bfa5e30..31403d959 100644 --- a/packages/dockview/src/dockview/components/watermark/watermark.ts +++ b/packages/dockview/src/dockview/components/watermark/watermark.ts @@ -1,6 +1,6 @@ import { GroupPanelPartInitParameters, - WatermarkPart, + IWatermarkRenderer, } from '../../../groupview/types'; import { ActionContainer } from '../../../actionbar/actionsContainer'; import { addDisposableListener } from '../../../events'; @@ -8,7 +8,9 @@ import { toggleClass } from '../../../dom'; import { CompositeDisposable } from '../../../lifecycle'; import { GroupviewPanel } from '../../../groupview/groupviewPanel'; -export class Watermark extends CompositeDisposable implements WatermarkPart { +export class Watermark + extends CompositeDisposable + implements IWatermarkRenderer { private _element: HTMLElement; private group: GroupviewPanel | undefined; private params: GroupPanelPartInitParameters | undefined; diff --git a/packages/dockview/src/dockview/dockviewComponent.ts b/packages/dockview/src/dockview/dockviewComponent.ts index e92a2cfb5..f8fe0cd7f 100644 --- a/packages/dockview/src/dockview/dockviewComponent.ts +++ b/packages/dockview/src/dockview/dockviewComponent.ts @@ -22,7 +22,7 @@ import { timeoutAsPromise } from '../async'; import { IContentRenderer, ITabRenderer, - WatermarkPart, + IWatermarkRenderer, } from '../groupview/types'; import { debounce } from '../functions'; import { sequentialNumberGenerator } from '../math'; @@ -101,7 +101,7 @@ export interface IDockviewComponent extends IBaseGrid { addPanel(options: AddPanelOptions): IGroupPanel; getGroupPanel: (id: string) => IGroupPanel | undefined; fireMouseEvent(event: LayoutMouseEvent): void; - createWatermarkComponent(): WatermarkPart; + createWatermarkComponent(): IWatermarkRenderer; setTabHeight(height: number | undefined): void; getTabHeight(): number | undefined; totalPanels: number; @@ -607,7 +607,7 @@ export class DockviewComponent return panel; } - createWatermarkComponent(): WatermarkPart { + createWatermarkComponent(): IWatermarkRenderer { return createComponent( 'watermark-id', 'watermark-name', diff --git a/packages/dockview/src/dockview/options.ts b/packages/dockview/src/dockview/options.ts index c071dfeac..97472cd13 100644 --- a/packages/dockview/src/dockview/options.ts +++ b/packages/dockview/src/dockview/options.ts @@ -6,7 +6,7 @@ import { IContentRenderer, ITabRenderer, WatermarkConstructor, - WatermarkPart, + IWatermarkRenderer, } from '../groupview/types'; import { GroupviewPanel } from '../groupview/groupviewPanel'; import { ISplitviewStyles, Orientation } from '../splitview/core/splitview'; @@ -15,7 +15,7 @@ import { FrameworkFactory } from '../types'; export interface GroupPanelFrameworkComponentFactory { content: FrameworkFactory; tab: FrameworkFactory; - watermark: FrameworkFactory; + watermark: FrameworkFactory; } export interface TabContextMenuEvent { diff --git a/packages/dockview/src/gridview/basePanelView.ts b/packages/dockview/src/gridview/basePanelView.ts index 27f44074c..dcc54de38 100644 --- a/packages/dockview/src/gridview/basePanelView.ts +++ b/packages/dockview/src/gridview/basePanelView.ts @@ -98,7 +98,13 @@ export abstract class BasePanelView } update(params: PanelUpdateEvent) { - this.params = { ...this.params, params: params.params }; + this.params = { + ...this.params, + params: { + ...this.params?.params, + ...params.params, + }, + }; this.part?.update(this.params.params); } diff --git a/packages/dockview/src/groupview/groupview.ts b/packages/dockview/src/groupview/groupview.ts index 496a6d675..916e58a7a 100644 --- a/packages/dockview/src/groupview/groupview.ts +++ b/packages/dockview/src/groupview/groupview.ts @@ -20,7 +20,7 @@ import { PanelInitParameters, PanelUpdateEvent } from '../panel/types'; import { IGroupPanel } from './groupPanel'; import { ContentContainer, IContentContainer } from './panel/content'; import { ITabsContainer, TabsContainer } from './titlebar/tabsContainer'; -import { WatermarkPart } from './types'; +import { IWatermarkRenderer } from './types'; import { GroupviewPanel } from './groupviewPanel'; export enum GroupChangeKind { @@ -120,7 +120,7 @@ export class Groupview extends CompositeDisposable implements IGroupview { private readonly contentContainer: IContentContainer; private readonly dropTarget: Droptarget; private _activePanel?: IGroupPanel; - private watermark?: WatermarkPart; + private watermark?: IWatermarkRenderer; private _isGroupActive = false; private mostRecentlyUsed: IGroupPanel[] = []; diff --git a/packages/dockview/src/groupview/types.ts b/packages/dockview/src/groupview/types.ts index 514f7d04a..469424cbf 100644 --- a/packages/dockview/src/groupview/types.ts +++ b/packages/dockview/src/groupview/types.ts @@ -24,11 +24,10 @@ export interface GroupPanelContentPartInitParameters tab: WrappedTab; } -export interface WatermarkPart extends IDisposable { - readonly id: string; +export interface IWatermarkRenderer extends IPanel { + readonly element: HTMLElement; init: (params: GroupPanelPartInitParameters) => void; updateParentGroup(group: GroupviewPanel, visible: boolean): void; - element: HTMLElement; } export interface ITabRenderer extends IPanel { @@ -67,5 +66,5 @@ export interface PanelContentPartConstructor { } export interface WatermarkConstructor { - new (): WatermarkPart; + new (): IWatermarkRenderer; } diff --git a/packages/dockview/src/react/dockview/reactContentPart.ts b/packages/dockview/src/react/dockview/reactContentPart.ts index 9fb8d975e..0652dfdee 100644 --- a/packages/dockview/src/react/dockview/reactContentPart.ts +++ b/packages/dockview/src/react/dockview/reactContentPart.ts @@ -121,7 +121,7 @@ export class ReactPanelContentPart implements IContentRenderer { this.parameters.params = params.params; } - this.part?.update(params.params); + this.part?.update({ params: this.parameters?.params || {} }); } public updateParentGroup( diff --git a/packages/dockview/src/react/dockview/reactHeaderPart.ts b/packages/dockview/src/react/dockview/reactHeaderPart.ts index e27a03d96..946756a19 100644 --- a/packages/dockview/src/react/dockview/reactHeaderPart.ts +++ b/packages/dockview/src/react/dockview/reactHeaderPart.ts @@ -11,7 +11,7 @@ import { IGroupPanelBaseProps } from './dockview'; export class ReactPanelHeaderPart implements ITabRenderer { private _element: HTMLElement; private part?: ReactPart; - private params: GroupPanelPartInitParameters | undefined; + private parameters: GroupPanelPartInitParameters | undefined; get element() { return this._element; @@ -30,7 +30,7 @@ export class ReactPanelHeaderPart implements ITabRenderer { } public init(parameters: GroupPanelPartInitParameters): void { - this.params = parameters; + this.parameters = parameters; this.part = new ReactPart( this.element, @@ -45,9 +45,14 @@ export class ReactPanelHeaderPart implements ITabRenderer { } public update(event: PanelUpdateEvent) { - if (this.params) { - this.params.params = { ...this.params?.params, ...event.params }; + if (this.parameters) { + this.parameters.params = { + ...this.parameters?.params, + ...event.params, + }; } + + this.part?.update({ params: this.parameters?.params || {} }); } public toJSON() { diff --git a/packages/dockview/src/react/dockview/reactWatermarkPart.ts b/packages/dockview/src/react/dockview/reactWatermarkPart.ts index 704e6f821..369101a4e 100644 --- a/packages/dockview/src/react/dockview/reactWatermarkPart.ts +++ b/packages/dockview/src/react/dockview/reactWatermarkPart.ts @@ -1,22 +1,24 @@ import * as React from 'react'; import { GroupPanelPartInitParameters, - WatermarkPart, + IWatermarkRenderer, } from '../../groupview/types'; import { GroupviewPanel } from '../../groupview/groupviewPanel'; import { ReactPart, ReactPortalStore } from '../react'; import { IGroupPanelBaseProps } from './dockview'; +import { PanelUpdateEvent } from '../../panel/types'; interface IWatermarkPanelProps extends IGroupPanelBaseProps { close: () => void; } -export class ReactWatermarkPart implements WatermarkPart { +export class ReactWatermarkPart implements IWatermarkRenderer { private _element: HTMLElement; private part?: ReactPart; private _groupRef: { value: GroupviewPanel | undefined } = { value: undefined, }; + private parameters: GroupPanelPartInitParameters | undefined; get element() { return this._element; @@ -32,7 +34,9 @@ export class ReactWatermarkPart implements WatermarkPart { this._element.style.width = '100%'; } - public init(parameters: GroupPanelPartInitParameters): void { + init(parameters: GroupPanelPartInitParameters): void { + this.parameters = parameters; + this.part = new ReactPart( this.element, this.reactPortalStore, @@ -52,25 +56,34 @@ export class ReactWatermarkPart implements WatermarkPart { ); } - public toJSON() { + focus() { + // noop + } + + update(params: PanelUpdateEvent) { + if (this.parameters) { + this.parameters.params = params.params; + } + + this.part?.update({ params: this.parameters?.params || {} }); + } + + toJSON() { return { id: this.id, }; } - public layout(width: number, height: number) { + layout(width: number, height: number) { // noop - retrieval from api } - public updateParentGroup( - group: GroupviewPanel, - isPanelVisible: boolean - ): void { + updateParentGroup(group: GroupviewPanel, isPanelVisible: boolean): void { // noop - retrieval from api this._groupRef.value = group; } - public dispose() { + dispose() { this.part?.dispose(); } }