Vue Flow 🌊

A customizable Vue3 Flowchart.

🚧 This library is still under construction

Check the docs and examples to get started.

Features

• 🎨 Customizable

• 🦾 Fully written in TypeScript

Table of Contents

• 🛠 Setup

• 🎮 Quickstart

• 🧪 Development

🛠 Setup

$ npm i @braks/vue-flow
# or
$ yarn add @braks/vue-flow

🎮 Quickstart

<template>
  <Flow :elements="elements"></Flow>
</template>
<script setup>
import { Flow, Elements } from '@braks/vue-flow'

const elements = ref < Elements > ([
  {
    id: '1',
    data: {
      label: 'This is a <strong>default node</strong>',
    },
    position: { x: 100, y: 100 },
  },
])
</script>

▸ Vue 2

This library doesn't work with Vue2.

🧪 Development

# start (dev)
$ yarn dev

# build dist
$ yarn build