FIX: Edges appending to only one instance of Svelvet container open-…

…source-labs#513


    Updated moveEdge function in Edge.svelte to correctly append the edge element to its respective Svelvet container based on containerId.

🔗 Linked issue

Resolves open-source-labs#513

src/lib/components/Edge/Edge.svelte

@@ -8,19 +8,25 @@
 	import type { CSSColorString, Direction, EdgeStyle, EndStyle, Graph } from '$lib/types';
 	import type { WritableEdge } from '$lib/types';
 
+	export let containerId;
+
 	let animationFrameId: number;
 
-	function moveEdge(edgeElement: SVGElement) {
+	function moveEdge(edgeElement: SVGElement, containerId: string) {
 		const parentNode = edgeElement.parentNode;
 		if (!parentNode) return;
 		// Remove the anchor from its current container
 		parentNode.removeChild(edgeElement);
 
 		// Add the anchor to the new container
-		const newContainer = document.querySelector(`.svelvet-graph-wrapper`);
+		const newContainer = document.querySelector(`.svelvet-graph-wrapper[data-id='${containerId}']`);
 		if (!newContainer) return;
 		newContainer.appendChild(edgeElement);
 	}
+
+	onDestroy(() => {
+		cancelAnimationFrame(animationFrameId);
+	});
 </script>
 
 <script lang="ts">
@@ -192,7 +198,7 @@
 				labelPoint = calculatePath(DOMPath, labelPosition);
 			}
 		}, 0);
-		moveEdge(edgeElement);
+		moveEdge(edgeElement, containerId);
 	});
 
 	afterUpdate(() => {