update(examples): correct examples

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>

examples/Overview/Overview.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import { CSSProperties } from 'vue'
 import {
   VueFlow,
   addEdge,
@@ -48,52 +47,40 @@ const initialElements: Elements = [
   {
     id: '1',
     type: 'input',
-    data: {
-      label: 'Welcome to <strong>Vue VueFlow!</strong>',
-    },
+    label: 'Welcome to <strong>Vue VueFlow!</strong>',
     position: { x: 250, y: 0 },
   },
   {
     id: '2',
-    data: {
-      label: 'This is a <strong>default node</strong>',
-    },
+    label: 'This is a <strong>default node</strong>',
     position: { x: 100, y: 100 },
   },
   {
     id: '3',
-    data: {
-      label: 'This one has a <strong>custom style</strong>',
-    },
+    label: 'This one has a <strong>custom style</strong>',
     position: { x: 400, y: 100 },
     style: { background: '#D6D5E6', color: '#333', border: '1px solid #222138', width: 180 },
   },
   {
     id: '4',
     position: { x: 250, y: 200 },
-    data: {
-      label: `You can find the docs on
+    label: `You can find the docs on
           <a href="https://github.com/bcakmakoglu/vue-flow" target="_blank" rel="noopener noreferrer">
             Github
           </a>`,
-    },
   },
   {
     id: '5',
-    data: {
-      label: 'Or check out the other <strong>examples</strong>',
-    },
+    label: 'Or check out the other <strong>examples</strong>',
     position: { x: 250, y: 325 },
   },
   {
     id: '6',
     type: 'output',
-    data: {
-      label: 'An <strong>output node</strong>',
-    },
+    label: 'An <strong>output node</strong>',
     position: { x: 100, y: 480 },
   },
-  { id: '7', type: 'output', data: { label: 'Another output node' }, position: { x: 400, y: 450 } },
+  { id: '7', type: 'output', label: 'Another output node', position: { x: 400, y: 450 } },
   { id: 'e1-2', source: '1', target: '2', label: 'this is an edge label' },
   { id: 'e1-3', source: '1', target: '3' },
   { id: 'e3-4', source: '3', target: '4', animated: true, label: 'animated edge' },
@@ -111,7 +98,6 @@ const initialElements: Elements = [
   },
 ]
 
-const connectionLineStyle: CSSProperties = { stroke: '#ddd' }
 const snapGrid: SnapGrid = [16, 16]
 
 const nodeStrokeColor = (n: Node): string => {
@@ -135,11 +121,12 @@ const onConnect = (params: Connection | Edge) => (elements.value = addEdge(param
 <template>
   <VueFlow
     v-model="elements"
-    :connection-line-style="connectionLineStyle"
+    :connection-line-style="{ stroke: '#ddd' }"
     :snap-to-grid="true"
     :snap-grid="snapGrid"
     @element-click="onElementClick"
     @connect="onConnect"
+    @pane-ready="onLoad"
     @pane-click="onPaneClick"
     @pane-scroll="onPaneScroll"
     @pane-contex-menu="onPaneContextMenu"
@@ -153,7 +140,6 @@ const onConnect = (params: Connection | Edge) => (elements.value = addEdge(param
     @selection-context-menu="onSelectionContextMenu"
     @selection-change="onSelectionChange"
     @move-end="onMoveEnd"
-    @load="onLoad"
     @edge-update="onEdgeMouseMove"
     @edge-context-menu="onEdgeContextMenu"
     @edge-mouse-enter="onEdgeMouseEnter"