dockview
Version:
Zero dependency layout manager supporting tabs, grids and splitviews
59 lines (41 loc) • 2.22 kB
Markdown
<div align="center">
<h1>dockview</h1>
<p>Zero dependency layout manager supporting tabs, groups, grids and splitviews with ReactJS support written in TypeScript</p>
</div>
---
[](https://www.npmjs.com/package/dockview)
[](https://www.npmjs.com/package/dockview)
[](https://github.com/mathuo/dockview/actions?query=workflow%3ACI)
[](https://sonarcloud.io/summary/overall?id=mathuo_dockview)
[](https://sonarcloud.io/summary/overall?id=mathuo_dockview)
[](https://bundlephobia.com/result?p=dockview)
##

Please see the website: https://dockview.dev
## Features
- Serialization / deserialization with full layout management
- Support for split-views, grid-views and 'dockable' views
- Themeable and customizable
- Tab and Group docking / Drag n' Drop
- Popout Windows
- Floating Groups
- Extensive API
- Supports Shadow DOMs
- High test coverage
- Documentation website with live examples
- Transparent builds and Code Analysis
- Security at mind - verifed publishing and builds through GitHub Actions
Want to verify our builds? Go [here](https://www.npmjs.com/package/dockview#Provenance).
## 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).
```
npm install --save dockview
```
Within your project you must import or reference the stylesheet at `dockview/dist/styles/dockview.css` and attach a theme.
```css
@import '~dockview/dist/styles/dockview.css';
```
You should also attach a dockview theme to an element containing your components. For example:
```html
<body classname="dockview-theme-dark"></body>
```