chore: update docs

This commit is contained in:
mathuo 2022-05-08 19:49:28 +01:00
parent 1f0bc97b10
commit 0ba72eeb5e
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
4 changed files with 16 additions and 15 deletions

View File

@ -17,6 +17,7 @@
A zero dependency layout manager based on the layering of splitview with support for ReactJS components, written in TypeScript. A zero dependency layout manager based on the layering of splitview with support for ReactJS components, written in TypeScript.
- [➡️](https://mathuo.github.io/dockview/docs) Documentation
- [➡️](https://mathuo.github.io/dockview/) Live demo - [➡️](https://mathuo.github.io/dockview/) Live demo
- [➡️](https://mathuo.github.io/dockview/output/storybook-static) Storybook demo - [➡️](https://mathuo.github.io/dockview/output/storybook-static) Storybook demo
- [➡️](https://github.com/mathuo/dockview/tree/master/packages/dockview-demo/src/stories) Code examples - [➡️](https://github.com/mathuo/dockview/tree/master/packages/dockview-demo/src/stories) Code examples

View File

@ -84,15 +84,15 @@ const onReady = (event: DockviewReadyEvent) => {
| length | `number` | Number of panels | | length | `number` | Number of panels |
| size | `number` | Number of Groups | | size | `number` | Number of Groups |
| panels | `IDockviewPanel[]` | | | panels | `IDockviewPanel[]` | |
| groups | `IDockviewPanel[]` | | | groups | `GroupPanel[]` | |
| activePanel | `IDockviewPanel \| undefined` | | | activePanel | `IDockviewPanel \| undefined` | |
| activeGroup | `IDockviewPanel \| undefined` | | | activeGroup | `IDockviewPanel \| undefined` | |
| | | | | | | |
| onDidLayoutChange | `Event<void>` | | | onDidLayoutChange | `Event<void>` | |
| onDidLayoutFromJSON | `Event<void>` | | | onDidLayoutFromJSON | `Event<void>` | |
| onDidAddGroup | `Event<IDockviewPanel>` | | | onDidAddGroup | `Event<GroupPanel>` | |
| onDidRemoveGroup | `Event<IDockviewPanel>` | | | onDidRemoveGroup | `Event<GroupPanel>` | |
| onDidActiveGroupChange | `Event<IDockviewPanel \| undefined>` | | | onDidActiveGroupChange | `Event<GroupPanel \| undefined>` | |
| onDidAddPanel | `Event<IDockviewPanel>` | | | onDidAddPanel | `Event<IDockviewPanel>` | |
| onDidRemovePanel | `Event<IDockviewPanel>` | | | onDidRemovePanel | `Event<IDockviewPanel>` | |
| onDidActivePanelChange | `Event<IDockviewPanel \| undefined>` | | | onDidActivePanelChange | `Event<IDockviewPanel \| undefined>` | |
@ -102,8 +102,8 @@ const onReady = (event: DockviewReadyEvent) => {
| getPanel | `(id: string) \| IDockviewPanel \| undefined` | | | getPanel | `(id: string) \| IDockviewPanel \| undefined` | |
| addEmptyGroup | `(options? AddGroupOptions): void` | | | addEmptyGroup | `(options? AddGroupOptions): void` | |
| closeAllGroups | `(): void` | | | closeAllGroups | `(): void` | |
| removeGroup | `(group: IDockviewPanel): void` | | | removeGroup | `(group: GroupPanel): void` | |
| getGroup | `(id: string): IDockviewPanel \| undefined` | | | getGroup | `(id: string): GroupPanel \| undefined` | |
| | | | | | | |
| getTabHeight | `(): number \| undefined` | | | getTabHeight | `(): number \| undefined` | |
| setTabHeight | `(hegiht: number \| undefined): void` | | | setTabHeight | `(hegiht: number \| undefined): void` | |

View File

@ -99,6 +99,7 @@ const Component = () => {
event.api.addPanel({ event.api.addPanel({
id: 'panel1', id: 'panel1',
component: 'default', component: 'default',
tabComponent: 'customTab', // optional custom header
params: { params: {
someProps: 'Hello', someProps: 'Hello',
}, },
@ -116,7 +117,7 @@ const Component = () => {
return ( return (
<DockviewReact <DockviewReact
components={components} components={components}
tabComponents={headers} tabComponents={headers} // optional headers renderer
onReady={onReady} onReady={onReady}
/> />
); );
@ -131,13 +132,12 @@ const components: PanelCollection<IDockviewPanelProps> = {
return <div>{props.params.someProps}</div>; return <div>{props.params.someProps}</div>;
}, },
fancy: (props: IDockviewPanelProps) => { fancy: (props: IDockviewPanelProps) => {
const close = () => props.api.close();
return ( return (
<DockviewComponents.Panel> <DockviewComponents.Panel>
<DockviewComponents.Tab> <DockviewComponents.Tab>
<div> <div>
<span>{props.api.title}</span> <span>{props.api.title}</span>
<span onClick={close}>{'Close'}</span> <span onClick={() => props.api.close()}>{'Close'}</span>
</div> </div>
</DockviewComponents.Tab> </DockviewComponents.Tab>
<DockviewComponents.Content> <DockviewComponents.Content>

View File

@ -364,15 +364,15 @@ export class DockviewApi implements CommonApi<SerializedDockview> {
return this.component.totalPanels; return this.component.totalPanels;
} }
get onDidActiveGroupChange(): Event<IGroupviewPanel | undefined> { get onDidActiveGroupChange(): Event<GroupPanel | undefined> {
return this.component.onDidActiveGroupChange; return this.component.onDidActiveGroupChange;
} }
get onDidAddGroup(): Event<IGroupviewPanel> { get onDidAddGroup(): Event<GroupPanel> {
return this.component.onDidAddGroup; return this.component.onDidAddGroup;
} }
get onDidRemoveGroup(): Event<IGroupviewPanel> { get onDidRemoveGroup(): Event<GroupPanel> {
return this.component.onDidRemoveGroup; return this.component.onDidRemoveGroup;
} }
@ -404,7 +404,7 @@ export class DockviewApi implements CommonApi<SerializedDockview> {
return this.component.panels; return this.component.panels;
} }
get groups(): IGroupviewPanel[] { get groups(): GroupPanel[] {
return this.component.groups; return this.component.groups;
} }
@ -412,7 +412,7 @@ export class DockviewApi implements CommonApi<SerializedDockview> {
return this.component.activePanel; return this.component.activePanel;
} }
get activeGroup(): IGroupviewPanel | undefined { get activeGroup(): GroupPanel | undefined {
return this.component.activeGroup; return this.component.activeGroup;
} }
@ -462,7 +462,7 @@ export class DockviewApi implements CommonApi<SerializedDockview> {
this.component.removeGroup(<GroupPanel>group); this.component.removeGroup(<GroupPanel>group);
} }
getGroup(id: string): IGroupviewPanel | undefined { getGroup(id: string): GroupPanel | undefined {
return this.component.getPanel(id); return this.component.getPanel(id);
} }