feat!: Add hooks to store

* For easier access and to avoid context issues with injections hooks are put into the store
* hooks can be accessed and will emit events when the flow has bound its emit function to the hooks
* useHooks and useStore are not exported anymore! Instead, useVueFlow is provided, which will return an instance of the current vue flow store
* Rename NodeIdContextKey to NodeId
* Add addElements function to store to add elements without having to re-set the whole store
* use v-model for elements, re-set elements only if there's an actual change

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

src/composables/useVueFlow.ts

@@ -1,22 +1,15 @@
 import useHooks from './useHooks'
 import useStore from './useStore'
-import { FlowInstance } from '~/types'
+import { EmitFunc } from '~/types'
 
-export default () => {
+export const initFlow = (emit: EmitFunc) => {
   const store = useStore()
-  const hooks = useHooks()
-  const isReady = ref(false)
-  const instance = ref<FlowInstance>()
-  hooks.load.on((flow) => {
-    isReady.value = true
-    instance.value = flow
-    if (import.meta.env.DEV) console.log(`vue flow ${store.$id} ready.`)
-  })
+  const hooks = useHooks(emit)
 
   return {
-    isReady,
-    instance,
     store,
     hooks,
   }
 }
+
+export default () => useStore()