update(examples): move examples into src dir

examples/router.ts

@@ -7,99 +7,99 @@ export const routes: RouterOptions['routes'] = [
   },
   {
     path: '/rgb',
-    component: () => import('./RGBFlow/RGBFlow.vue'),
+    component: () => import('./src/RGBFlow/RGBFlow.vue'),
   },
   {
     path: '/basic',
-    component: () => import('./Basic/Basic.vue'),
+    component: () => import('./src/Basic/Basic.vue'),
   },
   {
     path: '/basic-options-api',
-    component: () => import('./Basic/BasicOptionsAPI.vue'),
+    component: () => import('./src/Basic/BasicOptionsAPI.vue'),
   },
   {
     path: '/custom-connectionline',
-    component: () => import('./CustomConnectionLine/CustomConnectionLine.vue'),
+    component: () => import('./src/CustomConnectionLine/CustomConnectionLine.vue'),
   },
   {
     path: '/custom-node',
-    component: () => import('./CustomNode/CustomNode.vue'),
+    component: () => import('./src/CustomNode/CustomNode.vue'),
   },
   {
     path: '/drag-n-drop',
-    component: () => import('./DragNDrop/DnD.vue'),
+    component: () => import('./src/DragNDrop/DnD.vue'),
   },
   {
     path: '/edges',
-    component: () => import('./Edges/EdgesExample.vue'),
+    component: () => import('./src/Edges/EdgesExample.vue'),
   },
   {
     path: '/edge-types',
-    component: () => import('./EdgeTypes/EdgeTypesExample.vue'),
+    component: () => import('./src/EdgeTypes/EdgeTypesExample.vue'),
   },
   {
     path: '/empty',
-    component: () => import('./Empty/EmptyExample.vue'),
+    component: () => import('./src/Empty/EmptyExample.vue'),
   },
   {
     path: '/hidden',
-    component: () => import('./Hidden/HiddenExample.vue'),
+    component: () => import('./src/Hidden/HiddenExample.vue'),
   },
   {
     path: '/interaction',
-    component: () => import('./Interaction/InteractionExample.vue'),
+    component: () => import('./src/Interaction/InteractionExample.vue'),
   },
   {
     path: '/layouting',
-    component: () => import('./Layouting/LayoutingExample.vue'),
+    component: () => import('./src/Layouting/LayoutingExample.vue'),
   },
   {
     path: '/multi-flows',
-    component: () => import('./MultiFlows/MultiFlowsExample.vue'),
+    component: () => import('./src/MultiFlows/MultiFlowsExample.vue'),
   },
   {
     path: '/node-type-change',
-    component: () => import('./NodeTypeChange/NodeTypeChangeExample.vue'),
+    component: () => import('./src/NodeTypeChange/NodeTypeChangeExample.vue'),
   },
   {
     path: '/overview',
-    component: () => import('./Overview/Overview.vue'),
+    component: () => import('./src/Overview/Overview.vue'),
   },
   {
     path: '/provider',
-    component: () => import('./Provider/ProviderExample.vue'),
+    component: () => import('./src/Provider/ProviderExample.vue'),
   },
   {
     path: '/save-restore',
-    component: () => import('./SaveRestore/SaveRestoreExample.vue'),
+    component: () => import('./src/SaveRestore/SaveRestoreExample.vue'),
   },
   {
     path: '/stress',
-    component: () => import('./Stress/StressExample.vue'),
+    component: () => import('./src/Stress/StressExample.vue'),
   },
   {
     path: '/switch',
-    component: () => import('./Switch/SwitchExample.vue'),
+    component: () => import('./src/Switch/SwitchExample.vue'),
   },
   {
     path: '/unidirectional',
-    component: () => import('./Unidirectional/UnidirectionalExample.vue'),
+    component: () => import('./src/Unidirectional/UnidirectionalExample.vue'),
   },
   {
     path: '/updateable-edge',
-    component: () => import('./UpdatableEdge/UpdatableEdgeExample.vue'),
+    component: () => import('./src/UpdatableEdge/UpdatableEdgeExample.vue'),
   },
   {
     path: '/update-node',
-    component: () => import('./UpdateNode/UpdateNodeExample.vue'),
+    component: () => import('./src/UpdateNode/UpdateNodeExample.vue'),
   },
   {
     path: '/validation',
-    component: () => import('./Validation/ValidationExample.vue'),
+    component: () => import('./src/Validation/ValidationExample.vue'),
   },
   {
     path: '/nesting',
-    component: () => import('./Nesting/Nesting.vue'),
+    component: () => import('./src/Nesting/Nesting.vue'),
   },
 ]
 

examples/src/DragNDrop/DnD.vue

@@ -45,5 +45,5 @@ const onDrop = (event: DragEvent) => {
   </div>
 </template>
 <style>
-@import './dnd.css';
+@import 'dnd.css';
 </style>

examples/src/EdgeTypes/utils.ts

@@ -1,4 +1,4 @@
-import { Elements, Position } from '../../package/src'
+import { Elements, Position } from '@braks/vue-flow/src'
 
 const nodeWidth = 80
 const nodeGapWidth = nodeWidth * 2

examples/src/Layouting/LayoutingExample.vue

@@ -49,5 +49,5 @@ const onLayout = (direction: string) => {
   </div>
 </template>
 <style>
-@import './layouting.css';
+@import 'layouting.css';
 </style>

examples/src/MultiFlows/MultiFlowsExample.vue

@@ -8,5 +8,5 @@ import Flow from './Flow.vue'
   </div>
 </template>
 <style>
-@import './multiflows.css';
+@import 'multiflows.css';
 </style>

examples/src/Provider/ProviderExample.vue

@@ -27,5 +27,5 @@ const elements = ref<Elements>(initialElements)
   </div>
 </template>
 <style>
-@import './provider.css';
+@import 'provider.css';
 </style>

examples/src/SaveRestore/SaveRestoreExample.vue

@@ -16,5 +16,5 @@ const elements = ref(initialElements)
   </VueFlow>
 </template>
 <style>
-@import './save.css';
+@import 'save.css';
 </style>

examples/src/UpdateNode/UpdateNodeExample.vue

@@ -44,5 +44,5 @@ onMounted(updateNode)
   </VueFlow>
 </template>
 <style>
-@import './updatenode.css';
+@import 'updatenode.css';
 </style>

examples/src/Validation/ValidationExample.vue

@@ -45,5 +45,5 @@ const onConnect = (params: Connection) => {
   </VueFlow>
 </template>
 <style>
-@import './validation.css';
+@import 'validation.css';
 </style>

examples/vite.config.ts

@@ -4,14 +4,13 @@ import vueTypes from 'vite-plugin-vue-type-imports'
 import AutoImport from 'unplugin-auto-import/vite'
 
 export default defineConfig({
-  root: '.',
   plugins: [
     vue(),
     vueTypes(),
     // https://github.com/antfu/unplugin-auto-import
     AutoImport({
       imports: ['vue', '@vueuse/core'],
-      dts: 'auto-imports.d.ts',
+      dts: 'src/auto-imports.d.ts',
     }),
   ],
   optimizeDeps: {

tests/cypress/integration/1-store/setElements.spec.ts

@@ -1,5 +1,5 @@
 import { useVueFlow, isEdge, isNode, Edge, FlowStore, Node } from '@braks/vue-flow'
-import { getElements } from '../../../../examples/Stress/utils'
+import { getElements } from '../../../../examples/src/Stress/utils'
 
 describe('test store action setElements', () => {
   const setElements = async (store: FlowStore) => {