From c2b6a62cff18f51422b34aeb97fd2b513ada884a Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Fri, 5 May 2023 09:20:03 +0200
Subject: [PATCH] chore(vite-examples): update basic example

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
---
 examples/vite/src/Basic/Basic.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/examples/vite/src/Basic/Basic.vue b/examples/vite/src/Basic/Basic.vue
index 329836c2..2e2e0863 100644
--- a/examples/vite/src/Basic/Basic.vue
+++ b/examples/vite/src/Basic/Basic.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import type { Elements } from '@vue-flow/core'
-import { VueFlow, isNode, useVueFlow } from '@vue-flow/core'
+import { Panel, PanelPosition, VueFlow, isNode, useVueFlow } from '@vue-flow/core'
 
 import { Background } from '@vue-flow/background'
 import { Controls } from '@vue-flow/controls'
@@ -49,11 +49,11 @@ function toggleclass() {
     <Background />
     <MiniMap />
     <Controls />
-    <div style="position: absolute; right: 10px; top: 10px; z-index: 4">
-      <button style="margin-right: 5px" @click="resetTransform">reset transform</button>
-      <button style="margin-right: 5px" @click="updatePos">change pos</button>
-      <button style="margin-right: 5px" @click="toggleclass">toggle class</button>
+    <Panel :position="PanelPosition.TopRight" style="display: flex; gap: 5px">
+      <button @click="resetTransform">reset transform</button>
+      <button @click="updatePos">change pos</button>
+      <button @click="toggleclass">toggle class</button>
       <button @click="logToObject">toObject</button>
-    </div>
+    </Panel>
   </VueFlow>
 </template>