refactor(minimap): move minimap to separate package

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
2022-12-13 14:53:44 +01:00
parent e44b683b74
commit 281279044c
13 changed files with 594 additions and 10 deletions
@@ -0,0 +1,39 @@
+# Vue Flow: MiniMap
+
+This is a minimap component for Vue Flow.
+It can be used to add a minimap to the canvas, which will show a smaller version of the canvas with your nodes.
+The minimap can also be used to pan and zoom the main canvas.
+
+## 🛠 Setup
+
+```bash
+# install
+$ yarn add @vue-flow/minimap
+
+# or
+$ npm i --save @vue-flow/minimap
+```
+
+## 🎮 Quickstart
+
+```vue
+
+<script setup>
+import { VueFlow } from '@vue-flow/core'
+import { MiniMap } from '@vue-flow/minimap'
+
+// import minimap styles
+import '@vue-flow/minimap/dist/style.css'
+
+import initialElements from './initial-elements'
+
+// some nodes and edges
+const elements = ref(initialElements)
+</script>
+
+<template>
+  <VueFlow v-model="elements" fit-view-on-init class="vue-flow-basic-example">
+    <MiniMap />
+  </VueFlow>
+</template>
+```