docs: update component documentation with new examples

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
2022-12-14 13:46:08 +01:00
parent f2eb883b26
commit 15ca63a59c
6 changed files with 49 additions and 7 deletions
@@ -15,14 +15,33 @@ npm install @vue-flow/controls

 To use the controls simply pass the `Controls` component as a child to the `VueFlow` component.

+::: warning
+Make sure you also import the styles as these are *not* part of the default theme anymore.
+:::
+
 ```vue
+<script setup>
+import { VueFlow } from '@vue-flow/core'
+import { Controls } from '@vue-flow/controls'
+
+// import default controls styles
+import '@vue-flow/controls/dist/style.css'
+
+import initialElements from './initial-elements'
+
+
+// some nodes and edges
+const elements = ref(initialElements)
+</script>
+
 <template>
-  <VueFlow>
+  <VueFlow v-model="elements" fit-view-on-init class="vue-flow-basic-example">
    <Controls />
  </VueFlow>
 </template>
 ```

+
 ## [Props](/typedocs/interfaces/ControlProps)

 | Name            | Definition                | Type                                           | Optional | Default |