rei-mirrors/dockview
1
0
Fork 0
mirror of https://github.com/mathuo/dockview synced 2025-03-13 01:12:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/mathuo/dockview into master

Browse Source
This commit is contained in:
mathuo 2022-03-14 20:03:56 +00:00
commit 3d970f51ea
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
7 changed files with 47 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
packages/dockview/src/api/groupPanelApi.ts
View File

@ -2,6 +2,7 @@ import { Emitter } from '../events';
import { GridviewPanelApiImpl, GridviewPanelApi } from './gridviewPanelApi';
import { IGroupPanel } from '../groupview/groupPanel';
import { GroupviewPanel } from '../groupview/groupviewPanel';
import { MutableDisposable } from '../lifecycle';
export interface TitleEvent {
readonly title: string;
@ -40,6 +41,14 @@ export class DockviewPanelApiImpl
readonly _suppressClosableChanged = new Emitter<SuppressClosableEvent>();
readonly suppressClosableChanged = this._suppressClosableChanged.event;
private readonly _onDidActiveGroupChange = new Emitter<void>();
readonly onDidActiveGroupChange = this._onDidActiveGroupChange.event;
private readonly _onDidGroupChange = new Emitter<void>();
readonly onDidGroupChange = this._onDidGroupChange.event;
private disposable = new MutableDisposable();
get title() {
return this.panel.title;
}
@ -53,7 +62,21 @@ export class DockviewPanelApiImpl
}
set group(value: GroupviewPanel | undefined) {
const isOldGroupActive = this.isGroupActive;
this._group = value;
this._onDidGroupChange.fire();
if (this._group) {
this.disposable.value = this._group.api.onDidActiveChange(() => {
this._onDidActiveGroupChange.fire();
});
if (this.isGroupActive !== isOldGroupActive) {
this._onDidActiveGroupChange.fire();
}
}
}
get group(): GroupviewPanel | undefined {
@ -62,12 +85,15 @@ export class DockviewPanelApiImpl
constructor(private panel: IGroupPanel, group: GroupviewPanel | undefined) {
super(panel.id);
this._group = group;
this.group = group;
this.addDisposables(
this.disposable,
this._onDidTitleChange,
this._titleChanged,
this._suppressClosableChanged
this._suppressClosableChanged,
this._onDidGroupChange,
this._onDidActiveGroupChange
);
}

4
packages/dockview/src/react/dockview/dockview.scss Normal file
View File

@ -0,0 +1,4 @@
.dockview-react-part {
height: 100%;
width: 100%;
}

23
packages/dockview/src/react/dockview/dockview.tsx
View File

@ -13,7 +13,7 @@ import {
import { DockviewPanelApi } from '../../api/groupPanelApi';
import { usePortalsLifecycle } from '../react';
import { DockviewApi } from '../../api/component.api';
import { ReactWatermarkPart } from './reactWatermarkPart';
import { IWatermarkPanelProps, ReactWatermarkPart } from './reactWatermarkPart';
import { PanelCollection, PanelParameters } from '../types';
import { watchElementResize } from '../../dom';
import { IContentRenderer, ITabRenderer } from '../../groupview/types';
@ -25,24 +25,19 @@ export interface IGroupPanelBaseProps<T extends {} = Record<string, any>>
containerApi: DockviewApi;
}
export interface IDockviewPanelProps<T extends { [index: string]: any } = any>
extends IGroupPanelBaseProps<T> {
// noop
}
export type IDockviewPanelHeaderProps<T extends {} = Record<string, any>> =
IGroupPanelBaseProps<T>;
export type IDockviewPanelProps<T extends { [index: string]: any } = any> =
IGroupPanelBaseProps<T>;
export interface DockviewReadyEvent {
api: DockviewApi;
}
export interface IWatermarkPanelProps<T extends {} = Record<string, any>>
extends PanelParameters<T> {
containerApi: DockviewApi;
close(): void;
}
export interface IDockviewReactProps {
components?: PanelCollection<IDockviewPanelProps>;
tabComponents?: PanelCollection<IGroupPanelBaseProps>;
tabComponents?: PanelCollection<IDockviewPanelHeaderProps>;
watermarkComponent?: React.FunctionComponent<IWatermarkPanelProps>;
onReady?: (event: DockviewReadyEvent) => void;
debug?: boolean;
@ -86,7 +81,7 @@ export const DockviewReact = React.forwardRef(
createComponent: (
id: string,
componentId: string,
component: React.FunctionComponent<IGroupPanelBaseProps>
component: React.FunctionComponent<IDockviewPanelProps>
): IContentRenderer => {
return new ReactPanelContentPart(
componentId,
@ -101,7 +96,7 @@ export const DockviewReact = React.forwardRef(
createComponent: (
id: string,
componentId: string,
component: React.FunctionComponent<IGroupPanelBaseProps>
component: React.FunctionComponent<IDockviewPanelHeaderProps>
): ITabRenderer => {
return new ReactPanelHeaderPart(
componentId,

6
packages/dockview/src/react/dockview/reactContentPart.ts
View File

@ -54,8 +54,7 @@ export class ReactPanelContentPart implements IContentRenderer {
private readonly reactPortalStore: ReactPortalStore
) {
this._element = document.createElement('div');
this._element.style.height = '100%';
this._element.style.width = '100%';
this._element.className = 'dockview-react-part';
// this.hostedContainer = new HostedContainer({
// id,
@ -65,8 +64,7 @@ export class ReactPanelContentPart implements IContentRenderer {
// this.hostedContainer.onDidBlur(() => this._onDidBlur.fire());
this._actionsElement = document.createElement('div');
this._actionsElement.style.height = '100%';
this._actionsElement.style.width = '100%';
this._actionsElement.className = 'dockview-react-part';
}
focus() {

1
packages/dockview/src/react/dockview/reactHeaderPart.ts
View File

@ -22,6 +22,7 @@ export class ReactPanelHeaderPart implements ITabRenderer {
private readonly reactPortalStore: ReactPortalStore
) {
this._element = document.createElement('div');
this._element.className = 'dockview-react-part';
}
focus() {

5
packages/dockview/src/react/dockview/reactWatermarkPart.ts
View File

@ -8,7 +8,7 @@ import { ReactPart, ReactPortalStore } from '../react';
import { IGroupPanelBaseProps } from './dockview';
import { PanelUpdateEvent } from '../../panel/types';
interface IWatermarkPanelProps extends IGroupPanelBaseProps {
export interface IWatermarkPanelProps extends IGroupPanelBaseProps {
close: () => void;
}
@ -30,8 +30,7 @@ export class ReactWatermarkPart implements IWatermarkRenderer {
private readonly reactPortalStore: ReactPortalStore
) {
this._element = document.createElement('div');
this._element.style.height = '100%';
this._element.style.width = '100%';
this._element.className = 'dockview-react-part';
}
init(parameters: GroupPanelPartInitParameters): void {

1
packages/dockview/src/react/index.ts
View File

@ -4,6 +4,7 @@ export * from './splitview/splitview';
export * from './gridview/gridview';
export * from './dockview/reactContentPart';
export * from './dockview/reactHeaderPart';
export { IWatermarkPanelProps } from './dockview/reactWatermarkPart';
export * from './paneview/paneview';
export * from './types';
export * from './react';