chore: improve docs

This commit is contained in:
mathuo 2023-04-06 20:34:40 +01:00
parent acb500a9d8
commit c4f778f1cc
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
5 changed files with 18 additions and 19 deletions

View File

@ -15,9 +15,9 @@
## ##
Please see the website: https://dockview.dev ![](packages/docs/static/img/splashscreen.gif)
Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@latest/ Please see the website: https://dockview.dev
## Features ## Features
@ -29,11 +29,11 @@ Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@l
- Tabular docking and Drag and Drop support - Tabular docking and Drag and Drop support
- Documentation and examples - Documentation and examples
This project was inspired by many popular IDE editors. Some parts of the core resizable panelling are inspired by code found in the VSCode codebase, [splitview](https://github.com/microsoft/vscode/tree/main/src/vs/base/browser/ui/splitview) and [gridview](https://github.com/microsoft/vscode/tree/main/src/vs/base/browser/ui/grid). Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@latest/
## Quick start ## Quick start
Dockview has a peer dependency on `react >= 16.8.0` and `react-dom >= 16.8.0`. You can install dockview from [npm](https://www.npmjs.com/package/dockview). Please see the [Getting Started Guide](https://mathuo.github.io/dockview/docs/). Dockview has a peer dependency on `react >= 16.8.0` and `react-dom >= 16.8.0`. You can install dockview from [npm](https://www.npmjs.com/package/dockview).
``` ```
npm install --save dockview npm install --save dockview

View File

@ -1,7 +1,7 @@
<div align="center"> <div align="center">
<h1>dockview</h1> <h1>dockview</h1>
<p>Zero dependency layout manager supporting tabs, grids and splitviews with ReactJS support written in TypeScript</p> <p>Zero dependency layout manager supporting tabs, grids and splitviews written in TypeScript</p>
</div> </div>
@ -17,8 +17,6 @@
Please see the website: https://dockview.dev Please see the website: https://dockview.dev
Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@latest/
## Features ## Features
- Simple splitviews, nested splitviews (i.e. gridviews) supporting full layout managment with - Simple splitviews, nested splitviews (i.e. gridviews) supporting full layout managment with
@ -29,20 +27,20 @@ Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@l
- Tabular docking and Drag and Drop support - Tabular docking and Drag and Drop support
- Documentation and examples - Documentation and examples
This project was inspired by many popular IDE editors. Some parts of the core resizable panelling are inspired by code found in the VSCode codebase, [splitview](https://github.com/microsoft/vscode/tree/main/src/vs/base/browser/ui/splitview) and [gridview](https://github.com/microsoft/vscode/tree/main/src/vs/base/browser/ui/grid). Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview-core@latest/
## Quick start ## Quick start
Dockview has a peer dependency on `react >= 16.8.0` and `react-dom >= 16.8.0`. You can install dockview from [npm](https://www.npmjs.com/package/dockview). Please see the [Getting Started Guide](https://mathuo.github.io/dockview/docs/). You can install dockview-core from [npm](https://www.npmjs.com/package/dockview-core).
``` ```
npm install --save dockview npm install --save dockview-core
``` ```
Within your project you must import or reference the stylesheet at `dockview/dist/styles/dockview.css` and attach a theme. Within your project you must import or reference the stylesheet at `dockview-core/dist/styles/dockview.css` and attach a theme.
```css ```css
@import '~dockview/dist/styles/dockview.css'; @import '~dockview-core/dist/styles/dockview.css';
``` ```
You should also attach a dockview theme to an element containing your components. For example: You should also attach a dockview theme to an element containing your components. For example:

View File

@ -17,8 +17,6 @@
Please see the website: https://dockview.dev Please see the website: https://dockview.dev
Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@latest/
## Features ## Features
- Simple splitviews, nested splitviews (i.e. gridviews) supporting full layout managment with - Simple splitviews, nested splitviews (i.e. gridviews) supporting full layout managment with
@ -29,11 +27,11 @@ Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@l
- Tabular docking and Drag and Drop support - Tabular docking and Drag and Drop support
- Documentation and examples - Documentation and examples
This project was inspired by many popular IDE editors. Some parts of the core resizable panelling are inspired by code found in the VSCode codebase, [splitview](https://github.com/microsoft/vscode/tree/main/src/vs/base/browser/ui/splitview) and [gridview](https://github.com/microsoft/vscode/tree/main/src/vs/base/browser/ui/grid). Want to inspect the latest deployment? Go to https://unpkg.com/browse/dockview@latest/
## Quick start ## Quick start
Dockview has a peer dependency on `react >= 16.8.0` and `react-dom >= 16.8.0`. You can install dockview from [npm](https://www.npmjs.com/package/dockview). Please see the [Getting Started Guide](https://mathuo.github.io/dockview/docs/). Dockview has a peer dependency on `react >= 16.8.0` and `react-dom >= 16.8.0`. You can install dockview from [npm](https://www.npmjs.com/package/dockview).
``` ```
npm install --save dockview npm install --save dockview

Binary file not shown.

After

Width:  |  Height:  |  Size: 168 KiB

View File

@ -47,7 +47,7 @@ import { DockviewReact } from 'dockview';
``` ```
| Property | Type | Optional | Default | Description | | Property | Type | Optional | Default | Description |
| --------------------- | ------------------------------------ | -------- | --------- | ------------------------------------------------------------ | --- | | --------------------- | ------------------------------------ | -------- | --------- | ------------------------------------------------------------ |
| onReady | (event: SplitviewReadyEvent) => void | No | | | | onReady | (event: SplitviewReadyEvent) => void | No | | |
| components | object | No | | | | components | object | No | | |
| tabComponents | object | Yes | | | | tabComponents | object | Yes | | |
@ -58,7 +58,7 @@ import { DockviewReact } from 'dockview';
| onDidDrop | Event | Yes | false | | | onDidDrop | Event | Yes | false | |
| showDndOverlay | Event | Yes | false | | | showDndOverlay | Event | Yes | false | |
| defaultTabComponent | object | Yes | | | | defaultTabComponent | object | Yes | | |
| groupControlComponent | object | Yes | | | | | groupControlComponent | object | Yes | | |
| singleTabMode | 'fullwidth' \| 'default' | Yes | 'default' | | | singleTabMode | 'fullwidth' \| 'default' | Yes | 'default' | |
## Dockview API ## Dockview API
@ -720,4 +720,7 @@ The core library is published as an independant package under the name `dockview
> When using `dockview` there is no need to also install `dockview-core`. > When using `dockview` there is no need to also install `dockview-core`.
> `dockview-core` is a dependency of `dockview` and automatically installed during the installation process of `dockview` via `npm install dockview`. > `dockview-core` is a dependency of `dockview` and automatically installed during the installation process of `dockview` via `npm install dockview`.
<Container injectVanillaJS={attachDockviewVanilla} /> <Container
sandboxId="vanilla-dockview"
injectVanillaJS={attachDockviewVanilla}
/>