feat(flow): Narrow options type for useNodesState/useEdgesState/useElementsState

* remove storageKey
* make modelValue optional

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

src/container/VueFlow/VueFlow.vue

@@ -49,7 +49,7 @@ if (props.modelValue && !storedNodes.value.length) setElements(props.modelValue)
 if (props.nodes && !storedNodes.value.length) setNodes(props.nodes)
 if (props.edges && !storedEdges.value.length) setEdges(props.edges)
 
-if (modelValue.value) modelValue.value = [...store.nodes, ...store.edges]
+if (modelValue && modelValue.value) modelValue.value = [...store.nodes, ...store.edges]
 if (nodes && nodes.value) nodes.value = store.nodes
 if (edges && edges.value) edges.value = store.edges
 

src/container/VueFlow/watch.ts

@@ -8,7 +8,7 @@ export default (
     nodes,
     edges,
   }: {
-    modelValue?: Ref<Elements>
+    modelValue?: Ref<Elements | undefined>
     nodes?: Ref<Node[] | undefined>
     edges?: Ref<Edge[] | undefined>
   },
@@ -16,7 +16,7 @@ export default (
   store: FlowStore,
 ) => {
   if (isDefined(props.modelValue)) {
-    const { pause, resume } = pausableWatch([() => props.modelValue, () => props.modelValue.length], async ([v]) => {
+    const { pause, resume } = pausableWatch([() => props.modelValue, () => props.modelValue?.length], async ([v]) => {
       if (v && Array.isArray(v)) {
         pause()
         store.setElements(v)