first working version with using $state for nodes & edges

packages/svelte/src/lib/plugins/Minimap/Minimap.svelte

@@ -44,7 +44,7 @@
 
   let store = useStore();
 
-  let nodes = $derived(store.nodes);
+  // let nodes = $derived(store.nodes);
 
   const nodeColorFunc = nodeColor === undefined ? undefined : getAttrFunction(nodeColor);
   const nodeStrokeColorFunc = getAttrFunction(nodeStrokeColor);
@@ -115,7 +115,7 @@
     >
       {#if ariaLabel}<title id={labelledBy}>{ariaLabel}</title>{/if}
 
-      {#each $nodes as userNode (userNode.id)}
+      {#each store.nodes as userNode (userNode.id)}
         {@const node = store.nodeLookup.get(userNode.id)}
         {#if node && nodeHasDimensions(node)}
           {@const nodeDimesions = getNodeDimensions(node)}

packages/svelte/src/lib/plugins/NodeResizer/ResizeControl.svelte

@@ -93,7 +93,7 @@
             }
           }
 
-          store.nodes.set(get(store.nodes));
+          // store.nodes.set(get(store.nodes));
         }
       });
     }

packages/svelte/src/lib/plugins/NodeToolbar/NodeToolbar.svelte

@@ -19,13 +19,13 @@
   }: NodeToolbarProps = $props();
 
   const store = useStore();
-  const { nodes } = store;
+  // const { nodes } = store;
   const { getNodesBounds } = useSvelteFlow();
   const contextNodeId = getContext<string>('svelteflow__node_id');
 
   let toolbarNodes: InternalNode[] = $derived.by(() => {
     // eslint-disable-next-line @typescript-eslint/no-unused-expressions
-    $nodes;
+    store.nodes;
     const nodeIds = Array.isArray(nodeId) ? nodeId : [nodeId ?? contextNodeId];
 
     return nodeIds.reduce<InternalNode[]>((res, nodeId) => {
@@ -54,7 +54,7 @@
   );
 
   //FIXME: Possible performance bottleneck
-  let selectedNodesCount = $derived($nodes.filter((node) => node.selected).length);
+  let selectedNodesCount = $derived(store.nodes.filter((node) => node.selected).length);
 
   // if isVisible is not set, we show the toolbar only if its node is selected and no other node is selected
   let isActive = $derived(