feat: minor style and Type fixes

This commit is contained in:
mathuo 2022-03-14 19:53:36 +00:00
parent c3f1bda881
commit 88b871af25
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
6 changed files with 19 additions and 21 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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