[![CI Testing](https://github.com/rtucek/vue-query-builder/actions/workflows/ci-testing.yml/badge.svg)](https://github.com/rtucek/vue-query-builder/actions/workflows/ci-testing.yml)
[![CI Build](https://github.com/rtucek/vue-query-builder/actions/workflows/ci-build.yml/badge.svg)](https://github.com/rtucek/vue-query-builder/actions/workflows/ci-build.yml)
[![Lint](https://github.com/rtucek/vue-query-builder/actions/workflows/lint.yml/badge.svg)](https://github.com/rtucek/vue-query-builder/actions/workflows/lint.yml)
[![npm version](https://img.shields.io/npm/v/query-builder-vue)](https://www.npmjs.com/package/query-builder-vue)
[![MIT LICENSE](https://img.shields.io/npm/l/query-builder-vue)](https://github.com/rtucek/vue-query-builder/blob/master/LICENSE)

# Vue Query Builder

A query-builder for Vue.


## Demos

Plenty of samples and use cases are covered in the
[documentation](https://rtucek.github.io/vue-query-builder/demos.html).


## Features

Key features:

- Re-ordering of rules and groups with drag'n'drop.
- Emphasizing groups with configurable colors.
- Control maximum depth of nested groups.
- Easy to customize with pure CSS and slots.
- Layout can be serialized and restored.
- Vuex compatible.
- TypeScript support.


## Installation

```bash
yarn add query-builder-vue
npm install query-builder-vue
```

Follow the docs for [minimum
configuration](https://rtucek.github.io/vue-query-builder/getting-started.html#usage).


## Contribution

[Contribution guidelines](https://rtucek.github.io/vue-query-builder/contributing.html) are located
in the documentation.