fix: declare `let:` directives before `{@const}` on slotted elements (#18271)

Fixes #18119 (missed a spot in #16985)

.changeset/quiet-rivers-melt.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: declare `let:` directives before `{@const}` declarations on slotted elements

packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js

@@ -201,8 +201,8 @@ export function RegularElement(node, context) {
 		}
 	}
 
-	// Let bindings first, they can be used on attributes
+	// Let bindings first, they can be used on attributes and `{@const}` declarations
-	context.state.init.push(...lets);
+	context.state.let_directives.push(...lets);
 
 	const node_id = context.state.node;
 

packages/svelte/tests/runtime-legacy/samples/let-directive-and-const-tag-slotted/Nested.svelte

@@ -0,0 +1,7 @@
+<script>
+	export let things;
+</script>
+
+{#each things as thing}
+	<slot name="foo" {thing} />
+{/each}

packages/svelte/tests/runtime-legacy/samples/let-directive-and-const-tag-slotted/_config.js

@@ -0,0 +1,15 @@
+import { test } from '../../test';
+
+// `let:` directives on a slotted element must be declared before sibling `{@const}`
+// declarations that capture them. In dev mode the `{@const}` derived is read eagerly,
+// so a wrong declaration order throws "Cannot access '...' before initialization".
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	html: `
+		<div slot="foo"><span>1</span></div>
+		<div slot="foo"><span>2</span></div>
+	`
+});

packages/svelte/tests/runtime-legacy/samples/let-directive-and-const-tag-slotted/main.svelte

@@ -0,0 +1,10 @@
+<script>
+	import Nested from './Nested.svelte';
+</script>
+
+<Nested things={[1, 2]}>
+	<div slot="foo" let:thing>
+		{@const props = { thing }}
+		<span>{props.thing}</span>
+	</div>
+</Nested>