fix: destructuring state in ssr (#16102)

.changeset/silly-turkeys-confess.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: destructuring state in ssr

packages/svelte/src/compiler/phases/3-transform/server/visitors/VariableDeclaration.js

@@ -197,9 +197,13 @@ function create_state_declarators(declarator, scope, value) {
 	}
 
 	const tmp = b.id(scope.generate('tmp'));
-	const { paths } = extract_paths(declarator.id, tmp);
+	const { paths, inserts } = extract_paths(declarator.id, tmp);
 	return [
 		b.declarator(tmp, value), // TODO inject declarator for opts, so we can use it below
+		...inserts.map(({ id, value }) => {
+			id.name = scope.generate('$$array');
+			return b.declarator(id, value);
+		}),
 		...paths.map((path) => {
 			const value = path.expression;
 			return b.declarator(path.node, value);

packages/svelte/tests/server-side-rendering/samples/destructure-state-iterable/_expected.html

@@ -0,0 +1 @@
+0, 1

packages/svelte/tests/server-side-rendering/samples/destructure-state-iterable/main.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	let count = 0;
+	function* test(){
+		while (true) {
+			yield count++;
+		}
+	}
+	let [one, two] = $state(test())
+</script>
+
+{one}, {two}

packages/svelte/tests/server-side-rendering/samples/destructure-state/_expected.html

@@ -0,0 +1 @@
+10, Admin

packages/svelte/tests/server-side-rendering/samples/destructure-state/main.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+	let [level, custom] = $state([10, "Admin"])
+</script>
+
+{level}, {custom}