# vue-dock ![Current Release](https://img.shields.io/github/release/afterburn/vue-dock.svg?style=flat-square) ![Release Date](https://img.shields.io/github/release-date/afterburn/vue-dock?style=flat-square) ![Monthly Downloads](https://img.shields.io/npm/dm/vue-dock.svg?style=flat-square) [![Coverage Status](https://coveralls.io/repos/github/afterburn/vue-dock/badge.svg?branch=master)](https://coveralls.io/github/afterburn/vue-dock?branch=master) ![MIT License](https://img.shields.io/github/license/afterburn/vue-dock.svg?style=flat-square)

> **Easy to use dockable & resizable panels for Vue. Lightweight, zero dependencies, extensible.**

Vue Dock is a feature rich layout system for Vue. It provides a set of components that will allow you to easily create complex layouts built from dockable & resizable panels which wrap your own components. The system is designed to be as lightweight as possible, while maintaining high standards for accessibility, developer experience, and customization.

## Documentation

Complete documentation and examples available at https://vue-dock.org.

- **[API Documentation](https://vue-dock.org)**

## Install

```bash
yarn add vue-dock

# or use npm

npm install vue-dock
```

Then, import and register the components you wish to use:

```js
import { createApp } from "vue";
import { vContainer, vPanel } from "vue-dock";

const app = createApp(App)

app.component("v-container", vContainer);
app.component("v-panel", vPanel);
```

The component itself does not include any CSS. You'll need to include it separately:

```js
import "vue-dock/dist/vue-dock.css";
```

## License

[MIT](https://github.com/afterburn/vue-dock/blob/master/LICENSE.md)