From 08b5f81cf5fabdff4423b6478361ab4e9d92c9df Mon Sep 17 00:00:00 2001
From: peterkogo <peter@xyflow.com>
Date: Tue, 17 Dec 2024 17:40:18 +0100
Subject: [PATCH] port more updates

---
 .../routes/examples/useupdatenodeinternals/Flow.svelte   | 6 +++---
 .../svelte/src/routes/examples/validation/+page.svelte   | 9 ++++-----
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/examples/svelte/src/routes/examples/useupdatenodeinternals/Flow.svelte b/examples/svelte/src/routes/examples/useupdatenodeinternals/Flow.svelte
index 0212db60..00217560 100644
--- a/examples/svelte/src/routes/examples/useupdatenodeinternals/Flow.svelte
+++ b/examples/svelte/src/routes/examples/useupdatenodeinternals/Flow.svelte
@@ -18,7 +18,7 @@
 		custom: CustomNode
 	};
 
-	const nodes = $state.raw([
+	let nodes = $state.raw([
 		{
 			id: '1',
 			type: 'custom',
@@ -39,7 +39,7 @@
 		}
 	]);
 
-	const edges = $state.raw([
+	let edges = $state.raw([
 		{
 			id: '1-2',
 			source: '1',
@@ -60,7 +60,7 @@
 </script>
 
 <main>
-	<SvelteFlow {nodes} {edges} {nodeTypes} fitView>
+	<SvelteFlow bind:nodes bind:edges {nodeTypes} fitView>
 		<Controls />
 		<Background variant={BackgroundVariant.Dots} />
 		<MiniMap />
diff --git a/examples/svelte/src/routes/examples/validation/+page.svelte b/examples/svelte/src/routes/examples/validation/+page.svelte
index d2a7cd2e..123a7e90 100644
--- a/examples/svelte/src/routes/examples/validation/+page.svelte
+++ b/examples/svelte/src/routes/examples/validation/+page.svelte
@@ -1,5 +1,4 @@
 <script lang="ts">
-	import { writable } from 'svelte/store';
 	import {
 		SvelteFlow,
 		Controls,
@@ -17,7 +16,7 @@
 		targetPosition: Position.Left
 	};
 
-	const nodes = writable([
+	let nodes = $state.raw([
 		{
 			id: '0',
 			position: { x: 0, y: 150 },
@@ -29,7 +28,7 @@
 		{ id: 'C', position: { x: 250, y: 300 }, data: { label: 'C' }, ...nodeDefaults }
 	]);
 
-	const edges = writable([]);
+	let edges = $state.raw([]);
 
 	const isValidConnection: IsValidConnection = (connection) => connection.target === 'B';
 
@@ -39,8 +38,8 @@
 </script>
 
 <SvelteFlow
-	{nodes}
-	{edges}
+	bind:nodes
+	bind:edges
 	fitView
 	minZoom={0.1}
 	maxZoom={2.5}