From 1ffce92d903eaf8cd1b8e4a520f3e8d581f619fe Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 5 Dec 2024 14:55:15 +0100
Subject: [PATCH 01/62] docs: note before/afterUpdate breaking change (#14567)

...about slotted content behavior
Related to #14564
---
 documentation/docs/07-misc/07-v5-migration-guide.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/documentation/docs/07-misc/07-v5-migration-guide.md b/documentation/docs/07-misc/07-v5-migration-guide.md
index 687f8e93b11f..09ea84f26c8a 100644
--- a/documentation/docs/07-misc/07-v5-migration-guide.md
+++ b/documentation/docs/07-misc/07-v5-migration-guide.md
@@ -823,6 +823,8 @@ The `foreign` namespace was only useful for Svelte Native, which we're planning
 
 `afterUpdate` callbacks in a parent component will now run after `afterUpdate` callbacks in any child components.
 
+`beforeUpdate/afterUpdate` no longer run when the component contains a `<slot>` and its content is updated.
+
 Both functions are disallowed in runes mode — use `$effect.pre(...)` and `$effect(...)` instead.
 
 ### `contenteditable` behavior change

From 73b3cf72d024d758507ba5386c99169fcadd247b Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 5 Dec 2024 14:56:28 +0100
Subject: [PATCH 02/62] fix: treat `undefined` and `null` the same for the
 initial input value (#14562)

* fix: treat `undefined` and `null` the same for the initial input value

Fixes #14558

* test

* same for checked
---
 .changeset/cool-clocks-film.md                |   5 +
 .../client/dom/elements/attributes.js         |  20 +++-
 .../samples/form-default-value/_config.js     | 106 ++++++++++++------
 .../samples/form-default-value/main.svelte    |  96 +++++++++++-----
 4 files changed, 161 insertions(+), 66 deletions(-)
 create mode 100644 .changeset/cool-clocks-film.md

diff --git a/.changeset/cool-clocks-film.md b/.changeset/cool-clocks-film.md
new file mode 100644
index 000000000000..a38b2e19d497
--- /dev/null
+++ b/.changeset/cool-clocks-film.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: treat `undefined` and `null` the same for the initial input value
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 2229c1a36135..0276069eee49 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -60,13 +60,19 @@ export function remove_input_defaults(input) {
 export function set_value(element, value) {
 	// @ts-expect-error
 	var attributes = (element.__attributes ??= {});
+
 	if (
-		attributes.value === (attributes.value = value) ||
+		attributes.value ===
+			(attributes.value =
+				// treat null and undefined the same for the initial value
+				value ?? undefined) ||
 		// @ts-expect-error
 		// `progress` elements always need their value set when its `0`
 		(element.value === value && (value !== 0 || element.nodeName !== 'PROGRESS'))
-	)
+	) {
 		return;
+	}
+
 	// @ts-expect-error
 	element.value = value;
 }
@@ -79,7 +85,15 @@ export function set_checked(element, checked) {
 	// @ts-expect-error
 	var attributes = (element.__attributes ??= {});
 
-	if (attributes.checked === (attributes.checked = checked)) return;
+	if (
+		attributes.checked ===
+		(attributes.checked =
+			// treat null and undefined the same for the initial value
+			checked ?? undefined)
+	) {
+		return;
+	}
+
 	// @ts-expect-error
 	element.checked = checked;
 }
diff --git a/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js b/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
index 3ae8b223bea1..5ef72aaa8ec2 100644
--- a/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
@@ -37,8 +37,9 @@ export default test({
 		const after_reset = [];
 
 		const reset = /** @type {HTMLInputElement} */ (target.querySelector('input[type=reset]'));
-		const [test1, test2, test3, test4, test5, test12] = target.querySelectorAll('div');
-		const [test6, test7, test8, test9] = target.querySelectorAll('select');
+		const [test1, test2, test3, test4, test5, test6, test7, test14] =
+			target.querySelectorAll('div');
+		const [test8, test9, test10, test11] = target.querySelectorAll('select');
 		const [
 			test1_span,
 			test2_span,
@@ -48,7 +49,9 @@ export default test({
 			test6_span,
 			test7_span,
 			test8_span,
-			test9_span
+			test9_span,
+			test10_span,
+			test11_span
 		] = target.querySelectorAll('span');
 
 		{
@@ -74,8 +77,8 @@ export default test({
 		{
 			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
 			const inputs = test2.querySelectorAll('input, textarea');
-			check_inputs(inputs, 'value', 'y');
-			assert.htmlEqual(test2_span.innerHTML, 'y y y y');
+			check_inputs(inputs, 'value', 'x');
+			assert.htmlEqual(test2_span.innerHTML, 'x x x x');
 
 			for (const input of inputs) {
 				set_input(input, 'value', 'foo');
@@ -85,125 +88,164 @@ export default test({
 			assert.htmlEqual(test2_span.innerHTML, 'foo foo foo foo');
 
 			after_reset.push(() => {
+				console.log('-------------');
 				check_inputs(inputs, 'value', 'x');
 				assert.htmlEqual(test2_span.innerHTML, 'x x x x');
 			});
 		}
 
+		{
+			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
+			const inputs = test3.querySelectorAll('input, textarea');
+			check_inputs(inputs, 'value', 'y');
+			assert.htmlEqual(test3_span.innerHTML, 'y y y y');
+
+			for (const input of inputs) {
+				set_input(input, 'value', 'foo');
+			}
+			flushSync();
+			check_inputs(inputs, 'value', 'foo');
+			assert.htmlEqual(test3_span.innerHTML, 'foo foo foo foo');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'value', 'x');
+				assert.htmlEqual(test3_span.innerHTML, 'x x x x');
+			});
+		}
+
 		{
 			/** @type {NodeListOf<HTMLInputElement>} */
-			const inputs = test3.querySelectorAll('input');
+			const inputs = test4.querySelectorAll('input');
 			check_inputs(inputs, 'checked', true);
-			assert.htmlEqual(test3_span.innerHTML, 'true true');
+			assert.htmlEqual(test4_span.innerHTML, 'true true');
 
 			for (const input of inputs) {
 				set_input(input, 'checked', false);
 			}
 			flushSync();
 			check_inputs(inputs, 'checked', false);
-			assert.htmlEqual(test3_span.innerHTML, 'false false');
+			assert.htmlEqual(test4_span.innerHTML, 'false false');
 
 			after_reset.push(() => {
 				check_inputs(inputs, 'checked', true);
-				assert.htmlEqual(test3_span.innerHTML, 'true true');
+				assert.htmlEqual(test4_span.innerHTML, 'true true');
 			});
 		}
 
 		{
 			/** @type {NodeListOf<HTMLInputElement>} */
-			const inputs = test4.querySelectorAll('input');
+			const inputs = test5.querySelectorAll('input');
+			check_inputs(inputs, 'checked', true);
+			assert.htmlEqual(test5_span.innerHTML, 'true true');
+
+			for (const input of inputs) {
+				set_input(input, 'checked', false);
+			}
+			flushSync();
 			check_inputs(inputs, 'checked', false);
-			assert.htmlEqual(test4_span.innerHTML, 'false false');
+			assert.htmlEqual(test5_span.innerHTML, 'false false');
 
 			after_reset.push(() => {
 				check_inputs(inputs, 'checked', true);
-				assert.htmlEqual(test4_span.innerHTML, 'true true');
+				assert.htmlEqual(test5_span.innerHTML, 'true true');
 			});
 		}
 
 		{
 			/** @type {NodeListOf<HTMLInputElement>} */
-			const inputs = test5.querySelectorAll('input');
+			const inputs = test6.querySelectorAll('input');
+			check_inputs(inputs, 'checked', false);
+			assert.htmlEqual(test6_span.innerHTML, 'false false');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'checked', true);
+				assert.htmlEqual(test6_span.innerHTML, 'true true');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement>} */
+			const inputs = test7.querySelectorAll('input');
 			check_inputs(inputs, 'checked', true);
-			assert.htmlEqual(test5_span.innerHTML, 'true');
+			assert.htmlEqual(test7_span.innerHTML, 'true');
 
 			after_reset.push(() => {
 				check_inputs(inputs, 'checked', false);
-				assert.htmlEqual(test5_span.innerHTML, 'false');
+				assert.htmlEqual(test7_span.innerHTML, 'false');
 			});
 		}
 
 		{
 			/** @type {NodeListOf<HTMLOptionElement>} */
-			const options = test6.querySelectorAll('option');
+			const options = test8.querySelectorAll('option');
 			check_inputs(options, 'selected', [false, true, false]);
-			assert.htmlEqual(test6_span.innerHTML, 'b');
+			assert.htmlEqual(test8_span.innerHTML, 'b');
 
 			select_option(options[2]);
 			flushSync();
 			check_inputs(options, 'selected', [false, false, true]);
-			assert.htmlEqual(test6_span.innerHTML, 'c');
+			assert.htmlEqual(test8_span.innerHTML, 'c');
 
 			after_reset.push(() => {
 				check_inputs(options, 'selected', [false, true, false]);
-				assert.htmlEqual(test6_span.innerHTML, 'b');
+				assert.htmlEqual(test8_span.innerHTML, 'b');
 			});
 		}
 
 		{
 			/** @type {NodeListOf<HTMLOptionElement>} */
-			const options = test7.querySelectorAll('option');
+			const options = test9.querySelectorAll('option');
 			check_inputs(options, 'selected', [false, true, false]);
-			assert.htmlEqual(test7_span.innerHTML, 'b');
+			assert.htmlEqual(test9_span.innerHTML, 'b');
 
 			select_option(options[2]);
 			flushSync();
 			check_inputs(options, 'selected', [false, false, true]);
-			assert.htmlEqual(test7_span.innerHTML, 'c');
+			assert.htmlEqual(test9_span.innerHTML, 'c');
 
 			after_reset.push(() => {
 				check_inputs(options, 'selected', [false, true, false]);
-				assert.htmlEqual(test7_span.innerHTML, 'b');
+				assert.htmlEqual(test9_span.innerHTML, 'b');
 			});
 		}
 
 		{
 			/** @type {NodeListOf<HTMLOptionElement>} */
-			const options = test8.querySelectorAll('option');
+			const options = test10.querySelectorAll('option');
 			check_inputs(options, 'selected', [false, false, true]);
-			assert.htmlEqual(test8_span.innerHTML, 'c');
+			assert.htmlEqual(test10_span.innerHTML, 'c');
 
 			select_option(options[0]);
 			flushSync();
 			check_inputs(options, 'selected', [true, false, false]);
-			assert.htmlEqual(test8_span.innerHTML, 'a');
+			assert.htmlEqual(test10_span.innerHTML, 'a');
 
 			after_reset.push(() => {
 				check_inputs(options, 'selected', [false, true, false]);
-				assert.htmlEqual(test8_span.innerHTML, 'b');
+				assert.htmlEqual(test10_span.innerHTML, 'b');
 			});
 		}
 
 		{
 			/** @type {NodeListOf<HTMLOptionElement>} */
-			const options = test9.querySelectorAll('option');
+			const options = test11.querySelectorAll('option');
 			check_inputs(options, 'selected', [false, false, true]);
-			assert.htmlEqual(test9_span.innerHTML, 'c');
+			assert.htmlEqual(test11_span.innerHTML, 'c');
 
 			select_option(options[0]);
 			flushSync();
 			check_inputs(options, 'selected', [true, false, false]);
-			assert.htmlEqual(test9_span.innerHTML, 'a');
+			assert.htmlEqual(test11_span.innerHTML, 'a');
 
 			after_reset.push(() => {
 				check_inputs(options, 'selected', [false, true, false]);
-				assert.htmlEqual(test9_span.innerHTML, 'b');
+				assert.htmlEqual(test11_span.innerHTML, 'b');
 			});
 		}
 
 		{
 			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
-			const inputs = test12.querySelectorAll('input, textarea');
+			const inputs = test14.querySelectorAll('input, textarea');
 			assert.equal(inputs[0].value, 'x');
 			assert.equal(/** @type {HTMLInputElement} */ (inputs[1]).checked, true);
 			assert.equal(inputs[2].value, 'x');
diff --git a/packages/svelte/tests/runtime-runes/samples/form-default-value/main.svelte b/packages/svelte/tests/runtime-runes/samples/form-default-value/main.svelte
index 35d495300b70..4d6a1a00b83a 100644
--- a/packages/svelte/tests/runtime-runes/samples/form-default-value/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/form-default-value/main.svelte
@@ -7,25 +7,37 @@
 	let value6 = $state();
 	let value7 = $state();
 	let value8 = $state();
-	let value9 = $state('y');
-	let value10 = $state('y');
-	let value11 = $state('y');
-	let value12 = $state('y');
-	let value13 = $state('y');
-	let value14 = $state('y');
-	let value15 = $state('y');
-	let value16 = $state('y');
+	let value9 = $state(null);
+	let value10 = $state(null);
+	let value11 = $state(null);
+	let value12 = $state(null);
+	let value13 = $state(null);
+	let value14 = $state(null);
+	let value15 = $state(null);
+	let value16 = $state(null);
+	let value17 = $state('y');
+	let value18 = $state('y');
+	let value19 = $state('y');
+	let value20 = $state('y');
+	let value21 = $state('y');
+	let value22 = $state('y');
+	let value23 = $state('y');
+	let value24 = $state('y');
 
 	let checked1 = $state();
 	let checked2 = $state();
 	let checked3 = $state();
 	let checked4 = $state();
-	let checked5 = $state(false);
-	let checked6 = $state(false);
-	let checked7 = $state(false);
-	let checked8 = $state(false);
-	let checked9 = $state(true);
-	let checked10 = $state(true);
+	let checked5 = $state(null);
+	let checked6 = $state(null);
+	let checked7 = $state(null);
+	let checked8 = $state(null);
+	let checked9 = $state(false);
+	let checked10 = $state(false);
+	let checked11 = $state(false);
+	let checked12 = $state(false);
+	let checked13 = $state(true);
+	let checked14 = $state(true);
  
 
 	let selected1 = $state();
@@ -53,7 +65,7 @@
 		<textarea defaultValue="x" bind:value={value8}></textarea>
 	</div>
 
-	<!-- defaultValue=x, value=y -->
+	<!-- defaultValue=x, value=null -->
 	<div class="test-2">
 		<input {defaultValue} bind:value={value9} />
 		<input {defaultValue} value={value10} />
@@ -65,27 +77,47 @@
 		<textarea defaultValue="x" bind:value={value16}></textarea>
 	</div>
 
+	<!-- defaultValue=x, value=y -->
+	<div class="test-3">
+		<input {defaultValue} bind:value={value17} />
+		<input {defaultValue} value={value18} />
+		<input defaultValue="x" value={value19} />
+		<input defaultValue="x" bind:value={value20} />
+		<textarea {defaultValue} value={value21}></textarea>
+		<textarea {defaultValue} bind:value={value22}></textarea>
+		<textarea defaultValue="x" value={value23}></textarea>
+		<textarea defaultValue="x" bind:value={value24}></textarea>
+	</div>
+
 	<p>Input checked</p>
 	<!-- defaultChecked=true, checked=undefined -->
-	<div class="test-3">
+	<div class="test-4">
 		<input type="checkbox" {defaultChecked} checked={checked1} />
 		<input type="checkbox" {defaultChecked} bind:checked={checked2} />
 		<input type="checkbox" defaultChecked checked={checked3} />
 		<input type="checkbox" defaultChecked bind:checked={checked4} />
 	</div>
 
-	<!-- defaultChecked=true, checked=false -->
-	<div class="test-4">
+	<!-- defaultChecked=true, checked=null -->
+	<div class="test-5">
 		<input type="checkbox" {defaultChecked} checked={checked5} />
 		<input type="checkbox" {defaultChecked} bind:checked={checked6} />
 		<input type="checkbox" defaultChecked checked={checked7} />
 		<input type="checkbox" defaultChecked bind:checked={checked8} />
 	</div>
 
+	<!-- defaultChecked=true, checked=false -->
+	<div class="test-6">
+		<input type="checkbox" {defaultChecked} checked={checked9} />
+		<input type="checkbox" {defaultChecked} bind:checked={checked10} />
+		<input type="checkbox" defaultChecked checked={checked11} />
+		<input type="checkbox" defaultChecked bind:checked={checked12} />
+	</div>
+
 	<!-- defaultChecked=false, checked=true -->
-	<div class="test-5">
-		<input type="checkbox" defaultChecked={false} checked={checked9} />
-		<input type="checkbox" defaultChecked={false} bind:checked={checked10} />
+	<div class="test-7">
+		<input type="checkbox" defaultChecked={false} checked={checked13} />
+		<input type="checkbox" defaultChecked={false} bind:checked={checked14} />
 	</div>
 
 	<!-- no support for bind:group; too complex + we may deprecate it in favor of bind:checked={get,set} -->
@@ -138,7 +170,7 @@
 	</select>
 
 	<p>Static values</p>
-	<div class="test-12">
+	<div class="test-14">
 		<input value="x" defaultValue="y" />
 		<input type="checkbox" checked defaultChecked={false} />
 		<textarea defaultValue="y">x</textarea>
@@ -151,13 +183,15 @@
 	Bound values:
 	<span class="test-1">{value1} {value3} {value6} {value8}</span>
 	<span class="test-2">{value9} {value12} {value14} {value16}</span>
-	<span class="test-3">{checked2} {checked4}</span>
-	<span class="test-4">{checked6} {checked8}</span>
-	<span class="test-5">{checked10}</span>
-	<span class="test-6">{selected1}</span>
-	<span class="test-7">{selected2}</span>
-	<span class="test-8">{selected3}</span>
-	<span class="test-9">{selected4}</span>
-	<span class="test-10">{selected5}</span>
-	<span class="test-11">{selected6}</span>
+	<span class="test-3">{value17} {value20} {value22} {value24}</span>
+	<span class="test-4">{checked2} {checked4}</span>
+	<span class="test-5">{checked6} {checked8}</span>
+	<span class="test-6">{checked10} {checked12}</span>
+	<span class="test-7">{checked14}</span>
+	<span class="test-8">{selected1}</span>
+	<span class="test-9">{selected2}</span>
+	<span class="test-10">{selected3}</span>
+	<span class="test-11">{selected4}</span>
+	<span class="test-12">{selected5}</span>
+	<span class="test-13">{selected6}</span>
 </p>

From 0a9890bb1ef748c3b5bb41c99dfe8343e3a61dbb Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 5 Dec 2024 16:24:40 +0100
Subject: [PATCH 03/62] feat: provide `MediaQuery` / `prefersReducedMotion`
 (#14422)

* feat: provide `MediaQuery` / `prefersReducedMotion`

closes #5346

* matches -> current, server fallback

* createStartStopNotifier

* test polyfill

* more tests fixes

* feedback

* rename

* tweak, types

* hnnnggh

* mark as pure

* fix type check

* notify -> subscribe

* add links to inline docs

* better API, more docs

* add example to prefersReducedMotion

* add example for MediaQuery

* typo

* fix example

* tweak docs

* changesets

* note when APIs were added

* add note

* regenerate

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/popular-worms-repeat.md            |  5 +
 .changeset/quiet-tables-cheat.md              |  5 +
 packages/svelte/src/motion/index.js           | 30 ++++++
 .../src/reactivity/create-subscriber.js       | 81 ++++++++++++++++
 .../svelte/src/reactivity/index-client.js     |  2 +
 .../svelte/src/reactivity/index-server.js     | 18 ++++
 packages/svelte/src/reactivity/media-query.js | 41 ++++++++
 packages/svelte/src/store/index-client.js     | 51 +++-------
 packages/svelte/tests/helpers.js              | 13 +++
 packages/svelte/tests/motion/test.ts          |  2 +
 packages/svelte/tsconfig.json                 |  1 +
 packages/svelte/types/index.d.ts              | 93 +++++++++++++++++++
 12 files changed, 305 insertions(+), 37 deletions(-)
 create mode 100644 .changeset/popular-worms-repeat.md
 create mode 100644 .changeset/quiet-tables-cheat.md
 create mode 100644 packages/svelte/src/reactivity/create-subscriber.js
 create mode 100644 packages/svelte/src/reactivity/media-query.js

diff --git a/.changeset/popular-worms-repeat.md b/.changeset/popular-worms-repeat.md
new file mode 100644
index 000000000000..68d9f9a3e80e
--- /dev/null
+++ b/.changeset/popular-worms-repeat.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: add `createSubscriber` function for creating reactive values that depend on subscriptions
diff --git a/.changeset/quiet-tables-cheat.md b/.changeset/quiet-tables-cheat.md
new file mode 100644
index 000000000000..92e9c266cc90
--- /dev/null
+++ b/.changeset/quiet-tables-cheat.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: add reactive `MediaQuery` class, and a `prefersReducedMotion` class instance
diff --git a/packages/svelte/src/motion/index.js b/packages/svelte/src/motion/index.js
index 10f52502d372..f4262a565024 100644
--- a/packages/svelte/src/motion/index.js
+++ b/packages/svelte/src/motion/index.js
@@ -1,2 +1,32 @@
+import { MediaQuery } from 'svelte/reactivity';
+
 export * from './spring.js';
 export * from './tweened.js';
+
+/**
+ * A [media query](https://svelte.dev/docs/svelte/svelte-reactivity#MediaQuery) that matches if the user [prefers reduced motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion).
+ *
+ * ```svelte
+ * <script>
+ * 	import { prefersReducedMotion } from 'svelte/motion';
+ * 	import { fly } from 'svelte/transition';
+ *
+ * 	let visible = $state(false);
+ * </script>
+ *
+ * <button onclick={() => visible = !visible}>
+ * 	toggle
+ * </button>
+ *
+ * {#if visible}
+ * 	<p transition:fly={{ y: prefersReducedMotion.current ? 0 : 200 }}>
+ * 		flies in, unless the user prefers reduced motion
+ * 	</p>
+ * {/if}
+ * ```
+ * @type {MediaQuery}
+ * @since 5.7.0
+ */
+export const prefersReducedMotion = /*@__PURE__*/ new MediaQuery(
+	'(prefers-reduced-motion: reduce)'
+);
diff --git a/packages/svelte/src/reactivity/create-subscriber.js b/packages/svelte/src/reactivity/create-subscriber.js
new file mode 100644
index 000000000000..63deca62ea8b
--- /dev/null
+++ b/packages/svelte/src/reactivity/create-subscriber.js
@@ -0,0 +1,81 @@
+import { get, tick, untrack } from '../internal/client/runtime.js';
+import { effect_tracking, render_effect } from '../internal/client/reactivity/effects.js';
+import { source } from '../internal/client/reactivity/sources.js';
+import { increment } from './utils.js';
+
+/**
+ * Returns a `subscribe` function that, if called in an effect (including expressions in the template),
+ * calls its `start` callback with an `update` function. Whenever `update` is called, the effect re-runs.
+ *
+ * If `start` returns a function, it will be called when the effect is destroyed.
+ *
+ * If `subscribe` is called in multiple effects, `start` will only be called once as long as the effects
+ * are active, and the returned teardown function will only be called when all effects are destroyed.
+ *
+ * It's best understood with an example. Here's an implementation of [`MediaQuery`](https://svelte.dev/docs/svelte/svelte-reactivity#MediaQuery):
+ *
+ * ```js
+ * import { createSubscriber } from 'svelte/reactivity';
+ * import { on } from 'svelte/events';
+ *
+ * export class MediaQuery {
+ * 	#query;
+ * 	#subscribe;
+ *
+ * 	constructor(query) {
+ * 		this.#query = window.matchMedia(`(${query})`);
+ *
+ * 		this.#subscribe = createSubscriber((update) => {
+ * 			// when the `change` event occurs, re-run any effects that read `this.current`
+ * 			const off = on(this.#query, 'change', update);
+ *
+ * 			// stop listening when all the effects are destroyed
+ * 			return () => off();
+ * 		});
+ * 	}
+ *
+ * 	get current() {
+ * 		this.#subscribe();
+ *
+ * 		// Return the current state of the query, whether or not we're in an effect
+ * 		return this.#query.matches;
+ * 	}
+ * }
+ * ```
+ * @param {(update: () => void) => (() => void) | void} start
+ * @since 5.7.0
+ */
+export function createSubscriber(start) {
+	let subscribers = 0;
+	let version = source(0);
+	/** @type {(() => void) | void} */
+	let stop;
+
+	return () => {
+		if (effect_tracking()) {
+			get(version);
+
+			render_effect(() => {
+				if (subscribers === 0) {
+					stop = untrack(() => start(() => increment(version)));
+				}
+
+				subscribers += 1;
+
+				return () => {
+					tick().then(() => {
+						// Only count down after timeout, else we would reach 0 before our own render effect reruns,
+						// but reach 1 again when the tick callback of the prior teardown runs. That would mean we
+						// re-subcribe unnecessarily and create a memory leak because the old subscription is never cleaned up.
+						subscribers -= 1;
+
+						if (subscribers === 0) {
+							stop?.();
+							stop = undefined;
+						}
+					});
+				};
+			});
+		}
+	};
+}
diff --git a/packages/svelte/src/reactivity/index-client.js b/packages/svelte/src/reactivity/index-client.js
index 2757688a5958..3eb9b95333ab 100644
--- a/packages/svelte/src/reactivity/index-client.js
+++ b/packages/svelte/src/reactivity/index-client.js
@@ -3,3 +3,5 @@ export { SvelteSet } from './set.js';
 export { SvelteMap } from './map.js';
 export { SvelteURL } from './url.js';
 export { SvelteURLSearchParams } from './url-search-params.js';
+export { MediaQuery } from './media-query.js';
+export { createSubscriber } from './create-subscriber.js';
diff --git a/packages/svelte/src/reactivity/index-server.js b/packages/svelte/src/reactivity/index-server.js
index 6240469ec36f..6a6c9dcf1360 100644
--- a/packages/svelte/src/reactivity/index-server.js
+++ b/packages/svelte/src/reactivity/index-server.js
@@ -3,3 +3,21 @@ export const SvelteSet = globalThis.Set;
 export const SvelteMap = globalThis.Map;
 export const SvelteURL = globalThis.URL;
 export const SvelteURLSearchParams = globalThis.URLSearchParams;
+
+export class MediaQuery {
+	current;
+	/**
+	 * @param {string} query
+	 * @param {boolean} [matches]
+	 */
+	constructor(query, matches = false) {
+		this.current = matches;
+	}
+}
+
+/**
+ * @param {any} _
+ */
+export function createSubscriber(_) {
+	return () => {};
+}
diff --git a/packages/svelte/src/reactivity/media-query.js b/packages/svelte/src/reactivity/media-query.js
new file mode 100644
index 000000000000..a2be0adc91e2
--- /dev/null
+++ b/packages/svelte/src/reactivity/media-query.js
@@ -0,0 +1,41 @@
+import { createSubscriber } from './create-subscriber.js';
+import { on } from '../events/index.js';
+
+/**
+ * Creates a media query and provides a `current` property that reflects whether or not it matches.
+ *
+ * Use it carefully — during server-side rendering, there is no way to know what the correct value should be, potentially causing content to change upon hydration.
+ * If you can use the media query in CSS to achieve the same effect, do that.
+ *
+ * ```svelte
+ * <script>
+ * 	import { MediaQuery } from 'svelte/reactivity';
+ *
+ * 	const large = new MediaQuery('min-width: 800px');
+ * </script>
+ *
+ * <h1>{large.current ? 'large screen' : 'small screen'}</h1>
+ * ```
+ * @since 5.7.0
+ */
+export class MediaQuery {
+	#query;
+	#subscribe = createSubscriber((update) => {
+		return on(this.#query, 'change', update);
+	});
+
+	get current() {
+		this.#subscribe();
+
+		return this.#query.matches;
+	}
+
+	/**
+	 * @param {string} query A media query string
+	 * @param {boolean} [matches] Fallback value for the server
+	 */
+	constructor(query, matches) {
+		// For convenience (and because people likely forget them) we add the parentheses; double parentheses are not a problem
+		this.#query = window.matchMedia(`(${query})`);
+	}
+}
diff --git a/packages/svelte/src/store/index-client.js b/packages/svelte/src/store/index-client.js
index f2f1dfc4eba1..ae6806ec763f 100644
--- a/packages/svelte/src/store/index-client.js
+++ b/packages/svelte/src/store/index-client.js
@@ -1,14 +1,11 @@
 /** @import { Readable, Writable } from './public.js' */
-import { noop } from '../internal/shared/utils.js';
 import {
 	effect_root,
 	effect_tracking,
 	render_effect
 } from '../internal/client/reactivity/effects.js';
-import { source } from '../internal/client/reactivity/sources.js';
-import { get as get_source, tick } from '../internal/client/runtime.js';
-import { increment } from '../reactivity/utils.js';
 import { get, writable } from './shared/index.js';
+import { createSubscriber } from '../reactivity/create-subscriber.js';
 
 export { derived, get, readable, readonly, writable } from './shared/index.js';
 
@@ -109,43 +106,23 @@ export function toStore(get, set) {
  */
 export function fromStore(store) {
 	let value = /** @type {V} */ (undefined);
-	let version = source(0);
-	let subscribers = 0;
 
-	let unsubscribe = noop;
+	const subscribe = createSubscriber((update) => {
+		let ran = false;
 
-	function current() {
-		if (effect_tracking()) {
-			get_source(version);
+		const unsubscribe = store.subscribe((v) => {
+			value = v;
+			if (ran) update();
+		});
 
-			render_effect(() => {
-				if (subscribers === 0) {
-					let ran = false;
-
-					unsubscribe = store.subscribe((v) => {
-						value = v;
-						if (ran) increment(version);
-					});
-
-					ran = true;
-				}
-
-				subscribers += 1;
-
-				return () => {
-					tick().then(() => {
-						// Only count down after timeout, else we would reach 0 before our own render effect reruns,
-						// but reach 1 again when the tick callback of the prior teardown runs. That would mean we
-						// re-subcribe unnecessarily and create a memory leak because the old subscription is never cleaned up.
-						subscribers -= 1;
-
-						if (subscribers === 0) {
-							unsubscribe();
-						}
-					});
-				};
-			});
+		ran = true;
+
+		return unsubscribe;
+	});
 
+	function current() {
+		if (effect_tracking()) {
+			subscribe();
 			return value;
 		}
 
diff --git a/packages/svelte/tests/helpers.js b/packages/svelte/tests/helpers.js
index 002ebf2e38ff..45b90240c99a 100644
--- a/packages/svelte/tests/helpers.js
+++ b/packages/svelte/tests/helpers.js
@@ -172,3 +172,16 @@ export function write(file, contents) {
 
 	fs.writeFileSync(file, contents);
 }
+
+// Guard because not all test contexts load this with JSDOM
+if (typeof window !== 'undefined') {
+	// @ts-expect-error JS DOM doesn't support it
+	Window.prototype.matchMedia = (media) => {
+		return {
+			matches: false,
+			media,
+			addEventListener: () => {},
+			removeEventListener: () => {}
+		};
+	};
+}
diff --git a/packages/svelte/tests/motion/test.ts b/packages/svelte/tests/motion/test.ts
index 05971b5cab65..b6554e5e56ed 100644
--- a/packages/svelte/tests/motion/test.ts
+++ b/packages/svelte/tests/motion/test.ts
@@ -1,3 +1,5 @@
+// @vitest-environment jsdom
+import '../helpers.js'; // for the matchMedia polyfill
 import { describe, it, assert } from 'vitest';
 import { get } from 'svelte/store';
 import { spring, tweened } from 'svelte/motion';
diff --git a/packages/svelte/tsconfig.json b/packages/svelte/tsconfig.json
index 017b92629866..380307901edd 100644
--- a/packages/svelte/tsconfig.json
+++ b/packages/svelte/tsconfig.json
@@ -25,6 +25,7 @@
 			"svelte/motion": ["./src/motion/public.d.ts"],
 			"svelte/server": ["./src/server/index.d.ts"],
 			"svelte/store": ["./src/store/public.d.ts"],
+			"svelte/reactivity": ["./src/reactivity/index-client.js"],
 			"#compiler": ["./src/compiler/types/index.d.ts"],
 			"#client": ["./src/internal/client/types.d.ts"],
 			"#server": ["./src/internal/server/types.d.ts"],
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 5a5cc86ae6c3..46a2137ae6e4 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1637,6 +1637,7 @@ declare module 'svelte/legacy' {
 }
 
 declare module 'svelte/motion' {
+	import type { MediaQuery } from 'svelte/reactivity';
 	export interface Spring<T> extends Readable<T> {
 		set: (new_value: T, opts?: SpringUpdateOpts) => Promise<void>;
 		update: (fn: Updater<T>, opts?: SpringUpdateOpts) => Promise<void>;
@@ -1683,6 +1684,30 @@ declare module 'svelte/motion' {
 		easing?: (t: number) => number;
 		interpolate?: (a: T, b: T) => (t: number) => T;
 	}
+	/**
+	 * A [media query](https://svelte.dev/docs/svelte/svelte-reactivity#MediaQuery) that matches if the user [prefers reduced motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion).
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { prefersReducedMotion } from 'svelte/motion';
+	 * 	import { fly } from 'svelte/transition';
+	 *
+	 * 	let visible = $state(false);
+	 * </script>
+	 *
+	 * <button onclick={() => visible = !visible}>
+	 * 	toggle
+	 * </button>
+	 *
+	 * {#if visible}
+	 * 	<p transition:fly={{ y: prefersReducedMotion.current ? 0 : 200 }}>
+	 * 		flies in, unless the user prefers reduced motion
+	 * 	</p>
+	 * {/if}
+	 * ```
+	 * @since 5.7.0
+	 */
+	export const prefersReducedMotion: MediaQuery;
 	/**
 	 * The spring function in Svelte creates a store whose value is animated, with a motion that simulates the behavior of a spring. This means when the value changes, instead of transitioning at a steady rate, it "bounces" like a spring would, depending on the physics parameters provided. This adds a level of realism to the transitions and can enhance the user experience.
 	 *
@@ -1727,6 +1752,74 @@ declare module 'svelte/reactivity' {
 		[REPLACE](params: URLSearchParams): void;
 		#private;
 	}
+	/**
+	 * Creates a media query and provides a `current` property that reflects whether or not it matches.
+	 *
+	 * Use it carefully — during server-side rendering, there is no way to know what the correct value should be, potentially causing content to change upon hydration.
+	 * If you can use the media query in CSS to achieve the same effect, do that.
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { MediaQuery } from 'svelte/reactivity';
+	 *
+	 * 	const large = new MediaQuery('min-width: 800px');
+	 * </script>
+	 *
+	 * <h1>{large.current ? 'large screen' : 'small screen'}</h1>
+	 * ```
+	 * @since 5.7.0
+	 */
+	export class MediaQuery {
+		/**
+		 * @param query A media query string
+		 * @param matches Fallback value for the server
+		 */
+		constructor(query: string, matches?: boolean | undefined);
+		get current(): boolean;
+		#private;
+	}
+	/**
+	 * Returns a `subscribe` function that, if called in an effect (including expressions in the template),
+	 * calls its `start` callback with an `update` function. Whenever `update` is called, the effect re-runs.
+	 *
+	 * If `start` returns a function, it will be called when the effect is destroyed.
+	 *
+	 * If `subscribe` is called in multiple effects, `start` will only be called once as long as the effects
+	 * are active, and the returned teardown function will only be called when all effects are destroyed.
+	 *
+	 * It's best understood with an example. Here's an implementation of [`MediaQuery`](https://svelte.dev/docs/svelte/svelte-reactivity#MediaQuery):
+	 *
+	 * ```js
+	 * import { createSubscriber } from 'svelte/reactivity';
+	 * import { on } from 'svelte/events';
+	 *
+	 * export class MediaQuery {
+	 * 	#query;
+	 * 	#subscribe;
+	 *
+	 * 	constructor(query) {
+	 * 		this.#query = window.matchMedia(`(${query})`);
+	 *
+	 * 		this.#subscribe = createSubscriber((update) => {
+	 * 			// when the `change` event occurs, re-run any effects that read `this.current`
+	 * 			const off = on(this.#query, 'change', update);
+	 *
+	 * 			// stop listening when all the effects are destroyed
+	 * 			return () => off();
+	 * 		});
+	 * 	}
+	 *
+	 * 	get current() {
+	 * 		this.#subscribe();
+	 *
+	 * 		// Return the current state of the query, whether or not we're in an effect
+	 * 		return this.#query.matches;
+	 * 	}
+	 * }
+	 * ```
+	 * @since 5.7.0
+	 */
+	export function createSubscriber(start: (update: () => void) => (() => void) | void): () => void;
 
 	export {};
 }

From 7f5172745dee298a71f0b3502e225d999f1a11b0 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 5 Dec 2024 10:32:37 -0500
Subject: [PATCH 04/62] Version Packages (#14570)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/cool-clocks-film.md     |  5 -----
 .changeset/popular-worms-repeat.md |  5 -----
 .changeset/quiet-tables-cheat.md   |  5 -----
 packages/svelte/CHANGELOG.md       | 12 ++++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 6 files changed, 14 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/cool-clocks-film.md
 delete mode 100644 .changeset/popular-worms-repeat.md
 delete mode 100644 .changeset/quiet-tables-cheat.md

diff --git a/.changeset/cool-clocks-film.md b/.changeset/cool-clocks-film.md
deleted file mode 100644
index a38b2e19d497..000000000000
--- a/.changeset/cool-clocks-film.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: treat `undefined` and `null` the same for the initial input value
diff --git a/.changeset/popular-worms-repeat.md b/.changeset/popular-worms-repeat.md
deleted file mode 100644
index 68d9f9a3e80e..000000000000
--- a/.changeset/popular-worms-repeat.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add `createSubscriber` function for creating reactive values that depend on subscriptions
diff --git a/.changeset/quiet-tables-cheat.md b/.changeset/quiet-tables-cheat.md
deleted file mode 100644
index 92e9c266cc90..000000000000
--- a/.changeset/quiet-tables-cheat.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add reactive `MediaQuery` class, and a `prefersReducedMotion` class instance
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 6fc56c836cee..9b9ff754be2c 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.7.0
+
+### Minor Changes
+
+- feat: add `createSubscriber` function for creating reactive values that depend on subscriptions ([#14422](https://github.com/sveltejs/svelte/pull/14422))
+
+- feat: add reactive `MediaQuery` class, and a `prefersReducedMotion` class instance ([#14422](https://github.com/sveltejs/svelte/pull/14422))
+
+### Patch Changes
+
+- fix: treat `undefined` and `null` the same for the initial input value ([#14562](https://github.com/sveltejs/svelte/pull/14562))
+
 ## 5.6.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 68d6eeed9ea7..11313d14ab82 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.6.2",
+  "version": "5.7.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 88f83720a173..a69d2f6b32aa 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.6.2';
+export const VERSION = '5.7.0';
 export const PUBLIC_VERSION = '5';

From 6a6b4ec36a11bb4434311c4735ff846b79c00ba0 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 5 Dec 2024 13:31:02 -0500
Subject: [PATCH 05/62] fix deprecation notices (#14574)

---
 packages/svelte/src/index-client.js |  6 +++---
 packages/svelte/src/index.d.ts      | 12 ++++++------
 packages/svelte/types/index.d.ts    | 18 +++++++++---------
 3 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/packages/svelte/src/index-client.js b/packages/svelte/src/index-client.js
index 72811c8f17c9..587d76623331 100644
--- a/packages/svelte/src/index-client.js
+++ b/packages/svelte/src/index-client.js
@@ -83,7 +83,7 @@ function create_custom_event(type, detail, { bubbles = false, cancelable = false
  * }>();
  * ```
  *
- * @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte.dev/docs/svelte/v5-migration-guide#Event-changes-Component-events
+ * @deprecated Use callback props and/or the `$host()` rune instead — see [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Event-changes-Component-events)
  * @template {Record<string, any>} [EventMap = any]
  * @returns {EventDispatcher<EventMap>}
  */
@@ -122,7 +122,7 @@ export function createEventDispatcher() {
  *
  * In runes mode use `$effect.pre` instead.
  *
- * @deprecated Use `$effect.pre` instead — see https://svelte.dev/docs/svelte/$effect#$effect.pre
+ * @deprecated Use [`$effect.pre`](https://svelte.dev/docs/svelte/$effect#$effect.pre) instead
  * @param {() => void} fn
  * @returns {void}
  */
@@ -145,7 +145,7 @@ export function beforeUpdate(fn) {
  *
  * In runes mode use `$effect` instead.
  *
- * @deprecated Use `$effect` instead — see https://svelte.dev/docs/svelte/$effect
+ * @deprecated Use [`$effect`](https://svelte.dev/docs/svelte/$effect) instead
  * @param {() => void} fn
  * @returns {void}
  */
diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts
index b8ba8b6f0a75..e157ce76e2f3 100644
--- a/packages/svelte/src/index.d.ts
+++ b/packages/svelte/src/index.d.ts
@@ -53,7 +53,7 @@ export class SvelteComponent<
 	/**
 	 * @deprecated This constructor only exists when using the `asClassComponent` compatibility helper, which
 	 * is a stop-gap solution. Migrate towards using `mount` instead. See
-	 * https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more info.
+	 * [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
 	 */
 	constructor(options: ComponentConstructorOptions<Properties<Props, Slots>>);
 	/**
@@ -83,14 +83,14 @@ export class SvelteComponent<
 
 	/**
 	 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-	 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+	 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 	 * for more info.
 	 */
 	$destroy(): void;
 
 	/**
 	 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-	 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+	 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 	 * for more info.
 	 */
 	$on<K extends Extract<keyof Events, string>>(
@@ -100,7 +100,7 @@ export class SvelteComponent<
 
 	/**
 	 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-	 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+	 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 	 * for more info.
 	 */
 	$set(props: Partial<Props>): void;
@@ -153,13 +153,13 @@ export interface Component<
 	): {
 		/**
 		 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-		 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+		 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 		 * for more info.
 		 */
 		$on?(type: string, callback: (e: any) => void): () => void;
 		/**
 		 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-		 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+		 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 		 * for more info.
 		 */
 		$set?(props: Partial<Props>): void;
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 46a2137ae6e4..db6ac88c2c2a 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -50,7 +50,7 @@ declare module 'svelte' {
 		/**
 		 * @deprecated This constructor only exists when using the `asClassComponent` compatibility helper, which
 		 * is a stop-gap solution. Migrate towards using `mount` instead. See
-		 * https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more info.
+		 * [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
 		 */
 		constructor(options: ComponentConstructorOptions<Properties<Props, Slots>>);
 		/**
@@ -80,14 +80,14 @@ declare module 'svelte' {
 
 		/**
 		 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-		 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+		 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 		 * for more info.
 		 */
 		$destroy(): void;
 
 		/**
 		 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-		 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+		 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 		 * for more info.
 		 */
 		$on<K extends Extract<keyof Events, string>>(
@@ -97,7 +97,7 @@ declare module 'svelte' {
 
 		/**
 		 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-		 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+		 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 		 * for more info.
 		 */
 		$set(props: Partial<Props>): void;
@@ -150,13 +150,13 @@ declare module 'svelte' {
 		): {
 			/**
 			 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-			 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+			 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 			 * for more info.
 			 */
 			$on?(type: string, callback: (e: any) => void): () => void;
 			/**
 			 * @deprecated This method only exists when using one of the legacy compatibility helpers, which
-			 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
+			 * is a stop-gap solution. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 			 * for more info.
 			 */
 			$set?(props: Partial<Props>): void;
@@ -385,7 +385,7 @@ declare module 'svelte' {
 	 * }>();
 	 * ```
 	 *
-	 * @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte.dev/docs/svelte/v5-migration-guide#Event-changes-Component-events
+	 * @deprecated Use callback props and/or the `$host()` rune instead — see [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Event-changes-Component-events)
 	 * */
 	export function createEventDispatcher<EventMap extends Record<string, any> = any>(): EventDispatcher<EventMap>;
 	/**
@@ -395,7 +395,7 @@ declare module 'svelte' {
 	 *
 	 * In runes mode use `$effect.pre` instead.
 	 *
-	 * @deprecated Use `$effect.pre` instead — see https://svelte.dev/docs/svelte/$effect#$effect.pre
+	 * @deprecated Use [`$effect.pre`](https://svelte.dev/docs/svelte/$effect#$effect.pre) instead
 	 * */
 	export function beforeUpdate(fn: () => void): void;
 	/**
@@ -405,7 +405,7 @@ declare module 'svelte' {
 	 *
 	 * In runes mode use `$effect` instead.
 	 *
-	 * @deprecated Use `$effect` instead — see https://svelte.dev/docs/svelte/$effect
+	 * @deprecated Use [`$effect`](https://svelte.dev/docs/svelte/$effect) instead
 	 * */
 	export function afterUpdate(fn: () => void): void;
 	/**

From ca67aa1b3405ba5de36ab240131a44beea1134d1 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 5 Dec 2024 21:17:59 +0100
Subject: [PATCH 06/62] fix: ensure bindings always take precedence over
 spreads (#14575)

---
 .changeset/little-berries-worry.md            |  5 +++
 .../client/visitors/shared/component.js       | 36 +++++++++++++------
 .../server/visitors/shared/component.js       | 35 ++++++++++++------
 .../bind-and-spread-precedence/_config.js     |  9 +++++
 .../bind-and-spread-precedence/input.svelte   |  5 +++
 .../bind-and-spread-precedence/main.svelte    | 11 ++++++
 6 files changed, 81 insertions(+), 20 deletions(-)
 create mode 100644 .changeset/little-berries-worry.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/input.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/main.svelte

diff --git a/.changeset/little-berries-worry.md b/.changeset/little-berries-worry.md
new file mode 100644
index 000000000000..aad4de715a50
--- /dev/null
+++ b/.changeset/little-berries-worry.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure bindings always take precedence over spreads
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
index 5dde60b3b414..aa7be93cb57e 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
@@ -20,6 +20,8 @@ import { determine_slot } from '../../../../../utils/slot.js';
 export function build_component(node, component_name, context, anchor = context.state.node) {
 	/** @type {Array<Property[] | Expression>} */
 	const props_and_spreads = [];
+	/** @type {Array<() => void>} */
+	const delayed_props = [];
 
 	/** @type {ExpressionStatement[]} */
 	const lets = [];
@@ -63,14 +65,23 @@ export function build_component(node, component_name, context, anchor = context.
 
 	/**
 	 * @param {Property} prop
+	 * @param {boolean} [delay]
 	 */
-	function push_prop(prop) {
-		const current = props_and_spreads.at(-1);
-		const current_is_props = Array.isArray(current);
-		const props = current_is_props ? current : [];
-		props.push(prop);
-		if (!current_is_props) {
-			props_and_spreads.push(props);
+	function push_prop(prop, delay = false) {
+		const do_push = () => {
+			const current = props_and_spreads.at(-1);
+			const current_is_props = Array.isArray(current);
+			const props = current_is_props ? current : [];
+			props.push(prop);
+			if (!current_is_props) {
+				props_and_spreads.push(props);
+			}
+		};
+
+		if (delay) {
+			delayed_props.push(do_push);
+		} else {
+			do_push();
 		}
 	}
 
@@ -202,22 +213,27 @@ export function build_component(node, component_name, context, anchor = context.
 					attribute.expression.type === 'Identifier' &&
 					context.state.scope.get(attribute.expression.name)?.kind === 'store_sub';
 
+				// Delay prop pushes so bindings come at the end, to avoid spreads overwriting them
 				if (is_store_sub) {
 					push_prop(
-						b.get(attribute.name, [b.stmt(b.call('$.mark_store_binding')), b.return(expression)])
+						b.get(attribute.name, [b.stmt(b.call('$.mark_store_binding')), b.return(expression)]),
+						true
 					);
 				} else {
-					push_prop(b.get(attribute.name, [b.return(expression)]));
+					push_prop(b.get(attribute.name, [b.return(expression)]), true);
 				}
 
 				const assignment = b.assignment('=', attribute.expression, b.id('$$value'));
 				push_prop(
-					b.set(attribute.name, [b.stmt(/** @type {Expression} */ (context.visit(assignment)))])
+					b.set(attribute.name, [b.stmt(/** @type {Expression} */ (context.visit(assignment)))]),
+					true
 				);
 			}
 		}
 	}
 
+	delayed_props.forEach((fn) => fn());
+
 	if (slot_scope_applies_to_itself) {
 		context.state.init.push(...lets);
 	}
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
index 79df3cdd04c6..7cabfb06c527 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
@@ -13,6 +13,8 @@ import { is_element_node } from '../../../../nodes.js';
 export function build_inline_component(node, expression, context) {
 	/** @type {Array<Property[] | Expression>} */
 	const props_and_spreads = [];
+	/** @type {Array<() => void>} */
+	const delayed_props = [];
 
 	/** @type {Property[]} */
 	const custom_css_props = [];
@@ -49,14 +51,23 @@ export function build_inline_component(node, expression, context) {
 
 	/**
 	 * @param {Property} prop
+	 * @param {boolean} [delay]
 	 */
-	function push_prop(prop) {
-		const current = props_and_spreads.at(-1);
-		const current_is_props = Array.isArray(current);
-		const props = current_is_props ? current : [];
-		props.push(prop);
-		if (!current_is_props) {
-			props_and_spreads.push(props);
+	function push_prop(prop, delay = false) {
+		const do_push = () => {
+			const current = props_and_spreads.at(-1);
+			const current_is_props = Array.isArray(current);
+			const props = current_is_props ? current : [];
+			props.push(prop);
+			if (!current_is_props) {
+				props_and_spreads.push(props);
+			}
+		};
+
+		if (delay) {
+			delayed_props.push(do_push);
+		} else {
+			do_push();
 		}
 	}
 
@@ -81,11 +92,12 @@ export function build_inline_component(node, expression, context) {
 			const value = build_attribute_value(attribute.value, context, false, true);
 			push_prop(b.prop('init', b.key(attribute.name), value));
 		} else if (attribute.type === 'BindDirective' && attribute.name !== 'this') {
-			// TODO this needs to turn the whole thing into a while loop because the binding could be mutated eagerly in the child
+			// Delay prop pushes so bindings come at the end, to avoid spreads overwriting them
 			push_prop(
 				b.get(attribute.name, [
 					b.return(/** @type {Expression} */ (context.visit(attribute.expression)))
-				])
+				]),
+				true
 			);
 			push_prop(
 				b.set(attribute.name, [
@@ -95,11 +107,14 @@ export function build_inline_component(node, expression, context) {
 						)
 					),
 					b.stmt(b.assignment('=', b.id('$$settled'), b.false))
-				])
+				]),
+				true
 			);
 		}
 	}
 
+	delayed_props.forEach((fn) => fn());
+
 	/** @type {Statement[]} */
 	const snippet_declarations = [];
 
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/_config.js b/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/_config.js
new file mode 100644
index 000000000000..79e707148605
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	ssrHtml: `<input value="foo">`,
+
+	test({ assert, target }) {
+		assert.equal(target.querySelector('input')?.value, 'foo');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/input.svelte b/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/input.svelte
new file mode 100644
index 000000000000..f19f2477077d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/input.svelte
@@ -0,0 +1,5 @@
+<script>
+	let { value = $bindable(), ...properties } = $props();
+</script>
+
+<input bind:value {...properties} />
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/main.svelte b/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/main.svelte
new file mode 100644
index 000000000000..b4dea5b5885d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-and-spread-precedence/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	import Button from './input.svelte';
+	
+	let value = $state('foo');
+
+	const props = $state({
+		value: 'bar'
+	});
+</script>
+
+<Button bind:value {...props} />

From 60c0dc7a2dd1cef1f71c5a9176e52bf8a001d5e0 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 5 Dec 2024 15:23:10 -0500
Subject: [PATCH 07/62] Version Packages (#14576)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/little-berries-worry.md | 5 -----
 packages/svelte/CHANGELOG.md       | 6 ++++++
 packages/svelte/package.json       | 2 +-
 packages/svelte/src/version.js     | 2 +-
 4 files changed, 8 insertions(+), 7 deletions(-)
 delete mode 100644 .changeset/little-berries-worry.md

diff --git a/.changeset/little-berries-worry.md b/.changeset/little-berries-worry.md
deleted file mode 100644
index aad4de715a50..000000000000
--- a/.changeset/little-berries-worry.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure bindings always take precedence over spreads
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 9b9ff754be2c..b19cfb355b1e 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.7.1
+
+### Patch Changes
+
+- fix: ensure bindings always take precedence over spreads ([#14575](https://github.com/sveltejs/svelte/pull/14575))
+
 ## 5.7.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 11313d14ab82..6a01e01ecb86 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.7.0",
+  "version": "5.7.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index a69d2f6b32aa..331506a55a2f 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.7.0';
+export const VERSION = '5.7.1';
 export const PUBLIC_VERSION = '5';

From 80ffcc3fe15392aea6807218e93197dd79da27c8 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 6 Dec 2024 09:15:08 -0500
Subject: [PATCH 08/62] feat: add Spring and Tween classes (#11519)

* feat: add Spring class

* add some docs, Spring.of static method

* add Tween class

* lint

* preserveMomentum in milliseconds

* deprecate tweened

* changeset

* wrestle with types

* more consolidation

* flesh out the distinction a bit more, deprecate `subscribe`

---------

Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/tame-bottles-switch.md            |   5 +
 packages/svelte/src/internal/shared/utils.js |  21 ++
 packages/svelte/src/motion/private.d.ts      |  24 +-
 packages/svelte/src/motion/public.d.ts       |  78 ++++++-
 packages/svelte/src/motion/spring.js         | 218 ++++++++++++++++++-
 packages/svelte/src/motion/tweened.js        | 137 ++++++++++++
 packages/svelte/types/index.d.ts             | 159 +++++++++++---
 7 files changed, 603 insertions(+), 39 deletions(-)
 create mode 100644 .changeset/tame-bottles-switch.md

diff --git a/.changeset/tame-bottles-switch.md b/.changeset/tame-bottles-switch.md
new file mode 100644
index 000000000000..c597f5ea997c
--- /dev/null
+++ b/.changeset/tame-bottles-switch.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: add `Spring` and `Tween` classes to `svelte/motion`
diff --git a/packages/svelte/src/internal/shared/utils.js b/packages/svelte/src/internal/shared/utils.js
index d843413e57ef..92d29d9e1d68 100644
--- a/packages/svelte/src/internal/shared/utils.js
+++ b/packages/svelte/src/internal/shared/utils.js
@@ -44,6 +44,27 @@ export function run_all(arr) {
 	}
 }
 
+/**
+ * TODO replace with Promise.withResolvers once supported widely enough
+ * @template T
+ */
+export function deferred() {
+	/** @type {(value: T) => void} */
+	var resolve;
+
+	/** @type {(reason: any) => void} */
+	var reject;
+
+	/** @type {Promise<T>} */
+	var promise = new Promise((res, rej) => {
+		resolve = res;
+		reject = rej;
+	});
+
+	// @ts-expect-error
+	return { promise, resolve, reject };
+}
+
 /**
  * @template V
  * @param {V} value
diff --git a/packages/svelte/src/motion/private.d.ts b/packages/svelte/src/motion/private.d.ts
index 1a9afb0781b2..22b8cc4af39d 100644
--- a/packages/svelte/src/motion/private.d.ts
+++ b/packages/svelte/src/motion/private.d.ts
@@ -1,9 +1,11 @@
-import { Spring } from './public.js';
-
-export interface TickContext<T> {
+export interface TickContext {
 	inv_mass: number;
 	dt: number;
-	opts: Spring<T>;
+	opts: {
+		stiffness: number;
+		damping: number;
+		precision: number;
+	};
 	settled: boolean;
 }
 
@@ -14,8 +16,22 @@ export interface SpringOpts {
 }
 
 export interface SpringUpdateOpts {
+	/**
+	 * @deprecated Only use this for the spring store; does nothing when set on the Spring class
+	 */
 	hard?: any;
+	/**
+	 * @deprecated Only use this for the spring store; does nothing when set on the Spring class
+	 */
 	soft?: string | number | boolean;
+	/**
+	 * Only use this for the Spring class; does nothing when set on the spring store
+	 */
+	instant?: boolean;
+	/**
+	 * Only use this for the Spring class; does nothing when set on the spring store
+	 */
+	preserveMomentum?: number;
 }
 
 export type Updater<T> = (target_value: T, value: T) => T;
diff --git a/packages/svelte/src/motion/public.d.ts b/packages/svelte/src/motion/public.d.ts
index c0f55a4cca53..8fb9b9e66a1b 100644
--- a/packages/svelte/src/motion/public.d.ts
+++ b/packages/svelte/src/motion/public.d.ts
@@ -1,17 +1,87 @@
-import { Readable } from '../store/public.js';
-import { SpringUpdateOpts, TweenedOptions, Updater } from './private.js';
+import { Readable, type Unsubscriber } from '../store/public.js';
+import { SpringUpdateOpts, TweenedOptions, Updater, SpringOpts } from './private.js';
+
+// TODO we do declaration merging here in order to not have a breaking change (renaming the Spring interface)
+// this means both the Spring class and the Spring interface are merged into one with some things only
+// existing on one side. In Svelte 6, remove the type definition and move the jsdoc onto the class in spring.js
 
 export interface Spring<T> extends Readable<T> {
-	set: (new_value: T, opts?: SpringUpdateOpts) => Promise<void>;
+	set(new_value: T, opts?: SpringUpdateOpts): Promise<void>;
+	/**
+	 * @deprecated Only exists on the legacy `spring` store, not the `Spring` class
+	 */
 	update: (fn: Updater<T>, opts?: SpringUpdateOpts) => Promise<void>;
+	/**
+	 * @deprecated Only exists on the legacy `spring` store, not the `Spring` class
+	 */
+	subscribe(fn: (value: T) => void): Unsubscriber;
 	precision: number;
 	damping: number;
 	stiffness: number;
 }
 
+/**
+ * A wrapper for a value that behaves in a spring-like fashion. Changes to `spring.target` will cause `spring.current` to
+ * move towards it over time, taking account of the `spring.stiffness` and `spring.damping` parameters.
+ *
+ * ```svelte
+ * <script>
+ * 	import { Spring } from 'svelte/motion';
+ *
+ * 	const spring = new Spring(0);
+ * </script>
+ *
+ * <input type="range" bind:value={spring.target} />
+ * <input type="range" bind:value={spring.current} disabled />
+ * ```
+ */
+export class Spring<T> {
+	constructor(value: T, options?: SpringOpts);
+
+	/**
+	 * Create a spring whose value is bound to the return value of `fn`. This must be called
+	 * inside an effect root (for example, during component initialisation).
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { Spring } from 'svelte/motion';
+	 *
+	 * 	let { number } = $props();
+	 *
+	 * 	const spring = Spring.of(() => number);
+	 * </script>
+	 * ```
+	 */
+	static of<U>(fn: () => U, options?: SpringOpts): Spring<U>;
+
+	/**
+	 * Sets `spring.target` to `value` and returns a `Promise` that resolves if and when `spring.current` catches up to it.
+	 *
+	 * If `options.instant` is `true`, `spring.current` immediately matches `spring.target`.
+	 *
+	 * If `options.preserveMomentum` is provided, the spring will continue on its current trajectory for
+	 * the specified number of milliseconds. This is useful for things like 'fling' gestures.
+	 */
+	set(value: T, options?: SpringUpdateOpts): Promise<void>;
+
+	damping: number;
+	precision: number;
+	stiffness: number;
+	/**
+	 * The end value of the spring.
+	 * This property only exists on the `Spring` class, not the legacy `spring` store.
+	 */
+	target: T;
+	/**
+	 * The current value of the spring.
+	 * This property only exists on the `Spring` class, not the legacy `spring` store.
+	 */
+	get current(): T;
+}
+
 export interface Tweened<T> extends Readable<T> {
 	set(value: T, opts?: TweenedOptions<T>): Promise<void>;
 	update(updater: Updater<T>, opts?: TweenedOptions<T>): Promise<void>;
 }
 
-export * from './index.js';
+export { spring, tweened, Tween } from './index.js';
diff --git a/packages/svelte/src/motion/spring.js b/packages/svelte/src/motion/spring.js
index 992085b4b50d..270fabd4c774 100644
--- a/packages/svelte/src/motion/spring.js
+++ b/packages/svelte/src/motion/spring.js
@@ -1,14 +1,18 @@
 /** @import { Task } from '#client' */
 /** @import { SpringOpts, SpringUpdateOpts, TickContext } from './private.js' */
-/** @import { Spring } from './public.js' */
+/** @import { Spring as SpringStore } from './public.js' */
 import { writable } from '../store/shared/index.js';
 import { loop } from '../internal/client/loop.js';
 import { raf } from '../internal/client/timing.js';
 import { is_date } from './utils.js';
+import { set, source } from '../internal/client/reactivity/sources.js';
+import { render_effect } from '../internal/client/reactivity/effects.js';
+import { get } from '../internal/client/runtime.js';
+import { deferred, noop } from '../internal/shared/utils.js';
 
 /**
  * @template T
- * @param {TickContext<T>} ctx
+ * @param {TickContext} ctx
  * @param {T} last_value
  * @param {T} current_value
  * @param {T} target_value
@@ -53,10 +57,11 @@ function tick_spring(ctx, last_value, current_value, target_value) {
 /**
  * The spring function in Svelte creates a store whose value is animated, with a motion that simulates the behavior of a spring. This means when the value changes, instead of transitioning at a steady rate, it "bounces" like a spring would, depending on the physics parameters provided. This adds a level of realism to the transitions and can enhance the user experience.
  *
+ * @deprecated Use [`Spring`](https://svelte.dev/docs/svelte/svelte-motion#Spring) instead
  * @template [T=any]
  * @param {T} [value]
  * @param {SpringOpts} [opts]
- * @returns {Spring<T>}
+ * @returns {SpringStore<T>}
  */
 export function spring(value, opts = {}) {
 	const store = writable(value);
@@ -103,7 +108,7 @@ export function spring(value, opts = {}) {
 					return false;
 				}
 				inv_mass = Math.min(inv_mass + inv_mass_recovery_rate, 1);
-				/** @type {TickContext<T>} */
+				/** @type {TickContext} */
 				const ctx = {
 					inv_mass,
 					opts: spring,
@@ -127,7 +132,8 @@ export function spring(value, opts = {}) {
 			});
 		});
 	}
-	/** @type {Spring<T>} */
+	/** @type {SpringStore<T>} */
+	// @ts-expect-error - class-only properties are missing
 	const spring = {
 		set,
 		update: (fn, opts) => set(fn(/** @type {T} */ (target_value), /** @type {T} */ (value)), opts),
@@ -138,3 +144,205 @@ export function spring(value, opts = {}) {
 	};
 	return spring;
 }
+
+/**
+ * A wrapper for a value that behaves in a spring-like fashion. Changes to `spring.target` will cause `spring.current` to
+ * move towards it over time, taking account of the `spring.stiffness` and `spring.damping` parameters.
+ *
+ * ```svelte
+ * <script>
+ * 	import { Spring } from 'svelte/motion';
+ *
+ * 	const spring = new Spring(0);
+ * </script>
+ *
+ * <input type="range" bind:value={spring.target} />
+ * <input type="range" bind:value={spring.current} disabled />
+ * ```
+ * @template T
+ * @since 5.8.0
+ */
+export class Spring {
+	#stiffness = source(0.15);
+	#damping = source(0.8);
+	#precision = source(0.01);
+
+	#current = source(/** @type {T} */ (undefined));
+	#target = source(/** @type {T} */ (undefined));
+
+	#last_value = /** @type {T} */ (undefined);
+	#last_time = 0;
+
+	#inverse_mass = 1;
+	#momentum = 0;
+
+	/** @type {import('../internal/client/types').Task | null} */
+	#task = null;
+
+	/** @type {ReturnType<typeof deferred> | null} */
+	#deferred = null;
+
+	/**
+	 * @param {T} value
+	 * @param {SpringOpts} [options]
+	 */
+	constructor(value, options = {}) {
+		this.#current.v = this.#target.v = value;
+
+		if (typeof options.stiffness === 'number') this.#stiffness.v = clamp(options.stiffness, 0, 1);
+		if (typeof options.damping === 'number') this.#damping.v = clamp(options.damping, 0, 1);
+		if (typeof options.precision === 'number') this.#precision.v = options.precision;
+	}
+
+	/**
+	 * Create a spring whose value is bound to the return value of `fn`. This must be called
+	 * inside an effect root (for example, during component initialisation).
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { Spring } from 'svelte/motion';
+	 *
+	 * 	let { number } = $props();
+	 *
+	 * 	const spring = Spring.of(() => number);
+	 * </script>
+	 * ```
+	 * @template U
+	 * @param {() => U} fn
+	 * @param {SpringOpts} [options]
+	 */
+	static of(fn, options) {
+		const spring = new Spring(fn(), options);
+
+		render_effect(() => {
+			spring.set(fn());
+		});
+
+		return spring;
+	}
+
+	/** @param {T} value */
+	#update(value) {
+		set(this.#target, value);
+
+		this.#current.v ??= value;
+		this.#last_value ??= this.#current.v;
+
+		if (!this.#task) {
+			this.#last_time = raf.now();
+
+			var inv_mass_recovery_rate = 1000 / (this.#momentum * 60);
+
+			this.#task ??= loop((now) => {
+				this.#inverse_mass = Math.min(this.#inverse_mass + inv_mass_recovery_rate, 1);
+
+				/** @type {import('./private').TickContext} */
+				const ctx = {
+					inv_mass: this.#inverse_mass,
+					opts: {
+						stiffness: this.#stiffness.v,
+						damping: this.#damping.v,
+						precision: this.#precision.v
+					},
+					settled: true,
+					dt: ((now - this.#last_time) * 60) / 1000
+				};
+
+				var next = tick_spring(ctx, this.#last_value, this.#current.v, this.#target.v);
+				this.#last_value = this.#current.v;
+				this.#last_time = now;
+				set(this.#current, next);
+
+				if (ctx.settled) {
+					this.#task = null;
+				}
+
+				return !ctx.settled;
+			});
+		}
+
+		return this.#task.promise;
+	}
+
+	/**
+	 * Sets `spring.target` to `value` and returns a `Promise` that resolves if and when `spring.current` catches up to it.
+	 *
+	 * If `options.instant` is `true`, `spring.current` immediately matches `spring.target`.
+	 *
+	 * If `options.preserveMomentum` is provided, the spring will continue on its current trajectory for
+	 * the specified number of milliseconds. This is useful for things like 'fling' gestures.
+	 *
+	 * @param {T} value
+	 * @param {SpringUpdateOpts} [options]
+	 */
+	set(value, options) {
+		this.#deferred?.reject(new Error('Aborted'));
+
+		if (options?.instant || this.#current.v === undefined) {
+			this.#task?.abort();
+			this.#task = null;
+			set(this.#current, set(this.#target, value));
+			return Promise.resolve();
+		}
+
+		if (options?.preserveMomentum) {
+			this.#inverse_mass = 0;
+			this.#momentum = options.preserveMomentum;
+		}
+
+		var d = (this.#deferred = deferred());
+		d.promise.catch(noop);
+
+		this.#update(value).then(() => {
+			if (d !== this.#deferred) return;
+			d.resolve(undefined);
+		});
+
+		return d.promise;
+	}
+
+	get current() {
+		return get(this.#current);
+	}
+
+	get damping() {
+		return get(this.#damping);
+	}
+
+	set damping(v) {
+		set(this.#damping, clamp(v, 0, 1));
+	}
+
+	get precision() {
+		return get(this.#precision);
+	}
+
+	set precision(v) {
+		set(this.#precision, v);
+	}
+
+	get stiffness() {
+		return get(this.#stiffness);
+	}
+
+	set stiffness(v) {
+		set(this.#stiffness, clamp(v, 0, 1));
+	}
+
+	get target() {
+		return get(this.#target);
+	}
+
+	set target(v) {
+		this.set(v);
+	}
+}
+
+/**
+ * @param {number} n
+ * @param {number} min
+ * @param {number} max
+ */
+function clamp(n, min, max) {
+	return Math.max(min, Math.min(max, n));
+}
diff --git a/packages/svelte/src/motion/tweened.js b/packages/svelte/src/motion/tweened.js
index 8f689878f736..d732dbc2831a 100644
--- a/packages/svelte/src/motion/tweened.js
+++ b/packages/svelte/src/motion/tweened.js
@@ -6,6 +6,8 @@ import { raf } from '../internal/client/timing.js';
 import { loop } from '../internal/client/loop.js';
 import { linear } from '../easing/index.js';
 import { is_date } from './utils.js';
+import { set, source } from '../internal/client/reactivity/sources.js';
+import { get, render_effect } from 'svelte/internal/client';
 
 /**
  * @template T
@@ -76,6 +78,7 @@ function get_interpolator(a, b) {
 /**
  * A tweened store in Svelte is a special type of store that provides smooth transitions between state values over time.
  *
+ * @deprecated Use [`Tween`](https://svelte.dev/docs/svelte/svelte-motion#Tween) instead
  * @template T
  * @param {T} [value]
  * @param {TweenedOptions<T>} [defaults]
@@ -152,3 +155,137 @@ export function tweened(value, defaults = {}) {
 		subscribe: store.subscribe
 	};
 }
+
+/**
+ * A wrapper for a value that tweens smoothly to its target value. Changes to `tween.target` will cause `tween.current` to
+ * move towards it over time, taking account of the `delay`, `duration` and `easing` options.
+ *
+ * ```svelte
+ * <script>
+ * 	import { Tween } from 'svelte/motion';
+ *
+ * 	const tween = new Tween(0);
+ * </script>
+ *
+ * <input type="range" bind:value={tween.target} />
+ * <input type="range" bind:value={tween.current} disabled />
+ * ```
+ * @template T
+ * @since 5.8.0
+ */
+export class Tween {
+	#current = source(/** @type {T} */ (undefined));
+	#target = source(/** @type {T} */ (undefined));
+
+	/** @type {TweenedOptions<T>} */
+	#defaults;
+
+	/** @type {import('../internal/client/types').Task | null} */
+	#task = null;
+
+	/**
+	 * @param {T} value
+	 * @param {TweenedOptions<T>} options
+	 */
+	constructor(value, options = {}) {
+		this.#current.v = this.#target.v = value;
+		this.#defaults = options;
+	}
+
+	/**
+	 * Create a tween whose value is bound to the return value of `fn`. This must be called
+	 * inside an effect root (for example, during component initialisation).
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { Tween } from 'svelte/motion';
+	 *
+	 * 	let { number } = $props();
+	 *
+	 * 	const tween = Tween.of(() => number);
+	 * </script>
+	 * ```
+	 * @template U
+	 * @param {() => U} fn
+	 * @param {TweenedOptions<U>} [options]
+	 */
+	static of(fn, options) {
+		const tween = new Tween(fn(), options);
+
+		render_effect(() => {
+			tween.set(fn());
+		});
+
+		return tween;
+	}
+
+	/**
+	 * Sets `tween.target` to `value` and returns a `Promise` that resolves if and when `tween.current` catches up to it.
+	 *
+	 * If `options` are provided, they will override the tween's defaults.
+	 * @param {T} value
+	 * @param {TweenedOptions<T>} [options]
+	 * @returns
+	 */
+	set(value, options) {
+		set(this.#target, value);
+
+		let previous_value = this.#current.v;
+		let previous_task = this.#task;
+
+		let started = false;
+		let {
+			delay = 0,
+			duration = 400,
+			easing = linear,
+			interpolate = get_interpolator
+		} = { ...this.#defaults, ...options };
+
+		const start = raf.now() + delay;
+
+		/** @type {(t: number) => T} */
+		let fn;
+
+		this.#task = loop((now) => {
+			if (now < start) {
+				return true;
+			}
+
+			if (!started) {
+				started = true;
+
+				fn = interpolate(/** @type {any} */ (previous_value), value);
+
+				if (typeof duration === 'function') {
+					duration = duration(/** @type {any} */ (previous_value), value);
+				}
+
+				previous_task?.abort();
+			}
+
+			const elapsed = now - start;
+
+			if (elapsed > /** @type {number} */ (duration)) {
+				set(this.#current, value);
+				return false;
+			}
+
+			set(this.#current, fn(easing(elapsed / /** @type {number} */ (duration))));
+			return true;
+		});
+
+		return this.#task.promise;
+	}
+
+	get current() {
+		return get(this.#current);
+	}
+
+	get target() {
+		return get(this.#target);
+	}
+
+	set target(v) {
+		this.set(v);
+	}
+}
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index db6ac88c2c2a..f3f9580dc6dc 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1637,15 +1637,84 @@ declare module 'svelte/legacy' {
 }
 
 declare module 'svelte/motion' {
-	import type { MediaQuery } from 'svelte/reactivity';
+	// TODO we do declaration merging here in order to not have a breaking change (renaming the Spring interface)
+	// this means both the Spring class and the Spring interface are merged into one with some things only
+	// existing on one side. In Svelte 6, remove the type definition and move the jsdoc onto the class in spring.js
+
 	export interface Spring<T> extends Readable<T> {
-		set: (new_value: T, opts?: SpringUpdateOpts) => Promise<void>;
+		set(new_value: T, opts?: SpringUpdateOpts): Promise<void>;
+		/**
+		 * @deprecated Only exists on the legacy `spring` store, not the `Spring` class
+		 */
 		update: (fn: Updater<T>, opts?: SpringUpdateOpts) => Promise<void>;
+		/**
+		 * @deprecated Only exists on the legacy `spring` store, not the `Spring` class
+		 */
+		subscribe(fn: (value: T) => void): Unsubscriber;
 		precision: number;
 		damping: number;
 		stiffness: number;
 	}
 
+	/**
+	 * A wrapper for a value that behaves in a spring-like fashion. Changes to `spring.target` will cause `spring.current` to
+	 * move towards it over time, taking account of the `spring.stiffness` and `spring.damping` parameters.
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { Spring } from 'svelte/motion';
+	 *
+	 * 	const spring = new Spring(0);
+	 * </script>
+	 *
+	 * <input type="range" bind:value={spring.target} />
+	 * <input type="range" bind:value={spring.current} disabled />
+	 * ```
+	 */
+	export class Spring<T> {
+		constructor(value: T, options?: SpringOpts);
+
+		/**
+		 * Create a spring whose value is bound to the return value of `fn`. This must be called
+		 * inside an effect root (for example, during component initialisation).
+		 *
+		 * ```svelte
+		 * <script>
+		 * 	import { Spring } from 'svelte/motion';
+		 *
+		 * 	let { number } = $props();
+		 *
+		 * 	const spring = Spring.of(() => number);
+		 * </script>
+		 * ```
+		 */
+		static of<U>(fn: () => U, options?: SpringOpts): Spring<U>;
+
+		/**
+		 * Sets `spring.target` to `value` and returns a `Promise` that resolves if and when `spring.current` catches up to it.
+		 *
+		 * If `options.instant` is `true`, `spring.current` immediately matches `spring.target`.
+		 *
+		 * If `options.preserveMomentum` is provided, the spring will continue on its current trajectory for
+		 * the specified number of milliseconds. This is useful for things like 'fling' gestures.
+		 */
+		set(value: T, options?: SpringUpdateOpts): Promise<void>;
+
+		damping: number;
+		precision: number;
+		stiffness: number;
+		/**
+		 * The end value of the spring.
+		 * This property only exists on the `Spring` class, not the legacy `spring` store.
+		 */
+		target: T;
+		/**
+		 * The current value of the spring.
+		 * This property only exists on the `Spring` class, not the legacy `spring` store.
+		 */
+		get current(): T;
+	}
+
 	export interface Tweened<T> extends Readable<T> {
 		set(value: T, opts?: TweenedOptions<T>): Promise<void>;
 		update(updater: Updater<T>, opts?: TweenedOptions<T>): Promise<void>;
@@ -1672,8 +1741,22 @@ declare module 'svelte/motion' {
 	}
 
 	interface SpringUpdateOpts {
+		/**
+		 * @deprecated Only use this for the spring store; does nothing when set on the Spring class
+		 */
 		hard?: any;
+		/**
+		 * @deprecated Only use this for the spring store; does nothing when set on the Spring class
+		 */
 		soft?: string | number | boolean;
+		/**
+		 * Only use this for the Spring class; does nothing when set on the spring store
+		 */
+		instant?: boolean;
+		/**
+		 * Only use this for the Spring class; does nothing when set on the spring store
+		 */
+		preserveMomentum?: number;
 	}
 
 	type Updater<T> = (target_value: T, value: T) => T;
@@ -1684,40 +1767,64 @@ declare module 'svelte/motion' {
 		easing?: (t: number) => number;
 		interpolate?: (a: T, b: T) => (t: number) => T;
 	}
-	/**
-	 * A [media query](https://svelte.dev/docs/svelte/svelte-reactivity#MediaQuery) that matches if the user [prefers reduced motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion).
-	 *
-	 * ```svelte
-	 * <script>
-	 * 	import { prefersReducedMotion } from 'svelte/motion';
-	 * 	import { fly } from 'svelte/transition';
-	 *
-	 * 	let visible = $state(false);
-	 * </script>
-	 *
-	 * <button onclick={() => visible = !visible}>
-	 * 	toggle
-	 * </button>
-	 *
-	 * {#if visible}
-	 * 	<p transition:fly={{ y: prefersReducedMotion.current ? 0 : 200 }}>
-	 * 		flies in, unless the user prefers reduced motion
-	 * 	</p>
-	 * {/if}
-	 * ```
-	 * @since 5.7.0
-	 */
-	export const prefersReducedMotion: MediaQuery;
 	/**
 	 * The spring function in Svelte creates a store whose value is animated, with a motion that simulates the behavior of a spring. This means when the value changes, instead of transitioning at a steady rate, it "bounces" like a spring would, depending on the physics parameters provided. This adds a level of realism to the transitions and can enhance the user experience.
 	 *
+	 * @deprecated Use [`Spring`](https://svelte.dev/docs/svelte/svelte-motion#Spring) instead
 	 * */
 	export function spring<T = any>(value?: T | undefined, opts?: SpringOpts | undefined): Spring<T>;
 	/**
 	 * A tweened store in Svelte is a special type of store that provides smooth transitions between state values over time.
 	 *
+	 * @deprecated Use [`Tween`](https://svelte.dev/docs/svelte/svelte-motion#Tween) instead
 	 * */
 	export function tweened<T>(value?: T | undefined, defaults?: TweenedOptions<T> | undefined): Tweened<T>;
+	/**
+	 * A wrapper for a value that tweens smoothly to its target value. Changes to `tween.target` will cause `tween.current` to
+	 * move towards it over time, taking account of the `delay`, `duration` and `easing` options.
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { Tween } from 'svelte/motion';
+	 *
+	 * 	const tween = new Tween(0);
+	 * </script>
+	 *
+	 * <input type="range" bind:value={tween.target} />
+	 * <input type="range" bind:value={tween.current} disabled />
+	 * ```
+	 * @since 5.8.0
+	 */
+	export class Tween<T> {
+		/**
+		 * Create a tween whose value is bound to the return value of `fn`. This must be called
+		 * inside an effect root (for example, during component initialisation).
+		 *
+		 * ```svelte
+		 * <script>
+		 * 	import { Tween } from 'svelte/motion';
+		 *
+		 * 	let { number } = $props();
+		 *
+		 * 	const tween = Tween.of(() => number);
+		 * </script>
+		 * ```
+		 * 
+		 */
+		static of<U>(fn: () => U, options?: TweenedOptions<U> | undefined): Tween<U>;
+		
+		constructor(value: T, options?: TweenedOptions<T>);
+		/**
+		 * Sets `tween.target` to `value` and returns a `Promise` that resolves if and when `tween.current` catches up to it.
+		 *
+		 * If `options` are provided, they will override the tween's defaults.
+		 * */
+		set(value: T, options?: TweenedOptions<T> | undefined): Promise<void>;
+		get current(): T;
+		set target(v: T);
+		get target(): T;
+		#private;
+	}
 
 	export {};
 }

From 947d4adf3beaa6fa92deb347ad1273b58001133b Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Fri, 6 Dec 2024 09:16:48 -0500
Subject: [PATCH 09/62] Version Packages (#14583)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/tame-bottles-switch.md | 5 -----
 packages/svelte/CHANGELOG.md      | 6 ++++++
 packages/svelte/package.json      | 2 +-
 packages/svelte/src/version.js    | 2 +-
 4 files changed, 8 insertions(+), 7 deletions(-)
 delete mode 100644 .changeset/tame-bottles-switch.md

diff --git a/.changeset/tame-bottles-switch.md b/.changeset/tame-bottles-switch.md
deleted file mode 100644
index c597f5ea997c..000000000000
--- a/.changeset/tame-bottles-switch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add `Spring` and `Tween` classes to `svelte/motion`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index b19cfb355b1e..861347492478 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.8.0
+
+### Minor Changes
+
+- feat: add `Spring` and `Tween` classes to `svelte/motion` ([#11519](https://github.com/sveltejs/svelte/pull/11519))
+
 ## 5.7.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 6a01e01ecb86..97dedffbfc76 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.7.1",
+  "version": "5.8.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 331506a55a2f..f0574202b588 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.7.1';
+export const VERSION = '5.8.0';
 export const PUBLIC_VERSION = '5';

From 7086709767fabfe6a93e0a2463f66c3bd314072c Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 6 Dec 2024 09:59:36 -0500
Subject: [PATCH 10/62] add since tag to Spring (#14585)

---
 packages/svelte/src/motion/public.d.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/svelte/src/motion/public.d.ts b/packages/svelte/src/motion/public.d.ts
index 8fb9b9e66a1b..5a6a7e0fae4c 100644
--- a/packages/svelte/src/motion/public.d.ts
+++ b/packages/svelte/src/motion/public.d.ts
@@ -34,6 +34,7 @@ export interface Spring<T> extends Readable<T> {
  * <input type="range" bind:value={spring.target} />
  * <input type="range" bind:value={spring.current} disabled />
  * ```
+ * @since 5.8.0
  */
 export class Spring<T> {
 	constructor(value: T, options?: SpringOpts);

From 8433a7169b51b9b7e232d7cc4f875327ad8a2a78 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 6 Dec 2024 10:03:17 -0500
Subject: [PATCH 11/62] fix: reinstate `prefersReducedMotion` (#14586)

* reinstate prefersReducedMotion

* changeset
---
 .changeset/large-humans-report.md      |  5 +++++
 packages/svelte/src/motion/public.d.ts |  2 +-
 packages/svelte/types/index.d.ts       | 25 +++++++++++++++++++++++++
 3 files changed, 31 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/large-humans-report.md

diff --git a/.changeset/large-humans-report.md b/.changeset/large-humans-report.md
new file mode 100644
index 000000000000..6ba09ef148d9
--- /dev/null
+++ b/.changeset/large-humans-report.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: reinstate missing prefersReducedMotion export
diff --git a/packages/svelte/src/motion/public.d.ts b/packages/svelte/src/motion/public.d.ts
index 5a6a7e0fae4c..4e74d4b76f06 100644
--- a/packages/svelte/src/motion/public.d.ts
+++ b/packages/svelte/src/motion/public.d.ts
@@ -85,4 +85,4 @@ export interface Tweened<T> extends Readable<T> {
 	update(updater: Updater<T>, opts?: TweenedOptions<T>): Promise<void>;
 }
 
-export { spring, tweened, Tween } from './index.js';
+export { prefersReducedMotion, spring, tweened, Tween } from './index.js';
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index f3f9580dc6dc..f6b5b21f8085 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1637,6 +1637,7 @@ declare module 'svelte/legacy' {
 }
 
 declare module 'svelte/motion' {
+	import type { MediaQuery } from 'svelte/reactivity';
 	// TODO we do declaration merging here in order to not have a breaking change (renaming the Spring interface)
 	// this means both the Spring class and the Spring interface are merged into one with some things only
 	// existing on one side. In Svelte 6, remove the type definition and move the jsdoc onto the class in spring.js
@@ -1767,6 +1768,30 @@ declare module 'svelte/motion' {
 		easing?: (t: number) => number;
 		interpolate?: (a: T, b: T) => (t: number) => T;
 	}
+	/**
+	 * A [media query](https://svelte.dev/docs/svelte/svelte-reactivity#MediaQuery) that matches if the user [prefers reduced motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion).
+	 *
+	 * ```svelte
+	 * <script>
+	 * 	import { prefersReducedMotion } from 'svelte/motion';
+	 * 	import { fly } from 'svelte/transition';
+	 *
+	 * 	let visible = $state(false);
+	 * </script>
+	 *
+	 * <button onclick={() => visible = !visible}>
+	 * 	toggle
+	 * </button>
+	 *
+	 * {#if visible}
+	 * 	<p transition:fly={{ y: prefersReducedMotion.current ? 0 : 200 }}>
+	 * 		flies in, unless the user prefers reduced motion
+	 * 	</p>
+	 * {/if}
+	 * ```
+	 * @since 5.7.0
+	 */
+	export const prefersReducedMotion: MediaQuery;
 	/**
 	 * The spring function in Svelte creates a store whose value is animated, with a motion that simulates the behavior of a spring. This means when the value changes, instead of transitioning at a steady rate, it "bounces" like a spring would, depending on the physics parameters provided. This adds a level of realism to the transitions and can enhance the user experience.
 	 *

From ad87572adc4647915cc0250b376e5726552d1dda Mon Sep 17 00:00:00 2001
From: brunnerh <brunnerh@users.noreply.github.com>
Date: Fri, 6 Dec 2024 16:04:32 +0100
Subject: [PATCH 12/62] docs: Import .svelte.js files with explicit extension.
 (#14584)

---
 documentation/docs/06-runtime/01-stores.md  | 2 +-
 documentation/docs/06-runtime/02-context.md | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/06-runtime/01-stores.md b/documentation/docs/06-runtime/01-stores.md
index 9cff5a754f87..12d5576b407c 100644
--- a/documentation/docs/06-runtime/01-stores.md
+++ b/documentation/docs/06-runtime/01-stores.md
@@ -49,7 +49,7 @@ export const userState = $state({
 ```svelte
 <!--- file: App.svelte --->
 <script>
-	import { userState } from './state.svelte';
+	import { userState } from './state.svelte.js';
 </script>
 
 <p>User name: {userState.name}</p>
diff --git a/documentation/docs/06-runtime/02-context.md b/documentation/docs/06-runtime/02-context.md
index 62dd0c6a9e7b..30799215b6eb 100644
--- a/documentation/docs/06-runtime/02-context.md
+++ b/documentation/docs/06-runtime/02-context.md
@@ -22,7 +22,7 @@ export const myGlobalState = $state({
 ```svelte
 <!--- file: App.svelte --->
 <script>
-	import { myGlobalState } from './state.svelte';
+	import { myGlobalState } from './state.svelte.js';
 	// ...
 </script>
 ```

From 65fdcec55df996f06bf5cc162a1e16e9ed35cddf Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 6 Dec 2024 15:33:07 -0500
Subject: [PATCH 13/62] chore: regenerate types (#14592)

---
 packages/svelte/types/index.d.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index f6b5b21f8085..0d761919a8e0 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1671,6 +1671,7 @@ declare module 'svelte/motion' {
 	 * <input type="range" bind:value={spring.target} />
 	 * <input type="range" bind:value={spring.current} disabled />
 	 * ```
+	 * @since 5.8.0
 	 */
 	export class Spring<T> {
 		constructor(value: T, options?: SpringOpts);

From 98286349b23e88be77533df577bc8998bc15cc46 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Fri, 6 Dec 2024 15:40:52 -0500
Subject: [PATCH 14/62] Version Packages (#14593)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/large-humans-report.md | 5 -----
 packages/svelte/CHANGELOG.md      | 6 ++++++
 packages/svelte/package.json      | 2 +-
 packages/svelte/src/version.js    | 2 +-
 4 files changed, 8 insertions(+), 7 deletions(-)
 delete mode 100644 .changeset/large-humans-report.md

diff --git a/.changeset/large-humans-report.md b/.changeset/large-humans-report.md
deleted file mode 100644
index 6ba09ef148d9..000000000000
--- a/.changeset/large-humans-report.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: reinstate missing prefersReducedMotion export
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 861347492478..4031110fa799 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.8.1
+
+### Patch Changes
+
+- fix: reinstate missing prefersReducedMotion export ([#14586](https://github.com/sveltejs/svelte/pull/14586))
+
 ## 5.8.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 97dedffbfc76..c751a598db53 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.8.0",
+  "version": "5.8.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index f0574202b588..3061318cb034 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.8.0';
+export const VERSION = '5.8.1';
 export const PUBLIC_VERSION = '5';

From 08e2cf25b03707f4ca6e44a1e6ca0480190c14a1 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 6 Dec 2024 16:08:58 -0500
Subject: [PATCH 15/62] chore: fix sandbox (#14596)

---
 playgrounds/sandbox/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/playgrounds/sandbox/package.json b/playgrounds/sandbox/package.json
index 944e79621e0d..654a517c9fb6 100644
--- a/playgrounds/sandbox/package.json
+++ b/playgrounds/sandbox/package.json
@@ -6,7 +6,7 @@
   "scripts": {
     "prepare": "node scripts/create-app-svelte.js",
     "dev": "vite --host",
-    "ssr": "node ./ssr-dev.js",
+    "ssr": "node --conditions=development ./ssr-dev.js",
     "build": "vite build --outDir dist/client && vite build --outDir dist/server --ssr ssr-prod.js",
     "prod": "npm run build && node dist/server/ssr-prod",
     "preview": "vite preview"

From 1a0b822f4826b82454962a94c072519530b7c126 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 6 Dec 2024 17:41:41 -0500
Subject: [PATCH 16/62] fix: always run `if` block code the first time (#14597)

* fix: always run `if` block code the first time

* fix
---
 .changeset/rare-cheetahs-laugh.md                 |  5 +++++
 .../svelte/src/internal/client/dom/blocks/if.js   |  8 ++++----
 .../samples/if-block-mismatch-2/_config.js        | 15 +++++++++++++++
 .../samples/if-block-mismatch-2/_expected.html    |  1 +
 .../samples/if-block-mismatch-2/main.svelte       | 13 +++++++++++++
 .../samples/if-block-mismatch/_expected.html      |  1 +
 .../samples/if-block-mismatch/main.svelte         |  2 +-
 7 files changed, 40 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/rare-cheetahs-laugh.md
 create mode 100644 packages/svelte/tests/hydration/samples/if-block-mismatch-2/_config.js
 create mode 100644 packages/svelte/tests/hydration/samples/if-block-mismatch-2/_expected.html
 create mode 100644 packages/svelte/tests/hydration/samples/if-block-mismatch-2/main.svelte
 create mode 100644 packages/svelte/tests/hydration/samples/if-block-mismatch/_expected.html

diff --git a/.changeset/rare-cheetahs-laugh.md b/.changeset/rare-cheetahs-laugh.md
new file mode 100644
index 000000000000..2637b50b3c38
--- /dev/null
+++ b/.changeset/rare-cheetahs-laugh.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: always run `if` block code the first time
diff --git a/packages/svelte/src/internal/client/dom/blocks/if.js b/packages/svelte/src/internal/client/dom/blocks/if.js
index 6a880f28bc98..36790c05c135 100644
--- a/packages/svelte/src/internal/client/dom/blocks/if.js
+++ b/packages/svelte/src/internal/client/dom/blocks/if.js
@@ -9,7 +9,7 @@ import {
 	set_hydrating
 } from '../hydration.js';
 import { block, branch, pause_effect, resume_effect } from '../../reactivity/effects.js';
-import { HYDRATION_START_ELSE } from '../../../../constants.js';
+import { HYDRATION_START_ELSE, UNINITIALIZED } from '../../../../constants.js';
 
 /**
  * @param {TemplateNode} node
@@ -30,8 +30,8 @@ export function if_block(node, fn, elseif = false) {
 	/** @type {Effect | null} */
 	var alternate_effect = null;
 
-	/** @type {boolean | null} */
-	var condition = null;
+	/** @type {UNINITIALIZED | boolean | null} */
+	var condition = UNINITIALIZED;
 
 	var flags = elseif ? EFFECT_TRANSPARENT : 0;
 
@@ -54,7 +54,7 @@ export function if_block(node, fn, elseif = false) {
 		if (hydrating) {
 			const is_else = /** @type {Comment} */ (anchor).data === HYDRATION_START_ELSE;
 
-			if (condition === is_else) {
+			if (!!condition === is_else) {
 				// Hydration mismatch: remove everything inside the anchor and start fresh.
 				// This could happen with `{#if browser}...{/if}`, for example
 				anchor = remove_nodes();
diff --git a/packages/svelte/tests/hydration/samples/if-block-mismatch-2/_config.js b/packages/svelte/tests/hydration/samples/if-block-mismatch-2/_config.js
new file mode 100644
index 000000000000..ffde9ee303b5
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/if-block-mismatch-2/_config.js
@@ -0,0 +1,15 @@
+import { test } from '../../test';
+
+// even {#if true} or {#if false} should be kept as an if block, because it could be {#if browser} originally,
+// which is then different between client and server.
+export default test({
+	server_props: {
+		condition: true
+	},
+
+	props: {
+		condition: false
+	},
+
+	trim_whitespace: false
+});
diff --git a/packages/svelte/tests/hydration/samples/if-block-mismatch-2/_expected.html b/packages/svelte/tests/hydration/samples/if-block-mismatch-2/_expected.html
new file mode 100644
index 000000000000..08a3809de9cc
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/if-block-mismatch-2/_expected.html
@@ -0,0 +1 @@
+<!--[--><!--[--><!--]--> <div><!----><!----></div> hello<!--]-->
diff --git a/packages/svelte/tests/hydration/samples/if-block-mismatch-2/main.svelte b/packages/svelte/tests/hydration/samples/if-block-mismatch-2/main.svelte
new file mode 100644
index 000000000000..3136406698b3
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/if-block-mismatch-2/main.svelte
@@ -0,0 +1,13 @@
+<script>
+	let { condition } = $props();
+</script>
+
+{#if condition}
+	<slot />
+{/if}
+
+<div>
+	<slot />
+</div>
+
+hello
diff --git a/packages/svelte/tests/hydration/samples/if-block-mismatch/_expected.html b/packages/svelte/tests/hydration/samples/if-block-mismatch/_expected.html
new file mode 100644
index 000000000000..79cf2cf35f0f
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/if-block-mismatch/_expected.html
@@ -0,0 +1 @@
+<!--[--><!--[!--><p>foo</p><!--]--><!--]-->
diff --git a/packages/svelte/tests/hydration/samples/if-block-mismatch/main.svelte b/packages/svelte/tests/hydration/samples/if-block-mismatch/main.svelte
index c6799c5f95fc..552c43410162 100644
--- a/packages/svelte/tests/hydration/samples/if-block-mismatch/main.svelte
+++ b/packages/svelte/tests/hydration/samples/if-block-mismatch/main.svelte
@@ -2,7 +2,7 @@
 	let { condition } = $props();
 </script>
 
-{#if true}
+{#if condition}
 	<p>foo</p>
 {:else}
 	<p>bar</p>

From 5771b455c0caf860bb063499feb2100acad4fbd5 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Sun, 8 Dec 2024 12:28:37 +0000
Subject: [PATCH 17/62] feat: add support for bind getter/setters (#14307)

* feat: add support for bind getters/setters

* different direction

* oops

* oops

* build

* add changeset and tests

* move validation

* add comment

* build

* bind:group error

* simpler to just keep it as a SequenceExpression

* fix

* lint

* fix

* move validation to visitor

* fix

* no longer needed

* fix

* parser changes are no longer needed

* simplify

* simplify

* update messages

* docs

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/slimy-donkeys-hang.md              |   5 +
 .../docs/03-template-syntax/11-bind.md        |  24 ++
 .../98-reference/.generated/compile-errors.md |  14 +-
 .../messages/compile-errors/template.md       |  10 +-
 packages/svelte/src/compiler/errors.js        |  23 +-
 .../2-analyze/visitors/BindDirective.js       | 214 ++++++++++--------
 .../client/visitors/BindDirective.js          |  74 +++---
 .../client/visitors/RegularElement.js         |  10 +-
 .../client/visitors/shared/component.js       | 113 +++++----
 .../client/visitors/shared/utils.js           |  12 +-
 .../server/visitors/shared/component.js       |  52 +++--
 .../server/visitors/shared/element.js         |  18 +-
 .../src/compiler/types/legacy-nodes.d.ts      |   5 +-
 .../svelte/src/compiler/types/template.d.ts   |   5 +-
 .../samples/bind-getter-setter-2/Child.svelte |  11 +
 .../samples/bind-getter-setter-2/_config.js   |   9 +
 .../samples/bind-getter-setter-2/main.svelte  |  11 +
 .../samples/bind-getter-setter/Child.svelte   |  12 +
 .../samples/bind-getter-setter/_config.js     |  20 ++
 .../samples/bind-getter-setter/main.svelte    |  16 ++
 .../bind_group_invalid_expression/errors.json |  14 ++
 .../input.svelte                              |  12 +
 packages/svelte/types/index.d.ts              |   4 +-
 23 files changed, 471 insertions(+), 217 deletions(-)
 create mode 100644 .changeset/slimy-donkeys-hang.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-getter-setter/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte
 create mode 100644 packages/svelte/tests/validator/samples/bind_group_invalid_expression/errors.json
 create mode 100644 packages/svelte/tests/validator/samples/bind_group_invalid_expression/input.svelte

diff --git a/.changeset/slimy-donkeys-hang.md b/.changeset/slimy-donkeys-hang.md
new file mode 100644
index 000000000000..d63141660eed
--- /dev/null
+++ b/.changeset/slimy-donkeys-hang.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+feat: add support for bind getters/setters
diff --git a/documentation/docs/03-template-syntax/11-bind.md b/documentation/docs/03-template-syntax/11-bind.md
index fe3cf727e285..90046c8c456d 100644
--- a/documentation/docs/03-template-syntax/11-bind.md
+++ b/documentation/docs/03-template-syntax/11-bind.md
@@ -12,10 +12,34 @@ The general syntax is `bind:property={expression}`, where `expression` is an _lv
 <input bind:value />
 ```
 
+
 Svelte creates an event listener that updates the bound value. If an element already has a listener for the same event, that listener will be fired before the bound value is updated.
 
 Most bindings are _two-way_, meaning that changes to the value will affect the element and vice versa. A few bindings are _readonly_, meaning that changing their value will have no effect on the element.
 
+## Function bindings
+
+You can also use `bind:property={get, set}`, where `get` and `set` are functions, allowing you to perform validation and transformation:
+
+```svelte
+<input bind:value={
+	() => value,
+	(v) => value = v.toLowerCase()}
+/>
+```
+
+In the case of readonly bindings like [dimension bindings](#Dimensions), the `get` value should be `null`:
+
+```svelte
+<div
+	bind:clientWidth={null, redraw}
+	bind:clientHeight={null, redraw}
+>...</div>
+```
+
+> [!NOTE]
+> Function bindings are available in Svelte 5.9.0 and newer.
+
 ## `<input bind:value>`
 
 A `bind:value` directive on an `<input>` element binds the input's `value` property:
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index 3bd162d8d74d..d726d25fa188 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -78,10 +78,16 @@ Sequence expressions are not allowed as attribute/directive values in runes mode
 Attribute values containing `{...}` must be enclosed in quote marks, unless the value only contains the expression
 ```
 
+### bind_group_invalid_expression
+
+```
+`bind:group` can only bind to an Identifier or MemberExpression
+```
+
 ### bind_invalid_expression
 
 ```
-Can only bind to an Identifier or MemberExpression
+Can only bind to an Identifier or MemberExpression or a `{get, set}` pair
 ```
 
 ### bind_invalid_name
@@ -94,6 +100,12 @@ Can only bind to an Identifier or MemberExpression
 `bind:%name%` is not a valid binding. %explanation%
 ```
 
+### bind_invalid_parens
+
+```
+`bind:%name%={get, set}` must not have surrounding parentheses
+```
+
 ### bind_invalid_target
 
 ```
diff --git a/packages/svelte/messages/compile-errors/template.md b/packages/svelte/messages/compile-errors/template.md
index 9621a6457ba9..02961b61fccc 100644
--- a/packages/svelte/messages/compile-errors/template.md
+++ b/packages/svelte/messages/compile-errors/template.md
@@ -50,9 +50,13 @@
 
 > Attribute values containing `{...}` must be enclosed in quote marks, unless the value only contains the expression
 
+## bind_group_invalid_expression
+
+> `bind:group` can only bind to an Identifier or MemberExpression
+
 ## bind_invalid_expression
 
-> Can only bind to an Identifier or MemberExpression
+> Can only bind to an Identifier or MemberExpression or a `{get, set}` pair
 
 ## bind_invalid_name
 
@@ -60,6 +64,10 @@
 
 > `bind:%name%` is not a valid binding. %explanation%
 
+## bind_invalid_parens
+
+> `bind:%name%={get, set}` must not have surrounding parentheses
+
 ## bind_invalid_target
 
 > `bind:%name%` can only be used with %elements%
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index 901ea1983ea7..1a4525ef5cb9 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -716,12 +716,21 @@ export function attribute_unquoted_sequence(node) {
 }
 
 /**
- * Can only bind to an Identifier or MemberExpression
+ * `bind:group` can only bind to an Identifier or MemberExpression
+ * @param {null | number | NodeLike} node
+ * @returns {never}
+ */
+export function bind_group_invalid_expression(node) {
+	e(node, "bind_group_invalid_expression", "`bind:group` can only bind to an Identifier or MemberExpression");
+}
+
+/**
+ * Can only bind to an Identifier or MemberExpression or a `{get, set}` pair
  * @param {null | number | NodeLike} node
  * @returns {never}
  */
 export function bind_invalid_expression(node) {
-	e(node, "bind_invalid_expression", "Can only bind to an Identifier or MemberExpression");
+	e(node, "bind_invalid_expression", "Can only bind to an Identifier or MemberExpression or a `{get, set}` pair");
 }
 
 /**
@@ -735,6 +744,16 @@ export function bind_invalid_name(node, name, explanation) {
 	e(node, "bind_invalid_name", explanation ? `\`bind:${name}\` is not a valid binding. ${explanation}` : `\`bind:${name}\` is not a valid binding`);
 }
 
+/**
+ * `bind:%name%={get, set}` must not have surrounding parentheses
+ * @param {null | number | NodeLike} node
+ * @param {string} name
+ * @returns {never}
+ */
+export function bind_invalid_parens(node, name) {
+	e(node, "bind_invalid_parens", `\`bind:${name}={get, set}\` must not have surrounding parentheses`);
+}
+
 /**
  * `bind:%name%` can only be used with %elements%
  * @param {null | number | NodeLike} node
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js
index 5b56d9ddac38..b06236538008 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js
@@ -17,102 +17,6 @@ import { is_content_editable_binding, is_svg } from '../../../../utils.js';
  * @param {Context} context
  */
 export function BindDirective(node, context) {
-	validate_no_const_assignment(node, node.expression, context.state.scope, true);
-
-	const assignee = node.expression;
-	const left = object(assignee);
-
-	if (left === null) {
-		e.bind_invalid_expression(node);
-	}
-
-	const binding = context.state.scope.get(left.name);
-
-	if (assignee.type === 'Identifier') {
-		// reassignment
-		if (
-			node.name !== 'this' && // bind:this also works for regular variables
-			(!binding ||
-				(binding.kind !== 'state' &&
-					binding.kind !== 'raw_state' &&
-					binding.kind !== 'prop' &&
-					binding.kind !== 'bindable_prop' &&
-					binding.kind !== 'each' &&
-					binding.kind !== 'store_sub' &&
-					!binding.updated)) // TODO wut?
-		) {
-			e.bind_invalid_value(node.expression);
-		}
-
-		if (context.state.analysis.runes && binding?.kind === 'each') {
-			e.each_item_invalid_assignment(node);
-		}
-
-		if (binding?.kind === 'snippet') {
-			e.snippet_parameter_assignment(node);
-		}
-	}
-
-	if (node.name === 'group') {
-		if (!binding) {
-			throw new Error('Cannot find declaration for bind:group');
-		}
-
-		// Traverse the path upwards and find all EachBlocks who are (indirectly) contributing to bind:group,
-		// i.e. one of their declarations is referenced in the binding. This allows group bindings to work
-		// correctly when referencing a variable declared in an EachBlock by using the index of the each block
-		// entries as keys.
-		const each_blocks = [];
-		const [keypath, expression_ids] = extract_all_identifiers_from_expression(node.expression);
-		let ids = expression_ids;
-
-		let i = context.path.length;
-		while (i--) {
-			const parent = context.path[i];
-
-			if (parent.type === 'EachBlock') {
-				const references = ids.filter((id) => parent.metadata.declarations.has(id.name));
-
-				if (references.length > 0) {
-					parent.metadata.contains_group_binding = true;
-
-					each_blocks.push(parent);
-					ids = ids.filter((id) => !references.includes(id));
-					ids.push(...extract_all_identifiers_from_expression(parent.expression)[1]);
-				}
-			}
-		}
-
-		// The identifiers that make up the binding expression form they key for the binding group.
-		// If the same identifiers in the same order are used in another bind:group, they will be in the same group.
-		// (there's an edge case where `bind:group={a[i]}` will be in a different group than `bind:group={a[j]}` even when i == j,
-		//  but this is a limitation of the current static analysis we do; it also never worked in Svelte 4)
-		const bindings = expression_ids.map((id) => context.state.scope.get(id.name));
-		let group_name;
-
-		outer: for (const [[key, b], group] of context.state.analysis.binding_groups) {
-			if (b.length !== bindings.length || key !== keypath) continue;
-			for (let i = 0; i < bindings.length; i++) {
-				if (bindings[i] !== b[i]) continue outer;
-			}
-			group_name = group;
-		}
-
-		if (!group_name) {
-			group_name = context.state.scope.root.unique('binding_group');
-			context.state.analysis.binding_groups.set([keypath, bindings], group_name);
-		}
-
-		node.metadata = {
-			binding_group_name: group_name,
-			parent_each_blocks: each_blocks
-		};
-	}
-
-	if (binding?.kind === 'each' && binding.metadata?.inside_rest) {
-		w.bind_invalid_each_rest(binding.node, binding.node.name);
-	}
-
 	const parent = context.path.at(-1);
 
 	if (
@@ -218,5 +122,123 @@ export function BindDirective(node, context) {
 		}
 	}
 
+	// When dealing with bind getters/setters skip the specific binding validation
+	// Group bindings aren't supported for getter/setters so we don't need to handle
+	// the metadata
+	if (node.expression.type === 'SequenceExpression') {
+		if (node.name === 'group') {
+			e.bind_group_invalid_expression(node);
+		}
+
+		let i = /** @type {number} */ (node.expression.start);
+		while (context.state.analysis.source[--i] !== '{') {
+			if (context.state.analysis.source[i] === '(') {
+				e.bind_invalid_parens(node, node.name);
+			}
+		}
+
+		if (node.expression.expressions.length !== 2) {
+			e.bind_invalid_expression(node);
+		}
+
+		return;
+	}
+
+	validate_no_const_assignment(node, node.expression, context.state.scope, true);
+
+	const assignee = node.expression;
+	const left = object(assignee);
+
+	if (left === null) {
+		e.bind_invalid_expression(node);
+	}
+
+	const binding = context.state.scope.get(left.name);
+
+	if (assignee.type === 'Identifier') {
+		// reassignment
+		if (
+			node.name !== 'this' && // bind:this also works for regular variables
+			(!binding ||
+				(binding.kind !== 'state' &&
+					binding.kind !== 'raw_state' &&
+					binding.kind !== 'prop' &&
+					binding.kind !== 'bindable_prop' &&
+					binding.kind !== 'each' &&
+					binding.kind !== 'store_sub' &&
+					!binding.updated)) // TODO wut?
+		) {
+			e.bind_invalid_value(node.expression);
+		}
+
+		if (context.state.analysis.runes && binding?.kind === 'each') {
+			e.each_item_invalid_assignment(node);
+		}
+
+		if (binding?.kind === 'snippet') {
+			e.snippet_parameter_assignment(node);
+		}
+	}
+
+	if (node.name === 'group') {
+		if (!binding) {
+			throw new Error('Cannot find declaration for bind:group');
+		}
+
+		// Traverse the path upwards and find all EachBlocks who are (indirectly) contributing to bind:group,
+		// i.e. one of their declarations is referenced in the binding. This allows group bindings to work
+		// correctly when referencing a variable declared in an EachBlock by using the index of the each block
+		// entries as keys.
+		const each_blocks = [];
+		const [keypath, expression_ids] = extract_all_identifiers_from_expression(node.expression);
+		let ids = expression_ids;
+
+		let i = context.path.length;
+		while (i--) {
+			const parent = context.path[i];
+
+			if (parent.type === 'EachBlock') {
+				const references = ids.filter((id) => parent.metadata.declarations.has(id.name));
+
+				if (references.length > 0) {
+					parent.metadata.contains_group_binding = true;
+
+					each_blocks.push(parent);
+					ids = ids.filter((id) => !references.includes(id));
+					ids.push(...extract_all_identifiers_from_expression(parent.expression)[1]);
+				}
+			}
+		}
+
+		// The identifiers that make up the binding expression form they key for the binding group.
+		// If the same identifiers in the same order are used in another bind:group, they will be in the same group.
+		// (there's an edge case where `bind:group={a[i]}` will be in a different group than `bind:group={a[j]}` even when i == j,
+		//  but this is a limitation of the current static analysis we do; it also never worked in Svelte 4)
+		const bindings = expression_ids.map((id) => context.state.scope.get(id.name));
+		let group_name;
+
+		outer: for (const [[key, b], group] of context.state.analysis.binding_groups) {
+			if (b.length !== bindings.length || key !== keypath) continue;
+			for (let i = 0; i < bindings.length; i++) {
+				if (bindings[i] !== b[i]) continue outer;
+			}
+			group_name = group;
+		}
+
+		if (!group_name) {
+			group_name = context.state.scope.root.unique('binding_group');
+			context.state.analysis.binding_groups.set([keypath, bindings], group_name);
+		}
+
+		node.metadata = {
+			binding_group_name: group_name,
+			parent_each_blocks: each_blocks
+		};
+	}
+
+	if (binding?.kind === 'each' && binding.metadata?.inside_rest) {
+		w.bind_invalid_each_rest(binding.node, binding.node.name);
+	}
+
 	context.next();
 }
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js
index 79969240c771..f129e059f2a7 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js
@@ -1,4 +1,4 @@
-/** @import { CallExpression, Expression, MemberExpression } from 'estree' */
+/** @import { CallExpression, Expression, MemberExpression, Pattern } from 'estree' */
 /** @import { AST, SvelteNode } from '#compiler' */
 /** @import { ComponentContext } from '../types' */
 import { dev, is_ignored } from '../../../../state.js';
@@ -13,41 +13,50 @@ import { build_bind_this, validate_binding } from './shared/utils.js';
  * @param {ComponentContext} context
  */
 export function BindDirective(node, context) {
-	const expression = node.expression;
+	const expression = /** @type {Expression} */ (context.visit(node.expression));
 	const property = binding_properties[node.name];
 
 	const parent = /** @type {SvelteNode} */ (context.path.at(-1));
 
-	if (
-		dev &&
-		context.state.analysis.runes &&
-		expression.type === 'MemberExpression' &&
-		(node.name !== 'this' ||
-			context.path.some(
-				({ type }) =>
-					type === 'IfBlock' || type === 'EachBlock' || type === 'AwaitBlock' || type === 'KeyBlock'
-			)) &&
-		!is_ignored(node, 'binding_property_non_reactive')
-	) {
-		validate_binding(
-			context.state,
-			node,
-			/**@type {MemberExpression} */ (context.visit(expression))
-		);
-	}
+	let get, set;
 
-	const get = b.thunk(/** @type {Expression} */ (context.visit(expression)));
+	if (expression.type === 'SequenceExpression') {
+		[get, set] = expression.expressions;
+	} else {
+		if (
+			dev &&
+			context.state.analysis.runes &&
+			expression.type === 'MemberExpression' &&
+			(node.name !== 'this' ||
+				context.path.some(
+					({ type }) =>
+						type === 'IfBlock' ||
+						type === 'EachBlock' ||
+						type === 'AwaitBlock' ||
+						type === 'KeyBlock'
+				)) &&
+			!is_ignored(node, 'binding_property_non_reactive')
+		) {
+			validate_binding(context.state, node, expression);
+		}
 
-	/** @type {Expression | undefined} */
-	let set = b.unthunk(
-		b.arrow(
-			[b.id('$$value')],
-			/** @type {Expression} */ (context.visit(b.assignment('=', expression, b.id('$$value'))))
-		)
-	);
+		get = b.thunk(expression);
 
-	if (get === set) {
-		set = undefined;
+		/** @type {Expression | undefined} */
+		set = b.unthunk(
+			b.arrow(
+				[b.id('$$value')],
+				/** @type {Expression} */ (
+					context.visit(
+						b.assignment('=', /** @type {Pattern} */ (node.expression), b.id('$$value'))
+					)
+				)
+			)
+		);
+
+		if (get === set) {
+			set = undefined;
+		}
 	}
 
 	/** @type {CallExpression} */
@@ -162,7 +171,7 @@ export function BindDirective(node, context) {
 				break;
 
 			case 'this':
-				call = build_bind_this(expression, context.state.node, context);
+				call = build_bind_this(node.expression, context.state.node, context);
 				break;
 
 			case 'textContent':
@@ -213,10 +222,7 @@ export function BindDirective(node, context) {
 
 					if (value !== undefined) {
 						group_getter = b.thunk(
-							b.block([
-								b.stmt(build_attribute_value(value, context).value),
-								b.return(/** @type {Expression} */ (context.visit(expression)))
-							])
+							b.block([b.stmt(build_attribute_value(value, context).value), b.return(expression)])
 						);
 					}
 				}
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js
index 3c0be589c363..2c2c287f1275 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js
@@ -450,6 +450,11 @@ function setup_select_synchronization(value_binding, context) {
 	if (context.state.analysis.runes) return;
 
 	let bound = value_binding.expression;
+
+	if (bound.type === 'SequenceExpression') {
+		return;
+	}
+
 	while (bound.type === 'MemberExpression') {
 		bound = /** @type {Identifier | MemberExpression} */ (bound.object);
 	}
@@ -484,10 +489,7 @@ function setup_select_synchronization(value_binding, context) {
 			b.call(
 				'$.template_effect',
 				b.thunk(
-					b.block([
-						b.stmt(/** @type {Expression} */ (context.visit(value_binding.expression))),
-						b.stmt(invalidator)
-					])
+					b.block([b.stmt(/** @type {Expression} */ (context.visit(bound))), b.stmt(invalidator)])
 				)
 			)
 		)
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
index aa7be93cb57e..c94c1e1b0ec8 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
@@ -1,4 +1,4 @@
-/** @import { BlockStatement, Expression, ExpressionStatement, Identifier, MemberExpression, Property, Statement } from 'estree' */
+/** @import { BlockStatement, Expression, ExpressionStatement, Identifier, MemberExpression, Pattern, Property, SequenceExpression, Statement } from 'estree' */
 /** @import { AST, TemplateNode } from '#compiler' */
 /** @import { ComponentContext } from '../../types.js' */
 import { dev, is_ignored } from '../../../../../state.js';
@@ -44,7 +44,7 @@ export function build_component(node, component_name, context, anchor = context.
 	/** @type {Property[]} */
 	const custom_css_props = [];
 
-	/** @type {Identifier | MemberExpression | null} */
+	/** @type {Identifier | MemberExpression | SequenceExpression | null} */
 	let bind_this = null;
 
 	/** @type {ExpressionStatement[]} */
@@ -174,60 +174,83 @@ export function build_component(node, component_name, context, anchor = context.
 		} else if (attribute.type === 'BindDirective') {
 			const expression = /** @type {Expression} */ (context.visit(attribute.expression));
 
-			if (
-				dev &&
-				expression.type === 'MemberExpression' &&
-				context.state.analysis.runes &&
-				!is_ignored(node, 'binding_property_non_reactive')
-			) {
-				validate_binding(context.state, attribute, expression);
+			if (dev && attribute.name !== 'this' && attribute.expression.type !== 'SequenceExpression') {
+				const left = object(attribute.expression);
+				let binding;
+
+				if (left?.type === 'Identifier') {
+					binding = context.state.scope.get(left.name);
+				}
+
+				// Only run ownership addition on $state fields.
+				// Theoretically someone could create a `$state` while creating `$state.raw` or inside a `$derived.by`,
+				// but that feels so much of an edge case that it doesn't warrant a perf hit for the common case.
+				if (binding?.kind !== 'derived' && binding?.kind !== 'raw_state') {
+					binding_initializers.push(
+						b.stmt(
+							b.call(
+								b.id('$.add_owner_effect'),
+								b.thunk(expression),
+								b.id(component_name),
+								is_ignored(node, 'ownership_invalid_binding') && b.true
+							)
+						)
+					);
+				}
 			}
 
-			if (attribute.name === 'this') {
-				bind_this = attribute.expression;
+			if (expression.type === 'SequenceExpression') {
+				if (attribute.name === 'this') {
+					bind_this = attribute.expression;
+				} else {
+					const [get, set] = expression.expressions;
+					const get_id = b.id(context.state.scope.generate('bind_get'));
+					const set_id = b.id(context.state.scope.generate('bind_set'));
+
+					context.state.init.push(b.var(get_id, get));
+					context.state.init.push(b.var(set_id, set));
+
+					push_prop(b.get(attribute.name, [b.return(b.call(get_id))]));
+					push_prop(b.set(attribute.name, [b.stmt(b.call(set_id, b.id('$$value')))]));
+				}
 			} else {
-				if (dev) {
-					const left = object(attribute.expression);
-					let binding;
-					if (left?.type === 'Identifier') {
-						binding = context.state.scope.get(left.name);
-					}
-					// Only run ownership addition on $state fields.
-					// Theoretically someone could create a `$state` while creating `$state.raw` or inside a `$derived.by`,
-					// but that feels so much of an edge case that it doesn't warrant a perf hit for the common case.
-					if (binding?.kind !== 'derived' && binding?.kind !== 'raw_state') {
-						binding_initializers.push(
-							b.stmt(
-								b.call(
-									b.id('$.add_owner_effect'),
-									b.thunk(expression),
-									b.id(component_name),
-									is_ignored(node, 'ownership_invalid_binding') && b.true
-								)
-							)
+				if (
+					dev &&
+					expression.type === 'MemberExpression' &&
+					context.state.analysis.runes &&
+					!is_ignored(node, 'binding_property_non_reactive')
+				) {
+					validate_binding(context.state, attribute, expression);
+				}
+
+				if (attribute.name === 'this') {
+					bind_this = attribute.expression;
+				} else {
+					const is_store_sub =
+						attribute.expression.type === 'Identifier' &&
+						context.state.scope.get(attribute.expression.name)?.kind === 'store_sub';
+
+					// Delay prop pushes so bindings come at the end, to avoid spreads overwriting them
+					if (is_store_sub) {
+						push_prop(
+							b.get(attribute.name, [b.stmt(b.call('$.mark_store_binding')), b.return(expression)]),
+							true
 						);
+					} else {
+						push_prop(b.get(attribute.name, [b.return(expression)]), true);
 					}
-				}
 
-				const is_store_sub =
-					attribute.expression.type === 'Identifier' &&
-					context.state.scope.get(attribute.expression.name)?.kind === 'store_sub';
+					const assignment = b.assignment(
+						'=',
+						/** @type {Pattern} */ (attribute.expression),
+						b.id('$$value')
+					);
 
-				// Delay prop pushes so bindings come at the end, to avoid spreads overwriting them
-				if (is_store_sub) {
 					push_prop(
-						b.get(attribute.name, [b.stmt(b.call('$.mark_store_binding')), b.return(expression)]),
+						b.set(attribute.name, [b.stmt(/** @type {Expression} */ (context.visit(assignment)))]),
 						true
 					);
-				} else {
-					push_prop(b.get(attribute.name, [b.return(expression)]), true);
 				}
-
-				const assignment = b.assignment('=', attribute.expression, b.id('$$value'));
-				push_prop(
-					b.set(attribute.name, [b.stmt(/** @type {Expression} */ (context.visit(assignment)))]),
-					true
-				);
 			}
 		}
 	}
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
index 59beacbb0c30..11f76aa025e7 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
@@ -1,4 +1,4 @@
-/** @import { Expression, ExpressionStatement, Identifier, MemberExpression, Statement, Super } from 'estree' */
+/** @import { Expression, ExpressionStatement, Identifier, MemberExpression, SequenceExpression, Statement, Super } from 'estree' */
 /** @import { AST, SvelteNode } from '#compiler' */
 /** @import { ComponentClientTransformState } from '../../types' */
 import { walk } from 'zimmerframe';
@@ -143,11 +143,16 @@ export function build_update_assignment(state, id, init, value, update) {
 
 /**
  * Serializes `bind:this` for components and elements.
- * @param {Identifier | MemberExpression} expression
+ * @param {Identifier | MemberExpression | SequenceExpression} expression
  * @param {Expression} value
  * @param {import('zimmerframe').Context<SvelteNode, ComponentClientTransformState>} context
  */
 export function build_bind_this(expression, value, { state, visit }) {
+	if (expression.type === 'SequenceExpression') {
+		const [get, set] = /** @type {SequenceExpression} */ (visit(expression)).expressions;
+		return b.call('$.bind_this', value, set, get);
+	}
+
 	/** @type {Identifier[]} */
 	const ids = [];
 
@@ -224,6 +229,9 @@ export function build_bind_this(expression, value, { state, visit }) {
  * @param {MemberExpression} expression
  */
 export function validate_binding(state, binding, expression) {
+	if (binding.expression.type === 'SequenceExpression') {
+		return;
+	}
 	// If we are referencing a $store.foo then we don't need to add validation
 	const left = object(binding.expression);
 	const left_binding = left && state.scope.get(left.name);
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
index 7cabfb06c527..0d0444433564 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
@@ -1,4 +1,4 @@
-/** @import { BlockStatement, Expression, Pattern, Property, Statement } from 'estree' */
+/** @import { BlockStatement, Expression, Pattern, Property, SequenceExpression, Statement } from 'estree' */
 /** @import { AST, TemplateNode } from '#compiler' */
 /** @import { ComponentContext } from '../../types.js' */
 import { empty_comment, build_attribute_value } from './utils.js';
@@ -92,24 +92,38 @@ export function build_inline_component(node, expression, context) {
 			const value = build_attribute_value(attribute.value, context, false, true);
 			push_prop(b.prop('init', b.key(attribute.name), value));
 		} else if (attribute.type === 'BindDirective' && attribute.name !== 'this') {
-			// Delay prop pushes so bindings come at the end, to avoid spreads overwriting them
-			push_prop(
-				b.get(attribute.name, [
-					b.return(/** @type {Expression} */ (context.visit(attribute.expression)))
-				]),
-				true
-			);
-			push_prop(
-				b.set(attribute.name, [
-					b.stmt(
-						/** @type {Expression} */ (
-							context.visit(b.assignment('=', attribute.expression, b.id('$$value')))
-						)
-					),
-					b.stmt(b.assignment('=', b.id('$$settled'), b.false))
-				]),
-				true
-			);
+			if (attribute.expression.type === 'SequenceExpression') {
+				const [get, set] = /** @type {SequenceExpression} */ (context.visit(attribute.expression))
+					.expressions;
+				const get_id = b.id(context.state.scope.generate('bind_get'));
+				const set_id = b.id(context.state.scope.generate('bind_set'));
+
+				context.state.init.push(b.var(get_id, get));
+				context.state.init.push(b.var(set_id, set));
+
+				push_prop(b.get(attribute.name, [b.return(b.call(get_id))]));
+				push_prop(b.set(attribute.name, [b.stmt(b.call(set_id, b.id('$$value')))]));
+			} else {
+				// Delay prop pushes so bindings come at the end, to avoid spreads overwriting them
+				push_prop(
+					b.get(attribute.name, [
+						b.return(/** @type {Expression} */ (context.visit(attribute.expression)))
+					]),
+					true
+				);
+
+				push_prop(
+					b.set(attribute.name, [
+						b.stmt(
+							/** @type {Expression} */ (
+								context.visit(b.assignment('=', attribute.expression, b.id('$$value')))
+							)
+						),
+						b.stmt(b.assignment('=', b.id('$$settled'), b.false))
+					]),
+					true
+				);
+			}
 		}
 	}
 
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
index 434447727b33..d626bb08db30 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
@@ -110,14 +110,17 @@ export function build_element_attributes(node, context) {
 			const binding = binding_properties[attribute.name];
 			if (binding?.omit_in_ssr) continue;
 
+			let expression = /** @type {Expression} */ (context.visit(attribute.expression));
+
+			if (expression.type === 'SequenceExpression') {
+				expression = b.call(expression.expressions[0]);
+			}
+
 			if (is_content_editable_binding(attribute.name)) {
-				content = /** @type {Expression} */ (context.visit(attribute.expression));
+				content = expression;
 			} else if (attribute.name === 'value' && node.name === 'textarea') {
-				content = b.call(
-					'$.escape',
-					/** @type {Expression} */ (context.visit(attribute.expression))
-				);
-			} else if (attribute.name === 'group') {
+				content = b.call('$.escape', expression);
+			} else if (attribute.name === 'group' && attribute.expression.type !== 'SequenceExpression') {
 				const value_attribute = /** @type {AST.Attribute | undefined} */ (
 					node.attributes.find((attr) => attr.type === 'Attribute' && attr.name === 'value')
 				);
@@ -130,6 +133,7 @@ export function build_element_attributes(node, context) {
 						is_text_attribute(attr) &&
 						attr.value[0].data === 'checkbox'
 				);
+
 				attributes.push(
 					create_attribute('checked', -1, -1, [
 						{
@@ -159,7 +163,7 @@ export function build_element_attributes(node, context) {
 							type: 'ExpressionTag',
 							start: -1,
 							end: -1,
-							expression: attribute.expression,
+							expression,
 							metadata: {
 								expression: create_expression_metadata()
 							}
diff --git a/packages/svelte/src/compiler/types/legacy-nodes.d.ts b/packages/svelte/src/compiler/types/legacy-nodes.d.ts
index 2bd5fbbfa6d2..0013f5c17a60 100644
--- a/packages/svelte/src/compiler/types/legacy-nodes.d.ts
+++ b/packages/svelte/src/compiler/types/legacy-nodes.d.ts
@@ -6,7 +6,8 @@ import type {
 	Identifier,
 	MemberExpression,
 	ObjectExpression,
-	Pattern
+	Pattern,
+	SequenceExpression
 } from 'estree';
 
 interface BaseNode {
@@ -49,7 +50,7 @@ export interface LegacyBinding extends BaseNode {
 	/** The 'x' in `bind:x` */
 	name: string;
 	/** The y in `bind:x={y}` */
-	expression: Identifier | MemberExpression;
+	expression: Identifier | MemberExpression | SequenceExpression;
 }
 
 export interface LegacyBody extends BaseElement {
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index a409cf570489..b8724f28dc94 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -14,7 +14,8 @@ import type {
 	Pattern,
 	Program,
 	ChainExpression,
-	SimpleCallExpression
+	SimpleCallExpression,
+	SequenceExpression
 } from 'estree';
 import type { Scope } from '../phases/scope';
 
@@ -187,7 +188,7 @@ export namespace AST {
 		/** The 'x' in `bind:x` */
 		name: string;
 		/** The y in `bind:x={y}` */
-		expression: Identifier | MemberExpression;
+		expression: Identifier | MemberExpression | SequenceExpression;
 		/** @internal */
 		metadata: {
 			binding_group_name: Identifier;
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/Child.svelte b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/Child.svelte
new file mode 100644
index 000000000000..0026309d449f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/Child.svelte
@@ -0,0 +1,11 @@
+<script>
+	let div = $state();
+
+	$effect(() => {
+		console.log(div?.textContent);
+	})
+
+	export const someData = '123';
+</script>
+
+<div bind:this={() => div, v => div = v}>123</div>
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/_config.js b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/_config.js
new file mode 100644
index 000000000000..1d51c8eead1e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target, logs }) {
+		assert.htmlEqual(target.innerHTML, `<div>123</div>`);
+
+		assert.deepEqual(logs, ['123', '123']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/main.svelte b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/main.svelte
new file mode 100644
index 000000000000..21646e745a4e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter-2/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	import Child from './Child.svelte';
+
+	let child = $state();
+
+	$effect(() => {
+		console.log(child.someData);
+	});
+</script>
+
+<Child bind:this={() => child, v => child = v} />
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/Child.svelte b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/Child.svelte
new file mode 100644
index 000000000000..bea5849ec76b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/Child.svelte
@@ -0,0 +1,12 @@
+<script>
+	let { a = $bindable() } = $props();
+</script>
+
+<input
+	type="value"
+	bind:value={() => a,
+	(v) => {
+		console.log('b', v);
+		a = v;
+	}}
+/>
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js
new file mode 100644
index 000000000000..158d1e6f63e0
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js
@@ -0,0 +1,20 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+import { assert_ok } from '../../../suite';
+
+export default test({
+	async test({ assert, target, logs }) {
+		const input = target.querySelector('input');
+
+		assert_ok(input);
+
+		input.value = '2';
+		input.dispatchEvent(new window.Event('input'));
+
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `<button>a: 2</button><input type="value">`);
+
+		assert.deepEqual(logs, ['b', '2', 'a', '2']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte
new file mode 100644
index 000000000000..191a4234764d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte
@@ -0,0 +1,16 @@
+<script>
+	import Child from './Child.svelte';
+
+	let a = $state(0);
+</script>
+
+<button onclick={() => a++}>a: {a}</button>
+
+<Child
+	bind:a={() => a,
+	(v) => {
+		console.log('a', v);
+		a = v;
+	}}
+/>
+
diff --git a/packages/svelte/tests/validator/samples/bind_group_invalid_expression/errors.json b/packages/svelte/tests/validator/samples/bind_group_invalid_expression/errors.json
new file mode 100644
index 000000000000..f85363106b01
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/bind_group_invalid_expression/errors.json
@@ -0,0 +1,14 @@
+[
+	{
+		"code": "bind_group_invalid_expression",
+		"message": "`bind:group` can only bind to an Identifier or MemberExpression",
+		"start": {
+			"line": 8,
+			"column": 38
+		},
+		"end": {
+			"line": 8,
+			"column": 84
+		}
+	}
+]
diff --git a/packages/svelte/tests/validator/samples/bind_group_invalid_expression/input.svelte b/packages/svelte/tests/validator/samples/bind_group_invalid_expression/input.svelte
new file mode 100644
index 000000000000..3f8afe76550f
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/bind_group_invalid_expression/input.svelte
@@ -0,0 +1,12 @@
+<script>
+	let values = $state([{ name: 'Alpha' }, { name: 'Beta' }, { name: 'Gamma' }]);
+	let selected = $state(values[1]);
+</script>
+
+{#each values as value}
+	<label>
+		<input type="radio" value="{value}" bind:group={() => selected, v => selected = v} /> {value.name}
+	</label>
+{/each}
+
+<p>{selected.name}</p>
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 0d761919a8e0..61a34dcb8e93 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -606,7 +606,7 @@ declare module 'svelte/animate' {
 }
 
 declare module 'svelte/compiler' {
-	import type { Expression, Identifier, ArrayExpression, ArrowFunctionExpression, VariableDeclaration, VariableDeclarator, MemberExpression, ObjectExpression, Pattern, Program, ChainExpression, SimpleCallExpression } from 'estree';
+	import type { Expression, Identifier, ArrayExpression, ArrowFunctionExpression, VariableDeclaration, VariableDeclarator, MemberExpression, ObjectExpression, Pattern, Program, ChainExpression, SimpleCallExpression, SequenceExpression } from 'estree';
 	import type { SourceMap } from 'magic-string';
 	import type { Location } from 'locate-character';
 	/**
@@ -1047,7 +1047,7 @@ declare module 'svelte/compiler' {
 			/** The 'x' in `bind:x` */
 			name: string;
 			/** The y in `bind:x={y}` */
-			expression: Identifier | MemberExpression;
+			expression: Identifier | MemberExpression | SequenceExpression;
 		}
 
 		/** A `class:` directive */

From 57f8ca6e3c13d680d642bf7938d2a869e04043dc Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sun, 8 Dec 2024 07:31:14 -0500
Subject: [PATCH 18/62] oops

---
 .changeset/slimy-donkeys-hang.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/slimy-donkeys-hang.md b/.changeset/slimy-donkeys-hang.md
index d63141660eed..b491d78b4c9e 100644
--- a/.changeset/slimy-donkeys-hang.md
+++ b/.changeset/slimy-donkeys-hang.md
@@ -1,5 +1,5 @@
 ---
-'svelte': patch
+'svelte': minor
 ---
 
 feat: add support for bind getters/setters

From 301744f1f7f45946f799f82e63f072303e740071 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sun, 8 Dec 2024 07:32:51 -0500
Subject: [PATCH 19/62] Version Packages (#14598)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/rare-cheetahs-laugh.md |  5 -----
 .changeset/slimy-donkeys-hang.md  |  5 -----
 packages/svelte/CHANGELOG.md      | 10 ++++++++++
 packages/svelte/package.json      |  2 +-
 packages/svelte/src/version.js    |  2 +-
 5 files changed, 12 insertions(+), 12 deletions(-)
 delete mode 100644 .changeset/rare-cheetahs-laugh.md
 delete mode 100644 .changeset/slimy-donkeys-hang.md

diff --git a/.changeset/rare-cheetahs-laugh.md b/.changeset/rare-cheetahs-laugh.md
deleted file mode 100644
index 2637b50b3c38..000000000000
--- a/.changeset/rare-cheetahs-laugh.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: always run `if` block code the first time
diff --git a/.changeset/slimy-donkeys-hang.md b/.changeset/slimy-donkeys-hang.md
deleted file mode 100644
index b491d78b4c9e..000000000000
--- a/.changeset/slimy-donkeys-hang.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add support for bind getters/setters
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 4031110fa799..fea90ca0eab6 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.9.0
+
+### Minor Changes
+
+- feat: add support for bind getters/setters ([#14307](https://github.com/sveltejs/svelte/pull/14307))
+
+### Patch Changes
+
+- fix: always run `if` block code the first time ([#14597](https://github.com/sveltejs/svelte/pull/14597))
+
 ## 5.8.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index c751a598db53..e5afd8e13065 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.8.1",
+  "version": "5.9.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 3061318cb034..f5369fe169e8 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.8.1';
+export const VERSION = '5.9.0';
 export const PUBLIC_VERSION = '5';

From c1c59e77a54109e6dd868e8ee7884caf9a275f5a Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sun, 8 Dec 2024 07:38:01 -0500
Subject: [PATCH 20/62] docs: where the hell did this come from? (#14613)

---
 documentation/docs/03-template-syntax/03-each.md | 2 --
 1 file changed, 2 deletions(-)

diff --git a/documentation/docs/03-template-syntax/03-each.md b/documentation/docs/03-template-syntax/03-each.md
index df0ba4d8f59c..70666f6a5798 100644
--- a/documentation/docs/03-template-syntax/03-each.md
+++ b/documentation/docs/03-template-syntax/03-each.md
@@ -23,8 +23,6 @@ Iterating over values can be done with an each block. The values in question can
 </ul>
 ```
 
-You can use each blocks to iterate over any array or array-like value — that is, any object with a `length` property.
-
 An each block can also specify an _index_, equivalent to the second argument in an `array.map(...)` callback:
 
 ```svelte

From c66bf178aae18c2b4d8ac189a48cf10c47e4d417 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Mon, 9 Dec 2024 13:39:31 +0100
Subject: [PATCH 21/62] fix: mark subtree dynamic for bind with sequence
 expressions (#14626)

---
 .changeset/green-pandas-study.md                   |  5 +++++
 .../phases/2-analyze/visitors/BindDirective.js     |  3 +++
 .../samples/bind-getter-setter/_config.js          | 14 ++++++++++----
 .../samples/bind-getter-setter/main.svelte         |  9 +++++++++
 4 files changed, 27 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/green-pandas-study.md

diff --git a/.changeset/green-pandas-study.md b/.changeset/green-pandas-study.md
new file mode 100644
index 000000000000..869599055cb0
--- /dev/null
+++ b/.changeset/green-pandas-study.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: mark subtree dynamic for bind with sequence expressions
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js
index b06236538008..b4de1925df24 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/BindDirective.js
@@ -11,6 +11,7 @@ import * as w from '../../../warnings.js';
 import { binding_properties } from '../../bindings.js';
 import fuzzymatch from '../../1-parse/utils/fuzzymatch.js';
 import { is_content_editable_binding, is_svg } from '../../../../utils.js';
+import { mark_subtree_dynamic } from './shared/fragment.js';
 
 /**
  * @param {AST.BindDirective} node
@@ -141,6 +142,8 @@ export function BindDirective(node, context) {
 			e.bind_invalid_expression(node);
 		}
 
+		mark_subtree_dynamic(context.path);
+
 		return;
 	}
 
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js
index 158d1e6f63e0..dd5c387405e0 100644
--- a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/_config.js
@@ -4,17 +4,23 @@ import { assert_ok } from '../../../suite';
 
 export default test({
 	async test({ assert, target, logs }) {
-		const input = target.querySelector('input');
-
-		assert_ok(input);
+		const [input, checkbox] = target.querySelectorAll('input');
 
 		input.value = '2';
 		input.dispatchEvent(new window.Event('input'));
 
 		flushSync();
 
-		assert.htmlEqual(target.innerHTML, `<button>a: 2</button><input type="value">`);
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>a: 2</button><input type="value"><div><input type="checkbox" ></div>`
+		);
 
 		assert.deepEqual(logs, ['b', '2', 'a', '2']);
+
+		flushSync(() => {
+			checkbox.click();
+		});
+		assert.deepEqual(logs, ['b', '2', 'a', '2', 'check', false]);
 	}
 });
diff --git a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte
index 191a4234764d..f6d908fba196 100644
--- a/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/bind-getter-setter/main.svelte
@@ -2,6 +2,7 @@
 	import Child from './Child.svelte';
 
 	let a = $state(0);
+	let check = $state(true);
 </script>
 
 <button onclick={() => a++}>a: {a}</button>
@@ -14,3 +15,11 @@
 	}}
 />
 
+<div>
+	<input type="checkbox" 
+	bind:checked={()=>check,
+	(v)=>{
+		console.log('check', v);
+		check = v;
+	}} />
+</div>
\ No newline at end of file

From 0a10c59517e77a0ed0b9fb51fab44a450a3710e7 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 9 Dec 2024 09:29:51 -0500
Subject: [PATCH 22/62] Version Packages (#14628)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/green-pandas-study.md | 5 -----
 packages/svelte/CHANGELOG.md     | 6 ++++++
 packages/svelte/package.json     | 2 +-
 packages/svelte/src/version.js   | 2 +-
 4 files changed, 8 insertions(+), 7 deletions(-)
 delete mode 100644 .changeset/green-pandas-study.md

diff --git a/.changeset/green-pandas-study.md b/.changeset/green-pandas-study.md
deleted file mode 100644
index 869599055cb0..000000000000
--- a/.changeset/green-pandas-study.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: mark subtree dynamic for bind with sequence expressions
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index fea90ca0eab6..00ef29347533 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.9.1
+
+### Patch Changes
+
+- fix: mark subtree dynamic for bind with sequence expressions ([#14626](https://github.com/sveltejs/svelte/pull/14626))
+
 ## 5.9.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index e5afd8e13065..5d662af00c3f 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.9.0",
+  "version": "5.9.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index f5369fe169e8..20ff578fbeac 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.9.0';
+export const VERSION = '5.9.1';
 export const PUBLIC_VERSION = '5';

From 38171f60ead8d702f50f6b5c23633d2ae4d85be6 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Mon, 9 Dec 2024 16:48:34 +0100
Subject: [PATCH 23/62] fix: allow exports with source from script module even
 if no bind is present (#14620)

* fix: allow exports with source from script module even if no bind is present

* chore: move test to validator
---
 .changeset/four-carrots-burn.md                              | 5 +++++
 packages/svelte/src/compiler/phases/2-analyze/index.js       | 2 +-
 .../export-not-defined-module-with-source/errors.json        | 1 +
 .../export-not-defined-module-with-source/input.svelte       | 3 +++
 4 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/four-carrots-burn.md
 create mode 100644 packages/svelte/tests/validator/samples/export-not-defined-module-with-source/errors.json
 create mode 100644 packages/svelte/tests/validator/samples/export-not-defined-module-with-source/input.svelte

diff --git a/.changeset/four-carrots-burn.md b/.changeset/four-carrots-burn.md
new file mode 100644
index 000000000000..39cefcc4b76e
--- /dev/null
+++ b/.changeset/four-carrots-burn.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: allow exports with source from script module even if no bind is present
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 8f1efd7f635f..9e29813ee336 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -698,7 +698,7 @@ export function analyze_component(root, source, options) {
 	}
 
 	for (const node of analysis.module.ast.body) {
-		if (node.type === 'ExportNamedDeclaration' && node.specifiers !== null) {
+		if (node.type === 'ExportNamedDeclaration' && node.specifiers !== null && node.source == null) {
 			for (const specifier of node.specifiers) {
 				if (specifier.local.type !== 'Identifier') continue;
 
diff --git a/packages/svelte/tests/validator/samples/export-not-defined-module-with-source/errors.json b/packages/svelte/tests/validator/samples/export-not-defined-module-with-source/errors.json
new file mode 100644
index 000000000000..fe51488c7066
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/export-not-defined-module-with-source/errors.json
@@ -0,0 +1 @@
+[]
diff --git a/packages/svelte/tests/validator/samples/export-not-defined-module-with-source/input.svelte b/packages/svelte/tests/validator/samples/export-not-defined-module-with-source/input.svelte
new file mode 100644
index 000000000000..df50ebc1fa66
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/export-not-defined-module-with-source/input.svelte
@@ -0,0 +1,3 @@
+<script module>
+	export { something } from "./something.js";
+</script>

From 11764632b9d64621bfbf86cd1d3a65adda1dfd09 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Mon, 9 Dec 2024 17:22:42 +0100
Subject: [PATCH 24/62] fix: deconflict `get_name` for literal class properties
 (#14607)

---
 .changeset/stupid-buckets-drum.md             |  5 ++++
 .../3-transform/client/visitors/ClassBody.js  | 24 +++++++++++++++----
 .../_config.js                                |  3 +++
 .../main.svelte                               |  6 +++++
 4 files changed, 34 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/stupid-buckets-drum.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/main.svelte

diff --git a/.changeset/stupid-buckets-drum.md b/.changeset/stupid-buckets-drum.md
new file mode 100644
index 000000000000..57d6f015f786
--- /dev/null
+++ b/.changeset/stupid-buckets-drum.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: deconflict `get_name` for literal class properties
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/ClassBody.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/ClassBody.js
index 5e842a82febf..7b3a9a4d0e29 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/ClassBody.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/ClassBody.js
@@ -23,6 +23,9 @@ export function ClassBody(node, context) {
 	/** @type {Map<string, StateField>} */
 	const private_state = new Map();
 
+	/** @type {Map<(MethodDefinition|PropertyDefinition)["key"], string>} */
+	const definition_names = new Map();
+
 	/** @type {string[]} */
 	const private_ids = [];
 
@@ -34,9 +37,12 @@ export function ClassBody(node, context) {
 				definition.key.type === 'Literal')
 		) {
 			const type = definition.key.type;
-			const name = get_name(definition.key);
+			const name = get_name(definition.key, public_state);
 			if (!name) continue;
 
+			// we store the deconflicted name in the map so that we can access it later
+			definition_names.set(definition.key, name);
+
 			const is_private = type === 'PrivateIdentifier';
 			if (is_private) private_ids.push(name);
 
@@ -96,7 +102,7 @@ export function ClassBody(node, context) {
 				definition.key.type === 'PrivateIdentifier' ||
 				definition.key.type === 'Literal')
 		) {
-			const name = get_name(definition.key);
+			const name = definition_names.get(definition.key);
 			if (!name) continue;
 
 			const is_private = definition.key.type === 'PrivateIdentifier';
@@ -210,10 +216,20 @@ export function ClassBody(node, context) {
 
 /**
  * @param {Identifier | PrivateIdentifier | Literal} node
+ * @param {Map<string, StateField>} public_state
  */
-function get_name(node) {
+function get_name(node, public_state) {
 	if (node.type === 'Literal') {
-		return node.value?.toString().replace(regex_invalid_identifier_chars, '_');
+		let name = node.value?.toString().replace(regex_invalid_identifier_chars, '_');
+
+		// the above could generate conflicts because it has to generate a valid identifier
+		// so stuff like `0` and `1` or `state%` and `state^` will result in the same string
+		// so we have to de-conflict. We can only check `public_state` because private state
+		// can't have literal keys
+		while (name && public_state.has(name)) {
+			name = '_' + name;
+		}
+		return name;
 	} else {
 		return node.name;
 	}
diff --git a/packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/_config.js b/packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/_config.js
new file mode 100644
index 000000000000..f47bee71df87
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/_config.js
@@ -0,0 +1,3 @@
+import { test } from '../../test';
+
+export default test({});
diff --git a/packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/main.svelte b/packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/main.svelte
new file mode 100644
index 000000000000..aec1e67cc675
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/class-state-conflicting-get-name/main.svelte
@@ -0,0 +1,6 @@
+<script>
+	class Test {
+		0 = $state();
+		1 = $state();
+	}
+</script>
\ No newline at end of file

From c6fca0200981a8be0a73f9602803b37f8ff1c45b Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 9 Dec 2024 18:39:13 +0100
Subject: [PATCH 25/62] docs: more details for errors/warnings on the site
 (#14632)

* docs: more details for errors/warnings on the site

Related to #11305

* Apply suggestions from code review

Co-authored-by: Rich Harris <rich.harris@vercel.com>

* fix in correct place

* tab not spaces

* tweaks

* fix

* Apply suggestions from code review

* regenerate

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .../.generated/client-warnings.md             |  84 +++++++++++++
 .../.generated/compile-warnings.md            | 117 ++++++++++++++++++
 .../98-reference/.generated/server-errors.md  |   2 +
 .../98-reference/.generated/shared-errors.md  |  42 +++++++
 .../.generated/shared-warnings.md             |   9 ++
 .../messages/client-warnings/warnings.md      |  84 +++++++++++++
 .../messages/compile-warnings/script.md       |  91 ++++++++++++++
 .../svelte/messages/compile-warnings/style.md |  14 +++
 .../messages/compile-warnings/template.md     |  12 ++
 .../messages/server-errors/lifecycle.md       |   2 +
 .../svelte/messages/shared-errors/errors.md   |  42 +++++++
 .../messages/shared-warnings/warnings.md      |   9 ++
 12 files changed, 508 insertions(+)

diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index ef19a28994bd..b0490b84ffd9 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -66,6 +66,31 @@ The easiest way to log a value as it changes over time is to use the [`$inspect`
 The `%attribute%` attribute on `%html%` changed its value between server and client renders. The client value, `%value%`, will be ignored in favour of the server value
 ```
 
+Certain attributes like `src` on an `<img>` element will not be repaired during hydration, i.e. the server value will be kept. That's because updating these attributes can cause the image to be refetched (or in the case of an `<iframe>`, for the frame to be reloaded), even if they resolve to the same resource.
+
+To fix this, either silence the warning with a [`svelte-ignore`](basic-markup#Comments) comment, or ensure that the value stays the same between server and client. If you really need the value to change on hydration, you can force an update like this:
+
+```svelte
+<script>
+	let { src } = $props();
+
+	if (typeof window !== 'undefined') {
+		// stash the value...
+		const initial = src;
+
+		// unset it...
+		src = undefined;
+
+		$effect(() => {
+			// ...and reset after we've mounted
+			src = initial;
+		});
+	}
+</script>
+
+<img {src} />
+```
+
 ### hydration_html_changed
 
 ```
@@ -76,6 +101,31 @@ The value of an `{@html ...}` block changed between server and client renders. T
 The value of an `{@html ...}` block %location% changed between server and client renders. The client value will be ignored in favour of the server value
 ```
 
+If the `{@html ...}` value changes between the server and the client, it will not be repaired during hydration, i.e. the server value will be kept. That's because change detection during hydration is expensive and usually unnecessary.
+
+To fix this, either silence the warning with a [`svelte-ignore`](basic-markup#Comments) comment, or ensure that the value stays the same between server and client. If you really need the value to change on hydration, you can force an update like this:
+
+```svelte
+<script>
+	let { markup } = $props();
+
+	if (typeof window !== 'undefined') {
+		// stash the value...
+		const initial = markup;
+
+		// unset it...
+		markup = undefined;
+
+		$effect(() => {
+			// ...and reset after we've mounted
+			markup = initial;
+		});
+	}
+</script>
+
+{@html markup}
+```
+
 ### hydration_mismatch
 
 ```
@@ -86,6 +136,10 @@ Hydration failed because the initial UI does not match what was rendered on the
 Hydration failed because the initial UI does not match what was rendered on the server. The error occurred near %location%
 ```
 
+This warning is thrown when Svelte encounters an error while hydrating the HTML from the server. During hydration, Svelte walks the DOM, expecting a certain structure. If that structure is different (for example because the HTML was repaired by the DOM because of invalid HTML), then Svelte will run into issues, resulting in this warning.
+
+During development, this error is often preceeded by a `console.error` detailing the offending HTML, which needs fixing.
+
 ### invalid_raw_snippet_render
 
 ```
@@ -110,6 +164,10 @@ Tried to unmount a component that was not mounted
 %parent% passed a value to %child% with `bind:`, but the value is owned by %owner%. Consider creating a binding between %owner% and %parent%
 ```
 
+Consider three components `GrandParent`, `Parent` and `Child`. If you do `<GrandParent bind:value>`, inside `GrandParent` pass on the variable via `<Parent {value} />` (note the missing `bind:`) and then do `<Child bind:value>` inside `Parent`, this warning is thrown.
+
+To fix it, `bind:` to the value instead of just passing a property (i.e. in this example do `<Parent bind:value />`).
+
 ### ownership_invalid_mutation
 
 ```
@@ -120,6 +178,32 @@ Mutating a value outside the component that created it is strongly discouraged.
 %component% mutated a value owned by %owner%. This is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead
 ```
 
+Consider the following code:
+
+```svelte
+<!--- file: App.svelte --->
+<script>
+	import Child from './Child.svelte';
+	let person = $state({ name: 'Florida', surname: 'Man' });
+</script>
+
+<Child {person} />
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	let { person } = $props();
+</script>
+
+<input bind:value={person.name}>
+<input bind:value={person.surname}>
+```
+
+`Child` is mutating `person` which is owned by `App` without being explicitly "allowed" to do so. This is strongly discouraged since it can create code that is hard to reason about at scale ("who mutated this value?"), hence the warning.
+
+To fix it, either create callback props to communicate changes, or mark `person` as [`$bindable`]($bindable).
+
 ### reactive_declaration_non_reactive_property
 
 ```
diff --git a/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md
index 481959ba3d5c..88b1f278a679 100644
--- a/documentation/docs/98-reference/.generated/compile-warnings.md
+++ b/documentation/docs/98-reference/.generated/compile-warnings.md
@@ -610,6 +610,20 @@ Empty block
 Unused CSS selector "%name%"
 ```
 
+Svelte traverses both the template and the `<style>` tag to find out which of the CSS selectors are not used within the template, so it can remove them.
+
+In some situations a selector may target an element that is not 'visible' to the compiler, for example because it is part of an `{@html ...}` tag or you're overriding styles in a child component. In these cases, use [`:global`](/docs/svelte/global-styles) to preserve the selector as-is:
+
+```svelte
+<div class="post">{@html content}</div>
+
+<style>
+  .post :global {
+    p {...}
+  }
+</style>
+```
+
 ### element_invalid_self_closing_tag
 
 ```
@@ -622,6 +636,8 @@ Self-closing HTML tags for non-void elements are ambiguous — use `<%name% ...>
 Using `on:%name%` to listen to the %name% event is deprecated. Use the event attribute `on%name%` instead
 ```
 
+See [the migration guide](v5-migration-guide#Event-changes) for more info.
+
 ### export_let_unused
 
 ```
@@ -640,6 +656,8 @@ Component has unused export property '%name%'. If it is for external reference o
 Svelte 5 components are no longer classes. Instantiate them using `mount` or `hydrate` (imported from 'svelte') instead.
 ```
 
+See the [migration guide](v5-migration-guide#Components-are-no-longer-classes) for more info.
+
 ### node_invalid_placement_ssr
 
 ```
@@ -660,6 +678,30 @@ This code will work when the component is rendered on the client (which is why t
 `%name%` is updated, but is not declared with `$state(...)`. Changing its value will not correctly trigger updates
 ```
 
+This warning is thrown when the compiler detects the following:
+- a variable was declared without `$state` or `$state.raw`
+- the variable is reassigned
+- the variable is read in a reactive context
+
+In this case, changing the value will not correctly trigger updates. Example:
+
+```svelte
+<script>
+	let reactive = $state('reactive');
+	let stale = 'stale';
+</script>
+
+<p>This value updates: {reactive}</p>
+<p>This value does not update: {stale}</p>
+
+<button onclick={() => {
+	stale = 'updated';
+	reactive = 'updated';
+}}>update</button>
+```
+
+To fix this, wrap your variable declaration with `$state`.
+
 ### options_deprecated_accessors
 
 ```
@@ -732,6 +774,12 @@ Reassignments of module-level declarations will not cause reactive statements to
 `context="module"` is deprecated, use the `module` attribute instead
 ```
 
+```svelte
+<script ---context="module"--- +++context+++>
+	let foo = 'bar';
+</script>
+```
+
 ### script_unknown_attribute
 
 ```
@@ -744,12 +792,79 @@ Unrecognized attribute — should be one of `generics`, `lang` or `module`. If t
 Using `<slot>` to render parent content is deprecated. Use `{@render ...}` tags instead
 ```
 
+See [the migration guide](v5-migration-guide#Snippets-instead-of-slots) for more info.
+
 ### state_referenced_locally
 
 ```
 State referenced in its own scope will never update. Did you mean to reference it inside a closure?
 ```
 
+This warning is thrown when the compiler detects the following:
+- A reactive variable is declared
+- the variable is reassigned
+- the variable is referenced inside the same scope it is declared and it is a non-reactive context
+
+In this case, the state reassignment will not be noticed by whatever you passed it to. For example, if you pass the state to a function, that function will not notice the updates:
+
+```svelte
+<!--- file: Parent.svelte --->
+<script>
+	import { setContext } from 'svelte';
+
+	let count = $state(0);
+
+	// warning: state_referenced_locally
+	setContext('count', count);
+</script>
+
+<button onclick={() => count++}>
+	increment
+</button>
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	import { getContext } from 'svelte';
+
+	const count = getContext('count');
+</script>
+
+<!-- This will never update -->
+<p>The count is {count}</p>
+```
+
+To fix this, reference the variable such that it is lazily evaluated. For the above example, this can be achieved by wrapping `count` in a function:
+
+```svelte
+<!--- file: Parent.svelte --->
+<script>
+	import { setContext } from 'svelte';
+
+	let count = $state(0);
+	setContext('count', +++() => count+++);
+</script>
+
+<button onclick={() => count++}>
+	increment
+</button>
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	import { getContext } from 'svelte';
+
+	const count = getContext('count');
+</script>
+
+<!-- This will update -->
+<p>The count is {+++count()+++}</p>
+```
+
+For more info, see [Passing state into functions]($state#Passing-state-into-functions).
+
 ### store_rune_conflict
 
 ```
@@ -805,6 +920,8 @@ A derived value may be used in other contexts:
 `<svelte:self>` is deprecated — use self-imports (e.g. `import %name% from './%basename%'`) instead
 ```
 
+See [the note in the docs](legacy-svelte-self) for more info.
+
 ### unknown_code
 
 ```
diff --git a/documentation/docs/98-reference/.generated/server-errors.md b/documentation/docs/98-reference/.generated/server-errors.md
index 8cf6727da9ac..c3e8b53c3145 100644
--- a/documentation/docs/98-reference/.generated/server-errors.md
+++ b/documentation/docs/98-reference/.generated/server-errors.md
@@ -5,3 +5,5 @@
 ```
 `%name%(...)` is not available on the server
 ```
+
+Certain methods such as `mount` cannot be invoked while running in a server context. Avoid calling them eagerly, i.e. not during render.
diff --git a/documentation/docs/98-reference/.generated/shared-errors.md b/documentation/docs/98-reference/.generated/shared-errors.md
index 52ef9d5f8826..0102aafcbca1 100644
--- a/documentation/docs/98-reference/.generated/shared-errors.md
+++ b/documentation/docs/98-reference/.generated/shared-errors.md
@@ -6,12 +6,54 @@
 Cannot use `{@render children(...)}` if the parent component uses `let:` directives. Consider using a named snippet instead
 ```
 
+This error would be thrown in a setup like this:
+
+```svelte
+<!--- file: Parent.svelte --->
+<List {items} let:entry>
+    <span>{entry}</span>
+</List>
+```
+
+```svelte
+<!--- file: List.svelte --->
+<script>
+    let { items, children } = $props();
+</script>
+
+<ul>
+    {#each items as item}
+        <li>{@render children(item)}</li>
+    {/each}
+</ul>
+```
+
+Here, `List.svelte` is using `{@render children(item)` which means it expects `Parent.svelte` to use snippets. Instead, `Parent.svelte` uses the deprecated `let:` directive. This combination of APIs is incompatible, hence the error.
+
 ### lifecycle_outside_component
 
 ```
 `%name%(...)` can only be used during component initialisation
 ```
 
+Certain lifecycle methods can only be used during component initialisation. To fix this, make sure you're invoking the method inside the _top level of the instance script_ of your component.
+
+```svelte
+<script>
+    import { onMount } from 'svelte';
+
+    function handleClick() {
+        // This is wrong
+        onMount(() => {})
+    }
+
+    // This is correct
+    onMount(() => {})
+</script>
+
+<button onclick={handleClick}>click me</button>
+```
+
 ### store_invalid_shape
 
 ```
diff --git a/documentation/docs/98-reference/.generated/shared-warnings.md b/documentation/docs/98-reference/.generated/shared-warnings.md
index e9327e1e9818..2d23e68948be 100644
--- a/documentation/docs/98-reference/.generated/shared-warnings.md
+++ b/documentation/docs/98-reference/.generated/shared-warnings.md
@@ -6,6 +6,8 @@
 `<svelte:element this="%tag%">` is a void element — it cannot have content
 ```
 
+Elements such as `<input>` cannot have content, any children passed to these elements will be ignored.
+
 ### state_snapshot_uncloneable
 
 ```
@@ -17,3 +19,10 @@ The following properties cannot be cloned with `$state.snapshot` — the return
 
 %properties%
 ```
+
+`$state.snapshot` tries to clone the given value in order to return a reference that no longer changes. Certain objects may not be cloneable, in which case the original value is returned. In the following example, `property` is cloned, but `window` is not, because DOM elements are uncloneable:
+
+```js
+const state = $state({ property: 'this is cloneable', window })
+const snapshot = $state.snapshot();
+```
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index 019e83e7b120..122c1b92a64e 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -52,18 +52,72 @@ The easiest way to log a value as it changes over time is to use the [`$inspect`
 
 > The `%attribute%` attribute on `%html%` changed its value between server and client renders. The client value, `%value%`, will be ignored in favour of the server value
 
+Certain attributes like `src` on an `<img>` element will not be repaired during hydration, i.e. the server value will be kept. That's because updating these attributes can cause the image to be refetched (or in the case of an `<iframe>`, for the frame to be reloaded), even if they resolve to the same resource.
+
+To fix this, either silence the warning with a [`svelte-ignore`](basic-markup#Comments) comment, or ensure that the value stays the same between server and client. If you really need the value to change on hydration, you can force an update like this:
+
+```svelte
+<script>
+	let { src } = $props();
+
+	if (typeof window !== 'undefined') {
+		// stash the value...
+		const initial = src;
+
+		// unset it...
+		src = undefined;
+
+		$effect(() => {
+			// ...and reset after we've mounted
+			src = initial;
+		});
+	}
+</script>
+
+<img {src} />
+```
+
 ## hydration_html_changed
 
 > The value of an `{@html ...}` block changed between server and client renders. The client value will be ignored in favour of the server value
 
 > The value of an `{@html ...}` block %location% changed between server and client renders. The client value will be ignored in favour of the server value
 
+If the `{@html ...}` value changes between the server and the client, it will not be repaired during hydration, i.e. the server value will be kept. That's because change detection during hydration is expensive and usually unnecessary.
+
+To fix this, either silence the warning with a [`svelte-ignore`](basic-markup#Comments) comment, or ensure that the value stays the same between server and client. If you really need the value to change on hydration, you can force an update like this:
+
+```svelte
+<script>
+	let { markup } = $props();
+
+	if (typeof window !== 'undefined') {
+		// stash the value...
+		const initial = markup;
+
+		// unset it...
+		markup = undefined;
+
+		$effect(() => {
+			// ...and reset after we've mounted
+			markup = initial;
+		});
+	}
+</script>
+
+{@html markup}
+```
+
 ## hydration_mismatch
 
 > Hydration failed because the initial UI does not match what was rendered on the server
 
 > Hydration failed because the initial UI does not match what was rendered on the server. The error occurred near %location%
 
+This warning is thrown when Svelte encounters an error while hydrating the HTML from the server. During hydration, Svelte walks the DOM, expecting a certain structure. If that structure is different (for example because the HTML was repaired by the DOM because of invalid HTML), then Svelte will run into issues, resulting in this warning.
+
+During development, this error is often preceeded by a `console.error` detailing the offending HTML, which needs fixing.
+
 ## invalid_raw_snippet_render
 
 > The `render` function passed to `createRawSnippet` should return HTML for a single element
@@ -80,12 +134,42 @@ The easiest way to log a value as it changes over time is to use the [`$inspect`
 
 > %parent% passed a value to %child% with `bind:`, but the value is owned by %owner%. Consider creating a binding between %owner% and %parent%
 
+Consider three components `GrandParent`, `Parent` and `Child`. If you do `<GrandParent bind:value>`, inside `GrandParent` pass on the variable via `<Parent {value} />` (note the missing `bind:`) and then do `<Child bind:value>` inside `Parent`, this warning is thrown.
+
+To fix it, `bind:` to the value instead of just passing a property (i.e. in this example do `<Parent bind:value />`).
+
 ## ownership_invalid_mutation
 
 > Mutating a value outside the component that created it is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead
 
 > %component% mutated a value owned by %owner%. This is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead
 
+Consider the following code:
+
+```svelte
+<!--- file: App.svelte --->
+<script>
+	import Child from './Child.svelte';
+	let person = $state({ name: 'Florida', surname: 'Man' });
+</script>
+
+<Child {person} />
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	let { person } = $props();
+</script>
+
+<input bind:value={person.name}>
+<input bind:value={person.surname}>
+```
+
+`Child` is mutating `person` which is owned by `App` without being explicitly "allowed" to do so. This is strongly discouraged since it can create code that is hard to reason about at scale ("who mutated this value?"), hence the warning.
+
+To fix it, either create callback props to communicate changes, or mark `person` as [`$bindable`]($bindable).
+
 ## reactive_declaration_non_reactive_property
 
 > A `$:` statement (%location%) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode
diff --git a/packages/svelte/messages/compile-warnings/script.md b/packages/svelte/messages/compile-warnings/script.md
index 2c891b4fc791..8c32fb708266 100644
--- a/packages/svelte/messages/compile-warnings/script.md
+++ b/packages/svelte/messages/compile-warnings/script.md
@@ -6,10 +6,36 @@
 
 > Svelte 5 components are no longer classes. Instantiate them using `mount` or `hydrate` (imported from 'svelte') instead.
 
+See the [migration guide](v5-migration-guide#Components-are-no-longer-classes) for more info.
+
 ## non_reactive_update
 
 > `%name%` is updated, but is not declared with `$state(...)`. Changing its value will not correctly trigger updates
 
+This warning is thrown when the compiler detects the following:
+- a variable was declared without `$state` or `$state.raw`
+- the variable is reassigned
+- the variable is read in a reactive context
+
+In this case, changing the value will not correctly trigger updates. Example:
+
+```svelte
+<script>
+	let reactive = $state('reactive');
+	let stale = 'stale';
+</script>
+
+<p>This value updates: {reactive}</p>
+<p>This value does not update: {stale}</p>
+
+<button onclick={() => {
+	stale = 'updated';
+	reactive = 'updated';
+}}>update</button>
+```
+
+To fix this, wrap your variable declaration with `$state`.
+
 ## perf_avoid_inline_class
 
 > Avoid 'new class' — instead, declare the class at the top level scope
@@ -30,6 +56,71 @@
 
 > State referenced in its own scope will never update. Did you mean to reference it inside a closure?
 
+This warning is thrown when the compiler detects the following:
+- A reactive variable is declared
+- the variable is reassigned
+- the variable is referenced inside the same scope it is declared and it is a non-reactive context
+
+In this case, the state reassignment will not be noticed by whatever you passed it to. For example, if you pass the state to a function, that function will not notice the updates:
+
+```svelte
+<!--- file: Parent.svelte --->
+<script>
+	import { setContext } from 'svelte';
+
+	let count = $state(0);
+
+	// warning: state_referenced_locally
+	setContext('count', count);
+</script>
+
+<button onclick={() => count++}>
+	increment
+</button>
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	import { getContext } from 'svelte';
+
+	const count = getContext('count');
+</script>
+
+<!-- This will never update -->
+<p>The count is {count}</p>
+```
+
+To fix this, reference the variable such that it is lazily evaluated. For the above example, this can be achieved by wrapping `count` in a function:
+
+```svelte
+<!--- file: Parent.svelte --->
+<script>
+	import { setContext } from 'svelte';
+
+	let count = $state(0);
+	setContext('count', +++() => count+++);
+</script>
+
+<button onclick={() => count++}>
+	increment
+</button>
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	import { getContext } from 'svelte';
+
+	const count = getContext('count');
+</script>
+
+<!-- This will update -->
+<p>The count is {+++count()+++}</p>
+```
+
+For more info, see [Passing state into functions]($state#Passing-state-into-functions).
+
 ## store_rune_conflict
 
 > It looks like you're using the `$%name%` rune, but there is a local binding called `%name%`. Referencing a local variable with a `$` prefix will create a store subscription. Please rename `%name%` to avoid the ambiguity
diff --git a/packages/svelte/messages/compile-warnings/style.md b/packages/svelte/messages/compile-warnings/style.md
index 6967458cf46a..780f4ae9e512 100644
--- a/packages/svelte/messages/compile-warnings/style.md
+++ b/packages/svelte/messages/compile-warnings/style.md
@@ -1,3 +1,17 @@
 ## css_unused_selector
 
 > Unused CSS selector "%name%"
+
+Svelte traverses both the template and the `<style>` tag to find out which of the CSS selectors are not used within the template, so it can remove them.
+
+In some situations a selector may target an element that is not 'visible' to the compiler, for example because it is part of an `{@html ...}` tag or you're overriding styles in a child component. In these cases, use [`:global`](/docs/svelte/global-styles) to preserve the selector as-is:
+
+```svelte
+<div class="post">{@html content}</div>
+
+<style>
+  .post :global {
+    p {...}
+  }
+</style>
+```
diff --git a/packages/svelte/messages/compile-warnings/template.md b/packages/svelte/messages/compile-warnings/template.md
index 690681c172a3..b15b01241b8c 100644
--- a/packages/svelte/messages/compile-warnings/template.md
+++ b/packages/svelte/messages/compile-warnings/template.md
@@ -38,6 +38,8 @@
 
 > Using `on:%name%` to listen to the %name% event is deprecated. Use the event attribute `on%name%` instead
 
+See [the migration guide](v5-migration-guide#Event-changes) for more info.
+
 ## node_invalid_placement_ssr
 
 > %message%. When rendering this component on the server, the resulting HTML will be modified by the browser (by moving, removing, or inserting elements), likely resulting in a `hydration_mismatch` warning
@@ -54,6 +56,12 @@ This code will work when the component is rendered on the client (which is why t
 
 > `context="module"` is deprecated, use the `module` attribute instead
 
+```svelte
+<script ---context="module"--- +++context+++>
+	let foo = 'bar';
+</script>
+```
+
 ## script_unknown_attribute
 
 > Unrecognized attribute — should be one of `generics`, `lang` or `module`. If this exists for a preprocessor, ensure that the preprocessor removes it
@@ -62,6 +70,8 @@ This code will work when the component is rendered on the client (which is why t
 
 > Using `<slot>` to render parent content is deprecated. Use `{@render ...}` tags instead
 
+See [the migration guide](v5-migration-guide#Snippets-instead-of-slots) for more info.
+
 ## svelte_component_deprecated
 
 > `<svelte:component>` is deprecated in runes mode — components are dynamic by default
@@ -104,3 +114,5 @@ A derived value may be used in other contexts:
 ## svelte_self_deprecated
 
 > `<svelte:self>` is deprecated — use self-imports (e.g. `import %name% from './%basename%'`) instead
+
+See [the note in the docs](legacy-svelte-self) for more info.
diff --git a/packages/svelte/messages/server-errors/lifecycle.md b/packages/svelte/messages/server-errors/lifecycle.md
index 80830f79034c..c3acdedf3d25 100644
--- a/packages/svelte/messages/server-errors/lifecycle.md
+++ b/packages/svelte/messages/server-errors/lifecycle.md
@@ -1,3 +1,5 @@
 ## lifecycle_function_unavailable
 
 > `%name%(...)` is not available on the server
+
+Certain methods such as `mount` cannot be invoked while running in a server context. Avoid calling them eagerly, i.e. not during render.
diff --git a/packages/svelte/messages/shared-errors/errors.md b/packages/svelte/messages/shared-errors/errors.md
index ef030c8a1c91..8b4c61303a07 100644
--- a/packages/svelte/messages/shared-errors/errors.md
+++ b/packages/svelte/messages/shared-errors/errors.md
@@ -2,10 +2,52 @@
 
 > Cannot use `{@render children(...)}` if the parent component uses `let:` directives. Consider using a named snippet instead
 
+This error would be thrown in a setup like this:
+
+```svelte
+<!--- file: Parent.svelte --->
+<List {items} let:entry>
+    <span>{entry}</span>
+</List>
+```
+
+```svelte
+<!--- file: List.svelte --->
+<script>
+    let { items, children } = $props();
+</script>
+
+<ul>
+    {#each items as item}
+        <li>{@render children(item)}</li>
+    {/each}
+</ul>
+```
+
+Here, `List.svelte` is using `{@render children(item)` which means it expects `Parent.svelte` to use snippets. Instead, `Parent.svelte` uses the deprecated `let:` directive. This combination of APIs is incompatible, hence the error.
+
 ## lifecycle_outside_component
 
 > `%name%(...)` can only be used during component initialisation
 
+Certain lifecycle methods can only be used during component initialisation. To fix this, make sure you're invoking the method inside the _top level of the instance script_ of your component.
+
+```svelte
+<script>
+    import { onMount } from 'svelte';
+
+    function handleClick() {
+        // This is wrong
+        onMount(() => {})
+    }
+
+    // This is correct
+    onMount(() => {})
+</script>
+
+<button onclick={handleClick}>click me</button>
+```
+
 ## store_invalid_shape
 
 > `%name%` is not a store with a `subscribe` method
diff --git a/packages/svelte/messages/shared-warnings/warnings.md b/packages/svelte/messages/shared-warnings/warnings.md
index c6cc81761ee3..c76fb10cdf8b 100644
--- a/packages/svelte/messages/shared-warnings/warnings.md
+++ b/packages/svelte/messages/shared-warnings/warnings.md
@@ -2,6 +2,8 @@
 
 > `<svelte:element this="%tag%">` is a void element — it cannot have content
 
+Elements such as `<input>` cannot have content, any children passed to these elements will be ignored.
+
 ## state_snapshot_uncloneable
 
 > Value cannot be cloned with `$state.snapshot` — the original value was returned
@@ -9,3 +11,10 @@
 > The following properties cannot be cloned with `$state.snapshot` — the return value contains the originals:
 >
 > %properties%
+
+`$state.snapshot` tries to clone the given value in order to return a reference that no longer changes. Certain objects may not be cloneable, in which case the original value is returned. In the following example, `property` is cloned, but `window` is not, because DOM elements are uncloneable:
+
+```js
+const state = $state({ property: 'this is cloneable', window })
+const snapshot = $state.snapshot();
+```

From 3dcd5a4a3eeed2a3d9c7a4449b928f1c1e2a36a6 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 9 Dec 2024 12:55:39 -0500
Subject: [PATCH 26/62] fix docs (#14635)

---
 documentation/docs/98-reference/.generated/shared-warnings.md | 4 ++--
 packages/svelte/messages/shared-warnings/warnings.md          | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/documentation/docs/98-reference/.generated/shared-warnings.md b/documentation/docs/98-reference/.generated/shared-warnings.md
index 2d23e68948be..f449a4031ebf 100644
--- a/documentation/docs/98-reference/.generated/shared-warnings.md
+++ b/documentation/docs/98-reference/.generated/shared-warnings.md
@@ -23,6 +23,6 @@ The following properties cannot be cloned with `$state.snapshot` — the return
 `$state.snapshot` tries to clone the given value in order to return a reference that no longer changes. Certain objects may not be cloneable, in which case the original value is returned. In the following example, `property` is cloned, but `window` is not, because DOM elements are uncloneable:
 
 ```js
-const state = $state({ property: 'this is cloneable', window })
-const snapshot = $state.snapshot();
+const object = $state({ property: 'this is cloneable', window })
+const snapshot = $state.snapshot(object);
 ```
diff --git a/packages/svelte/messages/shared-warnings/warnings.md b/packages/svelte/messages/shared-warnings/warnings.md
index c76fb10cdf8b..fb27867f9bf3 100644
--- a/packages/svelte/messages/shared-warnings/warnings.md
+++ b/packages/svelte/messages/shared-warnings/warnings.md
@@ -15,6 +15,6 @@ Elements such as `<input>` cannot have content, any children passed to these ele
 `$state.snapshot` tries to clone the given value in order to return a reference that no longer changes. Certain objects may not be cloneable, in which case the original value is returned. In the following example, `property` is cloned, but `window` is not, because DOM elements are uncloneable:
 
 ```js
-const state = $state({ property: 'this is cloneable', window })
-const snapshot = $state.snapshot();
+const object = $state({ property: 'this is cloneable', window })
+const snapshot = $state.snapshot(object);
 ```

From cfc1fb7de8548d62253e0c2e31b1dd43287b89d4 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 9 Dec 2024 19:26:05 +0100
Subject: [PATCH 27/62] chore: provide links to documentation for
 errors/warnings (#14629)

* chore: provide links to documentation for errors/warnings

closes #11305

* changeset

* fix most of the tests

* fix mutations messing with nodes between runs

* more concise

* more test fixes

* last one
---
 .changeset/breezy-feet-knock.md               |   5 +
 .../svelte/scripts/process-messages/index.js  |  12 +-
 .../templates/client-errors.js                |   5 +-
 .../templates/client-warnings.js              |   9 +-
 .../templates/compile-errors.js               |   2 +-
 .../templates/compile-warnings.js             |   2 +-
 .../templates/server-errors.js                |   2 +-
 .../templates/shared-errors.js                |   4 +-
 .../templates/shared-warnings.js              |   8 +-
 packages/svelte/src/compiler/errors.js        | 324 +++++++++---------
 packages/svelte/src/compiler/warnings.js      | 156 ++++-----
 packages/svelte/src/internal/client/errors.js | 105 +++---
 .../svelte/src/internal/client/warnings.js    |  70 ++--
 packages/svelte/src/internal/server/errors.js |   2 +-
 .../svelte/src/internal/shared/clone.test.ts  |   8 +-
 packages/svelte/src/internal/shared/errors.js |  16 +-
 .../svelte/src/internal/shared/warnings.js    |   8 +-
 packages/svelte/tests/compiler-errors/test.ts |  11 +-
 packages/svelte/tests/css/test.ts             |  15 +
 packages/svelte/tests/hydration/test.ts       |   9 +-
 .../impossible-migrate-with-errors/_config.js |   2 +-
 .../output.svelte                             |   3 +-
 .../extended-builtin/_config.js               |   3 +-
 .../svelte/tests/runtime-legacy/shared.ts     |  14 +-
 packages/svelte/tests/validator/test.ts       |  11 +-
 25 files changed, 417 insertions(+), 389 deletions(-)
 create mode 100644 .changeset/breezy-feet-knock.md

diff --git a/.changeset/breezy-feet-knock.md b/.changeset/breezy-feet-knock.md
new file mode 100644
index 000000000000..60e05c9e4ad3
--- /dev/null
+++ b/.changeset/breezy-feet-knock.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: provide links to documentation for errors/warnings
diff --git a/packages/svelte/scripts/process-messages/index.js b/packages/svelte/scripts/process-messages/index.js
index 3360b2480284..bbe257498ecd 100644
--- a/packages/svelte/scripts/process-messages/index.js
+++ b/packages/svelte/scripts/process-messages/index.js
@@ -339,7 +339,7 @@ function transform(name, dest) {
 				};
 
 				for (let i = 0; i < node.expressions.length; i += 1) {
-					const q = node.quasis[i + 1];
+					const q = structuredClone(node.quasis[i + 1]);
 					const e = node.expressions[i];
 
 					if (e.type === 'Literal' && e.value === 'CODE') {
@@ -355,10 +355,12 @@ function transform(name, dest) {
 						}
 
 						if (message.type === 'TemplateLiteral') {
-							quasi.value.raw += message.quasis[0].value.raw + q.value.raw;
-							out.quasis.push(...message.quasis.slice(1));
-							out.expressions.push(...message.expressions);
-							quasi = message.quasis[message.quasis.length - 1];
+							const m = structuredClone(message);
+							quasi.value.raw += m.quasis[0].value.raw;
+							out.quasis.push(...m.quasis.slice(1));
+							out.expressions.push(...m.expressions);
+							quasi = m.quasis[m.quasis.length - 1];
+							quasi.value.raw += q.value.raw;
 							continue;
 						}
 					}
diff --git a/packages/svelte/scripts/process-messages/templates/client-errors.js b/packages/svelte/scripts/process-messages/templates/client-errors.js
index c63a22da96a4..c72e9f9d5e7a 100644
--- a/packages/svelte/scripts/process-messages/templates/client-errors.js
+++ b/packages/svelte/scripts/process-messages/templates/client-errors.js
@@ -7,11 +7,10 @@ import { DEV } from 'esm-env';
  */
 export function CODE(PARAMETER) {
 	if (DEV) {
-		const error = new Error(`${'CODE'}\n${MESSAGE}`);
+		const error = new Error(`${'CODE'}\n${MESSAGE}\nhttps://svelte.dev/e/${'CODE'}`);
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error('CODE');
+		throw new Error(`https://svelte.dev/e/${'CODE'}`);
 	}
 }
diff --git a/packages/svelte/scripts/process-messages/templates/client-warnings.js b/packages/svelte/scripts/process-messages/templates/client-warnings.js
index d40a59ec0c8d..8a9b87b76011 100644
--- a/packages/svelte/scripts/process-messages/templates/client-warnings.js
+++ b/packages/svelte/scripts/process-messages/templates/client-warnings.js
@@ -9,9 +9,12 @@ var normal = 'font-weight: normal';
  */
 export function CODE(PARAMETER) {
 	if (DEV) {
-		console.warn(`%c[svelte] ${'CODE'}\n%c${MESSAGE}`, bold, normal);
+		console.warn(
+			`%c[svelte] ${'CODE'}\n%c${MESSAGE}\nhttps://svelte.dev/e/${'CODE'}`,
+			bold,
+			normal
+		);
 	} else {
-		// TODO print a link to the documentation
-		console.warn('CODE');
+		console.warn(`https://svelte.dev/e/${'CODE'}`);
 	}
 }
diff --git a/packages/svelte/scripts/process-messages/templates/compile-errors.js b/packages/svelte/scripts/process-messages/templates/compile-errors.js
index 0dc30b2c01b3..445f5d14e627 100644
--- a/packages/svelte/scripts/process-messages/templates/compile-errors.js
+++ b/packages/svelte/scripts/process-messages/templates/compile-errors.js
@@ -56,5 +56,5 @@ function e(node, code, message) {
  * @returns {never}
  */
 export function CODE(node, PARAMETER) {
-	e(node, 'CODE', MESSAGE);
+	e(node, 'CODE', `${MESSAGE}\nhttps://svelte.dev/e/${'CODE'}`);
 }
diff --git a/packages/svelte/scripts/process-messages/templates/compile-warnings.js b/packages/svelte/scripts/process-messages/templates/compile-warnings.js
index 8300d803d5d4..e0c970c66409 100644
--- a/packages/svelte/scripts/process-messages/templates/compile-warnings.js
+++ b/packages/svelte/scripts/process-messages/templates/compile-warnings.js
@@ -47,5 +47,5 @@ export const codes = CODES;
  * @param {string} PARAMETER
  */
 export function CODE(node, PARAMETER) {
-	w(node, 'CODE', MESSAGE);
+	w(node, 'CODE', `${MESSAGE}\nhttps://svelte.dev/e/${'CODE'}`);
 }
diff --git a/packages/svelte/scripts/process-messages/templates/server-errors.js b/packages/svelte/scripts/process-messages/templates/server-errors.js
index 302b0941a1b7..6fb792456470 100644
--- a/packages/svelte/scripts/process-messages/templates/server-errors.js
+++ b/packages/svelte/scripts/process-messages/templates/server-errors.js
@@ -4,7 +4,7 @@
  * @returns {never}
  */
 export function CODE(PARAMETER) {
-	const error = new Error(`${'CODE'}\n${MESSAGE}`);
+	const error = new Error(`${'CODE'}\n${MESSAGE}\nhttps://svelte.dev/e/${'CODE'}`);
 	error.name = 'Svelte error';
 	throw error;
 }
diff --git a/packages/svelte/scripts/process-messages/templates/shared-errors.js b/packages/svelte/scripts/process-messages/templates/shared-errors.js
index c63a22da96a4..b90994fd96d8 100644
--- a/packages/svelte/scripts/process-messages/templates/shared-errors.js
+++ b/packages/svelte/scripts/process-messages/templates/shared-errors.js
@@ -7,11 +7,11 @@ import { DEV } from 'esm-env';
  */
 export function CODE(PARAMETER) {
 	if (DEV) {
-		const error = new Error(`${'CODE'}\n${MESSAGE}`);
+		const error = new Error(`${'CODE'}\n${MESSAGE}\nhttps://svelte.dev/e/${'CODE'}`);
 		error.name = 'Svelte error';
 		throw error;
 	} else {
 		// TODO print a link to the documentation
-		throw new Error('CODE');
+		throw new Error(`https://svelte.dev/e/${'CODE'}`);
 	}
 }
diff --git a/packages/svelte/scripts/process-messages/templates/shared-warnings.js b/packages/svelte/scripts/process-messages/templates/shared-warnings.js
index d40a59ec0c8d..0814475a059d 100644
--- a/packages/svelte/scripts/process-messages/templates/shared-warnings.js
+++ b/packages/svelte/scripts/process-messages/templates/shared-warnings.js
@@ -9,9 +9,13 @@ var normal = 'font-weight: normal';
  */
 export function CODE(PARAMETER) {
 	if (DEV) {
-		console.warn(`%c[svelte] ${'CODE'}\n%c${MESSAGE}`, bold, normal);
+		console.warn(
+			`%c[svelte] ${'CODE'}\n%c${MESSAGE}\nhttps://svelte.dev/e/${'CODE'}`,
+			bold,
+			normal
+		);
 	} else {
 		// TODO print a link to the documentation
-		console.warn('CODE');
+		console.warn(`https://svelte.dev/e/${'CODE'}`);
 	}
 }
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index 1a4525ef5cb9..fd509eb3ab75 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -52,7 +52,7 @@ function e(node, code, message) {
  * @returns {never}
  */
 export function options_invalid_value(node, details) {
-	e(node, "options_invalid_value", `Invalid compiler option: ${details}`);
+	e(node, "options_invalid_value", `Invalid compiler option: ${details}\nhttps://svelte.dev/e/options_invalid_value`);
 }
 
 /**
@@ -62,7 +62,7 @@ export function options_invalid_value(node, details) {
  * @returns {never}
  */
 export function options_removed(node, details) {
-	e(node, "options_removed", `Invalid compiler option: ${details}`);
+	e(node, "options_removed", `Invalid compiler option: ${details}\nhttps://svelte.dev/e/options_removed`);
 }
 
 /**
@@ -72,7 +72,7 @@ export function options_removed(node, details) {
  * @returns {never}
  */
 export function options_unrecognised(node, keypath) {
-	e(node, "options_unrecognised", `Unrecognised compiler option ${keypath}`);
+	e(node, "options_unrecognised", `Unrecognised compiler option ${keypath}\nhttps://svelte.dev/e/options_unrecognised`);
 }
 
 /**
@@ -81,7 +81,7 @@ export function options_unrecognised(node, keypath) {
  * @returns {never}
  */
 export function bindable_invalid_location(node) {
-	e(node, "bindable_invalid_location", "`$bindable()` can only be used inside a `$props()` declaration");
+	e(node, "bindable_invalid_location", `\`$bindable()\` can only be used inside a \`$props()\` declaration\nhttps://svelte.dev/e/bindable_invalid_location`);
 }
 
 /**
@@ -91,7 +91,7 @@ export function bindable_invalid_location(node) {
  * @returns {never}
  */
 export function constant_assignment(node, thing) {
-	e(node, "constant_assignment", `Cannot assign to ${thing}`);
+	e(node, "constant_assignment", `Cannot assign to ${thing}\nhttps://svelte.dev/e/constant_assignment`);
 }
 
 /**
@@ -101,7 +101,7 @@ export function constant_assignment(node, thing) {
  * @returns {never}
  */
 export function constant_binding(node, thing) {
-	e(node, "constant_binding", `Cannot bind to ${thing}`);
+	e(node, "constant_binding", `Cannot bind to ${thing}\nhttps://svelte.dev/e/constant_binding`);
 }
 
 /**
@@ -111,7 +111,7 @@ export function constant_binding(node, thing) {
  * @returns {never}
  */
 export function declaration_duplicate(node, name) {
-	e(node, "declaration_duplicate", `\`${name}\` has already been declared`);
+	e(node, "declaration_duplicate", `\`${name}\` has already been declared\nhttps://svelte.dev/e/declaration_duplicate`);
 }
 
 /**
@@ -120,7 +120,7 @@ export function declaration_duplicate(node, name) {
  * @returns {never}
  */
 export function declaration_duplicate_module_import(node) {
-	e(node, "declaration_duplicate_module_import", "Cannot declare a variable with the same name as an import inside `<script module>`");
+	e(node, "declaration_duplicate_module_import", `Cannot declare a variable with the same name as an import inside \`<script module>\`\nhttps://svelte.dev/e/declaration_duplicate_module_import`);
 }
 
 /**
@@ -129,7 +129,7 @@ export function declaration_duplicate_module_import(node) {
  * @returns {never}
  */
 export function derived_invalid_export(node) {
-	e(node, "derived_invalid_export", "Cannot export derived state from a module. To expose the current derived value, export a function returning its value");
+	e(node, "derived_invalid_export", `Cannot export derived state from a module. To expose the current derived value, export a function returning its value\nhttps://svelte.dev/e/derived_invalid_export`);
 }
 
 /**
@@ -138,7 +138,7 @@ export function derived_invalid_export(node) {
  * @returns {never}
  */
 export function dollar_binding_invalid(node) {
-	e(node, "dollar_binding_invalid", "The $ name is reserved, and cannot be used for variables and imports");
+	e(node, "dollar_binding_invalid", `The $ name is reserved, and cannot be used for variables and imports\nhttps://svelte.dev/e/dollar_binding_invalid`);
 }
 
 /**
@@ -147,7 +147,7 @@ export function dollar_binding_invalid(node) {
  * @returns {never}
  */
 export function dollar_prefix_invalid(node) {
-	e(node, "dollar_prefix_invalid", "The $ prefix is reserved, and cannot be used for variables and imports");
+	e(node, "dollar_prefix_invalid", `The $ prefix is reserved, and cannot be used for variables and imports\nhttps://svelte.dev/e/dollar_prefix_invalid`);
 }
 
 /**
@@ -156,7 +156,7 @@ export function dollar_prefix_invalid(node) {
  * @returns {never}
  */
 export function each_item_invalid_assignment(node) {
-	e(node, "each_item_invalid_assignment", "Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. `array[i] = value` instead of `entry = value`)");
+	e(node, "each_item_invalid_assignment", `Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. \`array[i] = value\` instead of \`entry = value\`)\nhttps://svelte.dev/e/each_item_invalid_assignment`);
 }
 
 /**
@@ -165,7 +165,7 @@ export function each_item_invalid_assignment(node) {
  * @returns {never}
  */
 export function effect_invalid_placement(node) {
-	e(node, "effect_invalid_placement", "`$effect()` can only be used as an expression statement");
+	e(node, "effect_invalid_placement", `\`$effect()\` can only be used as an expression statement\nhttps://svelte.dev/e/effect_invalid_placement`);
 }
 
 /**
@@ -175,7 +175,7 @@ export function effect_invalid_placement(node) {
  * @returns {never}
  */
 export function export_undefined(node, name) {
-	e(node, "export_undefined", `\`${name}\` is not defined`);
+	e(node, "export_undefined", `\`${name}\` is not defined\nhttps://svelte.dev/e/export_undefined`);
 }
 
 /**
@@ -185,7 +185,7 @@ export function export_undefined(node, name) {
  * @returns {never}
  */
 export function global_reference_invalid(node, name) {
-	e(node, "global_reference_invalid", `\`${name}\` is an illegal variable name. To reference a global variable called \`${name}\`, use \`globalThis.${name}\``);
+	e(node, "global_reference_invalid", `\`${name}\` is an illegal variable name. To reference a global variable called \`${name}\`, use \`globalThis.${name}\`\nhttps://svelte.dev/e/global_reference_invalid`);
 }
 
 /**
@@ -194,7 +194,7 @@ export function global_reference_invalid(node, name) {
  * @returns {never}
  */
 export function host_invalid_placement(node) {
-	e(node, "host_invalid_placement", "`$host()` can only be used inside custom element component instances");
+	e(node, "host_invalid_placement", `\`$host()\` can only be used inside custom element component instances\nhttps://svelte.dev/e/host_invalid_placement`);
 }
 
 /**
@@ -203,7 +203,7 @@ export function host_invalid_placement(node) {
  * @returns {never}
  */
 export function import_svelte_internal_forbidden(node) {
-	e(node, "import_svelte_internal_forbidden", "Imports of `svelte/internal/*` are forbidden. It contains private runtime code which is subject to change without notice. If you're importing from `svelte/internal/*` to work around a limitation of Svelte, please open an issue at https://github.com/sveltejs/svelte and explain your use case");
+	e(node, "import_svelte_internal_forbidden", `Imports of \`svelte/internal/*\` are forbidden. It contains private runtime code which is subject to change without notice. If you're importing from \`svelte/internal/*\` to work around a limitation of Svelte, please open an issue at https://github.com/sveltejs/svelte and explain your use case\nhttps://svelte.dev/e/import_svelte_internal_forbidden`);
 }
 
 /**
@@ -212,7 +212,7 @@ export function import_svelte_internal_forbidden(node) {
  * @returns {never}
  */
 export function invalid_arguments_usage(node) {
-	e(node, "invalid_arguments_usage", "The arguments keyword cannot be used within the template or at the top level of a component");
+	e(node, "invalid_arguments_usage", `The arguments keyword cannot be used within the template or at the top level of a component\nhttps://svelte.dev/e/invalid_arguments_usage`);
 }
 
 /**
@@ -221,7 +221,7 @@ export function invalid_arguments_usage(node) {
  * @returns {never}
  */
 export function legacy_export_invalid(node) {
-	e(node, "legacy_export_invalid", "Cannot use `export let` in runes mode — use `$props()` instead");
+	e(node, "legacy_export_invalid", `Cannot use \`export let\` in runes mode — use \`$props()\` instead\nhttps://svelte.dev/e/legacy_export_invalid`);
 }
 
 /**
@@ -230,7 +230,7 @@ export function legacy_export_invalid(node) {
  * @returns {never}
  */
 export function legacy_props_invalid(node) {
-	e(node, "legacy_props_invalid", "Cannot use `$$props` in runes mode");
+	e(node, "legacy_props_invalid", `Cannot use \`$$props\` in runes mode\nhttps://svelte.dev/e/legacy_props_invalid`);
 }
 
 /**
@@ -239,7 +239,7 @@ export function legacy_props_invalid(node) {
  * @returns {never}
  */
 export function legacy_reactive_statement_invalid(node) {
-	e(node, "legacy_reactive_statement_invalid", "`$:` is not allowed in runes mode, use `$derived` or `$effect` instead");
+	e(node, "legacy_reactive_statement_invalid", `\`$:\` is not allowed in runes mode, use \`$derived\` or \`$effect\` instead\nhttps://svelte.dev/e/legacy_reactive_statement_invalid`);
 }
 
 /**
@@ -248,7 +248,7 @@ export function legacy_reactive_statement_invalid(node) {
  * @returns {never}
  */
 export function legacy_rest_props_invalid(node) {
-	e(node, "legacy_rest_props_invalid", "Cannot use `$$restProps` in runes mode");
+	e(node, "legacy_rest_props_invalid", `Cannot use \`$$restProps\` in runes mode\nhttps://svelte.dev/e/legacy_rest_props_invalid`);
 }
 
 /**
@@ -257,7 +257,7 @@ export function legacy_rest_props_invalid(node) {
  * @returns {never}
  */
 export function module_illegal_default_export(node) {
-	e(node, "module_illegal_default_export", "A component cannot have a default export");
+	e(node, "module_illegal_default_export", `A component cannot have a default export\nhttps://svelte.dev/e/module_illegal_default_export`);
 }
 
 /**
@@ -266,7 +266,7 @@ export function module_illegal_default_export(node) {
  * @returns {never}
  */
 export function props_duplicate(node) {
-	e(node, "props_duplicate", "Cannot use `$props()` more than once");
+	e(node, "props_duplicate", `Cannot use \`$props()\` more than once\nhttps://svelte.dev/e/props_duplicate`);
 }
 
 /**
@@ -275,7 +275,7 @@ export function props_duplicate(node) {
  * @returns {never}
  */
 export function props_illegal_name(node) {
-	e(node, "props_illegal_name", "Declaring or accessing a prop starting with `$$` is illegal (they are reserved for Svelte internals)");
+	e(node, "props_illegal_name", `Declaring or accessing a prop starting with \`$$\` is illegal (they are reserved for Svelte internals)\nhttps://svelte.dev/e/props_illegal_name`);
 }
 
 /**
@@ -284,7 +284,7 @@ export function props_illegal_name(node) {
  * @returns {never}
  */
 export function props_invalid_identifier(node) {
-	e(node, "props_invalid_identifier", "`$props()` can only be used with an object destructuring pattern");
+	e(node, "props_invalid_identifier", `\`$props()\` can only be used with an object destructuring pattern\nhttps://svelte.dev/e/props_invalid_identifier`);
 }
 
 /**
@@ -293,7 +293,7 @@ export function props_invalid_identifier(node) {
  * @returns {never}
  */
 export function props_invalid_pattern(node) {
-	e(node, "props_invalid_pattern", "`$props()` assignment must not contain nested properties or computed keys");
+	e(node, "props_invalid_pattern", `\`$props()\` assignment must not contain nested properties or computed keys\nhttps://svelte.dev/e/props_invalid_pattern`);
 }
 
 /**
@@ -302,7 +302,7 @@ export function props_invalid_pattern(node) {
  * @returns {never}
  */
 export function props_invalid_placement(node) {
-	e(node, "props_invalid_placement", "`$props()` can only be used at the top level of components as a variable declaration initializer");
+	e(node, "props_invalid_placement", `\`$props()\` can only be used at the top level of components as a variable declaration initializer\nhttps://svelte.dev/e/props_invalid_placement`);
 }
 
 /**
@@ -312,7 +312,7 @@ export function props_invalid_placement(node) {
  * @returns {never}
  */
 export function reactive_declaration_cycle(node, cycle) {
-	e(node, "reactive_declaration_cycle", `Cyclical dependency detected: ${cycle}`);
+	e(node, "reactive_declaration_cycle", `Cyclical dependency detected: ${cycle}\nhttps://svelte.dev/e/reactive_declaration_cycle`);
 }
 
 /**
@@ -322,7 +322,7 @@ export function reactive_declaration_cycle(node, cycle) {
  * @returns {never}
  */
 export function rune_invalid_arguments(node, rune) {
-	e(node, "rune_invalid_arguments", `\`${rune}\` cannot be called with arguments`);
+	e(node, "rune_invalid_arguments", `\`${rune}\` cannot be called with arguments\nhttps://svelte.dev/e/rune_invalid_arguments`);
 }
 
 /**
@@ -333,7 +333,7 @@ export function rune_invalid_arguments(node, rune) {
  * @returns {never}
  */
 export function rune_invalid_arguments_length(node, rune, args) {
-	e(node, "rune_invalid_arguments_length", `\`${rune}\` must be called with ${args}`);
+	e(node, "rune_invalid_arguments_length", `\`${rune}\` must be called with ${args}\nhttps://svelte.dev/e/rune_invalid_arguments_length`);
 }
 
 /**
@@ -342,7 +342,7 @@ export function rune_invalid_arguments_length(node, rune, args) {
  * @returns {never}
  */
 export function rune_invalid_computed_property(node) {
-	e(node, "rune_invalid_computed_property", "Cannot access a computed property of a rune");
+	e(node, "rune_invalid_computed_property", `Cannot access a computed property of a rune\nhttps://svelte.dev/e/rune_invalid_computed_property`);
 }
 
 /**
@@ -352,7 +352,7 @@ export function rune_invalid_computed_property(node) {
  * @returns {never}
  */
 export function rune_invalid_name(node, name) {
-	e(node, "rune_invalid_name", `\`${name}\` is not a valid rune`);
+	e(node, "rune_invalid_name", `\`${name}\` is not a valid rune\nhttps://svelte.dev/e/rune_invalid_name`);
 }
 
 /**
@@ -362,7 +362,7 @@ export function rune_invalid_name(node, name) {
  * @returns {never}
  */
 export function rune_invalid_usage(node, rune) {
-	e(node, "rune_invalid_usage", `Cannot use \`${rune}\` rune in non-runes mode`);
+	e(node, "rune_invalid_usage", `Cannot use \`${rune}\` rune in non-runes mode\nhttps://svelte.dev/e/rune_invalid_usage`);
 }
 
 /**
@@ -371,7 +371,7 @@ export function rune_invalid_usage(node, rune) {
  * @returns {never}
  */
 export function rune_missing_parentheses(node) {
-	e(node, "rune_missing_parentheses", "Cannot use rune without parentheses");
+	e(node, "rune_missing_parentheses", `Cannot use rune without parentheses\nhttps://svelte.dev/e/rune_missing_parentheses`);
 }
 
 /**
@@ -381,7 +381,7 @@ export function rune_missing_parentheses(node) {
  * @returns {never}
  */
 export function rune_removed(node, name) {
-	e(node, "rune_removed", `The \`${name}\` rune has been removed`);
+	e(node, "rune_removed", `The \`${name}\` rune has been removed\nhttps://svelte.dev/e/rune_removed`);
 }
 
 /**
@@ -392,7 +392,7 @@ export function rune_removed(node, name) {
  * @returns {never}
  */
 export function rune_renamed(node, name, replacement) {
-	e(node, "rune_renamed", `\`${name}\` is now \`${replacement}\``);
+	e(node, "rune_renamed", `\`${name}\` is now \`${replacement}\`\nhttps://svelte.dev/e/rune_renamed`);
 }
 
 /**
@@ -402,7 +402,7 @@ export function rune_renamed(node, name, replacement) {
  * @returns {never}
  */
 export function runes_mode_invalid_import(node, name) {
-	e(node, "runes_mode_invalid_import", `${name} cannot be used in runes mode`);
+	e(node, "runes_mode_invalid_import", `${name} cannot be used in runes mode\nhttps://svelte.dev/e/runes_mode_invalid_import`);
 }
 
 /**
@@ -411,7 +411,7 @@ export function runes_mode_invalid_import(node, name) {
  * @returns {never}
  */
 export function snippet_invalid_export(node) {
-	e(node, "snippet_invalid_export", "An exported snippet can only reference things declared in a `<script module>`, or other exportable snippets");
+	e(node, "snippet_invalid_export", `An exported snippet can only reference things declared in a \`<script module>\`, or other exportable snippets\nhttps://svelte.dev/e/snippet_invalid_export`);
 }
 
 /**
@@ -420,7 +420,7 @@ export function snippet_invalid_export(node) {
  * @returns {never}
  */
 export function snippet_parameter_assignment(node) {
-	e(node, "snippet_parameter_assignment", "Cannot reassign or bind to snippet parameter");
+	e(node, "snippet_parameter_assignment", `Cannot reassign or bind to snippet parameter\nhttps://svelte.dev/e/snippet_parameter_assignment`);
 }
 
 /**
@@ -429,7 +429,7 @@ export function snippet_parameter_assignment(node) {
  * @returns {never}
  */
 export function state_invalid_export(node) {
-	e(node, "state_invalid_export", "Cannot export state from a module if it is reassigned. Either export a function returning the state value or only mutate the state value's properties");
+	e(node, "state_invalid_export", `Cannot export state from a module if it is reassigned. Either export a function returning the state value or only mutate the state value's properties\nhttps://svelte.dev/e/state_invalid_export`);
 }
 
 /**
@@ -439,7 +439,7 @@ export function state_invalid_export(node) {
  * @returns {never}
  */
 export function state_invalid_placement(node, rune) {
-	e(node, "state_invalid_placement", `\`${rune}(...)\` can only be used as a variable declaration initializer or a class field`);
+	e(node, "state_invalid_placement", `\`${rune}(...)\` can only be used as a variable declaration initializer or a class field\nhttps://svelte.dev/e/state_invalid_placement`);
 }
 
 /**
@@ -448,7 +448,7 @@ export function state_invalid_placement(node, rune) {
  * @returns {never}
  */
 export function store_invalid_scoped_subscription(node) {
-	e(node, "store_invalid_scoped_subscription", "Cannot subscribe to stores that are not declared at the top level of the component");
+	e(node, "store_invalid_scoped_subscription", `Cannot subscribe to stores that are not declared at the top level of the component\nhttps://svelte.dev/e/store_invalid_scoped_subscription`);
 }
 
 /**
@@ -457,7 +457,7 @@ export function store_invalid_scoped_subscription(node) {
  * @returns {never}
  */
 export function store_invalid_subscription(node) {
-	e(node, "store_invalid_subscription", "Cannot reference store value inside `<script module>`");
+	e(node, "store_invalid_subscription", `Cannot reference store value inside \`<script module>\`\nhttps://svelte.dev/e/store_invalid_subscription`);
 }
 
 /**
@@ -466,7 +466,7 @@ export function store_invalid_subscription(node) {
  * @returns {never}
  */
 export function store_invalid_subscription_module(node) {
-	e(node, "store_invalid_subscription_module", "Cannot reference store value outside a `.svelte` file");
+	e(node, "store_invalid_subscription_module", `Cannot reference store value outside a \`.svelte\` file\nhttps://svelte.dev/e/store_invalid_subscription_module`);
 }
 
 /**
@@ -476,7 +476,7 @@ export function store_invalid_subscription_module(node) {
  * @returns {never}
  */
 export function typescript_invalid_feature(node, feature) {
-	e(node, "typescript_invalid_feature", `TypeScript language features like ${feature} are not natively supported, and their use is generally discouraged. Outside of \`<script>\` tags, these features are not supported. For use within \`<script>\` tags, you will need to use a preprocessor to convert it to JavaScript before it gets passed to the Svelte compiler. If you are using \`vitePreprocess\`, make sure to specifically enable preprocessing script tags (\`vitePreprocess({ script: true })\`)`);
+	e(node, "typescript_invalid_feature", `TypeScript language features like ${feature} are not natively supported, and their use is generally discouraged. Outside of \`<script>\` tags, these features are not supported. For use within \`<script>\` tags, you will need to use a preprocessor to convert it to JavaScript before it gets passed to the Svelte compiler. If you are using \`vitePreprocess\`, make sure to specifically enable preprocessing script tags (\`vitePreprocess({ script: true })\`)\nhttps://svelte.dev/e/typescript_invalid_feature`);
 }
 
 /**
@@ -485,7 +485,7 @@ export function typescript_invalid_feature(node, feature) {
  * @returns {never}
  */
 export function css_empty_declaration(node) {
-	e(node, "css_empty_declaration", "Declaration cannot be empty");
+	e(node, "css_empty_declaration", `Declaration cannot be empty\nhttps://svelte.dev/e/css_empty_declaration`);
 }
 
 /**
@@ -494,7 +494,7 @@ export function css_empty_declaration(node) {
  * @returns {never}
  */
 export function css_expected_identifier(node) {
-	e(node, "css_expected_identifier", "Expected a valid CSS identifier");
+	e(node, "css_expected_identifier", `Expected a valid CSS identifier\nhttps://svelte.dev/e/css_expected_identifier`);
 }
 
 /**
@@ -504,7 +504,7 @@ export function css_expected_identifier(node) {
  * @returns {never}
  */
 export function css_global_block_invalid_combinator(node, name) {
-	e(node, "css_global_block_invalid_combinator", `A \`:global\` selector cannot follow a \`${name}\` combinator`);
+	e(node, "css_global_block_invalid_combinator", `A \`:global\` selector cannot follow a \`${name}\` combinator\nhttps://svelte.dev/e/css_global_block_invalid_combinator`);
 }
 
 /**
@@ -513,7 +513,7 @@ export function css_global_block_invalid_combinator(node, name) {
  * @returns {never}
  */
 export function css_global_block_invalid_declaration(node) {
-	e(node, "css_global_block_invalid_declaration", "A top-level `:global {...}` block can only contain rules, not declarations");
+	e(node, "css_global_block_invalid_declaration", `A top-level \`:global {...}\` block can only contain rules, not declarations\nhttps://svelte.dev/e/css_global_block_invalid_declaration`);
 }
 
 /**
@@ -522,7 +522,7 @@ export function css_global_block_invalid_declaration(node) {
  * @returns {never}
  */
 export function css_global_block_invalid_list(node) {
-	e(node, "css_global_block_invalid_list", "A `:global` selector cannot be part of a selector list with more than one item");
+	e(node, "css_global_block_invalid_list", `A \`:global\` selector cannot be part of a selector list with more than one item\nhttps://svelte.dev/e/css_global_block_invalid_list`);
 }
 
 /**
@@ -531,7 +531,7 @@ export function css_global_block_invalid_list(node) {
  * @returns {never}
  */
 export function css_global_block_invalid_modifier(node) {
-	e(node, "css_global_block_invalid_modifier", "A `:global` selector cannot modify an existing selector");
+	e(node, "css_global_block_invalid_modifier", `A \`:global\` selector cannot modify an existing selector\nhttps://svelte.dev/e/css_global_block_invalid_modifier`);
 }
 
 /**
@@ -540,7 +540,7 @@ export function css_global_block_invalid_modifier(node) {
  * @returns {never}
  */
 export function css_global_block_invalid_modifier_start(node) {
-	e(node, "css_global_block_invalid_modifier_start", "A `:global` selector can only be modified if it is a descendant of other selectors");
+	e(node, "css_global_block_invalid_modifier_start", `A \`:global\` selector can only be modified if it is a descendant of other selectors\nhttps://svelte.dev/e/css_global_block_invalid_modifier_start`);
 }
 
 /**
@@ -549,7 +549,7 @@ export function css_global_block_invalid_modifier_start(node) {
  * @returns {never}
  */
 export function css_global_invalid_placement(node) {
-	e(node, "css_global_invalid_placement", "`:global(...)` can be at the start or end of a selector sequence, but not in the middle");
+	e(node, "css_global_invalid_placement", `\`:global(...)\` can be at the start or end of a selector sequence, but not in the middle\nhttps://svelte.dev/e/css_global_invalid_placement`);
 }
 
 /**
@@ -558,7 +558,7 @@ export function css_global_invalid_placement(node) {
  * @returns {never}
  */
 export function css_global_invalid_selector(node) {
-	e(node, "css_global_invalid_selector", "`:global(...)` must contain exactly one selector");
+	e(node, "css_global_invalid_selector", `\`:global(...)\` must contain exactly one selector\nhttps://svelte.dev/e/css_global_invalid_selector`);
 }
 
 /**
@@ -567,7 +567,7 @@ export function css_global_invalid_selector(node) {
  * @returns {never}
  */
 export function css_global_invalid_selector_list(node) {
-	e(node, "css_global_invalid_selector_list", "`:global(...)` must not contain type or universal selectors when used in a compound selector");
+	e(node, "css_global_invalid_selector_list", `\`:global(...)\` must not contain type or universal selectors when used in a compound selector\nhttps://svelte.dev/e/css_global_invalid_selector_list`);
 }
 
 /**
@@ -576,7 +576,7 @@ export function css_global_invalid_selector_list(node) {
  * @returns {never}
  */
 export function css_nesting_selector_invalid_placement(node) {
-	e(node, "css_nesting_selector_invalid_placement", "Nesting selectors can only be used inside a rule or as the first selector inside a lone `:global(...)`");
+	e(node, "css_nesting_selector_invalid_placement", `Nesting selectors can only be used inside a rule or as the first selector inside a lone \`:global(...)\`\nhttps://svelte.dev/e/css_nesting_selector_invalid_placement`);
 }
 
 /**
@@ -585,7 +585,7 @@ export function css_nesting_selector_invalid_placement(node) {
  * @returns {never}
  */
 export function css_selector_invalid(node) {
-	e(node, "css_selector_invalid", "Invalid selector");
+	e(node, "css_selector_invalid", `Invalid selector\nhttps://svelte.dev/e/css_selector_invalid`);
 }
 
 /**
@@ -594,7 +594,7 @@ export function css_selector_invalid(node) {
  * @returns {never}
  */
 export function css_type_selector_invalid_placement(node) {
-	e(node, "css_type_selector_invalid_placement", "`:global(...)` must not be followed by a type selector");
+	e(node, "css_type_selector_invalid_placement", `\`:global(...)\` must not be followed by a type selector\nhttps://svelte.dev/e/css_type_selector_invalid_placement`);
 }
 
 /**
@@ -603,7 +603,7 @@ export function css_type_selector_invalid_placement(node) {
  * @returns {never}
  */
 export function animation_duplicate(node) {
-	e(node, "animation_duplicate", "An element can only have one 'animate' directive");
+	e(node, "animation_duplicate", `An element can only have one 'animate' directive\nhttps://svelte.dev/e/animation_duplicate`);
 }
 
 /**
@@ -612,7 +612,7 @@ export function animation_duplicate(node) {
  * @returns {never}
  */
 export function animation_invalid_placement(node) {
-	e(node, "animation_invalid_placement", "An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block");
+	e(node, "animation_invalid_placement", `An element that uses the \`animate:\` directive must be the only child of a keyed \`{#each ...}\` block\nhttps://svelte.dev/e/animation_invalid_placement`);
 }
 
 /**
@@ -621,7 +621,7 @@ export function animation_invalid_placement(node) {
  * @returns {never}
  */
 export function animation_missing_key(node) {
-	e(node, "animation_missing_key", "An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block. Did you forget to add a key to your each block?");
+	e(node, "animation_missing_key", `An element that uses the \`animate:\` directive must be the only child of a keyed \`{#each ...}\` block. Did you forget to add a key to your each block?\nhttps://svelte.dev/e/animation_missing_key`);
 }
 
 /**
@@ -630,7 +630,7 @@ export function animation_missing_key(node) {
  * @returns {never}
  */
 export function attribute_contenteditable_dynamic(node) {
-	e(node, "attribute_contenteditable_dynamic", "'contenteditable' attribute cannot be dynamic if element uses two-way binding");
+	e(node, "attribute_contenteditable_dynamic", `'contenteditable' attribute cannot be dynamic if element uses two-way binding\nhttps://svelte.dev/e/attribute_contenteditable_dynamic`);
 }
 
 /**
@@ -639,7 +639,7 @@ export function attribute_contenteditable_dynamic(node) {
  * @returns {never}
  */
 export function attribute_contenteditable_missing(node) {
-	e(node, "attribute_contenteditable_missing", "'contenteditable' attribute is required for textContent, innerHTML and innerText two-way bindings");
+	e(node, "attribute_contenteditable_missing", `'contenteditable' attribute is required for textContent, innerHTML and innerText two-way bindings\nhttps://svelte.dev/e/attribute_contenteditable_missing`);
 }
 
 /**
@@ -648,7 +648,7 @@ export function attribute_contenteditable_missing(node) {
  * @returns {never}
  */
 export function attribute_duplicate(node) {
-	e(node, "attribute_duplicate", "Attributes need to be unique");
+	e(node, "attribute_duplicate", `Attributes need to be unique\nhttps://svelte.dev/e/attribute_duplicate`);
 }
 
 /**
@@ -657,7 +657,7 @@ export function attribute_duplicate(node) {
  * @returns {never}
  */
 export function attribute_empty_shorthand(node) {
-	e(node, "attribute_empty_shorthand", "Attribute shorthand cannot be empty");
+	e(node, "attribute_empty_shorthand", `Attribute shorthand cannot be empty\nhttps://svelte.dev/e/attribute_empty_shorthand`);
 }
 
 /**
@@ -666,7 +666,7 @@ export function attribute_empty_shorthand(node) {
  * @returns {never}
  */
 export function attribute_invalid_event_handler(node) {
-	e(node, "attribute_invalid_event_handler", "Event attribute must be a JavaScript expression, not a string");
+	e(node, "attribute_invalid_event_handler", `Event attribute must be a JavaScript expression, not a string\nhttps://svelte.dev/e/attribute_invalid_event_handler`);
 }
 
 /**
@@ -675,7 +675,7 @@ export function attribute_invalid_event_handler(node) {
  * @returns {never}
  */
 export function attribute_invalid_multiple(node) {
-	e(node, "attribute_invalid_multiple", "'multiple' attribute must be static if select uses two-way binding");
+	e(node, "attribute_invalid_multiple", `'multiple' attribute must be static if select uses two-way binding\nhttps://svelte.dev/e/attribute_invalid_multiple`);
 }
 
 /**
@@ -685,7 +685,7 @@ export function attribute_invalid_multiple(node) {
  * @returns {never}
  */
 export function attribute_invalid_name(node, name) {
-	e(node, "attribute_invalid_name", `'${name}' is not a valid attribute name`);
+	e(node, "attribute_invalid_name", `'${name}' is not a valid attribute name\nhttps://svelte.dev/e/attribute_invalid_name`);
 }
 
 /**
@@ -694,7 +694,7 @@ export function attribute_invalid_name(node, name) {
  * @returns {never}
  */
 export function attribute_invalid_sequence_expression(node) {
-	e(node, "attribute_invalid_sequence_expression", "Sequence expressions are not allowed as attribute/directive values in runes mode, unless wrapped in parentheses");
+	e(node, "attribute_invalid_sequence_expression", `Sequence expressions are not allowed as attribute/directive values in runes mode, unless wrapped in parentheses\nhttps://svelte.dev/e/attribute_invalid_sequence_expression`);
 }
 
 /**
@@ -703,7 +703,7 @@ export function attribute_invalid_sequence_expression(node) {
  * @returns {never}
  */
 export function attribute_invalid_type(node) {
-	e(node, "attribute_invalid_type", "'type' attribute must be a static text value if input uses two-way binding");
+	e(node, "attribute_invalid_type", `'type' attribute must be a static text value if input uses two-way binding\nhttps://svelte.dev/e/attribute_invalid_type`);
 }
 
 /**
@@ -712,7 +712,7 @@ export function attribute_invalid_type(node) {
  * @returns {never}
  */
 export function attribute_unquoted_sequence(node) {
-	e(node, "attribute_unquoted_sequence", "Attribute values containing `{...}` must be enclosed in quote marks, unless the value only contains the expression");
+	e(node, "attribute_unquoted_sequence", `Attribute values containing \`{...}\` must be enclosed in quote marks, unless the value only contains the expression\nhttps://svelte.dev/e/attribute_unquoted_sequence`);
 }
 
 /**
@@ -721,7 +721,7 @@ export function attribute_unquoted_sequence(node) {
  * @returns {never}
  */
 export function bind_group_invalid_expression(node) {
-	e(node, "bind_group_invalid_expression", "`bind:group` can only bind to an Identifier or MemberExpression");
+	e(node, "bind_group_invalid_expression", `\`bind:group\` can only bind to an Identifier or MemberExpression\nhttps://svelte.dev/e/bind_group_invalid_expression`);
 }
 
 /**
@@ -730,7 +730,7 @@ export function bind_group_invalid_expression(node) {
  * @returns {never}
  */
 export function bind_invalid_expression(node) {
-	e(node, "bind_invalid_expression", "Can only bind to an Identifier or MemberExpression or a `{get, set}` pair");
+	e(node, "bind_invalid_expression", `Can only bind to an Identifier or MemberExpression or a \`{get, set}\` pair\nhttps://svelte.dev/e/bind_invalid_expression`);
 }
 
 /**
@@ -741,7 +741,7 @@ export function bind_invalid_expression(node) {
  * @returns {never}
  */
 export function bind_invalid_name(node, name, explanation) {
-	e(node, "bind_invalid_name", explanation ? `\`bind:${name}\` is not a valid binding. ${explanation}` : `\`bind:${name}\` is not a valid binding`);
+	e(node, "bind_invalid_name", `${explanation ? `\`bind:${name}\` is not a valid binding. ${explanation}` : `\`bind:${name}\` is not a valid binding`}\nhttps://svelte.dev/e/bind_invalid_name`);
 }
 
 /**
@@ -751,7 +751,7 @@ export function bind_invalid_name(node, name, explanation) {
  * @returns {never}
  */
 export function bind_invalid_parens(node, name) {
-	e(node, "bind_invalid_parens", `\`bind:${name}={get, set}\` must not have surrounding parentheses`);
+	e(node, "bind_invalid_parens", `\`bind:${name}={get, set}\` must not have surrounding parentheses\nhttps://svelte.dev/e/bind_invalid_parens`);
 }
 
 /**
@@ -762,7 +762,7 @@ export function bind_invalid_parens(node, name) {
  * @returns {never}
  */
 export function bind_invalid_target(node, name, elements) {
-	e(node, "bind_invalid_target", `\`bind:${name}\` can only be used with ${elements}`);
+	e(node, "bind_invalid_target", `\`bind:${name}\` can only be used with ${elements}\nhttps://svelte.dev/e/bind_invalid_target`);
 }
 
 /**
@@ -771,7 +771,7 @@ export function bind_invalid_target(node, name, elements) {
  * @returns {never}
  */
 export function bind_invalid_value(node) {
-	e(node, "bind_invalid_value", "Can only bind to state or props");
+	e(node, "bind_invalid_value", `Can only bind to state or props\nhttps://svelte.dev/e/bind_invalid_value`);
 }
 
 /**
@@ -781,7 +781,7 @@ export function bind_invalid_value(node) {
  * @returns {never}
  */
 export function block_duplicate_clause(node, name) {
-	e(node, "block_duplicate_clause", `${name} cannot appear more than once within a block`);
+	e(node, "block_duplicate_clause", `${name} cannot appear more than once within a block\nhttps://svelte.dev/e/block_duplicate_clause`);
 }
 
 /**
@@ -790,7 +790,7 @@ export function block_duplicate_clause(node, name) {
  * @returns {never}
  */
 export function block_invalid_continuation_placement(node) {
-	e(node, "block_invalid_continuation_placement", "{:...} block is invalid at this position (did you forget to close the preceding element or block?)");
+	e(node, "block_invalid_continuation_placement", `{:...} block is invalid at this position (did you forget to close the preceding element or block?)\nhttps://svelte.dev/e/block_invalid_continuation_placement`);
 }
 
 /**
@@ -799,7 +799,7 @@ export function block_invalid_continuation_placement(node) {
  * @returns {never}
  */
 export function block_invalid_elseif(node) {
-	e(node, "block_invalid_elseif", "'elseif' should be 'else if'");
+	e(node, "block_invalid_elseif", `'elseif' should be 'else if'\nhttps://svelte.dev/e/block_invalid_elseif`);
 }
 
 /**
@@ -810,7 +810,7 @@ export function block_invalid_elseif(node) {
  * @returns {never}
  */
 export function block_invalid_placement(node, name, location) {
-	e(node, "block_invalid_placement", `{#${name} ...} block cannot be ${location}`);
+	e(node, "block_invalid_placement", `{#${name} ...} block cannot be ${location}\nhttps://svelte.dev/e/block_invalid_placement`);
 }
 
 /**
@@ -819,7 +819,7 @@ export function block_invalid_placement(node, name, location) {
  * @returns {never}
  */
 export function block_unclosed(node) {
-	e(node, "block_unclosed", "Block was left open");
+	e(node, "block_unclosed", `Block was left open\nhttps://svelte.dev/e/block_unclosed`);
 }
 
 /**
@@ -829,7 +829,7 @@ export function block_unclosed(node) {
  * @returns {never}
  */
 export function block_unexpected_character(node, character) {
-	e(node, "block_unexpected_character", `Expected a \`${character}\` character immediately following the opening bracket`);
+	e(node, "block_unexpected_character", `Expected a \`${character}\` character immediately following the opening bracket\nhttps://svelte.dev/e/block_unexpected_character`);
 }
 
 /**
@@ -838,7 +838,7 @@ export function block_unexpected_character(node, character) {
  * @returns {never}
  */
 export function block_unexpected_close(node) {
-	e(node, "block_unexpected_close", "Unexpected block closing tag");
+	e(node, "block_unexpected_close", `Unexpected block closing tag\nhttps://svelte.dev/e/block_unexpected_close`);
 }
 
 /**
@@ -847,7 +847,7 @@ export function block_unexpected_close(node) {
  * @returns {never}
  */
 export function component_invalid_directive(node) {
-	e(node, "component_invalid_directive", "This type of directive is not valid on components");
+	e(node, "component_invalid_directive", `This type of directive is not valid on components\nhttps://svelte.dev/e/component_invalid_directive`);
 }
 
 /**
@@ -857,7 +857,7 @@ export function component_invalid_directive(node) {
  * @returns {never}
  */
 export function const_tag_cycle(node, cycle) {
-	e(node, "const_tag_cycle", `Cyclical dependency detected: ${cycle}`);
+	e(node, "const_tag_cycle", `Cyclical dependency detected: ${cycle}\nhttps://svelte.dev/e/const_tag_cycle`);
 }
 
 /**
@@ -866,7 +866,7 @@ export function const_tag_cycle(node, cycle) {
  * @returns {never}
  */
 export function const_tag_invalid_expression(node) {
-	e(node, "const_tag_invalid_expression", "{@const ...} must consist of a single variable declaration");
+	e(node, "const_tag_invalid_expression", `{@const ...} must consist of a single variable declaration\nhttps://svelte.dev/e/const_tag_invalid_expression`);
 }
 
 /**
@@ -875,7 +875,7 @@ export function const_tag_invalid_expression(node) {
  * @returns {never}
  */
 export function const_tag_invalid_placement(node) {
-	e(node, "const_tag_invalid_placement", "`{@const}` must be the immediate child of `{#snippet}`, `{#if}`, `{:else if}`, `{:else}`, `{#each}`, `{:then}`, `{:catch}`, `<svelte:fragment>` or `<Component>`");
+	e(node, "const_tag_invalid_placement", `\`{@const}\` must be the immediate child of \`{#snippet}\`, \`{#if}\`, \`{:else if}\`, \`{:else}\`, \`{#each}\`, \`{:then}\`, \`{:catch}\`, \`<svelte:fragment>\` or \`<Component>\`\nhttps://svelte.dev/e/const_tag_invalid_placement`);
 }
 
 /**
@@ -884,7 +884,7 @@ export function const_tag_invalid_placement(node) {
  * @returns {never}
  */
 export function debug_tag_invalid_arguments(node) {
-	e(node, "debug_tag_invalid_arguments", "{@debug ...} arguments must be identifiers, not arbitrary expressions");
+	e(node, "debug_tag_invalid_arguments", `{@debug ...} arguments must be identifiers, not arbitrary expressions\nhttps://svelte.dev/e/debug_tag_invalid_arguments`);
 }
 
 /**
@@ -893,7 +893,7 @@ export function debug_tag_invalid_arguments(node) {
  * @returns {never}
  */
 export function directive_invalid_value(node) {
-	e(node, "directive_invalid_value", "Directive value must be a JavaScript expression enclosed in curly braces");
+	e(node, "directive_invalid_value", `Directive value must be a JavaScript expression enclosed in curly braces\nhttps://svelte.dev/e/directive_invalid_value`);
 }
 
 /**
@@ -903,7 +903,7 @@ export function directive_invalid_value(node) {
  * @returns {never}
  */
 export function directive_missing_name(node, type) {
-	e(node, "directive_missing_name", `\`${type}\` name cannot be empty`);
+	e(node, "directive_missing_name", `\`${type}\` name cannot be empty\nhttps://svelte.dev/e/directive_missing_name`);
 }
 
 /**
@@ -913,7 +913,7 @@ export function directive_missing_name(node, type) {
  * @returns {never}
  */
 export function element_invalid_closing_tag(node, name) {
-	e(node, "element_invalid_closing_tag", `\`</${name}>\` attempted to close an element that was not open`);
+	e(node, "element_invalid_closing_tag", `\`</${name}>\` attempted to close an element that was not open\nhttps://svelte.dev/e/element_invalid_closing_tag`);
 }
 
 /**
@@ -924,7 +924,7 @@ export function element_invalid_closing_tag(node, name) {
  * @returns {never}
  */
 export function element_invalid_closing_tag_autoclosed(node, name, reason) {
-	e(node, "element_invalid_closing_tag_autoclosed", `\`</${name}>\` attempted to close element that was already automatically closed by \`<${reason}>\` (cannot nest \`<${reason}>\` inside \`<${name}>\`)`);
+	e(node, "element_invalid_closing_tag_autoclosed", `\`</${name}>\` attempted to close element that was already automatically closed by \`<${reason}>\` (cannot nest \`<${reason}>\` inside \`<${name}>\`)\nhttps://svelte.dev/e/element_invalid_closing_tag_autoclosed`);
 }
 
 /**
@@ -934,7 +934,7 @@ export function element_invalid_closing_tag_autoclosed(node, name, reason) {
  * @returns {never}
  */
 export function element_unclosed(node, name) {
-	e(node, "element_unclosed", `\`<${name}>\` was left open`);
+	e(node, "element_unclosed", `\`<${name}>\` was left open\nhttps://svelte.dev/e/element_unclosed`);
 }
 
 /**
@@ -943,7 +943,7 @@ export function element_unclosed(node, name) {
  * @returns {never}
  */
 export function event_handler_invalid_component_modifier(node) {
-	e(node, "event_handler_invalid_component_modifier", "Event modifiers other than 'once' can only be used on DOM elements");
+	e(node, "event_handler_invalid_component_modifier", `Event modifiers other than 'once' can only be used on DOM elements\nhttps://svelte.dev/e/event_handler_invalid_component_modifier`);
 }
 
 /**
@@ -953,7 +953,7 @@ export function event_handler_invalid_component_modifier(node) {
  * @returns {never}
  */
 export function event_handler_invalid_modifier(node, list) {
-	e(node, "event_handler_invalid_modifier", `Valid event modifiers are ${list}`);
+	e(node, "event_handler_invalid_modifier", `Valid event modifiers are ${list}\nhttps://svelte.dev/e/event_handler_invalid_modifier`);
 }
 
 /**
@@ -964,7 +964,7 @@ export function event_handler_invalid_modifier(node, list) {
  * @returns {never}
  */
 export function event_handler_invalid_modifier_combination(node, modifier1, modifier2) {
-	e(node, "event_handler_invalid_modifier_combination", `The '${modifier1}' and '${modifier2}' modifiers cannot be used together`);
+	e(node, "event_handler_invalid_modifier_combination", `The '${modifier1}' and '${modifier2}' modifiers cannot be used together\nhttps://svelte.dev/e/event_handler_invalid_modifier_combination`);
 }
 
 /**
@@ -973,7 +973,7 @@ export function event_handler_invalid_modifier_combination(node, modifier1, modi
  * @returns {never}
  */
 export function expected_attribute_value(node) {
-	e(node, "expected_attribute_value", "Expected attribute value");
+	e(node, "expected_attribute_value", `Expected attribute value\nhttps://svelte.dev/e/expected_attribute_value`);
 }
 
 /**
@@ -982,7 +982,7 @@ export function expected_attribute_value(node) {
  * @returns {never}
  */
 export function expected_block_type(node) {
-	e(node, "expected_block_type", "Expected 'if', 'each', 'await', 'key' or 'snippet'");
+	e(node, "expected_block_type", `Expected 'if', 'each', 'await', 'key' or 'snippet'\nhttps://svelte.dev/e/expected_block_type`);
 }
 
 /**
@@ -991,7 +991,7 @@ export function expected_block_type(node) {
  * @returns {never}
  */
 export function expected_identifier(node) {
-	e(node, "expected_identifier", "Expected an identifier");
+	e(node, "expected_identifier", `Expected an identifier\nhttps://svelte.dev/e/expected_identifier`);
 }
 
 /**
@@ -1000,7 +1000,7 @@ export function expected_identifier(node) {
  * @returns {never}
  */
 export function expected_pattern(node) {
-	e(node, "expected_pattern", "Expected identifier or destructure pattern");
+	e(node, "expected_pattern", `Expected identifier or destructure pattern\nhttps://svelte.dev/e/expected_pattern`);
 }
 
 /**
@@ -1010,7 +1010,7 @@ export function expected_pattern(node) {
  * @returns {never}
  */
 export function expected_token(node, token) {
-	e(node, "expected_token", `Expected token ${token}`);
+	e(node, "expected_token", `Expected token ${token}\nhttps://svelte.dev/e/expected_token`);
 }
 
 /**
@@ -1019,7 +1019,7 @@ export function expected_token(node, token) {
  * @returns {never}
  */
 export function expected_whitespace(node) {
-	e(node, "expected_whitespace", "Expected whitespace");
+	e(node, "expected_whitespace", `Expected whitespace\nhttps://svelte.dev/e/expected_whitespace`);
 }
 
 /**
@@ -1029,7 +1029,7 @@ export function expected_whitespace(node) {
  * @returns {never}
  */
 export function illegal_element_attribute(node, name) {
-	e(node, "illegal_element_attribute", `\`<${name}>\` does not support non-event attributes or spread attributes`);
+	e(node, "illegal_element_attribute", `\`<${name}>\` does not support non-event attributes or spread attributes\nhttps://svelte.dev/e/illegal_element_attribute`);
 }
 
 /**
@@ -1039,7 +1039,7 @@ export function illegal_element_attribute(node, name) {
  * @returns {never}
  */
 export function js_parse_error(node, message) {
-	e(node, "js_parse_error", `${message}`);
+	e(node, "js_parse_error", `${message}\nhttps://svelte.dev/e/js_parse_error`);
 }
 
 /**
@@ -1048,7 +1048,7 @@ export function js_parse_error(node, message) {
  * @returns {never}
  */
 export function let_directive_invalid_placement(node) {
-	e(node, "let_directive_invalid_placement", "`let:` directive at invalid position");
+	e(node, "let_directive_invalid_placement", `\`let:\` directive at invalid position\nhttps://svelte.dev/e/let_directive_invalid_placement`);
 }
 
 /**
@@ -1058,7 +1058,7 @@ export function let_directive_invalid_placement(node) {
  * @returns {never}
  */
 export function mixed_event_handler_syntaxes(node, name) {
-	e(node, "mixed_event_handler_syntaxes", `Mixing old (on:${name}) and new syntaxes for event handling is not allowed. Use only the on${name} syntax`);
+	e(node, "mixed_event_handler_syntaxes", `Mixing old (on:${name}) and new syntaxes for event handling is not allowed. Use only the on${name} syntax\nhttps://svelte.dev/e/mixed_event_handler_syntaxes`);
 }
 
 /**
@@ -1068,7 +1068,7 @@ export function mixed_event_handler_syntaxes(node, name) {
  * @returns {never}
  */
 export function node_invalid_placement(node, message) {
-	e(node, "node_invalid_placement", `${message}. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.`);
+	e(node, "node_invalid_placement", `${message}. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.\nhttps://svelte.dev/e/node_invalid_placement`);
 }
 
 /**
@@ -1077,7 +1077,7 @@ export function node_invalid_placement(node, message) {
  * @returns {never}
  */
 export function render_tag_invalid_call_expression(node) {
-	e(node, "render_tag_invalid_call_expression", "Calling a snippet function using apply, bind or call is not allowed");
+	e(node, "render_tag_invalid_call_expression", `Calling a snippet function using apply, bind or call is not allowed\nhttps://svelte.dev/e/render_tag_invalid_call_expression`);
 }
 
 /**
@@ -1086,7 +1086,7 @@ export function render_tag_invalid_call_expression(node) {
  * @returns {never}
  */
 export function render_tag_invalid_expression(node) {
-	e(node, "render_tag_invalid_expression", "`{@render ...}` tags can only contain call expressions");
+	e(node, "render_tag_invalid_expression", `\`{@render ...}\` tags can only contain call expressions\nhttps://svelte.dev/e/render_tag_invalid_expression`);
 }
 
 /**
@@ -1095,7 +1095,7 @@ export function render_tag_invalid_expression(node) {
  * @returns {never}
  */
 export function render_tag_invalid_spread_argument(node) {
-	e(node, "render_tag_invalid_spread_argument", "cannot use spread arguments in `{@render ...}` tags");
+	e(node, "render_tag_invalid_spread_argument", `cannot use spread arguments in \`{@render ...}\` tags\nhttps://svelte.dev/e/render_tag_invalid_spread_argument`);
 }
 
 /**
@@ -1104,7 +1104,7 @@ export function render_tag_invalid_spread_argument(node) {
  * @returns {never}
  */
 export function script_duplicate(node) {
-	e(node, "script_duplicate", "A component can have a single top-level `<script>` element and/or a single top-level `<script module>` element");
+	e(node, "script_duplicate", `A component can have a single top-level \`<script>\` element and/or a single top-level \`<script module>\` element\nhttps://svelte.dev/e/script_duplicate`);
 }
 
 /**
@@ -1114,7 +1114,7 @@ export function script_duplicate(node) {
  * @returns {never}
  */
 export function script_invalid_attribute_value(node, name) {
-	e(node, "script_invalid_attribute_value", `If the \`${name}\` attribute is supplied, it must be a boolean attribute`);
+	e(node, "script_invalid_attribute_value", `If the \`${name}\` attribute is supplied, it must be a boolean attribute\nhttps://svelte.dev/e/script_invalid_attribute_value`);
 }
 
 /**
@@ -1123,7 +1123,7 @@ export function script_invalid_attribute_value(node, name) {
  * @returns {never}
  */
 export function script_invalid_context(node) {
-	e(node, "script_invalid_context", "If the context attribute is supplied, its value must be \"module\"");
+	e(node, "script_invalid_context", `If the context attribute is supplied, its value must be "module"\nhttps://svelte.dev/e/script_invalid_context`);
 }
 
 /**
@@ -1133,7 +1133,7 @@ export function script_invalid_context(node) {
  * @returns {never}
  */
 export function script_reserved_attribute(node, name) {
-	e(node, "script_reserved_attribute", `The \`${name}\` attribute is reserved and cannot be used`);
+	e(node, "script_reserved_attribute", `The \`${name}\` attribute is reserved and cannot be used\nhttps://svelte.dev/e/script_reserved_attribute`);
 }
 
 /**
@@ -1144,7 +1144,7 @@ export function script_reserved_attribute(node, name) {
  * @returns {never}
  */
 export function slot_attribute_duplicate(node, name, component) {
-	e(node, "slot_attribute_duplicate", `Duplicate slot name '${name}' in <${component}>`);
+	e(node, "slot_attribute_duplicate", `Duplicate slot name '${name}' in <${component}>\nhttps://svelte.dev/e/slot_attribute_duplicate`);
 }
 
 /**
@@ -1153,7 +1153,7 @@ export function slot_attribute_duplicate(node, name, component) {
  * @returns {never}
  */
 export function slot_attribute_invalid(node) {
-	e(node, "slot_attribute_invalid", "slot attribute must be a static value");
+	e(node, "slot_attribute_invalid", `slot attribute must be a static value\nhttps://svelte.dev/e/slot_attribute_invalid`);
 }
 
 /**
@@ -1162,7 +1162,7 @@ export function slot_attribute_invalid(node) {
  * @returns {never}
  */
 export function slot_attribute_invalid_placement(node) {
-	e(node, "slot_attribute_invalid_placement", "Element with a slot='...' attribute must be a child of a component or a descendant of a custom element");
+	e(node, "slot_attribute_invalid_placement", `Element with a slot='...' attribute must be a child of a component or a descendant of a custom element\nhttps://svelte.dev/e/slot_attribute_invalid_placement`);
 }
 
 /**
@@ -1171,7 +1171,7 @@ export function slot_attribute_invalid_placement(node) {
  * @returns {never}
  */
 export function slot_default_duplicate(node) {
-	e(node, "slot_default_duplicate", "Found default slot content alongside an explicit slot=\"default\"");
+	e(node, "slot_default_duplicate", `Found default slot content alongside an explicit slot="default"\nhttps://svelte.dev/e/slot_default_duplicate`);
 }
 
 /**
@@ -1180,7 +1180,7 @@ export function slot_default_duplicate(node) {
  * @returns {never}
  */
 export function slot_element_invalid_attribute(node) {
-	e(node, "slot_element_invalid_attribute", "`<slot>` can only receive attributes and (optionally) let directives");
+	e(node, "slot_element_invalid_attribute", `\`<slot>\` can only receive attributes and (optionally) let directives\nhttps://svelte.dev/e/slot_element_invalid_attribute`);
 }
 
 /**
@@ -1189,7 +1189,7 @@ export function slot_element_invalid_attribute(node) {
  * @returns {never}
  */
 export function slot_element_invalid_name(node) {
-	e(node, "slot_element_invalid_name", "slot attribute must be a static value");
+	e(node, "slot_element_invalid_name", `slot attribute must be a static value\nhttps://svelte.dev/e/slot_element_invalid_name`);
 }
 
 /**
@@ -1198,7 +1198,7 @@ export function slot_element_invalid_name(node) {
  * @returns {never}
  */
 export function slot_element_invalid_name_default(node) {
-	e(node, "slot_element_invalid_name_default", "`default` is a reserved word — it cannot be used as a slot name");
+	e(node, "slot_element_invalid_name_default", `\`default\` is a reserved word — it cannot be used as a slot name\nhttps://svelte.dev/e/slot_element_invalid_name_default`);
 }
 
 /**
@@ -1207,7 +1207,7 @@ export function slot_element_invalid_name_default(node) {
  * @returns {never}
  */
 export function slot_snippet_conflict(node) {
-	e(node, "slot_snippet_conflict", "Cannot use `<slot>` syntax and `{@render ...}` tags in the same component. Migrate towards `{@render ...}` tags completely");
+	e(node, "slot_snippet_conflict", `Cannot use \`<slot>\` syntax and \`{@render ...}\` tags in the same component. Migrate towards \`{@render ...}\` tags completely\nhttps://svelte.dev/e/slot_snippet_conflict`);
 }
 
 /**
@@ -1216,7 +1216,7 @@ export function slot_snippet_conflict(node) {
  * @returns {never}
  */
 export function snippet_conflict(node) {
-	e(node, "snippet_conflict", "Cannot use explicit children snippet at the same time as implicit children content. Remove either the non-whitespace content or the children snippet block");
+	e(node, "snippet_conflict", `Cannot use explicit children snippet at the same time as implicit children content. Remove either the non-whitespace content or the children snippet block\nhttps://svelte.dev/e/snippet_conflict`);
 }
 
 /**
@@ -1225,7 +1225,7 @@ export function snippet_conflict(node) {
  * @returns {never}
  */
 export function snippet_invalid_rest_parameter(node) {
-	e(node, "snippet_invalid_rest_parameter", "Snippets do not support rest parameters; use an array instead");
+	e(node, "snippet_invalid_rest_parameter", `Snippets do not support rest parameters; use an array instead\nhttps://svelte.dev/e/snippet_invalid_rest_parameter`);
 }
 
 /**
@@ -1235,7 +1235,7 @@ export function snippet_invalid_rest_parameter(node) {
  * @returns {never}
  */
 export function snippet_shadowing_prop(node, prop) {
-	e(node, "snippet_shadowing_prop", `This snippet is shadowing the prop \`${prop}\` with the same name`);
+	e(node, "snippet_shadowing_prop", `This snippet is shadowing the prop \`${prop}\` with the same name\nhttps://svelte.dev/e/snippet_shadowing_prop`);
 }
 
 /**
@@ -1244,7 +1244,7 @@ export function snippet_shadowing_prop(node, prop) {
  * @returns {never}
  */
 export function style_directive_invalid_modifier(node) {
-	e(node, "style_directive_invalid_modifier", "`style:` directive can only use the `important` modifier");
+	e(node, "style_directive_invalid_modifier", `\`style:\` directive can only use the \`important\` modifier\nhttps://svelte.dev/e/style_directive_invalid_modifier`);
 }
 
 /**
@@ -1253,7 +1253,7 @@ export function style_directive_invalid_modifier(node) {
  * @returns {never}
  */
 export function style_duplicate(node) {
-	e(node, "style_duplicate", "A component can have a single top-level `<style>` element");
+	e(node, "style_duplicate", `A component can have a single top-level \`<style>\` element\nhttps://svelte.dev/e/style_duplicate`);
 }
 
 /**
@@ -1262,7 +1262,7 @@ export function style_duplicate(node) {
  * @returns {never}
  */
 export function svelte_body_illegal_attribute(node) {
-	e(node, "svelte_body_illegal_attribute", "`<svelte:body>` does not support non-event attributes or spread attributes");
+	e(node, "svelte_body_illegal_attribute", `\`<svelte:body>\` does not support non-event attributes or spread attributes\nhttps://svelte.dev/e/svelte_body_illegal_attribute`);
 }
 
 /**
@@ -1271,7 +1271,7 @@ export function svelte_body_illegal_attribute(node) {
  * @returns {never}
  */
 export function svelte_boundary_invalid_attribute(node) {
-	e(node, "svelte_boundary_invalid_attribute", "Valid attributes on `<svelte:boundary>` are `onerror` and `failed`");
+	e(node, "svelte_boundary_invalid_attribute", `Valid attributes on \`<svelte:boundary>\` are \`onerror\` and \`failed\`\nhttps://svelte.dev/e/svelte_boundary_invalid_attribute`);
 }
 
 /**
@@ -1280,7 +1280,7 @@ export function svelte_boundary_invalid_attribute(node) {
  * @returns {never}
  */
 export function svelte_boundary_invalid_attribute_value(node) {
-	e(node, "svelte_boundary_invalid_attribute_value", "Attribute value must be a non-string expression");
+	e(node, "svelte_boundary_invalid_attribute_value", `Attribute value must be a non-string expression\nhttps://svelte.dev/e/svelte_boundary_invalid_attribute_value`);
 }
 
 /**
@@ -1289,7 +1289,7 @@ export function svelte_boundary_invalid_attribute_value(node) {
  * @returns {never}
  */
 export function svelte_component_invalid_this(node) {
-	e(node, "svelte_component_invalid_this", "Invalid component definition — must be an `{expression}`");
+	e(node, "svelte_component_invalid_this", `Invalid component definition — must be an \`{expression}\`\nhttps://svelte.dev/e/svelte_component_invalid_this`);
 }
 
 /**
@@ -1298,7 +1298,7 @@ export function svelte_component_invalid_this(node) {
  * @returns {never}
  */
 export function svelte_component_missing_this(node) {
-	e(node, "svelte_component_missing_this", "`<svelte:component>` must have a 'this' attribute");
+	e(node, "svelte_component_missing_this", `\`<svelte:component>\` must have a 'this' attribute\nhttps://svelte.dev/e/svelte_component_missing_this`);
 }
 
 /**
@@ -1307,7 +1307,7 @@ export function svelte_component_missing_this(node) {
  * @returns {never}
  */
 export function svelte_element_missing_this(node) {
-	e(node, "svelte_element_missing_this", "`<svelte:element>` must have a 'this' attribute with a value");
+	e(node, "svelte_element_missing_this", `\`<svelte:element>\` must have a 'this' attribute with a value\nhttps://svelte.dev/e/svelte_element_missing_this`);
 }
 
 /**
@@ -1316,7 +1316,7 @@ export function svelte_element_missing_this(node) {
  * @returns {never}
  */
 export function svelte_fragment_invalid_attribute(node) {
-	e(node, "svelte_fragment_invalid_attribute", "`<svelte:fragment>` can only have a slot attribute and (optionally) a let: directive");
+	e(node, "svelte_fragment_invalid_attribute", `\`<svelte:fragment>\` can only have a slot attribute and (optionally) a let: directive\nhttps://svelte.dev/e/svelte_fragment_invalid_attribute`);
 }
 
 /**
@@ -1325,7 +1325,7 @@ export function svelte_fragment_invalid_attribute(node) {
  * @returns {never}
  */
 export function svelte_fragment_invalid_placement(node) {
-	e(node, "svelte_fragment_invalid_placement", "`<svelte:fragment>` must be the direct child of a component");
+	e(node, "svelte_fragment_invalid_placement", `\`<svelte:fragment>\` must be the direct child of a component\nhttps://svelte.dev/e/svelte_fragment_invalid_placement`);
 }
 
 /**
@@ -1334,7 +1334,7 @@ export function svelte_fragment_invalid_placement(node) {
  * @returns {never}
  */
 export function svelte_head_illegal_attribute(node) {
-	e(node, "svelte_head_illegal_attribute", "`<svelte:head>` cannot have attributes nor directives");
+	e(node, "svelte_head_illegal_attribute", `\`<svelte:head>\` cannot have attributes nor directives\nhttps://svelte.dev/e/svelte_head_illegal_attribute`);
 }
 
 /**
@@ -1344,7 +1344,7 @@ export function svelte_head_illegal_attribute(node) {
  * @returns {never}
  */
 export function svelte_meta_duplicate(node, name) {
-	e(node, "svelte_meta_duplicate", `A component can only have one \`<${name}>\` element`);
+	e(node, "svelte_meta_duplicate", `A component can only have one \`<${name}>\` element\nhttps://svelte.dev/e/svelte_meta_duplicate`);
 }
 
 /**
@@ -1354,7 +1354,7 @@ export function svelte_meta_duplicate(node, name) {
  * @returns {never}
  */
 export function svelte_meta_invalid_content(node, name) {
-	e(node, "svelte_meta_invalid_content", `<${name}> cannot have children`);
+	e(node, "svelte_meta_invalid_content", `<${name}> cannot have children\nhttps://svelte.dev/e/svelte_meta_invalid_content`);
 }
 
 /**
@@ -1364,7 +1364,7 @@ export function svelte_meta_invalid_content(node, name) {
  * @returns {never}
  */
 export function svelte_meta_invalid_placement(node, name) {
-	e(node, "svelte_meta_invalid_placement", `\`<${name}>\` tags cannot be inside elements or blocks`);
+	e(node, "svelte_meta_invalid_placement", `\`<${name}>\` tags cannot be inside elements or blocks\nhttps://svelte.dev/e/svelte_meta_invalid_placement`);
 }
 
 /**
@@ -1374,7 +1374,7 @@ export function svelte_meta_invalid_placement(node, name) {
  * @returns {never}
  */
 export function svelte_meta_invalid_tag(node, list) {
-	e(node, "svelte_meta_invalid_tag", `Valid \`<svelte:...>\` tag names are ${list}`);
+	e(node, "svelte_meta_invalid_tag", `Valid \`<svelte:...>\` tag names are ${list}\nhttps://svelte.dev/e/svelte_meta_invalid_tag`);
 }
 
 /**
@@ -1383,7 +1383,7 @@ export function svelte_meta_invalid_tag(node, list) {
  * @returns {never}
  */
 export function svelte_options_deprecated_tag(node) {
-	e(node, "svelte_options_deprecated_tag", "\"tag\" option is deprecated — use \"customElement\" instead");
+	e(node, "svelte_options_deprecated_tag", `"tag" option is deprecated — use "customElement" instead\nhttps://svelte.dev/e/svelte_options_deprecated_tag`);
 }
 
 /**
@@ -1392,7 +1392,7 @@ export function svelte_options_deprecated_tag(node) {
  * @returns {never}
  */
 export function svelte_options_invalid_attribute(node) {
-	e(node, "svelte_options_invalid_attribute", "`<svelte:options>` can only receive static attributes");
+	e(node, "svelte_options_invalid_attribute", `\`<svelte:options>\` can only receive static attributes\nhttps://svelte.dev/e/svelte_options_invalid_attribute`);
 }
 
 /**
@@ -1402,7 +1402,7 @@ export function svelte_options_invalid_attribute(node) {
  * @returns {never}
  */
 export function svelte_options_invalid_attribute_value(node, list) {
-	e(node, "svelte_options_invalid_attribute_value", `Value must be ${list}, if specified`);
+	e(node, "svelte_options_invalid_attribute_value", `Value must be ${list}, if specified\nhttps://svelte.dev/e/svelte_options_invalid_attribute_value`);
 }
 
 /**
@@ -1411,7 +1411,7 @@ export function svelte_options_invalid_attribute_value(node, list) {
  * @returns {never}
  */
 export function svelte_options_invalid_customelement(node) {
-	e(node, "svelte_options_invalid_customelement", "\"customElement\" must be a string literal defining a valid custom element name or an object of the form { tag?: string; shadow?: \"open\" | \"none\"; props?: { [key: string]: { attribute?: string; reflect?: boolean; type: .. } } }");
+	e(node, "svelte_options_invalid_customelement", `"customElement" must be a string literal defining a valid custom element name or an object of the form { tag?: string; shadow?: "open" | "none"; props?: { [key: string]: { attribute?: string; reflect?: boolean; type: .. } } }\nhttps://svelte.dev/e/svelte_options_invalid_customelement`);
 }
 
 /**
@@ -1420,7 +1420,7 @@ export function svelte_options_invalid_customelement(node) {
  * @returns {never}
  */
 export function svelte_options_invalid_customelement_props(node) {
-	e(node, "svelte_options_invalid_customelement_props", "\"props\" must be a statically analyzable object literal of the form \"{ [key: string]: { attribute?: string; reflect?: boolean; type?: \"String\" | \"Boolean\" | \"Number\" | \"Array\" | \"Object\" }\"");
+	e(node, "svelte_options_invalid_customelement_props", `"props" must be a statically analyzable object literal of the form "{ [key: string]: { attribute?: string; reflect?: boolean; type?: "String" | "Boolean" | "Number" | "Array" | "Object" }"\nhttps://svelte.dev/e/svelte_options_invalid_customelement_props`);
 }
 
 /**
@@ -1429,7 +1429,7 @@ export function svelte_options_invalid_customelement_props(node) {
  * @returns {never}
  */
 export function svelte_options_invalid_customelement_shadow(node) {
-	e(node, "svelte_options_invalid_customelement_shadow", "\"shadow\" must be either \"open\" or \"none\"");
+	e(node, "svelte_options_invalid_customelement_shadow", `"shadow" must be either "open" or "none"\nhttps://svelte.dev/e/svelte_options_invalid_customelement_shadow`);
 }
 
 /**
@@ -1438,7 +1438,7 @@ export function svelte_options_invalid_customelement_shadow(node) {
  * @returns {never}
  */
 export function svelte_options_invalid_tagname(node) {
-	e(node, "svelte_options_invalid_tagname", "Tag name must be lowercase and hyphenated");
+	e(node, "svelte_options_invalid_tagname", `Tag name must be lowercase and hyphenated\nhttps://svelte.dev/e/svelte_options_invalid_tagname`);
 }
 
 /**
@@ -1447,7 +1447,7 @@ export function svelte_options_invalid_tagname(node) {
  * @returns {never}
  */
 export function svelte_options_reserved_tagname(node) {
-	e(node, "svelte_options_reserved_tagname", "Tag name is reserved");
+	e(node, "svelte_options_reserved_tagname", `Tag name is reserved\nhttps://svelte.dev/e/svelte_options_reserved_tagname`);
 }
 
 /**
@@ -1457,7 +1457,7 @@ export function svelte_options_reserved_tagname(node) {
  * @returns {never}
  */
 export function svelte_options_unknown_attribute(node, name) {
-	e(node, "svelte_options_unknown_attribute", `\`<svelte:options>\` unknown attribute '${name}'`);
+	e(node, "svelte_options_unknown_attribute", `\`<svelte:options>\` unknown attribute '${name}'\nhttps://svelte.dev/e/svelte_options_unknown_attribute`);
 }
 
 /**
@@ -1466,7 +1466,7 @@ export function svelte_options_unknown_attribute(node, name) {
  * @returns {never}
  */
 export function svelte_self_invalid_placement(node) {
-	e(node, "svelte_self_invalid_placement", "`<svelte:self>` components can only exist inside `{#if}` blocks, `{#each}` blocks, `{#snippet}` blocks or slots passed to components");
+	e(node, "svelte_self_invalid_placement", `\`<svelte:self>\` components can only exist inside \`{#if}\` blocks, \`{#each}\` blocks, \`{#snippet}\` blocks or slots passed to components\nhttps://svelte.dev/e/svelte_self_invalid_placement`);
 }
 
 /**
@@ -1475,7 +1475,7 @@ export function svelte_self_invalid_placement(node) {
  * @returns {never}
  */
 export function tag_invalid_name(node) {
-	e(node, "tag_invalid_name", "Expected a valid element or component name. Components must have a valid variable name or dot notation expression");
+	e(node, "tag_invalid_name", `Expected a valid element or component name. Components must have a valid variable name or dot notation expression\nhttps://svelte.dev/e/tag_invalid_name`);
 }
 
 /**
@@ -1486,7 +1486,7 @@ export function tag_invalid_name(node) {
  * @returns {never}
  */
 export function tag_invalid_placement(node, name, location) {
-	e(node, "tag_invalid_placement", `{@${name} ...} tag cannot be ${location}`);
+	e(node, "tag_invalid_placement", `{@${name} ...} tag cannot be ${location}\nhttps://svelte.dev/e/tag_invalid_placement`);
 }
 
 /**
@@ -1495,7 +1495,7 @@ export function tag_invalid_placement(node, name, location) {
  * @returns {never}
  */
 export function textarea_invalid_content(node) {
-	e(node, "textarea_invalid_content", "A `<textarea>` can have either a value attribute or (equivalently) child content, but not both");
+	e(node, "textarea_invalid_content", `A \`<textarea>\` can have either a value attribute or (equivalently) child content, but not both\nhttps://svelte.dev/e/textarea_invalid_content`);
 }
 
 /**
@@ -1504,7 +1504,7 @@ export function textarea_invalid_content(node) {
  * @returns {never}
  */
 export function title_illegal_attribute(node) {
-	e(node, "title_illegal_attribute", "`<title>` cannot have attributes nor directives");
+	e(node, "title_illegal_attribute", `\`<title>\` cannot have attributes nor directives\nhttps://svelte.dev/e/title_illegal_attribute`);
 }
 
 /**
@@ -1513,7 +1513,7 @@ export function title_illegal_attribute(node) {
  * @returns {never}
  */
 export function title_invalid_content(node) {
-	e(node, "title_invalid_content", "`<title>` can only contain text and {tags}");
+	e(node, "title_invalid_content", `\`<title>\` can only contain text and {tags}\nhttps://svelte.dev/e/title_invalid_content`);
 }
 
 /**
@@ -1524,7 +1524,7 @@ export function title_invalid_content(node) {
  * @returns {never}
  */
 export function transition_conflict(node, type, existing) {
-	e(node, "transition_conflict", `Cannot use \`${type}:\` alongside existing \`${existing}:\` directive`);
+	e(node, "transition_conflict", `Cannot use \`${type}:\` alongside existing \`${existing}:\` directive\nhttps://svelte.dev/e/transition_conflict`);
 }
 
 /**
@@ -1534,7 +1534,7 @@ export function transition_conflict(node, type, existing) {
  * @returns {never}
  */
 export function transition_duplicate(node, type) {
-	e(node, "transition_duplicate", `Cannot use multiple \`${type}:\` directives on a single element`);
+	e(node, "transition_duplicate", `Cannot use multiple \`${type}:\` directives on a single element\nhttps://svelte.dev/e/transition_duplicate`);
 }
 
 /**
@@ -1543,7 +1543,7 @@ export function transition_duplicate(node, type) {
  * @returns {never}
  */
 export function unexpected_eof(node) {
-	e(node, "unexpected_eof", "Unexpected end of input");
+	e(node, "unexpected_eof", `Unexpected end of input\nhttps://svelte.dev/e/unexpected_eof`);
 }
 
 /**
@@ -1553,7 +1553,7 @@ export function unexpected_eof(node) {
  * @returns {never}
  */
 export function unexpected_reserved_word(node, word) {
-	e(node, "unexpected_reserved_word", `'${word}' is a reserved word in JavaScript and cannot be used here`);
+	e(node, "unexpected_reserved_word", `'${word}' is a reserved word in JavaScript and cannot be used here\nhttps://svelte.dev/e/unexpected_reserved_word`);
 }
 
 /**
@@ -1562,5 +1562,5 @@ export function unexpected_reserved_word(node, word) {
  * @returns {never}
  */
 export function void_element_invalid_content(node) {
-	e(node, "void_element_invalid_content", "Void elements cannot have children or closing tags");
+	e(node, "void_element_invalid_content", `Void elements cannot have children or closing tags\nhttps://svelte.dev/e/void_element_invalid_content`);
 }
\ No newline at end of file
diff --git a/packages/svelte/src/compiler/warnings.js b/packages/svelte/src/compiler/warnings.js
index e193ad0f1109..b9fffc23a553 100644
--- a/packages/svelte/src/compiler/warnings.js
+++ b/packages/svelte/src/compiler/warnings.js
@@ -129,7 +129,7 @@ export const codes = [
  * @param {null | NodeLike} node
  */
 export function a11y_accesskey(node) {
-	w(node, "a11y_accesskey", "Avoid using accesskey");
+	w(node, "a11y_accesskey", `Avoid using accesskey\nhttps://svelte.dev/e/a11y_accesskey`);
 }
 
 /**
@@ -137,7 +137,7 @@ export function a11y_accesskey(node) {
  * @param {null | NodeLike} node
  */
 export function a11y_aria_activedescendant_has_tabindex(node) {
-	w(node, "a11y_aria_activedescendant_has_tabindex", "An element with an aria-activedescendant attribute should have a tabindex value");
+	w(node, "a11y_aria_activedescendant_has_tabindex", `An element with an aria-activedescendant attribute should have a tabindex value\nhttps://svelte.dev/e/a11y_aria_activedescendant_has_tabindex`);
 }
 
 /**
@@ -146,7 +146,7 @@ export function a11y_aria_activedescendant_has_tabindex(node) {
  * @param {string} name
  */
 export function a11y_aria_attributes(node, name) {
-	w(node, "a11y_aria_attributes", `\`<${name}>\` should not have aria-* attributes`);
+	w(node, "a11y_aria_attributes", `\`<${name}>\` should not have aria-* attributes\nhttps://svelte.dev/e/a11y_aria_attributes`);
 }
 
 /**
@@ -156,7 +156,7 @@ export function a11y_aria_attributes(node, name) {
  * @param {string} type
  */
 export function a11y_autocomplete_valid(node, value, type) {
-	w(node, "a11y_autocomplete_valid", `'${value}' is an invalid value for 'autocomplete' on \`<input type="${type}">\``);
+	w(node, "a11y_autocomplete_valid", `'${value}' is an invalid value for 'autocomplete' on \`<input type="${type}">\`\nhttps://svelte.dev/e/a11y_autocomplete_valid`);
 }
 
 /**
@@ -164,7 +164,7 @@ export function a11y_autocomplete_valid(node, value, type) {
  * @param {null | NodeLike} node
  */
 export function a11y_autofocus(node) {
-	w(node, "a11y_autofocus", "Avoid using autofocus");
+	w(node, "a11y_autofocus", `Avoid using autofocus\nhttps://svelte.dev/e/a11y_autofocus`);
 }
 
 /**
@@ -172,7 +172,7 @@ export function a11y_autofocus(node) {
  * @param {null | NodeLike} node
  */
 export function a11y_click_events_have_key_events(node) {
-	w(node, "a11y_click_events_have_key_events", "Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as `<button type=\"button\">` or `<a>` might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details");
+	w(node, "a11y_click_events_have_key_events", `Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as \`<button type="button">\` or \`<a>\` might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details\nhttps://svelte.dev/e/a11y_click_events_have_key_events`);
 }
 
 /**
@@ -180,7 +180,7 @@ export function a11y_click_events_have_key_events(node) {
  * @param {null | NodeLike} node
  */
 export function a11y_consider_explicit_label(node) {
-	w(node, "a11y_consider_explicit_label", "Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute");
+	w(node, "a11y_consider_explicit_label", `Buttons and links should either contain text or have an \`aria-label\` or \`aria-labelledby\` attribute\nhttps://svelte.dev/e/a11y_consider_explicit_label`);
 }
 
 /**
@@ -189,7 +189,7 @@ export function a11y_consider_explicit_label(node) {
  * @param {string} name
  */
 export function a11y_distracting_elements(node, name) {
-	w(node, "a11y_distracting_elements", `Avoid \`<${name}>\` elements`);
+	w(node, "a11y_distracting_elements", `Avoid \`<${name}>\` elements\nhttps://svelte.dev/e/a11y_distracting_elements`);
 }
 
 /**
@@ -197,7 +197,7 @@ export function a11y_distracting_elements(node, name) {
  * @param {null | NodeLike} node
  */
 export function a11y_figcaption_index(node) {
-	w(node, "a11y_figcaption_index", "`<figcaption>` must be first or last child of `<figure>`");
+	w(node, "a11y_figcaption_index", `\`<figcaption>\` must be first or last child of \`<figure>\`\nhttps://svelte.dev/e/a11y_figcaption_index`);
 }
 
 /**
@@ -205,7 +205,7 @@ export function a11y_figcaption_index(node) {
  * @param {null | NodeLike} node
  */
 export function a11y_figcaption_parent(node) {
-	w(node, "a11y_figcaption_parent", "`<figcaption>` must be an immediate child of `<figure>`");
+	w(node, "a11y_figcaption_parent", `\`<figcaption>\` must be an immediate child of \`<figure>\`\nhttps://svelte.dev/e/a11y_figcaption_parent`);
 }
 
 /**
@@ -214,7 +214,7 @@ export function a11y_figcaption_parent(node) {
  * @param {string} name
  */
 export function a11y_hidden(node, name) {
-	w(node, "a11y_hidden", `\`<${name}>\` element should not be hidden`);
+	w(node, "a11y_hidden", `\`<${name}>\` element should not be hidden\nhttps://svelte.dev/e/a11y_hidden`);
 }
 
 /**
@@ -222,7 +222,7 @@ export function a11y_hidden(node, name) {
  * @param {null | NodeLike} node
  */
 export function a11y_img_redundant_alt(node) {
-	w(node, "a11y_img_redundant_alt", "Screenreaders already announce `<img>` elements as an image");
+	w(node, "a11y_img_redundant_alt", `Screenreaders already announce \`<img>\` elements as an image\nhttps://svelte.dev/e/a11y_img_redundant_alt`);
 }
 
 /**
@@ -232,7 +232,7 @@ export function a11y_img_redundant_alt(node) {
  * @param {string} type
  */
 export function a11y_incorrect_aria_attribute_type(node, attribute, type) {
-	w(node, "a11y_incorrect_aria_attribute_type", `The value of '${attribute}' must be a ${type}`);
+	w(node, "a11y_incorrect_aria_attribute_type", `The value of '${attribute}' must be a ${type}\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type`);
 }
 
 /**
@@ -241,7 +241,7 @@ export function a11y_incorrect_aria_attribute_type(node, attribute, type) {
  * @param {string} attribute
  */
 export function a11y_incorrect_aria_attribute_type_boolean(node, attribute) {
-	w(node, "a11y_incorrect_aria_attribute_type_boolean", `The value of '${attribute}' must be either 'true' or 'false'. It cannot be empty`);
+	w(node, "a11y_incorrect_aria_attribute_type_boolean", `The value of '${attribute}' must be either 'true' or 'false'. It cannot be empty\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type_boolean`);
 }
 
 /**
@@ -250,7 +250,7 @@ export function a11y_incorrect_aria_attribute_type_boolean(node, attribute) {
  * @param {string} attribute
  */
 export function a11y_incorrect_aria_attribute_type_id(node, attribute) {
-	w(node, "a11y_incorrect_aria_attribute_type_id", `The value of '${attribute}' must be a string that represents a DOM element ID`);
+	w(node, "a11y_incorrect_aria_attribute_type_id", `The value of '${attribute}' must be a string that represents a DOM element ID\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type_id`);
 }
 
 /**
@@ -259,7 +259,7 @@ export function a11y_incorrect_aria_attribute_type_id(node, attribute) {
  * @param {string} attribute
  */
 export function a11y_incorrect_aria_attribute_type_idlist(node, attribute) {
-	w(node, "a11y_incorrect_aria_attribute_type_idlist", `The value of '${attribute}' must be a space-separated list of strings that represent DOM element IDs`);
+	w(node, "a11y_incorrect_aria_attribute_type_idlist", `The value of '${attribute}' must be a space-separated list of strings that represent DOM element IDs\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type_idlist`);
 }
 
 /**
@@ -268,7 +268,7 @@ export function a11y_incorrect_aria_attribute_type_idlist(node, attribute) {
  * @param {string} attribute
  */
 export function a11y_incorrect_aria_attribute_type_integer(node, attribute) {
-	w(node, "a11y_incorrect_aria_attribute_type_integer", `The value of '${attribute}' must be an integer`);
+	w(node, "a11y_incorrect_aria_attribute_type_integer", `The value of '${attribute}' must be an integer\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type_integer`);
 }
 
 /**
@@ -278,7 +278,7 @@ export function a11y_incorrect_aria_attribute_type_integer(node, attribute) {
  * @param {string} values
  */
 export function a11y_incorrect_aria_attribute_type_token(node, attribute, values) {
-	w(node, "a11y_incorrect_aria_attribute_type_token", `The value of '${attribute}' must be exactly one of ${values}`);
+	w(node, "a11y_incorrect_aria_attribute_type_token", `The value of '${attribute}' must be exactly one of ${values}\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type_token`);
 }
 
 /**
@@ -288,7 +288,7 @@ export function a11y_incorrect_aria_attribute_type_token(node, attribute, values
  * @param {string} values
  */
 export function a11y_incorrect_aria_attribute_type_tokenlist(node, attribute, values) {
-	w(node, "a11y_incorrect_aria_attribute_type_tokenlist", `The value of '${attribute}' must be a space-separated list of one or more of ${values}`);
+	w(node, "a11y_incorrect_aria_attribute_type_tokenlist", `The value of '${attribute}' must be a space-separated list of one or more of ${values}\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type_tokenlist`);
 }
 
 /**
@@ -297,7 +297,7 @@ export function a11y_incorrect_aria_attribute_type_tokenlist(node, attribute, va
  * @param {string} attribute
  */
 export function a11y_incorrect_aria_attribute_type_tristate(node, attribute) {
-	w(node, "a11y_incorrect_aria_attribute_type_tristate", `The value of '${attribute}' must be exactly one of true, false, or mixed`);
+	w(node, "a11y_incorrect_aria_attribute_type_tristate", `The value of '${attribute}' must be exactly one of true, false, or mixed\nhttps://svelte.dev/e/a11y_incorrect_aria_attribute_type_tristate`);
 }
 
 /**
@@ -306,7 +306,7 @@ export function a11y_incorrect_aria_attribute_type_tristate(node, attribute) {
  * @param {string} role
  */
 export function a11y_interactive_supports_focus(node, role) {
-	w(node, "a11y_interactive_supports_focus", `Elements with the '${role}' interactive role must have a tabindex value`);
+	w(node, "a11y_interactive_supports_focus", `Elements with the '${role}' interactive role must have a tabindex value\nhttps://svelte.dev/e/a11y_interactive_supports_focus`);
 }
 
 /**
@@ -316,7 +316,7 @@ export function a11y_interactive_supports_focus(node, role) {
  * @param {string} href_attribute
  */
 export function a11y_invalid_attribute(node, href_value, href_attribute) {
-	w(node, "a11y_invalid_attribute", `'${href_value}' is not a valid ${href_attribute} attribute`);
+	w(node, "a11y_invalid_attribute", `'${href_value}' is not a valid ${href_attribute} attribute\nhttps://svelte.dev/e/a11y_invalid_attribute`);
 }
 
 /**
@@ -324,7 +324,7 @@ export function a11y_invalid_attribute(node, href_value, href_attribute) {
  * @param {null | NodeLike} node
  */
 export function a11y_label_has_associated_control(node) {
-	w(node, "a11y_label_has_associated_control", "A form label must be associated with a control");
+	w(node, "a11y_label_has_associated_control", `A form label must be associated with a control\nhttps://svelte.dev/e/a11y_label_has_associated_control`);
 }
 
 /**
@@ -332,7 +332,7 @@ export function a11y_label_has_associated_control(node) {
  * @param {null | NodeLike} node
  */
 export function a11y_media_has_caption(node) {
-	w(node, "a11y_media_has_caption", "`<video>` elements must have a `<track kind=\"captions\">`");
+	w(node, "a11y_media_has_caption", `\`<video>\` elements must have a \`<track kind="captions">\`\nhttps://svelte.dev/e/a11y_media_has_caption`);
 }
 
 /**
@@ -341,7 +341,7 @@ export function a11y_media_has_caption(node) {
  * @param {string} name
  */
 export function a11y_misplaced_role(node, name) {
-	w(node, "a11y_misplaced_role", `\`<${name}>\` should not have role attribute`);
+	w(node, "a11y_misplaced_role", `\`<${name}>\` should not have role attribute\nhttps://svelte.dev/e/a11y_misplaced_role`);
 }
 
 /**
@@ -349,7 +349,7 @@ export function a11y_misplaced_role(node, name) {
  * @param {null | NodeLike} node
  */
 export function a11y_misplaced_scope(node) {
-	w(node, "a11y_misplaced_scope", "The scope attribute should only be used with `<th>` elements");
+	w(node, "a11y_misplaced_scope", `The scope attribute should only be used with \`<th>\` elements\nhttps://svelte.dev/e/a11y_misplaced_scope`);
 }
 
 /**
@@ -360,7 +360,7 @@ export function a11y_misplaced_scope(node) {
  * @param {string} sequence
  */
 export function a11y_missing_attribute(node, name, article, sequence) {
-	w(node, "a11y_missing_attribute", `\`<${name}>\` element should have ${article} ${sequence} attribute`);
+	w(node, "a11y_missing_attribute", `\`<${name}>\` element should have ${article} ${sequence} attribute\nhttps://svelte.dev/e/a11y_missing_attribute`);
 }
 
 /**
@@ -369,7 +369,7 @@ export function a11y_missing_attribute(node, name, article, sequence) {
  * @param {string} name
  */
 export function a11y_missing_content(node, name) {
-	w(node, "a11y_missing_content", `\`<${name}>\` element should contain text`);
+	w(node, "a11y_missing_content", `\`<${name}>\` element should contain text\nhttps://svelte.dev/e/a11y_missing_content`);
 }
 
 /**
@@ -379,7 +379,7 @@ export function a11y_missing_content(node, name) {
  * @param {string} accompanied_by
  */
 export function a11y_mouse_events_have_key_events(node, event, accompanied_by) {
-	w(node, "a11y_mouse_events_have_key_events", `'${event}' event must be accompanied by '${accompanied_by}' event`);
+	w(node, "a11y_mouse_events_have_key_events", `'${event}' event must be accompanied by '${accompanied_by}' event\nhttps://svelte.dev/e/a11y_mouse_events_have_key_events`);
 }
 
 /**
@@ -388,7 +388,7 @@ export function a11y_mouse_events_have_key_events(node, event, accompanied_by) {
  * @param {string} role
  */
 export function a11y_no_abstract_role(node, role) {
-	w(node, "a11y_no_abstract_role", `Abstract role '${role}' is forbidden`);
+	w(node, "a11y_no_abstract_role", `Abstract role '${role}' is forbidden\nhttps://svelte.dev/e/a11y_no_abstract_role`);
 }
 
 /**
@@ -398,7 +398,7 @@ export function a11y_no_abstract_role(node, role) {
  * @param {string} role
  */
 export function a11y_no_interactive_element_to_noninteractive_role(node, element, role) {
-	w(node, "a11y_no_interactive_element_to_noninteractive_role", `\`<${element}>\` cannot have role '${role}'`);
+	w(node, "a11y_no_interactive_element_to_noninteractive_role", `\`<${element}>\` cannot have role '${role}'\nhttps://svelte.dev/e/a11y_no_interactive_element_to_noninteractive_role`);
 }
 
 /**
@@ -407,7 +407,7 @@ export function a11y_no_interactive_element_to_noninteractive_role(node, element
  * @param {string} element
  */
 export function a11y_no_noninteractive_element_interactions(node, element) {
-	w(node, "a11y_no_noninteractive_element_interactions", `Non-interactive element \`<${element}>\` should not be assigned mouse or keyboard event listeners`);
+	w(node, "a11y_no_noninteractive_element_interactions", `Non-interactive element \`<${element}>\` should not be assigned mouse or keyboard event listeners\nhttps://svelte.dev/e/a11y_no_noninteractive_element_interactions`);
 }
 
 /**
@@ -417,7 +417,7 @@ export function a11y_no_noninteractive_element_interactions(node, element) {
  * @param {string} role
  */
 export function a11y_no_noninteractive_element_to_interactive_role(node, element, role) {
-	w(node, "a11y_no_noninteractive_element_to_interactive_role", `Non-interactive element \`<${element}>\` cannot have interactive role '${role}'`);
+	w(node, "a11y_no_noninteractive_element_to_interactive_role", `Non-interactive element \`<${element}>\` cannot have interactive role '${role}'\nhttps://svelte.dev/e/a11y_no_noninteractive_element_to_interactive_role`);
 }
 
 /**
@@ -425,7 +425,7 @@ export function a11y_no_noninteractive_element_to_interactive_role(node, element
  * @param {null | NodeLike} node
  */
 export function a11y_no_noninteractive_tabindex(node) {
-	w(node, "a11y_no_noninteractive_tabindex", "noninteractive element cannot have nonnegative tabIndex value");
+	w(node, "a11y_no_noninteractive_tabindex", `noninteractive element cannot have nonnegative tabIndex value\nhttps://svelte.dev/e/a11y_no_noninteractive_tabindex`);
 }
 
 /**
@@ -434,7 +434,7 @@ export function a11y_no_noninteractive_tabindex(node) {
  * @param {string} role
  */
 export function a11y_no_redundant_roles(node, role) {
-	w(node, "a11y_no_redundant_roles", `Redundant role '${role}'`);
+	w(node, "a11y_no_redundant_roles", `Redundant role '${role}'\nhttps://svelte.dev/e/a11y_no_redundant_roles`);
 }
 
 /**
@@ -444,7 +444,7 @@ export function a11y_no_redundant_roles(node, role) {
  * @param {string} handler
  */
 export function a11y_no_static_element_interactions(node, element, handler) {
-	w(node, "a11y_no_static_element_interactions", `\`<${element}>\` with a ${handler} handler must have an ARIA role`);
+	w(node, "a11y_no_static_element_interactions", `\`<${element}>\` with a ${handler} handler must have an ARIA role\nhttps://svelte.dev/e/a11y_no_static_element_interactions`);
 }
 
 /**
@@ -452,7 +452,7 @@ export function a11y_no_static_element_interactions(node, element, handler) {
  * @param {null | NodeLike} node
  */
 export function a11y_positive_tabindex(node) {
-	w(node, "a11y_positive_tabindex", "Avoid tabindex values above zero");
+	w(node, "a11y_positive_tabindex", `Avoid tabindex values above zero\nhttps://svelte.dev/e/a11y_positive_tabindex`);
 }
 
 /**
@@ -462,7 +462,7 @@ export function a11y_positive_tabindex(node) {
  * @param {string} props
  */
 export function a11y_role_has_required_aria_props(node, role, props) {
-	w(node, "a11y_role_has_required_aria_props", `Elements with the ARIA role "${role}" must have the following attributes defined: ${props}`);
+	w(node, "a11y_role_has_required_aria_props", `Elements with the ARIA role "${role}" must have the following attributes defined: ${props}\nhttps://svelte.dev/e/a11y_role_has_required_aria_props`);
 }
 
 /**
@@ -472,7 +472,7 @@ export function a11y_role_has_required_aria_props(node, role, props) {
  * @param {string} role
  */
 export function a11y_role_supports_aria_props(node, attribute, role) {
-	w(node, "a11y_role_supports_aria_props", `The attribute '${attribute}' is not supported by the role '${role}'`);
+	w(node, "a11y_role_supports_aria_props", `The attribute '${attribute}' is not supported by the role '${role}'\nhttps://svelte.dev/e/a11y_role_supports_aria_props`);
 }
 
 /**
@@ -483,7 +483,7 @@ export function a11y_role_supports_aria_props(node, attribute, role) {
  * @param {string} name
  */
 export function a11y_role_supports_aria_props_implicit(node, attribute, role, name) {
-	w(node, "a11y_role_supports_aria_props_implicit", `The attribute '${attribute}' is not supported by the role '${role}'. This role is implicit on the element \`<${name}>\``);
+	w(node, "a11y_role_supports_aria_props_implicit", `The attribute '${attribute}' is not supported by the role '${role}'. This role is implicit on the element \`<${name}>\`\nhttps://svelte.dev/e/a11y_role_supports_aria_props_implicit`);
 }
 
 /**
@@ -493,7 +493,7 @@ export function a11y_role_supports_aria_props_implicit(node, attribute, role, na
  * @param {string | undefined | null} [suggestion]
  */
 export function a11y_unknown_aria_attribute(node, attribute, suggestion) {
-	w(node, "a11y_unknown_aria_attribute", suggestion ? `Unknown aria attribute 'aria-${attribute}'. Did you mean '${suggestion}'?` : `Unknown aria attribute 'aria-${attribute}'`);
+	w(node, "a11y_unknown_aria_attribute", `${suggestion ? `Unknown aria attribute 'aria-${attribute}'. Did you mean '${suggestion}'?` : `Unknown aria attribute 'aria-${attribute}'`}\nhttps://svelte.dev/e/a11y_unknown_aria_attribute`);
 }
 
 /**
@@ -503,7 +503,7 @@ export function a11y_unknown_aria_attribute(node, attribute, suggestion) {
  * @param {string | undefined | null} [suggestion]
  */
 export function a11y_unknown_role(node, role, suggestion) {
-	w(node, "a11y_unknown_role", suggestion ? `Unknown role '${role}'. Did you mean '${suggestion}'?` : `Unknown role '${role}'`);
+	w(node, "a11y_unknown_role", `${suggestion ? `Unknown role '${role}'. Did you mean '${suggestion}'?` : `Unknown role '${role}'`}\nhttps://svelte.dev/e/a11y_unknown_role`);
 }
 
 /**
@@ -513,7 +513,7 @@ export function a11y_unknown_role(node, role, suggestion) {
  * @param {string} suggestion
  */
 export function legacy_code(node, code, suggestion) {
-	w(node, "legacy_code", `\`${code}\` is no longer valid — please use \`${suggestion}\` instead`);
+	w(node, "legacy_code", `\`${code}\` is no longer valid — please use \`${suggestion}\` instead\nhttps://svelte.dev/e/legacy_code`);
 }
 
 /**
@@ -523,7 +523,7 @@ export function legacy_code(node, code, suggestion) {
  * @param {string | undefined | null} [suggestion]
  */
 export function unknown_code(node, code, suggestion) {
-	w(node, "unknown_code", suggestion ? `\`${code}\` is not a recognised code (did you mean \`${suggestion}\`?)` : `\`${code}\` is not a recognised code`);
+	w(node, "unknown_code", `${suggestion ? `\`${code}\` is not a recognised code (did you mean \`${suggestion}\`?)` : `\`${code}\` is not a recognised code`}\nhttps://svelte.dev/e/unknown_code`);
 }
 
 /**
@@ -531,7 +531,7 @@ export function unknown_code(node, code, suggestion) {
  * @param {null | NodeLike} node
  */
 export function options_deprecated_accessors(node) {
-	w(node, "options_deprecated_accessors", "The `accessors` option has been deprecated. It will have no effect in runes mode");
+	w(node, "options_deprecated_accessors", `The \`accessors\` option has been deprecated. It will have no effect in runes mode\nhttps://svelte.dev/e/options_deprecated_accessors`);
 }
 
 /**
@@ -539,7 +539,7 @@ export function options_deprecated_accessors(node) {
  * @param {null | NodeLike} node
  */
 export function options_deprecated_immutable(node) {
-	w(node, "options_deprecated_immutable", "The `immutable` option has been deprecated. It will have no effect in runes mode");
+	w(node, "options_deprecated_immutable", `The \`immutable\` option has been deprecated. It will have no effect in runes mode\nhttps://svelte.dev/e/options_deprecated_immutable`);
 }
 
 /**
@@ -547,7 +547,7 @@ export function options_deprecated_immutable(node) {
  * @param {null | NodeLike} node
  */
 export function options_missing_custom_element(node) {
-	w(node, "options_missing_custom_element", "The `customElement` option is used when generating a custom element. Did you forget the `customElement: true` compile option?");
+	w(node, "options_missing_custom_element", `The \`customElement\` option is used when generating a custom element. Did you forget the \`customElement: true\` compile option?\nhttps://svelte.dev/e/options_missing_custom_element`);
 }
 
 /**
@@ -555,7 +555,7 @@ export function options_missing_custom_element(node) {
  * @param {null | NodeLike} node
  */
 export function options_removed_enable_sourcemap(node) {
-	w(node, "options_removed_enable_sourcemap", "The `enableSourcemap` option has been removed. Source maps are always generated now, and tooling can choose to ignore them");
+	w(node, "options_removed_enable_sourcemap", `The \`enableSourcemap\` option has been removed. Source maps are always generated now, and tooling can choose to ignore them\nhttps://svelte.dev/e/options_removed_enable_sourcemap`);
 }
 
 /**
@@ -563,7 +563,7 @@ export function options_removed_enable_sourcemap(node) {
  * @param {null | NodeLike} node
  */
 export function options_removed_hydratable(node) {
-	w(node, "options_removed_hydratable", "The `hydratable` option has been removed. Svelte components are always hydratable now");
+	w(node, "options_removed_hydratable", `The \`hydratable\` option has been removed. Svelte components are always hydratable now\nhttps://svelte.dev/e/options_removed_hydratable`);
 }
 
 /**
@@ -571,7 +571,7 @@ export function options_removed_hydratable(node) {
  * @param {null | NodeLike} node
  */
 export function options_removed_loop_guard_timeout(node) {
-	w(node, "options_removed_loop_guard_timeout", "The `loopGuardTimeout` option has been removed");
+	w(node, "options_removed_loop_guard_timeout", `The \`loopGuardTimeout\` option has been removed\nhttps://svelte.dev/e/options_removed_loop_guard_timeout`);
 }
 
 /**
@@ -579,7 +579,7 @@ export function options_removed_loop_guard_timeout(node) {
  * @param {null | NodeLike} node
  */
 export function options_renamed_ssr_dom(node) {
-	w(node, "options_renamed_ssr_dom", "`generate: \"dom\"` and `generate: \"ssr\"` options have been renamed to \"client\" and \"server\" respectively");
+	w(node, "options_renamed_ssr_dom", `\`generate: "dom"\` and \`generate: "ssr"\` options have been renamed to "client" and "server" respectively\nhttps://svelte.dev/e/options_renamed_ssr_dom`);
 }
 
 /**
@@ -588,7 +588,7 @@ export function options_renamed_ssr_dom(node) {
  * @param {string} name
  */
 export function export_let_unused(node, name) {
-	w(node, "export_let_unused", `Component has unused export property '${name}'. If it is for external reference only, please consider using \`export const ${name}\``);
+	w(node, "export_let_unused", `Component has unused export property '${name}'. If it is for external reference only, please consider using \`export const ${name}\`\nhttps://svelte.dev/e/export_let_unused`);
 }
 
 /**
@@ -596,7 +596,7 @@ export function export_let_unused(node, name) {
  * @param {null | NodeLike} node
  */
 export function legacy_component_creation(node) {
-	w(node, "legacy_component_creation", "Svelte 5 components are no longer classes. Instantiate them using `mount` or `hydrate` (imported from 'svelte') instead.");
+	w(node, "legacy_component_creation", `Svelte 5 components are no longer classes. Instantiate them using \`mount\` or \`hydrate\` (imported from 'svelte') instead.\nhttps://svelte.dev/e/legacy_component_creation`);
 }
 
 /**
@@ -605,7 +605,7 @@ export function legacy_component_creation(node) {
  * @param {string} name
  */
 export function non_reactive_update(node, name) {
-	w(node, "non_reactive_update", `\`${name}\` is updated, but is not declared with \`$state(...)\`. Changing its value will not correctly trigger updates`);
+	w(node, "non_reactive_update", `\`${name}\` is updated, but is not declared with \`$state(...)\`. Changing its value will not correctly trigger updates\nhttps://svelte.dev/e/non_reactive_update`);
 }
 
 /**
@@ -613,7 +613,7 @@ export function non_reactive_update(node, name) {
  * @param {null | NodeLike} node
  */
 export function perf_avoid_inline_class(node) {
-	w(node, "perf_avoid_inline_class", "Avoid 'new class' — instead, declare the class at the top level scope");
+	w(node, "perf_avoid_inline_class", `Avoid 'new class' — instead, declare the class at the top level scope\nhttps://svelte.dev/e/perf_avoid_inline_class`);
 }
 
 /**
@@ -621,7 +621,7 @@ export function perf_avoid_inline_class(node) {
  * @param {null | NodeLike} node
  */
 export function perf_avoid_nested_class(node) {
-	w(node, "perf_avoid_nested_class", "Avoid declaring classes below the top level scope");
+	w(node, "perf_avoid_nested_class", `Avoid declaring classes below the top level scope\nhttps://svelte.dev/e/perf_avoid_nested_class`);
 }
 
 /**
@@ -629,7 +629,7 @@ export function perf_avoid_nested_class(node) {
  * @param {null | NodeLike} node
  */
 export function reactive_declaration_invalid_placement(node) {
-	w(node, "reactive_declaration_invalid_placement", "Reactive declarations only exist at the top level of the instance script");
+	w(node, "reactive_declaration_invalid_placement", `Reactive declarations only exist at the top level of the instance script\nhttps://svelte.dev/e/reactive_declaration_invalid_placement`);
 }
 
 /**
@@ -637,7 +637,7 @@ export function reactive_declaration_invalid_placement(node) {
  * @param {null | NodeLike} node
  */
 export function reactive_declaration_module_script_dependency(node) {
-	w(node, "reactive_declaration_module_script_dependency", "Reassignments of module-level declarations will not cause reactive statements to update");
+	w(node, "reactive_declaration_module_script_dependency", `Reassignments of module-level declarations will not cause reactive statements to update\nhttps://svelte.dev/e/reactive_declaration_module_script_dependency`);
 }
 
 /**
@@ -645,7 +645,7 @@ export function reactive_declaration_module_script_dependency(node) {
  * @param {null | NodeLike} node
  */
 export function state_referenced_locally(node) {
-	w(node, "state_referenced_locally", "State referenced in its own scope will never update. Did you mean to reference it inside a closure?");
+	w(node, "state_referenced_locally", `State referenced in its own scope will never update. Did you mean to reference it inside a closure?\nhttps://svelte.dev/e/state_referenced_locally`);
 }
 
 /**
@@ -654,7 +654,7 @@ export function state_referenced_locally(node) {
  * @param {string} name
  */
 export function store_rune_conflict(node, name) {
-	w(node, "store_rune_conflict", `It looks like you're using the \`$${name}\` rune, but there is a local binding called \`${name}\`. Referencing a local variable with a \`$\` prefix will create a store subscription. Please rename \`${name}\` to avoid the ambiguity`);
+	w(node, "store_rune_conflict", `It looks like you're using the \`$${name}\` rune, but there is a local binding called \`${name}\`. Referencing a local variable with a \`$\` prefix will create a store subscription. Please rename \`${name}\` to avoid the ambiguity\nhttps://svelte.dev/e/store_rune_conflict`);
 }
 
 /**
@@ -663,7 +663,7 @@ export function store_rune_conflict(node, name) {
  * @param {string} name
  */
 export function css_unused_selector(node, name) {
-	w(node, "css_unused_selector", `Unused CSS selector "${name}"`);
+	w(node, "css_unused_selector", `Unused CSS selector "${name}"\nhttps://svelte.dev/e/css_unused_selector`);
 }
 
 /**
@@ -671,7 +671,7 @@ export function css_unused_selector(node, name) {
  * @param {null | NodeLike} node
  */
 export function attribute_avoid_is(node) {
-	w(node, "attribute_avoid_is", "The \"is\" attribute is not supported cross-browser and should be avoided");
+	w(node, "attribute_avoid_is", `The "is" attribute is not supported cross-browser and should be avoided\nhttps://svelte.dev/e/attribute_avoid_is`);
 }
 
 /**
@@ -680,7 +680,7 @@ export function attribute_avoid_is(node) {
  * @param {string} name
  */
 export function attribute_global_event_reference(node, name) {
-	w(node, "attribute_global_event_reference", `You are referencing \`globalThis.${name}\`. Did you forget to declare a variable with that name?`);
+	w(node, "attribute_global_event_reference", `You are referencing \`globalThis.${name}\`. Did you forget to declare a variable with that name?\nhttps://svelte.dev/e/attribute_global_event_reference`);
 }
 
 /**
@@ -688,7 +688,7 @@ export function attribute_global_event_reference(node, name) {
  * @param {null | NodeLike} node
  */
 export function attribute_illegal_colon(node) {
-	w(node, "attribute_illegal_colon", "Attributes should not contain ':' characters to prevent ambiguity with Svelte directives");
+	w(node, "attribute_illegal_colon", `Attributes should not contain ':' characters to prevent ambiguity with Svelte directives\nhttps://svelte.dev/e/attribute_illegal_colon`);
 }
 
 /**
@@ -698,7 +698,7 @@ export function attribute_illegal_colon(node) {
  * @param {string} right
  */
 export function attribute_invalid_property_name(node, wrong, right) {
-	w(node, "attribute_invalid_property_name", `'${wrong}' is not a valid HTML attribute. Did you mean '${right}'?`);
+	w(node, "attribute_invalid_property_name", `'${wrong}' is not a valid HTML attribute. Did you mean '${right}'?\nhttps://svelte.dev/e/attribute_invalid_property_name`);
 }
 
 /**
@@ -706,7 +706,7 @@ export function attribute_invalid_property_name(node, wrong, right) {
  * @param {null | NodeLike} node
  */
 export function attribute_quoted(node) {
-	w(node, "attribute_quoted", "Quoted attributes on components and custom elements will be stringified in a future version of Svelte. If this isn't what you want, remove the quotes");
+	w(node, "attribute_quoted", `Quoted attributes on components and custom elements will be stringified in a future version of Svelte. If this isn't what you want, remove the quotes\nhttps://svelte.dev/e/attribute_quoted`);
 }
 
 /**
@@ -715,7 +715,7 @@ export function attribute_quoted(node) {
  * @param {string} name
  */
 export function bind_invalid_each_rest(node, name) {
-	w(node, "bind_invalid_each_rest", `The rest operator (...) will create a new object and binding '${name}' with the original object will not work`);
+	w(node, "bind_invalid_each_rest", `The rest operator (...) will create a new object and binding '${name}' with the original object will not work\nhttps://svelte.dev/e/bind_invalid_each_rest`);
 }
 
 /**
@@ -723,7 +723,7 @@ export function bind_invalid_each_rest(node, name) {
  * @param {null | NodeLike} node
  */
 export function block_empty(node) {
-	w(node, "block_empty", "Empty block");
+	w(node, "block_empty", `Empty block\nhttps://svelte.dev/e/block_empty`);
 }
 
 /**
@@ -732,7 +732,7 @@ export function block_empty(node) {
  * @param {string} name
  */
 export function component_name_lowercase(node, name) {
-	w(node, "component_name_lowercase", `\`<${name}>\` will be treated as an HTML element unless it begins with a capital letter`);
+	w(node, "component_name_lowercase", `\`<${name}>\` will be treated as an HTML element unless it begins with a capital letter\nhttps://svelte.dev/e/component_name_lowercase`);
 }
 
 /**
@@ -741,7 +741,7 @@ export function component_name_lowercase(node, name) {
  * @param {string} name
  */
 export function element_invalid_self_closing_tag(node, name) {
-	w(node, "element_invalid_self_closing_tag", `Self-closing HTML tags for non-void elements are ambiguous — use \`<${name} ...></${name}>\` rather than \`<${name} ... />\``);
+	w(node, "element_invalid_self_closing_tag", `Self-closing HTML tags for non-void elements are ambiguous — use \`<${name} ...></${name}>\` rather than \`<${name} ... />\`\nhttps://svelte.dev/e/element_invalid_self_closing_tag`);
 }
 
 /**
@@ -750,7 +750,7 @@ export function element_invalid_self_closing_tag(node, name) {
  * @param {string} name
  */
 export function event_directive_deprecated(node, name) {
-	w(node, "event_directive_deprecated", `Using \`on:${name}\` to listen to the ${name} event is deprecated. Use the event attribute \`on${name}\` instead`);
+	w(node, "event_directive_deprecated", `Using \`on:${name}\` to listen to the ${name} event is deprecated. Use the event attribute \`on${name}\` instead\nhttps://svelte.dev/e/event_directive_deprecated`);
 }
 
 /**
@@ -759,7 +759,7 @@ export function event_directive_deprecated(node, name) {
  * @param {string} message
  */
 export function node_invalid_placement_ssr(node, message) {
-	w(node, "node_invalid_placement_ssr", `${message}. When rendering this component on the server, the resulting HTML will be modified by the browser (by moving, removing, or inserting elements), likely resulting in a \`hydration_mismatch\` warning`);
+	w(node, "node_invalid_placement_ssr", `${message}. When rendering this component on the server, the resulting HTML will be modified by the browser (by moving, removing, or inserting elements), likely resulting in a \`hydration_mismatch\` warning\nhttps://svelte.dev/e/node_invalid_placement_ssr`);
 }
 
 /**
@@ -767,7 +767,7 @@ export function node_invalid_placement_ssr(node, message) {
  * @param {null | NodeLike} node
  */
 export function script_context_deprecated(node) {
-	w(node, "script_context_deprecated", "`context=\"module\"` is deprecated, use the `module` attribute instead");
+	w(node, "script_context_deprecated", `\`context="module"\` is deprecated, use the \`module\` attribute instead\nhttps://svelte.dev/e/script_context_deprecated`);
 }
 
 /**
@@ -775,7 +775,7 @@ export function script_context_deprecated(node) {
  * @param {null | NodeLike} node
  */
 export function script_unknown_attribute(node) {
-	w(node, "script_unknown_attribute", "Unrecognized attribute — should be one of `generics`, `lang` or `module`. If this exists for a preprocessor, ensure that the preprocessor removes it");
+	w(node, "script_unknown_attribute", `Unrecognized attribute — should be one of \`generics\`, \`lang\` or \`module\`. If this exists for a preprocessor, ensure that the preprocessor removes it\nhttps://svelte.dev/e/script_unknown_attribute`);
 }
 
 /**
@@ -783,7 +783,7 @@ export function script_unknown_attribute(node) {
  * @param {null | NodeLike} node
  */
 export function slot_element_deprecated(node) {
-	w(node, "slot_element_deprecated", "Using `<slot>` to render parent content is deprecated. Use `{@render ...}` tags instead");
+	w(node, "slot_element_deprecated", `Using \`<slot>\` to render parent content is deprecated. Use \`{@render ...}\` tags instead\nhttps://svelte.dev/e/slot_element_deprecated`);
 }
 
 /**
@@ -791,7 +791,7 @@ export function slot_element_deprecated(node) {
  * @param {null | NodeLike} node
  */
 export function svelte_component_deprecated(node) {
-	w(node, "svelte_component_deprecated", "`<svelte:component>` is deprecated in runes mode — components are dynamic by default");
+	w(node, "svelte_component_deprecated", `\`<svelte:component>\` is deprecated in runes mode — components are dynamic by default\nhttps://svelte.dev/e/svelte_component_deprecated`);
 }
 
 /**
@@ -799,7 +799,7 @@ export function svelte_component_deprecated(node) {
  * @param {null | NodeLike} node
  */
 export function svelte_element_invalid_this(node) {
-	w(node, "svelte_element_invalid_this", "`this` should be an `{expression}`. Using a string attribute value will cause an error in future versions of Svelte");
+	w(node, "svelte_element_invalid_this", `\`this\` should be an \`{expression}\`. Using a string attribute value will cause an error in future versions of Svelte\nhttps://svelte.dev/e/svelte_element_invalid_this`);
 }
 
 /**
@@ -809,5 +809,5 @@ export function svelte_element_invalid_this(node) {
  * @param {string} basename
  */
 export function svelte_self_deprecated(node, name, basename) {
-	w(node, "svelte_self_deprecated", `\`<svelte:self>\` is deprecated — use self-imports (e.g. \`import ${name} from './${basename}'\`) instead`);
+	w(node, "svelte_self_deprecated", `\`<svelte:self>\` is deprecated — use self-imports (e.g. \`import ${name} from './${basename}'\`) instead\nhttps://svelte.dev/e/svelte_self_deprecated`);
 }
\ No newline at end of file
diff --git a/packages/svelte/src/internal/client/errors.js b/packages/svelte/src/internal/client/errors.js
index 2d95c42365e9..56c0cc31df02 100644
--- a/packages/svelte/src/internal/client/errors.js
+++ b/packages/svelte/src/internal/client/errors.js
@@ -8,13 +8,12 @@ import { DEV } from 'esm-env';
  */
 export function bind_invalid_checkbox_value() {
 	if (DEV) {
-		const error = new Error(`bind_invalid_checkbox_value\nUsing \`bind:value\` together with a checkbox input is not allowed. Use \`bind:checked\` instead`);
+		const error = new Error(`bind_invalid_checkbox_value\nUsing \`bind:value\` together with a checkbox input is not allowed. Use \`bind:checked\` instead\nhttps://svelte.dev/e/bind_invalid_checkbox_value`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("bind_invalid_checkbox_value");
+		throw new Error(`https://svelte.dev/e/bind_invalid_checkbox_value`);
 	}
 }
 
@@ -27,13 +26,12 @@ export function bind_invalid_checkbox_value() {
  */
 export function bind_invalid_export(component, key, name) {
 	if (DEV) {
-		const error = new Error(`bind_invalid_export\nComponent ${component} has an export named \`${key}\` that a consumer component is trying to access using \`bind:${key}\`, which is disallowed. Instead, use \`bind:this\` (e.g. \`<${name} bind:this={component} />\`) and then access the property on the bound component instance (e.g. \`component.${key}\`)`);
+		const error = new Error(`bind_invalid_export\nComponent ${component} has an export named \`${key}\` that a consumer component is trying to access using \`bind:${key}\`, which is disallowed. Instead, use \`bind:this\` (e.g. \`<${name} bind:this={component} />\`) and then access the property on the bound component instance (e.g. \`component.${key}\`)\nhttps://svelte.dev/e/bind_invalid_export`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("bind_invalid_export");
+		throw new Error(`https://svelte.dev/e/bind_invalid_export`);
 	}
 }
 
@@ -46,13 +44,12 @@ export function bind_invalid_export(component, key, name) {
  */
 export function bind_not_bindable(key, component, name) {
 	if (DEV) {
-		const error = new Error(`bind_not_bindable\nA component is attempting to bind to a non-bindable property \`${key}\` belonging to ${component} (i.e. \`<${name} bind:${key}={...}>\`). To mark a property as bindable: \`let { ${key} = $bindable() } = $props()\``);
+		const error = new Error(`bind_not_bindable\nA component is attempting to bind to a non-bindable property \`${key}\` belonging to ${component} (i.e. \`<${name} bind:${key}={...}>\`). To mark a property as bindable: \`let { ${key} = $bindable() } = $props()\`\nhttps://svelte.dev/e/bind_not_bindable`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("bind_not_bindable");
+		throw new Error(`https://svelte.dev/e/bind_not_bindable`);
 	}
 }
 
@@ -65,13 +62,12 @@ export function bind_not_bindable(key, component, name) {
  */
 export function component_api_changed(parent, method, component) {
 	if (DEV) {
-		const error = new Error(`component_api_changed\n${parent} called \`${method}\` on an instance of ${component}, which is no longer valid in Svelte 5. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information`);
+		const error = new Error(`component_api_changed\n${parent} called \`${method}\` on an instance of ${component}, which is no longer valid in Svelte 5. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information\nhttps://svelte.dev/e/component_api_changed`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("component_api_changed");
+		throw new Error(`https://svelte.dev/e/component_api_changed`);
 	}
 }
 
@@ -83,13 +79,12 @@ export function component_api_changed(parent, method, component) {
  */
 export function component_api_invalid_new(component, name) {
 	if (DEV) {
-		const error = new Error(`component_api_invalid_new\nAttempted to instantiate ${component} with \`new ${name}\`, which is no longer valid in Svelte 5. If this component is not under your control, set the \`compatibility.componentApi\` compiler option to \`4\` to keep it working. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information`);
+		const error = new Error(`component_api_invalid_new\nAttempted to instantiate ${component} with \`new ${name}\`, which is no longer valid in Svelte 5. If this component is not under your control, set the \`compatibility.componentApi\` compiler option to \`4\` to keep it working. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information\nhttps://svelte.dev/e/component_api_invalid_new`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("component_api_invalid_new");
+		throw new Error(`https://svelte.dev/e/component_api_invalid_new`);
 	}
 }
 
@@ -99,13 +94,12 @@ export function component_api_invalid_new(component, name) {
  */
 export function derived_references_self() {
 	if (DEV) {
-		const error = new Error(`derived_references_self\nA derived value cannot reference itself recursively`);
+		const error = new Error(`derived_references_self\nA derived value cannot reference itself recursively\nhttps://svelte.dev/e/derived_references_self`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("derived_references_self");
+		throw new Error(`https://svelte.dev/e/derived_references_self`);
 	}
 }
 
@@ -118,13 +112,12 @@ export function derived_references_self() {
  */
 export function each_key_duplicate(a, b, value) {
 	if (DEV) {
-		const error = new Error(`each_key_duplicate\n${value ? `Keyed each block has duplicate key \`${value}\` at indexes ${a} and ${b}` : `Keyed each block has duplicate key at indexes ${a} and ${b}`}`);
+		const error = new Error(`each_key_duplicate\n${value ? `Keyed each block has duplicate key \`${value}\` at indexes ${a} and ${b}` : `Keyed each block has duplicate key at indexes ${a} and ${b}`}\nhttps://svelte.dev/e/each_key_duplicate`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("each_key_duplicate");
+		throw new Error(`https://svelte.dev/e/each_key_duplicate`);
 	}
 }
 
@@ -135,13 +128,12 @@ export function each_key_duplicate(a, b, value) {
  */
 export function effect_in_teardown(rune) {
 	if (DEV) {
-		const error = new Error(`effect_in_teardown\n\`${rune}\` cannot be used inside an effect cleanup function`);
+		const error = new Error(`effect_in_teardown\n\`${rune}\` cannot be used inside an effect cleanup function\nhttps://svelte.dev/e/effect_in_teardown`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("effect_in_teardown");
+		throw new Error(`https://svelte.dev/e/effect_in_teardown`);
 	}
 }
 
@@ -151,13 +143,12 @@ export function effect_in_teardown(rune) {
  */
 export function effect_in_unowned_derived() {
 	if (DEV) {
-		const error = new Error(`effect_in_unowned_derived\nEffect cannot be created inside a \`$derived\` value that was not itself created inside an effect`);
+		const error = new Error(`effect_in_unowned_derived\nEffect cannot be created inside a \`$derived\` value that was not itself created inside an effect\nhttps://svelte.dev/e/effect_in_unowned_derived`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("effect_in_unowned_derived");
+		throw new Error(`https://svelte.dev/e/effect_in_unowned_derived`);
 	}
 }
 
@@ -168,13 +159,12 @@ export function effect_in_unowned_derived() {
  */
 export function effect_orphan(rune) {
 	if (DEV) {
-		const error = new Error(`effect_orphan\n\`${rune}\` can only be used inside an effect (e.g. during component initialisation)`);
+		const error = new Error(`effect_orphan\n\`${rune}\` can only be used inside an effect (e.g. during component initialisation)\nhttps://svelte.dev/e/effect_orphan`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("effect_orphan");
+		throw new Error(`https://svelte.dev/e/effect_orphan`);
 	}
 }
 
@@ -184,13 +174,12 @@ export function effect_orphan(rune) {
  */
 export function effect_update_depth_exceeded() {
 	if (DEV) {
-		const error = new Error(`effect_update_depth_exceeded\nMaximum update depth exceeded. This can happen when a reactive block or effect repeatedly sets a new value. Svelte limits the number of nested updates to prevent infinite loops`);
+		const error = new Error(`effect_update_depth_exceeded\nMaximum update depth exceeded. This can happen when a reactive block or effect repeatedly sets a new value. Svelte limits the number of nested updates to prevent infinite loops\nhttps://svelte.dev/e/effect_update_depth_exceeded`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("effect_update_depth_exceeded");
+		throw new Error(`https://svelte.dev/e/effect_update_depth_exceeded`);
 	}
 }
 
@@ -200,13 +189,12 @@ export function effect_update_depth_exceeded() {
  */
 export function hydration_failed() {
 	if (DEV) {
-		const error = new Error(`hydration_failed\nFailed to hydrate the application`);
+		const error = new Error(`hydration_failed\nFailed to hydrate the application\nhttps://svelte.dev/e/hydration_failed`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("hydration_failed");
+		throw new Error(`https://svelte.dev/e/hydration_failed`);
 	}
 }
 
@@ -216,13 +204,12 @@ export function hydration_failed() {
  */
 export function invalid_snippet() {
 	if (DEV) {
-		const error = new Error(`invalid_snippet\nCould not \`{@render}\` snippet due to the expression being \`null\` or \`undefined\`. Consider using optional chaining \`{@render snippet?.()}\``);
+		const error = new Error(`invalid_snippet\nCould not \`{@render}\` snippet due to the expression being \`null\` or \`undefined\`. Consider using optional chaining \`{@render snippet?.()}\`\nhttps://svelte.dev/e/invalid_snippet`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("invalid_snippet");
+		throw new Error(`https://svelte.dev/e/invalid_snippet`);
 	}
 }
 
@@ -233,13 +220,12 @@ export function invalid_snippet() {
  */
 export function lifecycle_legacy_only(name) {
 	if (DEV) {
-		const error = new Error(`lifecycle_legacy_only\n\`${name}(...)\` cannot be used in runes mode`);
+		const error = new Error(`lifecycle_legacy_only\n\`${name}(...)\` cannot be used in runes mode\nhttps://svelte.dev/e/lifecycle_legacy_only`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("lifecycle_legacy_only");
+		throw new Error(`https://svelte.dev/e/lifecycle_legacy_only`);
 	}
 }
 
@@ -250,13 +236,12 @@ export function lifecycle_legacy_only(name) {
  */
 export function props_invalid_value(key) {
 	if (DEV) {
-		const error = new Error(`props_invalid_value\nCannot do \`bind:${key}={undefined}\` when \`${key}\` has a fallback value`);
+		const error = new Error(`props_invalid_value\nCannot do \`bind:${key}={undefined}\` when \`${key}\` has a fallback value\nhttps://svelte.dev/e/props_invalid_value`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("props_invalid_value");
+		throw new Error(`https://svelte.dev/e/props_invalid_value`);
 	}
 }
 
@@ -267,13 +252,12 @@ export function props_invalid_value(key) {
  */
 export function props_rest_readonly(property) {
 	if (DEV) {
-		const error = new Error(`props_rest_readonly\nRest element properties of \`$props()\` such as \`${property}\` are readonly`);
+		const error = new Error(`props_rest_readonly\nRest element properties of \`$props()\` such as \`${property}\` are readonly\nhttps://svelte.dev/e/props_rest_readonly`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("props_rest_readonly");
+		throw new Error(`https://svelte.dev/e/props_rest_readonly`);
 	}
 }
 
@@ -284,13 +268,12 @@ export function props_rest_readonly(property) {
  */
 export function rune_outside_svelte(rune) {
 	if (DEV) {
-		const error = new Error(`rune_outside_svelte\nThe \`${rune}\` rune is only available inside \`.svelte\` and \`.svelte.js/ts\` files`);
+		const error = new Error(`rune_outside_svelte\nThe \`${rune}\` rune is only available inside \`.svelte\` and \`.svelte.js/ts\` files\nhttps://svelte.dev/e/rune_outside_svelte`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("rune_outside_svelte");
+		throw new Error(`https://svelte.dev/e/rune_outside_svelte`);
 	}
 }
 
@@ -300,13 +283,12 @@ export function rune_outside_svelte(rune) {
  */
 export function state_descriptors_fixed() {
 	if (DEV) {
-		const error = new Error(`state_descriptors_fixed\nProperty descriptors defined on \`$state\` objects must contain \`value\` and always be \`enumerable\`, \`configurable\` and \`writable\`.`);
+		const error = new Error(`state_descriptors_fixed\nProperty descriptors defined on \`$state\` objects must contain \`value\` and always be \`enumerable\`, \`configurable\` and \`writable\`.\nhttps://svelte.dev/e/state_descriptors_fixed`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("state_descriptors_fixed");
+		throw new Error(`https://svelte.dev/e/state_descriptors_fixed`);
 	}
 }
 
@@ -316,13 +298,12 @@ export function state_descriptors_fixed() {
  */
 export function state_prototype_fixed() {
 	if (DEV) {
-		const error = new Error(`state_prototype_fixed\nCannot set prototype of \`$state\` object`);
+		const error = new Error(`state_prototype_fixed\nCannot set prototype of \`$state\` object\nhttps://svelte.dev/e/state_prototype_fixed`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("state_prototype_fixed");
+		throw new Error(`https://svelte.dev/e/state_prototype_fixed`);
 	}
 }
 
@@ -332,13 +313,12 @@ export function state_prototype_fixed() {
  */
 export function state_unsafe_local_read() {
 	if (DEV) {
-		const error = new Error(`state_unsafe_local_read\nReading state that was created inside the same derived is forbidden. Consider using \`untrack\` to read locally created state`);
+		const error = new Error(`state_unsafe_local_read\nReading state that was created inside the same derived is forbidden. Consider using \`untrack\` to read locally created state\nhttps://svelte.dev/e/state_unsafe_local_read`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("state_unsafe_local_read");
+		throw new Error(`https://svelte.dev/e/state_unsafe_local_read`);
 	}
 }
 
@@ -348,12 +328,11 @@ export function state_unsafe_local_read() {
  */
 export function state_unsafe_mutation() {
 	if (DEV) {
-		const error = new Error(`state_unsafe_mutation\nUpdating state inside a derived or a template expression is forbidden. If the value should not be reactive, declare it without \`$state\``);
+		const error = new Error(`state_unsafe_mutation\nUpdating state inside a derived or a template expression is forbidden. If the value should not be reactive, declare it without \`$state\`\nhttps://svelte.dev/e/state_unsafe_mutation`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
-		throw new Error("state_unsafe_mutation");
+		throw new Error(`https://svelte.dev/e/state_unsafe_mutation`);
 	}
 }
\ No newline at end of file
diff --git a/packages/svelte/src/internal/client/warnings.js b/packages/svelte/src/internal/client/warnings.js
index 2f28d3e9e3a4..8daba601ef2a 100644
--- a/packages/svelte/src/internal/client/warnings.js
+++ b/packages/svelte/src/internal/client/warnings.js
@@ -12,10 +12,9 @@ var normal = 'font-weight: normal';
  */
 export function assignment_value_stale(property, location) {
 	if (DEV) {
-		console.warn(`%c[svelte] assignment_value_stale\n%cAssignment to \`${property}\` property (${location}) will evaluate to the right-hand side, not the value of \`${property}\` following the assignment. This may result in unexpected behaviour.`, bold, normal);
+		console.warn(`%c[svelte] assignment_value_stale\n%cAssignment to \`${property}\` property (${location}) will evaluate to the right-hand side, not the value of \`${property}\` following the assignment. This may result in unexpected behaviour.\nhttps://svelte.dev/e/assignment_value_stale`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("assignment_value_stale");
+		console.warn(`https://svelte.dev/e/assignment_value_stale`);
 	}
 }
 
@@ -26,10 +25,9 @@ export function assignment_value_stale(property, location) {
  */
 export function binding_property_non_reactive(binding, location) {
 	if (DEV) {
-		console.warn(`%c[svelte] binding_property_non_reactive\n%c${location ? `\`${binding}\` (${location}) is binding to a non-reactive property` : `\`${binding}\` is binding to a non-reactive property`}`, bold, normal);
+		console.warn(`%c[svelte] binding_property_non_reactive\n%c${location ? `\`${binding}\` (${location}) is binding to a non-reactive property` : `\`${binding}\` is binding to a non-reactive property`}\nhttps://svelte.dev/e/binding_property_non_reactive`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("binding_property_non_reactive");
+		console.warn(`https://svelte.dev/e/binding_property_non_reactive`);
 	}
 }
 
@@ -39,10 +37,9 @@ export function binding_property_non_reactive(binding, location) {
  */
 export function console_log_state(method) {
 	if (DEV) {
-		console.warn(`%c[svelte] console_log_state\n%cYour \`console.${method}\` contained \`$state\` proxies. Consider using \`$inspect(...)\` or \`$state.snapshot(...)\` instead`, bold, normal);
+		console.warn(`%c[svelte] console_log_state\n%cYour \`console.${method}\` contained \`$state\` proxies. Consider using \`$inspect(...)\` or \`$state.snapshot(...)\` instead\nhttps://svelte.dev/e/console_log_state`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("console_log_state");
+		console.warn(`https://svelte.dev/e/console_log_state`);
 	}
 }
 
@@ -53,10 +50,9 @@ export function console_log_state(method) {
  */
 export function event_handler_invalid(handler, suggestion) {
 	if (DEV) {
-		console.warn(`%c[svelte] event_handler_invalid\n%c${handler} should be a function. Did you mean to ${suggestion}?`, bold, normal);
+		console.warn(`%c[svelte] event_handler_invalid\n%c${handler} should be a function. Did you mean to ${suggestion}?\nhttps://svelte.dev/e/event_handler_invalid`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("event_handler_invalid");
+		console.warn(`https://svelte.dev/e/event_handler_invalid`);
 	}
 }
 
@@ -68,10 +64,9 @@ export function event_handler_invalid(handler, suggestion) {
  */
 export function hydration_attribute_changed(attribute, html, value) {
 	if (DEV) {
-		console.warn(`%c[svelte] hydration_attribute_changed\n%cThe \`${attribute}\` attribute on \`${html}\` changed its value between server and client renders. The client value, \`${value}\`, will be ignored in favour of the server value`, bold, normal);
+		console.warn(`%c[svelte] hydration_attribute_changed\n%cThe \`${attribute}\` attribute on \`${html}\` changed its value between server and client renders. The client value, \`${value}\`, will be ignored in favour of the server value\nhttps://svelte.dev/e/hydration_attribute_changed`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("hydration_attribute_changed");
+		console.warn(`https://svelte.dev/e/hydration_attribute_changed`);
 	}
 }
 
@@ -81,10 +76,9 @@ export function hydration_attribute_changed(attribute, html, value) {
  */
 export function hydration_html_changed(location) {
 	if (DEV) {
-		console.warn(`%c[svelte] hydration_html_changed\n%c${location ? `The value of an \`{@html ...}\` block ${location} changed between server and client renders. The client value will be ignored in favour of the server value` : "The value of an `{@html ...}` block changed between server and client renders. The client value will be ignored in favour of the server value"}`, bold, normal);
+		console.warn(`%c[svelte] hydration_html_changed\n%c${location ? `The value of an \`{@html ...}\` block ${location} changed between server and client renders. The client value will be ignored in favour of the server value` : "The value of an `{@html ...}` block changed between server and client renders. The client value will be ignored in favour of the server value"}\nhttps://svelte.dev/e/hydration_html_changed`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("hydration_html_changed");
+		console.warn(`https://svelte.dev/e/hydration_html_changed`);
 	}
 }
 
@@ -94,10 +88,9 @@ export function hydration_html_changed(location) {
  */
 export function hydration_mismatch(location) {
 	if (DEV) {
-		console.warn(`%c[svelte] hydration_mismatch\n%c${location ? `Hydration failed because the initial UI does not match what was rendered on the server. The error occurred near ${location}` : "Hydration failed because the initial UI does not match what was rendered on the server"}`, bold, normal);
+		console.warn(`%c[svelte] hydration_mismatch\n%c${location ? `Hydration failed because the initial UI does not match what was rendered on the server. The error occurred near ${location}` : "Hydration failed because the initial UI does not match what was rendered on the server"}\nhttps://svelte.dev/e/hydration_mismatch`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("hydration_mismatch");
+		console.warn(`https://svelte.dev/e/hydration_mismatch`);
 	}
 }
 
@@ -106,10 +99,9 @@ export function hydration_mismatch(location) {
  */
 export function invalid_raw_snippet_render() {
 	if (DEV) {
-		console.warn(`%c[svelte] invalid_raw_snippet_render\n%cThe \`render\` function passed to \`createRawSnippet\` should return HTML for a single element`, bold, normal);
+		console.warn(`%c[svelte] invalid_raw_snippet_render\n%cThe \`render\` function passed to \`createRawSnippet\` should return HTML for a single element\nhttps://svelte.dev/e/invalid_raw_snippet_render`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("invalid_raw_snippet_render");
+		console.warn(`https://svelte.dev/e/invalid_raw_snippet_render`);
 	}
 }
 
@@ -119,10 +111,9 @@ export function invalid_raw_snippet_render() {
  */
 export function legacy_recursive_reactive_block(filename) {
 	if (DEV) {
-		console.warn(`%c[svelte] legacy_recursive_reactive_block\n%cDetected a migrated \`$:\` reactive block in \`${filename}\` that both accesses and updates the same reactive value. This may cause recursive updates when converted to an \`$effect\`.`, bold, normal);
+		console.warn(`%c[svelte] legacy_recursive_reactive_block\n%cDetected a migrated \`$:\` reactive block in \`${filename}\` that both accesses and updates the same reactive value. This may cause recursive updates when converted to an \`$effect\`.\nhttps://svelte.dev/e/legacy_recursive_reactive_block`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("legacy_recursive_reactive_block");
+		console.warn(`https://svelte.dev/e/legacy_recursive_reactive_block`);
 	}
 }
 
@@ -131,10 +122,9 @@ export function legacy_recursive_reactive_block(filename) {
  */
 export function lifecycle_double_unmount() {
 	if (DEV) {
-		console.warn(`%c[svelte] lifecycle_double_unmount\n%cTried to unmount a component that was not mounted`, bold, normal);
+		console.warn(`%c[svelte] lifecycle_double_unmount\n%cTried to unmount a component that was not mounted\nhttps://svelte.dev/e/lifecycle_double_unmount`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("lifecycle_double_unmount");
+		console.warn(`https://svelte.dev/e/lifecycle_double_unmount`);
 	}
 }
 
@@ -146,10 +136,9 @@ export function lifecycle_double_unmount() {
  */
 export function ownership_invalid_binding(parent, child, owner) {
 	if (DEV) {
-		console.warn(`%c[svelte] ownership_invalid_binding\n%c${parent} passed a value to ${child} with \`bind:\`, but the value is owned by ${owner}. Consider creating a binding between ${owner} and ${parent}`, bold, normal);
+		console.warn(`%c[svelte] ownership_invalid_binding\n%c${parent} passed a value to ${child} with \`bind:\`, but the value is owned by ${owner}. Consider creating a binding between ${owner} and ${parent}\nhttps://svelte.dev/e/ownership_invalid_binding`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("ownership_invalid_binding");
+		console.warn(`https://svelte.dev/e/ownership_invalid_binding`);
 	}
 }
 
@@ -160,10 +149,9 @@ export function ownership_invalid_binding(parent, child, owner) {
  */
 export function ownership_invalid_mutation(component, owner) {
 	if (DEV) {
-		console.warn(`%c[svelte] ownership_invalid_mutation\n%c${component ? `${component} mutated a value owned by ${owner}. This is strongly discouraged. Consider passing values to child components with \`bind:\`, or use a callback instead` : "Mutating a value outside the component that created it is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead"}`, bold, normal);
+		console.warn(`%c[svelte] ownership_invalid_mutation\n%c${component ? `${component} mutated a value owned by ${owner}. This is strongly discouraged. Consider passing values to child components with \`bind:\`, or use a callback instead` : "Mutating a value outside the component that created it is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead"}\nhttps://svelte.dev/e/ownership_invalid_mutation`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("ownership_invalid_mutation");
+		console.warn(`https://svelte.dev/e/ownership_invalid_mutation`);
 	}
 }
 
@@ -173,10 +161,9 @@ export function ownership_invalid_mutation(component, owner) {
  */
 export function reactive_declaration_non_reactive_property(location) {
 	if (DEV) {
-		console.warn(`%c[svelte] reactive_declaration_non_reactive_property\n%cA \`$:\` statement (${location}) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode`, bold, normal);
+		console.warn(`%c[svelte] reactive_declaration_non_reactive_property\n%cA \`$:\` statement (${location}) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode\nhttps://svelte.dev/e/reactive_declaration_non_reactive_property`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("reactive_declaration_non_reactive_property");
+		console.warn(`https://svelte.dev/e/reactive_declaration_non_reactive_property`);
 	}
 }
 
@@ -186,9 +173,8 @@ export function reactive_declaration_non_reactive_property(location) {
  */
 export function state_proxy_equality_mismatch(operator) {
 	if (DEV) {
-		console.warn(`%c[svelte] state_proxy_equality_mismatch\n%cReactive \`$state(...)\` proxies and the values they proxy have different identities. Because of this, comparisons with \`${operator}\` will produce unexpected results`, bold, normal);
+		console.warn(`%c[svelte] state_proxy_equality_mismatch\n%cReactive \`$state(...)\` proxies and the values they proxy have different identities. Because of this, comparisons with \`${operator}\` will produce unexpected results\nhttps://svelte.dev/e/state_proxy_equality_mismatch`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
-		console.warn("state_proxy_equality_mismatch");
+		console.warn(`https://svelte.dev/e/state_proxy_equality_mismatch`);
 	}
 }
\ No newline at end of file
diff --git a/packages/svelte/src/internal/server/errors.js b/packages/svelte/src/internal/server/errors.js
index 67f4a2dfc6a4..38c545c84ec8 100644
--- a/packages/svelte/src/internal/server/errors.js
+++ b/packages/svelte/src/internal/server/errors.js
@@ -6,7 +6,7 @@
  * @returns {never}
  */
 export function lifecycle_function_unavailable(name) {
-	const error = new Error(`lifecycle_function_unavailable\n\`${name}(...)\` is not available on the server`);
+	const error = new Error(`lifecycle_function_unavailable\n\`${name}(...)\` is not available on the server\nhttps://svelte.dev/e/lifecycle_function_unavailable`);
 
 	error.name = 'Svelte error';
 	throw error;
diff --git a/packages/svelte/src/internal/shared/clone.test.ts b/packages/svelte/src/internal/shared/clone.test.ts
index 7a8244a7c1af..9c4c6f097e99 100644
--- a/packages/svelte/src/internal/shared/clone.test.ts
+++ b/packages/svelte/src/internal/shared/clone.test.ts
@@ -126,7 +126,7 @@ test('uncloneable value', () => {
 
 	assert.equal(fn, copy);
 	assert.deepEqual(warnings(), [
-		'%c[svelte] state_snapshot_uncloneable\n%cValue cannot be cloned with `$state.snapshot` — the original value was returned'
+		'%c[svelte] state_snapshot_uncloneable\n%cValue cannot be cloned with `$state.snapshot` — the original value was returned\nhttps://svelte.dev/e/state_snapshot_uncloneable'
 	]);
 });
 
@@ -160,7 +160,8 @@ test('uncloneable properties', () => {
 - <value>.c[4]
 - <value>.c[5]
 - <value>.c[6]
-- <value>.c[7]`
+- <value>.c[7]
+https://svelte.dev/e/state_snapshot_uncloneable`
 	]);
 });
 
@@ -181,6 +182,7 @@ test('many uncloneable properties', () => {
 - <value>[4]
 - <value>[5]
 - <value>[6]
-- ...and 93 more`
+- ...and 93 more
+https://svelte.dev/e/state_snapshot_uncloneable`
 	]);
 });
diff --git a/packages/svelte/src/internal/shared/errors.js b/packages/svelte/src/internal/shared/errors.js
index 0d72800fb764..9d94667ec292 100644
--- a/packages/svelte/src/internal/shared/errors.js
+++ b/packages/svelte/src/internal/shared/errors.js
@@ -8,13 +8,13 @@ import { DEV } from 'esm-env';
  */
 export function invalid_default_snippet() {
 	if (DEV) {
-		const error = new Error(`invalid_default_snippet\nCannot use \`{@render children(...)}\` if the parent component uses \`let:\` directives. Consider using a named snippet instead`);
+		const error = new Error(`invalid_default_snippet\nCannot use \`{@render children(...)}\` if the parent component uses \`let:\` directives. Consider using a named snippet instead\nhttps://svelte.dev/e/invalid_default_snippet`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
 		// TODO print a link to the documentation
-		throw new Error("invalid_default_snippet");
+		throw new Error(`https://svelte.dev/e/invalid_default_snippet`);
 	}
 }
 
@@ -25,13 +25,13 @@ export function invalid_default_snippet() {
  */
 export function lifecycle_outside_component(name) {
 	if (DEV) {
-		const error = new Error(`lifecycle_outside_component\n\`${name}(...)\` can only be used during component initialisation`);
+		const error = new Error(`lifecycle_outside_component\n\`${name}(...)\` can only be used during component initialisation\nhttps://svelte.dev/e/lifecycle_outside_component`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
 		// TODO print a link to the documentation
-		throw new Error("lifecycle_outside_component");
+		throw new Error(`https://svelte.dev/e/lifecycle_outside_component`);
 	}
 }
 
@@ -42,13 +42,13 @@ export function lifecycle_outside_component(name) {
  */
 export function store_invalid_shape(name) {
 	if (DEV) {
-		const error = new Error(`store_invalid_shape\n\`${name}\` is not a store with a \`subscribe\` method`);
+		const error = new Error(`store_invalid_shape\n\`${name}\` is not a store with a \`subscribe\` method\nhttps://svelte.dev/e/store_invalid_shape`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
 		// TODO print a link to the documentation
-		throw new Error("store_invalid_shape");
+		throw new Error(`https://svelte.dev/e/store_invalid_shape`);
 	}
 }
 
@@ -58,12 +58,12 @@ export function store_invalid_shape(name) {
  */
 export function svelte_element_invalid_this_value() {
 	if (DEV) {
-		const error = new Error(`svelte_element_invalid_this_value\nThe \`this\` prop on \`<svelte:element>\` must be a string, if defined`);
+		const error = new Error(`svelte_element_invalid_this_value\nThe \`this\` prop on \`<svelte:element>\` must be a string, if defined\nhttps://svelte.dev/e/svelte_element_invalid_this_value`);
 
 		error.name = 'Svelte error';
 		throw error;
 	} else {
 		// TODO print a link to the documentation
-		throw new Error("svelte_element_invalid_this_value");
+		throw new Error(`https://svelte.dev/e/svelte_element_invalid_this_value`);
 	}
 }
\ No newline at end of file
diff --git a/packages/svelte/src/internal/shared/warnings.js b/packages/svelte/src/internal/shared/warnings.js
index 37269a674eb5..573c5b1e735c 100644
--- a/packages/svelte/src/internal/shared/warnings.js
+++ b/packages/svelte/src/internal/shared/warnings.js
@@ -11,10 +11,10 @@ var normal = 'font-weight: normal';
  */
 export function dynamic_void_element_content(tag) {
 	if (DEV) {
-		console.warn(`%c[svelte] dynamic_void_element_content\n%c\`<svelte:element this="${tag}">\` is a void element — it cannot have content`, bold, normal);
+		console.warn(`%c[svelte] dynamic_void_element_content\n%c\`<svelte:element this="${tag}">\` is a void element — it cannot have content\nhttps://svelte.dev/e/dynamic_void_element_content`, bold, normal);
 	} else {
 		// TODO print a link to the documentation
-		console.warn("dynamic_void_element_content");
+		console.warn(`https://svelte.dev/e/dynamic_void_element_content`);
 	}
 }
 
@@ -30,9 +30,9 @@ export function state_snapshot_uncloneable(properties) {
 			? `The following properties cannot be cloned with \`$state.snapshot\` — the return value contains the originals:
 
 ${properties}`
-			: "Value cannot be cloned with `$state.snapshot` — the original value was returned"}`, bold, normal);
+			: "Value cannot be cloned with `$state.snapshot` — the original value was returned"}\nhttps://svelte.dev/e/state_snapshot_uncloneable`, bold, normal);
 	} else {
 		// TODO print a link to the documentation
-		console.warn("state_snapshot_uncloneable");
+		console.warn(`https://svelte.dev/e/state_snapshot_uncloneable`);
 	}
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/compiler-errors/test.ts b/packages/svelte/tests/compiler-errors/test.ts
index ea696890b4f8..5e57a3a03286 100644
--- a/packages/svelte/tests/compiler-errors/test.ts
+++ b/packages/svelte/tests/compiler-errors/test.ts
@@ -12,6 +12,13 @@ interface CompilerErrorTest extends BaseTest {
 	};
 }
 
+/**
+ * Remove the "https://svelte.dev/e/..." link
+ */
+function strip_link(message: string) {
+	return message.slice(0, message.lastIndexOf('\n'));
+}
+
 const { test, run } = suite<CompilerErrorTest>((config, cwd) => {
 	if (!fs.existsSync(`${cwd}/main.svelte`) && !fs.existsSync(`${cwd}/main.svelte.js`)) {
 		throw new Error('Expected main.svelte or main.svelte.js');
@@ -30,7 +37,7 @@ const { test, run } = suite<CompilerErrorTest>((config, cwd) => {
 			caught_error = true;
 
 			expect(error.code).toBe(config.error.code);
-			expect(error.message).toBe(config.error.message);
+			expect(strip_link(error.message)).toBe(config.error.message);
 
 			if (config.error.position) {
 				expect(error.position).toEqual(config.error.position);
@@ -55,7 +62,7 @@ const { test, run } = suite<CompilerErrorTest>((config, cwd) => {
 			caught_error = true;
 
 			expect(error.code).toEqual(config.error.code);
-			expect(error.message).toEqual(config.error.message);
+			expect(strip_link(error.message)).toEqual(config.error.message);
 
 			if (config.error.position) {
 				expect(error.position).toEqual(config.error.position);
diff --git a/packages/svelte/tests/css/test.ts b/packages/svelte/tests/css/test.ts
index 443ee0295809..dd51f52eabc3 100644
--- a/packages/svelte/tests/css/test.ts
+++ b/packages/svelte/tests/css/test.ts
@@ -12,6 +12,14 @@ function normalize_warning(warning: Warning) {
 	delete warning.filename;
 	delete warning.position;
 	delete warning.frame;
+
+	// Remove the "https://svelte.dev/e/..." link at the end
+	const lines = warning.message.split('\n');
+	if (lines.at(-1)?.startsWith('https://svelte.dev/e/')) {
+		lines.pop();
+	}
+	warning.message = lines.join('\n');
+
 	return warning;
 }
 
@@ -28,6 +36,13 @@ interface CssTest extends BaseTest {
 	props?: Record<string, any>;
 }
 
+/**
+ * Remove the "https://svelte.dev/e/..." link
+ */
+function strip_link(message: string) {
+	return message.slice(0, message.lastIndexOf('\n'));
+}
+
 const { test, run } = suite<CssTest>(async (config, cwd) => {
 	await compile_directory(cwd, 'client', { cssHash: () => 'svelte-xyz', ...config.compileOptions });
 	await compile_directory(cwd, 'server', { cssHash: () => 'svelte-xyz', ...config.compileOptions });
diff --git a/packages/svelte/tests/hydration/test.ts b/packages/svelte/tests/hydration/test.ts
index 7247778d0ffa..3bf2dd286cd0 100644
--- a/packages/svelte/tests/hydration/test.ts
+++ b/packages/svelte/tests/hydration/test.ts
@@ -77,7 +77,14 @@ const { test, run } = suite<HydrationTest>(async (config, cwd) => {
 				// TODO convert this to structured data, for more robust comparison?
 				const text = args[0];
 				const code = text.slice(11, text.indexOf('\n%c', 11));
-				const message = text.slice(text.indexOf('%c', 2) + 2);
+				let message = text.slice(text.indexOf('%c', 2) + 2);
+
+				// Remove the "https://svelte.dev/e/..." link at the end
+				const lines = message.split('\n');
+				if (lines.at(-1)?.startsWith('https://svelte.dev/e/')) {
+					lines.pop();
+				}
+				message = lines.join('\n');
 
 				if (typeof message === 'string' && code === 'hydration_mismatch') {
 					got_hydration_error = true;
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/_config.js
index 9e4b7222afd0..3eba548d7c24 100644
--- a/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/_config.js
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/_config.js
@@ -18,7 +18,7 @@ export default test({
 2: 
 3: unterminated template
                         ^`,
-			message: 'Unexpected end of input',
+			message: 'Unexpected end of input\nhttps://svelte.dev/e/unexpected_eof',
 			position: [30, 30],
 			start: {
 				character: 30,
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/output.svelte
index a4c705695a1d..441605f4f978 100644
--- a/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/output.svelte
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-with-errors/output.svelte
@@ -1,4 +1,5 @@
-<!-- @migration-task Error while migrating Svelte code: Unexpected end of input -->
+<!-- @migration-task Error while migrating Svelte code: Unexpected end of input
+https://svelte.dev/e/unexpected_eof -->
 <script
 
 unterminated template
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/extended-builtin/_config.js b/packages/svelte/tests/runtime-browser/custom-elements-samples/extended-builtin/_config.js
index c5dfa8ecc7d2..022bc2df2096 100644
--- a/packages/svelte/tests/runtime-browser/custom-elements-samples/extended-builtin/_config.js
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/extended-builtin/_config.js
@@ -5,7 +5,8 @@ export default test({
 	warnings: [
 		{
 			code: 'attribute_avoid_is',
-			message: 'The "is" attribute is not supported cross-browser and should be avoided',
+			message:
+				'The "is" attribute is not supported cross-browser and should be avoided\nhttps://svelte.dev/e/attribute_avoid_is',
 			start: {
 				character: 109,
 				column: 8,
diff --git a/packages/svelte/tests/runtime-legacy/shared.ts b/packages/svelte/tests/runtime-legacy/shared.ts
index b14c0bdf4bd3..e6dc0f385bf9 100644
--- a/packages/svelte/tests/runtime-legacy/shared.ts
+++ b/packages/svelte/tests/runtime-legacy/shared.ts
@@ -216,8 +216,18 @@ async function run_test_variant(
 			console.warn = (...args) => {
 				if (args[0].startsWith('%c[svelte]')) {
 					// TODO convert this to structured data, for more robust comparison?
-					const message = args[0];
-					warnings.push(message.slice(message.indexOf('%c', 2) + 2));
+
+					let message = args[0];
+					message = message.slice(message.indexOf('%c', 2) + 2);
+
+					// Remove the "https://svelte.dev/e/..." link at the end
+					const lines = message.split('\n');
+					if (lines.at(-1)?.startsWith('https://svelte.dev/e/')) {
+						lines.pop();
+					}
+					message = lines.join('\n');
+
+					warnings.push(message);
 				} else {
 					warnings.push(...args);
 				}
diff --git a/packages/svelte/tests/validator/test.ts b/packages/svelte/tests/validator/test.ts
index 1dcc5a58d5a5..99d8feba2497 100644
--- a/packages/svelte/tests/validator/test.ts
+++ b/packages/svelte/tests/validator/test.ts
@@ -13,6 +13,13 @@ interface ValidatorTest extends BaseTest {
 	};
 }
 
+/**
+ * Remove the "https://svelte.dev/e/..." link
+ */
+function strip_link(message: string) {
+	return message.slice(0, message.lastIndexOf('\n'));
+}
+
 const { test, run } = suite<ValidatorTest>(async (config, cwd) => {
 	const expected_warnings = try_load_json(`${cwd}/warnings.json`) || [];
 	const expected_errors = try_load_json(`${cwd}/errors.json`);
@@ -40,7 +47,7 @@ const { test, run } = suite<ValidatorTest>(async (config, cwd) => {
 		assert.deepEqual(
 			warnings.map((w) => ({
 				code: w.code,
-				message: w.message,
+				message: strip_link(w.message),
 				start: { line: w.start?.line, column: w.start?.column },
 				end: { line: w.end?.line, column: w.end?.column }
 			})),
@@ -56,7 +63,7 @@ const { test, run } = suite<ValidatorTest>(async (config, cwd) => {
 		assert.deepEqual(
 			{
 				code: error.code,
-				message: error.message,
+				message: strip_link(error.message),
 				start: { line: error.start?.line, column: error.start?.column },
 				end: { line: error.end?.line, column: error.end?.column }
 			},

From a25a17373d637a071ffff0587ab4e812ccbce1bc Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 9 Dec 2024 13:29:28 -0500
Subject: [PATCH 28/62] chore: upgrade last changeset to a minor (#14636)

---
 .changeset/breezy-feet-knock.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.changeset/breezy-feet-knock.md b/.changeset/breezy-feet-knock.md
index 60e05c9e4ad3..881179ef51cd 100644
--- a/.changeset/breezy-feet-knock.md
+++ b/.changeset/breezy-feet-knock.md
@@ -1,5 +1,5 @@
 ---
-'svelte': patch
+'svelte': minor
 ---
 
-chore: provide links to documentation for errors/warnings
+feat: provide links to documentation for errors/warnings

From 8bee23e38732adb2fafb5427223fefa0a1d58734 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 9 Dec 2024 13:31:49 -0500
Subject: [PATCH 29/62] Version Packages (#14631)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/breezy-feet-knock.md   |  5 -----
 .changeset/four-carrots-burn.md   |  5 -----
 .changeset/stupid-buckets-drum.md |  5 -----
 packages/svelte/CHANGELOG.md      | 12 ++++++++++++
 packages/svelte/package.json      |  2 +-
 packages/svelte/src/version.js    |  2 +-
 6 files changed, 14 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/breezy-feet-knock.md
 delete mode 100644 .changeset/four-carrots-burn.md
 delete mode 100644 .changeset/stupid-buckets-drum.md

diff --git a/.changeset/breezy-feet-knock.md b/.changeset/breezy-feet-knock.md
deleted file mode 100644
index 881179ef51cd..000000000000
--- a/.changeset/breezy-feet-knock.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: provide links to documentation for errors/warnings
diff --git a/.changeset/four-carrots-burn.md b/.changeset/four-carrots-burn.md
deleted file mode 100644
index 39cefcc4b76e..000000000000
--- a/.changeset/four-carrots-burn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: allow exports with source from script module even if no bind is present
diff --git a/.changeset/stupid-buckets-drum.md b/.changeset/stupid-buckets-drum.md
deleted file mode 100644
index 57d6f015f786..000000000000
--- a/.changeset/stupid-buckets-drum.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: deconflict `get_name` for literal class properties
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 00ef29347533..1d60d94073e4 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.10.0
+
+### Minor Changes
+
+- feat: provide links to documentation for errors/warnings ([#14629](https://github.com/sveltejs/svelte/pull/14629))
+
+### Patch Changes
+
+- fix: allow exports with source from script module even if no bind is present ([#14620](https://github.com/sveltejs/svelte/pull/14620))
+
+- fix: deconflict `get_name` for literal class properties ([#14607](https://github.com/sveltejs/svelte/pull/14607))
+
 ## 5.9.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 5d662af00c3f..62160514bb5d 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.9.1",
+  "version": "5.10.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 20ff578fbeac..f72df5a4892c 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.9.1';
+export const VERSION = '5.10.0';
 export const PUBLIC_VERSION = '5';

From 9cfd2e20abee1dba1d8dc50f75875a15a08a1023 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 10 Dec 2024 12:44:31 +0000
Subject: [PATCH 30/62] fix: restore input binding selection position (#14649)

---
 .changeset/cyan-ducks-train.md                           | 5 +++++
 .../src/internal/client/dom/elements/bindings/input.js   | 9 +++++++++
 2 files changed, 14 insertions(+)
 create mode 100644 .changeset/cyan-ducks-train.md

diff --git a/.changeset/cyan-ducks-train.md b/.changeset/cyan-ducks-train.md
new file mode 100644
index 000000000000..6f061706a35c
--- /dev/null
+++ b/.changeset/cyan-ducks-train.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: restore input binding selection position
diff --git a/packages/svelte/src/internal/client/dom/elements/bindings/input.js b/packages/svelte/src/internal/client/dom/elements/bindings/input.js
index 810dcb08629d..ec123d39681d 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/input.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/input.js
@@ -30,8 +30,17 @@ export function bind_value(input, get, set = get) {
 		// In runes mode, respect any validation in accessors (doesn't apply in legacy mode,
 		// because we use mutable state which ensures the render effect always runs)
 		if (runes && value !== (value = get())) {
+			var start = input.selectionStart;
+			var end = input.selectionEnd;
+
 			// the value is coerced on assignment
 			input.value = value ?? '';
+
+			// Restore selection
+			if (end !== null) {
+				input.selectionStart = start;
+				input.selectionEnd = Math.min(end, input.value.length);
+			}
 		}
 	});
 

From 66e30d3288c5f69bafd8418c5ebb4f8c764ca4cf Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 10 Dec 2024 12:44:44 +0000
Subject: [PATCH 31/62] fix: ensure snippet hoisting works in the correct scope
 (#14642)

* fix: ensure snippet hoisting works in the correct scope

* fix bug

* revert

* revert
---
 .changeset/chatty-windows-own.md                    |  5 +++++
 .../phases/2-analyze/visitors/SnippetBlock.js       |  3 ++-
 packages/svelte/src/compiler/phases/scope.js        |  6 +-----
 .../samples/snippet-hoisting-2/_config.js           |  5 +++++
 .../samples/snippet-hoisting-2/main.svelte          | 13 +++++++++++++
 .../samples/snippet-hoisting-3/_config.js           |  5 +++++
 .../samples/snippet-hoisting-3/main.svelte          | 13 +++++++++++++
 7 files changed, 44 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/chatty-windows-own.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/main.svelte

diff --git a/.changeset/chatty-windows-own.md b/.changeset/chatty-windows-own.md
new file mode 100644
index 000000000000..7a5ac00c44d0
--- /dev/null
+++ b/.changeset/chatty-windows-own.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure snippet hoisting works in the correct scope
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
index cd8af21f98de..7b8cd7593fd3 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
@@ -99,8 +99,9 @@ function can_hoist_snippet(scope, scopes, visited = new Set()) {
 		if (binding.initial?.type === 'SnippetBlock') {
 			if (visited.has(binding)) continue;
 			visited.add(binding);
+			const snippet_scope = /** @type {Scope} */ (scopes.get(binding.initial));
 
-			if (can_hoist_snippet(binding.scope, scopes, visited)) {
+			if (can_hoist_snippet(snippet_scope, scopes, visited)) {
 				continue;
 			}
 		}
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 7f22aa7c8792..7155d3172049 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -628,12 +628,8 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 
 		SnippetBlock(node, context) {
 			const state = context.state;
-			// Special-case for root-level snippets: they become part of the instance scope
-			const is_top_level = !context.path.at(-2);
 			let scope = state.scope;
-			if (is_top_level) {
-				scope = /** @type {Scope} */ (parent);
-			}
+
 			scope.declare(node.expression, 'normal', 'function', node);
 
 			const child_scope = state.scope.child();
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/_config.js b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/_config.js
new file mode 100644
index 000000000000..ae00bd9f56ef
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: 'a'
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/main.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/main.svelte
new file mode 100644
index 000000000000..d090460a09e9
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-2/main.svelte
@@ -0,0 +1,13 @@
+<script>
+	let abc = 'a'
+</script>
+
+{@render b()}
+
+{#snippet a()}
+	{abc}
+{/snippet}
+
+{#snippet b()}
+	{@render a()}
+{/snippet}
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/_config.js b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/_config.js
new file mode 100644
index 000000000000..240263603d28
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: '<h1>Hello world!</h1>'
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/main.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/main.svelte
new file mode 100644
index 000000000000..b23a69d53d8d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisting-3/main.svelte
@@ -0,0 +1,13 @@
+<script module>
+	export { foo }
+</script>
+
+<script>
+	let name = 'world';
+</script>
+
+<h1>Hello {name}!</h1>
+
+{#snippet foo()}
+	oo
+{/snippet}

From 88184cd769b4d47fa1f876a9368da722ecf1c6a3 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 10 Dec 2024 14:50:44 +0100
Subject: [PATCH 32/62] fix: don't emit assignment warnings for bindings
 (#14651)

Also fixes the possibility of an infinite loop due to the property access during the dev time check

fixes #14643
---
 .changeset/thick-dryers-kiss.md               |  5 ++++
 .../client/visitors/AssignmentExpression.js   | 11 +++++++
 .../svelte/src/internal/client/dev/assign.js  | 29 ++++++++++++++++---
 .../Test.svelte                               | 11 +++++++
 .../_config.js                                |  8 ++---
 .../main.svelte                               | 16 ++++++++++
 .../_config.js                                |  2 +-
 .../main.svelte                               |  0
 .../main.svelte                               |  7 -----
 9 files changed, 73 insertions(+), 16 deletions(-)
 create mode 100644 .changeset/thick-dryers-kiss.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/Test.svelte
 rename packages/svelte/tests/runtime-runes/samples/{proxy-nullish-coalescing-assignment-warning => proxy-coercive-assignment-warning}/_config.js (79%)
 create mode 100644 packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/main.svelte
 rename packages/svelte/tests/runtime-runes/samples/{proxy-nullish-coalescing-assignment => proxy-coercive-assignment}/_config.js (86%)
 rename packages/svelte/tests/runtime-runes/samples/{proxy-nullish-coalescing-assignment => proxy-coercive-assignment}/main.svelte (100%)
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/main.svelte

diff --git a/.changeset/thick-dryers-kiss.md b/.changeset/thick-dryers-kiss.md
new file mode 100644
index 000000000000..bbdc765b4e0c
--- /dev/null
+++ b/.changeset/thick-dryers-kiss.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't emit assignment warnings for bindings
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/AssignmentExpression.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/AssignmentExpression.js
index 66ea2c4941a4..5ac33e629e82 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/AssignmentExpression.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/AssignmentExpression.js
@@ -169,6 +169,17 @@ function build_assignment(operator, left, right, context) {
 		}
 	}
 
+	// special case — ignore `bind:prop={getter, (v) => (...)}` / `bind:value={x.y}`
+	if (
+		path.at(-1) === 'Component' ||
+		path.at(-1) === 'SvelteComponent' ||
+		(path.at(-1) === 'ArrowFunctionExpression' &&
+			path.at(-2) === 'SequenceExpression' &&
+			(path.at(-3) === 'Component' || path.at(-3) === 'SvelteComponent'))
+	) {
+		should_transform = false;
+	}
+
 	if (left.type === 'MemberExpression' && should_transform) {
 		const callee = callees[operator];
 
diff --git a/packages/svelte/src/internal/client/dev/assign.js b/packages/svelte/src/internal/client/dev/assign.js
index cf8c31a941dd..fc1b647f78ca 100644
--- a/packages/svelte/src/internal/client/dev/assign.js
+++ b/packages/svelte/src/internal/client/dev/assign.js
@@ -1,3 +1,4 @@
+import { untrack } from '../runtime.js';
 import * as w from '../warnings.js';
 import { sanitize_location } from './location.js';
 
@@ -23,7 +24,12 @@ function compare(a, b, property, location) {
  * @param {string} location
  */
 export function assign(object, property, value, location) {
-	return compare((object[property] = value), object[property], property, location);
+	return compare(
+		(object[property] = value),
+		untrack(() => object[property]),
+		property,
+		location
+	);
 }
 
 /**
@@ -33,7 +39,12 @@ export function assign(object, property, value, location) {
  * @param {string} location
  */
 export function assign_and(object, property, value, location) {
-	return compare((object[property] &&= value), object[property], property, location);
+	return compare(
+		(object[property] &&= value),
+		untrack(() => object[property]),
+		property,
+		location
+	);
 }
 
 /**
@@ -43,7 +54,12 @@ export function assign_and(object, property, value, location) {
  * @param {string} location
  */
 export function assign_or(object, property, value, location) {
-	return compare((object[property] ||= value), object[property], property, location);
+	return compare(
+		(object[property] ||= value),
+		untrack(() => object[property]),
+		property,
+		location
+	);
 }
 
 /**
@@ -53,5 +69,10 @@ export function assign_or(object, property, value, location) {
  * @param {string} location
  */
 export function assign_nullish(object, property, value, location) {
-	return compare((object[property] ??= value), object[property], property, location);
+	return compare(
+		(object[property] ??= value),
+		untrack(() => object[property]),
+		property,
+		location
+	);
 }
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/Test.svelte b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/Test.svelte
new file mode 100644
index 000000000000..c2b06202aeb3
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/Test.svelte
@@ -0,0 +1,11 @@
+<script>
+	let { x = $bindable() } = $props();
+
+	$effect(() => {
+		x = {};
+	});
+
+	export function soThatTestReturnsAnObject() {
+		return x;
+	}
+</script>
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/_config.js b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/_config.js
similarity index 79%
rename from packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/_config.js
rename to packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/_config.js
index a6d79c05ed31..ad7bdc654a0b 100644
--- a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/_config.js
@@ -6,19 +6,19 @@ export default test({
 		dev: true
 	},
 
-	html: `<button>items: null</button>`,
+	html: `<button>items: null</button> <div>x</div>`,
 
 	test({ assert, target, warnings }) {
 		const btn = target.querySelector('button');
 
 		flushSync(() => btn?.click());
-		assert.htmlEqual(target.innerHTML, `<button>items: []</button>`);
+		assert.htmlEqual(target.innerHTML, `<button>items: []</button> <div>x</div>`);
 
 		flushSync(() => btn?.click());
-		assert.htmlEqual(target.innerHTML, `<button>items: [0]</button>`);
+		assert.htmlEqual(target.innerHTML, `<button>items: [0]</button> <div>x</div>`);
 
 		assert.deepEqual(warnings, [
-			'Assignment to `items` property (main.svelte:5:24) will evaluate to the right-hand side, not the value of `items` following the assignment. This may result in unexpected behaviour.'
+			'Assignment to `items` property (main.svelte:8:24) will evaluate to the right-hand side, not the value of `items` following the assignment. This may result in unexpected behaviour.'
 		]);
 	}
 });
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/main.svelte b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/main.svelte
new file mode 100644
index 000000000000..40592e08b8ca
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/main.svelte
@@ -0,0 +1,16 @@
+ <script>
+	import Test from './Test.svelte';
+
+	let entries = $state([]);
+	let object = $state({ items: null });
+</script>
+
+<button onclick={() => (object.items ??= []).push(object.items.length)}>
+	items: {JSON.stringify(object.items)}
+</button>
+
+<!-- these should not emit warnings -->
+<div bind:this={entries[0]}>x</div>
+<Test bind:this={entries[1]}></Test>
+<Test bind:this={() => entries[2], (v) => (entries[2] = v)}></Test>
+<Test bind:x={entries[3]}></Test>
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/_config.js b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment/_config.js
similarity index 86%
rename from packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/_config.js
rename to packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment/_config.js
index 99d957e980fe..16032412275e 100644
--- a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment/_config.js
@@ -5,7 +5,7 @@ export default test({
 	html: `<button>items: null</button>`,
 
 	test({ assert, target }) {
-		const [btn1, btn2] = target.querySelectorAll('button');
+		const [btn1] = target.querySelectorAll('button');
 
 		flushSync(() => btn1.click());
 		assert.htmlEqual(target.innerHTML, `<button>items: [0]</button>`);
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/main.svelte b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment/main.svelte
similarity index 100%
rename from packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/main.svelte
rename to packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment/main.svelte
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/main.svelte b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/main.svelte
deleted file mode 100644
index f151336046f1..000000000000
--- a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/main.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	let object = $state({ items: null });
-</script>
-
-<button onclick={() => (object.items ??= []).push(object.items.length)}>
-	items: {JSON.stringify(object.items)}
-</button>

From ab1f7f437e264880443b51377d10b4f99f67f113 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 10 Dec 2024 14:58:16 +0100
Subject: [PATCH 33/62] fix: transform everything that is not a selector inside
 `:global` (#14577)

Fixes #14568
---
 .changeset/red-worms-suffer.md                |  5 ++++
 .../compiler/phases/3-transform/css/index.js  | 30 ++++++++++++-------
 .../css/samples/global-block/expected.css     | 17 +++++++++++
 .../css/samples/global-block/input.svelte     | 17 +++++++++++
 4 files changed, 58 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/red-worms-suffer.md

diff --git a/.changeset/red-worms-suffer.md b/.changeset/red-worms-suffer.md
new file mode 100644
index 000000000000..bf8d08ecdcbf
--- /dev/null
+++ b/.changeset/red-worms-suffer.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: transform everything that is not a selector inside `:global`
diff --git a/packages/svelte/src/compiler/phases/3-transform/css/index.js b/packages/svelte/src/compiler/phases/3-transform/css/index.js
index c1175e4b5b80..75b63260d567 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -78,7 +78,7 @@ const visitors = {
 		context.state.code.addSourcemapLocation(node.end);
 		context.next();
 	},
-	Atrule(node, { state, next }) {
+	Atrule(node, { state, next, path }) {
 		if (is_keyframes_node(node)) {
 			let start = node.start + node.name.length + 1;
 			while (state.code.original[start] === ' ') start += 1;
@@ -87,7 +87,7 @@ const visitors = {
 
 			if (node.prelude.startsWith('-global-')) {
 				state.code.remove(start, start + 8);
-			} else {
+			} else if (!is_in_global_block(path)) {
 				state.code.prependRight(start, `${state.hash}-`);
 			}
 
@@ -134,7 +134,7 @@ const visitors = {
 			}
 		}
 	},
-	Rule(node, { state, next, visit }) {
+	Rule(node, { state, next, visit, path }) {
 		if (state.minify) {
 			remove_preceding_whitespace(node.start, state);
 			remove_preceding_whitespace(node.block.end - 1, state);
@@ -154,7 +154,7 @@ const visitors = {
 			return;
 		}
 
-		if (!is_used(node)) {
+		if (!is_used(node) && !is_in_global_block(path)) {
 			if (state.minify) {
 				state.code.remove(node.start, node.end);
 			} else {
@@ -182,20 +182,20 @@ const visitors = {
 					state.code.appendLeft(node.block.end, '*/');
 				}
 
-				// don't recurse into selector or body
+				// don't recurse into selectors but visit the body
+				visit(node.block);
 				return;
 			}
-
-			// don't recurse into body
-			visit(node.prelude);
-			return;
 		}
 
 		next();
 	},
 	SelectorList(node, { state, next, path }) {
-		// Only add comments if we're not inside a complex selector that itself is unused
-		if (!path.find((n) => n.type === 'ComplexSelector' && !n.metadata.used)) {
+		// Only add comments if we're not inside a complex selector that itself is unused or a global block
+		if (
+			!is_in_global_block(path) &&
+			!path.find((n) => n.type === 'ComplexSelector' && !n.metadata.used)
+		) {
 			const children = node.children;
 			let pruning = false;
 			let prune_start = children[0].start;
@@ -359,6 +359,14 @@ const visitors = {
 	}
 };
 
+/**
+ *
+ * @param {Array<Css.Node>} path
+ */
+function is_in_global_block(path) {
+	return path.some((node) => node.type === 'Rule' && node.metadata.is_global_block);
+}
+
 /**
  * @param {Css.PseudoClassSelector} selector
  * @param {Css.Combinator | null} combinator
diff --git a/packages/svelte/tests/css/samples/global-block/expected.css b/packages/svelte/tests/css/samples/global-block/expected.css
index 3acc1b021230..8a7c493d7c90 100644
--- a/packages/svelte/tests/css/samples/global-block/expected.css
+++ b/packages/svelte/tests/css/samples/global-block/expected.css
@@ -69,3 +69,20 @@
 			color: red;
 		}
 	}*/
+	/* :global{*/
+		.x{
+			animation: svelte-xyz-test 1s;
+		}
+
+		@keyframes test-in{
+			to{
+				opacity: 1;
+			}
+		}
+	/*}*/
+
+	@keyframes svelte-xyz-test{
+		to{
+			opacity: 1;
+		}
+	}
diff --git a/packages/svelte/tests/css/samples/global-block/input.svelte b/packages/svelte/tests/css/samples/global-block/input.svelte
index 2f2cdfcbd5aa..dc1a7540108f 100644
--- a/packages/svelte/tests/css/samples/global-block/input.svelte
+++ b/packages/svelte/tests/css/samples/global-block/input.svelte
@@ -71,4 +71,21 @@
 			color: red;
 		}
 	}
+	:global{
+		.x{
+			animation: test 1s;
+		}
+
+		@keyframes test-in{
+			to{
+				opacity: 1;
+			}
+		}
+	}
+
+	@keyframes test{
+		to{
+			opacity: 1;
+		}
+	}
 </style>

From fb879dd702a0c74670136f78ad28cf76727da557 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 10 Dec 2024 19:21:24 +0000
Subject: [PATCH 34/62] fix: ensure $state.snapshot clones holey arrays
 correctly (#14657)

* fix: ensure $state.snapshot clones holey arrays correctly

* fix: ensure $state.snapshot clones holey arrays correctly

* fix: ensure $state.snapshot clones holey arrays correctly

* fix: ensure $state.snapshot clones holey arrays correctly
---
 .changeset/clean-bobcats-fail.md                    |  5 +++++
 packages/svelte/src/internal/shared/clone.js        | 13 ++++++++-----
 .../samples/state-snapshot-array-holes/_config.js   |  5 +++++
 .../samples/state-snapshot-array-holes/main.svelte  | 10 ++++++++++
 4 files changed, 28 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/clean-bobcats-fail.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/main.svelte

diff --git a/.changeset/clean-bobcats-fail.md b/.changeset/clean-bobcats-fail.md
new file mode 100644
index 000000000000..00d8286bcb28
--- /dev/null
+++ b/.changeset/clean-bobcats-fail.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure $state.snapshot clones holey arrays correctly
diff --git a/packages/svelte/src/internal/shared/clone.js b/packages/svelte/src/internal/shared/clone.js
index cef14bc14f9e..4632fc3d68ed 100644
--- a/packages/svelte/src/internal/shared/clone.js
+++ b/packages/svelte/src/internal/shared/clone.js
@@ -54,22 +54,25 @@ export function snapshot(value, skip_warning = false) {
  */
 function clone(value, cloned, path, paths, original = null) {
 	if (typeof value === 'object' && value !== null) {
-		const unwrapped = cloned.get(value);
+		var unwrapped = cloned.get(value);
 		if (unwrapped !== undefined) return unwrapped;
 
 		if (value instanceof Map) return /** @type {Snapshot<T>} */ (new Map(value));
 		if (value instanceof Set) return /** @type {Snapshot<T>} */ (new Set(value));
 
 		if (is_array(value)) {
-			const copy = /** @type {Snapshot<any>} */ ([]);
+			var copy = /** @type {Snapshot<any>} */ (Array(value.length));
 			cloned.set(value, copy);
 
 			if (original !== null) {
 				cloned.set(original, copy);
 			}
 
-			for (let i = 0; i < value.length; i += 1) {
-				copy.push(clone(value[i], cloned, DEV ? `${path}[${i}]` : path, paths));
+			for (var i = 0; i < value.length; i += 1) {
+				var element = value[i];
+				if (i in value) {
+					copy[i] = clone(element, cloned, DEV ? `${path}[${i}]` : path, paths);
+				}
 			}
 
 			return copy;
@@ -77,7 +80,7 @@ function clone(value, cloned, path, paths, original = null) {
 
 		if (get_prototype_of(value) === object_prototype) {
 			/** @type {Snapshot<any>} */
-			const copy = {};
+			copy = {};
 			cloned.set(value, copy);
 
 			if (original !== null) {
diff --git a/packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/_config.js b/packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/_config.js
new file mode 100644
index 000000000000..707c92118bf3
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<div>false</div><div>true</div>`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/main.svelte b/packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/main.svelte
new file mode 100644
index 000000000000..cb5c116f37f1
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/state-snapshot-array-holes/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	let arr = []
+	arr[5] = true
+
+	let state = $state([])
+	state[5] = true
+</script>
+
+<div>{2 in $state.snapshot(state)}</div>
+<div>{5 in $state.snapshot(state)}</div>

From a26b6d80ef734abbf3de4ebe22b838074f53f168 Mon Sep 17 00:00:00 2001
From: grieben <10453720+grieben@users.noreply.github.com>
Date: Tue, 10 Dec 2024 12:29:12 -0700
Subject: [PATCH 35/62] fix: overwrite #last_value when Spring is `.set()` with
 `{instant: true}` (#14656)

* fix: overwrite #last_value when Spring is  with

* run npx changeset
---
 .changeset/shy-carpets-rescue.md     | 5 +++++
 packages/svelte/src/motion/spring.js | 1 +
 2 files changed, 6 insertions(+)
 create mode 100644 .changeset/shy-carpets-rescue.md

diff --git a/.changeset/shy-carpets-rescue.md b/.changeset/shy-carpets-rescue.md
new file mode 100644
index 000000000000..0c7fc6687cea
--- /dev/null
+++ b/.changeset/shy-carpets-rescue.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+Overwrite Spring.#last_value when using .set() with {instant: true}
diff --git a/packages/svelte/src/motion/spring.js b/packages/svelte/src/motion/spring.js
index 270fabd4c774..bc30ce957854 100644
--- a/packages/svelte/src/motion/spring.js
+++ b/packages/svelte/src/motion/spring.js
@@ -282,6 +282,7 @@ export class Spring {
 			this.#task?.abort();
 			this.#task = null;
 			set(this.#current, set(this.#target, value));
+			this.#last_value = value;
 			return Promise.resolve();
 		}
 

From cb5734ae6696f62ecb042c998461b69bfa168a15 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 10 Dec 2024 19:57:11 +0000
Subject: [PATCH 36/62] Version Packages (#14652)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/chatty-windows-own.md |  5 -----
 .changeset/clean-bobcats-fail.md |  5 -----
 .changeset/cyan-ducks-train.md   |  5 -----
 .changeset/red-worms-suffer.md   |  5 -----
 .changeset/shy-carpets-rescue.md |  5 -----
 .changeset/thick-dryers-kiss.md  |  5 -----
 packages/svelte/CHANGELOG.md     | 16 ++++++++++++++++
 packages/svelte/package.json     |  2 +-
 packages/svelte/src/version.js   |  2 +-
 9 files changed, 18 insertions(+), 32 deletions(-)
 delete mode 100644 .changeset/chatty-windows-own.md
 delete mode 100644 .changeset/clean-bobcats-fail.md
 delete mode 100644 .changeset/cyan-ducks-train.md
 delete mode 100644 .changeset/red-worms-suffer.md
 delete mode 100644 .changeset/shy-carpets-rescue.md
 delete mode 100644 .changeset/thick-dryers-kiss.md

diff --git a/.changeset/chatty-windows-own.md b/.changeset/chatty-windows-own.md
deleted file mode 100644
index 7a5ac00c44d0..000000000000
--- a/.changeset/chatty-windows-own.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure snippet hoisting works in the correct scope
diff --git a/.changeset/clean-bobcats-fail.md b/.changeset/clean-bobcats-fail.md
deleted file mode 100644
index 00d8286bcb28..000000000000
--- a/.changeset/clean-bobcats-fail.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure $state.snapshot clones holey arrays correctly
diff --git a/.changeset/cyan-ducks-train.md b/.changeset/cyan-ducks-train.md
deleted file mode 100644
index 6f061706a35c..000000000000
--- a/.changeset/cyan-ducks-train.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: restore input binding selection position
diff --git a/.changeset/red-worms-suffer.md b/.changeset/red-worms-suffer.md
deleted file mode 100644
index bf8d08ecdcbf..000000000000
--- a/.changeset/red-worms-suffer.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: transform everything that is not a selector inside `:global`
diff --git a/.changeset/shy-carpets-rescue.md b/.changeset/shy-carpets-rescue.md
deleted file mode 100644
index 0c7fc6687cea..000000000000
--- a/.changeset/shy-carpets-rescue.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-Overwrite Spring.#last_value when using .set() with {instant: true}
diff --git a/.changeset/thick-dryers-kiss.md b/.changeset/thick-dryers-kiss.md
deleted file mode 100644
index bbdc765b4e0c..000000000000
--- a/.changeset/thick-dryers-kiss.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't emit assignment warnings for bindings
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 1d60d94073e4..66c49002fd19 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,21 @@
 # svelte
 
+## 5.10.1
+
+### Patch Changes
+
+- fix: ensure snippet hoisting works in the correct scope ([#14642](https://github.com/sveltejs/svelte/pull/14642))
+
+- fix: ensure $state.snapshot clones holey arrays correctly ([#14657](https://github.com/sveltejs/svelte/pull/14657))
+
+- fix: restore input binding selection position ([#14649](https://github.com/sveltejs/svelte/pull/14649))
+
+- fix: transform everything that is not a selector inside `:global` ([#14577](https://github.com/sveltejs/svelte/pull/14577))
+
+- Overwrite Spring.#last_value when using .set() with {instant: true} ([#14656](https://github.com/sveltejs/svelte/pull/14656))
+
+- fix: don't emit assignment warnings for bindings ([#14651](https://github.com/sveltejs/svelte/pull/14651))
+
 ## 5.10.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 62160514bb5d..358d56ec5bd3 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.10.0",
+  "version": "5.10.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index f72df5a4892c..527897279509 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.10.0';
+export const VERSION = '5.10.1';
 export const PUBLIC_VERSION = '5';

From a2539cfe1fd763e33c4508dd0ddd92714a910641 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 10 Dec 2024 22:56:50 +0100
Subject: [PATCH 37/62] fix: correctly set custom element props (#14508)

fixes #14391

In #13337 the "when to set as a property" logic for custom elements was adjusted. A bug was introduced during this, and it consists of several parts, of which the latter I'm not sure what's the best solution, hence opening this to discuss.

The problem is that during set_custom_element_data, get_setters is the only check done to differentiate between setting the value as a prop (has a setter) or as an attribute (doesn't have a setter).

The solution is to take into account whether or not the custom element is already registered, and defer getting (and caching) its setters until then. Instead, fall back to a "an object is always set as a prop" heuristic.
---
 .changeset/sharp-shoes-look.md                |  5 +++
 .../client/dom/elements/attributes.js         | 20 +++++++++---
 .../late-ce-mount/_config.js                  | 25 +++++++++++++++
 .../late-ce-mount/main.svelte                 | 31 +++++++++++++++++++
 4 files changed, 77 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/sharp-shoes-look.md
 create mode 100644 packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/_config.js
 create mode 100644 packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/main.svelte

diff --git a/.changeset/sharp-shoes-look.md b/.changeset/sharp-shoes-look.md
new file mode 100644
index 000000000000..2caf6d421b99
--- /dev/null
+++ b/.changeset/sharp-shoes-look.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: take into account registration state when setting custom element props
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 0276069eee49..8f6588e94aa1 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -201,7 +201,7 @@ export function set_xlink_attribute(dom, attribute, value) {
 }
 
 /**
- * @param {any} node
+ * @param {HTMLElement} node
  * @param {string} prop
  * @param {any} value
  */
@@ -216,10 +216,21 @@ export function set_custom_element_data(node, prop, value) {
 	set_active_reaction(null);
 	set_active_effect(null);
 	try {
-		if (get_setters(node).includes(prop)) {
+		if (
+			// Don't compute setters for custom elements while they aren't registered yet,
+			// because during their upgrade/instantiation they might add more setters.
+			// Instead, fall back to a simple "an object, then set as property" heuristic.
+			setters_cache.has(node.nodeName) || customElements.get(node.tagName.toLowerCase())
+				? get_setters(node).includes(prop)
+				: value && typeof value === 'object'
+		) {
+			// @ts-expect-error
 			node[prop] = value;
 		} else {
-			set_attribute(node, prop, value);
+			// We did getters etc checks already, stringify before passing to set_attribute
+			// to ensure it doesn't invoke the same logic again, and potentially populating
+			// the setters cache too early.
+			set_attribute(node, prop, value == null ? value : String(value));
 		}
 	} finally {
 		set_active_reaction(previous_reaction);
@@ -384,8 +395,9 @@ function get_setters(element) {
 	var setters = setters_cache.get(element.nodeName);
 	if (setters) return setters;
 	setters_cache.set(element.nodeName, (setters = []));
+
 	var descriptors;
-	var proto = get_prototype_of(element);
+	var proto = element; // In the case of custom elements there might be setters on the instance
 	var element_proto = Element.prototype;
 
 	// Stop at Element, from there on there's only unnecessary setters we're not interested in
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/_config.js b/packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/_config.js
new file mode 100644
index 000000000000..0679c820ba8c
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/_config.js
@@ -0,0 +1,25 @@
+import { flushSync } from 'svelte';
+import { test } from '../../assert';
+
+const tick = () => Promise.resolve();
+
+// Check that rendering a custom element and setting a property before it is registered
+// does not break the "when to set this as a property" logic
+export default test({
+	async test({ assert, target }) {
+		target.innerHTML = '<custom-element></custom-element>';
+		await tick();
+		await tick();
+
+		const ce_root = target.querySelector('custom-element').shadowRoot;
+
+		ce_root.querySelector('button')?.click();
+		flushSync();
+		await tick();
+		await tick();
+
+		const inner_ce_root = ce_root.querySelectorAll('set-property-before-mounted');
+		assert.htmlEqual(inner_ce_root[0].shadowRoot.innerHTML, 'object|{"foo":"bar"}');
+		assert.htmlEqual(inner_ce_root[1].shadowRoot.innerHTML, 'object|{"foo":"bar"}');
+	}
+});
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/main.svelte b/packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/main.svelte
new file mode 100644
index 000000000000..09a139e642b1
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/late-ce-mount/main.svelte
@@ -0,0 +1,31 @@
+<svelte:options customElement="custom-element" />
+
+<script lang="ts">
+	import { onMount } from 'svelte';
+
+	class CustomElement extends HTMLElement {
+		constructor() {
+			super();
+			this.attachShadow({ mode: 'open' });
+			Object.defineProperty(this, 'property', {
+				set: (value) => {
+					this.shadowRoot.innerHTML = typeof value + '|' + JSON.stringify(value);
+				}
+			});
+		}
+	}
+
+	onMount(async () => {
+		customElements.define('set-property-before-mounted', CustomElement);
+	});
+
+	let property = $state();
+</script>
+
+<button onclick={() => (property = { foo: 'bar' })}>Update</button>
+<!-- one that's there before it's registered -->
+<set-property-before-mounted {property}></set-property-before-mounted>
+<!-- and one that's after registration but sets property to an object right away -->
+{#if property}
+	<set-property-before-mounted {property}></set-property-before-mounted>
+{/if}

From d43a10ba7a1bae86f36bec735ebac572b5962a06 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 11 Dec 2024 11:30:25 -0500
Subject: [PATCH 38/62] feat: add `svelte/reactivity/window` module (#14660)

* feat: add `svelte/reactivity/window` module

* lint

* fix

* hide private types

* online binding

* tweak docs

* tweak

* add @since tags

---------

Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/orange-ducks-obey.md               |   5 +
 .../21-svelte-reactivity-window.md            |  15 ++
 packages/svelte/package.json                  |   4 +
 packages/svelte/scripts/generate-types.js     |   1 +
 .../svelte/src/internal/client/dom/task.js    |   2 +-
 packages/svelte/src/reactivity/media-query.js |  27 ++-
 .../svelte/src/reactivity/reactive-value.js   |  24 +++
 .../svelte/src/reactivity/window/index.js     | 154 ++++++++++++++++++
 packages/svelte/types/index.d.ts              |  80 ++++++++-
 9 files changed, 289 insertions(+), 23 deletions(-)
 create mode 100644 .changeset/orange-ducks-obey.md
 create mode 100644 documentation/docs/98-reference/21-svelte-reactivity-window.md
 create mode 100644 packages/svelte/src/reactivity/reactive-value.js
 create mode 100644 packages/svelte/src/reactivity/window/index.js

diff --git a/.changeset/orange-ducks-obey.md b/.changeset/orange-ducks-obey.md
new file mode 100644
index 000000000000..e17bf7ad4289
--- /dev/null
+++ b/.changeset/orange-ducks-obey.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: add `svelte/reactivity/window` module
diff --git a/documentation/docs/98-reference/21-svelte-reactivity-window.md b/documentation/docs/98-reference/21-svelte-reactivity-window.md
new file mode 100644
index 000000000000..cc544dc5ba3f
--- /dev/null
+++ b/documentation/docs/98-reference/21-svelte-reactivity-window.md
@@ -0,0 +1,15 @@
+---
+title: svelte/reactivity/window
+---
+
+This module exports reactive versions of various `window` values, each of which has a reactive `current` property that you can reference in reactive contexts (templates, [deriveds]($derived) and [effects]($effect)) without using [`<svelte:window>`](svelte-window) bindings or manually creating your own event listeners.
+
+```svelte
+<script>
+	import { innerWidth, innerHeight } from 'svelte/reactivity/window';
+</script>
+
+<p>{innerWidth.current}x{innerHeight.current}</p>
+```
+
+> MODULE: svelte/reactivity/window
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 358d56ec5bd3..922c7fc9f94c 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -73,6 +73,10 @@
       "browser": "./src/reactivity/index-client.js",
       "default": "./src/reactivity/index-server.js"
     },
+    "./reactivity/window": {
+      "types": "./types/index.d.ts",
+      "default": "./src/reactivity/window/index.js"
+    },
     "./server": {
       "types": "./types/index.d.ts",
       "default": "./src/server/index.js"
diff --git a/packages/svelte/scripts/generate-types.js b/packages/svelte/scripts/generate-types.js
index 8083851c35db..16bbf52a2e07 100644
--- a/packages/svelte/scripts/generate-types.js
+++ b/packages/svelte/scripts/generate-types.js
@@ -35,6 +35,7 @@ await createBundle({
 		[`${pkg.name}/legacy`]: `${dir}/src/legacy/legacy-client.js`,
 		[`${pkg.name}/motion`]: `${dir}/src/motion/public.d.ts`,
 		[`${pkg.name}/reactivity`]: `${dir}/src/reactivity/index-client.js`,
+		[`${pkg.name}/reactivity/window`]: `${dir}/src/reactivity/window/index.js`,
 		[`${pkg.name}/server`]: `${dir}/src/server/index.d.ts`,
 		[`${pkg.name}/store`]: `${dir}/src/store/public.d.ts`,
 		[`${pkg.name}/transition`]: `${dir}/src/transition/public.d.ts`,
diff --git a/packages/svelte/src/internal/client/dom/task.js b/packages/svelte/src/internal/client/dom/task.js
index 95526b27a769..acb5a5b117f0 100644
--- a/packages/svelte/src/internal/client/dom/task.js
+++ b/packages/svelte/src/internal/client/dom/task.js
@@ -1,7 +1,7 @@
 import { run_all } from '../../shared/utils.js';
 
 // Fallback for when requestIdleCallback is not available
-const request_idle_callback =
+export const request_idle_callback =
 	typeof requestIdleCallback === 'undefined'
 		? (/** @type {() => void} */ cb) => setTimeout(cb, 1)
 		: requestIdleCallback;
diff --git a/packages/svelte/src/reactivity/media-query.js b/packages/svelte/src/reactivity/media-query.js
index a2be0adc91e2..7da9ada667f9 100644
--- a/packages/svelte/src/reactivity/media-query.js
+++ b/packages/svelte/src/reactivity/media-query.js
@@ -1,5 +1,5 @@
-import { createSubscriber } from './create-subscriber.js';
 import { on } from '../events/index.js';
+import { ReactiveValue } from './reactive-value.js';
 
 /**
  * Creates a media query and provides a `current` property that reflects whether or not it matches.
@@ -16,26 +16,19 @@ import { on } from '../events/index.js';
  *
  * <h1>{large.current ? 'large screen' : 'small screen'}</h1>
  * ```
+ * @extends {ReactiveValue<boolean>}
  * @since 5.7.0
  */
-export class MediaQuery {
-	#query;
-	#subscribe = createSubscriber((update) => {
-		return on(this.#query, 'change', update);
-	});
-
-	get current() {
-		this.#subscribe();
-
-		return this.#query.matches;
-	}
-
+export class MediaQuery extends ReactiveValue {
 	/**
 	 * @param {string} query A media query string
-	 * @param {boolean} [matches] Fallback value for the server
+	 * @param {boolean} [fallback] Fallback value for the server
 	 */
-	constructor(query, matches) {
-		// For convenience (and because people likely forget them) we add the parentheses; double parentheses are not a problem
-		this.#query = window.matchMedia(`(${query})`);
+	constructor(query, fallback) {
+		const q = window.matchMedia(`(${query})`);
+		super(
+			() => q.matches,
+			(update) => on(q, 'change', update)
+		);
 	}
 }
diff --git a/packages/svelte/src/reactivity/reactive-value.js b/packages/svelte/src/reactivity/reactive-value.js
new file mode 100644
index 000000000000..c7c14ad7cd7a
--- /dev/null
+++ b/packages/svelte/src/reactivity/reactive-value.js
@@ -0,0 +1,24 @@
+import { createSubscriber } from './create-subscriber.js';
+
+/**
+ * @template T
+ */
+export class ReactiveValue {
+	#fn;
+	#subscribe;
+
+	/**
+	 *
+	 * @param {() => T} fn
+	 * @param {(update: () => void) => void} onsubscribe
+	 */
+	constructor(fn, onsubscribe) {
+		this.#fn = fn;
+		this.#subscribe = createSubscriber(onsubscribe);
+	}
+
+	get current() {
+		this.#subscribe();
+		return this.#fn();
+	}
+}
diff --git a/packages/svelte/src/reactivity/window/index.js b/packages/svelte/src/reactivity/window/index.js
new file mode 100644
index 000000000000..16e8b7b87b9a
--- /dev/null
+++ b/packages/svelte/src/reactivity/window/index.js
@@ -0,0 +1,154 @@
+import { BROWSER } from 'esm-env';
+import { on } from '../../events/index.js';
+import { ReactiveValue } from '../reactive-value.js';
+import { get } from '../../internal/client/index.js';
+import { set, source } from '../../internal/client/reactivity/sources.js';
+
+/**
+ * `scrollX.current` is a reactive view of `window.scrollX`. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const scrollX = new ReactiveValue(
+	BROWSER ? () => window.scrollX : () => undefined,
+	(update) => on(window, 'scroll', update)
+);
+
+/**
+ * `scrollY.current` is a reactive view of `window.scrollY`. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const scrollY = new ReactiveValue(
+	BROWSER ? () => window.scrollY : () => undefined,
+	(update) => on(window, 'scroll', update)
+);
+
+/**
+ * `innerWidth.current` is a reactive view of `window.innerWidth`. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const innerWidth = new ReactiveValue(
+	BROWSER ? () => window.innerWidth : () => undefined,
+	(update) => on(window, 'resize', update)
+);
+
+/**
+ * `innerHeight.current` is a reactive view of `window.innerHeight`. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const innerHeight = new ReactiveValue(
+	BROWSER ? () => window.innerHeight : () => undefined,
+	(update) => on(window, 'resize', update)
+);
+
+/**
+ * `outerWidth.current` is a reactive view of `window.outerWidth`. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const outerWidth = new ReactiveValue(
+	BROWSER ? () => window.outerWidth : () => undefined,
+	(update) => on(window, 'resize', update)
+);
+
+/**
+ * `outerHeight.current` is a reactive view of `window.outerHeight`. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const outerHeight = new ReactiveValue(
+	BROWSER ? () => window.outerHeight : () => undefined,
+	(update) => on(window, 'resize', update)
+);
+
+/**
+ * `screenLeft.current` is a reactive view of `window.screenLeft`. It is updated inside a `requestAnimationFrame` callback. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const screenLeft = new ReactiveValue(
+	BROWSER ? () => window.screenLeft : () => undefined,
+	(update) => {
+		let value = window.screenLeft;
+
+		let frame = requestAnimationFrame(function check() {
+			frame = requestAnimationFrame(check);
+
+			if (value !== (value = window.screenLeft)) {
+				update();
+			}
+		});
+
+		return () => {
+			cancelAnimationFrame(frame);
+		};
+	}
+);
+
+/**
+ * `screenTop.current` is a reactive view of `window.screenTop`. It is updated inside a `requestAnimationFrame` callback. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const screenTop = new ReactiveValue(
+	BROWSER ? () => window.screenTop : () => undefined,
+	(update) => {
+		let value = window.screenTop;
+
+		let frame = requestAnimationFrame(function check() {
+			frame = requestAnimationFrame(check);
+
+			if (value !== (value = window.screenTop)) {
+				update();
+			}
+		});
+
+		return () => {
+			cancelAnimationFrame(frame);
+		};
+	}
+);
+
+/**
+ * `online.current` is a reactive view of `navigator.onLine`. On the server it is `undefined`.
+ * @since 5.11.0
+ */
+export const online = new ReactiveValue(
+	BROWSER ? () => navigator.onLine : () => undefined,
+	(update) => {
+		const unsub_online = on(window, 'online', update);
+		const unsub_offline = on(window, 'offline', update);
+		return () => {
+			unsub_online();
+			unsub_offline();
+		};
+	}
+);
+
+/**
+ * `devicePixelRatio.current` is a reactive view of `window.devicePixelRatio`. On the server it is `undefined`.
+ * Note that behaviour differs between browsers — on Chrome it will respond to the current zoom level,
+ * on Firefox and Safari it won't.
+ * @type {{ get current(): number }}
+ * @since 5.11.0
+ */
+export const devicePixelRatio = /* @__PURE__ */ new (class DevicePixelRatio {
+	#dpr = source(BROWSER ? window.devicePixelRatio : undefined);
+
+	#update() {
+		const off = on(
+			window.matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`),
+			'change',
+			() => {
+				set(this.#dpr, window.devicePixelRatio);
+
+				off();
+				this.#update();
+			}
+		);
+	}
+
+	constructor() {
+		this.#update();
+	}
+
+	get current() {
+		get(this.#dpr);
+		return window.devicePixelRatio;
+	}
+})();
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 61a34dcb8e93..206f9931f50c 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1900,16 +1900,15 @@ declare module 'svelte/reactivity' {
 	 *
 	 * <h1>{large.current ? 'large screen' : 'small screen'}</h1>
 	 * ```
+	 * @extends {ReactiveValue<boolean>}
 	 * @since 5.7.0
 	 */
-	export class MediaQuery {
+	export class MediaQuery extends ReactiveValue<boolean> {
 		/**
 		 * @param query A media query string
-		 * @param matches Fallback value for the server
+		 * @param fallback Fallback value for the server
 		 */
-		constructor(query: string, matches?: boolean | undefined);
-		get current(): boolean;
-		#private;
+		constructor(query: string, fallback?: boolean | undefined);
 	}
 	/**
 	 * Returns a `subscribe` function that, if called in an effect (including expressions in the template),
@@ -1953,6 +1952,77 @@ declare module 'svelte/reactivity' {
 	 * @since 5.7.0
 	 */
 	export function createSubscriber(start: (update: () => void) => (() => void) | void): () => void;
+	class ReactiveValue<T> {
+		
+		constructor(fn: () => T, onsubscribe: (update: () => void) => void);
+		get current(): T;
+		#private;
+	}
+
+	export {};
+}
+
+declare module 'svelte/reactivity/window' {
+	/**
+	 * `scrollX.current` is a reactive view of `window.scrollX`. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const scrollX: ReactiveValue<number | undefined>;
+	/**
+	 * `scrollY.current` is a reactive view of `window.scrollY`. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const scrollY: ReactiveValue<number | undefined>;
+	/**
+	 * `innerWidth.current` is a reactive view of `window.innerWidth`. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const innerWidth: ReactiveValue<number | undefined>;
+	/**
+	 * `innerHeight.current` is a reactive view of `window.innerHeight`. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const innerHeight: ReactiveValue<number | undefined>;
+	/**
+	 * `outerWidth.current` is a reactive view of `window.outerWidth`. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const outerWidth: ReactiveValue<number | undefined>;
+	/**
+	 * `outerHeight.current` is a reactive view of `window.outerHeight`. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const outerHeight: ReactiveValue<number | undefined>;
+	/**
+	 * `screenLeft.current` is a reactive view of `window.screenLeft`. It is updated inside a `requestAnimationFrame` callback. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const screenLeft: ReactiveValue<number | undefined>;
+	/**
+	 * `screenTop.current` is a reactive view of `window.screenTop`. It is updated inside a `requestAnimationFrame` callback. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const screenTop: ReactiveValue<number | undefined>;
+	/**
+	 * `online.current` is a reactive view of `navigator.onLine`. On the server it is `undefined`.
+	 * @since 5.11.0
+	 */
+	export const online: ReactiveValue<boolean | undefined>;
+	/**
+	 * `devicePixelRatio.current` is a reactive view of `window.devicePixelRatio`. On the server it is `undefined`.
+	 * Note that behaviour differs between browsers — on Chrome it will respond to the current zoom level,
+	 * on Firefox and Safari it won't.
+	 * @since 5.11.0
+	 */
+	export const devicePixelRatio: {
+		get current(): number;
+	};
+	class ReactiveValue<T> {
+		
+		constructor(fn: () => T, onsubscribe: (update: () => void) => void);
+		get current(): T;
+		#private;
+	}
 
 	export {};
 }

From b0374f8863538c7ae9d035c00c824b7c043bb4e0 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 11 Dec 2024 11:35:28 -0500
Subject: [PATCH 39/62] Version Packages (#14662)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/orange-ducks-obey.md |  5 -----
 .changeset/sharp-shoes-look.md  |  5 -----
 packages/svelte/CHANGELOG.md    | 10 ++++++++++
 packages/svelte/package.json    |  2 +-
 packages/svelte/src/version.js  |  2 +-
 5 files changed, 12 insertions(+), 12 deletions(-)
 delete mode 100644 .changeset/orange-ducks-obey.md
 delete mode 100644 .changeset/sharp-shoes-look.md

diff --git a/.changeset/orange-ducks-obey.md b/.changeset/orange-ducks-obey.md
deleted file mode 100644
index e17bf7ad4289..000000000000
--- a/.changeset/orange-ducks-obey.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add `svelte/reactivity/window` module
diff --git a/.changeset/sharp-shoes-look.md b/.changeset/sharp-shoes-look.md
deleted file mode 100644
index 2caf6d421b99..000000000000
--- a/.changeset/sharp-shoes-look.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: take into account registration state when setting custom element props
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 66c49002fd19..e65cd81fd0b7 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.11.0
+
+### Minor Changes
+
+- feat: add `svelte/reactivity/window` module ([#14660](https://github.com/sveltejs/svelte/pull/14660))
+
+### Patch Changes
+
+- fix: take into account registration state when setting custom element props ([#14508](https://github.com/sveltejs/svelte/pull/14508))
+
 ## 5.10.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 922c7fc9f94c..ac204dfc1cdf 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.10.1",
+  "version": "5.11.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 527897279509..1e33786a784a 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.10.1';
+export const VERSION = '5.11.0';
 export const PUBLIC_VERSION = '5';

From ea6fd95332930415b02a1347d017c4872b4ad6bb Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Wed, 11 Dec 2024 22:10:09 +0100
Subject: [PATCH 40/62] fix: account for global block in `is_empty` (#14677)

Fixes #14675
---
 .changeset/olive-pillows-fetch.md                   |  5 +++++
 .../src/compiler/phases/3-transform/css/index.js    | 13 +++++++++----
 .../tests/css/samples/global-with-root/expected.css |  8 ++++++++
 .../tests/css/samples/global-with-root/input.svelte |  9 +++++++++
 4 files changed, 31 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/olive-pillows-fetch.md
 create mode 100644 packages/svelte/tests/css/samples/global-with-root/expected.css
 create mode 100644 packages/svelte/tests/css/samples/global-with-root/input.svelte

diff --git a/.changeset/olive-pillows-fetch.md b/.changeset/olive-pillows-fetch.md
new file mode 100644
index 000000000000..c671a2dc1384
--- /dev/null
+++ b/.changeset/olive-pillows-fetch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: account for global block in `is_empty`
diff --git a/packages/svelte/src/compiler/phases/3-transform/css/index.js b/packages/svelte/src/compiler/phases/3-transform/css/index.js
index 75b63260d567..c5255c4bc34a 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -142,7 +142,7 @@ const visitors = {
 
 		// keep empty rules in dev, because it's convenient to
 		// see them in devtools
-		if (!dev && is_empty(node)) {
+		if (!dev && is_empty(node, is_in_global_block(path))) {
 			if (state.minify) {
 				state.code.remove(node.start, node.end);
 			} else {
@@ -398,8 +398,11 @@ function remove_preceding_whitespace(end, state) {
 	if (start < end) state.code.remove(start, end);
 }
 
-/** @param {Css.Rule} rule */
-function is_empty(rule) {
+/**
+ *  @param {Css.Rule} rule
+ * @param {boolean} is_in_global_block
+ */
+function is_empty(rule, is_in_global_block) {
 	if (rule.metadata.is_global_block) {
 		return rule.block.children.length === 0;
 	}
@@ -410,7 +413,9 @@ function is_empty(rule) {
 		}
 
 		if (child.type === 'Rule') {
-			if (is_used(child) && !is_empty(child)) return false;
+			if ((is_used(child) || is_in_global_block) && !is_empty(child, is_in_global_block)) {
+				return false;
+			}
 		}
 
 		if (child.type === 'Atrule') {
diff --git a/packages/svelte/tests/css/samples/global-with-root/expected.css b/packages/svelte/tests/css/samples/global-with-root/expected.css
new file mode 100644
index 000000000000..0c812ea27dc8
--- /dev/null
+++ b/packages/svelte/tests/css/samples/global-with-root/expected.css
@@ -0,0 +1,8 @@
+
+	/* :global{*/
+		:root{
+			.use{
+				color: red;
+			}
+		}
+	/*}*/
diff --git a/packages/svelte/tests/css/samples/global-with-root/input.svelte b/packages/svelte/tests/css/samples/global-with-root/input.svelte
new file mode 100644
index 000000000000..47ed8b4dc05a
--- /dev/null
+++ b/packages/svelte/tests/css/samples/global-with-root/input.svelte
@@ -0,0 +1,9 @@
+<style>
+	:global{
+		:root{
+			.use{
+				color: red;
+			}
+		}
+	}
+</style>

From 68d266e0f8e47e5f240e801b20fa4211424968b8 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 11 Dec 2024 22:34:42 +0100
Subject: [PATCH 41/62] fix: remove overzealous
 `reactive_declaration_non_reactive_property` warning (#14663)

fixes #14532

This removes the `reactive_declaration_non_reactive_property` warning altogether. The first version caused many false positives at compile time. The refined runtime version (introduced in #14192) was hoped to fix this, but it turns out we now get loads of false positives at runtime.
---
 .changeset/purple-adults-arrive.md            |  5 +++
 .../.generated/client-warnings.md             | 40 -------------------
 .../messages/client-warnings/warnings.md      | 38 ------------------
 .../client/visitors/LabeledStatement.js       |  9 +----
 packages/svelte/src/constants.js              |  3 +-
 .../src/internal/client/reactivity/effects.js | 22 +---------
 .../svelte/src/internal/client/warnings.js    | 12 ------
 .../_config.js                                | 26 ------------
 .../data.svelte.js                            | 11 -----
 .../main.svelte                               | 13 ------
 10 files changed, 9 insertions(+), 170 deletions(-)
 create mode 100644 .changeset/purple-adults-arrive.md
 delete mode 100644 packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js
 delete mode 100644 packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js
 delete mode 100644 packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte

diff --git a/.changeset/purple-adults-arrive.md b/.changeset/purple-adults-arrive.md
new file mode 100644
index 000000000000..e3e3511de249
--- /dev/null
+++ b/.changeset/purple-adults-arrive.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove overzealous `reactive_declaration_non_reactive_property` warning
diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index b0490b84ffd9..06ca578b7658 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -204,46 +204,6 @@ Consider the following code:
 
 To fix it, either create callback props to communicate changes, or mark `person` as [`$bindable`]($bindable).
 
-### reactive_declaration_non_reactive_property
-
-```
-A `$:` statement (%location%) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode
-```
-
-In legacy mode, a `$:` [reactive statement](https://svelte.dev/docs/svelte/legacy-reactive-assignments) re-runs when the state it _references_ changes. This is determined at compile time, by analysing the code.
-
-In runes mode, effects and deriveds re-run when there are changes to the values that are read during the function's _execution_.
-
-Often, the result is the same — for example these can be considered equivalent:
-
-```js
-let a = 1, b = 2, sum = 3;
-// ---cut---
-$: sum = a + b;
-```
-
-```js
-let a = 1, b = 2;
-// ---cut---
-const sum = $derived(a + b);
-```
-
-In some cases — such as the one that triggered the above warning — they are _not_ the same:
-
-```js
-let a = 1, b = 2, sum = 3;
-// ---cut---
-const add = () => a + b;
-
-// the compiler can't 'see' that `sum` depends on `a` and `b`, but
-// they _would_ be read while executing the `$derived` version
-$: sum = add();
-```
-
-Similarly, reactive properties of [deep state](https://svelte.dev/docs/svelte/$state#Deep-state) are not visible to the compiler. As such, changes to these properties will cause effects and deriveds to re-run but will _not_ cause `$:` statements to re-run.
-
-When you [migrate this component](https://svelte.dev/docs/svelte/v5-migration-guide) to runes mode, the behaviour will change accordingly.
-
 ### state_proxy_equality_mismatch
 
 ```
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index 122c1b92a64e..543be71080eb 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -170,44 +170,6 @@ Consider the following code:
 
 To fix it, either create callback props to communicate changes, or mark `person` as [`$bindable`]($bindable).
 
-## reactive_declaration_non_reactive_property
-
-> A `$:` statement (%location%) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode
-
-In legacy mode, a `$:` [reactive statement](https://svelte.dev/docs/svelte/legacy-reactive-assignments) re-runs when the state it _references_ changes. This is determined at compile time, by analysing the code.
-
-In runes mode, effects and deriveds re-run when there are changes to the values that are read during the function's _execution_.
-
-Often, the result is the same — for example these can be considered equivalent:
-
-```js
-let a = 1, b = 2, sum = 3;
-// ---cut---
-$: sum = a + b;
-```
-
-```js
-let a = 1, b = 2;
-// ---cut---
-const sum = $derived(a + b);
-```
-
-In some cases — such as the one that triggered the above warning — they are _not_ the same:
-
-```js
-let a = 1, b = 2, sum = 3;
-// ---cut---
-const add = () => a + b;
-
-// the compiler can't 'see' that `sum` depends on `a` and `b`, but
-// they _would_ be read while executing the `$derived` version
-$: sum = add();
-```
-
-Similarly, reactive properties of [deep state](https://svelte.dev/docs/svelte/$state#Deep-state) are not visible to the compiler. As such, changes to these properties will cause effects and deriveds to re-run but will _not_ cause `$:` statements to re-run.
-
-When you [migrate this component](https://svelte.dev/docs/svelte/v5-migration-guide) to runes mode, the behaviour will change accordingly.
-
 ## state_proxy_equality_mismatch
 
 > Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `%operator%` will produce unexpected results
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/LabeledStatement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/LabeledStatement.js
index 8ca6534457ec..3c8f57f46b47 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/LabeledStatement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/LabeledStatement.js
@@ -50,11 +50,6 @@ export function LabeledStatement(node, context) {
 		sequence.push(serialized);
 	}
 
-	const location =
-		dev && !is_ignored(node, 'reactive_declaration_non_reactive_property')
-			? locator(/** @type {number} */ (node.start))
-			: undefined;
-
 	// these statements will be topologically ordered later
 	context.state.legacy_reactive_statements.set(
 		node,
@@ -62,9 +57,7 @@ export function LabeledStatement(node, context) {
 			b.call(
 				'$.legacy_pre_effect',
 				sequence.length > 0 ? b.thunk(b.sequence(sequence)) : b.thunk(b.block([])),
-				b.thunk(b.block(body)),
-				location && b.literal(location.line),
-				location && b.literal(location.column)
+				b.thunk(b.block(body))
 			)
 		)
 	);
diff --git a/packages/svelte/src/constants.js b/packages/svelte/src/constants.js
index f8a7143b2047..03fddc5ebd28 100644
--- a/packages/svelte/src/constants.js
+++ b/packages/svelte/src/constants.js
@@ -44,8 +44,7 @@ export const IGNORABLE_RUNTIME_WARNINGS = /** @type {const} */ ([
 	'hydration_attribute_changed',
 	'hydration_html_changed',
 	'ownership_invalid_binding',
-	'ownership_invalid_mutation',
-	'reactive_declaration_non_reactive_property'
+	'ownership_invalid_mutation'
 ]);
 
 /**
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index 912aab37b6b3..77502edb904a 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -265,21 +265,14 @@ export function effect(fn) {
  * Internal representation of `$: ..`
  * @param {() => any} deps
  * @param {() => void | (() => void)} fn
- * @param {number} [line]
- * @param {number} [column]
  */
-export function legacy_pre_effect(deps, fn, line, column) {
+export function legacy_pre_effect(deps, fn) {
 	var context = /** @type {ComponentContextLegacy} */ (component_context);
 
 	/** @type {{ effect: null | Effect, ran: boolean }} */
 	var token = { effect: null, ran: false };
 	context.l.r1.push(token);
 
-	if (DEV && line !== undefined) {
-		var location = get_location(line, column);
-		var explicit_deps = capture_signals(deps);
-	}
-
 	token.effect = render_effect(() => {
 		deps();
 
@@ -289,18 +282,7 @@ export function legacy_pre_effect(deps, fn, line, column) {
 
 		token.ran = true;
 		set(context.l.r2, true);
-
-		if (DEV && location) {
-			var implicit_deps = capture_signals(() => untrack(fn));
-
-			for (var signal of implicit_deps) {
-				if (!explicit_deps.has(signal)) {
-					w.reactive_declaration_non_reactive_property(/** @type {string} */ (location));
-				}
-			}
-		} else {
-			untrack(fn);
-		}
+		untrack(fn);
 	});
 }
 
diff --git a/packages/svelte/src/internal/client/warnings.js b/packages/svelte/src/internal/client/warnings.js
index 8daba601ef2a..24d86e2e0b35 100644
--- a/packages/svelte/src/internal/client/warnings.js
+++ b/packages/svelte/src/internal/client/warnings.js
@@ -155,18 +155,6 @@ export function ownership_invalid_mutation(component, owner) {
 	}
 }
 
-/**
- * A `$:` statement (%location%) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode
- * @param {string} location
- */
-export function reactive_declaration_non_reactive_property(location) {
-	if (DEV) {
-		console.warn(`%c[svelte] reactive_declaration_non_reactive_property\n%cA \`$:\` statement (${location}) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode\nhttps://svelte.dev/e/reactive_declaration_non_reactive_property`, bold, normal);
-	} else {
-		console.warn(`https://svelte.dev/e/reactive_declaration_non_reactive_property`);
-	}
-}
-
 /**
  * Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `%operator%` will produce unexpected results
  * @param {string} operator
diff --git a/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js b/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js
deleted file mode 100644
index 7a77424bb271..000000000000
--- a/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import { flushSync } from 'svelte';
-import { test } from '../../test';
-
-export default test({
-	compileOptions: {
-		dev: true
-	},
-
-	html: '<p>42</p><p>42</p><button>update</button><button>reset</button>',
-
-	test({ assert, target }) {
-		const [update, reset] = target.querySelectorAll('button');
-		flushSync(() => update.click());
-
-		assert.htmlEqual(
-			target.innerHTML,
-			'<p>42</p><p>42</p><button>update</button><button>reset</button>'
-		);
-
-		flushSync(() => reset.click());
-	},
-
-	warnings: [
-		'A `$:` statement (main.svelte:4:1) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode'
-	]
-});
diff --git a/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js b/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js
deleted file mode 100644
index 70fd0a6abcd8..000000000000
--- a/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js
+++ /dev/null
@@ -1,11 +0,0 @@
-export const obj = $state({
-	prop: 42
-});
-
-export function update() {
-	obj.prop += 1;
-}
-
-export function reset() {
-	obj.prop = 42;
-}
diff --git a/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte b/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte
deleted file mode 100644
index 2a9b1e1f2311..000000000000
--- a/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { obj, update, reset } from './data.svelte.js';
-
-	$: a = obj.prop;
-
-	// svelte-ignore reactive_declaration_non_reactive_property
-	$: b = obj.prop;
-</script>
-
-<p>{a}</p>
-<p>{b}</p>
-<button on:click={update}>update</button>
-<button on:click={reset}>reset</button>

From a5a46497439baf508b550a449869f8873c394a3d Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 11 Dec 2024 17:12:35 -0500
Subject: [PATCH 42/62] Version Packages (#14679)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/olive-pillows-fetch.md  | 5 -----
 .changeset/purple-adults-arrive.md | 5 -----
 packages/svelte/CHANGELOG.md       | 8 ++++++++
 packages/svelte/package.json       | 2 +-
 packages/svelte/src/version.js     | 2 +-
 5 files changed, 10 insertions(+), 12 deletions(-)
 delete mode 100644 .changeset/olive-pillows-fetch.md
 delete mode 100644 .changeset/purple-adults-arrive.md

diff --git a/.changeset/olive-pillows-fetch.md b/.changeset/olive-pillows-fetch.md
deleted file mode 100644
index c671a2dc1384..000000000000
--- a/.changeset/olive-pillows-fetch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: account for global block in `is_empty`
diff --git a/.changeset/purple-adults-arrive.md b/.changeset/purple-adults-arrive.md
deleted file mode 100644
index e3e3511de249..000000000000
--- a/.changeset/purple-adults-arrive.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove overzealous `reactive_declaration_non_reactive_property` warning
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index e65cd81fd0b7..f4b7c18d7dc5 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.11.1
+
+### Patch Changes
+
+- fix: account for global block in `is_empty` ([#14677](https://github.com/sveltejs/svelte/pull/14677))
+
+- fix: remove overzealous `reactive_declaration_non_reactive_property` warning ([#14663](https://github.com/sveltejs/svelte/pull/14663))
+
 ## 5.11.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index ac204dfc1cdf..f461a4b4c3a2 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.11.0",
+  "version": "5.11.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1e33786a784a..1cedefa3149b 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.11.0';
+export const VERSION = '5.11.1';
 export const PUBLIC_VERSION = '5';

From 0ec251f09d00747483a68fb35df157480b6f4f40 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 11 Dec 2024 17:12:51 -0500
Subject: [PATCH 43/62] chore: remove outdated TODO comment (#14664)

---
 .../scripts/process-messages/templates/shared-errors.js       | 1 -
 .../scripts/process-messages/templates/shared-warnings.js     | 1 -
 packages/svelte/src/internal/shared/errors.js                 | 4 ----
 packages/svelte/src/internal/shared/warnings.js               | 2 --
 4 files changed, 8 deletions(-)

diff --git a/packages/svelte/scripts/process-messages/templates/shared-errors.js b/packages/svelte/scripts/process-messages/templates/shared-errors.js
index b90994fd96d8..c72e9f9d5e7a 100644
--- a/packages/svelte/scripts/process-messages/templates/shared-errors.js
+++ b/packages/svelte/scripts/process-messages/templates/shared-errors.js
@@ -11,7 +11,6 @@ export function CODE(PARAMETER) {
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
 		throw new Error(`https://svelte.dev/e/${'CODE'}`);
 	}
 }
diff --git a/packages/svelte/scripts/process-messages/templates/shared-warnings.js b/packages/svelte/scripts/process-messages/templates/shared-warnings.js
index 0814475a059d..8a9b87b76011 100644
--- a/packages/svelte/scripts/process-messages/templates/shared-warnings.js
+++ b/packages/svelte/scripts/process-messages/templates/shared-warnings.js
@@ -15,7 +15,6 @@ export function CODE(PARAMETER) {
 			normal
 		);
 	} else {
-		// TODO print a link to the documentation
 		console.warn(`https://svelte.dev/e/${'CODE'}`);
 	}
 }
diff --git a/packages/svelte/src/internal/shared/errors.js b/packages/svelte/src/internal/shared/errors.js
index 9d94667ec292..26d6822cdb29 100644
--- a/packages/svelte/src/internal/shared/errors.js
+++ b/packages/svelte/src/internal/shared/errors.js
@@ -13,7 +13,6 @@ export function invalid_default_snippet() {
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
 		throw new Error(`https://svelte.dev/e/invalid_default_snippet`);
 	}
 }
@@ -30,7 +29,6 @@ export function lifecycle_outside_component(name) {
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
 		throw new Error(`https://svelte.dev/e/lifecycle_outside_component`);
 	}
 }
@@ -47,7 +45,6 @@ export function store_invalid_shape(name) {
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
 		throw new Error(`https://svelte.dev/e/store_invalid_shape`);
 	}
 }
@@ -63,7 +60,6 @@ export function svelte_element_invalid_this_value() {
 		error.name = 'Svelte error';
 		throw error;
 	} else {
-		// TODO print a link to the documentation
 		throw new Error(`https://svelte.dev/e/svelte_element_invalid_this_value`);
 	}
 }
\ No newline at end of file
diff --git a/packages/svelte/src/internal/shared/warnings.js b/packages/svelte/src/internal/shared/warnings.js
index 573c5b1e735c..83c58c9b14a2 100644
--- a/packages/svelte/src/internal/shared/warnings.js
+++ b/packages/svelte/src/internal/shared/warnings.js
@@ -13,7 +13,6 @@ export function dynamic_void_element_content(tag) {
 	if (DEV) {
 		console.warn(`%c[svelte] dynamic_void_element_content\n%c\`<svelte:element this="${tag}">\` is a void element — it cannot have content\nhttps://svelte.dev/e/dynamic_void_element_content`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
 		console.warn(`https://svelte.dev/e/dynamic_void_element_content`);
 	}
 }
@@ -32,7 +31,6 @@ export function state_snapshot_uncloneable(properties) {
 ${properties}`
 			: "Value cannot be cloned with `$state.snapshot` — the original value was returned"}\nhttps://svelte.dev/e/state_snapshot_uncloneable`, bold, normal);
 	} else {
-		// TODO print a link to the documentation
 		console.warn(`https://svelte.dev/e/state_snapshot_uncloneable`);
 	}
 }
\ No newline at end of file

From 1d7f0fe3138a2b623b8e7b69e3208168fb604a2a Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 11 Dec 2024 17:19:00 -0500
Subject: [PATCH 44/62] chore: remove preview site (#14428)

---
 pnpm-lock.yaml                                | 1128 +----------------
 pnpm-workspace.yaml                           |    1 -
 sites/svelte-5-preview/.gitignore             |    8 -
 sites/svelte-5-preview/jsconfig.json          |   15 -
 sites/svelte-5-preview/package.json           |   57 -
 sites/svelte-5-preview/src/app.html           |   13 -
 sites/svelte-5-preview/src/global.d.ts        |    1 -
 sites/svelte-5-preview/src/lib/Bundler.js     |   72 --
 .../svelte-5-preview/src/lib/Checkbox.svelte  |   63 -
 .../src/lib/CodeMirror.svelte                 |  407 ------
 .../src/lib/Input/ComponentSelector.svelte    |  462 -------
 .../src/lib/Input/Migrate.svelte              |   22 -
 .../src/lib/Input/ModuleEditor.svelte         |   90 --
 .../src/lib/Input/RunesInfo.svelte            |  149 ---
 .../src/lib/InputOutputToggle.svelte          |   39 -
 sites/svelte-5-preview/src/lib/Message.svelte |  104 --
 .../src/lib/Output/AstNode.svelte             |  161 ---
 .../src/lib/Output/AstView.svelte             |  105 --
 .../src/lib/Output/Compiler.js                |   92 --
 .../src/lib/Output/CompilerOptions.svelte     |  157 ---
 .../src/lib/Output/ErrorOverlay.svelte        |   47 -
 .../src/lib/Output/Output.svelte              |  175 ---
 .../src/lib/Output/PaneWithPanel.svelte       |   83 --
 .../src/lib/Output/ReplProxy.js               |   96 --
 .../src/lib/Output/Viewer.svelte              |  337 -----
 .../src/lib/Output/console/Console.svelte     |   46 -
 .../src/lib/Output/console/ConsoleLine.svelte |  292 -----
 .../lib/Output/console/ConsoleTable.svelte    |  145 ---
 .../src/lib/Output/console/console.d.ts       |   15 -
 .../src/lib/Output/get-location-from-stack.js |   42 -
 .../src/lib/Output/proxy.d.ts                 |    4 -
 .../src/lib/Output/srcdoc/index.html          |  287 -----
 sites/svelte-5-preview/src/lib/Repl.svelte    |  438 -------
 .../svelte-5-preview/src/lib/autocomplete.js  |  209 ---
 sites/svelte-5-preview/src/lib/context.js     |   13 -
 sites/svelte-5-preview/src/lib/index.js       |    1 -
 sites/svelte-5-preview/src/lib/theme.js       |  153 ---
 sites/svelte-5-preview/src/lib/types.d.ts     |   77 --
 sites/svelte-5-preview/src/lib/utils.js       |   16 -
 .../src/lib/workers/bundler/index.js          |  576 ---------
 .../lib/workers/bundler/plugins/commonjs.js   |   58 -
 .../src/lib/workers/bundler/plugins/glsl.js   |   12 -
 .../src/lib/workers/bundler/plugins/json.js   |   12 -
 .../workers/bundler/plugins/loop-protect.js   |  111 --
 .../lib/workers/bundler/plugins/replace.js    |   72 --
 .../src/lib/workers/compiler/index.js         |  154 ---
 .../src/lib/workers/jsconfig.json             |    9 -
 .../src/lib/workers/patch_window.js           |    1 -
 .../src/lib/workers/workers.d.ts              |   34 -
 .../svelte-5-preview/src/routes/+error.svelte |   73 --
 .../src/routes/+layout.server.js              |   12 -
 .../src/routes/+layout.svelte                 |  101 --
 .../svelte-5-preview/src/routes/+page.svelte  |   98 --
 sites/svelte-5-preview/src/routes/defaults.js |   21 -
 .../src/routes/docs/+layout.server.js         |   13 -
 .../src/routes/docs/+layout.svelte            |  110 --
 .../svelte-5-preview/src/routes/docs/+page.js |    5 -
 .../src/routes/docs/[slug]/+page.server.js    |   19 -
 .../src/routes/docs/[slug]/+page.svelte       |   76 --
 .../docs/content/01-api/01-introduction.md    |    7 -
 .../routes/docs/content/01-api/02-runes.md    |  700 ----------
 .../routes/docs/content/01-api/03-snippets.md |  269 ----
 .../docs/content/01-api/04-event-handlers.md  |  205 ---
 .../routes/docs/content/01-api/05-imports.md  |  277 ----
 .../src/routes/docs/content/01-api/meta.json  |    3 -
 .../02-examples/01-universal-reactivity.md    |  150 ---
 .../02-examples/02-fine-grained-reactivity.md |   79 --
 .../docs/content/02-examples/04-old-vs-new.md |  297 -----
 .../content/02-examples/06-more-examples.md   |    7 -
 .../routes/docs/content/02-examples/meta.json |    3 -
 .../routes/docs/content/03-appendix/01-faq.md |  161 ---
 .../03-appendix/02-breaking-changes.md        |  436 -------
 .../content/03-appendix/03-deprecations.md    |  130 --
 .../routes/docs/content/03-appendix/meta.json |    3 -
 .../src/routes/docs/functions/+page.server.js |    5 -
 .../src/routes/docs/render.js                 |  203 ---
 .../src/routes/docs/types.d.ts                |   26 -
 .../src/routes/faq/+page.server.js            |    5 -
 sites/svelte-5-preview/src/routes/gzip.js     |   29 -
 .../src/routes/nav.json/+server.js            |   29 -
 .../src/routes/status/+page.server.js         |   44 -
 .../src/routes/status/+page.svelte            |   86 --
 .../src/routes/status/data.json/+server.js    |    6 -
 .../src/routes/svelte/[...path]/+server.js    |   37 -
 sites/svelte-5-preview/static/favicon.png     |  Bin 1571 -> 0 bytes
 sites/svelte-5-preview/svelte.config.js       |   26 -
 sites/svelte-5-preview/vercel.json            |    5 -
 sites/svelte-5-preview/vite.config.js         |   20 -
 88 files changed, 8 insertions(+), 10429 deletions(-)
 delete mode 100644 sites/svelte-5-preview/.gitignore
 delete mode 100644 sites/svelte-5-preview/jsconfig.json
 delete mode 100644 sites/svelte-5-preview/package.json
 delete mode 100644 sites/svelte-5-preview/src/app.html
 delete mode 100644 sites/svelte-5-preview/src/global.d.ts
 delete mode 100644 sites/svelte-5-preview/src/lib/Bundler.js
 delete mode 100644 sites/svelte-5-preview/src/lib/Checkbox.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/CodeMirror.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Input/ComponentSelector.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Input/Migrate.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Input/ModuleEditor.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Input/RunesInfo.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/InputOutputToggle.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Message.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/AstNode.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/AstView.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/Compiler.js
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/CompilerOptions.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/ErrorOverlay.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/Output.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/PaneWithPanel.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/ReplProxy.js
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/Viewer.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/console/Console.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/console/ConsoleLine.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/console/ConsoleTable.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/console/console.d.ts
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/get-location-from-stack.js
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/proxy.d.ts
 delete mode 100644 sites/svelte-5-preview/src/lib/Output/srcdoc/index.html
 delete mode 100644 sites/svelte-5-preview/src/lib/Repl.svelte
 delete mode 100644 sites/svelte-5-preview/src/lib/autocomplete.js
 delete mode 100644 sites/svelte-5-preview/src/lib/context.js
 delete mode 100644 sites/svelte-5-preview/src/lib/index.js
 delete mode 100644 sites/svelte-5-preview/src/lib/theme.js
 delete mode 100644 sites/svelte-5-preview/src/lib/types.d.ts
 delete mode 100644 sites/svelte-5-preview/src/lib/utils.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/bundler/index.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/bundler/plugins/commonjs.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/bundler/plugins/glsl.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/bundler/plugins/json.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/bundler/plugins/loop-protect.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/bundler/plugins/replace.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/compiler/index.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/jsconfig.json
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/patch_window.js
 delete mode 100644 sites/svelte-5-preview/src/lib/workers/workers.d.ts
 delete mode 100644 sites/svelte-5-preview/src/routes/+error.svelte
 delete mode 100644 sites/svelte-5-preview/src/routes/+layout.server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/+layout.svelte
 delete mode 100644 sites/svelte-5-preview/src/routes/+page.svelte
 delete mode 100644 sites/svelte-5-preview/src/routes/defaults.js
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/+layout.server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/+layout.svelte
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/+page.js
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/[slug]/+page.server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/[slug]/+page.svelte
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/01-api/01-introduction.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/01-api/03-snippets.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/01-api/04-event-handlers.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/01-api/05-imports.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/01-api/meta.json
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/02-examples/01-universal-reactivity.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/02-examples/02-fine-grained-reactivity.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/02-examples/04-old-vs-new.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/02-examples/06-more-examples.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/02-examples/meta.json
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/03-appendix/01-faq.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/03-appendix/03-deprecations.md
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/content/03-appendix/meta.json
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/functions/+page.server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/render.js
 delete mode 100644 sites/svelte-5-preview/src/routes/docs/types.d.ts
 delete mode 100644 sites/svelte-5-preview/src/routes/faq/+page.server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/gzip.js
 delete mode 100644 sites/svelte-5-preview/src/routes/nav.json/+server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/status/+page.server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/status/+page.svelte
 delete mode 100644 sites/svelte-5-preview/src/routes/status/data.json/+server.js
 delete mode 100644 sites/svelte-5-preview/src/routes/svelte/[...path]/+server.js
 delete mode 100644 sites/svelte-5-preview/static/favicon.png
 delete mode 100644 sites/svelte-5-preview/svelte.config.js
 delete mode 100644 sites/svelte-5-preview/vercel.json
 delete mode 100644 sites/svelte-5-preview/vite.config.js

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b604c59f20c6..250a03744e79 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -166,124 +166,6 @@ importers:
         specifier: ^0.8.4
         version: 0.8.4(rollup@4.22.4)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
 
-  sites/svelte-5-preview:
-    dependencies:
-      '@codemirror/autocomplete':
-        specifier: ^6.12.0
-        version: 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/commands':
-        specifier: ^6.3.3
-        version: 6.3.3
-      '@codemirror/lang-css':
-        specifier: ^6.2.1
-        version: 6.2.1(@codemirror/view@6.33.0)
-      '@codemirror/lang-javascript':
-        specifier: ^6.2.1
-        version: 6.2.2
-      '@codemirror/lang-json':
-        specifier: ^6.0.1
-        version: 6.0.1
-      '@codemirror/lang-markdown':
-        specifier: ^6.2.4
-        version: 6.2.4
-      '@codemirror/language':
-        specifier: ^6.10.1
-        version: 6.10.2
-      '@codemirror/lint':
-        specifier: ^6.5.0
-        version: 6.8.1
-      '@codemirror/state':
-        specifier: ^6.4.0
-        version: 6.4.1
-      '@codemirror/view':
-        specifier: ^6.24.0
-        version: 6.33.0
-      '@jridgewell/sourcemap-codec':
-        specifier: ^1.5.0
-        version: 1.5.0
-      '@lezer/highlight':
-        specifier: ^1.1.6
-        version: 1.2.1
-      '@neocodemirror/svelte':
-        specifier: 0.0.15
-        version: 0.0.15(@codemirror/autocomplete@6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1))(@codemirror/commands@6.3.3)(@codemirror/language@6.10.2)(@codemirror/lint@6.8.1)(@codemirror/search@6.5.6)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)
-      '@replit/codemirror-lang-svelte':
-        specifier: ^6.0.0
-        version: 6.0.0(@codemirror/autocomplete@6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1))(@codemirror/lang-css@6.2.1(@codemirror/view@6.33.0))(@codemirror/lang-html@6.4.9)(@codemirror/lang-javascript@6.2.2)(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)(@lezer/highlight@1.2.1)(@lezer/javascript@1.4.15)(@lezer/lr@1.4.0)
-      '@rich_harris/svelte-split-pane':
-        specifier: ^1.1.3
-        version: 1.1.3(svelte@packages+svelte)
-      '@rollup/browser':
-        specifier: ^3.28.0
-        version: 3.29.4
-      acorn:
-        specifier: ^8.12.1
-        version: 8.12.1
-      codemirror:
-        specifier: ^6.0.1
-        version: 6.0.1(@lezer/common@1.2.1)
-      esm-env:
-        specifier: ^1.0.0
-        version: 1.2.1
-      marked:
-        specifier: ^7.0.2
-        version: 7.0.5
-      resolve.exports:
-        specifier: ^2.0.2
-        version: 2.0.2
-      svelte-json-tree:
-        specifier: ^2.2.0
-        version: 2.2.0(svelte@packages+svelte)
-      zimmerframe:
-        specifier: ^1.1.2
-        version: 1.1.2
-    devDependencies:
-      '@fontsource/fira-mono':
-        specifier: ^5.0.8
-        version: 5.0.8
-      '@lezer/common':
-        specifier: ^1.2.1
-        version: 1.2.1
-      '@sveltejs/adapter-vercel':
-        specifier: ^5.4.3
-        version: 5.4.3(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))
-      '@sveltejs/kit':
-        specifier: ^2.8.3
-        version: 2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
-      '@sveltejs/site-kit':
-        specifier: 6.0.0-next.64
-        version: 6.0.0-next.64(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)
-      '@sveltejs/vite-plugin-svelte':
-        specifier: ^4.0.0-next.6
-        version: 4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
-      '@vercel/speed-insights':
-        specifier: ^1.0.0
-        version: 1.0.11(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)
-      esrap:
-        specifier: ^1.2.3
-        version: 1.2.3
-      publint:
-        specifier: ^0.2.7
-        version: 0.2.7
-      shiki:
-        specifier: ^0.14.7
-        version: 0.14.7
-      shiki-twoslash:
-        specifier: ^3.1.2
-        version: 3.1.2(typescript@5.5.4)
-      svelte:
-        specifier: workspace:^
-        version: link:../../packages/svelte
-      svelte-check:
-        specifier: ^4.0.0
-        version: 4.0.1(picomatch@4.0.2)(svelte@packages+svelte)(typescript@5.5.4)
-      typescript:
-        specifier: ^5.5.4
-        version: 5.5.4
-      vite:
-        specifier: ^5.4.6
-        version: 5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
-
 packages:
 
   '@aashutoshrathi/word-wrap@1.2.6':
@@ -379,47 +261,6 @@ packages:
   '@changesets/write@0.3.2':
     resolution: {integrity: sha512-kDxDrPNpUgsjDbWBvUo27PzKX4gqeKOlhibaOXDJA6kuBisGqNHv/HwGJrAu8U/dSf8ZEFIeHIPtvSlZI1kULw==}
 
-  '@codemirror/autocomplete@6.18.0':
-    resolution: {integrity: sha512-5DbOvBbY4qW5l57cjDsmmpDh3/TeK1vXfTHa+BUMrRzdWdcxKZ4U4V7vQaTtOpApNU4kLS4FQ6cINtLg245LXA==}
-    peerDependencies:
-      '@codemirror/language': ^6.0.0
-      '@codemirror/state': ^6.0.0
-      '@codemirror/view': ^6.0.0
-      '@lezer/common': ^1.0.0
-
-  '@codemirror/commands@6.3.3':
-    resolution: {integrity: sha512-dO4hcF0fGT9tu1Pj1D2PvGvxjeGkbC6RGcZw6Qs74TH+Ed1gw98jmUgd2axWvIZEqTeTuFrg1lEB1KV6cK9h1A==}
-
-  '@codemirror/lang-css@6.2.1':
-    resolution: {integrity: sha512-/UNWDNV5Viwi/1lpr/dIXJNWiwDxpw13I4pTUAsNxZdg6E0mI2kTQb0P2iHczg1Tu+H4EBgJR+hYhKiHKko7qg==}
-
-  '@codemirror/lang-html@6.4.9':
-    resolution: {integrity: sha512-aQv37pIMSlueybId/2PVSP6NPnmurFDVmZwzc7jszd2KAF8qd4VBbvNYPXWQq90WIARjsdVkPbw29pszmHws3Q==}
-
-  '@codemirror/lang-javascript@6.2.2':
-    resolution: {integrity: sha512-VGQfY+FCc285AhWuwjYxQyUQcYurWlxdKYT4bqwr3Twnd5wP5WSeu52t4tvvuWmljT4EmgEgZCqSieokhtY8hg==}
-
-  '@codemirror/lang-json@6.0.1':
-    resolution: {integrity: sha512-+T1flHdgpqDDlJZ2Lkil/rLiRy684WMLc74xUnjJH48GQdfJo/pudlTRreZmKwzP8/tGdKf83wlbAdOCzlJOGQ==}
-
-  '@codemirror/lang-markdown@6.2.4':
-    resolution: {integrity: sha512-UghkA1vSMs8bT7RSZM6vsIocigyah2bV00eRQuZy76401UmFZdsTsbQNBGdyxRQDOLeEvF5iFwap0BM8LKyd+g==}
-
-  '@codemirror/language@6.10.2':
-    resolution: {integrity: sha512-kgbTYTo0Au6dCSc/TFy7fK3fpJmgHDv1sG1KNQKJXVi+xBTEeBPY/M30YXiU6mMXeH+YIDLsbrT4ZwNRdtF+SA==}
-
-  '@codemirror/lint@6.8.1':
-    resolution: {integrity: sha512-IZ0Y7S4/bpaunwggW2jYqwLuHj0QtESf5xcROewY6+lDNwZ/NzvR4t+vpYgg9m7V8UXLPYqG+lu3DF470E5Oxg==}
-
-  '@codemirror/search@6.5.6':
-    resolution: {integrity: sha512-rpMgcsh7o0GuCDUXKPvww+muLA1pDJaFrpq/CCHtpQJYz8xopu4D1hPcKRoDD0YlF8gZaqTNIRa4VRBWyhyy7Q==}
-
-  '@codemirror/state@6.4.1':
-    resolution: {integrity: sha512-QkEyUiLhsJoZkbumGZlswmAhA7CBU02Wrz7zvH4SrcifbsqwlXShVXg65f3v/ts57W3dqyamEriMhij1Z3Zz4A==}
-
-  '@codemirror/view@6.33.0':
-    resolution: {integrity: sha512-AroaR3BvnjRW8fiZBalAaK+ZzB5usGgI014YKElYZvQdNH5ZIidHlO+cyf/2rWzyBFRkvG6VhiXeAEbC53P2YQ==}
-
   '@esbuild/aix-ppc64@0.21.5':
     resolution: {integrity: sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==}
     engines: {node: '>=12'}
@@ -584,9 +425,6 @@ packages:
     resolution: {integrity: sha512-BsWiH1yFGjXXS2yvrf5LyuoSIIbPrGUWob917o+BTKuZ7qJdxX8aJLRxs1fS9n6r7vESrq1OUqb68dANcFXuQQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@fontsource/fira-mono@5.0.8':
-    resolution: {integrity: sha512-8OJiUK2lzJjvDlkmamEfhtpL1cyFApg1Pk4kE5Pw5UTf1ETF3Yy/pprgwV5I+LQPDjuFvinsinT9xSUZ2b/zuQ==}
-
   '@humanwhocodes/module-importer@1.0.1':
     resolution: {integrity: sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==}
     engines: {node: '>=12.22'}
@@ -624,51 +462,12 @@ packages:
   '@jridgewell/trace-mapping@0.3.25':
     resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
 
-  '@lezer/common@1.2.1':
-    resolution: {integrity: sha512-yemX0ZD2xS/73llMZIK6KplkjIjf2EvAHcinDi/TfJ9hS25G0388+ClHt6/3but0oOxinTcQHJLDXh6w1crzFQ==}
-
-  '@lezer/css@1.1.8':
-    resolution: {integrity: sha512-7JhxupKuMBaWQKjQoLtzhGj83DdnZY9MckEOG5+/iLKNK2ZJqKc6hf6uc0HjwCX7Qlok44jBNqZhHKDhEhZYLA==}
-
-  '@lezer/highlight@1.2.1':
-    resolution: {integrity: sha512-Z5duk4RN/3zuVO7Jq0pGLJ3qynpxUVsh7IbUbGj88+uV2ApSAn6kWg2au3iJb+0Zi7kKtqffIESgNcRXWZWmSA==}
-
-  '@lezer/html@1.3.10':
-    resolution: {integrity: sha512-dqpT8nISx/p9Do3AchvYGV3qYc4/rKr3IBZxlHmpIKam56P47RSHkSF5f13Vu9hebS1jM0HmtJIwLbWz1VIY6w==}
-
-  '@lezer/javascript@1.4.15':
-    resolution: {integrity: sha512-B082ZdjI0vo2AgLqD834GlRTE9gwRX8NzHzKq5uDwEnQ9Dq+A/CEhd3nf68tiNA2f9O+8jS1NeSTUYT9IAqcTw==}
-
-  '@lezer/json@1.0.2':
-    resolution: {integrity: sha512-xHT2P4S5eeCYECyKNPhr4cbEL9tc8w83SPwRC373o9uEdrvGKTZoJVAGxpOsZckMlEh9W23Pc72ew918RWQOBQ==}
-
-  '@lezer/lr@1.4.0':
-    resolution: {integrity: sha512-Wst46p51km8gH0ZUmeNrtpRYmdlRHUpN1DQd3GFAyKANi8WVz8c2jHYTf1CVScFaCjQw1iO3ZZdqGDxQPRErTg==}
-
-  '@lezer/markdown@1.2.0':
-    resolution: {integrity: sha512-d7MwsfAukZJo1GpPrcPGa3MxaFFOqNp0gbqF+3F7pTeNDOgeJN1muXzx1XXDPt+Ac+/voCzsH7qXqnn+xReG/g==}
-
   '@manypkg/find-root@1.1.0':
     resolution: {integrity: sha512-mki5uBvhHzO8kYYix/WRy2WX8S3B5wdVSc9D6KcU5lQNglP2yt58/VfLuAK49glRXChosY8ap2oJ1qgma3GUVA==}
 
   '@manypkg/get-packages@1.1.3':
     resolution: {integrity: sha512-fo+QhuU3qE/2TQMQmbVMqaQ6EWbMhi4ABWP+O4AM1NqPBuy0OrApV5LO6BrrgnhtAHS2NH6RrVk9OL181tTi8A==}
 
-  '@mapbox/node-pre-gyp@1.0.11':
-    resolution: {integrity: sha512-Yhlar6v9WQgUp/He7BdgzOz8lqMQ8sU+jkCq7Wx8Myc5YFJLbEe7lgui/V7G1qB1DJykHSGwreceSaD60Y0PUQ==}
-    hasBin: true
-
-  '@neocodemirror/svelte@0.0.15':
-    resolution: {integrity: sha512-MCux+QCR40CboJu/TFwnqK7gYQ3fvtvHX8F/mk85DRH7vMoG3VDjJhqneAITX5IzohWKeP36hzcV+oHC2LYJqA==}
-    peerDependencies:
-      '@codemirror/autocomplete': ^6.7.1
-      '@codemirror/commands': ^6.2.4
-      '@codemirror/language': ^6.7.0
-      '@codemirror/lint': ^6.2.1
-      '@codemirror/search': ^6.4.0
-      '@codemirror/state': ^6.2.0
-      '@codemirror/view': ^6.12.0
-
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
     engines: {node: '>= 8'}
@@ -693,29 +492,6 @@ packages:
   '@polka/url@1.0.0-next.25':
     resolution: {integrity: sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ==}
 
-  '@replit/codemirror-lang-svelte@6.0.0':
-    resolution: {integrity: sha512-U2OqqgMM6jKelL0GNWbAmqlu1S078zZNoBqlJBW+retTc5M4Mha6/Y2cf4SVg6ddgloJvmcSpt4hHrVoM4ePRA==}
-    peerDependencies:
-      '@codemirror/autocomplete': ^6.0.0
-      '@codemirror/lang-css': ^6.0.1
-      '@codemirror/lang-html': ^6.2.0
-      '@codemirror/lang-javascript': ^6.1.1
-      '@codemirror/language': ^6.0.0
-      '@codemirror/state': ^6.0.0
-      '@codemirror/view': ^6.0.0
-      '@lezer/common': ^1.0.0
-      '@lezer/highlight': ^1.0.0
-      '@lezer/javascript': ^1.2.0
-      '@lezer/lr': ^1.0.0
-
-  '@rich_harris/svelte-split-pane@1.1.3':
-    resolution: {integrity: sha512-eziKez1ncDfLqJQsViwLG2rYNfMEa3pYBKFUBfNTChgT5lUnofm5IDHxupAKklKvRpTXCVhQXb1MxLUfj5UgFQ==}
-    peerDependencies:
-      svelte: ^3.54.0 || ^4.0.0 || ^5.0.0-next.0
-
-  '@rollup/browser@3.29.4':
-    resolution: {integrity: sha512-qkWkilNBn+90/9Xn2stuwFpXYhG/mZVPlDkTIPdQSEtJES0NS4o4atceEqeGeHOjQREY2jaIv7ld3IajA/Bmfw==}
-
   '@rollup/plugin-commonjs@28.0.1':
     resolution: {integrity: sha512-+tNWdlWKbpB3WgBN7ijjYkq9X5uhjmcvyjEght4NmH5fAU++zfQzAJ6wumLS+dNcvwEZhKx2Z+skY8m7v0wGSA==}
     engines: {node: '>=16.0.0 || 14 >= 14.17'}
@@ -752,10 +528,6 @@ packages:
       rollup:
         optional: true
 
-  '@rollup/pluginutils@4.2.1':
-    resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
-    engines: {node: '>= 8.0.0'}
-
   '@rollup/pluginutils@5.1.0':
     resolution: {integrity: sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==}
     engines: {node: '>=14.0.0'}
@@ -851,11 +623,6 @@ packages:
     peerDependencies:
       eslint: '>=8.40.0'
 
-  '@sveltejs/adapter-vercel@5.4.3':
-    resolution: {integrity: sha512-srZBkMpeaa7lflO1ZGdKTW3jWHscE9rdAkyxgRlVMVyugjcPOZ3dcpEfpoM4wtVCbpEOdHniWqQR9yL+zs4ybA==}
-    peerDependencies:
-      '@sveltejs/kit': ^2.4.0
-
   '@sveltejs/eslint-config@8.1.0':
     resolution: {integrity: sha512-cfgp4lPREYBjNd4ZzaP/jA85ufm7vfXiaV7h9vILXNogne80IbZRNhRCQ8XoOqTAOY/pChIzWTBuR8aDNMbAEA==}
     peerDependencies:
@@ -867,21 +634,6 @@ packages:
       typescript: '>= 5'
       typescript-eslint: '>= 7.5'
 
-  '@sveltejs/kit@2.8.3':
-    resolution: {integrity: sha512-DVBVwugfzzn0SxKA+eAmKqcZ7aHZROCHxH7/pyrOi+HLtQ721eEsctGb9MkhEuqj6q/9S/OFYdn37vdxzFPdvw==}
-    engines: {node: '>=18.13'}
-    hasBin: true
-    peerDependencies:
-      '@sveltejs/vite-plugin-svelte': ^3.0.0 || ^4.0.0-next.1
-      svelte: ^4.0.0 || ^5.0.0-next.0
-      vite: ^5.0.3
-
-  '@sveltejs/site-kit@6.0.0-next.64':
-    resolution: {integrity: sha512-SosLY07DBA79yJhRR9vQpk9eXlSc3VjzOlIJQFvPzgsbu727rq5u3dudFEsm0NeQFoAF+NNgDYi5D85v5Yc+vQ==}
-    peerDependencies:
-      '@sveltejs/kit': ^1.20.0
-      svelte: ^4.0.0
-
   '@sveltejs/vite-plugin-svelte-inspector@3.0.0-next.2':
     resolution: {integrity: sha512-Yl9BWvEj+1j+8mICIAA04/Sx0wEHNL0n9pSIZFM8n4NWgLFmR3v41qX2k54J/r4LWE2YHTeNNH2WJqEUb3geEA==}
     engines: {node: ^18.0.0 || ^20.0.0 || >=22}
@@ -904,9 +656,6 @@ packages:
   '@types/aria-query@5.0.4':
     resolution: {integrity: sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==}
 
-  '@types/cookie@0.6.0':
-    resolution: {integrity: sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==}
-
   '@types/eslint@8.56.12':
     resolution: {integrity: sha512-03ruubjWyOHlmljCVoxSuNDdmfZDzsrrz0P2LeJsOXr+ZwFQ+0yQIwNCwt/GYhV7Z31fgtXJTAEs+FYlEL851g==}
 
@@ -988,43 +737,6 @@ packages:
     resolution: {integrity: sha512-sbgsPMW9yLvS7IhCi8IpuK1oBmtbWUNP+hBdwl/I9nzqVsszGnNGti5r9dUtF5RLivHUFFIdRvLiTsPhzSyJ3Q==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript/twoslash@3.1.0':
-    resolution: {integrity: sha512-kTwMUQ8xtAZaC4wb2XuLkPqFVBj2dNBueMQ89NWEuw87k2nLBbuafeG5cob/QEr6YduxIdTVUjix0MtC7mPlmg==}
-
-  '@typescript/vfs@1.3.4':
-    resolution: {integrity: sha512-RbyJiaAGQPIcAGWFa3jAXSuAexU4BFiDRF1g3hy7LmRqfNpYlTQWGXjcrOaVZjJ8YkkpuwG0FcsYvtWQpd9igQ==}
-
-  '@typescript/vfs@1.3.5':
-    resolution: {integrity: sha512-pI8Saqjupf9MfLw7w2+og+fmb0fZS0J6vsKXXrp4/PDXEFvntgzXmChCXC/KefZZS0YGS6AT8e0hGAJcTsdJlg==}
-
-  '@vercel/nft@0.27.3':
-    resolution: {integrity: sha512-oySTdDSzUAFDXpsSLk9Q943o+/Yu/+TCFxnehpFQEf/3khi2stMpTHPVNwFdvZq/Z4Ky93lE+MGHpXCRpMkSCA==}
-    engines: {node: '>=16'}
-    hasBin: true
-
-  '@vercel/speed-insights@1.0.11':
-    resolution: {integrity: sha512-l9hzSNmJvb2Yqpgd/BzpiT0J0aQDdtqxOf3Xm+iW4PICxVvhY1ef7Otdx4GXI+88dVkws57qMzXiShz19gXzSQ==}
-    peerDependencies:
-      '@sveltejs/kit': ^1 || ^2
-      next: '>= 13'
-      react: ^18 || ^19
-      svelte: ^4
-      vue: ^3
-      vue-router: ^4
-    peerDependenciesMeta:
-      '@sveltejs/kit':
-        optional: true
-      next:
-        optional: true
-      react:
-        optional: true
-      svelte:
-        optional: true
-      vue:
-        optional: true
-      vue-router:
-        optional: true
-
   '@vitest/coverage-v8@2.0.5':
     resolution: {integrity: sha512-qeFcySCg5FLO2bHHSa0tAZAOnAUbp4L6/A5JDuj9+bt53JREl8hpLjLHEWF0e/gWc8INVpJaqA7+Ene2rclpZg==}
     peerDependencies:
@@ -1048,14 +760,6 @@ packages:
   '@vitest/utils@2.0.5':
     resolution: {integrity: sha512-d8HKbqIcya+GR67mkZbrzhS5kKhtp8dQLcmRZLGTscGVg7yImT82cIrhtn2L8+VujWcy6KZweApgNmPsTAO/UQ==}
 
-  abbrev@1.1.1:
-    resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==}
-
-  acorn-import-attributes@1.9.5:
-    resolution: {integrity: sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ==}
-    peerDependencies:
-      acorn: ^8
-
   acorn-jsx@5.3.2:
     resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
     peerDependencies:
@@ -1071,10 +775,6 @@ packages:
     engines: {node: '>=0.4.0'}
     hasBin: true
 
-  agent-base@6.0.2:
-    resolution: {integrity: sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==}
-    engines: {node: '>= 6.0.0'}
-
   agent-base@7.1.1:
     resolution: {integrity: sha512-H0TSyFNDMomMNJQBn8wFV5YC/2eJ+VXECwOadZJT554xP6cODZHPX3H9QMQECxvrgiSOP1pHjy1sMWQVYJOUOA==}
     engines: {node: '>= 14'}
@@ -1094,9 +794,6 @@ packages:
     resolution: {integrity: sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==}
     engines: {node: '>=12'}
 
-  ansi-sequence-parser@1.1.1:
-    resolution: {integrity: sha512-vJXt3yiaUL4UU546s3rPXlsry/RnM730G1+HkpKE012AN0sx1eOrxSu95oKDIonskeLTijMgqWZ3uDEe3NFvyg==}
-
   ansi-styles@4.3.0:
     resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
     engines: {node: '>=8'}
@@ -1109,14 +806,6 @@ packages:
     resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
     engines: {node: '>= 8'}
 
-  aproba@2.0.0:
-    resolution: {integrity: sha512-lYe4Gx7QT+MKGbDsA+Z+he/Wtef0BiwDOlK/XkBrdfsh9J/jPPXbX0tE9x9cl27Tmu5gg3QUbUrQYa/y+KOHPQ==}
-
-  are-we-there-yet@2.0.0:
-    resolution: {integrity: sha512-Ci/qENmwHnsYo9xKIcUJN5LeDKdJ6R1Z1j9V/J5wyq8nh/mYPEpIKJbBZXtZjG04HiK7zV/p6Vs9952MrMeUIw==}
-    engines: {node: '>=10'}
-    deprecated: This package is no longer supported.
-
   argparse@1.0.10:
     resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
 
@@ -1135,9 +824,6 @@ packages:
     resolution: {integrity: sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==}
     engines: {node: '>=12'}
 
-  async-sema@3.1.1:
-    resolution: {integrity: sha512-tLRNUXati5MFePdAk8dw7Qt7DpxPB60ofAgn8WRhW6a2rcimZnYBP9oxHiv0OHy+Wz7kPMG+t4LGdt31+4EmGg==}
-
   asynckit@0.4.0:
     resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
 
@@ -1156,9 +842,6 @@ packages:
     resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
     engines: {node: '>=8'}
 
-  bindings@1.5.0:
-    resolution: {integrity: sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==}
-
   brace-expansion@1.1.11:
     resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
 
@@ -1203,17 +886,10 @@ packages:
     resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==}
     engines: {node: '>= 8.10.0'}
 
-  chownr@2.0.0:
-    resolution: {integrity: sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==}
-    engines: {node: '>=10'}
-
   ci-info@3.9.0:
     resolution: {integrity: sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==}
     engines: {node: '>=8'}
 
-  codemirror@6.0.1:
-    resolution: {integrity: sha512-J8j+nZ+CdWmIeFIGXEFbFPtpiYacFMDR8GlHK3IyHQJMCaVRfGx9NT+Hxivv1ckLWPvNdZqndbr/7lVhrf/Svg==}
-
   color-convert@2.0.1:
     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
     engines: {node: '>=7.0.0'}
@@ -1221,10 +897,6 @@ packages:
   color-name@1.1.4:
     resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
 
-  color-support@1.1.3:
-    resolution: {integrity: sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==}
-    hasBin: true
-
   combined-stream@1.0.8:
     resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
     engines: {node: '>= 0.8'}
@@ -1238,16 +910,6 @@ packages:
   concat-map@0.0.1:
     resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=}
 
-  console-control-strings@1.1.0:
-    resolution: {integrity: sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==}
-
-  cookie@0.6.0:
-    resolution: {integrity: sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==}
-    engines: {node: '>= 0.6'}
-
-  crelt@1.0.6:
-    resolution: {integrity: sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==}
-
   cross-spawn@5.1.0:
     resolution: {integrity: sha512-pTgQJ5KC0d2hcY8eyL1IzlBPYjTkyH72XRZPnLyKus2mBfNjQs3klqbJU2VILqZryAZUt9JOb3h/mWMy23/f5A==}
 
@@ -1264,9 +926,6 @@ packages:
     resolution: {integrity: sha512-h66W1URKpBS5YMI/V8PyXvTMFT8SupJ1IzoIV8IeBC/ji8WVmrO8dGlTi+2dh6whmdk6BiKJLD/ZBkhWbcg6nA==}
     engines: {node: '>=18'}
 
-  csstype@3.1.3:
-    resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
-
   data-urls@5.0.0:
     resolution: {integrity: sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==}
     engines: {node: '>=18'}
@@ -1313,9 +972,6 @@ packages:
     resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
     engines: {node: '>=0.4.0'}
 
-  delegates@1.0.0:
-    resolution: {integrity: sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==}
-
   detect-indent@6.1.0:
     resolution: {integrity: sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==}
     engines: {node: '>=8'}
@@ -1325,13 +981,6 @@ packages:
     engines: {node: '>=0.10'}
     hasBin: true
 
-  detect-libc@2.0.2:
-    resolution: {integrity: sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw==}
-    engines: {node: '>=8'}
-
-  devalue@5.1.1:
-    resolution: {integrity: sha512-maua5KUiapvEwiEAe+XnlZ3Rh0GD+qI1J/nb9vrJc3muPXvcF/8gXYTWF76+5DAqHyDUtOIImEuo0YKE9mshVw==}
-
   dir-glob@3.0.1:
     resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
     engines: {node: '>=8'}
@@ -1518,17 +1167,10 @@ packages:
       picomatch:
         optional: true
 
-  fenceparser@1.1.1:
-    resolution: {integrity: sha512-VdkTsK7GWLT0VWMK5S5WTAPn61wJ98WPFwJiRHumhg4ESNUO/tnkU8bzzzc62o6Uk1SVhuZFLnakmDA4SGV7wA==}
-    engines: {node: '>=12'}
-
   file-entry-cache@8.0.0:
     resolution: {integrity: sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==}
     engines: {node: '>=16.0.0'}
 
-  file-uri-to-path@1.0.0:
-    resolution: {integrity: sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==}
-
   fill-range@7.0.1:
     resolution: {integrity: sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==}
     engines: {node: '>=8'}
@@ -1568,13 +1210,6 @@ packages:
     resolution: {integrity: sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==}
     engines: {node: '>=6 <7 || >=8'}
 
-  fs-minipass@2.1.0:
-    resolution: {integrity: sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==}
-    engines: {node: '>= 8'}
-
-  fs.realpath@1.0.0:
-    resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
-
   fsevents@2.3.2:
     resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@@ -1588,11 +1223,6 @@ packages:
   function-bind@1.1.2:
     resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
 
-  gauge@3.0.2:
-    resolution: {integrity: sha512-+5J6MS/5XksCuXq++uFRsnUd7Ovu1XenbeuIuNRJxYWjgQbPuFhT14lAvsWfqfAmnwluf1OwMjz39HjfLPci0Q==}
-    engines: {node: '>=10'}
-    deprecated: This package is no longer supported.
-
   get-func-name@2.0.2:
     resolution: {integrity: sha512-8vXOvuE167CtIc3OyItco7N/dpRtBbYOsPsXCz7X/PMnlGjYjSGuZJgM1Y7mmew7BKf9BqvLX2tnOVy1BBUsxQ==}
 
@@ -1615,15 +1245,6 @@ packages:
     resolution: {integrity: sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==}
     hasBin: true
 
-  glob@7.2.3:
-    resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
-    deprecated: Glob versions prior to v9 are no longer supported
-
-  glob@8.1.0:
-    resolution: {integrity: sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==}
-    engines: {node: '>=12'}
-    deprecated: Glob versions prior to v9 are no longer supported
-
   globals@14.0.0:
     resolution: {integrity: sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==}
     engines: {node: '>=18'}
@@ -1652,9 +1273,6 @@ packages:
     resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
     engines: {node: '>=8'}
 
-  has-unicode@2.0.1:
-    resolution: {integrity: sha512-8Rf9Y83NBReMnx0gFzA8JImQACstCYWUplepDa9xprwwtmgEZUF0h/i5xSA625zB/I37EtrswSST6OXxwaaIJQ==}
-
   hasown@2.0.0:
     resolution: {integrity: sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==}
     engines: {node: '>= 0.4'}
@@ -1670,10 +1288,6 @@ packages:
     resolution: {integrity: sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==}
     engines: {node: '>= 14'}
 
-  https-proxy-agent@5.0.1:
-    resolution: {integrity: sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==}
-    engines: {node: '>= 6'}
-
   https-proxy-agent@7.0.5:
     resolution: {integrity: sha512-1e4Wqeblerz+tMKPIq2EMGiiWW1dIjZOksyHWSUm1rmuvw/how9hBHZ38lAGj5ID4Ik6EdkOw7NmWPy6LAwalw==}
     engines: {node: '>= 14'}
@@ -1693,10 +1307,6 @@ packages:
     resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
     engines: {node: '>=0.10.0'}
 
-  ignore-walk@5.0.1:
-    resolution: {integrity: sha512-yemi4pMf51WKT7khInJqAvsIGzoqYXblnsz0ql8tM+yi1EKYTY1evX4NAbJrLL/Aanr2HyZeluqU+Oi7MGHokw==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-
   ignore@5.3.2:
     resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==}
     engines: {node: '>= 4'}
@@ -1708,20 +1318,10 @@ packages:
     resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
     engines: {node: '>=6'}
 
-  import-meta-resolve@4.1.0:
-    resolution: {integrity: sha512-I6fiaX09Xivtk+THaMfAwnA3MVA5Big1WHF1Dfx9hFuvNIWpXnorlkzhcQf6ehrqQiiZECRt1poOAkPmer3ruw==}
-
   imurmurhash@0.1.4:
     resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
     engines: {node: '>=0.8.19'}
 
-  inflight@1.0.6:
-    resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
-    deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
-
-  inherits@2.0.4:
-    resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
-
   is-binary-path@2.1.0:
     resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
     engines: {node: '>=8'}
@@ -1835,9 +1435,6 @@ packages:
   json-stable-stringify-without-jsonify@1.0.1:
     resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==}
 
-  jsonc-parser@3.2.0:
-    resolution: {integrity: sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==}
-
   jsonfile@4.0.0:
     resolution: {integrity: sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==}
 
@@ -1946,29 +1543,16 @@ packages:
   lru-cache@4.1.5:
     resolution: {integrity: sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==}
 
-  lz-string@1.5.0:
-    resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==}
-    hasBin: true
-
   magic-string@0.30.11:
     resolution: {integrity: sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==}
 
   magicast@0.3.4:
     resolution: {integrity: sha512-TyDF/Pn36bBji9rWKHlZe+PZb6Mx5V8IHCSxk7X4aljM4e/vyDvZZYwHewdVaqiA0nb3ghfHU/6AUpDxWoER2Q==}
 
-  make-dir@3.1.0:
-    resolution: {integrity: sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==}
-    engines: {node: '>=8'}
-
   make-dir@4.0.0:
     resolution: {integrity: sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==}
     engines: {node: '>=10'}
 
-  marked@7.0.5:
-    resolution: {integrity: sha512-lwNAFTfXgqpt/XvK17a/8wY9/q6fcSPZT1aP6QW0u74VwaJF/Z9KbRcX23sWE4tODM+AolJNcUtErTkgOeFP/Q==}
-    engines: {node: '>= 16'}
-    hasBin: true
-
   merge-stream@2.0.0:
     resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
 
@@ -1995,35 +1579,14 @@ packages:
   minimatch@3.1.2:
     resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
 
-  minimatch@5.1.6:
-    resolution: {integrity: sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==}
-    engines: {node: '>=10'}
-
   minimatch@9.0.5:
     resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==}
     engines: {node: '>=16 || 14 >=14.17'}
 
-  minipass@3.3.6:
-    resolution: {integrity: sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==}
-    engines: {node: '>=8'}
-
-  minipass@5.0.0:
-    resolution: {integrity: sha512-3FnjYuehv9k6ovOEbyOswadCDPX1piCfhV8ncmYtHOjuPwylVWsghTLo7rabjC3Rx5xD4HDx8Wm1xnMF7S5qFQ==}
-    engines: {node: '>=8'}
-
   minipass@7.1.2:
     resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==}
     engines: {node: '>=16 || 14 >=14.17'}
 
-  minizlib@2.1.2:
-    resolution: {integrity: sha512-bAxsR8BVfj60DWXHE3u30oHzfl4G7khkSuPW+qvpd7jFRHm7dLxOjUk1EHACJ/hxLY8phGJ0YhYHZo7jil7Qdg==}
-    engines: {node: '>= 8'}
-
-  mkdirp@1.0.4:
-    resolution: {integrity: sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==}
-    engines: {node: '>=10'}
-    hasBin: true
-
   mri@1.2.0:
     resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
     engines: {node: '>=4'}
@@ -2040,10 +1603,6 @@ packages:
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
-  nanostores@0.8.1:
-    resolution: {integrity: sha512-1ZCfQtII2XeFDrtqXL2cdQ/diGrLxzRB3YMyQjn8m7GSGQrJfGST2iuqMpWnS/ZlifhtjgR/SX0Jy6Uij6lRLA==}
-    engines: {node: ^16.0.0 || >=18.0.0}
-
   natural-compare@1.4.0:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
@@ -2056,50 +1615,17 @@ packages:
       encoding:
         optional: true
 
-  node-gyp-build@4.8.0:
-    resolution: {integrity: sha512-u6fs2AEUljNho3EYTJNBfImO5QTo/J/1Etd+NVdCj7qWKUSN/bSLkZwhDv7I+w/MSC6qJ4cknepkAYykDdK8og==}
-    hasBin: true
-
-  nopt@5.0.0:
-    resolution: {integrity: sha512-Tbj67rffqceeLpcRXrT7vKAN8CwfPeIBgM7E6iBkmKLV7bEMwpGgYLGv0jACUsECaa/vuxP0IjEont6umdMgtQ==}
-    engines: {node: '>=6'}
-    hasBin: true
-
   normalize-path@3.0.0:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
 
-  npm-bundled@2.0.1:
-    resolution: {integrity: sha512-gZLxXdjEzE/+mOstGDqR6b0EkhJ+kM6fxM6vUuckuctuVPh80Q6pw/rSZj9s4Gex9GxWtIicO1pc8DB9KZWudw==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-
-  npm-normalize-package-bin@2.0.0:
-    resolution: {integrity: sha512-awzfKUO7v0FscrSpRoogyNm0sajikhBWpU0QMrW09AMi9n1PoKU6WaIqUzuJSQnpciZZmJ/jMZ2Egfmb/9LiWQ==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-
-  npm-packlist@5.1.3:
-    resolution: {integrity: sha512-263/0NGrn32YFYi4J533qzrQ/krmmrWwhKkzwTuM4f/07ug51odoaNjUexxO4vxlzURHcmYMH1QjvHjsNDKLVg==}
-    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
-    hasBin: true
-
   npm-run-path@5.2.0:
     resolution: {integrity: sha512-W4/tgAXFqFA0iL7fk0+uQ3g7wkL8xJmx3XdK0VGb4cHW//eZTtKGvFBBoRKVTpY7n6ze4NL9ly7rgXcHufqXKg==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
-  npmlog@5.0.1:
-    resolution: {integrity: sha512-AqZtDUWOMKs1G/8lwylVjrdYgqA4d9nu8hc+0gzRxlDb1I10+FHBGMXs6aiQHFdCUUlqH99MUMuLfzWDNDtfxw==}
-    deprecated: This package is no longer supported.
-
   nwsapi@2.2.12:
     resolution: {integrity: sha512-qXDmcVlZV4XRtKFzddidpfVP4oMSGhga+xdMc25mv8kaLUHtgzCDhUxkrN8exkGdTlLNaXj7CV3GtON7zuGZ+w==}
 
-  object-assign@4.1.1:
-    resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
-    engines: {node: '>=0.10.0'}
-
-  once@1.4.0:
-    resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
-
   onetime@6.0.0:
     resolution: {integrity: sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==}
     engines: {node: '>=12'}
@@ -2164,10 +1690,6 @@ packages:
     resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
     engines: {node: '>=8'}
 
-  path-is-absolute@1.0.1:
-    resolution: {integrity: sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==}
-    engines: {node: '>=0.10.0'}
-
   path-key@3.1.1:
     resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
     engines: {node: '>=8'}
@@ -2281,11 +1803,6 @@ packages:
   pseudomap@1.0.2:
     resolution: {integrity: sha512-b/YwNhb8lk1Zz2+bXXpS/LK9OisiZZ1SNsSLxN1x2OXVEhW2Ckr/7mWE5vrC1ZTiJlD9g19jWszTmJsB+oEpFQ==}
 
-  publint@0.2.7:
-    resolution: {integrity: sha512-tLU4ee3110BxWfAmCZggJmCUnYWgPTr0QLnx08sqpLYa8JHRiOudd+CgzdpfU5x5eOaW2WMkpmOrFshRFYK7Mw==}
-    engines: {node: '>=16'}
-    hasBin: true
-
   punycode@2.3.1:
     resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
     engines: {node: '>=6'}
@@ -2300,10 +1817,6 @@ packages:
     resolution: {integrity: sha512-VIMnQi/Z4HT2Fxuwg5KrY174U1VdUIASQVWXXyqtNRtxSr9IYkn1rsI6Tb6HsrHCmB7gVpNwX6JxPTHcH6IoTA==}
     engines: {node: '>=6'}
 
-  readable-stream@3.6.2:
-    resolution: {integrity: sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==}
-    engines: {node: '>= 6'}
-
   readdirp@3.6.0:
     resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
     engines: {node: '>=8.10.0'}
@@ -2326,10 +1839,6 @@ packages:
   resolve-pkg-maps@1.0.0:
     resolution: {integrity: sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==}
 
-  resolve.exports@2.0.2:
-    resolution: {integrity: sha512-X2UW6Nw3n/aMgDVy+0rSqgHlv39WZAlZrXCdnbyEiKm17DSqHX4MmQMaST3FbeWR5FTuRcUwYAziZajji0Y7mg==}
-    engines: {node: '>=10'}
-
   resolve@1.22.8:
     resolution: {integrity: sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==}
     hasBin: true
@@ -2338,11 +1847,6 @@ packages:
     resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
     engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
 
-  rimraf@3.0.2:
-    resolution: {integrity: sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==}
-    deprecated: Rimraf versions prior to v4 are no longer supported
-    hasBin: true
-
   rollup@4.22.4:
     resolution: {integrity: sha512-vD8HJ5raRcWOyymsR6Z3o6+RzfEPCnVLMFJ6vRslO1jt4LO6dUo5Qnpg7y4RkZFM2DMe3WUirkI5c16onjrc6A==}
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
@@ -2377,10 +1881,6 @@ packages:
     resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==}
     engines: {node: '>=v12.22.7'}
 
-  semver@6.3.1:
-    resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
-    hasBin: true
-
   semver@7.6.3:
     resolution: {integrity: sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==}
     engines: {node: '>=10'}
@@ -2389,12 +1889,6 @@ packages:
   serialize-javascript@6.0.2:
     resolution: {integrity: sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==}
 
-  set-blocking@2.0.0:
-    resolution: {integrity: sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==}
-
-  set-cookie-parser@2.7.0:
-    resolution: {integrity: sha512-lXLOiqpkUumhRdFF3k1osNXCy9akgx/dyPZ5p8qAg9seJzXr5ZrlqZuWIMuY6ejOsVLE6flJ5/h3lsn57fQ/PQ==}
-
   shebang-command@1.2.0:
     resolution: {integrity: sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==}
     engines: {node: '>=0.10.0'}
@@ -2411,17 +1905,6 @@ packages:
     resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
     engines: {node: '>=8'}
 
-  shiki-twoslash@3.1.2:
-    resolution: {integrity: sha512-JBcRIIizi+exIA/OUhYkV6jtyeZco0ykCkIRd5sgwIt1Pm4pz+maoaRZpm6SkhPwvif4fCA7xOtJOykhpIV64Q==}
-    peerDependencies:
-      typescript: '>3'
-
-  shiki@0.10.1:
-    resolution: {integrity: sha512-VsY7QJVzU51j5o1+DguUd+6vmCmZ5v/6gYu4vyYAhzjuNQU6P/vmSy4uQaOhvje031qQMiW0d2BwgMH52vqMng==}
-
-  shiki@0.14.7:
-    resolution: {integrity: sha512-dNPAPrxSc87ua2sKJ3H5dQ/6ZaY8RNnaAqK+t0eG7p0Soi2ydiqbGOTaZCqaYvA/uZYfS1LJnemt3Q+mSfcPCg==}
-
   siginfo@2.0.0:
     resolution: {integrity: sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==}
 
@@ -2436,10 +1919,6 @@ packages:
     resolution: {integrity: sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==}
     engines: {node: '>= 10'}
 
-  sirv@3.0.0:
-    resolution: {integrity: sha512-BPwJGUeDaDCHihkORDchNyyTvWFhcusy1XMmhEVTQTwGeybFbp8YEmB+njbPnth1FibULBSBVwCQni25XlCUDg==}
-    engines: {node: '>=18'}
-
   slash@3.0.0:
     resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
     engines: {node: '>=8'}
@@ -2482,9 +1961,6 @@ packages:
     resolution: {integrity: sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==}
     engines: {node: '>=12'}
 
-  string_decoder@1.3.0:
-    resolution: {integrity: sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==}
-
   strip-ansi@6.0.1:
     resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
     engines: {node: '>=8'}
@@ -2505,9 +1981,6 @@ packages:
     resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
     engines: {node: '>=8'}
 
-  style-mod@4.1.2:
-    resolution: {integrity: sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw==}
-
   supports-color@7.2.0:
     resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
     engines: {node: '>=8'}
@@ -2516,14 +1989,6 @@ packages:
     resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
     engines: {node: '>= 0.4'}
 
-  svelte-check@4.0.1:
-    resolution: {integrity: sha512-AuWnCZdREoOzMhoptHPUUPYUxLNdXSkoZnPnlv19SZJJimRzLmjjZLKsOiRB4AnhgX+56/WSEdvkWXI/q2BSsA==}
-    engines: {node: '>= 18.0.0'}
-    hasBin: true
-    peerDependencies:
-      svelte: ^4.0.0 || ^5.0.0-next.0
-      typescript: '>=5.0.0'
-
   svelte-eslint-parser@0.41.0:
     resolution: {integrity: sha512-L6f4hOL+AbgfBIB52Z310pg1d2QjRqm7wy3kI1W6hhdhX5bvu7+f0R6w4ykp5HoDdzq+vGhIJmsisaiJDGmVfA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@@ -2533,17 +1998,6 @@ packages:
       svelte:
         optional: true
 
-  svelte-json-tree@2.2.0:
-    resolution: {integrity: sha512-zcfepTrJ6xhpdgRZEujmiFh+ainRw7HO4Bsoh8PMAsm7fkgUPtnrZi3An8tmCFY8jajYhMrauHsd1S1XTeuiCw==}
-    peerDependencies:
-      svelte: ^4.0.0
-
-  svelte-persisted-store@0.9.2:
-    resolution: {integrity: sha512-jp7W98yMgBhgz5fWnjZBCmCX89Rse13iqVpjK+1ByS6iYkvW9WT+F2vwsep3f0Zy/tnGYbb8MI+9Vx7W0NQsPg==}
-    engines: {node: '>=0.14'}
-    peerDependencies:
-      svelte: ^3.48.0 || ^4.0.0 || ^5.0.0-next.0
-
   symbol-tree@3.2.4:
     resolution: {integrity: sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==}
 
@@ -2551,10 +2005,6 @@ packages:
     resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==}
     engines: {node: '>=6'}
 
-  tar@6.2.0:
-    resolution: {integrity: sha512-/Wo7DcT0u5HUV486xg675HtjNd3BXZ6xDbzsCUZPt5iw8bTQ63bP0Raut3mvro9u+CUyq7YQd8Cx55fsZXxqLQ==}
-    engines: {node: '>=10'}
-
   term-size@2.2.1:
     resolution: {integrity: sha512-wK0Ri4fOGjv/XPy8SBHZChl8CM7uMc5VML7SqiQ0zG7+J5Vr+RMQDoHa2CNT6KHUnTGIXH34UDMkPzAUyapBZg==}
     engines: {node: '>=8'}
@@ -2751,18 +2201,6 @@ packages:
       jsdom:
         optional: true
 
-  vscode-oniguruma@1.7.0:
-    resolution: {integrity: sha512-L9WMGRfrjOhgHSdOYgCt/yRMsXzLDJSL7BPrOZt73gU0iWO4mpqzqQzOz5srxqTvMBaR0XZTSrVWo4j55Rc6cA==}
-
-  vscode-textmate@5.2.0:
-    resolution: {integrity: sha512-Uw5ooOQxRASHgu6C7GVvUxisKXfSgW4oFlO+aa+PAkgmH89O3CXxEEzNRNtHSqtXFTl0nAC1uYj0GMSH27uwtQ==}
-
-  vscode-textmate@8.0.0:
-    resolution: {integrity: sha512-AFbieoL7a5LMqcnOF04ji+rpXadgOXnZsxQr//r83kLPr7biP7am3g9zbaZIaBGwBRWeSvoMD4mgPdX3e4NWBg==}
-
-  w3c-keyname@2.2.8:
-    resolution: {integrity: sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==}
-
   w3c-xmlserializer@5.0.0:
     resolution: {integrity: sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==}
     engines: {node: '>=18'}
@@ -2803,9 +2241,6 @@ packages:
     engines: {node: '>=8'}
     hasBin: true
 
-  wide-align@1.1.5:
-    resolution: {integrity: sha512-eDMORYaPNZ4sQIuuYPDHdQvf4gyCF9rEEV/yPxGfwPkRodwEgiMUUXTx/dex+Me0wxx53S+NgUHaP7y3MGlDmg==}
-
   wrap-ansi@7.0.0:
     resolution: {integrity: sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==}
     engines: {node: '>=10'}
@@ -2814,9 +2249,6 @@ packages:
     resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
     engines: {node: '>=12'}
 
-  wrappy@1.0.2:
-    resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
-
   ws@8.18.0:
     resolution: {integrity: sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==}
     engines: {node: '>=10.0.0'}
@@ -2839,9 +2271,6 @@ packages:
   yallist@2.1.2:
     resolution: {integrity: sha512-ncTzHV7NvsQZkYe1DW7cbDLm0YpzHmZF5r/iyP3ZnQtMiJ+pjzisCiMNI+Sj+xQF5pXhSHxSB3uDbsBTzY/c2A==}
 
-  yallist@4.0.0:
-    resolution: {integrity: sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==}
-
   yaml@1.10.2:
     resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==}
     engines: {node: '>= 6'}
@@ -3035,96 +2464,6 @@ snapshots:
       human-id: 1.0.2
       prettier: 2.8.8
 
-  '@codemirror/autocomplete@6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)':
-    dependencies:
-      '@codemirror/language': 6.10.2
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      '@lezer/common': 1.2.1
-
-  '@codemirror/commands@6.3.3':
-    dependencies:
-      '@codemirror/language': 6.10.2
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      '@lezer/common': 1.2.1
-
-  '@codemirror/lang-css@6.2.1(@codemirror/view@6.33.0)':
-    dependencies:
-      '@codemirror/autocomplete': 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/language': 6.10.2
-      '@codemirror/state': 6.4.1
-      '@lezer/common': 1.2.1
-      '@lezer/css': 1.1.8
-    transitivePeerDependencies:
-      - '@codemirror/view'
-
-  '@codemirror/lang-html@6.4.9':
-    dependencies:
-      '@codemirror/autocomplete': 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.33.0)
-      '@codemirror/lang-javascript': 6.2.2
-      '@codemirror/language': 6.10.2
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      '@lezer/common': 1.2.1
-      '@lezer/css': 1.1.8
-      '@lezer/html': 1.3.10
-
-  '@codemirror/lang-javascript@6.2.2':
-    dependencies:
-      '@codemirror/autocomplete': 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/language': 6.10.2
-      '@codemirror/lint': 6.8.1
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      '@lezer/common': 1.2.1
-      '@lezer/javascript': 1.4.15
-
-  '@codemirror/lang-json@6.0.1':
-    dependencies:
-      '@codemirror/language': 6.10.2
-      '@lezer/json': 1.0.2
-
-  '@codemirror/lang-markdown@6.2.4':
-    dependencies:
-      '@codemirror/autocomplete': 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/language': 6.10.2
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      '@lezer/common': 1.2.1
-      '@lezer/markdown': 1.2.0
-
-  '@codemirror/language@6.10.2':
-    dependencies:
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      '@lezer/common': 1.2.1
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.0
-      style-mod: 4.1.2
-
-  '@codemirror/lint@6.8.1':
-    dependencies:
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      crelt: 1.0.6
-
-  '@codemirror/search@6.5.6':
-    dependencies:
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      crelt: 1.0.6
-
-  '@codemirror/state@6.4.1': {}
-
-  '@codemirror/view@6.33.0':
-    dependencies:
-      '@codemirror/state': 6.4.1
-      style-mod: 4.1.2
-      w3c-keyname: 2.2.8
-
   '@esbuild/aix-ppc64@0.21.5':
     optional: true
 
@@ -3227,8 +2566,6 @@ snapshots:
 
   '@eslint/object-schema@2.1.4': {}
 
-  '@fontsource/fira-mono@5.0.8': {}
-
   '@humanwhocodes/module-importer@1.0.1': {}
 
   '@humanwhocodes/retry@0.3.0': {}
@@ -3266,45 +2603,6 @@ snapshots:
       '@jridgewell/resolve-uri': 3.1.1
       '@jridgewell/sourcemap-codec': 1.5.0
 
-  '@lezer/common@1.2.1': {}
-
-  '@lezer/css@1.1.8':
-    dependencies:
-      '@lezer/common': 1.2.1
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.0
-
-  '@lezer/highlight@1.2.1':
-    dependencies:
-      '@lezer/common': 1.2.1
-
-  '@lezer/html@1.3.10':
-    dependencies:
-      '@lezer/common': 1.2.1
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.0
-
-  '@lezer/javascript@1.4.15':
-    dependencies:
-      '@lezer/common': 1.2.1
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.0
-
-  '@lezer/json@1.0.2':
-    dependencies:
-      '@lezer/common': 1.2.1
-      '@lezer/highlight': 1.2.1
-      '@lezer/lr': 1.4.0
-
-  '@lezer/lr@1.4.0':
-    dependencies:
-      '@lezer/common': 1.2.1
-
-  '@lezer/markdown@1.2.0':
-    dependencies:
-      '@lezer/common': 1.2.1
-      '@lezer/highlight': 1.2.1
-
   '@manypkg/find-root@1.1.0':
     dependencies:
       '@babel/runtime': 7.23.8
@@ -3321,33 +2619,6 @@ snapshots:
       globby: 11.1.0
       read-yaml-file: 1.1.0
 
-  '@mapbox/node-pre-gyp@1.0.11':
-    dependencies:
-      detect-libc: 2.0.2
-      https-proxy-agent: 5.0.1
-      make-dir: 3.1.0
-      node-fetch: 2.7.0
-      nopt: 5.0.0
-      npmlog: 5.0.1
-      rimraf: 3.0.2
-      semver: 7.6.3
-      tar: 6.2.0
-    transitivePeerDependencies:
-      - encoding
-      - supports-color
-
-  '@neocodemirror/svelte@0.0.15(@codemirror/autocomplete@6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1))(@codemirror/commands@6.3.3)(@codemirror/language@6.10.2)(@codemirror/lint@6.8.1)(@codemirror/search@6.5.6)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)':
-    dependencies:
-      '@codemirror/autocomplete': 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/commands': 6.3.3
-      '@codemirror/language': 6.10.2
-      '@codemirror/lint': 6.8.1
-      '@codemirror/search': 6.5.6
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      csstype: 3.1.3
-      nanostores: 0.8.1
-
   '@nodelib/fs.scandir@2.1.5':
     dependencies:
       '@nodelib/fs.stat': 2.0.5
@@ -3369,26 +2640,6 @@ snapshots:
 
   '@polka/url@1.0.0-next.25': {}
 
-  '@replit/codemirror-lang-svelte@6.0.0(@codemirror/autocomplete@6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1))(@codemirror/lang-css@6.2.1(@codemirror/view@6.33.0))(@codemirror/lang-html@6.4.9)(@codemirror/lang-javascript@6.2.2)(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)(@lezer/highlight@1.2.1)(@lezer/javascript@1.4.15)(@lezer/lr@1.4.0)':
-    dependencies:
-      '@codemirror/autocomplete': 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.33.0)
-      '@codemirror/lang-html': 6.4.9
-      '@codemirror/lang-javascript': 6.2.2
-      '@codemirror/language': 6.10.2
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-      '@lezer/common': 1.2.1
-      '@lezer/highlight': 1.2.1
-      '@lezer/javascript': 1.4.15
-      '@lezer/lr': 1.4.0
-
-  '@rich_harris/svelte-split-pane@1.1.3(svelte@packages+svelte)':
-    dependencies:
-      svelte: link:packages/svelte
-
-  '@rollup/browser@3.29.4': {}
-
   '@rollup/plugin-commonjs@28.0.1(rollup@4.22.4)':
     dependencies:
       '@rollup/pluginutils': 5.1.0(rollup@4.22.4)
@@ -3423,11 +2674,6 @@ snapshots:
     optionalDependencies:
       rollup: 4.22.4
 
-  '@rollup/pluginutils@4.2.1':
-    dependencies:
-      estree-walker: 2.0.2
-      picomatch: 2.3.1
-
   '@rollup/pluginutils@5.1.0(rollup@4.22.4)':
     dependencies:
       '@types/estree': 1.0.6
@@ -3493,15 +2739,6 @@ snapshots:
       eslint-visitor-keys: 3.4.3
       espree: 9.6.1
 
-  '@sveltejs/adapter-vercel@5.4.3(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))':
-    dependencies:
-      '@sveltejs/kit': 2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
-      '@vercel/nft': 0.27.3
-      esbuild: 0.21.5
-    transitivePeerDependencies:
-      - encoding
-      - supports-color
-
   '@sveltejs/eslint-config@8.1.0(@stylistic/eslint-plugin-js@1.8.0(eslint@9.9.1))(eslint-config-prettier@9.1.0(eslint@9.9.1))(eslint-plugin-n@17.9.0(eslint@9.9.1))(eslint-plugin-svelte@2.38.0(eslint@9.9.1)(svelte@packages+svelte))(eslint@9.9.1)(typescript-eslint@8.2.0(eslint@9.9.1)(typescript@5.5.4))(typescript@5.5.4)':
     dependencies:
       '@stylistic/eslint-plugin-js': 1.8.0(eslint@9.9.1)
@@ -3513,31 +2750,6 @@ snapshots:
       typescript: 5.5.4
       typescript-eslint: 8.2.0(eslint@9.9.1)(typescript@5.5.4)
 
-  '@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))':
-    dependencies:
-      '@sveltejs/vite-plugin-svelte': 4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
-      '@types/cookie': 0.6.0
-      cookie: 0.6.0
-      devalue: 5.1.1
-      esm-env: 1.2.1
-      import-meta-resolve: 4.1.0
-      kleur: 4.1.5
-      magic-string: 0.30.11
-      mrmime: 2.0.0
-      sade: 1.8.1
-      set-cookie-parser: 2.7.0
-      sirv: 3.0.0
-      svelte: link:packages/svelte
-      tiny-glob: 0.2.9
-      vite: 5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
-
-  '@sveltejs/site-kit@6.0.0-next.64(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)':
-    dependencies:
-      '@sveltejs/kit': 2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
-      esm-env: 1.2.1
-      svelte: link:packages/svelte
-      svelte-persisted-store: 0.9.2(svelte@packages+svelte)
-
   '@sveltejs/vite-plugin-svelte-inspector@3.0.0-next.2(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))':
     dependencies:
       '@sveltejs/vite-plugin-svelte': 4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
@@ -3569,8 +2781,6 @@ snapshots:
 
   '@types/aria-query@5.0.4': {}
 
-  '@types/cookie@0.6.0': {}
-
   '@types/eslint@8.56.12':
     dependencies:
       '@types/estree': 1.0.6
@@ -3673,49 +2883,6 @@ snapshots:
       '@typescript-eslint/types': 8.2.0
       eslint-visitor-keys: 3.4.3
 
-  '@typescript/twoslash@3.1.0':
-    dependencies:
-      '@typescript/vfs': 1.3.5
-      debug: 4.3.6
-      lz-string: 1.5.0
-    transitivePeerDependencies:
-      - supports-color
-
-  '@typescript/vfs@1.3.4':
-    dependencies:
-      debug: 4.3.6
-    transitivePeerDependencies:
-      - supports-color
-
-  '@typescript/vfs@1.3.5':
-    dependencies:
-      debug: 4.3.6
-    transitivePeerDependencies:
-      - supports-color
-
-  '@vercel/nft@0.27.3':
-    dependencies:
-      '@mapbox/node-pre-gyp': 1.0.11
-      '@rollup/pluginutils': 4.2.1
-      acorn: 8.12.1
-      acorn-import-attributes: 1.9.5(acorn@8.12.1)
-      async-sema: 3.1.1
-      bindings: 1.5.0
-      estree-walker: 2.0.2
-      glob: 7.2.3
-      graceful-fs: 4.2.11
-      micromatch: 4.0.5
-      node-gyp-build: 4.8.0
-      resolve-from: 5.0.0
-    transitivePeerDependencies:
-      - encoding
-      - supports-color
-
-  '@vercel/speed-insights@1.0.11(@sveltejs/kit@2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)':
-    optionalDependencies:
-      '@sveltejs/kit': 2.8.3(@sveltejs/vite-plugin-svelte@4.0.0-next.6(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)))(svelte@packages+svelte)(vite@5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
-      svelte: link:packages/svelte
-
   '@vitest/coverage-v8@2.0.5(vitest@2.0.5(@types/node@20.12.7)(jsdom@25.0.1)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))':
     dependencies:
       '@ampproject/remapping': 2.3.0
@@ -3767,12 +2934,6 @@ snapshots:
       loupe: 3.1.1
       tinyrainbow: 1.2.0
 
-  abbrev@1.1.1: {}
-
-  acorn-import-attributes@1.9.5(acorn@8.12.1):
-    dependencies:
-      acorn: 8.12.1
-
   acorn-jsx@5.3.2(acorn@8.12.1):
     dependencies:
       acorn: 8.12.1
@@ -3783,12 +2944,6 @@ snapshots:
 
   acorn@8.12.1: {}
 
-  agent-base@6.0.2:
-    dependencies:
-      debug: 4.3.6
-    transitivePeerDependencies:
-      - supports-color
-
   agent-base@7.1.1:
     dependencies:
       debug: 4.3.6
@@ -3808,8 +2963,6 @@ snapshots:
 
   ansi-regex@6.0.1: {}
 
-  ansi-sequence-parser@1.1.1: {}
-
   ansi-styles@4.3.0:
     dependencies:
       color-convert: 2.0.1
@@ -3820,13 +2973,7 @@ snapshots:
     dependencies:
       normalize-path: 3.0.0
       picomatch: 2.3.1
-
-  aproba@2.0.0: {}
-
-  are-we-there-yet@2.0.0:
-    dependencies:
-      delegates: 1.0.0
-      readable-stream: 3.6.2
+    optional: true
 
   argparse@1.0.10:
     dependencies:
@@ -3840,8 +2987,6 @@ snapshots:
 
   assertion-error@2.0.1: {}
 
-  async-sema@3.1.1: {}
-
   asynckit@0.4.0: {}
 
   axobject-query@4.1.0: {}
@@ -3852,11 +2997,8 @@ snapshots:
     dependencies:
       is-windows: 1.0.2
 
-  binary-extensions@2.2.0: {}
-
-  bindings@1.5.0:
-    dependencies:
-      file-uri-to-path: 1.0.0
+  binary-extensions@2.2.0:
+    optional: true
 
   brace-expansion@1.1.11:
     dependencies:
@@ -3909,31 +3051,16 @@ snapshots:
       readdirp: 3.6.0
     optionalDependencies:
       fsevents: 2.3.3
-
-  chownr@2.0.0: {}
+    optional: true
 
   ci-info@3.9.0: {}
 
-  codemirror@6.0.1(@lezer/common@1.2.1):
-    dependencies:
-      '@codemirror/autocomplete': 6.18.0(@codemirror/language@6.10.2)(@codemirror/state@6.4.1)(@codemirror/view@6.33.0)(@lezer/common@1.2.1)
-      '@codemirror/commands': 6.3.3
-      '@codemirror/language': 6.10.2
-      '@codemirror/lint': 6.8.1
-      '@codemirror/search': 6.5.6
-      '@codemirror/state': 6.4.1
-      '@codemirror/view': 6.33.0
-    transitivePeerDependencies:
-      - '@lezer/common'
-
   color-convert@2.0.1:
     dependencies:
       color-name: 1.1.4
 
   color-name@1.1.4: {}
 
-  color-support@1.1.3: {}
-
   combined-stream@1.0.8:
     dependencies:
       delayed-stream: 1.0.0
@@ -3944,12 +3071,6 @@ snapshots:
 
   concat-map@0.0.1: {}
 
-  console-control-strings@1.1.0: {}
-
-  cookie@0.6.0: {}
-
-  crelt@1.0.6: {}
-
   cross-spawn@5.1.0:
     dependencies:
       lru-cache: 4.1.5
@@ -3968,8 +3089,6 @@ snapshots:
     dependencies:
       rrweb-cssom: 0.7.1
 
-  csstype@3.1.3: {}
-
   data-urls@5.0.0:
     dependencies:
       whatwg-mimetype: 4.0.0
@@ -4000,17 +3119,11 @@ snapshots:
 
   delayed-stream@1.0.0: {}
 
-  delegates@1.0.0: {}
-
   detect-indent@6.1.0: {}
 
   detect-libc@1.0.3:
     optional: true
 
-  detect-libc@2.0.2: {}
-
-  devalue@5.1.1: {}
-
   dir-glob@3.0.1:
     dependencies:
       path-type: 4.0.0
@@ -4263,14 +3376,10 @@ snapshots:
     optionalDependencies:
       picomatch: 4.0.2
 
-  fenceparser@1.1.1: {}
-
   file-entry-cache@8.0.0:
     dependencies:
       flat-cache: 4.0.1
 
-  file-uri-to-path@1.0.0: {}
-
   fill-range@7.0.1:
     dependencies:
       to-regex-range: 5.0.1
@@ -4321,12 +3430,6 @@ snapshots:
       jsonfile: 4.0.0
       universalify: 0.1.2
 
-  fs-minipass@2.1.0:
-    dependencies:
-      minipass: 3.3.6
-
-  fs.realpath@1.0.0: {}
-
   fsevents@2.3.2:
     optional: true
 
@@ -4335,18 +3438,6 @@ snapshots:
 
   function-bind@1.1.2: {}
 
-  gauge@3.0.2:
-    dependencies:
-      aproba: 2.0.0
-      color-support: 1.1.3
-      console-control-strings: 1.1.0
-      has-unicode: 2.0.1
-      object-assign: 4.1.1
-      signal-exit: 3.0.7
-      string-width: 4.2.3
-      strip-ansi: 6.0.1
-      wide-align: 1.1.5
-
   get-func-name@2.0.2: {}
 
   get-stream@8.0.1: {}
@@ -4372,23 +3463,6 @@ snapshots:
       package-json-from-dist: 1.0.0
       path-scurry: 1.11.1
 
-  glob@7.2.3:
-    dependencies:
-      fs.realpath: 1.0.0
-      inflight: 1.0.6
-      inherits: 2.0.4
-      minimatch: 3.1.2
-      once: 1.4.0
-      path-is-absolute: 1.0.1
-
-  glob@8.1.0:
-    dependencies:
-      fs.realpath: 1.0.0
-      inflight: 1.0.6
-      inherits: 2.0.4
-      minimatch: 5.1.6
-      once: 1.4.0
-
   globals@14.0.0: {}
 
   globals@15.9.0: {}
@@ -4412,8 +3486,6 @@ snapshots:
 
   has-flag@4.0.0: {}
 
-  has-unicode@2.0.1: {}
-
   hasown@2.0.0:
     dependencies:
       function-bind: 1.1.2
@@ -4431,13 +3503,6 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  https-proxy-agent@5.0.1:
-    dependencies:
-      agent-base: 6.0.2
-      debug: 4.3.6
-    transitivePeerDependencies:
-      - supports-color
-
   https-proxy-agent@7.0.5:
     dependencies:
       agent-base: 7.1.1
@@ -4457,10 +3522,6 @@ snapshots:
     dependencies:
       safer-buffer: 2.1.2
 
-  ignore-walk@5.0.1:
-    dependencies:
-      minimatch: 5.1.6
-
   ignore@5.3.2: {}
 
   immutable@4.3.4:
@@ -4471,20 +3532,12 @@ snapshots:
       parent-module: 1.0.1
       resolve-from: 4.0.0
 
-  import-meta-resolve@4.1.0: {}
-
   imurmurhash@0.1.4: {}
 
-  inflight@1.0.6:
-    dependencies:
-      once: 1.4.0
-      wrappy: 1.0.2
-
-  inherits@2.0.4: {}
-
   is-binary-path@2.1.0:
     dependencies:
       binary-extensions: 2.2.0
+    optional: true
 
   is-core-module@2.13.1:
     dependencies:
@@ -4604,8 +3657,6 @@ snapshots:
 
   json-stable-stringify-without-jsonify@1.0.1: {}
 
-  jsonc-parser@3.2.0: {}
-
   jsonfile@4.0.0:
     optionalDependencies:
       graceful-fs: 4.2.11
@@ -4698,8 +3749,6 @@ snapshots:
       pseudomap: 1.0.2
       yallist: 2.1.2
 
-  lz-string@1.5.0: {}
-
   magic-string@0.30.11:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.0
@@ -4710,16 +3759,10 @@ snapshots:
       '@babel/types': 7.25.4
       source-map-js: 1.2.1
 
-  make-dir@3.1.0:
-    dependencies:
-      semver: 6.3.1
-
   make-dir@4.0.0:
     dependencies:
       semver: 7.6.3
 
-  marked@7.0.5: {}
-
   merge-stream@2.0.0: {}
 
   merge2@1.4.1: {}
@@ -4741,29 +3784,12 @@ snapshots:
     dependencies:
       brace-expansion: 1.1.11
 
-  minimatch@5.1.6:
-    dependencies:
-      brace-expansion: 2.0.1
-
   minimatch@9.0.5:
     dependencies:
       brace-expansion: 2.0.1
 
-  minipass@3.3.6:
-    dependencies:
-      yallist: 4.0.0
-
-  minipass@5.0.0: {}
-
   minipass@7.1.2: {}
 
-  minizlib@2.1.2:
-    dependencies:
-      minipass: 3.3.6
-      yallist: 4.0.0
-
-  mkdirp@1.0.4: {}
-
   mri@1.2.0: {}
 
   mrmime@2.0.0: {}
@@ -4772,54 +3798,21 @@ snapshots:
 
   nanoid@3.3.7: {}
 
-  nanostores@0.8.1: {}
-
   natural-compare@1.4.0: {}
 
   node-fetch@2.7.0:
     dependencies:
       whatwg-url: 5.0.0
 
-  node-gyp-build@4.8.0: {}
-
-  nopt@5.0.0:
-    dependencies:
-      abbrev: 1.1.1
-
-  normalize-path@3.0.0: {}
-
-  npm-bundled@2.0.1:
-    dependencies:
-      npm-normalize-package-bin: 2.0.0
-
-  npm-normalize-package-bin@2.0.0: {}
-
-  npm-packlist@5.1.3:
-    dependencies:
-      glob: 8.1.0
-      ignore-walk: 5.0.1
-      npm-bundled: 2.0.1
-      npm-normalize-package-bin: 2.0.0
+  normalize-path@3.0.0:
+    optional: true
 
   npm-run-path@5.2.0:
     dependencies:
       path-key: 4.0.0
 
-  npmlog@5.0.1:
-    dependencies:
-      are-we-there-yet: 2.0.0
-      console-control-strings: 1.1.0
-      gauge: 3.0.2
-      set-blocking: 2.0.0
-
   nwsapi@2.2.12: {}
 
-  object-assign@4.1.1: {}
-
-  once@1.4.0:
-    dependencies:
-      wrappy: 1.0.2
-
   onetime@6.0.0:
     dependencies:
       mimic-fn: 4.0.0
@@ -4882,8 +3875,6 @@ snapshots:
 
   path-exists@4.0.0: {}
 
-  path-is-absolute@1.0.1: {}
-
   path-key@3.1.1: {}
 
   path-key@4.0.0: {}
@@ -4963,12 +3954,6 @@ snapshots:
 
   pseudomap@1.0.2: {}
 
-  publint@0.2.7:
-    dependencies:
-      npm-packlist: 5.1.3
-      picocolors: 1.1.0
-      sade: 1.8.1
-
   punycode@2.3.1: {}
 
   queue-microtask@1.2.3: {}
@@ -4984,15 +3969,10 @@ snapshots:
       pify: 4.0.1
       strip-bom: 3.0.0
 
-  readable-stream@3.6.2:
-    dependencies:
-      inherits: 2.0.4
-      string_decoder: 1.3.0
-      util-deprecate: 1.0.2
-
   readdirp@3.6.0:
     dependencies:
       picomatch: 2.3.1
+    optional: true
 
   regenerator-runtime@0.14.1: {}
 
@@ -5004,8 +3984,6 @@ snapshots:
 
   resolve-pkg-maps@1.0.0: {}
 
-  resolve.exports@2.0.2: {}
-
   resolve@1.22.8:
     dependencies:
       is-core-module: 2.13.1
@@ -5014,10 +3992,6 @@ snapshots:
 
   reusify@1.0.4: {}
 
-  rimraf@3.0.2:
-    dependencies:
-      glob: 7.2.3
-
   rollup@4.22.4:
     dependencies:
       '@types/estree': 1.0.5
@@ -5067,18 +4041,12 @@ snapshots:
     dependencies:
       xmlchars: 2.2.0
 
-  semver@6.3.1: {}
-
   semver@7.6.3: {}
 
   serialize-javascript@6.0.2:
     dependencies:
       randombytes: 2.1.0
 
-  set-blocking@2.0.0: {}
-
-  set-cookie-parser@2.7.0: {}
-
   shebang-command@1.2.0:
     dependencies:
       shebang-regex: 1.0.0
@@ -5091,29 +4059,6 @@ snapshots:
 
   shebang-regex@3.0.0: {}
 
-  shiki-twoslash@3.1.2(typescript@5.5.4):
-    dependencies:
-      '@typescript/twoslash': 3.1.0
-      '@typescript/vfs': 1.3.4
-      fenceparser: 1.1.1
-      shiki: 0.10.1
-      typescript: 5.5.4
-    transitivePeerDependencies:
-      - supports-color
-
-  shiki@0.10.1:
-    dependencies:
-      jsonc-parser: 3.2.0
-      vscode-oniguruma: 1.7.0
-      vscode-textmate: 5.2.0
-
-  shiki@0.14.7:
-    dependencies:
-      ansi-sequence-parser: 1.1.1
-      jsonc-parser: 3.2.0
-      vscode-oniguruma: 1.7.0
-      vscode-textmate: 8.0.0
-
   siginfo@2.0.0: {}
 
   signal-exit@3.0.7: {}
@@ -5126,12 +4071,6 @@ snapshots:
       mrmime: 2.0.0
       totalist: 3.0.1
 
-  sirv@3.0.0:
-    dependencies:
-      '@polka/url': 1.0.0-next.25
-      mrmime: 2.0.0
-      totalist: 3.0.1
-
   slash@3.0.0: {}
 
   smob@1.4.1: {}
@@ -5170,10 +4109,6 @@ snapshots:
       emoji-regex: 9.2.2
       strip-ansi: 7.1.0
 
-  string_decoder@1.3.0:
-    dependencies:
-      safe-buffer: 5.2.1
-
   strip-ansi@6.0.1:
     dependencies:
       ansi-regex: 5.0.1
@@ -5188,26 +4123,12 @@ snapshots:
 
   strip-json-comments@3.1.1: {}
 
-  style-mod@4.1.2: {}
-
   supports-color@7.2.0:
     dependencies:
       has-flag: 4.0.0
 
   supports-preserve-symlinks-flag@1.0.0: {}
 
-  svelte-check@4.0.1(picomatch@4.0.2)(svelte@packages+svelte)(typescript@5.5.4):
-    dependencies:
-      '@jridgewell/trace-mapping': 0.3.25
-      chokidar: 3.5.3
-      fdir: 6.3.0(picomatch@4.0.2)
-      picocolors: 1.1.0
-      sade: 1.8.1
-      svelte: link:packages/svelte
-      typescript: 5.5.4
-    transitivePeerDependencies:
-      - picomatch
-
   svelte-eslint-parser@0.41.0(svelte@packages+svelte):
     dependencies:
       eslint-scope: 7.2.2
@@ -5218,27 +4139,10 @@ snapshots:
     optionalDependencies:
       svelte: link:packages/svelte
 
-  svelte-json-tree@2.2.0(svelte@packages+svelte):
-    dependencies:
-      svelte: link:packages/svelte
-
-  svelte-persisted-store@0.9.2(svelte@packages+svelte):
-    dependencies:
-      svelte: link:packages/svelte
-
   symbol-tree@3.2.4: {}
 
   tapable@2.2.1: {}
 
-  tar@6.2.0:
-    dependencies:
-      chownr: 2.0.0
-      fs-minipass: 2.1.0
-      minipass: 5.0.0
-      minizlib: 2.1.2
-      mkdirp: 1.0.4
-      yallist: 4.0.0
-
   term-size@2.2.1: {}
 
   terser@5.27.0:
@@ -5420,14 +4324,6 @@ snapshots:
       - supports-color
       - terser
 
-  vscode-oniguruma@1.7.0: {}
-
-  vscode-textmate@5.2.0: {}
-
-  vscode-textmate@8.0.0: {}
-
-  w3c-keyname@2.2.8: {}
-
   w3c-xmlserializer@5.0.0:
     dependencies:
       xml-name-validator: 5.0.0
@@ -5465,10 +4361,6 @@ snapshots:
       siginfo: 2.0.0
       stackback: 0.0.2
 
-  wide-align@1.1.5:
-    dependencies:
-      string-width: 4.2.3
-
   wrap-ansi@7.0.0:
     dependencies:
       ansi-styles: 4.3.0
@@ -5481,8 +4373,6 @@ snapshots:
       string-width: 5.1.2
       strip-ansi: 7.1.0
 
-  wrappy@1.0.2: {}
-
   ws@8.18.0: {}
 
   xml-name-validator@5.0.0: {}
@@ -5491,8 +4381,6 @@ snapshots:
 
   yallist@2.1.2: {}
 
-  yallist@4.0.0: {}
-
   yaml@1.10.2: {}
 
   yocto-queue@0.1.0: {}
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index c73122314ae1..f94dac7cc70f 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -1,4 +1,3 @@
 packages:
   - 'packages/*'
   - 'playgrounds/*'
-  - 'sites/*'
diff --git a/sites/svelte-5-preview/.gitignore b/sites/svelte-5-preview/.gitignore
deleted file mode 100644
index 22aaf3d86419..000000000000
--- a/sites/svelte-5-preview/.gitignore
+++ /dev/null
@@ -1,8 +0,0 @@
-.DS_Store
-node_modules
-/build
-/.svelte-kit
-/dist
-/src/routes/status/results.json
-.env
-.env.*
diff --git a/sites/svelte-5-preview/jsconfig.json b/sites/svelte-5-preview/jsconfig.json
deleted file mode 100644
index a4b95fb2fe32..000000000000
--- a/sites/svelte-5-preview/jsconfig.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-	"extends": "./.svelte-kit/tsconfig.json",
-	"compilerOptions": {
-		"moduleResolution": "bundler",
-		"allowJs": true,
-		"checkJs": true,
-		"esModuleInterop": true,
-		"forceConsistentCasingInFileNames": true,
-		"resolveJsonModule": true,
-		"skipLibCheck": true,
-		"sourceMap": true,
-		"strict": true,
-		"noImplicitAny": true
-	}
-}
diff --git a/sites/svelte-5-preview/package.json b/sites/svelte-5-preview/package.json
deleted file mode 100644
index 356a57c3f607..000000000000
--- a/sites/svelte-5-preview/package.json
+++ /dev/null
@@ -1,57 +0,0 @@
-{
-  "name": "svelte-5-preview",
-  "private": true,
-  "version": "0.5.0",
-  "license": "MIT",
-  "type": "module",
-  "scripts": {
-    "dev": "vite dev",
-    "build": "vite build",
-    "preview": "vite preview",
-    "check-disable-tmp": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch"
-  },
-  "devDependencies": {
-    "@fontsource/fira-mono": "^5.0.8",
-    "@lezer/common": "^1.2.1",
-    "@sveltejs/adapter-vercel": "^5.4.3",
-    "@sveltejs/kit": "^2.8.3",
-    "@sveltejs/site-kit": "6.0.0-next.64",
-    "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6",
-    "@vercel/speed-insights": "^1.0.0",
-    "esrap": "^1.2.3",
-    "marked": "^9.0.0",
-    "publint": "^0.2.7",
-    "shiki": "^0.14.7",
-    "shiki-twoslash": "^3.1.2",
-    "svelte": "workspace:^",
-    "svelte-check": "^4.0.0",
-    "typescript": "^5.5.4",
-    "vite": "^5.4.6"
-  },
-  "dependencies": {
-    "@codemirror/autocomplete": "^6.12.0",
-    "@codemirror/commands": "^6.3.3",
-    "@codemirror/lang-css": "^6.2.1",
-    "@codemirror/lang-javascript": "^6.2.1",
-    "@codemirror/lang-json": "^6.0.1",
-    "@codemirror/lang-markdown": "^6.2.4",
-    "@codemirror/language": "^6.10.1",
-    "@codemirror/lint": "^6.5.0",
-    "@codemirror/state": "^6.4.0",
-    "@codemirror/view": "^6.24.0",
-    "@jridgewell/sourcemap-codec": "^1.5.0",
-    "@lezer/highlight": "^1.1.6",
-    "@neocodemirror/svelte": "0.0.15",
-    "@replit/codemirror-lang-svelte": "^6.0.0",
-    "@rich_harris/svelte-split-pane": "^1.1.3",
-    "@rollup/browser": "^3.28.0",
-    "acorn": "^8.12.1",
-    "codemirror": "^6.0.1",
-    "esm-env": "^1.0.0",
-    "marked": "^7.0.2",
-    "resolve.exports": "^2.0.2",
-    "svelte-json-tree": "^2.2.0",
-    "zimmerframe": "^1.1.2"
-  }
-}
diff --git a/sites/svelte-5-preview/src/app.html b/sites/svelte-5-preview/src/app.html
deleted file mode 100644
index 8b4da3764024..000000000000
--- a/sites/svelte-5-preview/src/app.html
+++ /dev/null
@@ -1,13 +0,0 @@
-<!doctype html>
-<html lang="en" class="theme-default typo-default">
-	<head>
-		<meta charset="utf-8" />
-		<meta name="description" content="" />
-		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
-		<meta name="viewport" content="width=device-width, initial-scale=1" />
-		%sveltekit.head%
-	</head>
-	<body data-sveltekit-preload-data="hover">
-		<div style="display: contents">%sveltekit.body%</div>
-	</body>
-</html>
diff --git a/sites/svelte-5-preview/src/global.d.ts b/sites/svelte-5-preview/src/global.d.ts
deleted file mode 100644
index 63908c66cfd4..000000000000
--- a/sites/svelte-5-preview/src/global.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-/// <reference types="@sveltejs/kit" />
diff --git a/sites/svelte-5-preview/src/lib/Bundler.js b/sites/svelte-5-preview/src/lib/Bundler.js
deleted file mode 100644
index e20946de7f02..000000000000
--- a/sites/svelte-5-preview/src/lib/Bundler.js
+++ /dev/null
@@ -1,72 +0,0 @@
-import Worker from './workers/bundler/index.js?worker';
-
-const workers = new Map();
-
-let uid = 1;
-
-export default class Bundler {
-	/** @type {Worker} */
-	worker;
-
-	/** @param {{ packages_url: string; svelte_url: string; onstatus: (val: string | null) => void}} param0 */
-	constructor({ packages_url, svelte_url, onstatus }) {
-		const hash = `${packages_url}:${svelte_url}`;
-
-		if (!workers.has(hash)) {
-			const worker = new Worker();
-			worker.postMessage({ type: 'init', packages_url, svelte_url });
-			workers.set(hash, worker);
-		}
-
-		this.worker = workers.get(hash);
-
-		this.handlers = new Map();
-
-		this.worker.addEventListener(
-			'message',
-			/**
-			 *
-			 * @param {MessageEvent<import('./workers/workers').BundleMessageData>} event
-			 * @returns
-			 */
-			(event) => {
-				const handler = this.handlers.get(event.data.uid);
-
-				if (handler) {
-					// if no handler, was meant for a different REPL
-					if (event.data.type === 'status') {
-						onstatus(event.data.message);
-						return;
-					}
-
-					onstatus(null);
-					handler(event.data);
-					this.handlers.delete(event.data.uid);
-				}
-			}
-		);
-	}
-
-	/**
-	 *
-	 * @param {import('./types').File[]} files
-	 * @returns
-	 */
-	bundle(files) {
-		return new Promise((fulfil) => {
-			this.handlers.set(uid, fulfil);
-
-			this.worker.postMessage({
-				uid,
-				type: 'bundle',
-				files
-			});
-
-			uid += 1;
-		});
-	}
-
-	destroy() {
-		this.worker.terminate();
-	}
-}
diff --git a/sites/svelte-5-preview/src/lib/Checkbox.svelte b/sites/svelte-5-preview/src/lib/Checkbox.svelte
deleted file mode 100644
index 13802e6076d4..000000000000
--- a/sites/svelte-5-preview/src/lib/Checkbox.svelte
+++ /dev/null
@@ -1,63 +0,0 @@
-<script>
-	export let checked = false;
-</script>
-
-<input type="checkbox" bind:checked />
-
-<style>
-	input[type='checkbox'] {
-		/* display: block; */
-		position: relative;
-		height: 1em;
-		width: calc(100% - 0.6em);
-		max-width: 2em;
-		top: -2px;
-		border-radius: 0.5em;
-		-webkit-appearance: none;
-		appearance: none;
-		outline: none;
-		border: transparent;
-		margin: 0 0.6em 0 0;
-	}
-
-	input[type='checkbox']::before {
-		content: '';
-		position: absolute;
-		display: block;
-		height: 100%;
-		width: 100%;
-		padding: 2px;
-		border-radius: 1em;
-		top: 0;
-		left: 0;
-		background: var(--sk-theme-2);
-		/* box-sizing: border-box; */
-		box-sizing: content-box;
-	}
-
-	input[type='checkbox']:checked::before {
-		background: var(--sk-theme-1);
-	}
-
-	input[type='checkbox']::after {
-		content: '';
-		position: absolute;
-		display: block;
-		height: 1em;
-		width: 1em;
-		top: 2px;
-		left: 2px;
-		border-radius: 1em;
-		background: white;
-		box-shadow:
-			0 0px 1px rgba(0, 0, 0, 0.4),
-			0 4px 2px rgba(0, 0, 0, 0.1);
-		transition:
-			background 0.2s ease-out,
-			left 0.2s ease-out;
-	}
-
-	input[type='checkbox']:checked::after {
-		left: calc(100% - 1em + 2px);
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/CodeMirror.svelte b/sites/svelte-5-preview/src/lib/CodeMirror.svelte
deleted file mode 100644
index 19c3fcc97f5b..000000000000
--- a/sites/svelte-5-preview/src/lib/CodeMirror.svelte
+++ /dev/null
@@ -1,407 +0,0 @@
-<script module>
-	export const cursorIndex = writable(0);
-</script>
-
-<script>
-	import { historyField } from '@codemirror/commands';
-	import { EditorState, Range, StateEffect, StateEffectType, StateField } from '@codemirror/state';
-	import { Decoration, EditorView } from '@codemirror/view';
-	import { codemirror, withCodemirrorInstance } from '@neocodemirror/svelte';
-	import { svelteLanguage } from '@replit/codemirror-lang-svelte';
-	import { javascriptLanguage } from '@codemirror/lang-javascript';
-	import { createEventDispatcher, tick } from 'svelte';
-	import { writable } from 'svelte/store';
-	import { get_repl_context } from '$lib/context.js';
-	import Message from './Message.svelte';
-	import { svelteTheme } from './theme.js';
-	import { autocomplete } from './autocomplete.js';
-
-	/** @type {import('@codemirror/lint').LintSource | undefined} */
-	export let diagnostics = undefined;
-
-	export let readonly = false;
-	export let tab = true;
-
-	/** @type {ReturnType<typeof createEventDispatcher<{ change: { value: string } }>>} */
-	const dispatch = createEventDispatcher();
-
-	let code = '';
-
-	/** @type {import('./types').Lang} */
-	let lang = 'svelte';
-
-	/**
-	 * @param {{ code: string; lang: import('./types').Lang }} options
-	 */
-	export async function set(options) {
-		update(options);
-	}
-
-	/**
-	 * @param {{ code?: string; lang?: import('./types').Lang }} options
-	 */
-	export async function update(options) {
-		await isReady;
-
-		if (!$cmInstance.view) return;
-
-		if (options.lang && options.lang !== lang) {
-			// This will trigger change_mode
-			lang = options.lang;
-		}
-
-		if (options.code !== undefined) {
-			updating_externally = true;
-
-			const { scrollLeft: left, scrollTop: top } = $cmInstance.view.scrollDOM;
-
-			code = options.code;
-
-			updating_externally = false;
-
-			$cmInstance.view.scrollDOM.scrollTop = top;
-			$cmInstance.view.scrollDOM.scrollLeft = left;
-		}
-	}
-
-	/**
-	 * @param {number} pos
-	 */
-	export function setCursor(pos) {
-		cursor_pos = pos;
-	}
-
-	/** @type {(...val: any) => void} */
-	let fulfil_module_editor_ready;
-	export const isReady = new Promise((f) => (fulfil_module_editor_ready = f));
-
-	export function resize() {
-		$cmInstance.view?.requestMeasure();
-	}
-
-	export function focus() {
-		$cmInstance.view?.focus();
-	}
-
-	export function getEditorState() {
-		return $cmInstance.view?.state.toJSON({ history: historyField });
-	}
-
-	/**
-	 * @param {any} state
-	 */
-	export function setEditorState(state) {
-		if (!$cmInstance.view) return;
-
-		$cmInstance.view.setState(
-			EditorState.fromJSON(state, { extensions, doc: state.doc }, { history: historyField })
-		);
-		$cmInstance.view?.dispatch({
-			changes: { from: 0, to: $cmInstance.view.state.doc.length, insert: state.doc },
-			effects: [StateEffect.reconfigure.of($cmInstance.extensions ?? [])]
-		});
-	}
-
-	export async function clearEditorState() {
-		await tick();
-
-		$cmInstance.view?.setState(EditorState.create({ extensions, doc: '' }));
-		$cmInstance.view?.dispatch({
-			changes: { from: 0, to: $cmInstance.view.state.doc.length, insert: '' },
-			effects: [StateEffect.reconfigure.of($cmInstance.extensions ?? [])]
-		});
-	}
-
-	/** @type {StateEffectType<Range<Decoration>[]>} */
-	const addMarksDecoration = StateEffect.define();
-
-	// This value must be added to the set of extensions to enable this
-	const markField = StateField.define({
-		// Start with an empty set of decorations
-		create() {
-			return Decoration.none;
-		},
-		// This is called whenever the editor updates—it computes the new set
-		update(value, tr) {
-			// Move the decorations to account for document changes
-			value = value.map(tr.changes);
-			// If this transaction adds or removes decorations, apply those changes
-			for (let effect of tr.effects) {
-				if (effect.is(addMarksDecoration)) value = value.update({ add: effect.value, sort: true });
-			}
-			return value;
-		},
-		// Indicate that this field provides a set of decorations
-		provide: (f) => EditorView.decorations.from(f)
-	});
-
-	/**
-	 * @param {object} param0
-	 * @param {number} param0.from
-	 * @param {number} param0.to
-	 * @param {string} [param0.className]
-	 */
-	export function markText({ from, to, className = 'mark-text' }) {
-		const executedMark = Decoration.mark({
-			class: className
-		});
-
-		$cmInstance.view?.dispatch({
-			effects: [
-				StateEffect.appendConfig.of(markField),
-				addMarksDecoration.of([executedMark.range(from, to)])
-			]
-		});
-	}
-
-	export function unmarkText() {
-		$cmInstance.view?.dispatch({
-			effects: StateEffect.reconfigure.of($cmInstance.extensions ?? [])
-		});
-	}
-
-	const cmInstance = withCodemirrorInstance();
-
-	/** @type {number} */
-	let w;
-	/** @type {number} */
-	let h;
-
-	let marked = false;
-
-	let updating_externally = false;
-
-	/** @type {import('@codemirror/state').Extension[]} */
-	let extensions = [];
-
-	let cursor_pos = 0;
-
-	$: if ($cmInstance.view) {
-		fulfil_module_editor_ready();
-	}
-
-	$: if ($cmInstance.view && w && h) resize();
-
-	$: if (marked) {
-		unmarkText();
-		marked = false;
-	}
-
-	const watcher = EditorView.updateListener.of((viewUpdate) => {
-		if (viewUpdate.selectionSet) {
-			cursorIndex.set(viewUpdate.state.selection.main.head);
-		}
-	});
-
-	const { files, selected } = get_repl_context();
-
-	const svelte_rune_completions = svelteLanguage.data.of({
-		/** @param {import('@codemirror/autocomplete').CompletionContext} context */
-		autocomplete: (context) => autocomplete(context, $selected, $files)
-	});
-
-	const js_rune_completions = javascriptLanguage.data.of({
-		/** @param {import('@codemirror/autocomplete').CompletionContext} context */
-		autocomplete: (context) => autocomplete(context, $selected, $files)
-	});
-</script>
-
-<div
-	class="codemirror-container"
-	use:codemirror={{
-		value: code,
-		setup: 'basic',
-		useTabs: tab,
-		tabSize: 2,
-		theme: svelteTheme,
-		readonly,
-		cursorPos: cursor_pos,
-		lang,
-		langMap: {
-			js: () => import('@codemirror/lang-javascript').then((m) => m.javascript()),
-			json: () => import('@codemirror/lang-json').then((m) => m.json()),
-			md: () => import('@codemirror/lang-markdown').then((m) => m.markdown()),
-			css: () => import('@codemirror/lang-css').then((m) => m.css()),
-			svelte: () => import('@replit/codemirror-lang-svelte').then((m) => m.svelte())
-		},
-		lint: diagnostics,
-		lintOptions: { delay: 200 },
-		autocomplete: true,
-		extensions: [svelte_rune_completions, js_rune_completions, watcher],
-		instanceStore: cmInstance
-	}}
-	on:codemirror:textChange={({ detail: value }) => {
-		code = value;
-		dispatch('change', { value: code });
-	}}
->
-	{#if !$cmInstance.view}
-		<pre style="position: absolute; left: 0; top: 0">{code}</pre>
-
-		<div style="position: absolute; width: 100%; bottom: 0">
-			<Message kind="info">loading editor...</Message>
-		</div>
-	{/if}
-</div>
-
-<style>
-	.codemirror-container {
-		--warning: hsl(40 100% 70%);
-		--error: hsl(0 100% 90%);
-		position: relative;
-		width: 100%;
-		height: 100%;
-		border: none;
-		line-height: 1.5;
-		overflow: hidden;
-	}
-
-	:global(.dark) .codemirror-container {
-		--warning: hsl(40 100% 50%);
-		--error: hsl(0 100% 70%);
-	}
-
-	.codemirror-container :global {
-		* {
-			font: 400 var(--sk-text-xs) / 1.7 var(--sk-font-mono);
-		}
-
-		.mark-text {
-			background-color: var(--sk-selection-color);
-			backdrop-filter: opacity(40%);
-		}
-
-		.cm-editor {
-			height: 100%;
-		}
-
-		.error-loc {
-			position: relative;
-			border-bottom: 2px solid #da106e;
-		}
-
-		.error-line {
-			background-color: rgba(200, 0, 0, 0.05);
-		}
-
-		.cm-tooltip {
-			border: none;
-			background: var(--sk-back-3);
-			font-family: var(--sk-font);
-			max-width: calc(100vw - 10em);
-			position: relative;
-			filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.1));
-		}
-
-		.cm-tooltip-section {
-			position: relative;
-			padding: 0.5em;
-			left: -13px;
-			background: var(--bg);
-			border-radius: 2px;
-			max-width: 64em;
-		}
-
-		.cm-tooltip-section::before {
-			content: '';
-			position: absolute;
-			left: 10px;
-			width: 8px;
-			height: 8px;
-			transform: rotate(45deg);
-			background-color: var(--bg);
-			border-radius: 2px;
-		}
-
-		.cm-tooltip-below .cm-tooltip-section {
-			top: 10px;
-		}
-
-		.cm-tooltip-above .cm-tooltip-section {
-			bottom: 10px;
-		}
-
-		.cm-tooltip-below .cm-tooltip-section::before {
-			top: -4px;
-		}
-
-		.cm-tooltip-above .cm-tooltip-section::before {
-			bottom: -4px;
-		}
-
-		.cm-tooltip:has(.cm-diagnostic) {
-			background: transparent;
-		}
-
-		.cm-tooltip:has(.cm-diagnostic-warning) {
-			--bg: var(--warning);
-			--fg: #222;
-		}
-
-		.cm-tooltip:has(.cm-diagnostic-error) {
-			--bg: var(--error);
-			--fg: #222;
-		}
-
-		.cm-diagnostic {
-			padding: 0.2em 0.4em;
-			position: relative;
-			border: none;
-			border-radius: 2px;
-		}
-
-		.cm-diagnostic:not(:last-child) {
-			border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-		}
-
-		.cm-diagnostic-error {
-			border: none;
-			filter: drop-shadow(0px 0px 6px var(--error-bg));
-		}
-
-		.cm-diagnostic :not(code) {
-			font-family: var(--sk-font);
-		}
-
-		.cm-diagnosticText {
-			color: var(--fg);
-			position: relative;
-			z-index: 2;
-		}
-
-		.cm-diagnosticText code {
-			color: inherit;
-			background-color: rgba(0, 0, 0, 0.05);
-			border-radius: 2px;
-			top: 0;
-			padding: 0.2em;
-			font-size: 0.9em;
-		}
-
-		.cm-diagnosticText strong {
-			font-size: 0.9em;
-			/* font-weight: 700; */
-			font-family: var(--sk-font-mono);
-			opacity: 0.7;
-		}
-	}
-
-	pre {
-		position: absolute;
-		width: 100%;
-		height: 100%;
-		top: 0;
-		left: 0;
-		border: none;
-		padding: 4px 4px 4px 60px;
-		resize: none;
-		font-family: var(--sk-font-mono);
-		font-size: 13px;
-		line-height: 1.7;
-		user-select: none;
-		pointer-events: none;
-		color: #ccc;
-		tab-size: 2;
-		-moz-tab-size: 2;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Input/ComponentSelector.svelte b/sites/svelte-5-preview/src/lib/Input/ComponentSelector.svelte
deleted file mode 100644
index 7b95008712b0..000000000000
--- a/sites/svelte-5-preview/src/lib/Input/ComponentSelector.svelte
+++ /dev/null
@@ -1,462 +0,0 @@
-<script>
-	import { get_repl_context } from '$lib/context.js';
-	import { get_full_filename } from '$lib/utils.js';
-	import { createEventDispatcher, tick } from 'svelte';
-	import RunesInfo from './RunesInfo.svelte';
-	import Migrate from './Migrate.svelte';
-
-	/** @type {boolean}  */
-	export let show_modified;
-
-	/** @type {boolean} */
-	export let runes;
-
-	/** @type {ReturnType<typeof createEventDispatcher<{
-	 * remove: { files: import('$lib/types').File[]; diff: import('$lib/types').File },
-	 * add: { files: import('$lib/types').File[]; diff: import('$lib/types').File },
-	 * }>>} */
-	const dispatch = createEventDispatcher();
-
-	const {
-		files,
-		handle_select,
-		module_editor,
-		rebundle,
-		selected,
-		selected_name,
-		EDITOR_STATE_MAP
-	} = get_repl_context();
-
-	/** @type {string | null} */
-	let editing_name = null;
-
-	let input_value = '';
-
-	/** @param {string} filename */
-	function select_file(filename) {
-		if ($selected_name !== filename) {
-			editing_name = null;
-			handle_select(filename);
-		}
-	}
-
-	/** @param {import('$lib/types').File} file */
-	function edit_tab(file) {
-		if ($selected_name === get_full_filename(file)) {
-			editing_name = get_full_filename(file);
-			input_value = file.name;
-		}
-	}
-
-	async function close_edit() {
-		const match = /(.+)\.(svelte|js|json|md|css)$/.exec(input_value ?? '');
-
-		const edited_file = $files.find((val) => get_full_filename(val) === editing_name);
-
-		if (!edited_file) return;
-
-		edited_file.name = match ? match[1] : input_value;
-
-		if (!$selected) return;
-
-		if (is_file_name_used($selected)) {
-			let i = 1;
-			let name = $selected.name;
-
-			do {
-				const file = $files.find(
-					(val) =>
-						get_full_filename(val) === get_full_filename(edited_file) &&
-						// @ts-ignore
-						val.source === $selected.source
-				);
-
-				if (!file) break;
-
-				file.name = `${name}_${i++}`;
-			} while (is_file_name_used($selected));
-
-			const idx = $files.findIndex(
-				(val) => get_full_filename(val) === get_full_filename(edited_file)
-			);
-			$files[idx] = edited_file;
-		}
-
-		const idx = $files.findIndex(
-			(val) => get_full_filename(val) === get_full_filename(edited_file)
-		);
-		if (match?.[2]) $files[idx].type = match[2];
-
-		if (editing_name) {
-			const old_state = EDITOR_STATE_MAP.get(editing_name);
-			if (old_state) {
-				EDITOR_STATE_MAP.set(get_full_filename(edited_file), old_state);
-				EDITOR_STATE_MAP.delete(editing_name);
-			}
-		}
-
-		editing_name = null;
-
-		// re-select, in case the type changed
-		handle_select(get_full_filename(edited_file));
-
-		$files = $files;
-
-		// focus the editor, but wait a beat (so key events aren't misdirected)
-		await tick();
-
-		$module_editor?.focus();
-
-		rebundle();
-	}
-
-	/**
-	 * @param {string} filename
-	 */
-	function remove(filename) {
-		const file = $files.find((val) => get_full_filename(val) === filename);
-		const idx = $files.findIndex((val) => get_full_filename(val) === filename);
-
-		if (!file) return;
-
-		let result = confirm(`Are you sure you want to delete ${get_full_filename(file)}?`);
-
-		if (!result) return;
-
-		$files = $files.filter((file) => get_full_filename(file) !== filename);
-
-		dispatch('remove', { files: $files, diff: file });
-
-		EDITOR_STATE_MAP.delete(get_full_filename(file));
-
-		$selected_name = idx === 1 ? 'App.svelte' : get_full_filename(file);
-		handle_select($selected_name);
-	}
-
-	/** @param {FocusEvent & { currentTarget: HTMLInputElement }} event */
-	async function select_input(event) {
-		await tick();
-
-		event.currentTarget.select();
-	}
-
-	let uid = 1;
-
-	function add_new() {
-		const file = {
-			name: uid++ ? `Component${uid}` : 'Component1',
-			type: 'svelte',
-			source: '',
-			modified: true
-		};
-
-		$files = $files.concat(file);
-
-		editing_name = get_full_filename(file);
-
-		input_value = file.name;
-
-		handle_select(editing_name);
-
-		rebundle();
-
-		dispatch('add', { files: $files, diff: file });
-
-		$files = $files;
-	}
-
-	/** @param {import('$lib/types').File} editing */
-	function is_file_name_used(editing) {
-		return $files.find(
-			(file) => JSON.stringify(file) !== JSON.stringify($selected) && file.name === editing.name
-		);
-	}
-
-	// drag and drop
-	/** @type {string | null} */
-	let from = null;
-
-	/** @type {string | null} */
-	let over = null;
-
-	/** @param {DragEvent & { currentTarget: HTMLDivElement }} event */
-	function dragStart(event) {
-		from = event.currentTarget.id;
-	}
-
-	function dragLeave() {
-		over = null;
-	}
-
-	/** @param {DragEvent & { currentTarget: HTMLDivElement }} event */
-	function dragOver(event) {
-		over = event.currentTarget.id;
-	}
-
-	function dragEnd() {
-		if (from && over) {
-			const from_index = $files.findIndex((file) => file.name === from);
-			const to_index = $files.findIndex((file) => file.name === over);
-
-			const from_component = $files[from_index];
-
-			$files.splice(from_index, 1);
-
-			$files = $files.slice(0, to_index).concat(from_component).concat($files.slice(to_index));
-		}
-
-		from = over = null;
-	}
-</script>
-
-<div class="component-selector">
-	<!-- svelte-ignore a11y-no-static-element-interactions -->
-	<div class="file-tabs" on:dblclick={add_new}>
-		{#each $files as file, index (file.name)}
-			{@const filename = get_full_filename(file)}
-			<div
-				id={file.name}
-				class="button"
-				role="button"
-				tabindex="0"
-				class:active={filename === $selected_name}
-				class:draggable={filename !== editing_name && index !== 0}
-				class:drag-over={over === file.name}
-				on:click={() => select_file(filename)}
-				on:keyup={(e) => e.key === ' ' && select_file(filename)}
-				on:dblclick|stopPropagation={() => {}}
-				draggable={filename !== editing_name}
-				on:dragstart={dragStart}
-				on:dragover|preventDefault={dragOver}
-				on:dragleave={dragLeave}
-				on:drop|preventDefault={dragEnd}
-			>
-				<i class="drag-handle"></i>
-				{#if file.name === 'App' && filename !== editing_name}
-					<div class="uneditable">
-						App.svelte{#if show_modified && file.modified}*{/if}
-					</div>
-				{:else if filename === editing_name}
-					{@const editing_file = $files.find((file) => get_full_filename(file) === editing_name)}
-
-					{#if editing_file}
-						<span class="input-sizer">
-							{input_value + (/\./.test(input_value) ? '' : `.${editing_file.type}`)}
-						</span>
-
-						<!-- svelte-ignore a11y-autofocus -->
-						<input
-							autofocus
-							spellcheck={false}
-							bind:value={input_value}
-							on:focus={select_input}
-							on:blur={close_edit}
-							on:keydown={(e) => {
-								if (e.key === 'Enter') {
-									e.preventDefault();
-									if (!is_file_name_used(editing_file)) {
-										e.currentTarget.blur();
-									}
-								}
-							}}
-							class:duplicate={is_file_name_used(editing_file)}
-						/>
-					{/if}
-				{:else}
-					<!-- svelte-ignore a11y-no-static-element-interactions -->
-					<div
-						class="editable"
-						title="edit component name"
-						on:click={() => edit_tab(file)}
-						on:keyup={(e) => e.key === ' ' && edit_tab(file)}
-					>
-						{file.name}.{file.type}{#if show_modified && file.modified}*{/if}
-					</div>
-
-					<!-- svelte-ignore a11y-no-static-element-interactions -->
-					<span
-						class="remove"
-						on:click={() => remove(filename)}
-						on:keyup={(e) => e.key === ' ' && remove(filename)}
-					>
-						<svg width="12" height="12" viewBox="0 0 24 24">
-							<line stroke="#999" x1="18" y1="6" x2="6" y2="18" />
-							<line stroke="#999" x1="6" y1="6" x2="18" y2="18" />
-						</svg>
-					</span>
-				{/if}
-			</div>
-		{/each}
-	</div>
-
-	<button class="add-new" on:click={add_new} title="add new component">
-		<svg width="12" height="12" viewBox="0 0 24 24">
-			<line stroke="#999" x1="12" y1="5" x2="12" y2="19" />
-			<line stroke="#999" x1="5" y1="12" x2="19" y2="12" />
-		</svg>
-	</button>
-
-	<div class="runes-info"><RunesInfo {runes} /></div>
-
-	<div class="migrate-info"><Migrate /></div>
-</div>
-
-<style>
-	.component-selector {
-		position: relative;
-		border-bottom: 1px solid var(--sk-text-4);
-		/* overflow: hidden; */
-		display: flex;
-	}
-
-	.file-tabs {
-		border: none;
-		margin: 0;
-		white-space: nowrap;
-		overflow-x: auto;
-		overflow-y: hidden;
-	}
-
-	.file-tabs .button,
-	.add-new {
-		position: relative;
-		display: inline-block;
-		font: 400 12px/1.5 var(--sk-font);
-		background: var(--sk-back-1);
-		border: none;
-		border-bottom: 3px solid transparent;
-		padding: 12px 14px 8px 16px;
-		margin: 0;
-		color: var(--sk-text-3);
-		border-radius: 0;
-		cursor: pointer;
-	}
-
-	.file-tabs .button.active {
-		/* color: var(--second); */
-		color: var(--sk-text-2, #333);
-		border-bottom: 3px solid var(--sk-theme-1);
-	}
-
-	.editable,
-	.uneditable,
-	.input-sizer,
-	input {
-		display: inline-block;
-		position: relative;
-		line-height: 1;
-	}
-
-	.input-sizer {
-		color: var(--sk-text-3, #ccc);
-	}
-
-	input {
-		position: absolute;
-		width: 100%;
-		left: 16px;
-		top: 12px;
-		font: 400 12px/1.5 var(--sk-font);
-		border: none;
-		color: var(--sk-theme-3);
-		outline: none;
-		background-color: transparent;
-	}
-
-	.duplicate {
-		color: var(--sk-theme-1);
-	}
-
-	.remove {
-		position: absolute;
-		display: none;
-		right: 1px;
-		top: 4px;
-		width: 16px;
-		text-align: right;
-		padding: 12px 0 12px 5px;
-		font-size: 8px;
-		cursor: pointer;
-	}
-
-	.remove:hover {
-		color: var(--sk-theme-3);
-	}
-
-	.file-tabs .button.active .editable {
-		cursor: text;
-	}
-
-	.file-tabs .button.active .remove {
-		display: block;
-	}
-
-	.file-tabs .button.drag-over {
-		background: #67677814;
-	}
-
-	.file-tabs .button.drag-over {
-		cursor: move;
-	}
-
-	.add-new {
-		padding: 12px 10px 8px 8px;
-		height: 40px;
-		text-align: center;
-	}
-
-	.add-new:hover {
-		color: var(--sk-theme-3) !important;
-	}
-
-	.runes-info {
-		flex: 1;
-		display: flex;
-		align-items: center;
-		justify-content: flex-end;
-	}
-
-	.migrate-info {
-		flex: 0 1 0;
-		display: flex;
-		align-items: center;
-		justify-content: flex-end;
-	}
-
-	.drag-handle {
-		cursor: move;
-		width: 5px;
-		height: 25px;
-		position: absolute;
-		left: 5px;
-		top: 9px;
-		--drag-handle-color: #dedede;
-		background: linear-gradient(
-			to right,
-			var(--sk-back-4, --drag-handle-color) 1px,
-			var(--sk-back-1, white) 1px,
-			var(--sk-back-1, white) 2px,
-			var(--sk-back-4, --drag-handle-color) 2px,
-			var(--sk-back-4, --drag-handle-color) 3px,
-			var(--sk-back-1, white) 3px,
-			var(--sk-back-1, white) 4px,
-			var(--sk-back-4, --drag-handle-color) 4px
-		);
-	}
-
-	svg {
-		position: relative;
-		overflow: hidden;
-		vertical-align: middle;
-		-o-object-fit: contain;
-		object-fit: contain;
-		-webkit-transform-origin: center center;
-		transform-origin: center center;
-
-		stroke: currentColor;
-		stroke-width: 2;
-		stroke-linecap: round;
-		stroke-linejoin: round;
-		fill: none;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Input/Migrate.svelte b/sites/svelte-5-preview/src/lib/Input/Migrate.svelte
deleted file mode 100644
index e268f3838ea6..000000000000
--- a/sites/svelte-5-preview/src/lib/Input/Migrate.svelte
+++ /dev/null
@@ -1,22 +0,0 @@
-<script>
-	import { get_repl_context } from '$lib/context.js';
-
-	const { migrate } = get_repl_context();
-</script>
-
-<div class="container">
-	<button on:click={migrate} title="Migrate this component towards the new syntax">migrate</button>
-</div>
-
-<style>
-	button {
-		position: relative;
-		display: flex;
-		text-transform: uppercase;
-		font-size: 1.4rem;
-		padding: 0.8rem;
-		gap: 0.5rem;
-		margin-right: 0.3rem;
-		z-index: 9999;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Input/ModuleEditor.svelte b/sites/svelte-5-preview/src/lib/Input/ModuleEditor.svelte
deleted file mode 100644
index d047d106371d..000000000000
--- a/sites/svelte-5-preview/src/lib/Input/ModuleEditor.svelte
+++ /dev/null
@@ -1,90 +0,0 @@
-<script>
-	import { get_repl_context } from '$lib/context.js';
-	import CodeMirror from '../CodeMirror.svelte';
-
-	/** @type {boolean} */
-	export let autocomplete;
-
-	/** @type {any} */ // TODO
-	export let error;
-
-	/** @type {any[]} */ // TODO
-	export let warnings;
-
-	export function focus() {
-		$module_editor?.focus();
-	}
-
-	const { handle_change, module_editor } = get_repl_context();
-</script>
-
-<div class="editor-wrapper">
-	<div class="editor notranslate" translate="no">
-		<CodeMirror
-			bind:this={$module_editor}
-			diagnostics={() => {
-				if (error) {
-					return [
-						{
-							severity: 'error',
-							from: error.position[0],
-							to: error.position[1],
-							message: error.message,
-							renderMessage: () => {
-								// TODO expose error codes, so we can link to docs in future
-								const span = document.createElement('span');
-								span.innerHTML = `${error.message
-									.replace(/&/g, '&amp;')
-									.replace(/</g, '&lt;')
-									.replace(/`(.+?)`/g, `<code>$1</code>`)}`;
-								return span;
-							}
-						}
-					];
-				}
-
-				if (warnings) {
-					return warnings.map((warning) => ({
-						severity: 'warning',
-						from: warning.start.character,
-						to: warning.end.character,
-						message: warning.message,
-						renderMessage: () => {
-							const span = document.createElement('span');
-							span.innerHTML = `${warning.message
-								.replace(/&/g, '&amp;')
-								.replace(/</g, '&lt;')
-								.replace(/`(.+?)`/g, `<code>$1</code>`)} <strong>(${warning.code})</strong>`;
-							return span;
-						}
-					}));
-				}
-
-				return [];
-			}}
-			on:change={handle_change}
-		/>
-	</div>
-</div>
-
-<style>
-	.editor-wrapper {
-		z-index: 5;
-		background: var(--sk-back-3);
-		display: flex;
-		flex-direction: column;
-		position: relative;
-	}
-
-	.editor {
-		height: 0;
-		flex: 1 1 auto;
-	}
-
-	:global(.columns) .editor-wrapper {
-		/* make it easier to interact with scrollbar */
-		padding-right: 8px;
-		height: auto;
-		height: 100%;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Input/RunesInfo.svelte b/sites/svelte-5-preview/src/lib/Input/RunesInfo.svelte
deleted file mode 100644
index 7c31ce8c2c9f..000000000000
--- a/sites/svelte-5-preview/src/lib/Input/RunesInfo.svelte
+++ /dev/null
@@ -1,149 +0,0 @@
-<script>
-	import { get_repl_context } from '$lib/context.js';
-
-	/** @type {boolean} */
-	export let runes;
-
-	let open = false;
-
-	const { selected_name } = get_repl_context();
-</script>
-
-<svelte:window
-	on:keydown={(e) => {
-		if (e.key === 'Escape') open = false;
-	}}
-/>
-
-<div class="container">
-	<button class:active={runes} class:open on:click={() => (open = !open)}>
-		<svg viewBox="0 0 24 24">
-			<path d="M9.4,1H19l-5.9,7.7h8L8.3,23L11,12.6H3.5L9.4,1z" />
-		</svg>
-
-		runes
-	</button>
-
-	{#if open}
-		<!-- svelte-ignore a11y_click_events_have_key_events a11y_no_static_element_interactions
-			(This is taken care of by the <svelte:window> above) -->
-		<div class="modal-backdrop" on:click={() => (open = false)}></div>
-		<div class="popup">
-			{#if $selected_name.endsWith('.svelte.js')}
-				<p>
-					Files with a <code>.svelte.js</code> extension are always in
-					<a href="https://svelte.dev/blog/runes">runes mode</a>.
-				</p>
-			{:else if $selected_name.endsWith('.js')}
-				<p>
-					To use <a href="https://svelte.dev/blog/runes">runes</a> in a JavaScript file, change the
-					extension to <code>.svelte.js</code>.
-				</p>
-			{:else if $selected_name.endsWith('.svelte')}
-				{#if runes}
-					<p>
-						This component is in
-						<a href="https://svelte.dev/blog/runes">runes mode</a>.
-					</p>
-					<p>To disable runes mode, add the following to the top of your component:</p>
-					<pre><code>&lt;svelte:options runes={'{false}'} /&gt;</code></pre>
-				{:else}
-					<p>This component is not in <a href="https://svelte.dev/blog/runes">runes mode</a>.</p>
-					<p>
-						To enable runes mode, either start using runes in your code, or add the following to the
-						top of your component:
-					</p>
-					<pre><code>&lt;svelte:options runes /&gt;</code></pre>
-				{/if}
-			{:else}
-				<p>
-					Edit a <code>.svelte</code>, <code>.svelte.js</code> or <code>.js</code> file to see
-					information on <a href="https://svelte.dev/blog/runes">runes mode</a>
-				</p>
-			{/if}
-		</div>
-	{/if}
-</div>
-
-<style>
-	button {
-		position: relative;
-		display: flex;
-		text-transform: uppercase;
-		font-size: 1.4rem;
-		padding: 0.8rem;
-		gap: 0.5rem;
-		margin-right: 0.3rem;
-		z-index: 9999;
-	}
-
-	button.open {
-		background: var(--sk-back-3);
-	}
-
-	svg {
-		width: 1.6rem !important;
-		height: 1.6rem !important;
-		top: 0.05rem;
-	}
-
-	path {
-		stroke: #ccc;
-		fill: transparent;
-		transition:
-			stroke 0.2s,
-			fill 0.2s;
-	}
-
-	.active svg {
-		animation: bump 0.4s;
-	}
-
-	.active path {
-		stroke: #ff3e00;
-		fill: #ff3e00;
-	}
-
-	@keyframes bump {
-		0% {
-			transform: scale(1);
-		}
-		50% {
-			transform: scale(1.3);
-		}
-		100% {
-			transform: scale(1);
-		}
-	}
-
-	.modal-backdrop {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100vw;
-		height: 100vh;
-		background: var(--sk-back-1);
-		opacity: 0.7;
-		backdrop-filter: blur(5px);
-		z-index: 9998;
-	}
-
-	.popup {
-		position: absolute;
-		top: 2.2em;
-		right: 0;
-		width: 100vw;
-		max-width: 320px;
-		z-index: 9999;
-		background: var(--sk-back-3);
-		padding: 1em;
-	}
-
-	.popup p:first-child {
-		margin-top: 0;
-	}
-
-	.popup p:last-child {
-		margin-bottom: 0;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/InputOutputToggle.svelte b/sites/svelte-5-preview/src/lib/InputOutputToggle.svelte
deleted file mode 100644
index db6fd958023d..000000000000
--- a/sites/svelte-5-preview/src/lib/InputOutputToggle.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script>
-	export let checked = false;
-
-	import Checkbox from './Checkbox.svelte';
-</script>
-
-<!-- svelte-ignore a11y-label-has-associated-control -->
-<label class="input-output-toggle">
-	<span class:active={!checked} style="text-align: right">input</span>
-	<span style="display:grid; place-items: center">
-		<Checkbox bind:checked />
-	</span>
-	<span class:active={checked}>output</span>
-</label>
-
-<style>
-	.input-output-toggle {
-		position: relative;
-		display: grid;
-		user-select: none;
-		flex: 0;
-		grid-template-columns: 1fr 40px 1fr;
-		grid-gap: 0.5em;
-		align-items: center;
-		justify-content: center;
-		width: 100%;
-		height: 42px;
-		border-top: 1px solid var(--sk-theme-2);
-		z-index: 2;
-	}
-
-	span {
-		color: var(--sk-text-4);
-	}
-
-	.active {
-		color: var(--sk-text-2);
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Message.svelte b/sites/svelte-5-preview/src/lib/Message.svelte
deleted file mode 100644
index 55412f40eb63..000000000000
--- a/sites/svelte-5-preview/src/lib/Message.svelte
+++ /dev/null
@@ -1,104 +0,0 @@
-<script>
-	import { slide } from 'svelte/transition';
-	import { get_repl_context } from './context.js';
-
-	/** @type {'info' | 'warning' | 'error'} */
-	export let kind = 'info';
-
-	/** @type {import('./types').MessageDetails | undefined} */
-	export let details = undefined;
-
-	/** @type {string | undefined} */
-	export let filename = undefined;
-
-	export let truncate = false;
-
-	const { go_to_warning_pos } = get_repl_context();
-
-	/** @param {import('./types').MessageDetails} details */
-	function message(details) {
-		let str = details.message || '[missing message]';
-
-		let loc = [];
-
-		if (details.filename && details.filename !== filename) loc.push(details.filename);
-
-		if (details.start) loc.push(details.start.line, details.start.column);
-
-		return str + (loc.length ? ` (${loc.join(':')})` : ``);
-	}
-</script>
-
-<div transition:slide={{ duration: 100 }} class="message {kind}" class:truncate>
-	{#if details}
-		<button
-			class:navigable={details.filename}
-			on:click={() => go_to_warning_pos(details)}
-			on:keyup={(e) => e.key === ' ' && go_to_warning_pos(details)}
-		>
-			{message(details)}
-		</button>
-	{:else}
-		<slot />
-	{/if}
-</div>
-
-<style>
-	button {
-		white-space: pre;
-	}
-
-	.message {
-		position: relative;
-		color: white;
-		padding: 12px 16px 12px 44px;
-		font: 400 12px/1.7 var(--sk-font);
-		margin: 0;
-		border-top: 1px solid white;
-	}
-
-	.navigable {
-		cursor: pointer;
-	}
-
-	.message::before {
-		content: '!';
-		position: absolute;
-		left: 12px;
-		top: 10px;
-		text-align: center;
-		line-height: 1;
-		padding: 4px;
-		border-radius: 50%;
-		color: white;
-		border: 2px solid white;
-		box-sizing: content-box;
-		width: 10px;
-		height: 10px;
-		font-size: 11px;
-		font-weight: 700;
-	}
-
-	.truncate {
-		white-space: pre;
-		overflow-x: hidden;
-		text-overflow: ellipsis;
-	}
-
-	button {
-		margin: 0;
-		text-align: start;
-	}
-
-	.error {
-		background-color: #da106e;
-	}
-
-	.warning {
-		background-color: #e47e0a;
-	}
-
-	.info {
-		background-color: var(--sk-theme-2);
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/AstNode.svelte b/sites/svelte-5-preview/src/lib/Output/AstNode.svelte
deleted file mode 100644
index f99f21494c80..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/AstNode.svelte
+++ /dev/null
@@ -1,161 +0,0 @@
-<script>
-	import { get_repl_context } from '$lib/context.js';
-	import { tick } from 'svelte';
-
-	export let key = '';
-	/** @type {import('svelte/types/compiler/interfaces').Ast} */
-	export let value;
-	export let collapsed = true;
-	/** @type {import('svelte/types/compiler/interfaces').Ast[]} */
-	export let path_nodes = [];
-	export let autoscroll = true;
-
-	const { module_editor, toggleable } = get_repl_context();
-
-	/** @type {HTMLLIElement} */
-	let list_item_el;
-
-	$: is_root = path_nodes[0] === value;
-	$: is_leaf = path_nodes[path_nodes.length - 1] === value;
-	$: is_ast_array = Array.isArray(value);
-	$: is_collapsable = value && typeof value === 'object';
-	$: is_markable =
-		is_collapsable &&
-		'start' in value &&
-		'end' in value &&
-		typeof value.start === 'number' &&
-		typeof value.end === 'number';
-	$: key_text = key ? `${key}:` : '';
-
-	let preview_text = '';
-	$: {
-		if (!is_collapsable || !collapsed) break $;
-
-		if (is_ast_array) {
-			if (!('length' in value)) break $;
-
-			preview_text = `[ ${value.length} element${value.length === 1 ? '' : 's'} ]`;
-		} else {
-			preview_text = `{ ${Object.keys(value).join(', ')} }`;
-		}
-	}
-
-	$: collapsed = !path_nodes.includes(value);
-
-	$: if (autoscroll && is_leaf && !$toggleable) {
-		// wait for all nodes to render before scroll
-		tick().then(() => {
-			if (list_item_el) {
-				list_item_el.scrollIntoView();
-			}
-		});
-	}
-
-	/** @param {MouseEvent | FocusEvent} e */
-	function handle_mark_text(e) {
-		if (is_markable) {
-			e.stopPropagation();
-
-			if (
-				'start' in value &&
-				'end' in value &&
-				typeof value.start === 'number' &&
-				typeof value.end === 'number'
-			) {
-				$module_editor?.markText({ from: value.start ?? 0, to: value.end ?? 0 });
-			}
-		}
-	}
-
-	/** @param {MouseEvent} e */
-	function handle_unmark_text(e) {
-		if (is_markable) {
-			e.stopPropagation();
-			$module_editor?.unmarkText();
-		}
-	}
-</script>
-
-<li
-	bind:this={list_item_el}
-	class:marked={!is_root && is_leaf}
-	on:mouseover={handle_mark_text}
-	on:focus={handle_mark_text}
-	on:mouseleave={handle_unmark_text}
->
-	{#if !is_root && is_collapsable}
-		<button class="ast-toggle" class:open={!collapsed} on:click={() => (collapsed = !collapsed)}>
-			{key_text}
-		</button>
-	{:else if key_text}
-		<span>{key_text}</span>
-	{/if}
-	{#if is_collapsable}
-		{#if collapsed && !is_root}
-			<button class="preview" on:click={() => (collapsed = !collapsed)}>
-				{preview_text}
-			</button>
-		{:else}
-			<span>{is_ast_array ? '[' : '{'}</span>
-			<ul>
-				{#each Object.entries(value) as [k, v]}
-					<svelte:self key={is_ast_array ? '' : k} value={v} {path_nodes} {autoscroll} />
-				{/each}
-			</ul>
-			<span>{is_ast_array ? ']' : '}'}</span>
-		{/if}
-	{:else}
-		<span class="token {typeof value}">
-			{JSON.stringify(value)}
-		</span>
-	{/if}
-</li>
-
-<style>
-	ul {
-		padding: 0 0 0 2ch;
-		margin: 0;
-		list-style-type: none;
-	}
-
-	.marked {
-		background-color: var(--sk-highlight-color);
-	}
-
-	.preview {
-		opacity: 0.8;
-		font-style: italic;
-	}
-
-	button:hover {
-		text-decoration: underline;
-	}
-
-	.ast-toggle {
-		position: relative;
-	}
-
-	.ast-toggle::before {
-		content: '\25B6';
-		position: absolute;
-		bottom: 0;
-		left: -1.3rem;
-		opacity: 0.7;
-	}
-
-	.ast-toggle.open::before {
-		content: '\25BC';
-	}
-
-	.token {
-		color: var(--sk-code-base);
-	}
-
-	.token.string {
-		color: var(--sk-code-string);
-	}
-
-	.token.number {
-		color: var(--sk-code-number);
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/AstView.svelte b/sites/svelte-5-preview/src/lib/Output/AstView.svelte
deleted file mode 100644
index 0db97578c15c..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/AstView.svelte
+++ /dev/null
@@ -1,105 +0,0 @@
-<script>
-	import Message from '../Message.svelte';
-	import AstNode from './AstNode.svelte';
-	import { cursorIndex } from '../CodeMirror.svelte';
-
-	/** @type {import('svelte/types/compiler/interfaces').Ast} */
-	export let ast;
-	export let autoscroll = true;
-
-	// $cursor_index may go over the max since ast computation is usually slower.
-	// clamping this helps prevent the collapse view flashing
-	$: max_cursor_index = !ast ? $cursorIndex : Math.min($cursorIndex, get_ast_max_end(ast));
-
-	$: path_nodes = find_deepest_path(max_cursor_index, [ast]) || [];
-
-	/**
-	 * @param {number} cursor
-	 * @param {import('svelte/types/compiler/interfaces').Ast[]} paths
-	 * @returns {import('svelte/types/compiler/interfaces').Ast[] | undefined}
-	 */
-	function find_deepest_path(cursor, paths) {
-		const value = paths[paths.length - 1];
-
-		if (!value) return;
-
-		for (const v of Object.values(value)) {
-			if (typeof v === 'object') {
-				const result = find_deepest_path(cursor, paths.concat([v]));
-				if (result) return result;
-			}
-		}
-
-		if (
-			'start' in value &&
-			'end' in value &&
-			typeof value.start === 'number' &&
-			typeof value.end === 'number' &&
-			value.start <= cursor &&
-			cursor <= value.end
-		) {
-			return paths;
-		}
-	}
-
-	/** @param {import('svelte/types/compiler/interfaces').Ast} ast */
-	function get_ast_max_end(ast) {
-		let max_end = 0;
-
-		for (const node of Object.values(ast)) {
-			if (node && typeof node.end === 'number' && node.end > max_end) {
-				max_end = node.end;
-			}
-		}
-
-		return max_end;
-	}
-</script>
-
-<div class="ast-view">
-	<pre>
-		<code>
-			{#if typeof ast === 'object'}
-				<ul>
-					<AstNode value={ast} {path_nodes} {autoscroll} collapsed={false} />
-				</ul>
-			{:else}
-				<p>No AST available</p>
-			{/if}
-		</code>
-	</pre>
-	<Message kind="info">The AST is not public API and may change at any point in time</Message>
-</div>
-
-<style>
-	.ast-view {
-		--base: hsl(45, 7%, 45%);
-		--string: hsl(41, 37%, 45%);
-		--number: hsl(102, 27%, 50%);
-		background: var(--sk-back-3);
-		color: var(--sk-code-base);
-		display: flex;
-		flex-direction: column;
-	}
-
-	.ast-view,
-	pre,
-	code {
-		height: 100%;
-		block-size: 100%;
-		font: 400 var(--sk-text-xs) / 1.7 var(--sk-font-mono);
-	}
-
-	pre {
-		white-space: normal;
-		padding: 1rem;
-		tab-size: 2;
-		-moz-tab-size: 2;
-	}
-
-	ul {
-		padding: 0;
-		margin: 0;
-		list-style-type: none;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/Compiler.js b/sites/svelte-5-preview/src/lib/Output/Compiler.js
deleted file mode 100644
index 94484ecf3951..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/Compiler.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import Worker from '../workers/compiler/index.js?worker';
-
-const workers = new Map();
-
-let uid = 1;
-
-export default class Compiler {
-	/** @type {Worker} */
-	worker;
-
-	/** @type {Map<number, (...arg: any) => void>} */
-	handlers = new Map();
-
-	/** @param {string} svelte_url */
-	constructor(svelte_url) {
-		if (!workers.has(svelte_url)) {
-			const worker = new Worker();
-			worker.postMessage({ type: 'init', svelte_url });
-			workers.set(svelte_url, worker);
-		}
-
-		this.worker = workers.get(svelte_url);
-
-		this.worker.addEventListener(
-			'message',
-			/**
-			 * @param {MessageEvent<import('$lib/workers/workers').CompileMessageData>} event
-			 */
-			(event) => {
-				const handler = this.handlers.get(event.data.id);
-
-				if (handler) {
-					// if no handler, was meant for a different REPL
-					handler(event.data);
-					this.handlers.delete(event.data.id);
-				}
-			}
-		);
-	}
-
-	/**
-	 * @param {import('$lib/types').File} file
-	 * @param {import('svelte/compiler').CompileOptions} options
-	 * @param {boolean} return_ast
-	 * @returns {Promise<import('$lib/workers/workers').CompileMessageData>}
-	 */
-	compile(file, options, return_ast) {
-		return new Promise((fulfil) => {
-			const id = uid++;
-
-			this.handlers.set(id, fulfil);
-
-			this.worker.postMessage({
-				id,
-				type: 'compile',
-				source: file.source,
-				options: Object.assign(
-					{
-						name: file.name,
-						filename: `${file.name}.${file.type}`
-					},
-					options
-				),
-				entry: file.name === 'App',
-				return_ast
-			});
-		});
-	}
-
-	/**
-	 * @param {import('$lib/types').File} file
-	 * @returns {Promise<import('$lib/workers/workers').MigrateMessageData>}
-	 */
-	migrate(file) {
-		return new Promise((fulfil) => {
-			const id = uid++;
-
-			this.handlers.set(id, fulfil);
-
-			this.worker.postMessage({
-				id,
-				type: 'migrate',
-				source: file.source,
-				filename: `${file.name}.${file.type}`
-			});
-		});
-	}
-
-	destroy() {
-		this.worker.terminate();
-	}
-}
diff --git a/sites/svelte-5-preview/src/lib/Output/CompilerOptions.svelte b/sites/svelte-5-preview/src/lib/Output/CompilerOptions.svelte
deleted file mode 100644
index 426e5044a7d2..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/CompilerOptions.svelte
+++ /dev/null
@@ -1,157 +0,0 @@
-<!-- svelte-ignore a11y-label-has-associated-control -->
-<script>
-	import { get_repl_context } from '$lib/context.js';
-	import Checkbox from '../Checkbox.svelte';
-
-	const { compile_options } = get_repl_context();
-</script>
-
-<div class="options">
-	result = svelte.compile(source, &#123;
-	<div class="option">
-		<span class="key">generate:</span>
-
-		<input id="client" type="radio" bind:group={$compile_options.generate} value="client" />
-		<label for="client"><span class="string">"client"</span></label>
-
-		<input id="server" type="radio" bind:group={$compile_options.generate} value="server" />
-		<label for="server"><span class="string">"server"</span>,</label>
-	</div>
-
-	<div class="option">
-		<span class="key">css:</span>
-
-		<input id="injected" type="radio" bind:group={$compile_options.css} value="injected" />
-		<label for="injected"><span class="string">"injected"</span></label>
-
-		<input id="external" type="radio" bind:group={$compile_options.css} value="external" />
-		<label for="external"><span class="string">"external"</span>,</label>
-	</div>
-
-	<label class="option">
-		<span class="key">dev:</span>
-		<Checkbox bind:checked={$compile_options.dev} />
-		<span class="boolean">{$compile_options.dev}</span>,
-	</label>
-
-	<label class="option">
-		<span class="key">hmr:</span>
-		<Checkbox bind:checked={$compile_options.hmr} />
-		<span class="boolean">{$compile_options.hmr}</span>,
-	</label>
-	});
-</div>
-
-<div class="note">
-	<p>
-		note: these options affect the JS output tab, but not the bundle that executes in the Result
-		tab.
-	</p>
-</div>
-
-<style>
-	.options {
-		padding: 0 10px;
-		font-family: var(--sk-font-mono);
-		font-size: 13px;
-		color: var(--sk-text-2, #999);
-		line-height: 1.8;
-	}
-
-	.option {
-		display: block;
-		padding: 0 0 0 1.25em;
-		white-space: nowrap;
-		color: var(--sk-text-3, #999);
-		user-select: none;
-	}
-
-	.key {
-		display: inline-block;
-		width: 9em;
-	}
-
-	.string {
-		color: hsl(41, 37%, 45%);
-	}
-
-	/* .boolean {
-		color: hsl(45, 7%, 45%);
-	} */
-
-	label {
-		display: inline-block;
-	}
-
-	label[for] {
-		color: var(--sk-code-string);
-	}
-
-	label :global(input[type='checkbox']) {
-		top: -1px;
-	}
-
-	input[type='radio'] {
-		position: absolute;
-		top: auto;
-		overflow: hidden;
-		clip: rect(1px, 1px, 1px, 1px);
-		width: 1px;
-		height: 1px;
-		white-space: nowrap;
-	}
-
-	input[type='radio'] + label {
-		padding: 0 0 0 1.6em;
-		margin: 0 0.6em 0 0;
-		opacity: 0.7;
-	}
-
-	input[type='radio']:checked + label {
-		opacity: 1;
-	}
-
-	/* input[type=radio]:focus + label {
-		color: #00f;
-		outline: 1px dotted #00f;
-	} */
-
-	input[type='radio'] + label:before {
-		content: '';
-		background: #eee;
-		display: block;
-		box-sizing: border-box;
-		float: left;
-		width: 15px;
-		height: 15px;
-		margin-left: -21px;
-		margin-top: 4px;
-		/* vertical-align: top; */
-		cursor: pointer;
-		text-align: center;
-		transition: box-shadow 0.1s ease-out;
-	}
-
-	input[type='radio'] + label:before {
-		background-color: var(--sk-theme-2);
-		border-radius: 100%;
-		box-shadow: inset 0 0 0 0.5em rgba(255, 255, 255, 0.95);
-		border: 1px solid var(--sk-theme-2);
-	}
-
-	input[type='radio']:checked + label:before {
-		background-color: var(--sk-theme-1);
-		box-shadow: inset 0 0 0 0.15em rgba(255, 255, 255, 0.95);
-		border: 1px solid var(--sk-theme-2);
-		transition: box-shadow 0.2s ease-out;
-	}
-
-	.note {
-		padding: 10px;
-	}
-
-	.note p {
-		font-size: 1.4rem;
-		text-wrap: balance;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/ErrorOverlay.svelte b/sites/svelte-5-preview/src/lib/Output/ErrorOverlay.svelte
deleted file mode 100644
index a0f59985fe53..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/ErrorOverlay.svelte
+++ /dev/null
@@ -1,47 +0,0 @@
-<script>
-	/** @type {import('svelte/compiler').CompileError} */
-	export let error;
-</script>
-
-<div class="error-overlay">
-	<div class="error">
-		<h2>Error compiling {error.filename ?? 'component'}</h2>
-		<pre><code>{error.message}</code></pre>
-
-		{#if error.start}
-			<small>line {error.start.line} column {error.start.column}</small>
-		{/if}
-	</div>
-</div>
-
-<style>
-	.error-overlay {
-		position: absolute;
-		width: 100%;
-		height: 100%;
-		top: 0;
-		padding: 1em;
-		background: rgba(0, 0, 0, 0.1);
-		backdrop-filter: blur(5px);
-	}
-
-	.error {
-		display: flex;
-		flex-direction: column;
-		gap: 1em;
-		background: var(--sk-back-1);
-		padding: 1em;
-		border-top: 4px solid var(--sk-theme-1);
-		border-radius: 4px;
-		filter: drop-shadow(2px 4px 8px rgba(0, 0, 0, 0.1));
-	}
-
-	pre {
-		padding: 0.5em;
-		background: var(--sk-back-3);
-	}
-
-	small {
-		color: var(--sk-text-4);
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/Output.svelte b/sites/svelte-5-preview/src/lib/Output/Output.svelte
deleted file mode 100644
index ac6da48d3d17..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/Output.svelte
+++ /dev/null
@@ -1,175 +0,0 @@
-<script>
-	import { get_repl_context } from '$lib/context.js';
-	import { marked } from 'marked';
-	import CodeMirror from '../CodeMirror.svelte';
-	import AstView from './AstView.svelte';
-	import CompilerOptions from './CompilerOptions.svelte';
-	import PaneWithPanel from './PaneWithPanel.svelte';
-	import Viewer from './Viewer.svelte';
-
-	/** @type {string | null} */
-	export let status;
-
-	/** @type {import('$lib/types').MessageDetails | null} */
-	export let runtimeError = null;
-
-	export let embedded = false;
-	export let relaxed = false;
-
-	/** @type {string} */
-	export let injectedJS;
-
-	/** @type {string} */
-	export let injectedCSS;
-
-	// export let theme;
-	export let showAst = false;
-
-	/** @type {'light' | 'dark'} */
-	export let previewTheme;
-
-	/** @type {import('../types').File | null} */
-	export let selected;
-
-	/** @type {import('../workers/workers').CompileMessageData | null} */
-	export let compiled;
-
-	$: if (selected && js_editor && css_editor) {
-		if (selected.type === 'json') {
-			js_editor.set({ code: `/* Select a component to see its compiled code */`, lang: 'js' });
-			css_editor.set({ code: `/* Select a component to see its compiled code */`, lang: 'css' });
-		} else if (selected.type === 'md') {
-			markdown = marked(selected.source);
-		} else if (compiled) {
-			js_editor.set({ code: compiled.result.js, lang: 'js' });
-			css_editor.set({ code: compiled.result.css, lang: 'css' });
-		}
-	}
-
-	const { module_editor } = get_repl_context();
-
-	/** @type {CodeMirror} */
-	let js_editor;
-
-	/** @type {CodeMirror} */
-	let css_editor;
-
-	/** @type {'result' | 'js' | 'css' | 'ast'} */
-	let view = 'result';
-	let markdown = '';
-
-	$: ast = compiled?.result?.ast;
-</script>
-
-<div class="view-toggle">
-	{#if selected?.type === 'md'}
-		<button class="active">Markdown</button>
-	{:else}
-		<button class:active={view === 'result'} on:click={() => (view = 'result')}>Result</button>
-		<button class:active={view === 'js'} on:click={() => (view = 'js')}>JS output</button>
-		<button class:active={view === 'css'} on:click={() => (view = 'css')}>CSS output</button>
-		{#if showAst}
-			<button class:active={view === 'ast'} on:click={() => (view = 'ast')}>AST output</button>
-		{/if}
-	{/if}
-</div>
-
-<!-- component viewer -->
-<div class="tab-content" class:visible={selected?.type !== 'md' && view === 'result'}>
-	<Viewer
-		bind:error={runtimeError}
-		{status}
-		{relaxed}
-		{injectedJS}
-		{injectedCSS}
-		theme={previewTheme}
-	/>
-</div>
-
-<!-- js output -->
-<div class="tab-content" class:visible={selected?.type !== 'md' && view === 'js'}>
-	{#if embedded}
-		<CodeMirror bind:this={js_editor} readonly />
-	{:else}
-		<PaneWithPanel pos="50%" panel="Compiler options">
-			<div slot="main">
-				<CodeMirror bind:this={js_editor} readonly />
-			</div>
-
-			<div slot="panel-body">
-				<CompilerOptions />
-			</div>
-		</PaneWithPanel>
-	{/if}
-</div>
-
-<!-- css output -->
-<div class="tab-content" class:visible={selected?.type !== 'md' && view === 'css'}>
-	<CodeMirror bind:this={css_editor} readonly />
-</div>
-
-<!-- ast output -->
-{#if showAst && ast}
-	<div class="tab-content" class:visible={selected?.type !== 'md' && view === 'ast'}>
-		<!-- ast view interacts with the module editor, wait for it first -->
-		{#if $module_editor}
-			<AstView {ast} autoscroll={selected?.type !== 'md' && view === 'ast'} />
-		{/if}
-	</div>
-{/if}
-
-<!-- markdown output -->
-<div class="tab-content" class:visible={selected?.type === 'md'}>
-	<iframe title="Markdown" srcdoc={markdown}></iframe>
-</div>
-
-<style>
-	.view-toggle {
-		height: 4.2rem;
-		border-bottom: 1px solid var(--sk-text-4);
-		white-space: nowrap;
-		box-sizing: border-box;
-	}
-
-	button {
-		/* width: 50%;
-		height: 100%; */
-		background: var(--sk-back-1, white);
-		text-align: left;
-		position: relative;
-		font: 400 12px/1.5 var(--sk-font);
-		border: none;
-		border-bottom: 3px solid transparent;
-		padding: 12px 12px 8px 12px;
-		color: var(--sk-text-2, #999);
-		border-radius: 0;
-	}
-
-	button.active {
-		border-bottom: 3px solid var(--sk-theme-1, --prime);
-		color: var(--sk-text-1, #333);
-	}
-
-	div[slot] {
-		height: 100%;
-	}
-
-	.tab-content {
-		position: absolute;
-		width: 100%;
-		height: calc(100% - 42px) !important;
-		visibility: hidden;
-		pointer-events: none;
-	}
-
-	.tab-content.visible {
-		visibility: visible;
-		pointer-events: all;
-	}
-	iframe {
-		width: 100%;
-		height: 100%;
-		border: none;
-		display: block;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/PaneWithPanel.svelte b/sites/svelte-5-preview/src/lib/Output/PaneWithPanel.svelte
deleted file mode 100644
index 9018a50bee48..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/PaneWithPanel.svelte
+++ /dev/null
@@ -1,83 +0,0 @@
-<script>
-	import { spring } from 'svelte/motion';
-	import { SplitPane } from '@rich_harris/svelte-split-pane';
-
-	const UNIT_REGEX = /(\d+)(?:(px|rem|%|em))/i;
-
-	/** @type {string} */
-	export let panel;
-
-	/** @type {Exclude<import('@rich_harris/svelte-split-pane/dist/SplitPane.svelte').SplitPaneProps['max'], undefined>} */
-	export let pos = '90%';
-
-	$: previous_pos = Math.min(+pos.replace(UNIT_REGEX, '$1'), 70);
-
-	/** @type {Exclude<import('@rich_harris/svelte-split-pane/dist/SplitPane.svelte').SplitPaneProps['max'], undefined>} */
-	let max = '90%';
-
-	// we can't bind to the spring itself, but we
-	// can still use the spring to drive `pos`
-	const driver = spring(+pos.replace(UNIT_REGEX, '$1'), {
-		stiffness: 0.2,
-		damping: 0.5
-	});
-
-	// @ts-ignore
-	$: pos = $driver + '%';
-
-	const toggle = () => {
-		const numeric_pos = +pos.replace(UNIT_REGEX, '$1');
-
-		driver.set(numeric_pos, { hard: true });
-
-		if (numeric_pos > 80) {
-			driver.set(previous_pos);
-		} else {
-			previous_pos = numeric_pos;
-			driver.set(+max.replace(UNIT_REGEX, '$1'));
-		}
-	};
-</script>
-
-<SplitPane {max} min="10%" type="vertical" bind:pos priority="max">
-	<section slot="a">
-		<slot name="main" />
-	</section>
-
-	<section slot="b">
-		<div class="panel-header">
-			<button class="panel-heading" on:click={toggle}>{panel}</button>
-			<slot name="panel-header" />
-		</div>
-
-		<div class="panel-body">
-			<slot name="panel-body" />
-		</div>
-	</section>
-</SplitPane>
-
-<style>
-	.panel-header {
-		height: 42px;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 0 0.5em;
-		cursor: pointer;
-	}
-
-	.panel-body {
-		overflow: auto;
-	}
-
-	.panel-heading {
-		font: 700 12px/1.5 var(--sk-font);
-		color: var(--sk-text-1, #333);
-		flex: 1;
-		text-align: left;
-	}
-
-	section {
-		overflow: hidden;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/ReplProxy.js b/sites/svelte-5-preview/src/lib/Output/ReplProxy.js
deleted file mode 100644
index 0e45887bd727..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/ReplProxy.js
+++ /dev/null
@@ -1,96 +0,0 @@
-let uid = 1;
-
-export default class ReplProxy {
-	/** @type {HTMLIFrameElement} */
-	iframe;
-
-	/** @type {import("./proxy").Handlers} */
-	handlers;
-
-	/** @type {Map<number, { resolve: (value: any) => void, reject: (value: any) => void }>} */
-	pending_cmds = new Map();
-
-	/** @param {MessageEvent<any>} event */
-	handle_event = (event) => {
-		if (event.source !== this.iframe.contentWindow) return;
-
-		const { action, args } = event.data;
-
-		switch (action) {
-			case 'cmd_error':
-			case 'cmd_ok':
-				return this.handle_command_message(event.data);
-			case 'fetch_progress':
-				return this.handlers.on_fetch_progress(args.remaining);
-			case 'error':
-				return this.handlers.on_error(event.data);
-			case 'unhandledrejection':
-				return this.handlers.on_unhandled_rejection(event.data);
-			case 'console':
-				return this.handlers.on_console(event.data);
-		}
-	};
-
-	/**
-	 * @param {HTMLIFrameElement} iframe
-	 * @param {import("./proxy").Handlers} handlers
-	 */
-	constructor(iframe, handlers) {
-		this.iframe = iframe;
-		this.handlers = handlers;
-
-		window.addEventListener('message', this.handle_event, false);
-	}
-
-	destroy() {
-		window.removeEventListener('message', this.handle_event);
-	}
-
-	/**
-	 * @param {string} action
-	 * @param {any} args
-	 */
-	iframe_command(action, args) {
-		return new Promise((resolve, reject) => {
-			const cmd_id = uid++;
-
-			this.pending_cmds.set(cmd_id, { resolve, reject });
-
-			this.iframe.contentWindow?.postMessage({ action, cmd_id, args }, '*');
-		});
-	}
-
-	/**
-	 * @param {{ action: string; cmd_id: number; message: string; stack: any; args: any; }} cmd_data
-	 */
-	handle_command_message(cmd_data) {
-		let action = cmd_data.action;
-		let id = cmd_data.cmd_id;
-		let handler = this.pending_cmds.get(id);
-
-		if (handler) {
-			this.pending_cmds.delete(id);
-			if (action === 'cmd_error') {
-				let { message, stack } = cmd_data;
-				let e = new Error(message);
-				e.stack = stack;
-				handler.reject(e);
-			}
-
-			if (action === 'cmd_ok') {
-				handler.resolve(cmd_data.args);
-			}
-		} else {
-			console.error('command not found', id, cmd_data, [...this.pending_cmds.keys()]);
-		}
-	}
-
-	/** @param {string} script */
-	eval(script) {
-		return this.iframe_command('eval', { script });
-	}
-
-	handle_links() {
-		return this.iframe_command('catch_clicks', {});
-	}
-}
diff --git a/sites/svelte-5-preview/src/lib/Output/Viewer.svelte b/sites/svelte-5-preview/src/lib/Output/Viewer.svelte
deleted file mode 100644
index db506ada3bfd..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/Viewer.svelte
+++ /dev/null
@@ -1,337 +0,0 @@
-<script>
-	import { get_repl_context } from '$lib/context.js';
-	import { BROWSER } from 'esm-env';
-	import { onMount } from 'svelte';
-	import Message from '../Message.svelte';
-	import PaneWithPanel from './PaneWithPanel.svelte';
-	import ReplProxy from './ReplProxy.js';
-	import Console from './console/Console.svelte';
-	import getLocationFromStack from './get-location-from-stack';
-	import srcdoc from './srcdoc/index.html?raw';
-	import ErrorOverlay from './ErrorOverlay.svelte';
-
-	/** @type {import('$lib/types').MessageDetails | null} */
-	export let error;
-	/** @type {string | null} */
-	export let status;
-	export let relaxed = false;
-	export let injectedJS = '';
-	export let injectedCSS = '';
-
-	/** @type {'light' | 'dark'} */
-	export let theme;
-
-	const { bundle } = get_repl_context();
-
-	/** @type {import('./console/console').Log[]} */
-	let logs = [];
-
-	/** @type {import('./console/console').Log[][]} */
-	let log_group_stack = [];
-
-	let current_log_group = logs;
-
-	/** @type {HTMLIFrameElement} */
-	let iframe;
-	let pending_imports = 0;
-	let pending = false;
-
-	/** @type {ReplProxy | null} */
-	let proxy = null;
-
-	let ready = false;
-	let inited = false;
-
-	let log_height = 90;
-	/** @type {number} */
-	let prev_height;
-
-	/** @type {import('./console/console').Log} */
-	let last_console_event;
-
-	onMount(() => {
-		proxy = new ReplProxy(iframe, {
-			on_fetch_progress: (progress) => {
-				pending_imports = progress;
-			},
-			on_error: (event) => {
-				push_logs({ command: 'error', args: [event.value] });
-			},
-			on_unhandled_rejection: (event) => {
-				let error = event.value;
-				if (typeof error === 'string') error = { message: error };
-				error.message = 'Uncaught (in promise): ' + error.message;
-				push_logs({ command: 'error', args: [error] });
-			},
-			on_console: (log) => {
-				switch (log.command) {
-					case 'clear':
-						clear_logs();
-						push_logs(log);
-						break;
-
-					case 'group':
-						group_logs(log);
-						break;
-
-					case 'groupEnd':
-						ungroup_logs();
-						break;
-
-					case 'duplicate':
-						increment_duplicate_log();
-						break;
-
-					default:
-						push_logs(log);
-				}
-			}
-		});
-
-		iframe.addEventListener('load', () => {
-			proxy?.handle_links();
-			ready = true;
-		});
-
-		return () => {
-			proxy?.destroy();
-		};
-	});
-
-	$: if (ready) proxy?.iframe_command('set_theme', { theme });
-
-	/**
-	 * @param {import('$lib/types').Bundle | null} $bundle
-	 */
-	async function apply_bundle($bundle) {
-		if (!$bundle) return;
-
-		try {
-			clear_logs();
-
-			if (!$bundle.error) {
-				await proxy?.eval(`
-					${injectedJS}
-
-					${styles}
-
-					{
-						const styles = document.querySelectorAll('style[id^=svelte-]');
-
-						let i = styles.length;
-						while (i--) styles[i].parentNode.removeChild(styles[i]);
-
-						if (window.__unmount_previous) {
-							try {
-								window.__unmount_previous();
-							} catch (err) {
-								console.error(err);
-							}
-						}
-
-						document.body.innerHTML = '';
-						window._svelteTransitionManager = null;
-					}
-
-					const __repl_exports = ${$bundle.client?.code};
-					{
-						const { mount, unmount, App, untrack } = __repl_exports;
-
-						const console_methods = ['log', 'error', 'trace', 'assert', 'warn', 'table', 'group'];
-
-						// The REPL hooks up to the console to provide a virtual console. However, the implementation
-						// needs to stringify the console to pass over a MessageChannel, which means that the object
-						// can get deeply read and tracked by accident when using the console. We can avoid this by
-						// ensuring we untrack the main console methods.
-
-						const original = {};
-
-						for (const method of console_methods) {
-							original[method] = console[method];
-							console[method] = function (...v) {
-								return untrack(() => original[method].apply(this, v));
-							}
-						}
-						const component = mount(App, { target: document.body });
-						window.__unmount_previous = () => {
-							for (const method of console_methods) {
-								console[method] = original[method];
-							}
-							unmount(component);
-						}
-					}
-					//# sourceURL=playground:output
-				`);
-				error = null;
-			}
-		} catch (e) {
-			// @ts-ignore
-			show_error(e);
-		}
-
-		inited = true;
-	}
-
-	$: if (ready) apply_bundle($bundle);
-
-	$: styles =
-		injectedCSS &&
-		`{
-		const style = document.createElement('style');
-		style.textContent = ${JSON.stringify(injectedCSS)};
-		document.head.appendChild(style);
-	}`;
-
-	/**
-	 * @param {import('$lib/types').Error & { loc: { line: number; column: number } }} e
-	 */
-	function show_error(e) {
-		const map = $bundle?.client?.map;
-
-		// @ts-ignore INVESTIGATE
-		const loc = map && getLocationFromStack(e.stack, map);
-		if (loc) {
-			e.filename = loc.source;
-			e.loc = { line: loc.line, column: loc.column ?? 0 };
-		}
-
-		error = e;
-	}
-
-	/**
-	 * @param {import('./console/console').Log} log
-	 */
-	function push_logs(log) {
-		current_log_group.push((last_console_event = log));
-		logs = logs;
-	}
-
-	/** @param {import('./console/console').Log} log */
-	function group_logs(log) {
-		log.logs = [];
-		current_log_group.push(log);
-		// TODO: Investigate
-		log_group_stack.push(current_log_group);
-		current_log_group = log.logs;
-		logs = logs;
-	}
-
-	function ungroup_logs() {
-		const last = log_group_stack.pop();
-
-		if (last) current_log_group = last;
-	}
-
-	function increment_duplicate_log() {
-		const last_log = current_log_group[current_log_group.length - 1];
-
-		if (last_log) {
-			last_log.count = (last_log.count || 1) + 1;
-			logs = logs;
-		} else {
-			last_console_event.count = 1;
-			push_logs(last_console_event);
-		}
-	}
-
-	function on_toggle_console() {
-		if (log_height < 90) {
-			prev_height = log_height;
-			log_height = 90;
-		} else {
-			log_height = prev_height || 45;
-		}
-	}
-
-	function clear_logs() {
-		current_log_group = logs = [];
-	}
-</script>
-
-<div class="iframe-container">
-	<PaneWithPanel pos="90%" panel="Console">
-		<div slot="main">
-			<iframe
-				title="Result"
-				class:inited
-				bind:this={iframe}
-				sandbox={[
-					'allow-popups-to-escape-sandbox',
-					'allow-scripts',
-					'allow-popups',
-					'allow-forms',
-					'allow-pointer-lock',
-					'allow-top-navigation',
-					'allow-modals',
-					relaxed ? 'allow-same-origin' : ''
-				].join(' ')}
-				class={error || pending || pending_imports ? 'greyed-out' : ''}
-				srcdoc={BROWSER ? srcdoc : ''}
-			></iframe>
-
-			{#if $bundle?.error}
-				<ErrorOverlay error={$bundle.error} />
-			{/if}
-		</div>
-
-		<div slot="panel-header">
-			<button on:click|stopPropagation={clear_logs}>
-				{#if logs.length > 0}
-					({logs.length})
-				{/if}
-				Clear
-			</button>
-		</div>
-
-		<section slot="panel-body">
-			<Console {logs} />
-		</section>
-	</PaneWithPanel>
-
-	<div class="overlay">
-		{#if error}
-			<Message kind="error" details={error} />
-		{:else if status || !$bundle}
-			<Message kind="info" truncate>{status || 'loading Svelte compiler...'}</Message>
-		{/if}
-	</div>
-</div>
-
-<style>
-	.iframe-container {
-		position: absolute;
-		background-color: var(--sk-back-1, white);
-		border: none;
-		width: 100%;
-		height: 100%;
-	}
-
-	iframe {
-		width: 100%;
-		height: 100%;
-		border: none;
-		display: block;
-	}
-
-	.greyed-out {
-		filter: grayscale(50%) blur(1px);
-		opacity: 0.25;
-	}
-
-	button {
-		color: var(--sk-text-2, #999);
-		font-size: 12px;
-		text-transform: uppercase;
-		display: block;
-	}
-
-	button:hover {
-		color: var(--sk-text-1, #333);
-	}
-
-	.overlay {
-		position: absolute;
-		top: 0;
-		width: 100%;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/console/Console.svelte b/sites/svelte-5-preview/src/lib/Output/console/Console.svelte
deleted file mode 100644
index e2a880aff8bb..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/console/Console.svelte
+++ /dev/null
@@ -1,46 +0,0 @@
-<script>
-	import ConsoleLine from './ConsoleLine.svelte';
-
-	/** @type {import('./console').Log[]} */
-	export let logs;
-</script>
-
-<div class="container">
-	{#each logs as log}
-		<ConsoleLine {log} />
-	{/each}
-</div>
-
-<style>
-	.container {
-		--error-fg: #da106e;
-		--error-bg: #fff0f0;
-		--error-border: rgb(242, 214, 219);
-		--warning-bg: rgb(254, 251, 218);
-		--warning-border: rgb(242, 232, 163);
-		--json-tree-string-color: var(--sk-code-string);
-		--json-tree-font-family: var(--sk-font-mono);
-
-		:global(.dark) & {
-			--error-fg: rgb(235, 78, 109);
-			--error-bg: rgb(71, 48, 54);
-			--error-border: rgb(109, 65, 76);
-			--warning-bg: rgb(64, 56, 34);
-			--warning-border: rgb(86, 86, 51);
-
-			--json-tree-property-color: #72a2d3;
-			--json-tree-string-color: #6cd1c7;
-			--json-tree-symbol-color: #6cd1c7;
-			--json-tree-boolean-color: #9681f7;
-			--json-tree-function-color: #e59b6f;
-			--json-tree-number-color: #9681f7;
-			--json-tree-label-color: #9ca0a5;
-			--json-tree-arrow-color: #e8eaed;
-			--json-tree-null-color: #81868a;
-			--json-tree-undefined-color: #81868a;
-			--json-tree-date-color: #9ca0a5;
-			--json-tree-operator-color: #e8eaed;
-			--json-tree-regex-color: #6cd1c7;
-		}
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/console/ConsoleLine.svelte b/sites/svelte-5-preview/src/lib/Output/console/ConsoleLine.svelte
deleted file mode 100644
index 36635c713049..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/console/ConsoleLine.svelte
+++ /dev/null
@@ -1,292 +0,0 @@
-<script>
-	import JSONNode from 'svelte-json-tree';
-	import ConsoleTable from './ConsoleTable.svelte';
-
-	/** @type {import('./console').Log} */
-	export let log;
-	export let depth = 0;
-
-	function toggle_group_collapse() {
-		log.collapsed = !log.collapsed;
-	}
-
-	let style;
-
-	/** @param {string} text */
-	function sanitize_css(text) {
-		style ??= document.createElement('span').style;
-		style.cssText = text;
-
-		for (const key in style) {
-			const value = style[key];
-			if (typeof value === 'string' && value.includes('url(')) {
-				style[key] = value.replace(/url\([^)]+\)/g, '');
-			}
-		}
-
-		style.position = 'static';
-		return style.cssText;
-	}
-
-	/** @param {any[]} [args] */
-	function format_args(args = []) {
-		if (args.length === 0) return args;
-
-		if (typeof args[0] !== 'string') {
-			return args.map((value) => ({ type: 'value', value }));
-		}
-
-		args = args.slice();
-
-		const parts = args.shift().split(/(%[sdifoOc])/g);
-
-		const formatted = [];
-
-		if (parts[0] !== '') {
-			formatted.push({ type: 'value', value: parts[0] });
-		}
-
-		for (let i = 1; i < parts.length; i += 2) {
-			const type = parts[i];
-			const next = parts[i + 1];
-			const value = args.shift();
-
-			switch (type) {
-				case '%s':
-					formatted.push({ type: 'value', value: String(value), formatted: true });
-					break;
-
-				case '%d':
-				case '%i':
-					formatted.push({
-						type: 'value',
-						value: typeof value === 'symbol' ? NaN : parseInt(value, 10),
-						formatted: true
-					});
-					break;
-
-				case '%f':
-					formatted.push({
-						type: 'value',
-						value: typeof value === 'symbol' ? NaN : parseFloat(value),
-						formatted: true
-					});
-					break;
-
-				case '%o':
-				case '%O':
-					formatted.push({ type: 'value', value, formatted: true });
-					break;
-
-				case '%c':
-					formatted.push({
-						type: 'style',
-						style: sanitize_css(String(value)),
-						value: next,
-						formatted: true
-					});
-					break;
-			}
-
-			if (type !== '%c' && next !== '') {
-				formatted.push({ type: 'value', value: next, formatted: true });
-			}
-		}
-
-		for (const value of args) {
-			formatted.push({ type: 'value', value });
-		}
-
-		return formatted;
-	}
-</script>
-
-{#if log.command === 'table'}
-	<ConsoleTable data={log.data} columns={log.columns} />
-{/if}
-
-<div class="{log.command} line" style="--indent: {depth * 15}px">
-	<!-- svelte-ignore a11y_click_events_have_key_events -->
-	<div
-		role="button"
-		tabindex="0"
-		on:click={toggle_group_collapse}
-		class="log"
-		class:expandable={log.stack || log.command === 'group'}
-	>
-		{#if log.count && log.count > 1}
-			<span class="count">{log.count}</span>
-		{/if}
-
-		{#if log.stack || log.command === 'group'}
-			<span class="arrow" class:expand={!log.collapsed}>{'\u25B6'}</span>
-		{/if}
-
-		{#if log.command === 'clear'}
-			<span class="meta">Console was cleared</span>
-		{:else if log.command === 'unclonable'}
-			<span class="meta meta-error">Message could not be cloned. Open devtools to see it</span>
-		{:else if log.command === 'table'}
-			<JSONNode value={log.data} />
-		{:else}
-			<span class="values">
-				{#each format_args(log.args) as part}
-					<!-- we need to do some funky stuff to make whitespace behave as it does in devtools -->
-					{#if !part.formatted}
-						{' '}
-					{/if}{#if part.type === 'value'}
-						<JSONNode value={part.value} defaultExpandedLevel={log.expanded ? 1 : 0} />
-					{:else}
-						<span class="styled" style={part.style}>{part.value}</span>
-					{/if}
-				{/each}
-			</span>
-		{/if}
-	</div>
-
-	{#if log.stack && !log.collapsed}
-		<div class="stack">
-			{#each log.stack as line}
-				<span>{line.label}</span>
-				<span class="location">{line.location}</span>
-			{/each}
-		</div>
-	{/if}
-
-	{#each new Array(depth) as _, idx}
-		<div class="outline" style="left: {idx * 15 + 15}px"></div>
-	{/each}
-</div>
-
-{#if log.command === 'group' && !log.collapsed}
-	{#each log.logs ?? [] as childLog}
-		<svelte:self log={childLog} depth={depth + 1} />
-	{/each}
-{/if}
-
-<style>
-	.line {
-		--bg: var(--sk-back-1);
-		--border: var(--sk-back-3);
-		display: block;
-		position: relative;
-		width: 100%;
-		text-align: left;
-		border-width: 1px;
-		border-style: solid none none none;
-		border-color: var(--border);
-		background: var(--bg);
-	}
-
-	.warn {
-		--bg: var(--warning-bg);
-		--border: var(--warning-border);
-	}
-
-	.error {
-		--bg: var(--error-bg);
-		--border: var(--error-border);
-	}
-
-	.warn,
-	.error {
-		border-style: solid none;
-
-		& + :global(&) {
-			border-top: none;
-		}
-	}
-
-	.group {
-		font-weight: 700;
-	}
-
-	.log {
-		padding: 0.5rem 1rem 0.5rem calc(1rem + var(--indent));
-		display: flex;
-		gap: 1rem;
-		width: 100%;
-		font-size: 1.2rem;
-		font-family: var(--sk-font-mono);
-		align-items: center;
-	}
-
-	.log.expandable {
-		cursor: pointer;
-	}
-
-	.values {
-		display: block;
-		flex: 1;
-	}
-
-	.stack {
-		display: grid;
-		grid-template-columns: minmax(0, auto) minmax(auto, 1fr);
-		grid-gap: 0 2rem;
-		font-size: 1.2rem;
-		font-family: var(--sk-font-mono);
-		margin: 0 1rem 0.4rem calc(1em + var(--indent));
-		overflow: hidden;
-
-		.location {
-			position: relative;
-			background: var(--bg);
-			&::before {
-				content: '';
-				position: absolute;
-				width: 1rem;
-				height: 100%;
-				left: -1rem;
-				top: 0;
-				background: linear-gradient(to right, transparent, var(--bg));
-			}
-		}
-	}
-
-	.count {
-		position: relative;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		min-width: 1.5em;
-		height: 1.4em;
-		padding: 0.5em;
-		border-radius: 0.4rem;
-		background-color: var(--sk-text-3, #777);
-		color: var(--sk-back-1);
-		font-size: 1rem;
-	}
-
-	.meta {
-		color: var(--sk-text-2, #666);
-		font-family: var(--sk-font) !important;
-		font-size: 12px;
-	}
-
-	.meta-error {
-		color: var(--error-fg);
-	}
-
-	.outline {
-		border-left: 1px solid #9c9cab;
-		position: absolute;
-		top: 0;
-		bottom: -1px;
-	}
-
-	.arrow {
-		font-size: 0.9rem;
-		transition: 150ms;
-		transform-origin: 50% 50%;
-		transform: translateY(-1px);
-	}
-
-	.arrow.expand {
-		transform: translateY(0px) rotateZ(90deg);
-	}
-
-	.styled {
-		white-space: pre-wrap;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/console/ConsoleTable.svelte b/sites/svelte-5-preview/src/lib/Output/console/ConsoleTable.svelte
deleted file mode 100644
index cba9721807c7..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/console/ConsoleTable.svelte
+++ /dev/null
@@ -1,145 +0,0 @@
-<script>
-	import JSONNode from 'svelte-json-tree';
-
-	/** @type {any} */
-	export let data;
-
-	/** @type {any} */
-	export let columns;
-
-	$: table = create_table(data, columns);
-
-	/**
-	 * @param {any} data
-	 * @param {string[]} [custom_columns]
-	 */
-	function create_table(data, custom_columns) {
-		let has_non_object = false;
-		const columns = new Set();
-
-		if (custom_columns) {
-			custom_columns.forEach((column) => columns.add(column));
-		} else {
-			for (const key in data) {
-				const value = data[key];
-				if (typeof value === 'object') {
-					Object.keys(value).forEach((key) => columns.add(key));
-				} else {
-					has_non_object = true;
-				}
-			}
-		}
-
-		const is_array = Array.isArray(data);
-
-		const rows = Object.keys(data).map((key) => {
-			const value = data[key];
-			const values = [];
-
-			for (const column of columns) {
-				values.push(typeof value === 'object' && column in value ? value[column] : '');
-			}
-
-			if (has_non_object) {
-				values.push(typeof value !== 'object' ? value : '');
-			}
-
-			return {
-				key: is_array ? parseInt(key) : key,
-				values
-			};
-		});
-
-		if (has_non_object) {
-			columns.add('Value');
-		}
-
-		return { columns, rows };
-	}
-</script>
-
-<div class="table">
-	<table>
-		<thead>
-			<tr>
-				<th>(index)</th>
-
-				{#each table.columns as column}
-					<th>{column}</th>
-				{/each}
-			</tr>
-		</thead>
-
-		<tbody>
-			{#each table.rows as row}
-				<tr>
-					<td>
-						{#if typeof row.key === 'string'}
-							{row.key}
-						{:else}
-							<JSONNode value={row.key} />
-						{/if}
-					</td>
-
-					{#each row.values as value}
-						<td>
-							{#if typeof value === 'string'}
-								{value}
-							{:else}
-								<JSONNode {value} />
-							{/if}
-						</td>
-					{/each}
-				</tr>
-			{/each}
-		</tbody>
-	</table>
-</div>
-
-<style>
-	.table {
-		--json-tree-font-size: 1.2rem;
-		--json-tree-font-family: var(--sk-font-mono);
-		margin: 8px;
-		overflow: auto;
-		max-height: 200px;
-		border: 1px solid var(--sk-back-4);
-		border-radius: 2px;
-		overscroll-behavior: none;
-	}
-
-	table {
-		border-collapse: collapse;
-		line-height: 1;
-	}
-
-	th {
-		background: var(--sk-back-3);
-		padding: 0.5rem 1rem;
-		border: none;
-		position: sticky;
-		font-weight: normal;
-		font-size: 1.4rem;
-		top: 0;
-	}
-
-	td {
-		font-family: var(--sk-font-mono);
-		font-size: 1.2rem;
-		padding: 0.5rem 1rem;
-		border-bottom: none;
-	}
-
-	tr {
-		background: var(--sk-back-1);
-	}
-
-	tr:nth-child(2n) {
-		background: var(--sk-back-3);
-	}
-
-	th,
-	td {
-		border-right: 1px solid var(--sk-back-3);
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/Output/console/console.d.ts b/sites/svelte-5-preview/src/lib/Output/console/console.d.ts
deleted file mode 100644
index 540e0b3b020a..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/console/console.d.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-export type Log = {
-	command: 'info' | 'warn' | 'error' | 'table' | 'group' | 'clear' | 'unclonable';
-	action?: 'console';
-	args?: any[];
-	collapsed?: boolean;
-	expanded?: boolean;
-	count?: number;
-	logs?: Log[];
-	stack?: Array<{
-		label?: string;
-		location?: string;
-	}>;
-	data?: any;
-	columns?: string[];
-};
diff --git a/sites/svelte-5-preview/src/lib/Output/get-location-from-stack.js b/sites/svelte-5-preview/src/lib/Output/get-location-from-stack.js
deleted file mode 100644
index 3ac3e457d6b3..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/get-location-from-stack.js
+++ /dev/null
@@ -1,42 +0,0 @@
-import { decode } from '@jridgewell/sourcemap-codec';
-
-/**
- * @param {string} stack
- * @param {import('@jridgewell/sourcemap-codec').SourceMapMappings} map
- * @returns
- */
-export default function getLocationFromStack(stack, map) {
-	if (!stack) return;
-	const last = stack.split('\n')[1];
-	const match = /<anonymous>:(\d+):(\d+)\)$/.exec(last);
-
-	if (!match) return null;
-
-	const line = +match[1];
-	const column = +match[2];
-
-	return trace({ line, column }, map);
-}
-
-/**
- *
- * @param {Omit<import('$lib/types').StartOrEnd, 'character'>} loc
- * @param {*} map
- * @returns
- */
-function trace(loc, map) {
-	const mappings = decode(map.mappings);
-	const segments = mappings[loc.line - 1];
-
-	for (let i = 0; i < segments.length; i += 1) {
-		const segment = segments[i];
-		if (segment[0] === loc.column) {
-			const [, sourceIndex, line, column] = segment;
-			const source = map.sources[sourceIndex ?? 0].slice(2);
-
-			return { source, line: (line ?? 0) + 1, column };
-		}
-	}
-
-	return null;
-}
diff --git a/sites/svelte-5-preview/src/lib/Output/proxy.d.ts b/sites/svelte-5-preview/src/lib/Output/proxy.d.ts
deleted file mode 100644
index b3f9fa8d1ae4..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/proxy.d.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export type Handlers = Record<
-	'on_fetch_progress' | 'on_error' | 'on_unhandled_rejection' | 'on_console',
-	(data: any) => void
->;
diff --git a/sites/svelte-5-preview/src/lib/Output/srcdoc/index.html b/sites/svelte-5-preview/src/lib/Output/srcdoc/index.html
deleted file mode 100644
index 202a5f973a04..000000000000
--- a/sites/svelte-5-preview/src/lib/Output/srcdoc/index.html
+++ /dev/null
@@ -1,287 +0,0 @@
-<!doctype html>
-<html>
-	<head>
-		<style>
-			body {
-				--bg-1: hsl(0, 0%, 100%);
-				--bg-2: hsl(206, 20%, 90%);
-				--bg-3: hsl(206, 20%, 80%);
-				--fg-1: hsl(0, 0%, 13%);
-				--fg-2: hsl(0, 0%, 20%);
-				--fg-2: hsl(0, 0%, 30%);
-				--link: hsl(208, 77%, 47%);
-				--link-hover: hsl(208, 77%, 55%);
-				--link-active: hsl(208, 77%, 40%);
-				--border-radius: 4px;
-				--font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
-					'Open Sans', 'Helvetica Neue', sans-serif;
-				--font-mono: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas,
-					'DejaVu Sans Mono', monospace;
-				color-scheme: light;
-				background: var(--bg-1);
-				color: var(--fg-1);
-				font-family: var(--font);
-				line-height: 1.5;
-				margin: 1rem;
-				height: calc(100vh - 2rem);
-				accent-color: var(--hover) !important;
-			}
-
-			a {
-				color: var(--link);
-			}
-
-			a:hover {
-				color: var(--link-hover);
-			}
-
-			a:active {
-				color: var(--link-active);
-			}
-
-			code {
-				background: var(--bg-2);
-				font-family: var(--font-mono);
-				font-size: 0.9em;
-				padding: 0.15rem 0.3rem;
-				border-radius: var(--border-radius);
-			}
-
-			ul.todos {
-				padding: 0;
-			}
-
-			body.dark {
-				color-scheme: dark;
-				--bg-1: hsl(0, 0%, 18%);
-				--bg-2: hsl(0, 0%, 30%);
-				--bg-3: hsl(0, 0%, 40%);
-				--fg-1: hsl(0, 0%, 90%);
-				--fg-2: hsl(0, 0%, 70%);
-				--fg-3: hsl(0, 0%, 60%);
-				--link: hsl(206, 96%, 72%);
-				--link-hover: hsl(206, 96%, 78%);
-				--link-active: hsl(206, 96%, 64%);
-			}
-		</style>
-
-		<script>
-			(function () {
-				function send(payload, origin = '*') {
-					parent.postMessage(payload, origin);
-				}
-
-				window.addEventListener('message', ({ origin, data }) => {
-					let { action, cmd_id } = data;
-
-					const reply = (payload) => send({ ...payload, cmd_id }, origin);
-
-					try {
-						if (action === 'set_theme') {
-							document.body.classList.toggle('dark', data.args.theme === 'dark');
-						}
-
-						if (action === 'eval') {
-							(0, eval)(data.args.script);
-						}
-
-						if (action === 'catch_clicks') {
-							// attached to document to not interfere with svelte's event delegators that are attached to the app root (document.body)
-							document.addEventListener('click', (event) => {
-								if (event.which !== 1) return;
-								if (event.metaKey || event.ctrlKey || event.shiftKey) return;
-								if (event.defaultPrevented) return;
-
-								// ensure target is a link
-								let el = event.target;
-								while (el && el.nodeName !== 'A') el = el.parentNode;
-								if (!el || el.nodeName !== 'A') return;
-
-								if (
-									el.hasAttribute('download') ||
-									el.getAttribute('rel') === 'external' ||
-									el.target
-								)
-									return;
-
-								event.preventDefault();
-
-								if (el.href.startsWith(origin)) {
-									const url = new URL(el.href);
-									if (url.hash[0] === '#') {
-										window.location.hash = url.hash;
-										return;
-									}
-								}
-
-								window.open(el.href, '_blank');
-							});
-						}
-
-						reply({ action: 'cmd_ok' });
-					} catch ({ message, stack }) {
-						reply({ action: 'cmd_error', message, stack });
-					}
-				});
-
-				window.onerror = function (msg, url, lineNo, columnNo, error) {
-					send({ action: 'error', value: error });
-				};
-
-				window.addEventListener('unhandledrejection', (event) => {
-					send({ action: 'unhandledrejection', value: event.reason });
-				});
-
-				// Intercept console methods
-				const timers = new Map();
-				const counters = new Map();
-
-				function log(command, opts) {
-					try {
-						send({ action: 'console', command, ...opts });
-					} catch {
-						send({ action: 'console', command: 'unclonable' });
-					}
-				}
-
-				function stringify(args) {
-					try {
-						return JSON.stringify(args, (key, value) => {
-							// if we don't do this, our Set/Map from svelte/reactivity would show up wrong in the console
-							if (value instanceof Map) {
-								return { type: 'Map', value };
-							}
-
-							if (value instanceof Set) {
-								return { type: 'Set', value };
-							}
-
-							return value;
-						});
-					} catch (error) {
-						return null;
-					}
-				}
-
-				/** @param {string} method */
-				function stack(method) {
-					return new Error().stack
-						.split('\n')
-						.filter((line) => {
-							if (/[(@]about:srcdoc/.test(line)) return false;
-							return true;
-						})
-						.slice(1)
-						.map((line) => {
-							line = line
-								.replace('console[method]', `console.${method}`)
-								.replace(/console\.<computed> \[as \w+\]/, `console.${method}`);
-
-							let match =
-								/^\s+at (.+) \((.+:\d+:\d+)\)/.exec(line) || /^(.+)@(.+:\d+:\d+)?/.exec(line);
-
-							if (match) {
-								return {
-									label: match[1],
-									location: match[2]
-								};
-							}
-
-							return null;
-						})
-						.filter((x) => x);
-				}
-
-				const can_dedupe = ['log', 'info', 'dir', 'warn', 'error', 'assert', 'trace'];
-
-				const methods = {
-					clear: () => log('clear'),
-					// TODO make the command 'push' and the level/type 'info'
-					log: (...args) => log('info', { args }),
-					info: (...args) => log('info', { args }),
-					dir: (...args) => log('info', { args: [args[0]], expanded: true }),
-					warn: (...args) => log('warn', { args, stack: stack('warn'), collapsed: true }),
-					error: (...args) => log('error', { args, stack: stack('error'), collapsed: true }),
-					assert: (condition, ...args) => {
-						if (condition) return;
-						log('error', {
-							args: ['Assertion failed:', ...args],
-							stack: stack('assert'),
-							collapsed: true
-						});
-					},
-					group: (...args) => log('group', { args, collapsed: false }),
-					groupCollapsed: (...args) => log('group', { args, collapsed: true }),
-					groupEnd: () => log('groupEnd'),
-					table: (...args) => {
-						const data = args[0];
-						if (data && typeof data === 'object') {
-							log('table', { data, columns: args[1] });
-						} else {
-							log('info', { args });
-						}
-					},
-					time: (label = 'default') => timers.set(label, performance.now()),
-					timeLog: (label = 'default') => {
-						const now = performance.now();
-						if (timers.has(label)) {
-							log('info', { args: [`${label}: ${now - timers.get(label)}ms`] });
-						} else {
-							log('warn', { args: [`Timer '${label}' does not exist`] });
-						}
-					},
-					timeEnd: (label = 'default') => {
-						const now = performance.now();
-						if (timers.has(label)) {
-							log('info', { args: [`${label}: ${now - timers.get(label)}ms`] });
-						} else {
-							log('warn', { args: [`Timer '${label}' does not exist`] });
-						}
-						timers.delete(label);
-					},
-					count: (label = 'default') => {
-						counters.set(label, (counters.get(label) || 0) + 1);
-						log('info', { args: [`${label}: ${counters.get(label)}`] });
-					},
-					countReset: (label = 'default') => {
-						if (counters.has(label)) {
-							counters.set(label, 0);
-						} else {
-							log('warn', { args: [`Count for '${label}' does not exist`] });
-						}
-					},
-					trace: (...args) => {
-						log('info', {
-							args: args.length === 0 ? ['console.trace'] : args,
-							stack: stack('trace'),
-							collapsed: false
-						});
-					}
-				};
-
-				let previous = '';
-
-				for (const method in methods) {
-					const original = console[method];
-
-					console[method] = (...args) => {
-						const stack = new Error().stack;
-
-						if (
-							previous === (previous = stringify({ method, args, stack })) &&
-							can_dedupe.includes(method) &&
-							args.every((arg) => !arg || typeof arg !== 'object')
-						) {
-							send({ action: 'console', command: 'duplicate' });
-						} else {
-							methods[method](...args);
-						}
-
-						original(...args);
-					};
-				}
-			})();
-		</script>
-	</head>
-	<body></body>
-</html>
diff --git a/sites/svelte-5-preview/src/lib/Repl.svelte b/sites/svelte-5-preview/src/lib/Repl.svelte
deleted file mode 100644
index f43f5f899b84..000000000000
--- a/sites/svelte-5-preview/src/lib/Repl.svelte
+++ /dev/null
@@ -1,438 +0,0 @@
-<script>
-	import { EditorState } from '@codemirror/state';
-	import { SplitPane } from '@rich_harris/svelte-split-pane';
-	import { BROWSER } from 'esm-env';
-	import { createEventDispatcher } from 'svelte';
-	import { derived, writable } from 'svelte/store';
-	import Bundler from './Bundler.js';
-	import ComponentSelector from './Input/ComponentSelector.svelte';
-	import ModuleEditor from './Input/ModuleEditor.svelte';
-	import InputOutputToggle from './InputOutputToggle.svelte';
-	import Output from './Output/Output.svelte';
-	import { set_repl_context } from './context.js';
-	import { get_full_filename } from './utils.js';
-	import Compiler from './Output/Compiler.js';
-
-	export let packagesUrl = 'https://unpkg.com';
-	export let svelteUrl = `${BROWSER ? location.origin : ''}/svelte`;
-	export let embedded = false;
-	/** @type {'columns' | 'rows'} */
-	export let orientation = 'columns';
-	export let relaxed = false;
-	export let fixed = false;
-	export let fixedPos = 50;
-	export let injectedJS = '';
-	export let injectedCSS = '';
-	/** @type {'light' | 'dark'} */
-	export let previewTheme = 'light';
-	export let showModified = false;
-	export let showAst = false;
-	export let autocomplete = true;
-
-	let runes = false;
-
-	export function toJSON() {
-		return {
-			imports: $bundle?.imports ?? [],
-			files: $files
-		};
-	}
-
-	/**
-	 * @param {{ files: import('./types').File[], css?: string }} data
-	 */
-	export async function set(data) {
-		$files = data.files;
-		$selected_name = 'App.svelte';
-
-		rebundle();
-
-		// Wait for editors to be ready
-		await $module_editor?.isReady;
-
-		await $module_editor?.set({ code: data.files[0].source, lang: data.files[0].type });
-
-		injectedCSS = data.css || '';
-
-		// when we set new files we also populate the EDITOR_STATE_MAP
-		// with a new state for each file containing the source as docs
-		// this allows the editor to behave correctly when renaming a tab
-		// after having loaded the files externally
-		populate_editor_state();
-
-		dispatch('change', { files: $files });
-	}
-
-	export function markSaved() {
-		$files = $files.map((val) => ({ ...val, modified: false }));
-	}
-
-	/** @type {ReturnType<typeof createEventDispatcher<{ change: { files: import('./types').File[] } }>>} */
-	const dispatch = createEventDispatcher();
-
-	/**
-	 * @typedef {import('./types').ReplContext} ReplContext
-	 */
-
-	/** @type {import('svelte/compiler').CompileOptions} */
-	const DEFAULT_COMPILE_OPTIONS = {
-		generate: 'client',
-		dev: false,
-		hmr: false,
-		css: 'external'
-	};
-
-	/** @type {Map<string, import('@codemirror/state').EditorState>} */
-	const EDITOR_STATE_MAP = new Map();
-
-	/** @type {ReplContext['files']} */
-	const files = writable([]);
-
-	/** @type {ReplContext['selected_name']} */
-	const selected_name = writable('App.svelte');
-
-	/** @type {ReplContext['selected']} */
-	const selected = derived([files, selected_name], ([$files, $selected_name]) => {
-		return (
-			$files.find((val) => get_full_filename(val) === $selected_name) ?? {
-				name: '',
-				type: '',
-				source: '',
-				modified: false
-			}
-		);
-	});
-
-	/** @type {ReplContext['bundle']} */
-	const bundle = writable(null);
-
-	/** @type {ReplContext['compile_options']} */
-	const compile_options = writable(DEFAULT_COMPILE_OPTIONS);
-
-	/** @type {ReplContext['cursor_pos']} */
-	const cursor_pos = writable(0);
-
-	/** @type {ReplContext['module_editor']} */
-	const module_editor = writable(null);
-
-	/** @type {ReplContext['toggleable']} */
-	const toggleable = writable(false);
-
-	/** @type {ReplContext['bundler']} */
-	const bundler = writable(null);
-
-	/** @type {ReplContext['bundling']} */
-	const bundling = writable(new Promise(() => {}));
-
-	set_repl_context({
-		files,
-		selected_name,
-		selected,
-		bundle,
-		bundler,
-		bundling,
-		compile_options,
-		cursor_pos,
-		module_editor,
-		toggleable,
-
-		EDITOR_STATE_MAP,
-
-		rebundle,
-		migrate,
-		clear_state,
-		go_to_warning_pos,
-		handle_change,
-		handle_select
-	});
-
-	/** @type {Symbol}  */
-	let current_token;
-	async function rebundle() {
-		const token = (current_token = Symbol());
-		let resolver = () => {};
-		$bundling = new Promise((resolve) => {
-			resolver = resolve;
-		});
-		const result = await $bundler?.bundle($files);
-		if (result && token === current_token) $bundle = result;
-		resolver();
-	}
-
-	async function migrate() {
-		if (!compiler || $selected?.type !== 'svelte') return;
-
-		const result = await compiler.migrate($selected);
-		if (result.error) {
-			// TODO show somehow
-			return;
-		}
-
-		const new_files = $files.map((file) => {
-			if (file.name === $selected?.name) {
-				return {
-					...file,
-					source: result.result.code
-				};
-			}
-			return file;
-		});
-		set({ files: new_files });
-	}
-
-	let is_select_changing = false;
-
-	/**
-	 * @param {string} filename
-	 */
-	async function handle_select(filename) {
-		is_select_changing = true;
-
-		$selected_name = filename;
-
-		if (!$selected) return;
-
-		await $module_editor?.set({ code: $selected.source, lang: $selected.type });
-
-		if (EDITOR_STATE_MAP.has(filename)) {
-			$module_editor?.setEditorState(EDITOR_STATE_MAP.get(filename));
-		} else {
-			$module_editor?.clearEditorState();
-		}
-
-		is_select_changing = false;
-	}
-
-	/**
-	 * @param {CustomEvent<{ value: string }>} event
-	 */
-	async function handle_change(event) {
-		if (is_select_changing) return;
-
-		files.update(($files) => {
-			const file = { ...$selected };
-
-			file.source = event.detail.value;
-			file.modified = true;
-
-			const idx = $files.findIndex((val) => get_full_filename(val) === $selected_name);
-
-			// @ts-ignore
-			$files[idx] = file;
-
-			return $files;
-		});
-
-		if (!$selected) return;
-
-		EDITOR_STATE_MAP.set(get_full_filename($selected), $module_editor?.getEditorState());
-
-		dispatch('change', {
-			files: $files
-		});
-
-		rebundle();
-	}
-
-	/** @param {import('./types').MessageDetails | undefined} item */
-	async function go_to_warning_pos(item) {
-		if (!item) return;
-
-		// If its a bundler error, can't do anything about it
-		if (!item.filename) return;
-
-		await handle_select(item.filename);
-
-		$module_editor?.focus();
-		$module_editor?.setCursor(item.start.character);
-	}
-
-	/** Deletes all editor state */
-	function clear_state() {
-		$module_editor?.clearEditorState();
-
-		EDITOR_STATE_MAP.clear();
-	}
-
-	function populate_editor_state() {
-		for (const file of $files) {
-			EDITOR_STATE_MAP.set(
-				get_full_filename(file),
-				EditorState.create({
-					doc: file.source
-				}).toJSON()
-			);
-		}
-	}
-
-	const compiler = BROWSER ? new Compiler(svelteUrl) : null;
-
-	/** @type {import('./workers/workers').CompileMessageData | null} */
-	let compiled = null;
-
-	/**
-	 * @param {import('./types').File | null} $selected
-	 * @param {import('svelte/compiler').CompileOptions} $compile_options
-	 */
-	async function recompile($selected, $compile_options) {
-		if (!compiler || !$selected) return;
-
-		if ($selected.type === 'svelte' || $selected.type === 'js') {
-			compiled = await compiler.compile($selected, $compile_options, true);
-			runes = compiled.result.metadata?.runes ?? false;
-		} else {
-			runes = false;
-		}
-	}
-
-	$: recompile($selected, $compile_options);
-
-	$: mobile = width < 540;
-
-	$: $toggleable = mobile && orientation === 'columns';
-
-	let width = 0;
-	let show_output = false;
-
-	/** @type {string | null} */
-	let status = null;
-	let status_visible = false;
-
-	/** @type {NodeJS.Timeout | undefined} */
-	let status_timeout = undefined;
-
-	$bundler = BROWSER
-		? new Bundler({
-				packages_url: packagesUrl,
-				svelte_url: svelteUrl,
-				onstatus: (message) => {
-					if (message) {
-						// show bundler status, but only after time has elapsed, to
-						// prevent the banner flickering
-						if (!status_visible && !status_timeout) {
-							status_timeout = setTimeout(() => {
-								status_visible = true;
-							}, 400);
-						}
-					} else {
-						clearTimeout(status_timeout);
-						status_visible = false;
-						status_timeout = undefined;
-					}
-
-					status = message;
-				}
-			})
-		: null;
-
-	/**
-	 * @param {BeforeUnloadEvent} event
-	 */
-	function before_unload(event) {
-		if (showModified && $files.find((file) => file.modified)) {
-			event.preventDefault();
-			event.returnValue = '';
-		}
-	}
-</script>
-
-<svelte:window on:beforeunload={before_unload} />
-
-<div class="container" class:toggleable={$toggleable} bind:clientWidth={width}>
-	<div class="viewport" class:output={show_output}>
-		<SplitPane
-			--color="var(--sk-text-4)"
-			id="main"
-			type={orientation === 'rows' ? 'vertical' : 'horizontal'}
-			pos="{mobile || fixed ? fixedPos : orientation === 'rows' ? 60 : 50}%"
-			min="100px"
-			max="-4.1rem"
-		>
-			<section slot="a">
-				<ComponentSelector show_modified={showModified} {runes} on:add on:remove />
-				<ModuleEditor
-					{autocomplete}
-					error={compiled?.result.error}
-					warnings={compiled?.result.warnings ?? []}
-				/>
-			</section>
-
-			<section slot="b" style="height: 100%;">
-				<Output
-					status={status_visible ? status : null}
-					{embedded}
-					{relaxed}
-					{injectedJS}
-					{injectedCSS}
-					{showAst}
-					{previewTheme}
-					selected={$selected}
-					{compiled}
-				/>
-			</section>
-		</SplitPane>
-	</div>
-
-	{#if $toggleable}
-		<InputOutputToggle bind:checked={show_output} />
-	{/if}
-</div>
-
-<style>
-	.container {
-		position: relative;
-		width: 100%;
-		height: calc(100dvh - var(--sk-nav-height));
-		background: var(--sk-back-1);
-	}
-
-	.container :global(section) {
-		position: relative;
-		padding: 42px 0 0 0;
-		height: 100%;
-		box-sizing: border-box;
-	}
-
-	.container :global(section) > :global(*):first-child {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 42px;
-		box-sizing: border-box;
-	}
-
-	.container :global(section) > :global(*):last-child {
-		width: 100%;
-		height: 100%;
-	}
-
-	.viewport {
-		height: 100%;
-	}
-
-	.toggleable .viewport {
-		width: 200%;
-		height: calc(100% - 42px);
-		transition: transform 0.3s;
-	}
-
-	.toggleable .viewport.output {
-		transform: translate(-50%);
-	}
-
-	/* on mobile, override the <SplitPane> controls */
-	@media (max-width: 799px) {
-		:global([data-pane='main']) {
-			--pos: 50% !important;
-		}
-
-		:global([data-pane='editor']) {
-			--pos: 5.4rem !important;
-		}
-
-		:global([data-pane]) :global(.divider) {
-			cursor: default;
-		}
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/lib/autocomplete.js b/sites/svelte-5-preview/src/lib/autocomplete.js
deleted file mode 100644
index b535c7ff0416..000000000000
--- a/sites/svelte-5-preview/src/lib/autocomplete.js
+++ /dev/null
@@ -1,209 +0,0 @@
-import { snippetCompletion } from '@codemirror/autocomplete';
-import { syntaxTree } from '@codemirror/language';
-
-/** @typedef {(node: import('@lezer/common').SyntaxNode, context: import('@codemirror/autocomplete').CompletionContext, selected: import('./types').File) => boolean} Test */
-
-/**
- * Returns `true` if `$bindable()` is valid
- * @type {Test}
- */
-function is_bindable(node, context) {
-	// disallow outside `let { x = $bindable }`
-	if (node.parent?.name !== 'PatternProperty') return false;
-	if (node.parent.parent?.name !== 'ObjectPattern') return false;
-	if (node.parent.parent.parent?.name !== 'VariableDeclaration') return false;
-
-	let last = node.parent.parent.parent.lastChild;
-	if (!last) return true;
-
-	// if the declaration is incomplete, assume the best
-	if (last.name === 'ObjectPattern' || last.name === 'Equals' || last.name === '⚠') {
-		return true;
-	}
-
-	if (last.name === ';') {
-		last = last.prevSibling;
-		if (!last || last.name === '⚠') return true;
-	}
-
-	// if the declaration is complete, only return true if it is a `$props()` declaration
-	return (
-		last.name === 'CallExpression' &&
-		last.firstChild?.name === 'VariableName' &&
-		context.state.sliceDoc(last.firstChild.from, last.firstChild.to) === '$props'
-	);
-}
-
-/**
- * Returns `true` if `$props()` is valid
- * TODO only allow in `.svelte` files, and only at the top level
- * @type {Test}
- */
-function is_props(node, _, selected) {
-	if (selected.type !== 'svelte') return false;
-
-	return (
-		node.name === 'VariableName' &&
-		node.parent?.name === 'VariableDeclaration' &&
-		node.parent.parent?.name === 'Script'
-	);
-}
-
-/**
- * Returns `true` is this is a valid place to declare state
- * @type {Test}
- */
-function is_state(node) {
-	let parent = node.parent;
-
-	if (node.name === '.' || node.name === 'PropertyName') {
-		if (parent?.name !== 'MemberExpression') return false;
-		parent = parent.parent;
-	}
-
-	if (!parent) return false;
-
-	return parent.name === 'VariableDeclaration' || parent.name === 'PropertyDeclaration';
-}
-
-/**
- * Returns `true` if we're already in a valid call expression, e.g.
- * changing an existing `$state()` to `$state.raw()`
- * @type {Test}
- */
-function is_state_call(node) {
-	let parent = node.parent;
-
-	if (node.name === '.' || node.name === 'PropertyName') {
-		if (parent?.name !== 'MemberExpression') return false;
-		parent = parent.parent;
-	}
-
-	if (parent?.name !== 'CallExpression') {
-		return false;
-	}
-
-	parent = parent.parent;
-	if (!parent) return false;
-
-	return parent.name === 'VariableDeclaration' || parent.name === 'PropertyDeclaration';
-}
-
-/** @type {Test} */
-function is_statement(node) {
-	if (node.name === 'VariableName') {
-		return node.parent?.name === 'ExpressionStatement';
-	}
-
-	if (node.name === '.' || node.name === 'PropertyName') {
-		return node.parent?.parent?.name === 'ExpressionStatement';
-	}
-
-	return false;
-}
-
-/** @type {Array<{ snippet: string, test?: Test }>} */
-const runes = [
-	{ snippet: '$state(${})', test: is_state },
-	{ snippet: '$state', test: is_state_call },
-	{ snippet: '$props()', test: is_props },
-	{ snippet: '$derived(${});', test: is_state },
-	{ snippet: '$derived', test: is_state_call },
-	{ snippet: '$derived.by(() => {\n\t${}\n});', test: is_state },
-	{ snippet: '$derived.by', test: is_state_call },
-	{ snippet: '$effect(() => {\n\t${}\n});', test: is_statement },
-	{ snippet: '$effect.pre(() => {\n\t${}\n});', test: is_statement },
-	{ snippet: '$state.raw(${});', test: is_state },
-	{ snippet: '$state.raw', test: is_state_call },
-	{ snippet: '$bindable()', test: is_bindable },
-	{ snippet: '$effect.root(() => {\n\t${}\n})' },
-	{ snippet: '$state.snapshot(${})' },
-	{ snippet: '$effect.tracking()' },
-	{ snippet: '$inspect(${});', test: is_statement }
-];
-
-const options = runes.map(({ snippet, test }, i) => ({
-	option: snippetCompletion(snippet, {
-		type: 'keyword',
-		boost: runes.length - i,
-		label: snippet.includes('(') ? snippet.slice(0, snippet.indexOf('(')) : snippet
-	}),
-	test
-}));
-
-/**
- * @param {import('@codemirror/autocomplete').CompletionContext} context
- * @param {import('./types.js').File} selected
- * @param {import('./types.js').File[]} files
- */
-export function autocomplete(context, selected, files) {
-	let node = syntaxTree(context.state).resolveInner(context.pos, -1);
-
-	if (node.name === 'String' && node.parent?.name === 'ImportDeclaration') {
-		const modules = [
-			'svelte',
-			'svelte/animate',
-			'svelte/easing',
-			'svelte/events',
-			'svelte/legacy',
-			'svelte/motion',
-			'svelte/reactivity',
-			'svelte/store',
-			'svelte/transition'
-		];
-
-		for (const file of files) {
-			if (file === selected) continue;
-			modules.push(`./${file.name}.${file.type}`);
-		}
-
-		return {
-			from: node.from + 1,
-			options: modules.map((label) => ({
-				label,
-				type: 'string'
-			}))
-		};
-	}
-
-	if (
-		selected.type !== 'svelte' &&
-		(selected.type !== 'js' || !selected.name.endsWith('.svelte'))
-	) {
-		return false;
-	}
-
-	if (node.name === 'VariableName' || node.name === 'PropertyName' || node.name === '.') {
-		// special case — `$inspect(...).with(...)` is the only rune that 'returns'
-		// an 'object' with a 'method'
-		if (node.name === 'PropertyName' || node.name === '.') {
-			if (
-				node.parent?.name === 'MemberExpression' &&
-				node.parent.firstChild?.name === 'CallExpression' &&
-				node.parent.firstChild.firstChild?.name === 'VariableName' &&
-				context.state.sliceDoc(
-					node.parent.firstChild.firstChild.from,
-					node.parent.firstChild.firstChild.to
-				) === '$inspect'
-			) {
-				const open = context.matchBefore(/\.\w*/);
-				if (!open) return null;
-
-				return {
-					from: open.from,
-					options: [snippetCompletion('.with(${})', { type: 'keyword', label: '.with' })]
-				};
-			}
-		}
-
-		const open = context.matchBefore(/\$[\w\.]*/);
-		if (!open) return null;
-
-		return {
-			from: open.from,
-			options: options
-				.filter((option) => (option.test ? option.test(node, context, selected) : true))
-				.map((option) => option.option)
-		};
-	}
-}
diff --git a/sites/svelte-5-preview/src/lib/context.js b/sites/svelte-5-preview/src/lib/context.js
deleted file mode 100644
index e983e6d147af..000000000000
--- a/sites/svelte-5-preview/src/lib/context.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import { getContext, setContext } from 'svelte';
-
-const key = Symbol('repl');
-
-/** @returns {import("./types").ReplContext} */
-export function get_repl_context() {
-	return getContext(key);
-}
-
-/** @param {import("./types").ReplContext} value */
-export function set_repl_context(value) {
-	setContext(key, value);
-}
diff --git a/sites/svelte-5-preview/src/lib/index.js b/sites/svelte-5-preview/src/lib/index.js
deleted file mode 100644
index 969b64140852..000000000000
--- a/sites/svelte-5-preview/src/lib/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './Repl.svelte';
diff --git a/sites/svelte-5-preview/src/lib/theme.js b/sites/svelte-5-preview/src/lib/theme.js
deleted file mode 100644
index 867e144acc50..000000000000
--- a/sites/svelte-5-preview/src/lib/theme.js
+++ /dev/null
@@ -1,153 +0,0 @@
-import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
-import { EditorView } from '@codemirror/view';
-import { tags as t } from '@lezer/highlight';
-
-const ERROR_HUE = 0;
-const WARNING_HUE = 40;
-
-const WARNING_FG = `hsl(${WARNING_HUE} 100% 60%)`;
-const WARNING_BG = `hsl(${WARNING_HUE} 100% 40% / 0.5)`;
-
-const ERROR_FG = `hsl(${ERROR_HUE} 100% 40%)`;
-const ERROR_BG = `hsl(${ERROR_HUE} 100% 40% / 0.5)`;
-
-/**
- * @param {string} content
- * @param {string} attrs
- */
-function svg(content, attrs = `viewBox="0 0 40 40"`) {
-	return `url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" ${attrs}>${encodeURIComponent(
-		content
-	)}</svg>')`;
-}
-
-/**
- * @param {string} color
- */
-function underline(color) {
-	return svg(
-		`<path d="m0 3.5 l2 -1.5 l1 0 l2 1.5 l1 0" stroke="${color}" fill="none" stroke-width="1"/>`,
-		`width="6" height="4"`
-	);
-}
-
-const svelteThemeStyles = EditorView.theme(
-	{
-		'&': {
-			color: 'var(--sk-code-base)',
-			backgroundColor: 'transparent'
-		},
-
-		'.cm-content': {
-			caretColor: 'var(--sk-theme-3)'
-		},
-
-		'.cm-cursor, .cm-dropCursor': { borderLeftColor: 'var(--sk-theme-3)' },
-		'&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection':
-			{ backgroundColor: 'var(--sk-selection-color)' },
-
-		'.cm-panels': { backgroundColor: 'var(--sk-back-2)', color: 'var(--sk-text-2)' },
-		'.cm-panels.cm-panels-top': { borderBottom: '2px solid black' },
-		'.cm-panels.cm-panels-bottom': { borderTop: '2px solid black' },
-
-		'.cm-searchMatch': {
-			backgroundColor: 'var(--sk-theme-2)'
-			// outline: '1px solid #457dff',
-		},
-		'.cm-searchMatch.cm-searchMatch-selected': {
-			backgroundColor: '#6199ff2f'
-		},
-
-		'.cm-activeLine': { backgroundColor: '#6699ff0b' },
-		'.cm-selectionMatch': { backgroundColor: '#aafe661a' },
-
-		'&.cm-focused .cm-matchingBracket, &.cm-focused .cm-nonmatchingBracket': {
-			backgroundColor: '#bad0f847'
-		},
-
-		'.cm-gutters': {
-			backgroundColor: 'var(--sk-back-3)',
-			border: 'none'
-		},
-
-		'.cm-activeLineGutter': {
-			backgroundColor: 'var(--sk-back-4)'
-		},
-
-		'.cm-foldPlaceholder': {
-			backgroundColor: 'transparent',
-			border: 'none',
-			color: '#ddd'
-		},
-
-		// https://github.com/codemirror/lint/blob/271b35f5d31a7e3645eaccbfec608474022098e1/src/lint.ts#L620
-		'.cm-lintRange': {
-			backgroundPosition: 'left bottom',
-			backgroundRepeat: 'repeat-x',
-			paddingBottom: '4px'
-		},
-		'.cm-lintRange-error': {
-			backgroundImage: underline(ERROR_FG)
-		},
-		'.cm-lintRange-warning': {
-			backgroundImage: underline(WARNING_FG)
-		},
-		'.cm-tooltip .cm-tooltip-arrow:before': {
-			borderTopColor: 'transparent',
-			borderBottomColor: 'transparent'
-		},
-		'.cm-tooltip .cm-tooltip-arrow:after': {
-			borderTopColor: 'var(--sk-back-3)',
-			borderBottomColor: 'var(--sk-back-3)'
-		},
-		'.cm-tooltip-autocomplete': {
-			color: 'var(--sk-text-2) !important',
-			perspective: '1px',
-			'& > ul > li[aria-selected]': {
-				backgroundColor: 'var(--sk-back-4)',
-				color: 'var(--sk-text-1) !important'
-			}
-		}
-	},
-	{ dark: true }
-);
-
-/// The highlighting style for code in the One Dark theme.
-const svelteHighlightStyle = HighlightStyle.define([
-	{ tag: t.keyword, color: 'var(--sk-code-keyword)' },
-	{
-		tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
-		color: 'var(--sk-code-base)'
-	},
-	{ tag: [t.function(t.variableName), t.labelName], color: 'var(--sk-code-tags)' },
-	{ tag: [t.color, t.constant(t.name), t.standard(t.name)], color: 'var(--sk-code-base)' },
-	{ tag: [t.definition(t.name), t.separator], color: 'var(--sk-code-base)' },
-	{
-		tag: [
-			t.typeName,
-			t.className,
-			t.number,
-			t.changed,
-			t.annotation,
-			t.modifier,
-			t.self,
-			t.namespace
-		],
-		color: 'var(--sk-code-tags)'
-	},
-	{
-		tag: [t.operator, t.operatorKeyword, t.url, t.escape, t.regexp, t.link, t.special(t.string)],
-		color: 'var(--sk-code-base)'
-	},
-	{ tag: [t.meta, t.comment], color: 'var(--sk-code-comment)' },
-	{ tag: t.strong, fontWeight: 'bold' },
-	{ tag: t.emphasis, fontStyle: 'italic' },
-	{ tag: t.strikethrough, textDecoration: 'line-through' },
-	{ tag: t.link, color: 'var(--sk-code-base)', textDecoration: 'underline' },
-	{ tag: t.heading, fontWeight: 'bold', color: 'var(--sk-text-1)' },
-	{ tag: [t.atom, t.bool], color: 'var(--sk-code-atom)' },
-	{ tag: [t.processingInstruction, t.string, t.inserted], color: 'var(--sk-code-string)' },
-	{ tag: t.invalid, color: '#ff008c' }
-]);
-
-export const svelteTheme = [svelteThemeStyles, syntaxHighlighting(svelteHighlightStyle)];
diff --git a/sites/svelte-5-preview/src/lib/types.d.ts b/sites/svelte-5-preview/src/lib/types.d.ts
deleted file mode 100644
index a758846d293b..000000000000
--- a/sites/svelte-5-preview/src/lib/types.d.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-import type { EditorState } from '@codemirror/state';
-import { OutputChunk, RollupError } from '@rollup/browser';
-import type { Readable, Writable } from 'svelte/store';
-import type { CompileOptions, CompileError } from 'svelte/compiler';
-
-export type Lang = 'js' | 'svelte' | 'json' | 'md' | 'css' | (string & Record<never, never>);
-
-type StartOrEnd = {
-	line: number;
-	column: number;
-	character: number;
-};
-
-export type MessageDetails = {
-	start: StartOrEnd;
-	end: StartOrEnd;
-	filename: string;
-	message: string;
-};
-
-export type Warning = MessageDetails;
-
-export type Bundle = {
-	uid: number;
-	client: OutputChunk | null;
-	error: (RollupError & CompileError) | null;
-	server: OutputChunk | null;
-	imports: string[];
-	warnings: Warning[];
-};
-
-export type File = {
-	name: string;
-	source: string;
-	type: Lang;
-	modified?: boolean;
-};
-
-export type ReplState = {
-	files: File[];
-	selected_name: string;
-	selected: File | null;
-	bundle: Bundle | null;
-	bundling: Promise<void>;
-	bundler: import('./Bundler').default | null;
-	compile_options: CompileOptions;
-	cursor_pos: number;
-	toggleable: boolean;
-	module_editor: import('./CodeMirror.svelte').default | null;
-};
-
-export type ReplContext = {
-	files: Writable<ReplState['files']>;
-	selected_name: Writable<ReplState['selected_name']>;
-	selected: Readable<ReplState['selected']>;
-	bundle: Writable<ReplState['bundle']>;
-	bundling: Writable<ReplState['bundling']>;
-	bundler: Writable<ReplState['bundler']>;
-	compile_options: Writable<ReplState['compile_options']>;
-	cursor_pos: Writable<ReplState['cursor_pos']>;
-	toggleable: Writable<ReplState['toggleable']>;
-	module_editor: Writable<ReplState['module_editor']>;
-
-	EDITOR_STATE_MAP: Map<string, EditorState>;
-
-	// Methods
-	rebundle(): Promise<void>;
-	migrate(): Promise<void>;
-	handle_select(filename: string): Promise<void>;
-	handle_change(
-		event: CustomEvent<{
-			value: string;
-		}>
-	): Promise<void>;
-	go_to_warning_pos(item?: MessageDetails): Promise<void>;
-	clear_state(): void;
-};
diff --git a/sites/svelte-5-preview/src/lib/utils.js b/sites/svelte-5-preview/src/lib/utils.js
deleted file mode 100644
index d378e1d51744..000000000000
--- a/sites/svelte-5-preview/src/lib/utils.js
+++ /dev/null
@@ -1,16 +0,0 @@
-/**
- * @param {number} min
- * @param {number} max
- * @param {number} value
- */
-export const clamp = (min, max, value) => Math.max(min, Math.min(max, value));
-
-/**
- * @param {number} ms
- */
-export const sleep = (ms) => new Promise((f) => setTimeout(f, ms));
-
-/** @param {import('./types').File} file */
-export function get_full_filename(file) {
-	return `${file.name}.${file.type}`;
-}
diff --git a/sites/svelte-5-preview/src/lib/workers/bundler/index.js b/sites/svelte-5-preview/src/lib/workers/bundler/index.js
deleted file mode 100644
index 5a289fff7dcf..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/bundler/index.js
+++ /dev/null
@@ -1,576 +0,0 @@
-/// <reference lib="webworker" />
-
-import '../patch_window.js';
-import { sleep } from '$lib/utils.js';
-import { rollup } from '@rollup/browser';
-import { DEV } from 'esm-env';
-import * as resolve from 'resolve.exports';
-import commonjs from './plugins/commonjs.js';
-import glsl from './plugins/glsl.js';
-import json from './plugins/json.js';
-import replace from './plugins/replace.js';
-import loop_protect from './plugins/loop-protect.js';
-
-/** @type {string} */
-var pkg_name;
-
-/** @type {string} */
-let packages_url;
-
-/** @type {string} */
-let svelte_url;
-
-/** @type {number} */
-let current_id;
-
-/** @type {(arg?: never) => void} */
-let fulfil_ready;
-const ready = new Promise((f) => {
-	fulfil_ready = f;
-});
-
-/**
- * @type {{
- *   compile: typeof import('svelte/compiler').compile;
- *   compileModule: typeof import('svelte/compiler').compileModule;
- *   VERSION: string;
- * }}
- */
-let svelte;
-
-self.addEventListener(
-	'message',
-	/** @param {MessageEvent<import('../workers.js').BundleMessageData>} event */ async (event) => {
-		switch (event.data.type) {
-			case 'init': {
-				({ packages_url, svelte_url } = event.data);
-
-				const { version } = await fetch(`${svelte_url}/package.json`).then((r) => r.json());
-				console.log(`Using Svelte compiler version ${version}`);
-
-				const compiler = await fetch(`${svelte_url}/compiler/index.js`).then((r) => r.text());
-				(0, eval)(compiler + '\n//# sourceURL=compiler/index.js@' + version);
-
-				svelte = globalThis.svelte;
-
-				fulfil_ready();
-				break;
-			}
-
-			case 'bundle': {
-				await ready;
-				const { uid, files } = event.data;
-
-				if (files.length === 0) return;
-
-				current_id = uid;
-
-				setTimeout(async () => {
-					if (current_id !== uid) return;
-
-					const result = await bundle({ uid, files });
-
-					if (JSON.stringify(result.error) === JSON.stringify(ABORT)) return;
-					if (result && uid === current_id) postMessage(result);
-				});
-
-				break;
-			}
-		}
-	}
-);
-
-/** @type {Record<'client' | 'server', Map<string, { code: string, result: ReturnType<typeof svelte.compile> }>>} */
-let cached = {
-	client: new Map(),
-	server: new Map()
-};
-
-const ABORT = { aborted: true };
-
-/** @type {Map<string, Promise<{ url: string; body: string; }>>} */
-const FETCH_CACHE = new Map();
-
-/**
- * @param {string} url
- * @param {number} uid
- */
-async function fetch_if_uncached(url, uid) {
-	if (FETCH_CACHE.has(url)) {
-		return FETCH_CACHE.get(url);
-	}
-
-	// TODO: investigate whether this is necessary
-	await sleep(50);
-	if (uid !== current_id) throw ABORT;
-
-	const promise = fetch(url)
-		.then(async (r) => {
-			if (!r.ok) throw new Error(await r.text());
-
-			return {
-				url: r.url,
-				body: await r.text()
-			};
-		})
-		.catch((err) => {
-			FETCH_CACHE.delete(url);
-			throw err;
-		});
-
-	FETCH_CACHE.set(url, promise);
-	return promise;
-}
-
-/**
- * @param {string} url
- * @param {number} uid
- */
-async function follow_redirects(url, uid) {
-	const res = await fetch_if_uncached(url, uid);
-	return res?.url;
-}
-
-/**
- *
- * @param {number} major
- * @param {number} minor
- * @param {number} patch
- * @returns {number}
- */
-function compare_to_version(major, minor, patch) {
-	const v = svelte.VERSION.match(/^(\d+)\.(\d+)\.(\d+)/);
-
-	// @ts-ignore
-	return +v[1] - major || +v[2] - minor || +v[3] - patch;
-}
-
-function is_v4() {
-	return compare_to_version(4, 0, 0) >= 0;
-}
-
-function is_v5() {
-	return compare_to_version(5, 0, 0) >= 0;
-}
-
-function is_legacy_package_structure() {
-	return compare_to_version(3, 4, 4) <= 0;
-}
-
-function has_loopGuardTimeout_feature() {
-	return compare_to_version(3, 14, 0) >= 0;
-}
-
-/**
- *
- * @param {Record<string, unknown>} pkg
- * @param {string} subpath
- * @param {number} uid
- * @param {string} pkg_url_base
- */
-async function resolve_from_pkg(pkg, subpath, uid, pkg_url_base) {
-	// match legacy Rollup logic — pkg.svelte takes priority over pkg.exports
-	if (typeof pkg.svelte === 'string' && subpath === '.') {
-		return pkg.svelte;
-	}
-
-	// modern
-	if (pkg.exports) {
-		try {
-			const [resolved] =
-				resolve.exports(pkg, subpath, {
-					browser: true,
-					conditions: ['svelte', 'development']
-				}) ?? [];
-
-			return resolved;
-		} catch {
-			throw `no matched export path was found in "${pkg_name}/package.json"`;
-		}
-	}
-
-	// legacy
-	if (subpath === '.') {
-		let resolved_id = resolve.legacy(pkg, {
-			fields: ['browser', 'module', 'main']
-		});
-
-		if (typeof resolved_id === 'object' && !Array.isArray(resolved_id)) {
-			const subpath = resolved_id['.'];
-			if (subpath === false) return 'data:text/javascript,export {}';
-
-			resolved_id =
-				subpath ??
-				resolve.legacy(pkg, {
-					fields: ['module', 'main']
-				});
-		}
-
-		if (!resolved_id) {
-			// last ditch — try to match index.js/index.mjs
-			for (const index_file of ['index.mjs', 'index.js']) {
-				try {
-					const indexUrl = new URL(index_file, `${pkg_url_base}/`).href;
-					return (await follow_redirects(indexUrl, uid)) ?? '';
-				} catch {
-					// maybe the next option will be successful
-				}
-			}
-
-			throw `could not find entry point in "${pkg_name}/package.json"`;
-		}
-
-		return resolved_id;
-	}
-
-	if (typeof pkg.browser === 'object') {
-		// this will either return `pkg.browser[subpath]` or `subpath`
-		return resolve.legacy(pkg, {
-			browser: subpath
-		});
-	}
-
-	return subpath;
-}
-
-/**
- * @param {number} uid
- * @param {'client' | 'server'} mode
- * @param {typeof cached['client']} cache
- * @param {Map<string, import('$lib/types.js').File>} local_files_lookup
- */
-async function get_bundle(uid, mode, cache, local_files_lookup) {
-	let bundle;
-
-	/** A set of package names (without subpaths) to include in pkg.devDependencies when downloading an app */
-	/** @type {Set<string>} */
-	const imports = new Set();
-
-	/** @type {import('$lib/types.js').Warning[]} */
-	const warnings = [];
-
-	/** @type {{ message: string }[]} */
-	const all_warnings = [];
-
-	/** @type {typeof cache} */
-	const new_cache = new Map();
-
-	/** @type {import('@rollup/browser').Plugin} */
-	const repl_plugin = {
-		name: 'svelte-repl',
-		async resolveId(importee, importer) {
-			if (uid !== current_id) throw ABORT;
-
-			if (importee === 'esm-env') return importee;
-
-			const v5 = is_v5();
-			const v4 = !v5 && is_v4();
-
-			if (!v5) {
-				// importing from Svelte
-				if (importee === `svelte`)
-					return v4 ? `${svelte_url}/src/runtime/index.js` : `${svelte_url}/index.mjs`;
-
-				if (importee.startsWith(`svelte/`)) {
-					const sub_path = importee.slice(7);
-					if (v4) {
-						return `${svelte_url}/src/runtime/${sub_path}/index.js`;
-					}
-
-					return is_legacy_package_structure()
-						? `${svelte_url}/${sub_path}.mjs`
-						: `${svelte_url}/${sub_path}/index.mjs`;
-				}
-			}
-
-			// importing from another file in REPL
-			if (local_files_lookup.has(importee) && (!importer || local_files_lookup.has(importer)))
-				return importee;
-			if (local_files_lookup.has(importee + '.js')) return importee + '.js';
-			if (local_files_lookup.has(importee + '.json')) return importee + '.json';
-
-			// remove trailing slash
-			if (importee.endsWith('/')) importee = importee.slice(0, -1);
-
-			// importing from a URL
-			if (/^https?:/.test(importee)) return importee;
-
-			if (importee.startsWith('.')) {
-				if (importer && local_files_lookup.has(importer)) {
-					// relative import in a REPL file
-					// should've matched above otherwise importee doesn't exist
-					console.error(`Cannot find file "${importee}" imported by "${importer}" in the REPL`);
-					return;
-				} else {
-					// relative import in an external file
-					const url = new URL(importee, importer).href;
-					self.postMessage({ type: 'status', uid, message: `resolving ${url}` });
-
-					return await follow_redirects(url, uid);
-				}
-			} else {
-				// fetch from unpkg
-				self.postMessage({ type: 'status', uid, message: `resolving ${importee}` });
-
-				const match = /^((?:@[^/]+\/)?[^/]+)(\/.+)?$/.exec(importee);
-				if (!match) {
-					return console.error(`Invalid import "${importee}"`);
-				}
-
-				const pkg_name = match[1];
-				const subpath = `.${match[2] ?? ''}`;
-
-				// if this was imported by one of our files, add it to the `imports` set
-				if (importer && local_files_lookup.has(importer)) {
-					imports.add(pkg_name);
-				}
-
-				const fetch_package_info = async () => {
-					try {
-						const pkg_url = await follow_redirects(
-							`${pkg_name === 'svelte' ? '' : packages_url}/${pkg_name}/package.json`,
-							uid
-						);
-
-						if (!pkg_url) throw new Error();
-
-						const pkg_json = (await fetch_if_uncached(pkg_url, uid))?.body;
-						const pkg = JSON.parse(pkg_json ?? '""');
-
-						const pkg_url_base = pkg_url.replace(/\/package\.json$/, '');
-
-						return {
-							pkg,
-							pkg_url_base
-						};
-					} catch (_e) {
-						throw new Error(`Error fetching "${pkg_name}" from unpkg. Does the package exist?`);
-					}
-				};
-
-				const { pkg, pkg_url_base } = await fetch_package_info();
-
-				try {
-					const resolved_id = await resolve_from_pkg(pkg, subpath, uid, pkg_url_base);
-					return new URL(resolved_id + '', `${pkg_url_base}/`).href;
-				} catch (reason) {
-					throw new Error(`Cannot import "${importee}": ${reason}.`);
-				}
-			}
-		},
-		async load(resolved) {
-			if (uid !== current_id) throw ABORT;
-
-			if (resolved === 'esm-env') {
-				return `export const BROWSER = true; export const DEV = true`;
-			}
-
-			const cached_file = local_files_lookup.get(resolved);
-			if (cached_file) return cached_file.source;
-
-			if (!FETCH_CACHE.has(resolved)) {
-				self.postMessage({ type: 'status', uid, message: `fetching ${resolved}` });
-			}
-
-			const res = await fetch_if_uncached(resolved, uid);
-			return res?.body;
-		},
-		transform(code, id) {
-			if (uid !== current_id) throw ABORT;
-
-			self.postMessage({ type: 'status', uid, message: `bundling ${id}` });
-
-			if (!/\.(svelte|js)$/.test(id)) return null;
-
-			const name = id.split('/').pop()?.split('.')[0];
-
-			const cached_id = cache.get(id);
-			let result;
-
-			if (cached_id && cached_id.code === code) {
-				result = cached_id.result;
-			} else if (id.endsWith('.svelte')) {
-				result = svelte.compile(code, {
-					filename: name + '.svelte',
-					generate: 'client',
-					dev: true
-				});
-
-				if (result.css) {
-					result.js.code +=
-						'\n\n' +
-						`
-					const $$__style = document.createElement('style');
-					$$__style.textContent = ${JSON.stringify(result.css.code)};
-					document.head.append($$__style);
-				`.replace(/\t/g, '');
-				}
-			} else if (id.endsWith('.svelte.js')) {
-				result = svelte.compileModule(code, {
-					filename: name + '.js',
-					generate: 'client',
-					dev: true
-				});
-				if (!result) {
-					return null;
-				}
-			} else {
-				return null;
-			}
-
-			new_cache.set(id, { code, result });
-
-			// @ts-expect-error
-			(result.warnings || result.stats?.warnings)?.forEach((warning) => {
-				// This is required, otherwise postMessage won't work
-				// @ts-ignore
-				delete warning.toString;
-				// TODO remove stats post-launch
-				// @ts-ignore
-				warnings.push(warning);
-			});
-
-			/** @type {import('@rollup/browser').TransformResult} */
-			const transform_result = {
-				code: result.js.code,
-				map: result.js.map
-			};
-
-			return transform_result;
-		}
-	};
-
-	try {
-		bundle = await rollup({
-			input: './__entry.js',
-			plugins: [
-				repl_plugin,
-				commonjs,
-				json,
-				glsl,
-				loop_protect,
-				replace({
-					'process.env.NODE_ENV': JSON.stringify('production')
-				})
-			],
-			inlineDynamicImports: true,
-			onwarn(warning) {
-				all_warnings.push({
-					message: warning.message
-				});
-			}
-		});
-
-		return {
-			bundle,
-			imports: Array.from(imports),
-			cache: new_cache,
-			error: null,
-			warnings,
-			all_warnings
-		};
-	} catch (error) {
-		return { error, imports: null, bundle: null, cache: new_cache, warnings, all_warnings };
-	}
-}
-
-/**
- * @param {{ uid: number; files: import('$lib/types.js').File[] }} param0
- * @returns
- */
-async function bundle({ uid, files }) {
-	if (!DEV) {
-		console.clear();
-		console.log(`running Svelte compiler version %c${svelte.VERSION}`, 'font-weight: bold');
-	}
-
-	/** @type {Map<string, import('$lib/types').File>} */
-	const lookup = new Map();
-
-	lookup.set('./__entry.js', {
-		name: '__entry',
-		source: `
-			export { mount, unmount, untrack } from 'svelte';
-			export {default as App} from './App.svelte';
-		`,
-		type: 'js',
-		modified: false
-	});
-
-	files.forEach((file) => {
-		const path = `./${file.name}.${file.type}`;
-		lookup.set(path, file);
-	});
-
-	/** @type {Awaited<ReturnType<typeof get_bundle>>} */
-	let client = await get_bundle(uid, 'client', cached.client, lookup);
-	let error;
-
-	try {
-		if (client.error) {
-			throw client.error;
-		}
-
-		cached.client = client.cache;
-
-		const client_result = (
-			await client.bundle?.generate({
-				format: 'iife',
-				exports: 'named'
-				// sourcemap: 'inline'
-			})
-		)?.output[0];
-
-		const server = false // TODO how can we do SSR?
-			? await get_bundle(uid, 'server', cached.server, lookup)
-			: null;
-
-		if (server) {
-			cached.server = server.cache;
-			if (server.error) {
-				throw server.error;
-			}
-		}
-
-		const server_result = server
-			? (
-					await server.bundle?.generate({
-						format: 'iife',
-						name: 'SvelteComponent',
-						exports: 'named'
-						// sourcemap: 'inline'
-					})
-				)?.output?.[0]
-			: null;
-
-		return {
-			uid,
-			client: client_result,
-			server: server_result,
-			imports: client.imports,
-			warnings: client.warnings,
-			error: null
-		};
-	} catch (err) {
-		console.error(err);
-
-		/** @type {Error} */
-		// @ts-ignore
-		const e = error || err;
-
-		// @ts-ignore
-		delete e.toString;
-
-		return {
-			uid,
-			client: null,
-			server: null,
-			imports: null,
-			warnings: client.warnings,
-			error: Object.assign({}, e, {
-				message: e.message,
-				stack: e.stack
-			})
-		};
-	}
-}
diff --git a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/commonjs.js b/sites/svelte-5-preview/src/lib/workers/bundler/plugins/commonjs.js
deleted file mode 100644
index 9e0a92dbddc5..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/commonjs.js
+++ /dev/null
@@ -1,58 +0,0 @@
-import { parse } from 'acorn';
-import { walk } from 'zimmerframe';
-
-const require = `function require(id) {
-	if (id in __repl_lookup) return __repl_lookup[id];
-	throw new Error(\`Cannot require modules dynamically (\${id})\`);
-}`;
-
-/** @type {import('@rollup/browser').Plugin} */
-export default {
-	name: 'commonjs',
-
-	transform: (code, id) => {
-		if (!/\b(require|module|exports)\b/.test(code)) return;
-
-		try {
-			const ast = parse(code, {
-				ecmaVersion: 'latest'
-			});
-
-			/** @type {string[]}  */
-			const requires = [];
-
-			walk(/** @type {import('estree').Node} */ (ast), null, {
-				CallExpression: (node) => {
-					if (node.callee.type === 'Identifier' && node.callee.name === 'require') {
-						if (node.arguments.length !== 1) return;
-						const arg = node.arguments[0];
-						if (arg.type !== 'Literal' || typeof arg.value !== 'string') return;
-
-						requires.push(arg.value);
-					}
-				}
-			});
-
-			const imports = requires.map((id, i) => `import __repl_${i} from '${id}';`).join('\n');
-			const lookup = `const __repl_lookup = { ${requires
-				.map((id, i) => `'${id}': __repl_${i}`)
-				.join(', ')} };`;
-
-			const transformed = [
-				imports,
-				lookup,
-				require,
-				`const exports = {}; const module = { exports };`,
-				code,
-				`export default module.exports;`
-			].join('\n\n');
-
-			return {
-				code: transformed,
-				map: null
-			};
-		} catch (err) {
-			return null;
-		}
-	}
-};
diff --git a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/glsl.js b/sites/svelte-5-preview/src/lib/workers/bundler/plugins/glsl.js
deleted file mode 100644
index 51e7e062a4d9..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/glsl.js
+++ /dev/null
@@ -1,12 +0,0 @@
-/** @type {import('@rollup/browser').Plugin} */
-export default {
-	name: 'glsl',
-	transform: (code, id) => {
-		if (!id.endsWith('.glsl')) return;
-
-		return {
-			code: `export default ${JSON.stringify(code)};`,
-			map: null
-		};
-	}
-};
diff --git a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/json.js b/sites/svelte-5-preview/src/lib/workers/bundler/plugins/json.js
deleted file mode 100644
index 2f79b289e4e5..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/json.js
+++ /dev/null
@@ -1,12 +0,0 @@
-/** @type {import('@rollup/browser').Plugin} */
-export default {
-	name: 'json',
-	transform: (code, id) => {
-		if (!id.endsWith('.json')) return;
-
-		return {
-			code: `export default ${code};`,
-			map: null
-		};
-	}
-};
diff --git a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/loop-protect.js b/sites/svelte-5-preview/src/lib/workers/bundler/plugins/loop-protect.js
deleted file mode 100644
index 9cb4a8e25e6a..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/loop-protect.js
+++ /dev/null
@@ -1,111 +0,0 @@
-import { parse } from 'acorn';
-import { print } from 'esrap';
-import { walk } from 'zimmerframe';
-
-const TIMEOUT = 100;
-
-const regex = /\b(for|while)\b/;
-
-/**
- *
- * @param {string} code
- * @returns {import('estree').Statement}
- */
-function parse_statement(code) {
-	return /** @type {import('estree').Statement} */ (parse(code, { ecmaVersion: 'latest' }).body[0]);
-}
-
-const declaration = parse_statement(`
-	const __start = Date.now();
-`);
-
-const check = parse_statement(`
-	if (Date.now() > __start + ${TIMEOUT}) {
-		throw new Error('Infinite loop detected');
-	}
-`);
-
-/**
- *
- * @param {import('estree').Node[]} path
- * @returns {null | import('estree').FunctionExpression | import('estree').FunctionDeclaration | import('estree').ArrowFunctionExpression}
- */
-export function get_current_function(path) {
-	for (let i = path.length - 1; i >= 0; i--) {
-		const node = path[i];
-		if (
-			node.type === 'FunctionDeclaration' ||
-			node.type === 'FunctionExpression' ||
-			node.type === 'ArrowFunctionExpression'
-		) {
-			return node;
-		}
-	}
-	return null;
-}
-
-/**
- * @template {import('estree').DoWhileStatement | import('estree').ForStatement | import('estree').WhileStatement} Statement
- * @param {Statement} node
- * @param {import('zimmerframe').Context<import('estree').Node, null>} context
- * @returns {import('estree').Node | void}
- */
-function loop_protect(node, context) {
-	const current_function = get_current_function(context.path);
-
-	if (current_function === null || (!current_function.async && !current_function.generator)) {
-		const body = /** @type {import('estree').Statement} */ (context.visit(node.body));
-
-		const statements = body.type === 'BlockStatement' ? [...body.body] : [body];
-
-		/** @type {import('estree').BlockStatement} */
-		const replacement = {
-			type: 'BlockStatement',
-			body: [
-				declaration,
-				{
-					.../** @type {Statement} */ (context.next() ?? node),
-					body: {
-						type: 'BlockStatement',
-						body: [...statements, check]
-					}
-				}
-			]
-		};
-
-		return replacement;
-	}
-
-	context.next();
-}
-
-/** @type {import('@rollup/browser').Plugin} */
-export default {
-	name: 'loop-protect',
-	transform: (code, id) => {
-		// only applies to local files, not imports
-		if (!id.startsWith('./')) return;
-
-		// only applies to JS and Svelte files
-		if (!id.endsWith('.js') && !id.endsWith('.svelte')) return;
-
-		// fast path
-		if (!regex.test(code)) return;
-
-		const ast = parse(code, {
-			ecmaVersion: 'latest',
-			sourceType: 'module'
-		});
-
-		const transformed = walk(/** @type {import('estree').Node} */ (ast), null, {
-			WhileStatement: loop_protect,
-			DoWhileStatement: loop_protect,
-			ForStatement: loop_protect
-		});
-
-		// nothing changed
-		if (ast === transformed) return null;
-
-		return print(transformed);
-	}
-};
diff --git a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/replace.js b/sites/svelte-5-preview/src/lib/workers/bundler/plugins/replace.js
deleted file mode 100644
index 6ccdeffed827..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/bundler/plugins/replace.js
+++ /dev/null
@@ -1,72 +0,0 @@
-/** @param {string} str  */
-function escape(str) {
-	return str.replace(/[-[\]/{}()*+?.\\^$|]/g, '\\$&');
-}
-
-/** @param {unknown} functionOrValue  */
-function ensureFunction(functionOrValue) {
-	if (typeof functionOrValue === 'function') {
-		return functionOrValue;
-	}
-	return function () {
-		return functionOrValue;
-	};
-}
-
-/**
- * @param {string} a
- * @param {string} b
- */
-function longest(a, b) {
-	return b.length - a.length;
-}
-
-/** @param {Record<string, unknown>} object */
-function mapToFunctions(object) {
-	return Object.keys(object).reduce(
-		/** @param {Record<string, Function>} functions */ function (functions, key) {
-			functions[key] = ensureFunction(object[key]);
-			return functions;
-		},
-		{}
-	);
-}
-
-/**
- * @param {Record<string, unknown>} options
- * @returns {import('@rollup/browser').Plugin}
- */
-function replace(options) {
-	const functionValues = mapToFunctions(options);
-	const keys = Object.keys(functionValues).sort(longest).map(escape);
-
-	const pattern = new RegExp('\\b(' + keys.join('|') + ')\\b', 'g');
-
-	return {
-		name: 'replace',
-
-		transform: function transform(code, id) {
-			let hasReplacements = false;
-			let match;
-			let start;
-			let end;
-			let replacement;
-
-			code = code.replace(pattern, (_, key) => {
-				hasReplacements = true;
-				return String(functionValues[key](id));
-			});
-
-			if (!hasReplacements) {
-				return null;
-			}
-
-			return {
-				code,
-				map: null
-			};
-		}
-	};
-}
-
-export default replace;
diff --git a/sites/svelte-5-preview/src/lib/workers/compiler/index.js b/sites/svelte-5-preview/src/lib/workers/compiler/index.js
deleted file mode 100644
index 9247894dd6e3..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/compiler/index.js
+++ /dev/null
@@ -1,154 +0,0 @@
-/// <reference lib="webworker" />
-self.window = self; //TODO: still need?: egregious hack to get magic-string to work in a worker
-
-/**
- * @type {{
- * 	 parse: typeof import('svelte/compiler').parse;
- *   compile: typeof import('svelte/compiler').compile;
- *   compileModule: typeof import('svelte/compiler').compileModule;
- *   VERSION: string;
- * }}
- */
-let svelte;
-
-/** @type {(arg?: never) => void} */
-let fulfil_ready;
-const ready = new Promise((f) => {
-	fulfil_ready = f;
-});
-
-self.addEventListener(
-	'message',
-	/** @param {MessageEvent<import("../workers").CompileMessageData>} event */
-	async (event) => {
-		switch (event.data.type) {
-			case 'init':
-				const { svelte_url } = event.data;
-
-				const { version } = await fetch(`${svelte_url}/package.json`)
-					.then((r) => r.json())
-					.catch(() => ({ version: 'experimental' }));
-
-				const compiler = await fetch(`${svelte_url}/compiler/index.js`).then((r) => r.text());
-				(0, eval)(compiler + '\n//# sourceURL=compiler/index.js@' + version);
-
-				svelte = globalThis.svelte;
-
-				fulfil_ready();
-				break;
-
-			case 'compile':
-				await ready;
-				postMessage(compile(event.data));
-				break;
-
-			case 'migrate':
-				await ready;
-				postMessage(migrate(event.data));
-				break;
-		}
-	}
-);
-
-const common_options = {
-	dev: false,
-	css: false
-};
-
-/** @param {import("../workers").CompileMessageData} param0 */
-function compile({ id, source, options, return_ast }) {
-	try {
-		const css = `/* Select a component to see compiled CSS */`;
-
-		if (options.filename.endsWith('.svelte')) {
-			const compiled = svelte.compile(source, {
-				...options,
-				discloseVersion: false // less visual noise in the output tab
-			});
-
-			const { js, css, warnings, metadata } = compiled;
-
-			const ast = return_ast ? svelte.parse(source, { modern: true }) : undefined;
-
-			return {
-				id,
-				result: {
-					js: js.code,
-					css: css?.code || `/* Add a <sty` + `le> tag to see compiled CSS */`,
-					error: null,
-					warnings: warnings.map((warning) => warning.toJSON()),
-					metadata,
-					ast
-				}
-			};
-		} else if (options.filename.endsWith('.svelte.js')) {
-			const compiled = svelte.compileModule(source, {
-				filename: options.filename,
-				generate: options.generate,
-				dev: options.dev
-			});
-
-			if (compiled) {
-				return {
-					id,
-					result: {
-						js: compiled.js.code,
-						css,
-						error: null,
-						warnings: compiled.warnings.map((warning) => warning.toJSON()),
-						metadata: compiled.metadata
-					}
-				};
-			}
-		}
-
-		return {
-			id,
-			result: {
-				js: `// Select a component, or a '.svelte.js' module that uses runes, to see compiled output`,
-				css,
-				error: null,
-				warnings: [],
-				metadata: null
-			}
-		};
-	} catch (err) {
-		// @ts-ignore
-		let message = `/*\nError compiling ${err.filename ?? 'component'}:\n${err.message}\n*/`;
-
-		return {
-			id,
-			result: {
-				js: message,
-				css: message,
-				error: {
-					message: err.message,
-					position: err.position
-				},
-				warnings: [],
-				metadata: null
-			}
-		};
-	}
-}
-
-/** @param {import("../workers").MigrateMessageData} param0 */
-function migrate({ id, source, filename }) {
-	try {
-		const result = svelte.migrate(source, { filename });
-
-		return {
-			id,
-			result
-		};
-	} catch (err) {
-		// @ts-ignore
-		let message = `/*\nError migrating ${err.filename ?? 'component'}:\n${err.message}\n*/`;
-
-		return {
-			id,
-			result: { code: source },
-			error: message
-		};
-	}
-}
diff --git a/sites/svelte-5-preview/src/lib/workers/jsconfig.json b/sites/svelte-5-preview/src/lib/workers/jsconfig.json
deleted file mode 100644
index 60351b754815..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/jsconfig.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-	"include": ["./**/*"],
-	"compilerOptions": {
-		"paths": {
-			"svelte": ["../../../static/svelte/main"],
-			"svelte/*": ["../../../static/svelte/*"]
-		}
-	}
-}
diff --git a/sites/svelte-5-preview/src/lib/workers/patch_window.js b/sites/svelte-5-preview/src/lib/workers/patch_window.js
deleted file mode 100644
index ff7057c9c28f..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/patch_window.js
+++ /dev/null
@@ -1 +0,0 @@
-self.window = self; // hack for magic-sring and rollup inline sourcemaps
diff --git a/sites/svelte-5-preview/src/lib/workers/workers.d.ts b/sites/svelte-5-preview/src/lib/workers/workers.d.ts
deleted file mode 100644
index e66e075c14f1..000000000000
--- a/sites/svelte-5-preview/src/lib/workers/workers.d.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import type { CompileOptions, File } from '../types';
-
-export type CompileMessageData = {
-	id: number;
-	type: 'compile' | 'init';
-	source: string;
-	options: CompileOptions;
-	is_entry: boolean;
-	return_ast: boolean;
-	svelte_url?: string;
-	result: {
-		js: string;
-		css: string;
-		ast?: import('svelte/types/compiler/interfaces').Ast;
-		metadata?: {
-			runes: boolean;
-		};
-	};
-};
-
-export type BundleMessageData = {
-	uid: number;
-	type: 'init' | 'bundle' | 'status';
-	message: string;
-	packages_url: string;
-	svelte_url: string;
-	files: File[];
-};
-
-export type MigrateMessageData = {
-	id: number;
-	result: { code: string };
-	error?: string;
-};
diff --git a/sites/svelte-5-preview/src/routes/+error.svelte b/sites/svelte-5-preview/src/routes/+error.svelte
deleted file mode 100644
index 6d6d8a7d7cb5..000000000000
--- a/sites/svelte-5-preview/src/routes/+error.svelte
+++ /dev/null
@@ -1,73 +0,0 @@
-<script>
-	import { page } from '$app/stores';
-
-	// we don't want to use <svelte:window bind:online> here,
-	// because we only care about the online state when
-	// the page first loads
-	const online = typeof navigator !== 'undefined' ? navigator.onLine : true;
-</script>
-
-<svelte:head>
-	<title>{$page.status}</title>
-</svelte:head>
-
-<div class="container">
-	{#if online}
-		{#if $page.status === 404}
-			<h1>Not found!</h1>
-			<p>
-				If you were expecting to find something here, please drop by the
-				<a href="https://svelte.dev/chat"> Discord chatroom </a>
-				and let us know, or raise an issue on
-				<a href="https://github.com/sveltejs/sites">GitHub</a>. Thanks!
-			</p>
-		{:else}
-			<h1>Yikes!</h1>
-			<p>Something went wrong when we tried to render this page.</p>
-			{#if $page.error.message}
-				<p class="error">{$page.status}: {$page.error.message}</p>
-			{:else}
-				<p class="error">Encountered a {$page.status} error.</p>
-			{/if}
-			<p>Please try reloading the page.</p>
-			<p>
-				If the error persists, please drop by the
-				<a href="https://svelte.dev/chat"> Discord chatroom </a>
-				and let us know, or raise an issue on
-				<a href="https://github.com/sveltejs/sites">GitHub</a>. Thanks!
-			</p>
-		{/if}
-	{:else}
-		<h1>It looks like you're offline</h1>
-		<p>Reload the page once you've found the internet.</p>
-	{/if}
-</div>
-
-<style>
-	.container {
-		padding: var(--sk-page-padding-top) var(--sk-page-padding-side) 6rem var(--sk-page-padding-side);
-	}
-
-	h1,
-	p {
-		margin: 0 auto;
-	}
-
-	h1 {
-		font-size: 2.8em;
-		font-weight: 300;
-		margin: 0 0 0.5em 0;
-	}
-
-	p {
-		margin: 1em auto;
-	}
-
-	.error {
-		background-color: var(--sk-theme-2);
-		color: white;
-		padding: 12px 16px;
-		font: 600 16px/1.7 var(--sk-font);
-		border-radius: 2px;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/routes/+layout.server.js b/sites/svelte-5-preview/src/routes/+layout.server.js
deleted file mode 100644
index 640c4c57df10..000000000000
--- a/sites/svelte-5-preview/src/routes/+layout.server.js
+++ /dev/null
@@ -1,12 +0,0 @@
-export const prerender = true;
-
-/** @type {import('@sveltejs/adapter-vercel').EdgeConfig} */
-export const config = {
-	runtime: 'edge'
-};
-
-export const load = async ({ fetch }) => {
-	const nav_data = await fetch('/nav.json').then((r) => r.json());
-
-	return { nav_links: nav_data };
-};
diff --git a/sites/svelte-5-preview/src/routes/+layout.svelte b/sites/svelte-5-preview/src/routes/+layout.svelte
deleted file mode 100644
index 99b72d0fade5..000000000000
--- a/sites/svelte-5-preview/src/routes/+layout.svelte
+++ /dev/null
@@ -1,101 +0,0 @@
-<script>
-	import { injectSpeedInsights } from '@vercel/speed-insights/sveltekit';
-	import { page } from '$app/stores';
-	import { Icon, Shell } from '@sveltejs/site-kit/components';
-	import { Nav, Separator } from '@sveltejs/site-kit/nav';
-	import '@sveltejs/site-kit/styles/index.css';
-
-	injectSpeedInsights();
-
-	export let data;
-</script>
-
-<svelte:head>
-	<title>Svelte 5 preview</title>
-
-	<!-- TODO separate og image? -->
-	<meta name="twitter:card" content="summary" />
-	<meta name="twitter:image" content="https://svelte.dev/images/twitter-thumbnail.jpg" />
-	<meta name="og:image" content="https://svelte.dev/images/twitter-thumbnail.jpg" />
-</svelte:head>
-
-<Shell nav_visible={$page.url.pathname !== '/repl/embed'}>
-	<Nav slot="top-nav" title={$page.data.nav_title} links={data.nav_links}>
-		<svelte:fragment slot="home-large">
-			<strong>Preview</strong>
-		</svelte:fragment>
-
-		<svelte:fragment slot="home-small">
-			<strong>Preview</strong>
-		</svelte:fragment>
-
-		<svelte:fragment slot="search">
-			<div class="disclaimer">
-				<span class="show-when-small">Work in progress!</span>
-				<span class="show-when-large">Work in progress. Expect bugs!</span>
-			</div>
-		</svelte:fragment>
-
-		<svelte:fragment slot="external-links">
-			<a href="https://svelte.dev">Svelte</a>
-
-			<Separator />
-
-			<a href="https://svelte.dev/chat" title="Discord Chat">
-				<span class="small">Discord</span>
-				<span class="large"><Icon name="discord" /></span>
-			</a>
-
-			<a href="https://github.com/sveltejs/svelte" title="GitHub Repo">
-				<span class="small">GitHub</span>
-				<span class="large"><Icon name="github" /></span>
-			</a>
-		</svelte:fragment>
-	</Nav>
-
-	<slot />
-</Shell>
-
-<style>
-	:global(:root) {
-		color-scheme: light dark;
-	}
-
-	:global(html, body) {
-		height: 100%;
-		width: 100%;
-	}
-
-	.disclaimer {
-		height: 100%;
-		display: flex;
-		align-items: center;
-	}
-
-	.disclaimer > span {
-		font-size: 1.4rem;
-		font-weight: bold;
-		text-transform: uppercase;
-		color: var(--sk-theme-1);
-		padding: 0 1rem;
-	}
-
-	.show-when-large {
-		display: none;
-	}
-
-	@media (min-width: 1200px) {
-		.show-when-small {
-			display: none;
-		}
-
-		.show-when-large {
-			display: inline;
-		}
-	}
-
-	/* site-kit overrides */
-	:global(button.search[aria-label='Search']) {
-		display: none;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/routes/+page.svelte b/sites/svelte-5-preview/src/routes/+page.svelte
deleted file mode 100644
index b54c36ee5b58..000000000000
--- a/sites/svelte-5-preview/src/routes/+page.svelte
+++ /dev/null
@@ -1,98 +0,0 @@
-<script>
-	import { theme } from '@sveltejs/site-kit/stores';
-	import '@sveltejs/site-kit/styles/index.css';
-	import { replaceState } from '$app/navigation';
-
-	import Repl from '$lib/Repl.svelte';
-	import { default_files } from './defaults.js';
-	import { compress_and_encode_text, decode_and_decompress_text } from './gzip.js';
-	import { afterNavigate } from '$app/navigation';
-
-	/** @type {Repl} */
-	let repl;
-
-	let setting_hash = false;
-	let navigating = false;
-
-	afterNavigate(change_from_hash);
-
-	async function change_from_hash() {
-		navigating = true;
-
-		const hash = location.hash.slice(1);
-
-		if (!hash) {
-			repl.set({
-				files: default_files()
-			});
-
-			return;
-		}
-
-		try {
-			// Uncompressed hashes that were used at some point start with 'ey' (JSON)
-			const data = hash.startsWith('ey')
-				? atob(hash.replaceAll('-', '+').replaceAll('_', '/'))
-				: await decode_and_decompress_text(hash);
-			let files;
-
-			try {
-				files = JSON.parse(data).files;
-			} catch {
-				// probably an old link from when we only had a single component
-				files = [
-					{
-						name: 'App',
-						type: 'svelte',
-						source: data
-					}
-				];
-			}
-
-			repl.set({
-				files
-			});
-		} catch {
-			alert(`Couldn't load the code from the URL. Make sure you copied the link correctly.`);
-		}
-	}
-
-	/** @param {CustomEvent<any>} e*/
-	async function change_from_editor(e) {
-		if (navigating) {
-			navigating = false;
-			return;
-		}
-
-		const json = JSON.stringify({
-			files: e.detail.files
-		});
-
-		setting_hash = true;
-
-		replaceState(
-			`${location.pathname}${location.search}#${await compress_and_encode_text(json)}`,
-			{}
-		);
-	}
-</script>
-
-<svelte:window
-	on:hashchange={() => {
-		if (!setting_hash) {
-			change_from_hash();
-		}
-
-		setting_hash = false;
-	}}
-/>
-
-<Repl
-	bind:this={repl}
-	autocomplete={true}
-	on:add={change_from_editor}
-	on:change={change_from_editor}
-	on:remove={change_from_editor}
-	previewTheme={$theme.current}
-	showAst={true}
-/>
diff --git a/sites/svelte-5-preview/src/routes/defaults.js b/sites/svelte-5-preview/src/routes/defaults.js
deleted file mode 100644
index f1bdbbbb3548..000000000000
--- a/sites/svelte-5-preview/src/routes/defaults.js
+++ /dev/null
@@ -1,21 +0,0 @@
-export const default_files = () => [
-	{
-		name: 'App',
-		type: 'svelte',
-		source: `
-			<script>
-				let count = $state(0);
-
-				function increment() {
-					count += 1;
-				}
-			</script>
-
-			<button onclick={increment}>
-				clicks: {count}
-			</button>
-		`
-			.replace(/^\t{3}/gm, '')
-			.trim()
-	}
-];
diff --git a/sites/svelte-5-preview/src/routes/docs/+layout.server.js b/sites/svelte-5-preview/src/routes/docs/+layout.server.js
deleted file mode 100644
index cbb6433bf9be..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/+layout.server.js
+++ /dev/null
@@ -1,13 +0,0 @@
-export async function load({ url }) {
-	if (url.pathname === '/docs') {
-		return {
-			sections: []
-		};
-	}
-
-	const { get_docs_data, get_docs_list } = await import('./render.js');
-
-	return {
-		sections: get_docs_list(await get_docs_data())
-	};
-}
diff --git a/sites/svelte-5-preview/src/routes/docs/+layout.svelte b/sites/svelte-5-preview/src/routes/docs/+layout.svelte
deleted file mode 100644
index 097fde98ff0e..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/+layout.svelte
+++ /dev/null
@@ -1,110 +0,0 @@
-<script>
-	import { page } from '$app/stores';
-	import { DocsContents } from '@sveltejs/site-kit/docs';
-
-	export let data;
-
-	$: pageData = $page.data.page;
-
-	$: title = pageData?.title;
-	$: category = pageData?.category;
-</script>
-
-<div class="container">
-	<div class="toc-container" style="order: 1">
-		<DocsContents contents={data.sections} />
-	</div>
-
-	<div class="page content">
-		{#if category}
-			<p class="category">{category}</p>
-		{/if}
-		{#if title}
-			<h1>{title}</h1>
-		{/if}
-
-		<slot />
-	</div>
-</div>
-
-<style>
-	.container {
-		--sidebar-menu-width: 28rem;
-		--sidebar-width: var(--sidebar-menu-width);
-		--ts-toggle-height: 4.2rem;
-
-		display: flex;
-		flex-direction: column;
-	}
-
-	.page {
-		padding: var(--sk-page-padding-top) var(--sk-page-padding-side);
-
-		min-width: 0 !important;
-	}
-
-	.page :global(:where(h2, h3) code) {
-		all: unset;
-	}
-
-	.category {
-		font: 700 var(--sk-text-s) var(--sk-font);
-		text-transform: uppercase;
-		letter-spacing: 0.12em;
-		margin: 0 0 0.5em;
-		color: var(--sk-text-3);
-	}
-
-	@media (min-width: 832px) {
-		.content {
-			padding-left: calc(var(--sidebar-width) + var(--sk-page-padding-side));
-		}
-	}
-
-	.toc-container {
-		background: var(--sk-back-3);
-		display: none;
-	}
-
-	@media (min-width: 832px) {
-		.toc-container {
-			display: block;
-			width: var(--sidebar-width);
-			height: calc(100vh - var(--sk-nav-height));
-			position: fixed;
-			left: 0;
-			top: var(--sk-nav-height);
-			overflow-x: hidden;
-			overflow-y: auto;
-		}
-
-		.toc-container::before {
-			content: '';
-			position: fixed;
-			width: 0;
-			height: 100%;
-			top: 0;
-			left: calc(var(--sidebar-width) - 1px);
-			border-right: 1px solid var(--sk-back-5);
-		}
-
-		.page {
-			padding-left: calc(var(--sidebar-width) + var(--sk-page-padding-side));
-		}
-	}
-
-	@media (min-width: 1200px) {
-		.container {
-			--sidebar-width: max(28rem, 23vw);
-			flex-direction: row;
-		}
-
-		.page {
-			--on-this-page-display: block;
-			padding: var(--sk-page-padding-top) calc(var(--sidebar-width) + var(--sk-page-padding-side));
-			margin: 0 auto;
-			max-width: var(--sk-line-max-width);
-			box-sizing: content-box;
-		}
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/routes/docs/+page.js b/sites/svelte-5-preview/src/routes/docs/+page.js
deleted file mode 100644
index fba7f30e4b6b..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/+page.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { redirect } from '@sveltejs/kit';
-
-export function load() {
-	redirect(307, '/docs/introduction');
-}
diff --git a/sites/svelte-5-preview/src/routes/docs/[slug]/+page.server.js b/sites/svelte-5-preview/src/routes/docs/[slug]/+page.server.js
deleted file mode 100644
index 25c78ba28132..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/[slug]/+page.server.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import { error } from '@sveltejs/kit';
-
-export async function entries() {
-	const { get_docs_data } = await import('../render.js');
-
-	const data = await get_docs_data();
-	return data[0].pages.map((page) => ({ slug: page.slug }));
-}
-
-export async function load({ params }) {
-	const { get_docs_data, get_parsed_docs } = await import('../render.js');
-
-	const data = await get_docs_data();
-	const processed_page = await get_parsed_docs(data, params.slug);
-
-	if (!processed_page) error(404);
-
-	return { page: processed_page };
-}
diff --git a/sites/svelte-5-preview/src/routes/docs/[slug]/+page.svelte b/sites/svelte-5-preview/src/routes/docs/[slug]/+page.svelte
deleted file mode 100644
index bb5c166711f7..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/[slug]/+page.svelte
+++ /dev/null
@@ -1,76 +0,0 @@
-<script>
-	import { page } from '$app/stores';
-	import { copy_code_descendants } from '@sveltejs/site-kit/actions';
-	import { DocsOnThisPage, setupDocsHovers } from '@sveltejs/site-kit/docs';
-
-	export let data;
-
-	$: pages = data.sections.flatMap((section) => section.pages);
-	$: index = pages.findIndex(({ path }) => path === $page.url.pathname);
-	$: prev = pages[index - 1];
-	$: next = pages[index + 1];
-
-	setupDocsHovers();
-</script>
-
-<svelte:head>
-	<title>{data.page?.title} • Docs • Svelte 5 preview</title>
-
-	<meta name="twitter:title" content="{data.page.title} • Docs • Svelte 5 preview" />
-	<meta name="twitter:description" content="{data.page.title} • Svelte 5 preview documentation" />
-	<meta name="description" content="{data.page.title} • Svelte 5 preview documentation" />
-</svelte:head>
-
-<div class="text" id="docs-content" use:copy_code_descendants>
-	<DocsOnThisPage details={data.page} />
-
-	{@html data.page.content}
-</div>
-
-<div class="controls">
-	<div>
-		<span class:faded={!prev}>previous</span>
-
-		{#if prev}
-			<a href={prev.path}>{prev.title}</a>
-		{/if}
-	</div>
-
-	<div>
-		<span class:faded={!next}>next</span>
-		{#if next}
-			<a href={next.path}>{next.title}</a>
-		{/if}
-	</div>
-</div>
-
-<style>
-	.controls {
-		max-width: calc(var(--sk-line-max-width) + 1rem);
-		border-top: 1px solid var(--sk-back-4);
-		padding: 1rem 0 0 0;
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		margin: 6rem 0 0 0;
-	}
-
-	.controls > :first-child {
-		text-align: left;
-	}
-
-	.controls > :last-child {
-		text-align: right;
-	}
-
-	.controls span {
-		display: block;
-		font-size: 1.2rem;
-		text-transform: uppercase;
-		font-weight: 600;
-		color: var(--sk-text-3);
-	}
-
-	.controls span.faded {
-		opacity: 0.4;
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/routes/docs/content/01-api/01-introduction.md b/sites/svelte-5-preview/src/routes/docs/content/01-api/01-introduction.md
deleted file mode 100644
index 2e3cb987c050..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/01-api/01-introduction.md
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: Introduction
----
-
-Welcome to the Svelte 5 preview documentation! This is intended as a resource for people who already have some familiarity with Svelte and want to learn about the new <em>runes</em> API, which you can learn about in the [Introducing runes](https://svelte.dev/blog/runes) blog post.
-
-You can try runes for yourself in the [playground](/), or learn more about our plans via the [FAQ](/docs/faq).
diff --git a/sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md b/sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md
deleted file mode 100644
index 84062a1cfaee..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md
+++ /dev/null
@@ -1,700 +0,0 @@
----
-title: Runes
----
-
-Svelte 5 introduces _runes_, a powerful set of primitives for controlling reactivity inside your Svelte components and — for the first time — inside `.svelte.js` and `.svelte.ts` modules.
-
-Runes are function-like symbols that provide instructions to the Svelte compiler. You don't need to import them from anywhere — when you use Svelte, they're part of the language.
-
-When you [opt in to runes mode](#how-to-opt-in), the non-runes features listed in the 'What this replaces' sections are no longer available.
-
-> Check out the [Introducing runes](https://svelte.dev/blog/runes) blog post before diving into the docs!
-
-## `$state`
-
-Reactive state is declared with the `$state` rune:
-
-```svelte
-<script>
-	let count = $state(0);
-</script>
-
-<button onclick={() => count++}>
-	clicks: {count}
-</button>
-```
-
-You can also use `$state` in class fields (whether public or private):
-
-```js
-// @errors: 7006 2554
-class Todo {
-	done = $state(false);
-	text = $state();
-
-	constructor(text) {
-		this.text = text;
-	}
-}
-```
-
-> In this example, the compiler transforms `done` and `text` into `get`/`set` methods on the class prototype referencing private fields
-
-Only plain objects and arrays [are made deeply reactive](/#H4sIAAAAAAAAE42QwWrDMBBEf2URhUhUNEl7c21DviPOwZY3jVpZEtIqUBz9e-UUt9BTj7M784bdmZ21wciq48xsPyGr2MF7Jhl9-kXEKxrCoqNLQS2TOqqgPbWd7cgggU3TgCFCAw-RekJ-3Et4lvByEq-drbe_dlsPichZcFYZrT6amQto2pXw5FO88FUYtG90gUfYi3zvWrYL75vxL57zfA07_zfr23k1vjtt-aZ0bQTcbrDL5ZifZcAxKeS8lzDc8X0xDhJ2ItdbX1jlOZMb9VnjyCoKCfMpfwG975NFVwEAAA==) by wrapping them with [`Proxies`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy):
-
-```svelte
-<script>
-	let numbers = $state([1, 2, 3]);
-</script>
-
-<button onclick={() => numbers.push(numbers.length + 1)}>
-	push
-</button>
-
-<button onclick={() => numbers.pop()}> pop </button>
-
-<p>
-	{numbers.join(' + ') || 0}
-	=
-	{numbers.reduce((a, b) => a + b, 0)}
-</p>
-```
-
-### What this replaces
-
-In non-runes mode, a `let` declaration is treated as reactive state if it is updated at some point. Unlike `$state(...)`, which works anywhere in your app, `let` only behaves this way at the top level of a component.
-
-## `$state.raw`
-
-State declared with `$state.raw` cannot be mutated; it can only be _reassigned_. In other words, rather than assigning to a property of an object, or using an array method like `push`, replace the object or array altogether if you'd like to update it:
-
-```diff
-<script>
--	let numbers = $state([1, 2, 3]);
-+	let numbers = $state.raw([1, 2, 3]);
-</script>
-
--<button onclick={() => numbers.push(numbers.length + 1)}>
-+<button onclick={() => numbers = [...numbers, numbers.length + 1]}>
-	push
-</button>
-
--<button onclick={() => numbers.pop()}> pop </button>
-+<button onclick={() => numbers = numbers.slice(0, -1)}> pop </button>
-
-<p>
-	{numbers.join(' + ') || 0}
-	=
-	{numbers.reduce((a, b) => a + b, 0)}
-</p>
-```
-
-This can improve performance with large arrays and objects that you weren't planning to mutate anyway, since it avoids the cost of making them reactive. Note that raw state can _contain_ reactive state (for example, a raw array of reactive objects).
-
-## `$state.snapshot`
-
-To take a static snapshot of a deeply reactive `$state` proxy, use `$state.snapshot`:
-
-```svelte
-<script>
-	let counter = $state({ count: 0 });
-
-	function onclick() {
-		// Will log `{ count: ... }` rather than `Proxy { ... }`
-		console.log($state.snapshot(counter));
-	}
-</script>
-```
-
-This is handy when you want to pass some state to an external library or API that doesn't expect a proxy, such as `structuredClone`.
-
-## `$derived`
-
-Derived state is declared with the `$derived` rune:
-
-```diff
-<script>
-	let count = $state(0);
-+	let doubled = $derived(count * 2);
-</script>
-
-<button onclick={() => count++}>
-	{doubled}
-</button>
-
-+<p>{count} doubled is {doubled}</p>
-```
-
-The expression inside `$derived(...)` should be free of side-effects. Svelte will disallow state changes (e.g. `count++`) inside derived expressions.
-
-As with `$state`, you can mark class fields as `$derived`.
-
-### What this replaces
-
-If the value of a reactive variable is being computed it should be replaced with `$derived` whether it previously took the form of `$: double = count * 2` or `$: { double = count * 2; }` There are some important differences to be aware of:
-
-- With the `$derived` rune, the value of `double` is always current (for example if you update `count` then immediately `console.log(double)`). With `$:` declarations, values are not updated until right before Svelte updates the DOM
-- In non-runes mode, Svelte determines the dependencies of `double` by statically analysing the `count * 2` expression. If you refactor it...
-  ```js
-  // @errors: 2304
-  const doubleCount = () => count * 2;
-  $: double = doubleCount();
-  ```
-  ...that dependency information is lost, and `double` will no longer update when `count` changes. With runes, dependencies are instead tracked at runtime.
-- In non-runes mode, reactive statements are ordered _topologically_, meaning that in a case like this...
-  ```js
-  // @errors: 2304
-  $: triple = double + count;
-  $: double = count * 2;
-  ```
-  ...`double` will be calculated first despite the source order. In runes mode, `triple` cannot reference `double` before it has been declared.
-
-## `$derived.by`
-
-Sometimes you need to create complex derivations that don't fit inside a short expression. In these cases, you can use `$derived.by` which accepts a function as its argument.
-
-```svelte
-<script>
-	let numbers = $state([1, 2, 3]);
-	let total = $derived.by(() => {
-		let total = 0;
-		for (const n of numbers) {
-			total += n;
-		}
-		return total;
-	});
-</script>
-
-<button onclick={() => numbers.push(numbers.length + 1)}>
-	{numbers.join(' + ')} = {total}
-</button>
-```
-
-In essence, `$derived(expression)` is equivalent to `$derived.by(() => expression)`.
-
-## `$effect`
-
-To run _side-effects_ when the component is mounted to the DOM, and when values change, we can use the `$effect` rune ([demo](/#H4sIAAAAAAAAE31T24rbMBD9lUG7kAQ2sbdlX7xOYNk_aB_rQhRpbAsU2UiTW0P-vbrYubSlYGzmzMzROTPymdVKo2PFjzMzfIusYB99z14YnfoQuD1qQh-7bmdFQEonrOppVZmKNBI49QthCc-OOOH0LZ-9jxnR6c7eUpOnuv6KeT5JFdcqbvbcBcgDz1jXKGg6ncFyBedYR6IzLrAZwiN5vtSxaJA-EzadfJEjKw11C6GR22-BLH8B_wxdByWpvUYtqqal2XB6RVkG1CoHB6U1WJzbnYFDiwb3aGEdDa3Bm1oH12sQLTcNPp7r56m_00mHocSG97_zd7ICUXonA5fwKbPbkE2ZtMJGGVkEdctzQi4QzSwr9prnFYNk5hpmqVuqPQjNnfOJoMF22lUsrq_UfIN6lfSVyvQ7grB3X2mjMZYO3XO9w-U5iLx42qg29md3BP_ni5P4gy9ikTBlHxjLzAtPDlyYZmRdjAbGq7HprEQ7p64v4LU_guu0kvAkhBim3nMplWl8FreQD-CW20aZR0wq12t-KqDWeBywhvexKC3memmDwlHAv9q4Vo2ZK8KtK0CgX7u9J8wXbzdKv-nRnfF_2baTqlYoWUF2h5efl9-n0O6koAMAAA==)):
-
-```svelte
-<script>
-	let size = $state(50);
-	let color = $state('#ff3e00');
-
-	let canvas;
-
-	$effect(() => {
-		const context = canvas.getContext('2d');
-		context.clearRect(0, 0, canvas.width, canvas.height);
-
-		// this will re-run whenever `color` or `size` change
-		context.fillStyle = color;
-		context.fillRect(0, 0, size, size);
-	});
-</script>
-
-<canvas bind:this={canvas} width="100" height="100" />
-```
-
-The function passed to `$effect` will run when the component mounts, and will re-run after any changes to the values it reads that were declared with `$state` or `$derived` (including those passed in with `$props`). Re-runs are batched (i.e. changing `color` and `size` in the same moment won't cause two separate runs), and happen after any DOM updates have been applied.
-
-Values that are read asynchronously — after an `await` or inside a `setTimeout`, for example — will _not_ be tracked. Here, the canvas will be repainted when `color` changes, but not when `size` changes ([demo](/#H4sIAAAAAAAAE31T24rbMBD9lUG7kCxsbG_LvrhOoPQP2r7VhSjy2BbIspHGuTT436tLnMtSCiaOzpw5M2dGPrNaKrQs_3VmmnfIcvZ1GNgro9PgD3aPitCdbT8a4ZHCCiMH2pS6JIUEVv5BWMOzJU64fM9evswR0ave3EKLp7r-jFm2iIwri-s9tx5ywDPWNQpaLl9gvYFz4JHotfVqmvBITi9mJA3St4gtF5-qWZUuvEQo5Oa7F8tewT2XrIOsqL2eWpRNS7eGSkpToFZaOEilwODKjBoOLWrco4FtsLQF0XLdoE2S5LGmm6X6QSflBxKod8IW6afssB8_uAslndJuJNA9hWKw9VO91pmJ92XunHlu_J1nMDk8_p_8q0hvO9NFtA47qavcW12fIzJBmM26ZG9ZVjKIs7ke05hdyT0Ixa11Ad-P6ZUtWbgNheI7VJvYQiH14Bz5a-SYxvtwIqHonqsR12ff8ORkQ-chP70T-L9eGO4HvYAFwRh9UCxS13h0YP2CgmoyG5h3setNhWZF_ZDD23AE2ytZwZMQ4jLYgVeV1I2LYgfZBey4aaR-xCppB8VPOdQKjxes4UMgxcVcvwHf4dzAv9K4ko1eScLO5iDQXQFzL5gl7zdJt-nZnXYfbddXspZYsZzMiNPv6S8Bl41G7wMAAA==)):
-
-```ts
-// @filename: index.ts
-declare let canvas: {
-	width: number;
-	height: number;
-	getContext(
-		type: '2d',
-		options?: CanvasRenderingContext2DSettings
-	): CanvasRenderingContext2D;
-};
-declare let color: string;
-declare let size: number;
-
-// ---cut---
-$effect(() => {
-	const context = canvas.getContext('2d');
-	context.clearRect(0, 0, canvas.width, canvas.height);
-
-	// this will re-run whenever `color` changes...
-	context.fillStyle = color;
-
-	setTimeout(() => {
-		// ...but not when `size` changes
-		context.fillRect(0, 0, size, size);
-	}, 0);
-});
-```
-
-An effect only reruns when the object it reads changes, not when a property inside it changes. (If you want to observe changes _inside_ an object at dev time, you can use [`$inspect`](#$inspect).)
-
-```svelte
-<script>
-	let state = $state({ value: 0 });
-	let derived = $derived({ value: state.value * 2 });
-
-	// this will run once, because `state` is never reassigned (only mutated)
-	$effect(() => {
-		state;
-	});
-
-	// this will run whenever `state.value` changes...
-	$effect(() => {
-		state.value;
-	});
-
-	// ...and so will this, because `derived` is a new object each time
-	$effect(() => {
-		derived;
-	});
-</script>
-
-<button onclick={() => (state.value += 1)}>
-	{state.value}
-</button>
-
-<p>{state.value} doubled is {derived.value}</p>
-```
-
-An effect only depends on the values that it read the last time it ran. If `a` is true, changes to `b` will [not cause this effect to rerun](/#H4sIAAAAAAAAE3WQ0WrDMAxFf0U1hTow1vcsMfQ7lj3YjlxEXTvEymC4_vfFC6Ewtidxde8RkrJw5DGJ9j2LoO8oWnGZJvEi-GuqIn2iZ1x1istsa6dLdqaJ1RAG9sigoYdjYs0onfYJm7fdMX85q3dE59CylA30CnJtDWxjSNHjq49XeZqXEChcT9usLUAOpIbHA0yzM78oColGhDVofLS3neZSS6mqOz-XD51ZmGOAGKwne-vztk-956CL0kAJsi7decupf4l658EUZX4I8yTWt93jSI5wFC3PC5aP8g0Aje5DcQEAAA==):
-
-```ts
-let a = false;
-let b = false;
-// ---cut---
-$effect(() => {
-	console.log('running');
-
-	if (a || b) {
-		console.log('inside if block');
-	}
-});
-```
-
-You can return a function from `$effect`, which will run immediately before the effect re-runs, and before it is destroyed ([demo](/#H4sIAAAAAAAAE42SzW6DMBCEX2Vl5RDaVCQ9JoDUY--9lUox9lKsGBvZC1GEePcaKPnpqSe86_m0M2t6ViqNnu0_e2Z4jWzP3pqGbRhdmrHwHWrCUHvbOjF2Ei-caijLTU4aCYRtDUEKK0-ccL2NDstNrbRWHoU10t8Eu-121gTVCssSBa3XEaQZ9GMrpziGj0p5OAccCgSHwmEgJZwrNNihg6MyhK7j-gii4uYb_YyGUZ5guQwzPdL7b_U4ZNSOvp9T2B3m1rB5cLx4zMkhtc7AHz7YVCVwEFzrgosTBMuNs52SKDegaPbvWnMH8AhUXaNUIY6-hHCldQhUIcyLCFlfAuHvkCKaYk8iYevGGgy2wyyJnpy9oLwG0sjdNe2yhGhJN32HsUzi2xOapNpl_bSLIYnDeeoVLZE1YI3QSpzSfo7-8J5PKbwOmdf2jC6JZyD7HxpPaMk93aHhF6utVKVCyfbkWhy-hh9Z3o_2nQIAAA==)).
-
-```svelte
-<script>
-	let count = $state(0);
-	let milliseconds = $state(1000);
-
-	$effect(() => {
-		// This will be recreated whenever `milliseconds` changes
-		const interval = setInterval(() => {
-			count += 1;
-		}, milliseconds);
-
-		return () => {
-			// if a callback is provided, it will run
-			// a) immediately before the effect re-runs
-			// b) when the component is destroyed
-			clearInterval(interval);
-		};
-	});
-</script>
-
-<h1>{count}</h1>
-
-<button onclick={() => (milliseconds *= 2)}>slower</button>
-<button onclick={() => (milliseconds /= 2)}>faster</button>
-```
-
-### When not to use `$effect`
-
-In general, `$effect` is best considered something of an escape hatch — useful for things like analytics and direct DOM manipulation — rather than a tool you should use frequently. In particular, avoid using it to synchronise state. Instead of this...
-
-```svelte
-<script>
-	let count = $state(0);
-	let doubled = $state();
-
-	// don't do this!
-	$effect(() => {
-		doubled = count * 2;
-	});
-</script>
-```
-
-...do this:
-
-```svelte
-<script>
-	let count = $state(0);
-	let doubled = $derived(count * 2);
-</script>
-```
-
-> For things that are more complicated than a simple expression like `count * 2`, you can also use [`$derived.by`](#$derived-by).
-
-You might be tempted to do something convoluted with effects to link one value to another. The following example shows two inputs for "money spent" and "money left" that are connected to each other. If you update one, the other should update accordingly. Don't use effects for this ([demo](/#H4sIAAAAAAAACpVRQWrDMBD8ihA5ONDG7qEXxQ70HXUPir0KgrUsrHWIMf57pXWdlFIKPe6MZmZnNUtjEYJU77N0ugOp5Jv38knS5NMQroAEcQ79ODQJKUMzWE-n2tWEQIJ60igq8VIUxw0LHhxFbBdIE2TF_s4gmG8Ea5mM9A6MgYaybC-qk5gTlDT8fg15Xo3ZbPlTti2w6ZLNQ1bmjw6uRH0G5DqldX6MjWL1qpaDdheopThb16qrxhGqmX0X0elbNbP3InKWfjH5hvKYku7u_wtKC_-aw8Q9Jk0_UgJNCOvvJHC7SGuDRz0pYRBuxxW7aK9EcXiFbr0NX4bl8cO7vrXGQisVDSMsH8sniirsuSsCAAA=)):
-
-```svelte
-<script>
-	let total = 100;
-	let spent = $state(0);
-	let left = $state(total);
-
-	$effect(() => {
-		left = total - spent;
-	});
-
-	$effect(() => {
-		spent = total - left;
-	});
-</script>
-
-<label>
-	<input type="range" bind:value={spent} max={total} />
-	{spent}/{total} spent
-</label>
-
-<label>
-	<input type="range" bind:value={left} max={total} />
-	{left}/{total} left
-</label>
-```
-
-Instead, use callbacks where possible ([demo](/#H4sIAAAAAAAACo1SMW6EMBD8imWluFNyQIo0HERKf13KkMKB5WTJGAsvp0OIv8deMEEJRcqdmZ1ZjzzyWiqwPP0YuRYN8JS_GcOfOA7GD_YGCsHNtu270iOZLTtp8LXQBSpAhi0KxXL2nCTngFkDGh32YFEgHJLjyiioNwTtEunoutclylaz3lSOfPceBziy0ZMFBs9HiFB0V8DoJlQP55ldfOdjTvMBRE275hcn33gv2_vWITh4e3GwzuKfNnSmxBcoKiaT2vSuG1diXvBO6CsUnJFrPpLhxFpNonzcvHdijbjnI0VNLCavRR8HlEYfvcb9O9mf_if4QuBOLqnXWD_9SrU4KJg_ggdDm5W0RokhZbWC-1LiVZiUJdELNJvqaN39raatZC2h4il2PUyf0zcIbC-7lgIAAA==)):
-
-```svelte
-<script>
-	let total = 100;
-	let spent = $state(0);
-	let left = $state(total);
-
-	function updateSpent(e) {
-		spent = +e.target.value;
-		left = total - spent;
-	}
-
-	function updateLeft(e) {
-		left = +e.target.value;
-		spent = total - left;
-	}
-</script>
-
-<label>
-	<input
-		type="range"
-		value={spent}
-		oninput={updateSpent}
-		max={total}
-	/>
-	{spent}/{total} spent
-</label>
-
-<label>
-	<input
-		type="range"
-		value={left}
-		oninput={updateLeft}
-		max={total}
-	/>
-	{left}/{total} left
-</label>
-```
-
-If you need to use bindings, for whatever reason (for example when you want some kind of "writable `$derived`"), consider using getters and setters to synchronise state ([demo](/#H4sIAAAAAAAACpVRQW7DIBD8CkI9JFIau4deiB2p7yg9kHhtIWGMYG3Fsvh7ARs3qnrpCWZGM8MuC22lAkfZ50K16IEy-mEMPVGcTQRuAoUQsBtGe49M5e5WGrxyzVEBEhxQKFKTt7K8ZM4Z0Bi4F4cC4VAeo7JpCtooLRFz7AIzCTXC4ZgpjhZwtHpLfl3TLqvoT-vpdt_0ZMy92TllVzx8AFXx83pdKXEDlQappDZjmCUMXXNqhe6AU3KTumGppV5StCe9eNRLivekSNZNKTKbYGza0_9XFPdzTvc_257kvTJyvxodzgrWP4pkXlEjnVFiZqRV8NiW0wnDSHl-hz4RPm0p2cO390MjWwkNZWhD5Zf_BkCCa6AxAgAA)):
-
-```svelte
-<script>
-	let total = 100;
-	let spent = $state(0);
-
-	let left = {
-		get value() {
-			return total - spent;
-		},
-		set value(v) {
-			spent = total - v;
-		}
-	};
-</script>
-
-<label>
-	<input type="range" bind:value={spent} max={total} />
-	{spent}/{total} spent
-</label>
-
-<label>
-	<input type="range" bind:value={left.value} max={total} />
-	{left.value}/{total} left
-</label>
-```
-
-If you absolutely have to update `$state` within an effect and run into an infinite loop because you read and write to the same `$state`, use [untrack](functions#untrack).
-
-### What this replaces
-
-The portions of `$: {}` that are triggering side-effects can be replaced with `$effect` while being careful to migrate updates of reactive variables to use `$derived`. There are some important differences:
-
-- Effects only run in the browser, not during server-side rendering
-- They run after the DOM has been updated, whereas `$:` statements run immediately _before_
-- You can return a cleanup function that will be called whenever the effect refires
-
-Additionally, you may prefer to use effects in some places where you previously used `onMount` and `afterUpdate` (the latter of which will be deprecated in Svelte 5). There are some differences between these APIs as `$effect` should not be used to compute reactive values and will be triggered each time a referenced reactive variable changes (unless using `untrack`).
-
-## `$effect.pre`
-
-In rare cases, you may need to run code _before_ the DOM updates. For this we can use the `$effect.pre` rune:
-
-```svelte
-<script>
-	import { tick } from 'svelte';
-
-	let div = $state();
-	let messages = $state([]);
-
-	// ...
-
-	$effect.pre(() => {
-		if (!div) return; // not yet mounted
-
-		// reference `messages` array length so that this code re-runs whenever it changes
-		messages.length;
-
-		// autoscroll when new messages are added
-		if (
-			div.offsetHeight + div.scrollTop >
-			div.scrollHeight - 20
-		) {
-			tick().then(() => {
-				div.scrollTo(0, div.scrollHeight);
-			});
-		}
-	});
-</script>
-
-<div bind:this={div}>
-	{#each messages as message}
-		<p>{message}</p>
-	{/each}
-</div>
-```
-
-Apart from the timing, `$effect.pre` works exactly like [`$effect`](#$effect) — refer to its documentation for more info.
-
-### What this replaces
-
-Previously, you would have used `beforeUpdate`, which — like `afterUpdate` — is deprecated in Svelte 5.
-
-## `$effect.tracking`
-
-The `$effect.tracking` rune is an advanced feature that tells you whether or not the code is running inside a tracking context, such as an effect or inside your template ([demo](/#H4sIAAAAAAAACn3PQWrDMBAF0KtMRSA2xPFeUQU5R92FUUZBVB4N1rgQjO9eKSlkEcjyfz6PmVX5EDEr_bUqGidUWp2Z1UHJjWvIvxgFS85pmV1tTHZzYLEDDeIS5RTxGNO12QcClyZOhCSQURbW-wPs0Ht0cpR5dD-Brk3bnqDvwY8xYzGK8j9pmhY-Lay1eqUfm3eizEsFZWtPA5n-eSYZtkUQnDiOghrWV2IzPVswH113d6DrbHl6SpfgA16UruX2vf0BWo7W2y8BAAA=)):
-
-```svelte
-<script>
-	console.log('in component setup:', $effect.tracking()); // false
-
-	$effect(() => {
-		console.log('in effect:', $effect.tracking()); // true
-	});
-</script>
-
-<p>in template: {$effect.tracking()}</p> <!-- true -->
-```
-
-This allows you to (for example) add things like subscriptions without causing memory leaks, by putting them in child effects.
-
-## `$effect.root`
-
-The `$effect.root` rune is an advanced feature that creates a non-tracked scope that doesn't auto-cleanup. This is useful for
-nested effects that you want to manually control. This rune also allows for creation of effects outside of the component initialisation phase.
-
-```svelte
-<script>
-	let count = $state(0);
-
-	const cleanup = $effect.root(() => {
-		$effect(() => {
-			console.log(count);
-		});
-
-		return () => {
-			console.log('effect root cleanup');
-		};
-	});
-</script>
-```
-
-## `$props`
-
-To declare component props, use the `$props` rune:
-
-```js
-let { optionalProp = 42, requiredProp } = $props();
-```
-
-You can use familiar destructuring syntax to rename props, in cases where you need to (for example) use a reserved word like `catch` in `<MyComponent catch={22} />`:
-
-```js
-let { catch: theCatch } = $props();
-```
-
-To get all properties, use rest syntax:
-
-```js
-let { a, b, c, ...everythingElse } = $props();
-```
-
-You can also use an identifier:
-
-```js
-let props = $props();
-```
-
-If you're using TypeScript, you can declare the prop types:
-
-<!-- prettier-ignore -->
-```ts
-interface MyProps {
-	required: string;
-	optional?: number;
-	partOfEverythingElse?: boolean;
-};
-
-let { required, optional, ...everythingElse }: MyProps = $props();
-```
-
-> In an earlier preview, `$props()` took a type argument. This caused bugs, since in a case like this...
->
-> ```ts
-> // @errors: 2558
-> let { x = 42 } = $props<{ x?: string }>();
-> ```
->
-> ...TypeScript [widens the type](https://www.typescriptlang.org/play?#code/CYUwxgNghgTiAEAzArgOzAFwJYHtXwBIAHGHIgZwB4AVeAXnilQE8A+ACgEoAueagbgBQgiCAzwA3vAAe9eABYATPAC+c4qQqUp03uQwwsqAOaqOnIfCsB6a-AB6AfiA) of `x` to be `string | number`, instead of erroring.
-
-If you're using JavaScript, you can declare the prop types using JSDoc:
-
-```js
-/** @type {{ x: string }} */
-let { x } = $props();
-
-// or use @typedef if you want to document the properties:
-
-/**
- * @typedef {Object} MyProps
- * @property {string} y Some documentation
- */
-
-/** @type {MyProps} */
-let { y } = $props();
-```
-
-By default props are treated as readonly, meaning reassignments will not propagate upwards and mutations will result in a warning at runtime in development mode. You will also get a runtime error when trying to `bind:` to a readonly prop in a parent component. To declare props as bindable, use [`$bindable()`](#$bindable).
-
-### What this replaces
-
-`$props` replaces the `export let` and `export { x as y }` syntax for declaring props. It also replaces `$$props` and `$$restProps`, and the little-known `interface $$Props {...}` construct.
-
-Note that you can still use `export const` and `export function` to expose things to users of your component (if they're using `bind:this`, for example).
-
-## `$bindable`
-
-To declare props as bindable, use `$bindable()`. Besides using them as regular props, the parent can (_can_, not _must_) then also `bind:` to them.
-
-```svelte
-<script>
-	let { bindableProp = $bindable() } = $props();
-</script>
-```
-
-You can pass an argument to `$bindable()`. This argument is used as a fallback value when the property is `undefined`.
-
-```svelte
-<script>
-	let { bindableProp = $bindable('fallback') } = $props();
-</script>
-```
-
-Note that the parent is not allowed to pass `undefined` to a property with a fallback if it `bind:`s to that property.
-
-## `$inspect`
-
-The `$inspect` rune is roughly equivalent to `console.log`, with the exception that it will re-run whenever its
-argument changes. `$inspect` tracks reactive state deeply, meaning that updating something inside an object
-or array using [fine-grained reactivity](/docs/fine-grained-reactivity) will cause it to re-fire. ([Demo:](/#H4sIAAAAAAAACkWQ0YqDQAxFfyUMhSotdZ-tCvu431AXtGOqQ2NmmMm0LOK_r7Utfby5JzeXTOpiCIPKT5PidkSVq2_n1F7Jn3uIcEMSXHSw0evHpAjaGydVzbUQCmgbWaCETZBWMPlKj29nxBDaHj_edkAiu12JhdkYDg61JGvE_s2nR8gyuBuiJZuDJTyQ7eE-IEOzog1YD80Lb0APLfdYc5F9qnFxjiKWwbImo6_llKRQVs-2u91c_bD2OCJLkT3JZasw7KLA2XCX31qKWE6vIzNk1fKE0XbmYrBTufiI8-_8D2cUWBA_AQAA))
-
-```svelte
-<script>
-	let count = $state(0);
-	let message = $state('hello');
-
-	$inspect(count, message); // will console.log when `count` or `message` change
-</script>
-
-<button onclick={() => count++}>Increment</button>
-<input bind:value={message} />
-```
-
-`$inspect` returns a property `with`, which you can invoke with a callback, which will then be invoked instead of `console.log`. The first argument to the callback is either `"init"` or `"update"`, all following arguments are the values passed to `$inspect`. [Demo:](/#H4sIAAAAAAAACkVQ24qDMBD9lSEUqlTqPlsj7ON-w7pQG8c2VCchmVSK-O-bKMs-DefKYRYx6BG9qL4XQd2EohKf1opC8Nsm4F84MkbsTXAqMbVXTltuWmp5RAZlAjFIOHjuGLOP_BKVqB00eYuKs82Qn2fNjyxLtcWeyUE2sCRry3qATQIpJRyD7WPVMf9TW-7xFu53dBcoSzAOrsqQNyOe2XUKr0Xi5kcMvdDB2wSYO-I9vKazplV1-T-d6ltgNgSG1KjVUy7ZtmdbdjqtzRcphxMS1-XubOITJtPrQWMvKnYB15_1F7KKadA_AQAA)
-
-```svelte
-<script>
-	let count = $state(0);
-
-	$inspect(count).with((type, count) => {
-		if (type === 'update') {
-			debugger; // or `console.trace`, or whatever you want
-		}
-	});
-</script>
-
-<button onclick={() => count++}>Increment</button>
-```
-
-A convenient way to find the origin of some change is to pass `console.trace` to `with`:
-
-```js
-// @errors: 2304
-$inspect(stuff).with(console.trace);
-```
-
-> `$inspect` only works during development.
-
-## `$host`
-
-Retrieves the `this` reference of the custom element that contains this component. Example:
-
-```svelte
-<svelte:options customElement="my-element" />
-
-<script>
-	function greet(greeting) {
-		$host().dispatchEvent(
-			new CustomEvent('greeting', { detail: greeting })
-		);
-	}
-</script>
-
-<button onclick={() => greet('hello')}>say hello</button>
-```
-
-> Only available inside custom element components, and only on the client-side
-
-## How to opt in
-
-Current Svelte code will continue to work without any adjustments. Components using the Svelte 4 syntax can use components using runes and vice versa.
-
-The easiest way to opt in to runes mode is to just start using them in your code. Alternatively, you can force the compiler into runes or non-runes mode either on a per-component basis...
-
-<!-- prettier-ignore -->
-```svelte
-<!--- file: YourComponent.svelte --->
-<!-- this can be `true` or `false` -->
-<svelte:options runes={true} />
-```
-
-...or for your entire app:
-
-```js
-/// file: svelte.config.js
-export default {
-	compilerOptions: {
-		runes: true
-	}
-};
-```
diff --git a/sites/svelte-5-preview/src/routes/docs/content/01-api/03-snippets.md b/sites/svelte-5-preview/src/routes/docs/content/01-api/03-snippets.md
deleted file mode 100644
index b3fe34d21a3b..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/01-api/03-snippets.md
+++ /dev/null
@@ -1,269 +0,0 @@
----
-title: Snippets
----
-
-Snippets, and _render tags_, are a way to create reusable chunks of markup inside your components. Instead of writing duplicative code like [this](/#H4sIAAAAAAAAE5VUYW-kIBD9K8Tmsm2yXXRzvQ-s3eR-R-0HqqOQKhAZb9sz_vdDkV1t000vRmHewMx7w2AflbIGG7GnPlK8gYhFv42JthG-m9Gwf6BGcLbVXZuPSGrzVho8ZirDGpDIhldgySN5GpEMez9kaNuckY1ANJZRamRuu2ZnhEZt6a84pvs43mzD4pMsUDDi8DMkQFYCGdkvsJwblFq5uCik9bmJ4JZwUkv1eoknWigX2eGNN6aGXa6bjV8ybP-X7sM36T58SVcrIIV2xVIaA41xeD5kKqWXuqpUJEefOqVuOkL9DfBchGrzWfu0vb-RpTd3o-zBR045Ga3HfuE5BmJpKauuhbPtENlUF2sqR9jqpsPSxWsMrlngyj3VJiyYjJXb1-lMa7IWC-iSk2M5Zzh-SJjShe-siq5kpZRPs55BbSGU5YPyte4vVV_VfFXxVb10dSLf17pS2lM5HnpPxw4Zpv6x-F57p0jI3OKlVnhv5V9wPQrNYQQ9D_f6aGHlC89fq1Z3qmDkJCTCweOGF4VUFSPJvD_DhreVdA0eu8ehJJ5x91dBaBkpWm3ureCFPt3uzRv56d4kdp-2euG38XZ6dsnd3ZmPG9yRBCrzRUvi-MccOdwz3qE-fOZ7AwAhlrtTUx3c76vRhSwlFBHDtoPhefgHX3dM0PkEAAA=)...
-
-```svelte
-{#each images as image}
-	{#if image.href}
-		<a href={image.href}>
-			<figure>
-				<img
-					src={image.src}
-					alt={image.caption}
-					width={image.width}
-					height={image.height}
-				/>
-				<figcaption>{image.caption}</figcaption>
-			</figure>
-		</a>
-	{:else}
-		<figure>
-			<img
-				src={image.src}
-				alt={image.caption}
-				width={image.width}
-				height={image.height}
-			/>
-			<figcaption>{image.caption}</figcaption>
-		</figure>
-	{/if}
-{/each}
-```
-
-...you can write [this](/#H4sIAAAAAAAAE5VUYW-bMBD9KxbRlERKY4jWfSA02n5H6QcXDmwVbMs-lnaI_z6D7TTt1moTAnPvzvfenQ_GpBEd2CS_HxPJekjy5IfWyS7BFz0b9id0CM62ajDVjBS2MkLjqZQldoBE9KwFS-7I_YyUOPqlRGuqnKw5orY5pVpUduj3mitUln5LU3pI0_UuBp9FjTwnDr9AHETLMSeHK6xiGoWSLi9yYT034cwSRjohn17zcQPNFTs8s153sK9Uv_Yh0-5_5d7-o9zbD-UqCaRWrllSYZQxLw_HUhb0ta-y4NnJUxfUvc7QuLJSaO0a3oh2MLBZat8u-wsPnXzKQvTtVVF34xK5d69ThFmHEQ4SpzeVRediTG8rjD5vBSeN3E5JyHh6R1DQK9-iml5kjzQUN_lSgVU8DhYLx7wwjSvRkMDvTjiwF4zM1kXZ7DlF1eN3A7IG85e-zRrYEjjm0FkI4Cc7Ripm0pHOChexhcWXzreeZyRMU6Mk3ljxC9w4QH-cQZ_b3T5pjHxk1VNr1CDrnJy5QDh6XLO6FrLNSRb2l9gz0wo3S6m7HErSgLsPGMHkpDZK31jOanXeHPQz-eruLHUP0z6yTbpbrn223V70uMXNSpQSZjpL0y8hcxxpNqA6_ql3BQAxlxvfpQ_uT9GrWjQC6iRHM8D0MP0GQsIi92QEAAA=):
-
-```diff
-+{#snippet figure(image)}
-	<figure>
-		<img
-			src={image.src}
-			alt={image.caption}
-			width={image.width}
-			height={image.height}
-		/>
-		<figcaption>{image.caption}</figcaption>
-	</figure>
-+{/snippet}
-
-{#each images as image}
-	{#if image.href}
-		<a href={image.href}>
-+			{@render figure(image)}
-		</a>
-	{:else}
-+		{@render figure(image)}
-	{/if}
-{/each}
-```
-
-Snippet parameters can be destructured ([demo](/#H4sIAAAAAAAAE5VTYW-bMBD9KyeiKYlEY4jWfSAk2n5H6QcXDmwVbMs2SzuL_z6DTRqp2rQJ2Ycfd_ced2eXtLxHkxRPLhF0wKRIfiiVpIl9V_PB_MTeoj8bOep6RkpTa67spRKV7dECH2iHBs7wNCOVdcFU1ui6gC2zVpmCEMVrMw4HxaSVhnzLMnLMsm26Ol95Y1kBHr9BDHnHbAHHO6ymynIpfF7LuAncwKgBCj0Xrx_5mMb2jh3f6KB6PNRy2AaXKf1fuY__KPfxj3KlQGikL5aQdpUxm-dTJUryUVdRsvwSqEviX2fIbYzgSvmCt7wbNe4ceMUpRIoUFkkpBBkw7ZfMZXC-BLKSDx3Q3p5djJrA-SR-X4K9DdHT6u-jo-flFlKSO3ThIDcSR6LIKUhGWrN1QGhs16LLbXgbjoe5U1PkozCfzu7uy2WtpfuuUTSo1_9ffPZrJKGLoyuwNxjBv0Q4wmdSR2aFi9jS2Pc-FIrlEKeilcI-GP4LfVtxOM1gyO1XSLp6vtD6tdNyFE0BV8YtngKuaNNw0RWQx_jKDlR33M9E5h-PQhZxfxEt6gIaLdWDYbSR191RvcFXv_LMb7p7obssXZ5Dvt_f9HgzdzZKibOZZ9mXmHkdTTpaefqsd4OIay4_hksd_I0fZMNbjk1SWD3i9Dz9BpdEPu8sBAAA)):
-
-```svelte
-{#snippet figure({ src, caption, width, height })}
-	<figure>
-		<img alt={caption} {src} {width} {height} />
-		<figcaption>{caption}</figcaption>
-	</figure>
-{/snippet}
-```
-
-Like function declarations, snippets can have an arbitrary number of parameters, which can have default values. You cannot use rest parameters however.
-
-## Snippet scope
-
-Snippets can be declared anywhere inside your component. They can reference values declared outside themselves, for example in the `<script>` tag or in `{#each ...}` blocks ([demo](/#H4sIAAAAAAAAE12P0QrCMAxFfyWrwhSEvc8p-h1OcG5RC10bmkyQ0n-3HQPBx3vCPUmCemiDrOpLULYbUdXqTKR2Sj6UA7_RCKbMbvJ9Jg33XpMcW9uKQYEAIzJ3T4QD3LSUDE-PnYA4YET4uOkGMc3W5B3xZrtvbVP9HDas2GqiZHqhMW6Tr9jGbG_oOCMImcUCwrIpFk1FqRyqpRpn0cmjHdAvnrIzuscyq_4nd3dPPD01ukE_NA6qFj9hvMYvGjJADw8BAAA=))...
-
-```svelte
-<script>
-	let { message = `it's great to see you!` } = $props();
-</script>
-
-{#snippet hello(name)}
-	<p>hello {name}! {message}!</p>
-{/snippet}
-
-{@render hello('alice')}
-{@render hello('bob')}
-```
-
-...and they are 'visible' to everything in the same lexical scope (i.e. siblings, and children of those siblings):
-
-```svelte
-<div>
-	{#snippet x()}
-		{#snippet y()}...{/snippet}
-
-		<!-- this is fine -->
-		{@render y()}
-	{/snippet}
-
-	<!-- this will error, as `y` is not in scope -->
-	{@render y()}
-</div>
-
-<!-- this will also error, as `x` is not in scope -->
-{@render x()}
-```
-
-Snippets can reference themselves and each other ([demo](/#H4sIAAAAAAAAE2WPTQqDMBCFrxLiRqH1Zysi7TlqF1YnENBJSGJLCYGeo5tesUeosfYH3c2bee_jjaWMd6BpfrAU6x5oTvdS0g01V-mFPkNnYNRaDKrxGxto5FKCIaeu1kYwFkauwsoUWtZYPh_3W5FMY4U2mb3egL9kIwY0rbhgiO-sDTgjSEqSTvIDs-jiOP7i_MHuFGAL6p9BtiSbOTl0GtzCuihqE87cqtyam6WRGz_vRcsZh5bmRg3gju4Fptq_kzQBAAA=)):
-
-```svelte
-{#snippet blastoff()}
-	<span>🚀</span>
-{/snippet}
-
-{#snippet countdown(n)}
-	{#if n > 0}
-		<span>{n}...</span>
-		{@render countdown(n - 1)}
-	{:else}
-		{@render blastoff()}
-	{/if}
-{/snippet}
-
-{@render countdown(10)}
-```
-
-## Passing snippets to components
-
-Within the template, snippets are values just like any other. As such, they can be passed to components as props ([demo](/#H4sIAAAAAAAAE41SwY6bMBD9lRGplKQlYRMpF5ZF7T_0ttmDwSZYJbZrT9pGlv-9g4Fkk-xhxYV5vHlvhjc-aWQnXJK_-kSxo0jy5IcxSZrg2fSF-yM6FFQ7fbJ1jxSuttJguVd7lEejLcJPVnUCGquPMF9nsVoPjfNnohGx1sohMU4SHbzAa4_t0UNvmcOcGUNDzFP4jeccdikYK2v6sIWQ3lErpui5cDdPF_LmkVy3wlp5Vd5e2U_rHYSe_kYjFtl1KeVnTkljBEIrGBd2sYy8AtsyLlBk9DYhJHtTR_UbBDWybkR8NkqHWyOr_y74ZMNLz9f9AoG6ePkOJLMHLBp-xISvcPf11r0YUuMM2Ysfkgngh5XphUYKkJWU_FFz2UjBkxztSYT0cihR4LOn0tGaPrql439N-7Uh0Dl8MVYbt1jeJ1Fg7xDb_Uw2Y18YQqZ_S2U5FH1pS__dCkWMa3C0uR0pfQRTg89kE4bLLLDS_Dxy_Eywuo1TAnPAw4fqY1rvtH3W9w35ZZMgvU3jq8LhedwkguCHRhT_cMU6eVA5dKLB5wGutCWjlTOslupAxxrxceKoD2hzhe2qbmXHF1v1bbOcNCtW_zpYfVI8h5kQ4qY3mueHTlesW2C7TOEO4hcdwzgf3Nc7cZxUKKC4yuNhvIX_MlV_Xk0EAAA=)):
-
-```svelte
-<script>
-	import Table from './Table.svelte';
-
-	const fruits = [
-		{ name: 'apples', qty: 5, price: 2 },
-		{ name: 'bananas', qty: 10, price: 1 },
-		{ name: 'cherries', qty: 20, price: 0.5 }
-	];
-</script>
-
-{#snippet header()}
-	<th>fruit</th>
-	<th>qty</th>
-	<th>price</th>
-	<th>total</th>
-{/snippet}
-
-{#snippet row(d)}
-	<td>{d.name}</td>
-	<td>{d.qty}</td>
-	<td>{d.price}</td>
-	<td>{d.qty * d.price}</td>
-{/snippet}
-
-<Table data={fruits} {header} {row} />
-```
-
-As an authoring convenience, snippets declared directly _inside_ a component implicitly become props _on_ the component ([demo](/#H4sIAAAAAAAAE41Sy27bMBD8lYVcwHYrW4kBXxRFaP-htzgHSqQsojLJkuu2BqF_74qUrfhxCHQRh7MzO9z1SSM74ZL8zSeKHUSSJz-MSdIET2Y4uD-iQ0Fnp4-2HpDC1VYaLHdqh_JgtEX4yapOQGP1AebrLJzWsXD-QjQi1lo5JMZRooNXeBuwHXoYLHOYM2OoiXkKv_GUwzYFY2VNFxvo0xtqxRR9F-7z04X8fE-uW2GtnJQ3E_tpvYV-oL9Ti0U2hVJFjMMZslcfW-5DWj9zShojEFrBuLCLZR_9CmzLQCwy-psw8rxBgvkNhhpZd8F8NppE7Stbq_8u-GTKS8_XQ9Keqnl5BZP1AzTYP2bDV7i7_9hLEeda0iocNJeNFDzJ0R5Fn142JzA-uzsdBfLhldPxPdMhIPS0H1-M1cYtlnejwdBDfBXZjHXTFOg4BhuOtvTfrVDEmAZG2ew5ezYV-Ew2fVzVAivNTyPHzwSr29AlMAe8f6g-zuWDts-GusAmdBSkv3P7qnB4GpMEEHwsRPEPV6yTe5VDJxp8iXClLRmtnGG1VHva3oCPHQd9QJsrbFd1Kzu-2Khvz8uzZsXqX3urj4rnMBNCXNUG83zf6Yp1C2yXKdxA_KJjGOfRfb0Vh7MKDShEuV-M9_4_nq6svF4EAAA=)):
-
-```svelte
-<!-- this is semantically the same as the above -->
-<Table data={fruits}>
-	{#snippet header()}
-		<th>fruit</th>
-		<th>qty</th>
-		<th>price</th>
-		<th>total</th>
-	{/snippet}
-
-	{#snippet row(d)}
-		<td>{d.name}</td>
-		<td>{d.qty}</td>
-		<td>{d.price}</td>
-		<td>{d.qty * d.price}</td>
-	{/snippet}
-</Table>
-```
-
-Any content inside the component tags that is _not_ a snippet declaration implicitly becomes part of the `children` snippet ([demo](/#H4sIAAAAAAAAE41S247aMBD9lVFYCegGsiDxks1G7T_0bdkHJ3aI1cR27aEtsvzvtZ0LZeGhiiJ5js-cmTMemzS8YybJ320iSM-SPPmmVJImeFEhML9Yh8zHRp51HZDC1JorLI_iiLxXUiN8J1XHoNGyh-U2i9F2SFy-epon1lIY9IwzRwNv8B6wI1oIJXNYEqV8E8sUfuIlh0MKSvPaX-zBpZ-oFRH-m7m7l5m8uyfXLdOaX5X3V_bL9gAu0D98i0V2NSWKwQ4lSN7s0LKLbgtsyxgXmT9NiBe-iaP-DYISSTcj4bcLI7hSDEHL3yu6dkPfBdLS0m1o3nk-LW9gX-gBGss9ZsMXuLu32VjZBdfRaelft5eUN5zRJEd9Zi6dlyEy_ncdOm_IxsGlULe8o5qJNFgE5x_9SWmpzGp9N2-MXQxz4c2cOQ-lZWQyF0Jd2q_-mjI9U1fr4FBPE8iuKTbjjRt2sMBK0svIsQtG6jb2CsQAdQ_1x9f5R9tmIS-yPToK-tNkQRQGL6ObCIIdEpH9wQ3p-Enk0LEGXwe4ktoX2hhFai5Ofi0jPnYc9QF1LrDdRK-rvXjerSfNitQ_TlqeBc1hwRi7yY3F81MnK9KtsF2n8Amis44ilA7VtwfWTyr-kaKV-_X4cH8BTOhfRzcEAAA=)):
-
-```diff
-<Table data={fruits}>
--	{#snippet header()}
--		<th>fruit</th>
--		<th>qty</th>
--		<th>price</th>
--		<th>total</th>
--	{/snippet}
-+	<th>fruit</th>
-+	<th>qty</th>
-+	<th>price</th>
-+	<th>total</th>
-
-	<!-- ... -->
-</Table>
-```
-
-```diff
-<script>
--	let { data, header, row } = $props();
-+	let { data, children, row } = $props();
-</script>
-
-<table>
--	{#if header}
-+	{#if children}
-		<thead>
--			<tr>{@render header()}</tr>
-+			<tr>{@render children()}</tr>
-		</thead>
-	{/if}
-
-	<!-- ... -->
-</table>
-```
-
-> Note that you cannot have a prop called `children` if you also have content inside the component — for this reason, you should avoid having props with that name
-
-## Typing snippets
-
-Snippets implement the `Snippet` interface imported from `'svelte'`:
-
-```diff
--<script>
--	let { data, children, row } = $props();
-+<script lang="ts">
-+	import type { Snippet } from 'svelte';
-+
-+	let { data, children, row }: {
-+		data: any[];
-+		children: Snippet;
-+		row: Snippet<[any]>;
-+	} = $props();
-</script>
-```
-
-With this change, red squigglies will appear if you try and use the component without providing a `data` prop and a `row` snippet. Notice that the type argument provided to `Snippet` is a tuple, since snippets can have multiple parameters.
-
-We can tighten things up further by declaring a generic, so that `data` and `row` refer to the same type:
-
-```diff
--<script lang="ts">
-+<script lang="ts" generics="T">
-	import type { Snippet } from 'svelte';
-
-	let { data, children, row }: {
--		data: any[];
-+		data: T[];
-		children: Snippet;
--		row: Snippet<[any]>;
-+		row: Snippet<[T]>;
-	} = $props();
-</script>
-```
-
-## Creating snippets programmatically
-
-In advanced scenarios, you may need to create a snippet programmatically. For this, you can use [`createRawSnippet`](/docs/imports#svelte-createrawsnippet)
-
-## Snippets and slots
-
-In Svelte 4, content can be passed to components using [slots](https://svelte.dev/docs/special-elements#slot). Snippets are more powerful and flexible, and as such slots are deprecated in Svelte 5.
-
-They continue to work, however, and you can mix and match snippets and slots in your components.
-
-When using custom elements, you should still use `<slot />` like before. In a future version, when Svelte removes its internal version of slots, it will leave those slots as-is, i.e. output a regular DOM tag instead of transforming it.
diff --git a/sites/svelte-5-preview/src/routes/docs/content/01-api/04-event-handlers.md b/sites/svelte-5-preview/src/routes/docs/content/01-api/04-event-handlers.md
deleted file mode 100644
index 5124ae291d3e..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/01-api/04-event-handlers.md
+++ /dev/null
@@ -1,205 +0,0 @@
----
-title: Event handlers
----
-
-Event handlers have been given a facelift in Svelte 5. Whereas in Svelte 4 we use the `on:` directive to attach an event listener to an element, in Svelte 5 they are properties like any other:
-
-```diff
-<script>
-	let count = $state(0);
-</script>
-
--<button on:click={() => count++}>
-+<button onclick={() => count++}>
-	clicks: {count}
-</button>
-```
-
-Since they're just properties, you can use the normal shorthand syntax...
-
-```svelte
-<script>
-	let count = $state(0);
-
-	function onclick() {
-		count++;
-	}
-</script>
-
-<button {onclick}>
-	clicks: {count}
-</button>
-```
-
-...though when using a named event handler function it's usually better to use a more descriptive name.
-
-Traditional `on:` event handlers will continue to work, but are deprecated in Svelte 5.
-
-## Component events
-
-In Svelte 4, components could emit events by creating a dispatcher with [`createEventDispatcher`](https://svelte.dev/docs/svelte#createeventdispatcher).
-
-This function is deprecated in Svelte 5. Instead, components should accept _callback props_ - which means you then pass functions as properties to these components ([demo](/#H4sIAAAAAAAACo1US27bMBC9yoBtELu2ZDmAG0CRhPYG3VddyPIwIUKRgjiOkwrcd9VFL5BV75cjFKQo2e5_IQnzeW-GM3zqGRcSDUs_9kxVDbKUvW9btmT01DrDPKAkZEtm9L6rnSczdSdaKkpVkmha3RF82Dct8E43cBmvnBEPsMsbl-QeiQRGfEbI4bWhinC23sxvxsh23xk6hnglDfqoKonvVU1CK-jQIM3m0HtOCmzrzVCDRg4P9j5bqmx1bFZlrjPfteKyIsz7WasP2M0hL85YFzn4QGAWHGbeX8D1Zj41S90-1LHuvcM_kp4QJPNhDNFpCUew8i32rwQfCnjObLsn0gq0qqWo7_Pez8AWCg-wraTUWmWrIcevIzNtpaCWlTF5ybZaNyUrXp6_fc9WLlKUqk9RGrS_SR7oSgaGniTmJTN1JTGFPomTNbzxbduSFcORXp6_fvEkE_FKcOun7PE-zRcIM2i1EW6NKXDxiLswWomcUkiCRbo9Ggexo7sU1klyETx3KG7v6MzFtaLIdea9D4eRCB8pqqS4VSnUqGhapRQKo4nnZmxNuJQIH1CRSUFpNV0g94nDbMajUFep8TB-SJDEV-YcoXUzpldKNNWQ7d1JvDHAdXeout0Z6t09PvGuatDAKT65gB7CMpL4LdjBfbU5819vxoAbz0lkcA9aCJthS9boneACdyx119guJ_E7jfyv-p10ewhqWkJQAFin5LbTrZkdJe5v-1HiXvzn6vz5rs-8hAJ7EJUtgn1y7f8ADN1MwGD_G-gBUWSLaModfnA-kELvvxb-Bl8sbLGY4L_O-5P9ATwVcA54BQAA)):
-
-```svelte
-<script>
-	import Pump from './Pump.svelte';
-
-	let size = $state(15);
-	let burst = $state(false);
-
-	function reset() {
-		size = 15;
-		burst = false;
-	}
-</script>
-
-<Pump
-	inflate={(power) => {
-		size += power;
-		if (size > 75) burst = true;
-	}}
-	deflate={(power) => {
-		if (size > 0) size -= power;
-	}}
-/>
-
-{#if burst}
-	<button onclick={reset}>new balloon</button>
-	<span class="boom">💥</span>
-{:else}
-	<span class="balloon" style="scale: {0.01 * size}">
-		🎈
-	</span>
-{/if}
-```
-
-```svelte
-<script>
-	let { inflate, deflate } = $props();
-	let power = $state(5);
-</script>
-
-<button onclick={() => inflate(power)}>inflate</button>
-<button onclick={() => deflate(power)}>deflate</button>
-<button onclick={() => power--}>-</button>
-Pump power: {power}
-<button onclick={() => power++}>+</button>
-```
-
-## Bubbling events
-
-Instead of doing `<button on:click>` to 'forward' the event from the element to the component, the component should accept an `onclick` callback prop:
-
-```svelte
-<script>
-	let { onclick, children } = $props();
-</script>
-
-<button {onclick}>
-	{@render children()}
-</button>
-```
-
-Note that this also means you can 'spread' event handlers onto the element along with other props:
-
-```svelte
-<script>
-	let { children, ...props } = $props();
-</script>
-
-<button {...props}>
-	{@render children()}
-</button>
-```
-
-## Event modifiers
-
-In Svelte 4, you can add event modifiers to handlers:
-
-```svelte
-<button on:click|once|preventDefault={handler}>...</button>
-```
-
-Modifiers are specific to `on:` and as such do not work with modern event handlers. Adding things like `event.preventDefault()` inside the handler itself is preferable, since all the logic lives in one place rather than being split between handler and modifiers.
-
-Since event handlers are just functions, you can create your own wrappers as necessary:
-
-```svelte
-<script>
-	function once(fn) {
-		return function (event) {
-			if (fn) fn.call(this, event);
-			fn = null;
-		};
-	}
-
-	function preventDefault(fn) {
-		return function (event) {
-			event.preventDefault();
-			fn.call(this, event);
-		};
-	}
-</script>
-
-<button onclick={once(preventDefault(handler))}>...</button>
-```
-
-There are three modifiers — `capture`, `passive` and `nonpassive` — that can't be expressed as wrapper functions, since they need to be applied when the event handler is bound rather than when it runs.
-
-For `capture`, we add the modifier to the event name:
-
-```svelte
-<button onclickcapture={...}>...</button>
-```
-
-Changing the [`passive`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#using_passive_listeners) option of an event handler, meanwhile, is not something to be done lightly. If you have a use case for it — and you probably don't! - then you will need to use an action to apply the event handler yourself.
-
-## Multiple event handlers
-
-In Svelte 4, this is possible:
-
-```svelte
-<button on:click={one} on:click={two}>...</button>
-```
-
-This is something of an anti-pattern, since it impedes readability (if there are many attributes, it becomes harder to spot that there are two handlers unless they are right next to each other) and implies that the two handlers are independent, when in fact something like `event.stopImmediatePropagation()` inside `one` would prevent `two` from being called.
-
-Duplicate attributes/properties on elements — which now includes event handlers — are not allowed. Instead, do this:
-
-```svelte
-<button
-	onclick={(e) => {
-		one(e);
-		two(e);
-	}}
->
-	...
-</button>
-```
-
-When spreading props, local event handlers must go _after_ the spread, or they risk being overwritten:
-
-```svelte
-<button
-	{...props}
-	onclick={(e) => {
-		doStuff(e);
-		props.onclick?.(e);
-	}}
->
-	...
-</button>
-```
-
-## Why the change?
-
-By deprecating `createEventDispatcher` and the `on:` directive in favour of callback props and normal element properties, we:
-
-- reduce Svelte's learning curve
-- remove boilerplate, particularly around `createEventDispatcher`
-- remove the overhead of creating `CustomEvent` objects for events that may not even have listeners
-- add the ability to spread event handlers
-- add the ability to know which event handlers were provided to a component
-- add the ability to express whether a given event handler is required or optional
-- increase type safety (previously, it was effectively impossible for Svelte to guarantee that a component didn't emit a particular event)
diff --git a/sites/svelte-5-preview/src/routes/docs/content/01-api/05-imports.md b/sites/svelte-5-preview/src/routes/docs/content/01-api/05-imports.md
deleted file mode 100644
index 7cbec56e17ac..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/01-api/05-imports.md
+++ /dev/null
@@ -1,277 +0,0 @@
----
-title: Imports
----
-
-As well as runes, Svelte 5 introduces a handful of new things you can import, alongside existing ones like `getContext`, `setContext` and `tick`.
-
-## `svelte`
-
-### `flushSync`
-
-Forces any pending effects (including DOM updates) to be applied immediately, rather than in the future. This is mainly useful in a testing context — you'll rarely need it in application code.
-
-```svelte
-<script>
-	import { flushSync } from 'svelte';
-
-	let count = $state(0);
-	let element;
-
-	function onclick() {
-		flushSync(() => (count += 1));
-
-		// without `flushSync`, the DOM would be updated in the future
-		console.log(element.textContent === String(count));
-	}
-</script>
-
-<span bind:this={element}>{count}</span>
-<button {onclick}>update</button>
-```
-
-### `mount`
-
-Instantiates a component and mounts it to the given target:
-
-```js
-// @errors: 2322
-import { mount } from 'svelte';
-import App from './App.svelte';
-
-const app = mount(App, {
-	target: document.querySelector('#app'),
-	props: { some: 'property' }
-});
-```
-
-Note that unlike calling `new App(...)` in Svelte 4, things like effects (including `onMount` callbacks, and action functions) will not run during `mount`. If you need to force pending effects to run (in the context of a test, for example) you can do so with `flushSync()`.
-
-### `hydrate`
-
-Like `mount`, but will reuse up any HTML rendered by Svelte's SSR output (from the [`render`](#svelte-server-render) function) inside the target and make it interactive:
-
-```js
-// @errors: 2322
-import { hydrate } from 'svelte';
-import App from './App.svelte';
-
-const app = hydrate(App, {
-	target: document.querySelector('#app'),
-	props: { some: 'property' }
-});
-```
-
-As with `mount`, effects will not run during `hydrate` — use `flushSync()` immediately afterwards if you need them to.
-
-### `unmount`
-
-Unmounts a component created with [`mount`](#svelte-mount) or [`hydrate`](#svelte-hydrate):
-
-```js
-// @errors: 1109
-import { mount, unmount } from 'svelte';
-import App from './App.svelte';
-
-const app = mount(App, {...});
-
-// later
-unmount(app);
-```
-
-### `untrack`
-
-To prevent something from being treated as an `$effect`/`$derived` dependency, use `untrack`:
-
-```svelte
-<script>
-	import { untrack } from 'svelte';
-
-	let { a, b } = $props();
-
-	$effect(() => {
-		// this will run when `a` changes,
-		// but not when `b` changes
-		console.log(a);
-		console.log(untrack(() => b));
-	});
-</script>
-```
-
-### `createRawSnippet`
-
-An advanced API designed for people building frameworks that integrate with Svelte, `createRawSnippet` allows you to create [snippets](/docs/snippets) programmatically for use with `{@render ...}` tags:
-
-```js
-import { createRawSnippet } from 'svelte';
-
-const greet = createRawSnippet((name) => {
-	return {
-		render: () => `
-			<h1>Hello ${name()}!</h1>
-		`,
-		setup: (node) => {
-			$effect(() => {
-				node.textContent = `Hello ${name()}!`;
-			});
-		}
-	};
-});
-```
-
-The `render` function is called during server-side rendering, or during `mount` (but not during `hydrate`, because it already ran on the server), and must return HTML representing a single element.
-
-The `setup` function is called during `mount` or `hydrate` with that same element as its sole argument. It is responsible for ensuring that the DOM is updated when the arguments change their value — in this example, when `name` changes:
-
-```svelte
-{@render greet(name)}
-```
-
-If `setup` returns a function, it will be called when the snippet is unmounted. If the snippet is fully static, you can omit the `setup` function altogether.
-
-## `svelte/reactivity`
-
-Svelte provides reactive `SvelteMap`, `SvelteSet`, `SvelteDate` and `SvelteURL` classes. These can be imported from `svelte/reactivity` and used just like their native counterparts. [Demo:](https://svelte-5-preview.vercel.app/#H4sIAAAAAAAAE32QwUrEMBBAf2XMpQrb9t7tFrx7UjxZYWM6NYFkEpJJ16X03yWK9OQeZ3iPecwqZmMxie5tFSQdik48hiAOgq-hDGlByygOIvkcVdn0SUUTeBhpZOOCjwwrvPxgr89PsMEcvYPqV2wjSsVmMXytjiMVR3lKDDlaOAHhZVfvK80cUte2-CVdsNgo79ogWVcPx5H6dj9M_V1dg9KSPjEBe2CNCZumgboeRuoNhczwYWjqFmkzntYcbROiZ6-83f5HtE9c3nADKUF_yEi9jnvQxVgLOUySEc464nwGSRMsRiEsGJO8mVeEbRAH4fxkZoOT6Dhm3N63b9_bGfOlAQAA)
-
-```svelte
-<script>
-	import { SvelteURL } from 'svelte/reactivity';
-
-	const url = new SvelteURL('https://example.com/path');
-</script>
-
-<!-- changes to these... -->
-<input bind:value={url.protocol} />
-<input bind:value={url.hostname} />
-<input bind:value={url.pathname} />
-
-<hr />
-
-<!-- will update `href` and vice versa -->
-<input bind:value={url.href} />
-```
-
-## `svelte/events`
-
-Where possible, event handlers added with [attributes like `onclick`](/docs/event-handlers) use a technique called _event delegation_. It works by creating a single handler for each event type on the root DOM element, rather than creating a handler for each element, resulting in better performance and memory usage.
-
-Delegated event handlers run after other event handlers. In other words, a handler added programmatically with [`addEventListener`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener) will run _before_ a handler added declaratively with `onclick`, regardless of their relative position in the DOM ([demo](/#H4sIAAAAAAAAE41Sy2rDMBD8lUUXJxDiu-sYeugt_YK6h8RaN6LyykgrQzH6965shxJooQc_RhrNzA6aVW8sBlW9zYouA6pKPY-jOij-GjMIE1pGwcFF3-WVOnTejNy01LIZRucZZnD06iIxJOi9G6BYjxVPmZQfiwzaTBkL2ti73R5ODcwLiftIHRtHcLuQtuhlc9tpuSyBbyZAuLloNfhIELBzpO8E-Q_O4tG6j13hIqO_y0BvPOpiv0bhtJ1Y3pLoeNH6ZULiswmMJLZFZ033WRzuAvstdMseOXqCh9SriMfBTfgPnZxg-aYM6_KnS6pFCK6GdJVHPc0C01JyfY0slUnHi-JpfgjwSzUycdgmfOjFEP3RS1qdhJ8dYMDFt1yNmxxU0jRyCwanTW9Qq4p9xPSevgHI3m43QAIAAA==)). It also means that calling `event.stopPropagation()` inside a declarative handler _won't_ prevent the programmatic handler (created inside an action, for example) from running.
-
-To preserve the relative order, use `on` rather than `addEventListener` ([demo](/#H4sIAAAAAAAAE3VRy26DMBD8lZUvECkqdwpI_YB-QdJDgpfGqlkjex2pQv73rnmoStQeMB52dnZmmdVgLAZVn2ZFlxFVrd6mSR0Vf08ZhDtaRsHBRd_nL03ovZm4O9OZzTg5zzCDo3cXiSHB4N0IxdpWvD6RnuoV3pE4rLT8WGTQ5p6xoE20LA_QdjAvJB4i9WxE6nYhbdFLcaucuaqAbyZAuLloNfhIELB3pHeC3IOz-GLdZ1m4yOh3GRiMR10cViucto7l9MjRk9gvxdsRit6a_qs47q1rT8qvpvpdDjXChqshXWdT7SwwLVtrrpElnAguSu38EPCPEOItbF4eEhiifxKkdZLw8wQYcZlbrYO7bFTcdPJbR6fNYFCrmn3E9JF-AJZOg9MRAgAA)):
-
-```js
-// @filename: index.ts
-const element: Element = null as any;
-// ---cut---
-import { on } from 'svelte/events';
-
-const off = on(element, 'click', () => {
-	console.log('element was clicked');
-});
-
-// later, if we need to remove the event listener:
-off();
-```
-
-`on` also accepts an optional fourth argument which matches the options argument for `addEventListener`.
-
-## `svelte/server`
-
-### `render`
-
-Only available on the server and when compiling with the `server` option. Takes a component and returns an object with `body` and `head` properties on it, which you can use to populate the HTML when server-rendering your app:
-
-```js
-// @errors: 2724 2305 2307
-import { render } from 'svelte/server';
-import App from './App.svelte';
-
-const result = render(App, {
-	props: { some: 'property' }
-});
-```
-
-If the `css` compiler option was set to `'injected'`, `<style>` elements will be included in the `head`.
-
-## `svelte/store`
-
-In addition to the existing store-related imports such as `writable`, `svelte/store` gains two new functions: `fromStore` and `toStore`. These allow you to easily use stores and rune-based state interchangeably, even outside `.svelte` files.
-
-### `fromStore`
-
-Takes a store and turns it into an object with a reactive (and readonly, if the store is not [writable](https://svelte.dev/docs/svelte-store#writable)) `current` property.
-
-```js
-import { fromStore, get, writable } from 'svelte/store';
-
-const store = writable(0);
-
-const count = fromStore(store);
-
-count.current; // 0;
-store.set(1);
-count.current; // 1
-
-count.current += 1;
-get(store); // 2
-```
-
-### `toStore`
-
-Creates a store from a function that returns reactive state (and, optionally, a second function that sets the state):
-
-```js
-import { toStore } from 'svelte/store';
-
-let count = $state(0);
-
-const store = toStore(
-	() => count,
-	(v) => (count = v)
-);
-
-store.set(1);
-count; // 1
-```
-
-## `svelte/elements`
-
-Svelte provides built-in [DOM types](https://github.com/sveltejs/svelte/blob/master/packages/svelte/elements.d.ts). A common use case for DOM types is forwarding props to an HTML element. To properly type your props and get full intellisense, your props interface should extend the attributes type for your HTML element:
-
-```svelte
-<script lang="ts">
-	import { HTMLAttributes } from 'svelte/elements';
-
-	interface Props extends HTMLAttributes<HTMLDivElement> {
-		username: string;
-	}
-
-	let { username, ...rest }: Props = $props();
-</script>
-
-<div {...rest}>
-	Hi, {username}!
-</div>
-```
-
-> You can use `ComponentProps<ImportedComponent>`, if you wish to forward props to a Svelte component.
-
-Svelte provides a best-effort of all the HTML DOM types that exist. If an attribute is missing from our [type definitions](https://github.com/sveltejs/svelte/blob/master/packages/svelte/elements.d.ts), you are welcome to open an issue and/or a PR fixing it. For experimental attributes, you can augment the existing types locally by creating a `.d.ts` file:
-
-```ts
-import { HTMLButtonAttributes } from 'svelte/elements';
-
-declare module 'svelte/elements' {
-	export interface SvelteHTMLElements {
-		'custom-button': HTMLButtonAttributes;
-	}
-
-	// allows for more granular control over what element to add the typings to
-	export interface HTMLButtonAttributes {
-		veryexperimentalattribute?: string;
-	}
-}
-
-export {}; // ensure this is not an ambient module, else types will be overridden instead of augmented
-```
-
-The `.d.ts` file must be included in your `tsconfig.json` file. If you are using the standard `"include": ["src/**/*"]`, this just means the file should be placed in the `src` directory.
diff --git a/sites/svelte-5-preview/src/routes/docs/content/01-api/meta.json b/sites/svelte-5-preview/src/routes/docs/content/01-api/meta.json
deleted file mode 100644
index a2a3985282f0..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/01-api/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "API"
-}
diff --git a/sites/svelte-5-preview/src/routes/docs/content/02-examples/01-universal-reactivity.md b/sites/svelte-5-preview/src/routes/docs/content/02-examples/01-universal-reactivity.md
deleted file mode 100644
index eba0dae56358..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/02-examples/01-universal-reactivity.md
+++ /dev/null
@@ -1,150 +0,0 @@
----
-title: Universal reactivity
----
-
-In Svelte 5, you can create reactive state anywhere in your app — not just at the top level of your components.
-
-Suppose we have a component like this:
-
-```svelte
-<script>
-	let count = $state(0);
-
-	function increment() {
-		count += 1;
-	}
-</script>
-
-<button onclick={increment}>
-	clicks: {count}
-</button>
-```
-
-We can encapsulate this logic in a function, so that it can be used in multiple places:
-
-```diff
-<script>
-+	function createCounter() {
-		let count = $state(0);
-
-		function increment() {
-			count += 1;
-		}
-
-+		return {
-+			get count() { return count },
-+			increment
-+		};
-+	}
-+
-+	const counter = createCounter();
-</script>
-
--<button onclick={increment}>
--	clicks: {count}
-+<button onclick={counter.increment}>
-+	clicks: {counter.count}
-</button>
-```
-
-> Note that we're using a [`get` property](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get) in the returned object, so that `counter.count` always refers to the current value rather than the value at the time the `createCounter` function was called.
->
-> As a corollary, `const { count, increment } = createCounter()` won't work. That's because in JavaScript, [destructured declarations](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment) are evaluated at the time of destructuring — in other words, `count` will never update.
-
-We can also extract that function out into a separate `.svelte.js` or `.svelte.ts` module...
-
-```js
-export function createCounter() {
-	let count = $state(0);
-
-	function increment() {
-		count += 1;
-	}
-
-	return {
-		get count() {
-			return count;
-		},
-		increment
-	};
-}
-```
-
-...and import it into our component:
-
-```diff
-<script>
-+	import { createCounter } from './counter.svelte.js';
--	function createCounter() {...}
-
-	const counter = createCounter();
-</script>
-
-<button onclick={counter.increment}>
-	clicks: {counter.count}
-</button>
-```
-
-[See this example in the playground.](/#H4sIAAAAAAAAE2VQ0U7DMAz8FStC2iaqDl67dhLiMxgPI3NRRutUiYNAVf6dJG1TBk-W7bvznUfRqg6tqF5GQeceRSWehkEUgr-H2NhP7BhDb7UzMk5qK40a-HiiE6t-0IZhBGnwzPisHTEa8NAa3cOm3MtpUk4y5dVuDoEXmFKTZZjX0NwKbHcBVe_XQ1S_OWZNoEl2Sn404yKsKDB7JPbJUNraCvI-VR_VJoVjiNLri2oVXkTFxqEvcvJbt-sTrvb3A_ArhW4dSVbB0x_rMEYjHc7pQrY7ywGwfdjN2TMzm19Y8S-Rc9_AYwRH57EYZGdowbwv2istQ9L8MA19MdV8JimGpf__hFf_Ay1mGDQKAgAA)
-
-## Stores equivalent
-
-In Svelte 4, the way you'd do this is by creating a [custom store](https://svelte.dev/tutorial/svelte/custom-stores), perhaps like this:
-
-```js
-import { writable } from 'svelte/store';
-
-export function createCounter() {
-	const { subscribe, update } = writable(0);
-
-	function increment() {
-		update((count) => count + 1);
-	}
-
-	return {
-		subscribe,
-		increment
-	};
-}
-```
-
-Back in the component, we retrieve the store value by prefixing its name with `$`:
-
-```diff
-<script>
-	import { createCounter } from './counter.js';
-
-	const counter = createCounter();
-</script>
-
-<button onclick={counter.increment}>
--	clicks: {counter.count}
-+	clicks: {$counter}
-</button>
-```
-
-The store approach has some significant drawbacks. A counter is just about the simplest custom store we could create, and yet we have to completely change how the code is written — importing `writable`, understanding its API, grabbing references to `subscribe` and `update`, changing the implementation of `increment` from `count += 1` to something far more cryptic, and prefixing the store name with a `$` to retrieve its value. That's a lot of stuff you need to understand.
-
-With runes, we just copy the existing code into a new function.
-
-## Gotchas
-
-Reactivity doesn't magically cross function boundaries. In other words, replacing the `get` property with a regular property wouldn't work...
-
-```diff
-export function createCounter() {
-	let count = $state(0);
-
-	function increment() {
-		count += 1;
-	}
-
-	return {
--		get count() { return count },
-+		count,
-		increment
-	};
-}
-```
-
-...because the value of `count` in the returned object would always be `0`. Using the `$state` rune doesn't change that fact — it simply means that when you _do_ read `count` (whether via a `get` property or a normal function) inside your template or inside an effect, Svelte knows what to update when `count` changes.
diff --git a/sites/svelte-5-preview/src/routes/docs/content/02-examples/02-fine-grained-reactivity.md b/sites/svelte-5-preview/src/routes/docs/content/02-examples/02-fine-grained-reactivity.md
deleted file mode 100644
index 6c804b03ac57..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/02-examples/02-fine-grained-reactivity.md
+++ /dev/null
@@ -1,79 +0,0 @@
----
-title: Fine-grained reactivity
----
-
-In Svelte 4, reactivity centres on the _component_ and the top-level state declared therein. What this means is that in a situation like this...
-
-```svelte
-<script>
-	let todos = [];
-
-	function remaining(todos) {
-		console.log('recalculating');
-		return todos.filter((todo) => !todo.done).length;
-	}
-
-	function addTodo(event) {
-		if (event.key !== 'Enter') return;
-
-		todos = [
-			...todos,
-			{
-				done: false,
-				text: event.target.value
-			}
-		];
-
-		event.target.value = '';
-	}
-</script>
-
-<input onkeydown={addTodo} />
-
-{#each todos as todo}
-	<div>
-		<input bind:value={todo.text} />
-		<input type="checkbox" bind:checked={todo.done} />
-	</div>
-{/each}
-
-<p>{remaining(todos)} remaining</p>
-```
-
-...editing any individual `todo` will invalidate the entire list. You can see this for yourself by [opening the playground](/#H4sIAAAAAAAAE2VSy27jMAz8FVV7cAIE8t21DfSwf7C3OgdVohOhCmXIdLaF4H9fPewE6N7I0ZAzpBj4aCzMvHkPHOUNeMPfpomfOH1PKZnvYAliPrvFq4S0s_Jmon7AgSwQI6fdzDr2fn6NUATHBRUZh8zDTRo0eDlkzpGF9DyQcjg7C8K6y6HyoKRVi5UUidXxtVA80OKx9BbRIYHPTVjXs5cUCO0QjsICXuiai9Yf6lLrP5F4gDsgPbTNyAoiPuGbvXQdq35j7F4dWdHchhjoMVdJBxJCZOy0A2EPBkpuGjZKO8PpiRJ8UcOKHEl_ARJ3aRfYGWsJzg_N_6nRQFXt87X1c_fYGpwWYg7jINr9xS5sE6-szoTwC6S6bv8j5xxkxVabe18EtyYfBnWT9bqQt5ucb32erHQS3cDVFdTnh_saeKnLOeitMm1ir2zrohTq5CR_UDv14eddrM9Laeupj8d2c9qMBjRvyC-wntd_ggUqOqcCAAA=), adding some todos, and watching the console in the bottom right. `remaining(todos)` is recalculated every time we edit the `text` of a todo, even though it can't possibly affect the result.
-
-Worse, everything inside the `each` block needs to be checked for updates. When a list gets large enough, this behaviour has the potential to cause performance headaches.
-
-With runes, it's easy to make reactivity _fine-grained_, meaning that things will only update when they need to:
-
-```diff
-<script>
--	let todos = [];
-+	let todos = $state([]);
-
-	function remaining(todos) {
-		console.log('recalculating');
-		return todos.filter(todo => !todo.done).length;
-	}
-
-	function addTodo(event) {
-		if (event.key !== 'Enter') return;
-
--		todos = [
--			...todos,
--			{
--				done: false,
--				text: event.target.value
--			}
--		];
-+		todos.push({
-+			done: false,
-+			text: event.target.value
-+		});
-
-		event.target.value = '';
-	}
-</script>
-```
-
-In [this version of the app](/#H4sIAAAAAAAAE2VSy07EMAz8lRCQ2kqovZe2Egf-gBvlEBJ3N9qsUyXuAqr67-TRZSW4xfZ4Zmxn5ZM24Hn7tnIUZ-Atf55n_sjpe46Bv4AhCLG3i5Mx03np9EzDiCMZIEZWWc969uBJEJRv79VTKIXitKAkbZE5OAuNGg9lwlZsjeWRpEVvDdTGHsrCgRRGLkZQABaJI0Ac0OIwa9TBKYFLJKwf2F181MoiVLUBPNAxNW1_1IVSrwFYwgWQfrX1xHKmPsE3u-t7VrxgYC8qljX3IUbK2vPij-XeO1IUbdkkjIfHa47gi1qWOUm4A1B9EWaBXN-qX8L_kLC9oria75rbgrHTOC_ELAaXyn5iv-7jbKxJgPUehDzuRxA-PeIGqFP6MmTBneRDo2qTXr-m1UXHO88NFe_ej1weQZ4-7NfIc1-KQe2dcf5rZ9dkpbWJTtL2u3lY_x59u32DrpmH8KPOVulJg-ItuQW29-0HkdosMowCAAA=), editing the `text` of a todo won't cause unrelated things to be updated.
diff --git a/sites/svelte-5-preview/src/routes/docs/content/02-examples/04-old-vs-new.md b/sites/svelte-5-preview/src/routes/docs/content/02-examples/04-old-vs-new.md
deleted file mode 100644
index cc95438e8c6b..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/02-examples/04-old-vs-new.md
+++ /dev/null
@@ -1,297 +0,0 @@
----
-title: Old vs new
----
-
-This page intends to give a broad overview of how code written using the new APIs looks compared to code not using them. You will see that for most simple tasks that only involve a single component it will actually not look much different. For more complex logic, they simplify things.
-
-## Counter
-
-The `$state`, `$derived` and `$effect` runes replace magic `let` declarations, `$: x = ...` and `$: { ... }`. Event handlers can be written as event attributes now, which in practise means just removing the colon.
-
-- [Before](/#H4sIAAAAAAAAE0VP0Q6CMAz8lbqYAGqC-jiBxH_wTXzQUWRxbgQ6E7Ps34VN40vbu8u1V8daqXBk_OyYvj6RcXbse7Zh9O5nML5QEU54NHYQM1OMYpA9VbWuSSGBMFYTlLA9zMySQ2PsTeHERGUF-6B8VRdmki2kUa9gt81-dE1XhQOlyckY6OS9WyRZdJOf21SK_B9AFzdLZDQYzYWS4lG6NIOyiqfXax9SuoA85OBitrAlOqvptadpZCuxYZwGi_7iP__ps0sVAQAA)
-- [After](/#H4sIAAAAAAAACkVP0WrDMAz8FU0U6qyBdnvMksD-YW_LHlJbXs1cOzhyYRj_-3Dcsgch7nQ6nRJqY2nF7jOhm6-EHb4vC7bIv0sB640sE7a4-hhkYfpVBrPwOLmJLTFIHx3DALuVZyZxat4eE-Xj2VIZKQrmRkpU7TO8VlGpHWlNkoVoYBghbTQbDXftCC-n5kFPPFsKLPYf3sPFfF-e9ncjzqXlgvrjf0DXnyOzd-CdtEb-DKme2bwPh7w9kTaU4QipJs7FpC6O2OLVK6MNKew4RMpf-Q9GD6iFNAEAAA==)
-
-```diff
-<script>
--	let count = 0;
--	$: double = count * 2;
-
--	$: {
-+	let count = $state(0);
-+	let double = $derived(count * 2);
-+	$effect(() => {
-		if (count > 10) {
-			alert('Too high!');
-		}
--	}
-+	});
-</script>
-
--<button on:click={() => count++}>
-+<button onclick={() => count++}>
-	{count} / {double}
-</button>
-```
-
-## Tracking dependencies
-
-In non-runes mode, dependencies of `$:` statements are tracked at _compile time_. `a` and `b` changing will only cause `sum` to be recalculated because the expression — `add(a, b)` — refers to those values.
-
-In runes mode, dependencies are tracked at _run time_. `sum` will be recalculated whenever `a` or `b` change, whether they are passed in to the `add` function or accessed via closure. This results in more maintainable, refactorable code.
-
-- [Before](/#H4sIAAAAAAAAE3WPwarDIBBFf2WQLlpSSNfWCP2Opgs1BuQlRnQsFPHfO0lpSxdvMcK5c4YZCxvdZBPj18K8mi3j7BICOzJ8hBXS3U5oidOSo1kTkUx0AWXve5wsgoIOTuc36Q_tOKQ8E6ph2Ksj6MMWrzVmb9At_tuCsvUwWsyRcmhAb3rtvWi_G73QGZEmF8_N5MxfV_YH6CSopqmSHtG-BPm_qldV_6pBFlVpadGVLi50eBVtkPTveRnc6OzAOMZs660-AQKQKZYyAQAA)
-- [After](/#H4sIAAAAAAAAE3WQ3WrDMAyFX8WYXqSkkF5njqHPsfTCPwqYJo6x5cIwfvfKKWMMthuBvnMkHVT44lZIfPws3KsN-MhvIfALx6_QmvSEFYH6tOdoGhHJRBdQzn7GFZApNrFTQoXQXc8f31T_SVPeGrcQ3RNsp6ztzodK-pK9Qbd7dlBWGpsxAuZIjPVMH2vq7MXwE8ELnRFpavejWZ15TIWGJ8lU31dJRQxvg_zfqptV_7YGWVSlo0VXSlwoeBVDkPSIbbducWD5iDFDvdcXqDJidUMBAAA=)
-
-```diff
-<script>
--	let a = 0;
--	let b = 0;
--	$: sum = add(a, b);
-+	let a = $state(0);
-+	let b = $state(0);
-+	let sum = $derived(add());
-
--	function add(a, b) {
-+	function add() {
-		return a + b;
-	}
-</script>
-
--<button on:click={() => a++}>a++</button>
--<button on:click={() => b++}>b++</button>
-+<button onclick={() => a++}>a++</button>
-+<button onclick={() => b++}>b++</button>
-<p>{a} + {b} = {sum}</p>
-```
-
-## Untracking dependencies
-
-Conversely, suppose you — for some reason — wanted to recalculate `sum` when `a` changes, but _not_ when `b` changes.
-
-In non-runes mode, we 'hide' the dependency from the compiler by excluding it from the `$:` statement. In runes mode, we have a better and more explicit solution: [`untrack`](/docs/functions#untrack).
-
-- [Before](/#H4sIAAAAAAAAE3WPwYrDIBCGX2WQHhJSyJ6tEfocmz2oMSBNjOi4sIjvvpO0u6WHHhz4_vmGGQub3WIT45-FebVaxtk1BHZm-BN2SN92QUucthzNnohkogsoRz_iYhEUDPBx-SP9TycOKa-Eapoa1R7Z_ubsDbrNP3IoRwOjxRwphA704dbRi_65ywudEWls89wsztyG0rQwSFBdVyUV0d8F-V7Vu6pf1SCLqrS06Eq3Fjq5ij5I-vG6TW52dmIcY7b1q_4CeJwNvCwBAAA=)
-- [After](/#H4sIAAAAAAAACnXOwWrFIBAF0F8Zhi4SDOStUyP0O1660DgBaWJExwdF_PeHKaUU2uWce7lMwc3tlHC6F_T6IJzwLQQckD9DO9KDdiYcMJ05rk1kWqMLrBa_8E4MGmZ4SayZulv_-q3mT035aG4pugfZTlvb9VfqF96yX9mdHi6F0mzhSJyjBw0CzDVTFy_Hnxe8NJn59HD6dXfrx1y6HmYFWoiqtBBy_MrVv03TmuZ3M6iiKwgopsIMJeWjyjEoHPA4rdscWZw4Zqrv9Qm1yJsGQQEAAA==)
-
-```diff
-<script>
-+	import { untrack } from 'svelte';
-
--	let a = 0;
--	let b = 0;
--	$: sum = add(a);
-+	let a = $state(0);
-+	let b = $state(0);
-+	let sum = $derived(add());
-
--	function add(a) {
--		return a + b;
-+	function add() {
-+		return a + untrack(() => b);
-	}
-</script>
-
--<button on:click={() => a++}>a++</button>
--<button on:click={() => b++}>b++</button>
-+<button onclick={() => a++}>a++</button>
-+<button onclick={() => b++}>b++</button>
-<p>{a} + {b} = {sum}</p>
-```
-
-## Simple component props
-
-```diff
-<script>
--	export let count = 0;
-+	let { count = 0 } = $props();
-</script>
-
-{count}
-```
-
-## Advanced component props
-
-```diff
-<script>
--	let classname = '';
--	export { classname as class };
-+	let { class: classname, ...others } = $props();
-</script>
-
-<pre class={classname}>
--	{JSON.stringify($$restProps)}
-+	{JSON.stringify(others)}
-</pre>
-```
-
-## Autoscroll
-
-To implement a chat window that autoscrolls to the bottom when new messages appear (but only if you were _already_ scrolled to the bottom), we need to measure the DOM before we update it.
-
-In Svelte 4, we do this with `beforeUpdate`, but this is a flawed approach — it fires before _every_ update, whether it's relevant or not. In the example below, we need to introduce checks like `updatingMessages` to make sure we don't mess with the scroll position when someone toggles dark mode.
-
-With runes, we can use `$effect.pre`, which behaves the same as `$effect` but runs before the DOM is updated. As long as we explicitly reference `messages` inside the effect body, it will run whenever `messages` changes, but _not_ when `theme` changes.
-
-`beforeUpdate`, and its equally troublesome counterpart `afterUpdate`, will be deprecated in Svelte 5.
-
-- [Before](/#H4sIAAAAAAAAE31WXa_bNgz9K6yL1QmWOLlrC-w6H8MeBgwY9tY9NfdBtmlbiywZkpyPBfnvo2zLcZK28AWuRPGI5OGhkEuQc4EmiL9eAskqDOLg97oOZoE9125jDigs0t6oRqfOsjap5rXd7uTO8qpW2sIFEsyVxn_qjFmcAcstar-xPN3DFXKtKgi768IVgQku0ELj3Lgs_kZjWIEGNpAzYXDlHWyJFZI1zJjeh4O5uvl_DY8oUkVeVoFuJKYls-_CGYS25Aboj0EtWNqel0wWoBoLTGZgmdgDS9zW4Uz4NsrswPHoyutN4xInkylstnBxdmIhh8m7xzqmoNE2Wq46n1RJQzEbq4g-JQSl7e-HDx-GdaTy3KD9E3lRWvj5Zu9QX1QN20dj7zyHz8s-1S6lW7Cpz3RnXTcm04hIlfdFuO8p2mQ5-3a06cqjrn559bF_2NHOnRZ5I1PLlXQNyQT-hedMHeUEDyjtdMxsa4n2eIbNhlTwhyRthaOKOmYtniwF6pwt0wXa6MBEg0OibZec27gz_dk3UrZ6hB2LLYoiv521Yd8Gt-foTrfhiCDP0lC9VUUhcDLU49Xe_9943cNvEArHfAjxeBTovvXiNpFynfEDpIIZs9kFbg52QbeNHWZzebz32s7xHco3nJAJl1nshmhz8dYOQJDyZetnbb2gTWe-vEeWlrfpZMavr56ldb29eNt6UXvgwgFbp_WC0tl2RK25rGk6lYz3nUI2lzvBXGHhPZPGWmKUXFNBKqdaW259wl_aHbiqoVIZdpE60Nax6IOujT0LbFFxIVTCxCRR2XloUcYNvSbnGHKBp763jHoj59xiZWJI0Wm0P_m3MSS985xkasn-cFq20xTDy3J5KFcjgUTD69BHdcHIjz431z28IqlxGcPSfdFnrGDZn6gD6lyo45zyHAD-btczf-98nhQxHEvKfeUtOVkSejD3q-9X7JbzjGtsdUxlKdFU8qGsT78uaw848syWMXz85Waq2Gnem4mAn3prweq4q6Y3JEpnqMmnPoFRgmd3ySW0LLRqSKlwYHriCvJvUs2yjMaaoA-XzTXLeGMe45zmhv_XAno3Mj0xF7USuqNvnE9H343QHlq-eAgxpbTPNR9yzUkgLjwSR0NK4wKoxy-jDg-9vy8sUSToakzW-9fX13Em9Q8T6Z26uZhBN36XUYo5q7ggLXBZoub2Ofv7g6GCZfTxe034NCjiudXj7Omla0eTfo7QBPOcYxbE7qG-vl3_B1G-_i_JCAAA)
-- [After](/#H4sIAAAAAAAAE31WXa-jNhD9K7PsdknUQJLurtRLPqo-VKrU1327uQ8GBnBjbGSb5KZR_nvHgMlXtyIS9njO-MyZGZRzUHCBJkhez4FkNQZJ8HvTBLPAnhq3MQcUFmlvVKszZ1mbTPPGbndyZ3ndKG3hDJZne7hAoVUNYY8JV-RBPgIt2AprhA18MpZZnIQ50_twuvLHNRrDSjRXj9fwiCJTBLIKdCsxq5j9EM4gtBU3QD8GjWBZd14xWYJqLTCZg2ViDyx1W4cz4dv0hsiB49FRHkyfsCgws3GjcTKZwmYLZ2feWc9o1W8zJQ2Fb62i5JUQRNRHgs-fx3WsisKg_RN5WVn4-WrvUd9VA9tH4-AcwbfFQIpkLWByvWzqSe2sk3kyjUlOec_XPU-3TRaz_75tuvKoi19e3OvipSpamVmupJM2F_gXnnJ1lBM8oLQjHceys8R7PMFms4HwD2lRhzeEe-EsvluSrHe2TJdo4wMTLY48XKwPzm0KGm2r5ajFtRYU4TWOY7-ddWHfxhDP0QkQhnf5PWRnVVkKnIx8fZsOb5dR16nwG4TCCRdCMphWQ7z1_DoOcp3zA2SCGbPZBa5jd0G_TRxmc36Me-mG6A7l60XIlMs8ce2-OXtrDyBItdz6qVjPadObzx-RZdV1nJjx64tXad1sz962njceOHfAzmk9JzrbXqg1lw3NkZL7vgE257t-uMDcO6attSSokpmgFqVMO2U93e_dDlzOUKsc-3t6zNZp6K9cG3sS2KGSUqiUiUmq8tNYoJwbmvpTAoXA96GyjCojI26xNglk6DpwOPm7NdRYp4ia0JL94bTqRiGB5WJxqFY37RGPoz3c6i4jP3rcUA7wmhqNywQW7om_YQ2L4UQdUBdCHSPiOQJ8bFcxHzeK0jKBY0XcV95SkCWlD9t-9eOM3TLKucauiyktJdpaPqT19ddF4wFHntsqgS-_XE01e48GMwnw02AtWZP02QyGVOkcNfk072CU4PkduZSWpVYt9SkcmJ64hPwHpWF5ziVls3wIFmmW89Y83vMeGf5PBxjcyPSkXNy10J18t3x6-a6CDtBq6SGklNKeazFyLahB3PVIGo2UbhOgGi9vKjzW_j6xVFFD17difXx5ebll0vwvkcGpn4sZ9MN3vqFYsJoL6gUuK9TcPrO_PxgzWMRfflSEr2NHPJf6lj1957rRpH8CNMG84JgHidUtXt4u_wK21LXERAgAAA==)
-
-```diff
-<script>
--	import { beforeUpdate, afterUpdate, tick } from 'svelte';
-+	import { tick } from 'svelte';
-
--	let updatingMessages = false;
--	let theme = 'dark';
--	let messages = [];
-+	let theme = $state('dark');
-+	let messages = $state([]);
-
-	let viewport;
-
--	beforeUpdate(() => {
-+	$effect.pre(() => {
--		if (!updatingMessages) return;
-+		messages;
-		const autoscroll = viewport && viewport.offsetHeight + viewport.scrollTop > viewport.scrollHeight - 50;
-
-		if (autoscroll) {
-			tick().then(() => {
-				viewport.scrollTo(0, viewport.scrollHeight);
-			});
-		}
-
--		updatingMessages = false;
-	});
-
-	function handleKeydown(event) {
-		if (event.key === 'Enter') {
-			const text = event.target.value;
-			if (!text) return;
-
--			updatingMessages = true;
-			messages = [...messages, text];
-			event.target.value = '';
-		}
-	}
-
-	function toggle() {
-		toggleValue = !toggleValue;
-	}
-</script>
-
-<div class:dark={theme === 'dark'}>
-	<div bind:this={viewport}>
-		{#each messages as message}
-			<p>{message}</p>
-		{/each}
-	</div>
-
--	<input on:keydown={handleKeydown} />
-+	<input onkeydown={handleKeydown} />
-
--	<button on:click={toggle}>
-+	<button onclick={toggle}>
-		Toggle dark mode
-	</button>
-</div>
-```
-
-## Forwarding events
-
-Because [event handlers](event-handlers) are just regular attributes now, the "forwarding events" concept is replaced with just passing callback props. Before, you would have to mark every event that you want to forward separately. You can still do this with event attributes...
-
-```diff
-<script>
-+	let { onclick, onkeydown, ...attributes } = $props();
-</script>
-
-<button
--	{...$$props}
-+	{...attributes}
--	on:click
--	on:keydown
-+	{onclick}
-+	{onkeydown}
->a button</button>
-```
-
-...but in practise what you probably _really_ want to do in these situations is forward _all_ events. This wasn't possible before, but it is now:
-
-```diff
-<script>
-+	let { ...props } = $props();
-</script>
-
-<button
--	{...$$props}
--	on:click
--	on:keydown
-+	{...props}
->a button</button>
-```
-
-- [Before](https://svelte-5-preview.vercel.app/#H4sIAAAAAAAACn1Py2rDMBD8lWUJOIEg3xXb0P5G1YMjr4morBXSuhCM_z1xlLaXktMys8xrwdF5yqg_Fgz9RKjxLUY8olzjBvI3eaE7zjwnuzFNtslF6Uww4qbISeB9FuEAY-IJKlUXqIq0OpnQ1H-a0JT3Js9y9dQatOw5aUg0GNx4Dtp6Z7_aZX-AtoPeU5J99eBoALkQnB8m1WE1oe7u9SYe3OhoQC1ppvX4u6akvRxUvGBRSu12MXHMK_xU6PpnVFOX-0_Y53oDgvtVGEYBAAA=)
-- [After](https://svelte-5-preview.vercel.app/#H4sIAAAAAAAACo1PQWrEMAz8ihCFJLA492wSaL9R95A6CjV1bGMrhcX4793Eu9tDe-hJmpFGmkm4aEMRu9eEdloJO3z2Hk_IF7-D-EWG6Yqj24LamT6qoD2P0krWq3eB4WVjdhaW4FaoRFugKNLqLG3f_mhsX8a7PPLF0CBROeNCB4FmiTvvrDJafQ6pbmAYYTIUuK4OjmbgD4L340bVZGnb8epudbNeNM3Ycdgonx5hyrP_5jHEkEAI4YPzETIM8HS0dfMrRrEA6b6dx-lmq29L_cPYW_4GVdmFa3EBAAA=)
-
-## Passing UI content to a component
-
-Previously, you would pass UI content into components using slots. Svelte 5 provides a better mechanism for this, [snippets](snippets). In the simple case of passing something to the default slot, nothing has changed for the consumer:
-
-```svelte
-<!-- same with both slots and snippets -->
-<script>
-	import Button from './Button.svelte';
-</script>
-
-<Button>click me</Button>
-```
-
-Inside `Button.svelte`, use `@render` instead of the `<slot>` tag. The default content is passed as the `children` prop:
-
-```diff
-<script>
-+	let { children } = $props();
-</script>
-
-<button>
--	<slot />
-+	{@render children()}
-</button>
-```
-
-When passing props back up to the consumer, snippets make things easier to reason about, removing the need to deal with the confusing semantics of the `let:`-directive:
-
-```diff
-<!-- provider -->
-<script>
-+	let { children } = $props();
-</script>
-
-<button>
--	<slot prop="some value" />
-+	{@render children("some value")}
-</button>
-```
-
-```diff
-<!-- consumer -->
-<script>
-	import Button from './Button.svelte';
-</script>
-
-- <Button let:prop>click {prop}</Button>
-+ <Button>
-+ 	{#snippet children(prop)}
-+ 		click {prop}
-+ 	{/snippet}
-+ </Button>
-```
-
-Combined with event attributes, this reduces the number of concepts to learn — everything related to the component boundary can now be expressed through props.
-
-- [Before](https://svelte-5-preview.vercel.app/#H4sIAAAAAAAACn2PzYrCQBCEX6XpSxTE3GeTgPoYzh5i0sHB-WOmIywh776ZjCgieOsqqvrrnnBQmiKK84S2NYQCD97jDvnPJxHvpJkWHd0YuuRUsQvKcyOtZGW8CwzHkdlZGIIzUOzLLPe5WvxIW5Wvjq0eaWdFp1V3q6fNFuoGWk2BN8UpedQDXwkua7LYzqCJhQ_Or1TJaxGm5MxpfV7ZLGca16tBUY-Cw0jz7vlVjnx97PJ-2MqqonYMCVTLJWoI7q0eSSKUTSLnzjJ-sn_nfxmfF-FdAQAA)
-- [After](https://svelte-5-preview.vercel.app/#H4sIAAAAAAAACo2PzW6DMBCEX2XlVgIkBHcKUdo-RumBwqJYNbZlL5Eqy-9e_9DkkEtv3vHMzn6OrVygZd2HY3LakHXsVWtWM_rRcbBXFIRhtmo3c1R6Oxuu6TTKkfimlSF424mUhNWoDYqmzWOTo8XLKPv2npH94VZyFnz-HlxZwXCCSaChsniPGi5AF4SvZCwqn7rck5VcaySYL1wsBmWpjdKVj58jpWXgopQU1x52H_tz5ylwbGrhK8eFdWR29PUNO1v-Sy7CHe52SQ1N08RqCx4GeE7PsnpAz0Tg_twH2TmsWNDcwcZQuiFcJ7HjyKqEkLMh8Ajx6X8BPkQdmscBAAA=)
-
-> When using custom elements, you should still use `<slot />` like before. In a future version, when Svelte removes its internal version of slots, it will leave those slots as-is, i.e. output a regular DOM tag instead of transforming it.
diff --git a/sites/svelte-5-preview/src/routes/docs/content/02-examples/06-more-examples.md b/sites/svelte-5-preview/src/routes/docs/content/02-examples/06-more-examples.md
deleted file mode 100644
index bef255306348..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/02-examples/06-more-examples.md
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: More examples
----
-
-Check out [component-party.dev](https://component-party.dev/?f=svelte4,svelte5) to see side-by-side comparisons of some common patterns.
-
-We'll add more examples over time, but if there's something in particular you'd like to see then hop over to the `#svelte-5-rc` channel of the [Svelte Discord](https://svelte.dev/chat).
diff --git a/sites/svelte-5-preview/src/routes/docs/content/02-examples/meta.json b/sites/svelte-5-preview/src/routes/docs/content/02-examples/meta.json
deleted file mode 100644
index 991810447185..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/02-examples/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Examples"
-}
diff --git a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/01-faq.md b/sites/svelte-5-preview/src/routes/docs/content/03-appendix/01-faq.md
deleted file mode 100644
index 1cc48b20a756..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/01-faq.md
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Frequently asked questions
----
-
-## Background and motivations
-
-### What is this?
-
-You're on the Svelte 5 preview site! If you don't know what Svelte is but somehow ended up here
-anyway, we suggest visiting [svelte.dev](https://svelte.dev) first to get familiar.
-
-### What's special about Svelte 5?
-
-Svelte 5 is a ground-up rewrite of the framework, designed to make your apps faster, smaller, and more robust.
-
-It introduces <em>runes</em>, a powerful set of primitives for controlling reactivity inside your Svelte components and — for the first time — inside `.svelte.js` and `.svelte.ts` modules. You can learn about runes by reading the [Introducing runes](https://svelte.dev/blog/runes) blog post and watching the accompanying video, and by reading the preliminary [docs](/docs) on this site.
-
-### Doesn't this make Svelte harder to learn?
-
-Au contraire! Svelte today involves certain mental gymnastics:
-
-- `let x` declares reactive state, but only at the top level of a component
-- `export let x` declares a prop, but only inside a component. `export const y = ...`, meanwhile, means something totally different
-- In addition to `export let`, you have to learn `$$props` and `$$restProps`
-- `$:` might be declaring a reactive binding, or running side-effects; like `let x`, it only works at the top level of a component. When these statements re-run is dependent on rules that are hard to understand
-- In general, code behaves differently inside and outside components, making refactoring difficult and requiring frequent context-switching
-
-Runes, by contrast, are explicit, predictable and refactorable.
-
-### Why can't we keep the old syntax?
-
-Beyond the complexities listed above, the current design imposes some unfortunate limitations:
-
-- There's no way to indicate which variables should _not_ be considered reactive. This becomes problematic when applying Svelte rules outside the top level of a component (for example in `.js` files)
-- The `$:` syntax doesn't play well with TypeScript. For example, you can't declare the type of `theme` in a statement like this — it's a syntax error:
-  ```ts
-  // @errors: 2362 2363 2304 1005
-  // @filename: ambient.d.ts
-  declare global {
-  const dark: boolean;
-  }
-  export {};
-  // @filename: index.ts
-  // ---cut---
-  $: theme: 'light' | 'dark' = dark ? 'dark' : 'light';
-  ```
-  But with runes, it works just fine:
-  ```ts
-  // @filename: ambient.d.ts
-  declare global {
-  	const dark: boolean;
-  }
-  export {};
-  // @filename: index.ts
-  // ---cut---
-  let theme: 'light' | 'dark' = $derived(
-  	dark ? 'dark' : 'light'
-  );
-  ```
-- Updating values inside `$:` statements can cause [confusing behaviour](https://github.com/sveltejs/svelte/issues/6732) and [impossible to resolve bugs](https://github.com/sveltejs/svelte/issues/4933) and the statements may run in an [unexpected order](https://github.com/sveltejs/svelte/issues/4516)
-- `$: {...}` doesn't let you return a cleanup function the way that [`$effect`](runes#$effect) does
-- Typing props is unduly cumbersome when you want to share interfaces between multiple components
-- Prefixing store names with `$` to access their values works in a `.svelte` file, but cannot work in `.js` and `.ts` without causing linting and typechecking errors. Having a unified approach to reactive state solves this problem
-
-## Breaking changes and migration
-
-### Is it a breaking change?
-
-We're striving to make Svelte 5 a drop-in replacement for Svelte 4, and to that end we've ported over the entire test suite. The new features are opt-in, and you can mix-and-match the new stuff with the old stuff within an app (though not within a component — in 'runes mode', certain features are deliberately disabled).
-
-Having said that, the underlying mechanisms are totally different. It's inevitable that some of you will hit edge cases, which is why this is a major version (5.0) rather than a minor (4.x).
-
-### No but really, am I going to have to rewrite everything?
-
-Eventually, you'll have to make some changes — most of which we hope to automate. We don't want to end up in a situation where people feel like they have to juggle knowledge of a bunch of different ways of doing things.
-
-Our current plan is that some or all of the features that runes make unnecessary like `let`-style reactivity, `$:`, `$$props` and `$$restProps` will be deprecated in Svelte 6 and removed in Svelte 7. But don't worry — that won't happen for some time, and we'll provide automatic migration tooling to do as much of the change as possible. There are no plans to deprecate `onMount` or stores at the current time.
-
-### Which things are disabled in runes mode?
-
-When you opt into runes mode, you can no longer use the features that runes replace:
-
-- `$state` replaces top-level `let` declarations implicitly creating reactive state
-- `$derived` replaces `$: x = ...`
-- `$effect` replaces `$: {'{ ... }'}`
-- `$props` replaces `export let`, `$$props` and `$$restProps`
-
-All other features, including stores, are still fully supported in runes mode.
-
-### Which things will be deprecated in Svelte 5?
-
-`beforeUpdate` and `afterUpdate` are deprecated — use `$effect.pre` and `$effect` instead, as these are more conservative about when they run code. Everything else will remain.
-
-### Prettier formatting is broken, what gives?
-
-`svelte-lsp` ships with a stable version of Svelte to support the largest number of people out of the box. To make the language server compatible with Svelte 5 you will need to install the latest versions of `prettier` and `prettier-plugin-svelte` in your project and create (or update) a `.prettierrc` file:
-
-```sh
-npm i --save-dev prettier-plugin-svelte prettier
-```
-
-```json
-/// file: .prettierrc
-{
-	"plugins": ["prettier-plugin-svelte"],
-	"overrides": [
-		{
-			"files": "*.svelte",
-			"options": { "parser": "svelte" }
-		}
-	]
-}
-```
-
-## Schedule and future plans
-
-### When is it coming out?
-
-When it's done. The goal is sometime in 2024.
-
-### Should I prepare my code for Svelte 5?
-
-No. You can do the migration towards runes incrementally when Svelte 5 comes out.
-
-### When can I `npm install` the Svelte 5 preview?
-
-Right now!
-
-```bash
-npm install svelte@next
-```
-
-You can also opt into Svelte 5 when creating a new SvelteKit project:
-
-```bash
-npx sv create
-```
-
-### What's left to do?
-
-A great many things. Transitions, for example, are not fully implemented. We also haven't fully solved all aspects of things like server-side rendering. We're getting there!
-
-### Will feature X be part of 5.0?
-
-If you have to ask, then probably not. Aside from runes, 5.0 is mostly about taking everything we've learned over the last few years (including from other frameworks — thanks friends!) and making Svelte the leanest and most powerful framework out there.
-
-We know that some of you are very keen on certain feature ideas, and we are too. We have some big ideas for 5.1 and beyond.
-
-## Discussion, contributing, and help
-
-### I want to help. How do I contribute?
-
-We appreciate your enthusiasm! We welcome issues on the [sveltejs/svelte](https://github.com/sveltejs/svelte) repo. Pull requests are a little dicier right now since many things are in flux, so we recommended starting with an issue.
-
-### How can I share feedback or cool examples of what this enables?
-
-You can use the `#svelte-5-rc` channel on the [Discord server](https://svelte.dev/chat) or the tag `#svelte-5` on social media.
-
-### My question wasn't answered. What gives?
-
-It must not have been asked frequently enough. To fix that, stop by the `#svelte-5-rc` channel of the [Discord server](https://svelte.dev/chat).
diff --git a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md b/sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md
deleted file mode 100644
index f45b2e041692..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md
+++ /dev/null
@@ -1,436 +0,0 @@
----
-title: Breaking changes
----
-
-While Svelte 5 is a complete rewrite, we have done our best to ensure that most codebases can upgrade with a minimum of hassle. That said, there are a few small breaking changes which may require action on your part. They are listed here.
-
-## Components are no longer classes
-
-In Svelte 3 and 4, components are classes. In Svelte 5 they are functions and should be instantiated differently. If you need to manually instantiate components, you should use `mount` or `hydrate` (imported from `svelte`) instead. If you see this error using SvelteKit, try updating to the latest version of SvelteKit first, which adds support for Svelte 5. If you're using Svelte without SvelteKit, you'll likely have a `main.js` file (or similar) which you need to adjust:
-
-```diff
-+ import { mount } from 'svelte';
-import App from './App.svelte'
-
-- const app = new App({ target: document.getElementById("app") });
-+ const app = mount(App, { target: document.getElementById("app") });
-
-export default app;
-```
-
-`mount` and `hydrate` have the exact same API. The difference is that `hydrate` will pick up the Svelte's server-rendered HTML inside its target and hydrate it. Both return an object with the exports of the component and potentially property accessors (if compiled with `accessors: true`). They do not come with the `$on`, `$set` and `$destroy` methods you may know from the class component API. These are its replacements:
-
-For `$on`, instead of listening to events, pass them via the `events` property on the options argument.
-
-```diff
-+ import { mount } from 'svelte';
-import App from './App.svelte'
-
-- const app = new App({ target: document.getElementById("app") });
-- app.$on('event', callback);
-+ const app = mount(App, { target: document.getElementById("app"), events: { event: callback } });
-```
-
-> Note that using `events` is discouraged — instead, [use callbacks](https://svelte-5-preview.vercel.app/docs/event-handlers)
-
-For `$set`, use `$state` instead to create a reactive property object and manipulate it. If you're doing this inside a `.js` or `.ts` file, adjust the ending to include `.svelte`, i.e. `.svelte.js` or `.svelte.ts`.
-
-```diff
-+ import { mount } from 'svelte';
-import App from './App.svelte'
-
-- const app = new App({ target: document.getElementById("app"), props: { foo: 'bar' } });
-- app.$set('event', { foo: 'baz' });
-+ const props = $state({ foo: 'bar' });
-+ const app = mount(App, { target: document.getElementById("app"), props });
-+ props.foo = 'baz';
-```
-
-For `$destroy`, use `unmount` instead.
-
-```diff
-+ import { mount, unmount } from 'svelte';
-import App from './App.svelte'
-
-- const app = new App({ target: document.getElementById("app"), props: { foo: 'bar' } });
-- app.$destroy();
-+ const app = mount(App, { target: document.getElementById("app") });
-+ unmount(app);
-```
-
-As a stop-gap-solution, you can also use `createClassComponent` or `asClassComponent` (imported from `svelte/legacy`) instead to keep the same API known from Svelte 4 after instantiating.
-
-```diff
-+ import { createClassComponent } from 'svelte/legacy';
-import App from './App.svelte'
-
-- const app = new App({ target: document.getElementById("app") });
-+ const app = createClassComponent({ component: App, target: document.getElementById("app") });
-
-export default app;
-```
-
-If this component is not under your control, you can use the `compatibility.componentApi` compiler option for auto-applied backwards compatibility, which means code using `new Component(...)` keeps working without adjustments (note that this adds a bit of overhead to each component). This will also add `$set` and `$on` methods for all component instances you get through `bind:this`.
-
-```js
-/// svelte.config.js
-export default {
-	compilerOptions: {
-		compatibility: {
-			componentApi: 4
-		}
-	}
-};
-```
-
-Note that `mount` and `hydrate` are _not_ synchronous, so things like `onMount` won't have been called by the time the function returns and the pending block of promises will not have been rendered yet (because `#await` waits a microtask to wait for a potentially immediately-resolved promise). If you need that guarantee, call `flushSync` (import from `'svelte'`) after calling `mount/hydrate`.
-
-### Server API changes
-
-Similarly, components no longer have a `render` method when compiled for server side rendering. Instead, pass the function to `render` from `svelte/server`:
-
-```diff
-+ import { render } from 'svelte/server';
-import App from './App.svelte';
-
-- const { html, head } = App.render({ message: 'hello' });
-+ const { html, head } = render(App, { props: { message: 'hello' } });
-```
-
-In Svelte 4, rendering a component to a string also returned the CSS of all components. In Svelte 5, this is no longer the case by default because most of the time you're using a tooling chain that takes care of it in other ways (like SvelteKit). If you need CSS to be returned from `render`, you can set the `css` compiler option to `'injected'` and it will add `<style>` elements to the `head`.
-
-### Component typing changes
-
-The change from classes towards functions is also reflected in the typings: `SvelteComponent`, the base class from Svelte 4, is deprecated in favour of the new `Component` type which defines the function shape of a Svelte component. To manually define a component shape in a `d.ts` file:
-
-```ts
-import type { Component } from 'svelte';
-export declare const MyComponent: Component<{
-	foo: string;
-}>;
-```
-
-To declare that a component of a certain type is required:
-
-```svelte
-<script lang="ts">
-	import type { Component } from 'svelte';
-	import {
-		ComponentA,
-		ComponentB
-	} from 'component-library';
-
-	let component: Component<{ foo: string }> = $state(
-		Math.random() ? ComponentA : ComponentB
-	);
-</script>
-
-<svelte:component this={component} foo="bar" />
-```
-
-The two utility types `ComponentEvents` and `ComponentType` are also deprecated. `ComponentEvents` is obsolete because events are defined as callback props now, and `ComponentType` is obsolete because the new `Component` type is the component type already (e.g. `ComponentType<SvelteComponent<{ prop: string }>>` == `Component<{ prop: string }>`).
-
-### bind:this changes
-
-Because components are no longer classes, using `bind:this` no longer returns a class instance with `$set`, `$on` and `$destroy` methods on it. It only returns the instance exports (`export function/const`) and, if you're using the `accessors` option, a getter/setter-pair for each property.
-
-## Whitespace handling changed
-
-Previously, Svelte employed a very complicated algorithm to determine if whitespace should be kept or not. Svelte 5 simplifies this which makes it easier to reason about as a developer. The rules are:
-
-- Whitespace between nodes is collapsed to one whitespace
-- Whitespace at the start and end of a tag is removed completely
-- Certain exceptions apply such as keeping whitespace inside `pre` tags
-
-As before, you can disable whitespace trimming by setting the `preserveWhitespace` option in your compiler settings or on a per-component basis in `<svelte:options>`.
-
-## Modern browser required
-
-Svelte 5 requires a modern browser (in other words, not Internet Explorer) for various reasons:
-
-- it uses [`Proxies`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy)
-- elements with `clientWidth`/`clientHeight`/`offsetWidth`/`offsetHeight` bindings use a [`ResizeObserver`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver) rather than a convoluted `<iframe>` hack
-- `<input type="range" bind:value={...} />` only uses an `input` event listener, rather than also listening for `change` events as a fallback
-
-The `legacy` compiler option, which generated bulkier but IE-friendly code, no longer exists.
-
-## Changes to compiler options
-
-- The `false`/`true` (already deprecated previously) and the `"none"` values were removed as valid values from the `css` option
-- The `legacy` option was repurposed
-- The `hydratable` option has been removed. Svelte components are always hydratable now
-- The `enableSourcemap` option has been removed. Source maps are always generated now, tooling can choose to ignore it
-- The `tag` option was removed. Use `<svelte:options customElement="tag-name" />` inside the component instead
-- The `loopGuardTimeout`, `format`, `sveltePath`, `errorMode` and `varsReport` options were removed
-
-## The `children` prop is reserved
-
-Content inside component tags becomes a [snippet prop](/docs/snippets) called `children`. You cannot have a separate prop by that name.
-
-## Dot notation indicates a component
-
-In Svelte 4, `<foo.bar>` would create an element with a tag name of `"foo.bar"`. In Svelte 5, `foo.bar` is treated as a component instead. This is particularly useful inside `each` blocks:
-
-```svelte
-{#each items as item}
-	<item.component {...item.props} />
-{/each}
-```
-
-## Breaking changes in runes mode
-
-Some breaking changes only apply once your component is in runes mode.
-
-### Bindings to component exports are not allowed
-
-Exports from runes mode components cannot be bound to directly. For example, having `export const foo = ...` in component `A` and then doing `<A bind:foo />` causes an error. Use `bind:this` instead — `<A bind:this={a} />` — and access the export as `a.foo`. This change makes things easier to reason about, as it enforces a clear separation between props and exports.
-
-### Bindings need to be explicitly defined using `$bindable()`
-
-In Svelte 4 syntax, every property (declared via `export let`) is bindable, meaning you can `bind:` to it. In runes mode, properties are not bindable by default: you need to denote bindable props with the [`$bindable`](/docs/runes#$bindable) rune.
-
-If a bindable property has a default value (e.g. `let { foo = $bindable('bar') } = $props();`), you need to pass a non-`undefined` value to that property if you're binding to it. This prevents ambiguous behavior — the parent and child must have the same value — and results in better performance (in Svelte 4, the default value was reflected back to the parent, resulting in wasteful additional render cycles).
-
-### `accessors` option is ignored
-
-Setting the `accessors` option to `true` makes properties of a component directly accessible on the component instance. In runes mode, properties are never accessible on the component instance. You can use component exports instead if you need to expose them.
-
-### `immutable` option is ignored
-
-Setting the `immutable` option has no effect in runes mode. This concept is replaced by how `$state` and its variations work.
-
-### Classes are no longer "auto-reactive"
-
-In Svelte 4, doing the following triggered reactivity:
-
-```svelte
-<script>
-	let foo = new Foo();
-</script>
-
-<button on:click={() => (foo.value = 1)}>{foo.value}</button
->
-```
-
-This is because the Svelte compiler treated the assignment to `foo.value` as an instruction to update anything that referenced `foo`. In Svelte 5, reactivity is determined at runtime rather than compile time, so you should define `value` as a reactive `$state` field on the `Foo` class. Wrapping `new Foo()` with `$state(...)` will have no effect — only vanilla objects and arrays are made deeply reactive.
-
-### `<svelte:component>` is no longer necessary
-
-In Svelte 4, components are _static_ — if you render `<Thing>`, and the value of `Thing` changes, [nothing happens](https://svelte.dev/repl/7f1fa24f0ab44c1089dcbb03568f8dfa?version=4.2.18). To make it dynamic you must use `<svelte:component>`.
-
-This is [no longer true in Svelte 5](/#H4sIAAAAAAAAE4WQwU7DMAyGX8VESANpXe8lq9Q8AzfGobQujZQmWeJOQlXenaQB1sM0bnG-379_e2GDVOhZ9bYw3U7IKtZYy_aMvmwq_AUVYay9mV2XfrjvnLRUn_SJ5GSNI2hgcGaC3aFsDrlh97LB4g-LLY4ChQSvo9SfcIRHTy3h03NEvLzO0Nyjwo7gQ-q-urRqxuOy9oQ1AjeWpNHwQ5pQN7zMf7e4CLXY8Dhpdc-THooCaESP0DoEPM8ydqEmKIqkzUnL9MxrVJ2JG-qkoFH631xREg82mV4OEntWkZsx7K_3vXtdm_LbuwbiHwNx2-A9fANfmchv7QEAAA==):
-
-```svelte
-<script>
-	import A from './A.svelte';
-	import B from './B.svelte';
-
-	let Thing = $state();
-</script>
-
-<select bind:value={Thing}>
-	<option value={A}>A</option>
-	<option value={B}>B</option>
-</select>
-
-<!-- these are equivalent -->
-<Thing />
-<svelte:component this={Thing} />
-```
-
-### Touch and wheel events are passive
-
-When using `onwheel`, `onmousewheel`, `ontouchstart` and `ontouchmove` event attributes, the handlers are [passive](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#using_passive_listeners) to align with browser defaults. This greatly improves responsiveness by allowing the browser to scroll the document immediately, rather than waiting to see if the event handler calls `event.preventDefault()`.
-
-In the very rare cases that you need to prevent these event defaults, you should use [`on`](https://svelte-5-preview.vercel.app/docs/imports#svelte-events) instead (for example inside an action).
-
-### Attribute/prop syntax is stricter
-
-In Svelte 4, complex attribute values needn't be quoted:
-
-<!-- prettier-ignore -->
-```svelte
-<Component prop=this{is}valid />
-```
-
-This is a footgun. In runes mode, if you want to concatenate stuff you must wrap the value in quotes:
-
-```svelte
-<Component prop="this{is}valid" />
-```
-
-Note that Svelte 5 will also warn if you have a single expression wrapped in quotes, like `answer="{42}"` — in Svelte 6, that will cause the value to be converted to a string, rather than passed as a number.
-
-### HTML structure is stricter
-
-In Svelte 4, you were allowed to write HTML code that would be repaired by the browser when server side rendering it. For example you could write this...
-
-```svelte
-<table>
-	<tr>
-		<td>hi</td>
-	</tr>
-</table>
-```
-
-... and the browser would auto-insert a `<tbody>` element:
-
-```svelte
-<table>
-	<tbody>
-		<tr>
-			<td>hi</td>
-		</tr>
-	</tbody>
-</table>
-```
-
-Svelte 5 is more strict about the HTML structure and will throw a compiler error in cases where the browser would repair the DOM.
-
-## Other breaking changes
-
-### Stricter `@const` assignment validation
-
-Assignments to destructured parts of a `@const` declaration are no longer allowed. It was an oversight that this was ever allowed.
-
-### :is(...), :where(...), :has(...) and :not(...) are scoped
-
-Previously, Svelte did not analyse selectors inside `:is(...)`, `:where(...)`, `:has(...)` and `:not(...)`, effectively treating them as global. Svelte 5 analyses them in the context of the current component. As such, some selectors may now be treated as unused if they were relying on this treatment. To fix this, use `:global(...)` inside the `:is(...)/:where(...)/:has(...)/:not(...)` selectors.
-
-When using Tailwind's `@apply` directive, add a `:global` selector to preserve rules that use Tailwind-generated `:is(...)` selectors:
-
-```diff
-- main {
-+ main :global {
-	@apply bg-blue-100 dark:bg-blue-900
-}
-```
-
-### CSS hash position no longer deterministic
-
-Previously Svelte would always insert the CSS hash last. This is no longer guaranteed in Svelte 5. This is only breaking if you [have very weird css selectors](https://stackoverflow.com/questions/15670631/does-the-order-of-classes-listed-on-an-item-affect-the-css).
-
-### Scoped CSS uses :where(...)
-
-To avoid issues caused by unpredictable specificity changes, scoped CSS selectors now use `:where(.svelte-xyz123)` selector modifiers alongside `.svelte-xyz123` (where `xyz123` is, as previously, a hash of the `<style>` contents). You can read more detail [here](https://github.com/sveltejs/svelte/pull/10443).
-
-In the event that you need to support ancient browsers that don't implement `:where`, you can manually alter the emitted CSS, at the cost of unpredictable specificity changes:
-
-```js
-// @errors: 2552
-css = css.replace(/:where\((.+?)\)/, '$1');
-```
-
-### Error/warning codes have been renamed
-
-Error and warning codes have been renamed. Previously they used dashes to separate the words, they now use underscores (e.g. foo-bar becomes foo_bar). Additionally, a handful of codes have been reworded slightly.
-
-### Reduced number of namespaces
-
-The number of valid namespaces you can pass to the compiler option `namespace` has been reduced to `html` (the default), `mathml` and `svg`.
-
-The `foreign` namespace was only useful for Svelte Native, which we're planning to support differently in a 5.x minor.
-
-### beforeUpdate/afterUpdate changes
-
-`beforeUpdate` no longer runs twice on initial render if it modifies a variable referenced in the template.
-
-`afterUpdate` callbacks in a parent component will now run after `afterUpdate` callbacks in any child components.
-
-Both functions are disallowed in runes mode — use `$effect.pre(...)` and `$effect(...)` instead.
-
-### `contenteditable` behavior change
-
-If you have a `contenteditable` node with a corresponding binding _and_ a reactive value inside it (example: `<div contenteditable=true bind:textContent>count is {count}</div>`), then the value inside the contenteditable will not be updated by updates to `count` because the binding takes full control over the content immediately and it should only be updated through it.
-
-### `oneventname` attributes no longer accept string values
-
-In Svelte 4, it was possible to specify event attributes on HTML elements as a string:
-
-```svelte
-<button onclick="alert('hello')">...</button>
-```
-
-This is not recommended, and is no longer possible in Svelte 5, where properties like `onclick` replace `on:click` as the mechanism for adding [event handlers](/docs/event-handlers).
-
-### `null` and `undefined` become the empty string
-
-In Svelte 4, `null` and `undefined` were printed as the corresponding string. In 99 out of 100 cases you want this to become the empty string instead, which is also what most other frameworks out there do. Therefore, in Svelte 5, `null` and `undefined` become the empty string.
-
-### `bind:files` values can only be `null`, `undefined` or `FileList`
-
-`bind:files` is now a two-way binding. As such, when setting a value, it needs to be either falsy (`null` or `undefined`) or of type `FileList`.
-
-### Bindings now react to form resets
-
-Previously, bindings did not take into account `reset` event of forms, and therefore values could get out of sync with the DOM. Svelte 5 fixes this by placing a `reset` listener on the document and invoking bindings where necessary.
-
-### `walk` not longer exported
-
-`svelte/compiler` reexported `walk` from `estree-walker` for convenience. This is no longer true in Svelte 5, import it directly from that package instead in case you need it.
-
-### Content inside `svelte:options` is forbidden
-
-In Svelte 4 you could have content inside a `<svelte:options />` tag. It was ignored, but you could write something in there. In Svelte 5, content inside that tag is a compiler error.
-
-### `<slot>` elements in declarative shadow roots are preserved
-
-Svelte 4 replaced the `<slot />` tag in all places with its own version of slots. Svelte 5 preserves them in the case they are a child of a `<template shadowrootmode="...">` element.
-
-### `<svelte:element>` tag must be an expression
-
-In Svelte 4, `<svelte:element this="div">` is valid code. This makes little sense — you should just do `<div>`. In the vanishingly rare case that you _do_ need to use a literal value for some reason, you can do this:
-
-```diff
-- <svelte:element this="div">
-+ <svelte:element this={"div"}>
-```
-
-Note that whereas Svelte 4 would treat `<svelte:element this="input">` (for example) identically to `<input>` for the purposes of determining which `bind:` directives could be applied, Svelte 5 does not.
-
-### `mount` plays transitions by default
-
-The `mount` function used to render a component tree plays transitions by default unless the `intro` option is set to `false`. This is different from legacy class components which, when manually instantiated, didn't play transitions by default.
-
-### `<img src={...}>` and `{@html ...}` hydration mismatches are not repaired
-
-In Svelte 4, if the value of a `src` attribute or `{@html ...}` tag differ between server and client (a.k.a. a hydration mismatch), the mismatch is repaired. This is very costly: setting a `src` attribute (even if it evaluates to the same thing) causes images and iframes to be reloaded, and reinserting a large blob of HTML is slow.
-
-Since these mismatches are extremely rare, Svelte 5 assumes that the values are unchanged, but in development will warn you if they are not. To force an update you can do something like this:
-
-```svelte
-<script>
-	let { markup, src } = $props();
-
-	if (typeof window !== 'undefined') {
-		// stash the values...
-		const initial = { markup, src };
-
-		// unset them...
-		markup = src = undefined;
-
-		$effect(() => {
-			// ...and reset after we've mounted
-			markup = initial.markup;
-			src = initial.src;
-		});
-	}
-</script>
-
-{@html markup}
-<img {src} />
-```
-
-### Hydration works differently
-
-Svelte 5 makes use of comments during server side rendering which are used for more robust and efficient hydration on the client. As such, you shouldn't remove comments from your HTML output if you intend to hydrate it, and if you manually authored HTML to be hydrated by a Svelte component, you need to adjust that HTML to include said comments at the correct positions.
-
-### `onevent` attributes are delegated
-
-Event attributes replace event directives: Instead of `on:click={handler}` you write `onclick={handler}`. For backwards compatibility the `on:event` syntax is still supported and behaves the same as in Svelte 4. Some of the `onevent` attributes however are delegated, which means you need to take care to not stop event propagation on those manually, as they then might never reach the listener for this event type at the root.
-
-### `--style-props` uses a different element
-
-Svelte 5 uses an extra `<svelte-css-wrapper>` element instead of a `<div>` to wrap the component when using CSS custom properties.
-
-<!-- TODO in final docs, add link to corresponding section for more details -->
diff --git a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/03-deprecations.md b/sites/svelte-5-preview/src/routes/docs/content/03-appendix/03-deprecations.md
deleted file mode 100644
index 0c45bdaab208..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/03-deprecations.md
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: Deprecations
----
-
-Aside from the [breaking changes](/docs/breaking-changes) listed on the previous page, Svelte 5 should be a drop-in replacement for Svelte 4. That said, there are some features that we will remove in a future major version of Svelte, and we encourage you to update your apps now to avoid breaking changes in future.
-
-## beforeUpdate and afterUpdate
-
-`beforeUpdate(fn)` schedules the `fn` callback to run immediately before any changes happen inside the current component. `afterUpdate(fn)` schedules it to run after any changes have taken effect.
-
-These functions run indiscriminately when _anything_ changes. By using `$effect.pre` and `$effect` instead, we can ensure that work only happens when the things we care about have changed. The difference is visible in this example — [with `afterUpdate`](/#H4sIAAAAAAAAE21STW-DMAz9K140CSpVtJddUmDaj5i0aezAwKBI-VJi6CqU_74AY-WwiyPbz37PdibWCYme8Y-J6Voh4-zFWnZkdLOz40eUhNH3ZnDNHMl944SlstIVCWWNI5ig7gjdq21rQgjQOaMgWUuTSwRGqESCxhjXeijg0VNEphN8czgf4RYthMNlwxEqi66mweEd_HTeARzq9p5KsixL1uyGsA7HCNh1-tWxU5qmByhKmJY6aoz2RmImTZ8mbtBa6H4_10ZAqxUdpHudD0WxkB62fhVtKvewclX2DEmPRDPFtXYKXQL8Hop7kjG08dH_w8REmJ9lcfnpfhadr6vnV6FbcwWjuTKDR2VGLKYUl6n_brEcAbNGCtT0thxj897jLQOc1p5C2yFuPn6LomKu1j1WDL4iAx9rOcTGO3kBYk1uy2lZQchPtoxfSJlWdAJbxskNGD7DD-pLlz59AgAA), the callback runs on every `mousemove` event, whereas [with `$effect`](/#H4sIAAAAAAAAE21SwW6EIBD9lSnZRDfZuHvphapN_6JN7cHqaEgQCIxuG8O_F7VUDw0JZOY93gxvmFknJDrG32em6gEZZy_GsAujb7MEbkJJGGKnR9ssmdw1VhgqK1WRRIJGa9s6KODkqCZMZ_jicLvAd9jBn58ij3AwaGsaLe7kx9uBYFG1O5RkWZZsaGQYi1MgHJQWOIAn7DpsKE3PUJQwr3eo0cppiZnUfZrYUSmhevhlRmHadtFBeuzvoSjWYueoVVHs7kgrt46eIemRaJG_13ZAmwDfU8EfGVKxHv3_iAD45VgNy6-7xyrfRsDvQrX6DlrxQY8OBz1hMae4vvhvBqv5mDVSoKLXdQgxegMf1nXTFMqMwfEw46JitlY9Vgw-QwU-1XIMwof2PIQ7uSnn1QKfX00Z_sOgW9EJbBknO6L_8D9aLfICSgIAAA==), the function only runs when `temperature` changes:
-
-```diff
-<script>
--	import { afterUpdate } from 'svelte';
-
-	let coords = $state({ x: 0, y: 0 });
-	let temperature = $state(50);
-	let trend = $state('...');
-
-	let prev = temperature;
-
--	afterUpdate(() => {
--		console.log('running afterUpdate');
-+	$effect(() => {
-+		console.log('running $effect');
-
-		if (temperature !== prev) {
-			trend = temperature > prev ? 'getting warmer' : 'getting cooler';
-			prev = temperature;
-		}
-	});
-</script>
-
-<svelte:window on:mousemove={(e) => coords = { x: e.clientX, y: e.clientY } } />
-
-<input type="range" bind:value={temperature} >
-<p>{trend}</p>
-```
-
-Note that using `$effect` and `$effect.pre` will put you in [runes mode](/docs/runes) — be sure to update your props and state accordingly.
-
-## `createEventDispatcher`
-
-`createEventDispatcher` returns a function from which you can dispatch custom events. The usage is somewhat boilerplate-y, but it was encouraged in Svelte 4 due to consistency with how you listen to dom events (via `on:click` for example).
-
-Svelte 5 introduces [event attributes](/docs/event-handlers) which deprecate event directives (`onclick` instead of `on:click`), and as such we also encourage you to use callback properties for events instead:
-
-```diff
-<script>
--	import { createEventDispatcher } from 'svelte';
--	const dispatch = createEventDispatcher();
-+	let { greet } = $props();
-
--	function greet() {
--		dispatch('greet');
--	}
-</script>
-
-<button
--	on:click={greet}
-+	onclick={greet}
->greet</button>
-```
-
-When authoring custom elements, use the new [host rune](/docs/runes#$host) to dispatch events (among other things):
-
-```diff
-<script>
--	import { createEventDispatcher } from 'svelte';
--	const dispatch = createEventDispatcher();
-
-	function greet() {
--		dispatch('greet');
-+		$host().dispatchEvent(new CustomEvent('greet'));
-	}
-</script>
-
-<button
--	on:click={greet}
-+	onclick={greet}
->greet</button>
-```
-
-Note that using `$props` and `$host` will put you in [runes mode](/docs/runes) — be sure to update your props and state accordingly.
-
-## `<svelte:component>` in runes mode
-
-In previous versions of Svelte, the component constructor was fixed when the component was rendered. In other words, if you wanted `<X>` to re-render when `X` changed, you would either have to use `<svelte:component this={X}>` or put the component inside a `{#key X}...{/key}` block.
-
-In Svelte 5 this is no longer true — if `X` changes, `<X>` re-renders.
-
-In some cases `<object.property>` syntax can be used as a replacement; a lowercased variable with property access is recognized as a component in Svelte 5.
-
-For complex component resolution logic, an intermediary, capitalized variable may be necessary. E.g. in places where `@const` can be used:
-
-```diff
-{#each items as item}
--	<svelte:component this={item.condition ? Y : Z} />
-+	{@const Component = item.condition ? Y : Z}
-+	<Component />
-{/each}
-```
-
-A derived value may be used in other contexts:
-
-```diff
-<script>
-	...
-	let condition = $state(false);
-+	const Component = $derived(condition ? Y : Z);
-</script>
-- <svelte:component this={condition ? Y : Z} />
-+ <Component />
-```
-
-## `immutable`
-
-The `immutable` compiler option is deprecated. Use runes mode instead, where all state is immutable (which means that assigning to `object.property` won't cause updates for anything that is observing `object` itself, or a different property of it).
-
-## `context="module"`
-
-`context="module"` is deprecated, use the new `module` attribute instead:
-
-```diff
-- <script context="module">
-+ <script module>
-	...
-</script>
-```
diff --git a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/meta.json b/sites/svelte-5-preview/src/routes/docs/content/03-appendix/meta.json
deleted file mode 100644
index 5b62b9209c1b..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/content/03-appendix/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Appendix"
-}
diff --git a/sites/svelte-5-preview/src/routes/docs/functions/+page.server.js b/sites/svelte-5-preview/src/routes/docs/functions/+page.server.js
deleted file mode 100644
index 9af8d5a648fb..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/functions/+page.server.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { redirect } from '@sveltejs/kit';
-
-export function load() {
-	redirect(308, '/docs/imports');
-}
diff --git a/sites/svelte-5-preview/src/routes/docs/render.js b/sites/svelte-5-preview/src/routes/docs/render.js
deleted file mode 100644
index 5d44f48bad0b..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/render.js
+++ /dev/null
@@ -1,203 +0,0 @@
-import { base as app_base } from '$app/paths';
-import {
-	escape,
-	extractFrontmatter,
-	markedTransform,
-	normalizeSlugify,
-	removeMarkdown,
-	renderContentMarkdown
-} from '@sveltejs/site-kit/markdown';
-
-/**
- * @param {import('./types').DocsData} docs_data
- * @param {string} slug
- */
-export async function get_parsed_docs(docs_data, slug) {
-	for (const { pages } of docs_data) {
-		for (const page of pages) {
-			if (page.slug === slug) {
-				return {
-					...page,
-					content: await render_content(page.file, page.content)
-				};
-			}
-		}
-	}
-
-	return null;
-}
-
-/** @return {Promise<import('./types').DocsData>} */
-export async function get_docs_data(base = './src/routes/docs/content') {
-	const { readdir, readFile } = await import('node:fs/promises');
-
-	/** @type {import('./types').DocsData} */
-	const docs_data = [];
-
-	for (const category_dir of await readdir(base)) {
-		const match = /\d{2}-(.+)/.exec(category_dir);
-		if (!match) continue;
-
-		const category_slug = match[1];
-
-		// Read the meta.json
-		const { title: category_title, draft = 'false' } = JSON.parse(
-			await readFile(`${base}/${category_dir}/meta.json`, 'utf-8')
-		);
-
-		if (draft === 'true') continue;
-
-		/** @type {import('./types').Category} */
-		const category = {
-			title: category_title,
-			slug: category_slug,
-			pages: []
-		};
-
-		for (const filename of await readdir(`${base}/${category_dir}`)) {
-			if (filename === 'meta.json') continue;
-			const match = /\d{2}-(.+)/.exec(filename);
-			if (!match) continue;
-
-			const page_slug = match[1].replace('.md', '');
-
-			const page_data = extractFrontmatter(
-				await readFile(`${base}/${category_dir}/${filename}`, 'utf-8')
-			);
-
-			if (page_data.metadata.draft === 'true') continue;
-
-			const page_title = page_data.metadata.title;
-			const page_content = page_data.body;
-
-			category.pages.push({
-				title: page_title,
-				slug: page_slug,
-				content: page_content,
-				category: category_title,
-				sections: await get_sections(page_content),
-				path: `${app_base}/docs/${page_slug}`,
-				file: `${category_dir}/${filename}`
-			});
-		}
-
-		docs_data.push(category);
-	}
-
-	return docs_data;
-}
-
-/** @param {import('./types').DocsData} docs_data */
-export function get_docs_list(docs_data) {
-	return docs_data.map((category) => ({
-		title: category.title,
-		pages: category.pages.map((page) => ({
-			title: page.title,
-			path: page.path
-		}))
-	}));
-}
-
-const titled = async (str) =>
-	removeMarkdown(
-		escape(await markedTransform(str, { paragraph: (txt) => txt }))
-			.replace(/<\/?code>/g, '')
-			.replace(/&#39;/g, "'")
-			.replace(/&quot;/g, '"')
-			.replace(/&lt;/g, '<')
-			.replace(/&gt;/g, '>')
-			.replace(/&amp;/, '&')
-			.replace(/<(\/)?(em|b|strong|code)>/g, '')
-	);
-
-/** @param {string} markdown */
-export async function get_sections(markdown) {
-	const lines = markdown.split('\n');
-	const root = /** @type {import('./types').Section} */ ({
-		title: 'Root',
-		slug: 'root',
-		sections: [],
-		breadcrumbs: [''],
-		text: ''
-	});
-	let currentNodes = [root];
-
-	for (const line of lines) {
-		const match = line.match(/^(#{2,4})\s(.*)/);
-		if (match) {
-			const level = match[1].length - 2;
-			const text = await titled(match[2]);
-			const slug = normalizeSlugify(text);
-
-			// Prepare new node
-			/** @type {import('./types').Section} */
-			const newNode = {
-				title: text,
-				slug,
-				sections: [],
-				breadcrumbs: [...currentNodes[level].breadcrumbs, text],
-				text: ''
-			};
-
-			// Add the new node to the tree
-			currentNodes[level].sections.push(newNode);
-
-			// Prepare for potential children of the new node
-			currentNodes = currentNodes.slice(0, level + 1);
-			currentNodes.push(newNode);
-		} else if (line.trim() !== '') {
-			// Add non-heading line to the text of the current section
-			currentNodes[currentNodes.length - 1].text += line + '\n';
-		}
-	}
-
-	return root.sections;
-}
-
-/**
- * @param {string} filename
- * @param {string} body
- * @returns
- */
-const render_content = (filename, body) =>
-	renderContentMarkdown(filename, body, {
-		cacheCodeSnippets: true,
-
-		twoslashBanner: (filename, source) => {
-			const injected = [
-				`// @filename: runes.d.ts`,
-				`declare function $props(): any`,
-				`declare function $state<T>(initial: T): T`,
-				`declare function $derived<T>(value: T): T`,
-				`declare const $effect: ((callback: () => void | (() => void)) => void) & { pre: (callback: () => void | (() => void)) => void };`
-			];
-
-			if (/(svelte)/.test(source) || filename.includes('typescript')) {
-				injected.push(`// @filename: ambient.d.ts`, `/// <reference types="svelte" />`);
-			}
-
-			if (filename.includes('svelte-compiler')) {
-				injected.push('// @esModuleInterop');
-			}
-
-			if (filename.includes('svelte.md')) {
-				injected.push('// @errors: 2304');
-			}
-
-			// Actions JSDoc examples are invalid. Too many errors, edge cases
-			if (filename.includes('svelte-action')) {
-				injected.push('// @noErrors');
-			}
-
-			if (filename.includes('typescript')) {
-				injected.push('// @errors: 2304');
-			}
-
-			// Tutorials
-			if (filename.startsWith('tutorial')) {
-				injected.push('// @noErrors');
-			}
-
-			return injected.join('\n');
-		}
-	});
diff --git a/sites/svelte-5-preview/src/routes/docs/types.d.ts b/sites/svelte-5-preview/src/routes/docs/types.d.ts
deleted file mode 100644
index 99c7324135d1..000000000000
--- a/sites/svelte-5-preview/src/routes/docs/types.d.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-export type DocsData = Category[];
-
-export interface Section {
-	title: string;
-	slug: string;
-	// Currently, we are only going with 2 level headings, so this will be undefined. In future, we may want to support 3 levels, in which case this will be a list of sections
-	sections?: Section[];
-	breadcrumbs: string[];
-	text: string;
-}
-
-export type Category = {
-	title: string;
-	slug: string;
-	pages: Page[];
-};
-
-export type Page = {
-	title: string;
-	category: string;
-	slug: string;
-	file: string;
-	path: string;
-	content: string;
-	sections: Section[];
-};
diff --git a/sites/svelte-5-preview/src/routes/faq/+page.server.js b/sites/svelte-5-preview/src/routes/faq/+page.server.js
deleted file mode 100644
index 03916b4d64b5..000000000000
--- a/sites/svelte-5-preview/src/routes/faq/+page.server.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { redirect } from '@sveltejs/kit';
-
-export function load() {
-	redirect(308, '/docs/faq');
-}
diff --git a/sites/svelte-5-preview/src/routes/gzip.js b/sites/svelte-5-preview/src/routes/gzip.js
deleted file mode 100644
index d74a36b6a98c..000000000000
--- a/sites/svelte-5-preview/src/routes/gzip.js
+++ /dev/null
@@ -1,29 +0,0 @@
-/** @param {string} input */
-export async function compress_and_encode_text(input) {
-	const reader = new Blob([input]).stream().pipeThrough(new CompressionStream('gzip')).getReader();
-	let buffer = '';
-	for (;;) {
-		const { done, value } = await reader.read();
-		if (done) {
-			reader.releaseLock();
-			return btoa(buffer).replaceAll('+', '-').replaceAll('/', '_');
-		} else {
-			for (let i = 0; i < value.length; i++) {
-				// decoding as utf-8 will make btoa reject the string
-				buffer += String.fromCharCode(value[i]);
-			}
-		}
-	}
-}
-
-/** @param {string} input */
-export async function decode_and_decompress_text(input) {
-	const decoded = atob(input.replaceAll('-', '+').replaceAll('_', '/'));
-	// putting it directly into the blob gives a corrupted file
-	const u8 = new Uint8Array(decoded.length);
-	for (let i = 0; i < decoded.length; i++) {
-		u8[i] = decoded.charCodeAt(i);
-	}
-	const stream = new Blob([u8]).stream().pipeThrough(new DecompressionStream('gzip'));
-	return new Response(stream).text();
-}
diff --git a/sites/svelte-5-preview/src/routes/nav.json/+server.js b/sites/svelte-5-preview/src/routes/nav.json/+server.js
deleted file mode 100644
index 38e9deb9e8b4..000000000000
--- a/sites/svelte-5-preview/src/routes/nav.json/+server.js
+++ /dev/null
@@ -1,29 +0,0 @@
-import { json } from '@sveltejs/kit';
-import { get_docs_data, get_docs_list } from '../docs/render';
-
-export const GET = async () => {
-	const docs_list = get_docs_list(await get_docs_data());
-	const processed_docs_list = docs_list.map(({ title, pages }) => ({
-		title,
-		sections: pages.map(({ title, path }) => ({ title, path }))
-	}));
-
-	return json([
-		{
-			title: 'Docs',
-			prefix: 'docs',
-			pathname: '/docs/introduction',
-			sections: [
-				{
-					title: 'DOCS',
-					sections: processed_docs_list
-				}
-			]
-		},
-		{
-			title: 'Status',
-			prefix: 'status',
-			pathname: '/status'
-		}
-	]);
-};
diff --git a/sites/svelte-5-preview/src/routes/status/+page.server.js b/sites/svelte-5-preview/src/routes/status/+page.server.js
deleted file mode 100644
index 55f94f155bb8..000000000000
--- a/sites/svelte-5-preview/src/routes/status/+page.server.js
+++ /dev/null
@@ -1,44 +0,0 @@
-import results from './results.json';
-
-export async function load() {
-	let total = 0;
-	let passed = 0;
-	let failed = 0;
-	let skipped = 0;
-
-	const suites = results.testResults
-		.map((suite) => {
-			let name = suite.name.split('/').at(-2);
-
-			if (name === 'runtime-browser') {
-				// special case
-				name = suite.assertionResults[0].ancestorTitles[1];
-			}
-
-			return {
-				name,
-				tests: suite.assertionResults.map((test) => {
-					total += 1;
-					if (test.status === 'passed') passed += 1;
-					if (test.status === 'failed') failed += 1;
-					if (test.status === 'skipped') skipped += 1;
-					return {
-						title: test.title,
-						status: test.status
-					};
-				})
-			};
-		})
-		.sort((a, b) => (a.name < b.name ? -1 : +1));
-
-	return {
-		nav_title: 'Status',
-		results: {
-			suites,
-			total,
-			passed,
-			failed,
-			skipped
-		}
-	};
-}
diff --git a/sites/svelte-5-preview/src/routes/status/+page.svelte b/sites/svelte-5-preview/src/routes/status/+page.svelte
deleted file mode 100644
index f0683c0a4010..000000000000
--- a/sites/svelte-5-preview/src/routes/status/+page.svelte
+++ /dev/null
@@ -1,86 +0,0 @@
-<script>
-	export let data;
-</script>
-
-<div class="status">
-	<div class="column">
-		<h1>Is Svelte 5 ready yet?</h1>
-
-		<h2>{data.results.passed === data.results.total ? `Yes! 🎉` : `No.`}</h2>
-
-		<p class="details">
-			{data.results.total} tests ({data.results.suites.length} suites) – {data.results.passed} passed,
-			{data.results.failed}
-			failed, {data.results.skipped} skipped.
-			<a href="/coverage/index.html">See coverage report.</a>
-		</p>
-	</div>
-
-	<div class="results">
-		{#each data.results.suites as suite}
-			<section>
-				<h3>{suite.name}</h3>
-				<div class="grid">
-					{#each suite.tests as test}
-						<div title={test.title} class="result {test.status}"></div>
-					{/each}
-				</div>
-			</section>
-		{/each}
-	</div>
-</div>
-
-<style>
-	.status {
-		padding: var(--sk-page-padding-top) var(--sk-page-padding-side) 6rem var(--sk-page-padding-side);
-	}
-
-	.column {
-		max-width: var(--sk-page-main-width);
-		margin: 0 auto;
-	}
-
-	h2 {
-		font-size: 10rem;
-		line-height: 1;
-		margin: 2rem 0 0 0;
-		left: -0.05em;
-		color: var(--sk-theme-2);
-	}
-
-	.details {
-		color: var(--sk-text-4);
-		margin: 0;
-	}
-
-	section {
-		margin: 2rem 0;
-	}
-
-	h3 {
-		margin: 0 0 0.5rem 0;
-	}
-	.grid {
-		display: flex;
-		gap: 0.4rem;
-		flex-wrap: wrap;
-	}
-
-	.result {
-		width: 1.2rem;
-		height: 1.2rem;
-		background: #eee;
-	}
-
-	.result.skipped {
-		background: rgb(236 236 236);
-	}
-
-	.result.passed {
-		background: rgb(149 236 83);
-	}
-
-	.result.failed {
-		background: rgb(236 83 83);
-	}
-</style>
diff --git a/sites/svelte-5-preview/src/routes/status/data.json/+server.js b/sites/svelte-5-preview/src/routes/status/data.json/+server.js
deleted file mode 100644
index cfa65b0065f0..000000000000
--- a/sites/svelte-5-preview/src/routes/status/data.json/+server.js
+++ /dev/null
@@ -1,6 +0,0 @@
-import { json } from '@sveltejs/kit';
-import results from '../results.json';
-
-export function GET() {
-	return json(results);
-}
diff --git a/sites/svelte-5-preview/src/routes/svelte/[...path]/+server.js b/sites/svelte-5-preview/src/routes/svelte/[...path]/+server.js
deleted file mode 100644
index 4e2254243526..000000000000
--- a/sites/svelte-5-preview/src/routes/svelte/[...path]/+server.js
+++ /dev/null
@@ -1,37 +0,0 @@
-import compiler_js from '../../../../../../packages/svelte/compiler/index.js?url';
-import package_json from '../../../../../../packages/svelte/package.json?url';
-import { read } from '$app/server';
-
-const files = import.meta.glob('../../../../../../packages/svelte/src/**/*.js', {
-	eager: true,
-	query: '?url',
-	import: 'default'
-});
-
-const prefix = '../../../../../../packages/svelte/';
-
-export const prerender = true;
-
-export function entries() {
-	const entries = Object.keys(files).map((path) => ({ path: path.replace(prefix, '') }));
-	entries.push({ path: 'compiler/index.js' }, { path: 'package.json' });
-	return entries;
-}
-
-// service worker requests files under this path to load the compiler and runtime
-export async function GET({ params }) {
-	let file = '';
-
-	if (params.path === 'compiler/index.js') {
-		file = compiler_js;
-	} else if (params.path === 'package.json') {
-		file = package_json;
-	} else {
-		file = /** @type {string} */ (files[prefix + params.path]);
-
-		// remove query string added by Vite when changing source code locally
-		file = file.split('?')[0];
-	}
-
-	return read(file);
-}
diff --git a/sites/svelte-5-preview/static/favicon.png b/sites/svelte-5-preview/static/favicon.png
deleted file mode 100644
index 825b9e65af7c104cfb07089bb28659393b4f2097..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1571
zcmV+;2Hg3HP)<h;3K|Lk000e1NJLTq004jh004jp1ONa4X*a1r00001b5ch_0Itp)
z=>Px)-AP12RCwC$UE6KzI1p6{F2N<Fgp}YCTtZ542`(WexCEDw|A=A)1A-t30wEX>
z1VK2vi|pOpn{~#djwYcWXTI_im_u^TJgMZ4JMOsSj!0ma>B?-(Hr@X&W@|R-$}W@Z
zg<YDbY-gN-C@$NXr>j#$x=!~7LGqHW?IO8+*oE1MyDp!G=L<gz=E*n%PA*mnuaD-%
zU>0#^lUx?;!fXv@l^6SvTnf^ac{5OurzC#ZMYc20lI%HhX816AYVs1T3heS1*WaWH
z%;x>)-J}YB5#CLzU@GBR6sXYrD>Vw(Fmt#|JP;+}<#6b63Ike{Fuo!?M{yEffez;|
zp!PfsuaC)>h>-AdbnwN13g*1LowNjT5?+lFVd#9$!8Z9HA|$*6dQ8EHLu}U|obW6f
z2%uGv?vr=KNq7YYa2Roj;|zooo<)lf=&2yxM@e`kM$CmCR#x>gI>I|*Ubr({5Y^rb
zghxQU22N}F51}^yfDSt7<V*0Nvi!iKPY@n`1~$se=LwHTOE7`*@+};uU_gT$1{Nib
z9&~5~nc4J(EWez%_f0Ty7T;wB{7s*oNO=9p8(o}N*_V>86oMTc!W&V;d?76)9KXX1
z+6Okem(d}YXmmOiZq$!IPk5t8nnS{%?+vDFz3BevmFN<oPlV?qzG@=jl`t@|E8zV8
zJ4}It4e%+dFPWw16u{sAX42jlFu{_e!AKZE75iV2&Q7>gpIod~R{>@#@5x9zJK<vg
zI0+@80NMa{gtNoRhsR-w%piFI3d-5xrN)R}H!WtK=Gp%dC5(a`Q0V4_vS-mj<((Z~
zbV*PucDY#zFVglY>EHLHv!gHeK~n)Ld!M8DB|Kfe%~123&Hz1Z(86nU7*G5chmyDe
ziV7$pB7pJ=96hpxHv9rCR29%bLOXlKU<_13_M8x)6;P8E1Kz6G<&P?$P^%c!M5`2`
zfY2zg;VK5~^>TJGQzc+33-n~gKt{{of8GzUkWmU110IgI0DLxRIM>0US|TsM=L|@F
z0Bun8U!cRB7-2apz=y-7*UxOxz@Z0)@QM)9wSGki1AZ38ceG7Q72z5`i;i=J`ILzL
z@iUO?SBBG-0cQuo+an4TsL<j(YStU%^TNkjEqg808>y-g-x;8P4UVwk|D8{W@U1Zi
z!M)+jqy@nQ$p?5tsHp-6J304Q={v-B>66$P0IDx&YT(`IcZ~bZfmn11#rXd7<5s}y
zBi9eim&zQc0Dk|2>$bs0PnLmDfMP5lcXRY&cvJ=zKxI^f0%-d$tD!`LBf9^jMSYUA
zI8U?CWdY@}cRq6{5~y+<zzg4N+!Mudx;=&$zSp?cjRmyF-+404b-P66DA17$<$H}=
z7$P4)QXt>)#h1!*-HcGW@+gZ4B};0OnC~`xQOyH19z*TA!!<qA9l$G~6DRxiCy7Vo
zOl^oK!S3XbayWz&p33NSw$lxR1fm)O*rCE0^ZNmk0wnax!!?%g599+O37!666~F(y
z5fq?5T*Fm{^%YR^PiM%z#%x`fAC+;C&`X5JXN_40SieIEXoaUU=*}=c0OC7@a*rFE
z3xr3yyFB~zRl(lNY&B@$Fia%81M!xeIuTYNz!Dz6eBKONjL<@dJdT$H?ShKl6$p=F
ze!fdgzelJI&n`Hk9f}>BJ%9s0V3F?CAJ{hTd#*tf+ur-W9MOURF-@B77_-OshsY}6
zOXRY=5%C^*26z?l)1=$bz30!so5tfABdSYzO+H=CpV~aaUefmjvfZ3Ttu9W&W3Iu6
zROlh0MFA5h;my}8lB0tAV-Rvc2Zs_CCSJnx@d`<ao$!3dCkTn3@aF0ny6VrToO6qA
z-~&2=w&2nT&o5u>**$idgy-iMob4dJWWw|21b4NB=LfsYp0Aeh{Ov)yztQi;eL4y5
zMi>8^SzKqk8~k?UiQK^^-5d8c%bV?$F8%X~czyiaKCI2=UH<v&YL5FIcieFm_zQ2O
VHuiSbmk|H}002ovPDHLkV1f%e^4kCa

diff --git a/sites/svelte-5-preview/svelte.config.js b/sites/svelte-5-preview/svelte.config.js
deleted file mode 100644
index d2d2d8019d8a..000000000000
--- a/sites/svelte-5-preview/svelte.config.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import adapter from '@sveltejs/adapter-vercel';
-
-/** @type {import('@sveltejs/kit').Config} */
-export default {
-	compilerOptions: {
-		compatibility: {
-			// site-kit manually instantiates components inside an action
-			componentApi: 4
-		}
-	},
-	kit: {
-		adapter: adapter({
-			runtime: 'nodejs18.x'
-		}),
-
-		prerender: {
-			handleMissingId(details) {
-				// do nothing
-			}
-		}
-	},
-
-	vitePlugin: {
-		inspector: false
-	}
-};
diff --git a/sites/svelte-5-preview/vercel.json b/sites/svelte-5-preview/vercel.json
deleted file mode 100644
index f9883a3d36f9..000000000000
--- a/sites/svelte-5-preview/vercel.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-	"$schema": "http://openapi.vercel.sh/vercel.json",
-	"outputDirectory": "sites/svelte-5-preview/.vercel",
-	"buildCommand": "cd ../../ && pnpm build && (pnpm test-output || true) && pnpm preview-site"
-}
diff --git a/sites/svelte-5-preview/vite.config.js b/sites/svelte-5-preview/vite.config.js
deleted file mode 100644
index 29642f5f78d4..000000000000
--- a/sites/svelte-5-preview/vite.config.js
+++ /dev/null
@@ -1,20 +0,0 @@
-import { sveltekit } from '@sveltejs/kit/vite';
-
-/** @type {import('vite').UserConfig} */
-const config = {
-	plugins: [sveltekit()],
-	resolve: {
-		dedupe: ['@codemirror/state', '@codemirror/language', '@codemirror/view']
-	},
-	optimizeDeps: {
-		exclude: ['@sveltejs/site-kit', '@sveltejs/kit', 'svelte']
-	},
-	ssr: { noExternal: ['@sveltejs/site-kit', '@sveltejs/kit', 'svelte'] },
-	server: {
-		fs: {
-			strict: false
-		}
-	}
-};
-
-export default config;

From edfc0a9c6a591394a63498930fd1df8fdf76cab0 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 12 Dec 2024 00:22:30 +0100
Subject: [PATCH 45/62] fix: correctly handle ssr for `reactivity/window`
 (#14681)

---
 .changeset/khaki-guests-switch.md                  |  5 +++++
 packages/svelte/src/reactivity/window/index.js     |  8 +++++---
 .../samples/reactivity-window/_expected.html       |  1 +
 .../samples/reactivity-window/main.svelte          | 14 ++++++++++++++
 packages/svelte/types/index.d.ts                   |  2 +-
 5 files changed, 26 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/khaki-guests-switch.md
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/reactivity-window/_expected.html
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/reactivity-window/main.svelte

diff --git a/.changeset/khaki-guests-switch.md b/.changeset/khaki-guests-switch.md
new file mode 100644
index 000000000000..f32e71084bef
--- /dev/null
+++ b/.changeset/khaki-guests-switch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly handle ssr for `reactivity/window`
diff --git a/packages/svelte/src/reactivity/window/index.js b/packages/svelte/src/reactivity/window/index.js
index 16e8b7b87b9a..8c50a5c440df 100644
--- a/packages/svelte/src/reactivity/window/index.js
+++ b/packages/svelte/src/reactivity/window/index.js
@@ -124,7 +124,7 @@ export const online = new ReactiveValue(
  * `devicePixelRatio.current` is a reactive view of `window.devicePixelRatio`. On the server it is `undefined`.
  * Note that behaviour differs between browsers — on Chrome it will respond to the current zoom level,
  * on Firefox and Safari it won't.
- * @type {{ get current(): number }}
+ * @type {{ get current(): number | undefined }}
  * @since 5.11.0
  */
 export const devicePixelRatio = /* @__PURE__ */ new (class DevicePixelRatio {
@@ -144,11 +144,13 @@ export const devicePixelRatio = /* @__PURE__ */ new (class DevicePixelRatio {
 	}
 
 	constructor() {
-		this.#update();
+		if (BROWSER) {
+			this.#update();
+		}
 	}
 
 	get current() {
 		get(this.#dpr);
-		return window.devicePixelRatio;
+		return BROWSER ? window.devicePixelRatio : undefined;
 	}
 })();
diff --git a/packages/svelte/tests/server-side-rendering/samples/reactivity-window/_expected.html b/packages/svelte/tests/server-side-rendering/samples/reactivity-window/_expected.html
new file mode 100644
index 000000000000..ee65cb76c7d7
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/reactivity-window/_expected.html
@@ -0,0 +1 @@
+<!--[--><p>devicePixelRatio: </p> <p>innerHeight: </p> <p>innerWidth: </p> <p>online: </p> <p>outerHeight: </p> <p>outerWidth: </p> <p>screenLeft: </p> <p>screenTop: </p> <p>scrollX: </p> <p>scrollY: </p><!--]-->
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/reactivity-window/main.svelte b/packages/svelte/tests/server-side-rendering/samples/reactivity-window/main.svelte
new file mode 100644
index 000000000000..e84e41bf637b
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/reactivity-window/main.svelte
@@ -0,0 +1,14 @@
+<script>
+	import { devicePixelRatio, innerHeight, innerWidth, online, outerHeight, outerWidth, screenLeft, screenTop, scrollX, scrollY } from "svelte/reactivity/window";
+</script>
+
+<p>devicePixelRatio: {devicePixelRatio.current}</p>
+<p>innerHeight: {innerHeight.current}</p>
+<p>innerWidth: {innerWidth.current}</p>
+<p>online: {online.current}</p>
+<p>outerHeight: {outerHeight.current}</p>
+<p>outerWidth: {outerWidth.current}</p>
+<p>screenLeft: {screenLeft.current}</p>
+<p>screenTop: {screenTop.current}</p>
+<p>scrollX: {scrollX.current}</p>
+<p>scrollY: {scrollY.current}</p>
\ No newline at end of file
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 206f9931f50c..435476d7033a 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -2015,7 +2015,7 @@ declare module 'svelte/reactivity/window' {
 	 * @since 5.11.0
 	 */
 	export const devicePixelRatio: {
-		get current(): number;
+		get current(): number | undefined;
 	};
 	class ReactiveValue<T> {
 		

From 7aa80fc2a7ae1e622ec2c2b49d4654fa8aef257a Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 11 Dec 2024 18:29:35 -0500
Subject: [PATCH 46/62] Version Packages (#14682)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/khaki-guests-switch.md | 5 -----
 packages/svelte/CHANGELOG.md      | 6 ++++++
 packages/svelte/package.json      | 2 +-
 packages/svelte/src/version.js    | 2 +-
 4 files changed, 8 insertions(+), 7 deletions(-)
 delete mode 100644 .changeset/khaki-guests-switch.md

diff --git a/.changeset/khaki-guests-switch.md b/.changeset/khaki-guests-switch.md
deleted file mode 100644
index f32e71084bef..000000000000
--- a/.changeset/khaki-guests-switch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly handle ssr for `reactivity/window`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index f4b7c18d7dc5..978e841bf83b 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.11.2
+
+### Patch Changes
+
+- fix: correctly handle ssr for `reactivity/window` ([#14681](https://github.com/sveltejs/svelte/pull/14681))
+
 ## 5.11.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index f461a4b4c3a2..e95341a0bdef 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.11.1",
+  "version": "5.11.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1cedefa3149b..e264eace2c12 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.11.1';
+export const VERSION = '5.11.2';
 export const PUBLIC_VERSION = '5';

From 8ba1b9ddd0bc65b9a790030aa8b7c73ae2990543 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 12 Dec 2024 10:42:10 +0000
Subject: [PATCH 47/62] fix: avoid mutation validation for
 invalidate_inner_signals (#14688)

* fix: avoid mutation validation for invalidate_inner_signals

* add test

* Update packages/svelte/src/internal/client/runtime.js

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/strong-pandas-provide.md           |  5 +++++
 .../svelte/src/internal/client/runtime.js     |  7 ++++---
 .../binding-interop-derived/Comp.svelte       | 12 ++++++++++++
 .../binding-interop-derived/_config.js        |  5 +++++
 .../binding-interop-derived/main.svelte       | 19 +++++++++++++++++++
 5 files changed, 45 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/strong-pandas-provide.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/binding-interop-derived/Comp.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/binding-interop-derived/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/binding-interop-derived/main.svelte

diff --git a/.changeset/strong-pandas-provide.md b/.changeset/strong-pandas-provide.md
new file mode 100644
index 000000000000..0fe7e70c6d6a
--- /dev/null
+++ b/.changeset/strong-pandas-provide.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: avoid mutation validation for invalidate_inner_signals
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 4928419d16af..5d53ca336079 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -29,7 +29,7 @@ import {
 } from './constants.js';
 import { flush_tasks } from './dom/task.js';
 import { add_owner } from './dev/ownership.js';
-import { mutate, set, source } from './reactivity/sources.js';
+import { internal_set, set, source } from './reactivity/sources.js';
 import { destroy_derived, execute_derived, update_derived } from './reactivity/deriveds.js';
 import * as e from './errors.js';
 import { lifecycle_outside_component } from '../shared/errors.js';
@@ -960,11 +960,12 @@ export function invalidate_inner_signals(fn) {
 		if ((signal.f & LEGACY_DERIVED_PROP) !== 0) {
 			for (const dep of /** @type {Derived} */ (signal).deps || []) {
 				if ((dep.f & DERIVED) === 0) {
-					mutate(dep, null /* doesnt matter */);
+					// Use internal_set instead of set here and below to avoid mutation validation
+					internal_set(dep, dep.v);
 				}
 			}
 		} else {
-			mutate(signal, null /* doesnt matter */);
+			internal_set(signal, signal.v);
 		}
 	}
 }
diff --git a/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/Comp.svelte b/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/Comp.svelte
new file mode 100644
index 000000000000..c3092997481b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/Comp.svelte
@@ -0,0 +1,12 @@
+<script>
+
+	let { children } = $props()
+
+	const snippetProps = $derived.by(() => ({
+		id: '123',
+		name: 'my-select'
+	}))
+
+</script>
+
+{@render children({ props: snippetProps })}
diff --git a/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/_config.js b/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/_config.js
new file mode 100644
index 000000000000..e52264c793c7
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: '<select id="123" name="my-select"><option>A</option><option>B</option><option>C</option></select>'
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/main.svelte b/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/main.svelte
new file mode 100644
index 000000000000..5900ddc84645
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/binding-interop-derived/main.svelte
@@ -0,0 +1,19 @@
+<svelte:options runes={false} />
+
+<script>
+	import { writable } from 'svelte/store'
+	import Comp from './Comp.svelte'
+
+	const myStore = writable('')
+
+</script>
+
+<Comp>
+	{#snippet children({ props })}
+			<select {...props} bind:value={$myStore} >
+				<option>A</option>
+				<option>B</option>
+				<option>C</option>
+			</select>
+	{/snippet}
+</Comp>

From ef8bd6adeb238f2d8ccc8c04547e9e16cb932c25 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 12 Dec 2024 12:16:51 -0500
Subject: [PATCH 48/62] fix: better handle hydration of script/style elements
 (alternative) (#14683)

* alternative approach to #14624

* changeset

* fix

* lint
---
 .changeset/rotten-yaks-nail.md                        |  5 +++++
 .../src/internal/client/dom/blocks/svelte-element.js  |  6 ++++++
 packages/svelte/src/internal/server/index.js          |  9 +++------
 packages/svelte/src/utils.js                          |  8 ++++++++
 .../svelte/tests/hydration/samples/script/_config.js  | 11 +++++++++++
 .../tests/hydration/samples/script/_expected.html     |  1 +
 .../svelte/tests/hydration/samples/script/main.svelte |  1 +
 7 files changed, 35 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/rotten-yaks-nail.md
 create mode 100644 packages/svelte/tests/hydration/samples/script/_config.js
 create mode 100644 packages/svelte/tests/hydration/samples/script/_expected.html
 create mode 100644 packages/svelte/tests/hydration/samples/script/main.svelte

diff --git a/.changeset/rotten-yaks-nail.md b/.changeset/rotten-yaks-nail.md
new file mode 100644
index 000000000000..bbe9b777ae81
--- /dev/null
+++ b/.changeset/rotten-yaks-nail.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: better handle hydration of script/style elements
diff --git a/packages/svelte/src/internal/client/dom/blocks/svelte-element.js b/packages/svelte/src/internal/client/dom/blocks/svelte-element.js
index 823b9a436253..35d2f223aed5 100644
--- a/packages/svelte/src/internal/client/dom/blocks/svelte-element.js
+++ b/packages/svelte/src/internal/client/dom/blocks/svelte-element.js
@@ -21,6 +21,7 @@ import { component_context, active_effect } from '../../runtime.js';
 import { DEV } from 'esm-env';
 import { EFFECT_TRANSPARENT } from '../../constants.js';
 import { assign_nodes } from '../template.js';
+import { is_raw_text_element } from '../../../../utils.js';
 
 /**
  * @param {Comment | Element} node
@@ -116,6 +117,11 @@ export function element(node, get_tag, is_svg, render_fn, get_namespace, locatio
 				assign_nodes(element, element);
 
 				if (render_fn) {
+					if (hydrating && is_raw_text_element(next_tag)) {
+						// prevent hydration glitches
+						element.append(document.createComment(''));
+					}
+
 					// If hydrating, use the existing ssr comment as the anchor so that the
 					// inner open and close methods can pick up the existing nodes correctly
 					var child_anchor = /** @type {TemplateNode} */ (
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index b944c602b884..b8371b7e008f 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -16,7 +16,7 @@ import { DEV } from 'esm-env';
 import { current_component, pop, push } from './context.js';
 import { EMPTY_COMMENT, BLOCK_CLOSE, BLOCK_OPEN } from './hydration.js';
 import { validate_store } from '../shared/validate.js';
-import { is_boolean_attribute, is_void } from '../../utils.js';
+import { is_boolean_attribute, is_raw_text_element, is_void } from '../../utils.js';
 import { reset_elements } from './dev.js';
 
 // https://html.spec.whatwg.org/multipage/syntax.html#attributes-2
@@ -24,9 +24,6 @@ import { reset_elements } from './dev.js';
 const INVALID_ATTR_NAME_CHAR_REGEX =
 	/[\s'">/=\u{FDD0}-\u{FDEF}\u{FFFE}\u{FFFF}\u{1FFFE}\u{1FFFF}\u{2FFFE}\u{2FFFF}\u{3FFFE}\u{3FFFF}\u{4FFFE}\u{4FFFF}\u{5FFFE}\u{5FFFF}\u{6FFFE}\u{6FFFF}\u{7FFFE}\u{7FFFF}\u{8FFFE}\u{8FFFF}\u{9FFFE}\u{9FFFF}\u{AFFFE}\u{AFFFF}\u{BFFFE}\u{BFFFF}\u{CFFFE}\u{CFFFF}\u{DFFFE}\u{DFFFF}\u{EFFFE}\u{EFFFF}\u{FFFFE}\u{FFFFF}\u{10FFFE}\u{10FFFF}]/u;
 
-/** List of elements that require raw contents and should not have SSR comments put in them */
-const RAW_TEXT_ELEMENTS = ['textarea', 'script', 'style', 'title'];
-
 /**
  * @param {Payload} to_copy
  * @returns {Payload}
@@ -64,13 +61,13 @@ export function element(payload, tag, attributes_fn = noop, children_fn = noop)
 	payload.out += '<!---->';
 
 	if (tag) {
-		payload.out += `<${tag} `;
+		payload.out += `<${tag}`;
 		attributes_fn();
 		payload.out += `>`;
 
 		if (!is_void(tag)) {
 			children_fn();
-			if (!RAW_TEXT_ELEMENTS.includes(tag)) {
+			if (!is_raw_text_element(tag)) {
 				payload.out += EMPTY_COMMENT;
 			}
 			payload.out += `</${tag}>`;
diff --git a/packages/svelte/src/utils.js b/packages/svelte/src/utils.js
index 75171c17865a..932440800795 100644
--- a/packages/svelte/src/utils.js
+++ b/packages/svelte/src/utils.js
@@ -441,3 +441,11 @@ const RUNES = /** @type {const} */ ([
 export function is_rune(name) {
 	return RUNES.includes(/** @type {RUNES[number]} */ (name));
 }
+
+/** List of elements that require raw contents and should not have SSR comments put in them */
+const RAW_TEXT_ELEMENTS = /** @type {const} */ (['textarea', 'script', 'style', 'title']);
+
+/** @param {string} name */
+export function is_raw_text_element(name) {
+	return RAW_TEXT_ELEMENTS.includes(/** @type {RAW_TEXT_ELEMENTS[number]} */ (name));
+}
diff --git a/packages/svelte/tests/hydration/samples/script/_config.js b/packages/svelte/tests/hydration/samples/script/_config.js
new file mode 100644
index 000000000000..4723e4e454bc
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/script/_config.js
@@ -0,0 +1,11 @@
+import { test } from '../../test';
+
+export default test({
+	snapshot(target) {
+		const script = target.querySelector('script');
+
+		return {
+			script
+		};
+	}
+});
diff --git a/packages/svelte/tests/hydration/samples/script/_expected.html b/packages/svelte/tests/hydration/samples/script/_expected.html
new file mode 100644
index 000000000000..b3a4d922196b
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/script/_expected.html
@@ -0,0 +1 @@
+<!--[--><!----><script>{}<!----></script><!----><!--]-->
diff --git a/packages/svelte/tests/hydration/samples/script/main.svelte b/packages/svelte/tests/hydration/samples/script/main.svelte
new file mode 100644
index 000000000000..3904d47f730f
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/script/main.svelte
@@ -0,0 +1 @@
+<svelte:element this={"script"}>{"{}"}</svelte:element>

From 432db95358b3a8ad5a81e7958109b024ff2f4a8e Mon Sep 17 00:00:00 2001
From: James Glenn <47917431+JR-G@users.noreply.github.com>
Date: Thu, 12 Dec 2024 19:19:13 +0000
Subject: [PATCH 49/62] docs: Update the linked playgrounds in the snippet docs
 (#14676)

* Update the linked playgrounds in the snippet docs

* Apply suggestions from code review

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>
---
 documentation/docs/03-template-syntax/06-snippet.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/documentation/docs/03-template-syntax/06-snippet.md b/documentation/docs/03-template-syntax/06-snippet.md
index f8148f3dc30b..c9951d3f3414 100644
--- a/documentation/docs/03-template-syntax/06-snippet.md
+++ b/documentation/docs/03-template-syntax/06-snippet.md
@@ -112,7 +112,7 @@ Snippets can reference themselves and each other ([demo](/playground/untitled#H4
 
 ## Passing snippets to components
 
-Within the template, snippets are values just like any other. As such, they can be passed to components as props ([demo](/playground/untitled#H4sIAAAAAAAAE41SwY6bMBD9lRGplKQlYRMpF5ZF7T_0ttmDwSZYJbZrT9pGlv-9g4Fkk-xhxYV5vHlvhjc-aWQnXJK_-kSxo0jy5IcxSZrg2fSF-yM6FFQ7fbJ1jxSuttJguVd7lEejLcJPVnUCGquPMF9nsVoPjfNnohGx1sohMU4SHbzAa4_t0UNvmcOcGUNDzFP4jeccdikYK2v6sIWQ3lErpui5cDdPF_LmkVy3wlp5Vd5e2U_rHYSe_kYjFtl1KeVnTkljBEIrGBd2sYy8AtsyLlBk9DYhJHtTR_UbBDWybkR8NkqHWyOr_y74ZMNLz9f9AoG6ePkOJLMHLBp-xISvcPf11r0YUuMM2Ysfkgngh5XphUYKkJWU_FFz2UjBkxztSYT0cihR4LOn0tGaPrql439N-7Uh0Dl8MVYbt1jeJ1Fg7xDb_Uw2Y18YQqZ_S2U5FH1pS__dCkWMa3C0uR0pfQRTg89kE4bLLLDS_Dxy_Eywuo1TAnPAw4fqY1rvtH3W9w35ZZMgvU3jq8LhedwkguCHRhT_cMU6eVA5dKLB5wGutCWjlTOslupAxxrxceKoD2hzhe2qbmXHF1v1bbOcNCtW_zpYfVI8h5kQ4qY3mueHTlesW2C7TOEO4hcdwzgf3Nc7cZxUKKC4yuNhvIX_MlV_Xk0EAAA=)):
+Within the template, snippets are values just like any other. As such, they can be passed to components as props ([demo](/playground/untitled#H4sIAAAAAAAAE3VS247aMBD9lZGpBGwDASRegonaPvQL2qdlH5zYEKvBNvbQLbL875VzAcKyj3PmzJnLGU8UOwqSkd8KJdaCk4TsZS0cyV49wYuJuQiQpGd-N2bu_ooaI1YwJ57hpVYoFDqSEepKKw3mO7VDeTTaIvxiRS1gb_URxvO0ibrS8WanIrHUyiHs7Vmigy28RmyHHmKvDMbMmFq4cQInvGSwTsBYWYoMVhCSB2rBFFPsyl0uruTlR3JZCWvlTXl1Yy_mawiR_rbZKZrellJ-5JQ0RiBUgnFhJ9OGR7HKmwVoilXeIye8DOJGfYCgRlZ3iE876TBsZPX7hPdteO75PC4QaIo8vwNPePmANQ2fMeEFHrLD7rR1jTNkW986E8C3KwfwVr8HSHOSEBT_kGRozyIkn_zQveXDL3rIfPJHtUDwzShJd_Qk3gQCbOGLsdq4yfTRJopRuin3I7nv6kL7ARRjmLdBDG3uv1mhuLA3V2mKtqNEf_oCn8p9aN-WYqH5peP4kWBl1UwJzAEPT9U7K--0fRrrWnPTXpCm1_EVdXjpNmlA8G1hPPyM1fKgMqjFHjctXGjLhZ05w0qpDhksGrybuNEHtJnCalZWsuaTlfq6nPaaBSv_HKw-K57BjzOiVj9ZKQYKzQjZodYFqydYTRN4gPhVzTDO2xnma3HsVWjaLjT8nbfwHy7Q5f2dBAAA)):
 
 ```svelte
 <script>
@@ -144,7 +144,7 @@ Within the template, snippets are values just like any other. As such, they can
 
 Think about it like passing content instead of data to a component. The concept is similar to slots in web components.
 
-As an authoring convenience, snippets declared directly _inside_ a component implicitly become props _on_ the component ([demo](/playground/untitled#H4sIAAAAAAAAE41Sy27bMBD8lYVcwHYrW4kBXxRFaP-htzgHSqQsojLJkuu2BqF_74qUrfhxCHQRh7MzO9z1SSM74ZL8zSeKHUSSJz-MSdIET2Y4uD-iQ0Fnp4-2HpDC1VYaLHdqh_JgtEX4yapOQGP1AebrLJzWsXD-QjQi1lo5JMZRooNXeBuwHXoYLHOYM2OoiXkKv_GUwzYFY2VNFxvo0xtqxRR9F-7z04X8fE-uW2GtnJQ3E_tpvYV-oL9Ti0U2hVJFjMMZslcfW-5DWj9zShojEFrBuLCLZR_9CmzLQCwy-psw8rxBgvkNhhpZd8F8NppE7Stbq_8u-GTKS8_XQ9Keqnl5BZP1AzTYP2bDV7i7_9hLEeda0iocNJeNFDzJ0R5Fn142JzA-uzsdBfLhldPxPdMhIPS0H1-M1cYtlnejwdBDfBXZjHXTFOg4BhuOtvTfrVDEmAZG2ew5ezYV-Ew2fVzVAivNTyPHzwSr29AlMAe8f6g-zuWDts-GusAmdBSkv3P7qnB4GpMEEHwsRPEPV6yTe5VDJxp8iXClLRmtnGG1VHva3oCPHQd9QJsrbFd1Kzu-2Khvz8uzZsXqX3urj4rnMBNCXNUG83zf6Yp1C2yXKdxA_KJjGOfRfb0Vh7MKDShEuV-M9_4_nq6svF4EAAA=)):
+As an authoring convenience, snippets declared directly _inside_ a component implicitly become props _on_ the component ([demo](/playground/untitled#H4sIAAAAAAAAE3VSTa_aMBD8Kyu_SkAbCA-JSzBR20N_QXt6vIMTO8SqsY29tI2s_PcqTiB8vaPHs7MzuxuIZgdBMvJLo0QlOElIJZXwJHsLBBvb_XUASc7Mb9Yu_B-hsMMK5sUzvDQahUZPMkJ96aTFfKd3KA_WOISfrFACKmcOMFmk8TWUTjY73RFLoz1C5U4SPWzhrcN2GKDrlcGEWauEnyRwxCaDdQLWyVJksII2uaMWTDPNLtzX5YX8-kgua-GcHJVXI3u5WEPb0d83O03TMZSmfRzOkG1Db7mNacOL19JagVALxoWbztq-H8U6j0SaYp2P2BGbOyQ2v8PQIFMXLKRDk177pq0zf6d8bMrzwBdd0pamyPMb-IjNEzS2f86Gz_Dwf-2F9nvNSUJQ_EOSoTuJNvngqK5v4Pas7n4-OCwlEEJcQTIMO-nSQwtb-GSdsX46e9gbRoP9yGQ11I0rEuycunu6PHx1QnPhxm3SFN15MOlYEFJZtf0dUywMbwZOeBGsrKNLYB54-1R9WNqVdki7usim6VmQphf7mnpshiQRhNAXdoOfMyX3OgMlKtz0cGEcF27uLSul3mewjPjgOOoDukxjPS9rqfh0pb-8zs6aBSt_7505aZ7B9xOi0T9YKW4UooVsr0zB1BTrWQJ3EL-oWcZ572GxFoezCk37QLe3897-B2i2U62uBAAA)):
 
 ```svelte
 <!-- this is semantically the same as the above -->
@@ -165,7 +165,7 @@ As an authoring convenience, snippets declared directly _inside_ a component imp
 </Table>
 ```
 
-Any content inside the component tags that is _not_ a snippet declaration implicitly becomes part of the `children` snippet ([demo](/playground/untitled#H4sIAAAAAAAAE41S247aMBD9lVFYCegGsiDxks1G7T_0bdkHJ3aI1cR27aEtsvzvtZ0LZeGhiiJ5js-cmTMemzS8YybJ320iSM-SPPmmVJImeFEhML9Yh8zHRp51HZDC1JorLI_iiLxXUiN8J1XHoNGyh-U2i9F2SFy-epon1lIY9IwzRwNv8B6wI1oIJXNYEqV8E8sUfuIlh0MKSvPaX-zBpZ-oFRH-m7m7l5m8uyfXLdOaX5X3V_bL9gAu0D98i0V2NSWKwQ4lSN7s0LKLbgtsyxgXmT9NiBe-iaP-DYISSTcj4bcLI7hSDEHL3yu6dkPfBdLS0m1o3nk-LW9gX-gBGss9ZsMXuLu32VjZBdfRaelft5eUN5zRJEd9Zi6dlyEy_ncdOm_IxsGlULe8o5qJNFgE5x_9SWmpzGp9N2-MXQxz4c2cOQ-lZWQyF0Jd2q_-mjI9U1fr4FBPE8iuKTbjjRt2sMBK0svIsQtG6jb2CsQAdQ_1x9f5R9tmIS-yPToK-tNkQRQGL6ObCIIdEpH9wQ3p-Enk0LEGXwe4ktoX2hhFai5Ofi0jPnYc9QF1LrDdRK-rvXjerSfNitQ_TlqeBc1hwRi7yY3F81MnK9KtsF2n8Amis44ilA7VtwfWTyr-kaKV-_X4cH8BTOhfRzcEAAA=)):
+Any content inside the component tags that is _not_ a snippet declaration implicitly becomes part of the `children` snippet ([demo](/playground/untitled#H4sIAAAAAAAAE3WOQQrCMBBFrzIMggql3ddY1Du4si5sOmIwnYRkFKX07lKqglqX8_7_w2uRDw1hjlsWI5ZqTPBoLEXMdy3K3fdZDzB5Ndfep_FKVnpWHSKNce1YiCVijirqYLwUJQOYxrsgsLmIOIZjcA1M02w4n-PpomSVvTclqyEutDX6DA2pZ7_ABIVugrmEC3XJH92P55_G39GodCmWBFrQJ2PrQAwdLGHig_NxNv9xrQa1dhWIawrv1Wzeqawa8953D-8QOmaEAQAA)):
 
 ```svelte
 <!--- file: App.svelte --->

From 5e8d6edcf8d4f7fc04257bbe1258f34f680c0d1e Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 12 Dec 2024 20:19:39 +0100
Subject: [PATCH 50/62] fix: make `defaultValue` work with spread (#14640)

* fix: make `defaultValue` work with spread

* chore: apply suggestions from review

* tweak

* only stash defaults when relevant

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/silent-tips-cover.md               |   5 +
 .../client/dom/elements/attributes.js         |  29 +-
 .../form-default-value-spread/_config.js      | 263 ++++++++++++++++++
 .../form-default-value-spread/main.svelte     | 199 +++++++++++++
 .../samples/form-default-value/_config.js     |   2 -
 5 files changed, 493 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/silent-tips-cover.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/form-default-value-spread/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/form-default-value-spread/main.svelte

diff --git a/.changeset/silent-tips-cover.md b/.changeset/silent-tips-cover.md
new file mode 100644
index 000000000000..1f51572cda24
--- /dev/null
+++ b/.changeset/silent-tips-cover.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: make `defaultValue` work with spread
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 8f6588e94aa1..9c62d684c183 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -358,16 +358,39 @@ export function set_attributes(
 		} else if (key === '__value' || (key === 'value' && value != null)) {
 			// @ts-ignore
 			element.value = element[key] = element.__value = value;
+		} else if (key === 'selected' && is_option_element) {
+			set_selected(/** @type {HTMLOptionElement} */ (element), value);
 		} else {
 			var name = key;
 			if (!preserve_attribute_case) {
 				name = normalize_attribute(name);
 			}
 
-			if (value == null && !is_custom_element) {
+			var is_default = name === 'defaultValue' || name === 'defaultChecked';
+
+			if (value == null && !is_custom_element && !is_default) {
 				attributes[key] = null;
-				element.removeAttribute(key);
-			} else if (setters.includes(name) && (is_custom_element || typeof value !== 'string')) {
+
+				if (name === 'value' || name === 'checked') {
+					// removing value/checked also removes defaultValue/defaultChecked — preserve
+					let input = /** @type {HTMLInputElement} */ (element);
+
+					if (name === 'value') {
+						let prev = input.defaultValue;
+						input.removeAttribute(name);
+						input.defaultValue = prev;
+					} else {
+						let prev = input.defaultChecked;
+						input.removeAttribute(name);
+						input.defaultChecked = prev;
+					}
+				} else {
+					element.removeAttribute(key);
+				}
+			} else if (
+				is_default ||
+				(setters.includes(name) && (is_custom_element || typeof value !== 'string'))
+			) {
 				// @ts-ignore
 				element[name] = value;
 			} else if (typeof value !== 'function') {
diff --git a/packages/svelte/tests/runtime-runes/samples/form-default-value-spread/_config.js b/packages/svelte/tests/runtime-runes/samples/form-default-value-spread/_config.js
new file mode 100644
index 000000000000..26e90e431b54
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/form-default-value-spread/_config.js
@@ -0,0 +1,263 @@
+import { test } from '../../test';
+import { flushSync } from 'svelte';
+
+export default test({
+	async test({ assert, target }) {
+		/**
+		 * @param {NodeListOf<any>} inputs
+		 * @param {string} field
+		 * @param {any | any[]} value
+		 */
+		function check_inputs(inputs, field, value) {
+			for (let i = 0; i < inputs.length; i++) {
+				assert.equal(inputs[i][field], Array.isArray(value) ? value[i] : value, `field ${i}`);
+			}
+		}
+
+		/**
+		 * @param {any} input
+		 * @param {string} field
+		 * @param {any} value
+		 */
+		function set_input(input, field, value) {
+			input[field] = value;
+			input.dispatchEvent(
+				new Event(typeof value === 'boolean' ? 'change' : 'input', { bubbles: true })
+			);
+		}
+
+		/**
+		 * @param {HTMLOptionElement} option
+		 */
+		function select_option(option) {
+			option.selected = true;
+			option.dispatchEvent(new Event('change', { bubbles: true }));
+		}
+
+		const after_reset = [];
+
+		const reset = /** @type {HTMLInputElement} */ (target.querySelector('input[type=reset]'));
+		const [test1, test2, test3, test4, test5, test6, test7, test14] =
+			target.querySelectorAll('div');
+		const [test8, test9, test10, test11] = target.querySelectorAll('select');
+		const [
+			test1_span,
+			test2_span,
+			test3_span,
+			test4_span,
+			test5_span,
+			test6_span,
+			test7_span,
+			test8_span,
+			test9_span,
+			test10_span,
+			test11_span
+		] = target.querySelectorAll('span');
+
+		{
+			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
+			const inputs = test1.querySelectorAll('input, textarea');
+			check_inputs(inputs, 'value', 'x');
+			assert.htmlEqual(test1_span.innerHTML, 'x x x x');
+
+			for (const input of inputs) {
+				set_input(input, 'value', 'foo');
+			}
+			flushSync();
+			check_inputs(inputs, 'value', 'foo');
+			assert.htmlEqual(test1_span.innerHTML, 'foo foo foo foo');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'value', 'x');
+				assert.htmlEqual(test1_span.innerHTML, 'x x x x');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
+			const inputs = test2.querySelectorAll('input, textarea');
+			check_inputs(inputs, 'value', 'x');
+			assert.htmlEqual(test2_span.innerHTML, 'x x x x');
+
+			for (const input of inputs) {
+				set_input(input, 'value', 'foo');
+			}
+			flushSync();
+			check_inputs(inputs, 'value', 'foo');
+			assert.htmlEqual(test2_span.innerHTML, 'foo foo foo foo');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'value', 'x');
+				assert.htmlEqual(test2_span.innerHTML, 'x x x x');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
+			const inputs = test3.querySelectorAll('input, textarea');
+			check_inputs(inputs, 'value', 'y');
+			assert.htmlEqual(test3_span.innerHTML, 'y y y y');
+
+			for (const input of inputs) {
+				set_input(input, 'value', 'foo');
+			}
+			flushSync();
+			check_inputs(inputs, 'value', 'foo');
+			assert.htmlEqual(test3_span.innerHTML, 'foo foo foo foo');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'value', 'x');
+				assert.htmlEqual(test3_span.innerHTML, 'x x x x');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement>} */
+			const inputs = test4.querySelectorAll('input');
+			check_inputs(inputs, 'checked', true);
+			assert.htmlEqual(test4_span.innerHTML, 'true true');
+
+			for (const input of inputs) {
+				set_input(input, 'checked', false);
+			}
+			flushSync();
+			check_inputs(inputs, 'checked', false);
+			assert.htmlEqual(test4_span.innerHTML, 'false false');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'checked', true);
+				assert.htmlEqual(test4_span.innerHTML, 'true true');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement>} */
+			const inputs = test5.querySelectorAll('input');
+			check_inputs(inputs, 'checked', true);
+			assert.htmlEqual(test5_span.innerHTML, 'true true');
+
+			for (const input of inputs) {
+				set_input(input, 'checked', false);
+			}
+			flushSync();
+			check_inputs(inputs, 'checked', false);
+			assert.htmlEqual(test5_span.innerHTML, 'false false');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'checked', true);
+				assert.htmlEqual(test5_span.innerHTML, 'true true');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement>} */
+			const inputs = test6.querySelectorAll('input');
+			check_inputs(inputs, 'checked', false);
+			assert.htmlEqual(test6_span.innerHTML, 'false false');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'checked', true);
+				assert.htmlEqual(test6_span.innerHTML, 'true true');
+			});
+		}
+		{
+			/** @type {NodeListOf<HTMLInputElement>} */
+			const inputs = test7.querySelectorAll('input');
+			check_inputs(inputs, 'checked', true);
+			assert.htmlEqual(test7_span.innerHTML, 'true');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'checked', false);
+				assert.htmlEqual(test7_span.innerHTML, 'false');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLOptionElement>} */
+			const options = test8.querySelectorAll('option');
+			check_inputs(options, 'selected', [false, true, false]);
+			assert.htmlEqual(test8_span.innerHTML, 'b');
+
+			select_option(options[2]);
+			flushSync();
+			check_inputs(options, 'selected', [false, false, true]);
+			assert.htmlEqual(test8_span.innerHTML, 'c');
+
+			after_reset.push(() => {
+				check_inputs(options, 'selected', [false, true, false]);
+				assert.htmlEqual(test8_span.innerHTML, 'b');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLOptionElement>} */
+			const options = test9.querySelectorAll('option');
+			check_inputs(options, 'selected', [false, true, false]);
+			assert.htmlEqual(test9_span.innerHTML, 'b');
+
+			select_option(options[2]);
+			flushSync();
+			check_inputs(options, 'selected', [false, false, true]);
+			assert.htmlEqual(test9_span.innerHTML, 'c');
+
+			after_reset.push(() => {
+				check_inputs(options, 'selected', [false, true, false]);
+				assert.htmlEqual(test9_span.innerHTML, 'b');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLOptionElement>} */
+			const options = test10.querySelectorAll('option');
+			check_inputs(options, 'selected', [false, false, true]);
+			assert.htmlEqual(test10_span.innerHTML, 'c');
+
+			select_option(options[0]);
+			flushSync();
+			check_inputs(options, 'selected', [true, false, false]);
+			assert.htmlEqual(test10_span.innerHTML, 'a');
+
+			after_reset.push(() => {
+				check_inputs(options, 'selected', [false, true, false]);
+				assert.htmlEqual(test10_span.innerHTML, 'b');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLOptionElement>} */
+			const options = test11.querySelectorAll('option');
+			check_inputs(options, 'selected', [false, false, true]);
+			assert.htmlEqual(test11_span.innerHTML, 'c');
+
+			select_option(options[0]);
+			flushSync();
+			check_inputs(options, 'selected', [true, false, false]);
+			assert.htmlEqual(test11_span.innerHTML, 'a');
+
+			after_reset.push(() => {
+				check_inputs(options, 'selected', [false, true, false]);
+				assert.htmlEqual(test11_span.innerHTML, 'b');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
+			const inputs = test14.querySelectorAll('input, textarea');
+			assert.equal(inputs[0].value, 'x');
+			assert.equal(/** @type {HTMLInputElement} */ (inputs[1]).checked, true);
+			// this is still missing...i have no idea how to fix this lol
+			// assert.equal(inputs[2].value, 'x');
+
+			after_reset.push(() => {
+				assert.equal(inputs[0].value, 'y');
+				assert.equal(/** @type {HTMLInputElement} */ (inputs[1]).checked, false);
+				assert.equal(inputs[2].value, 'y');
+			});
+		}
+
+		reset.click();
+		await Promise.resolve();
+		flushSync();
+		after_reset.forEach((fn) => fn());
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/form-default-value-spread/main.svelte b/packages/svelte/tests/runtime-runes/samples/form-default-value-spread/main.svelte
new file mode 100644
index 000000000000..3fc7ef11a5e9
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/form-default-value-spread/main.svelte
@@ -0,0 +1,199 @@
+<script>
+	let spread = {};
+
+	let value1 = $state();
+	let value2 = $state();
+	let value3 = $state();
+	let value4 = $state();
+	let value5 = $state();
+	let value6 = $state();
+	let value7 = $state();
+	let value8 = $state();
+	let value9 = $state(null);
+	let value10 = $state(null);
+	let value11 = $state(null);
+	let value12 = $state(null);
+	let value13 = $state(null);
+	let value14 = $state(null);
+	let value15 = $state(null);
+	let value16 = $state(null);
+	let value17 = $state('y');
+	let value18 = $state('y');
+	let value19 = $state('y');
+	let value20 = $state('y');
+	let value21 = $state('y');
+	let value22 = $state('y');
+	let value23 = $state('y');
+	let value24 = $state('y');
+
+	let checked1 = $state();
+	let checked2 = $state();
+	let checked3 = $state();
+	let checked4 = $state();
+	let checked5 = $state(null);
+	let checked6 = $state(null);
+	let checked7 = $state(null);
+	let checked8 = $state(null);
+	let checked9 = $state(false);
+	let checked10 = $state(false);
+	let checked11 = $state(false);
+	let checked12 = $state(false);
+	let checked13 = $state(true);
+	let checked14 = $state(true);
+ 
+
+	let selected1 = $state();
+	let selected2 = $state();
+	let selected3 = $state('c');
+	let selected4 = $state('c');
+	let selected5 = $state(['c']);
+	let selected6 = $state(['c']);
+
+	let defaultValue = $state('x');
+	let defaultChecked = $state(true);
+</script>
+
+<form>
+	<p>Input/Textarea value</p>
+	<!-- defaultValue=x, value=undefined -->
+	<div class="test-1">
+		<input {defaultValue} bind:value={value1} {...spread} />
+		<input {defaultValue} value={value2} {...spread} />
+		<input defaultValue="x" bind:value={value3} {...spread} />
+		<input defaultValue="x" value={value4} {...spread} />
+		<textarea {defaultValue} value={value5} {...spread}></textarea>
+		<textarea {defaultValue} bind:value={value6} {...spread}></textarea>
+		<textarea defaultValue="x" value={value7} {...spread}></textarea>
+		<textarea defaultValue="x" bind:value={value8} {...spread}></textarea>
+	</div>
+
+	<!-- defaultValue=x, value=null -->
+	<div class="test-2">
+		<input {defaultValue} bind:value={value9} {...spread} />
+		<input {defaultValue} value={value10} {...spread} />
+		<input defaultValue="x" value={value11} {...spread} />
+		<input defaultValue="x" bind:value={value12} {...spread} />
+		<textarea {defaultValue} value={value13} {...spread}></textarea>
+		<textarea {defaultValue} bind:value={value14} {...spread}></textarea>
+		<textarea defaultValue="x" value={value15} {...spread}></textarea>
+		<textarea defaultValue="x" bind:value={value16} {...spread}></textarea>
+	</div>
+
+	<!-- defaultValue=x, value=y -->
+	<div class="test-3">
+		<input {defaultValue} bind:value={value17} {...spread} />
+		<input {defaultValue} value={value18} {...spread} />
+		<input defaultValue="x" value={value19} {...spread} />
+		<input defaultValue="x" bind:value={value20} {...spread} />
+		<textarea {defaultValue} value={value21} {...spread}></textarea>
+		<textarea {defaultValue} bind:value={value22} {...spread}></textarea>
+		<textarea defaultValue="x" value={value23} {...spread}></textarea>
+		<textarea defaultValue="x" bind:value={value24} {...spread}></textarea>
+	</div>
+
+	<p>Input checked</p>
+	<!-- defaultChecked=true, checked=undefined -->
+	<div class="test-4">
+		<input type="checkbox" {defaultChecked} checked={checked1} {...spread} />
+		<input type="checkbox" {defaultChecked} bind:checked={checked2} {...spread} />
+		<input type="checkbox" defaultChecked checked={checked3} {...spread} />
+		<input type="checkbox" defaultChecked bind:checked={checked4} {...spread} />
+	</div>
+
+	<!-- defaultChecked=true, checked=null -->
+	<div class="test-5">
+		<input type="checkbox" {defaultChecked} checked={checked5} {...spread} />
+		<input type="checkbox" {defaultChecked} bind:checked={checked6} {...spread} />
+		<input type="checkbox" defaultChecked checked={checked7} {...spread} />
+		<input type="checkbox" defaultChecked bind:checked={checked8} {...spread} />
+	</div>
+
+	<!-- defaultChecked=true, checked=false -->
+	<div class="test-6">
+		<input type="checkbox" {defaultChecked} checked={checked9} {...spread} />
+		<input type="checkbox" {defaultChecked} bind:checked={checked10} {...spread} />
+		<input type="checkbox" defaultChecked checked={checked11} {...spread} />
+		<input type="checkbox" defaultChecked bind:checked={checked12} {...spread} />
+	</div>
+
+	<!-- defaultChecked=false, checked=true -->
+	<div class="test-7">
+		<input type="checkbox" defaultChecked={false} checked={checked13} {...spread} />
+		<input type="checkbox" defaultChecked={false} bind:checked={checked14} {...spread} />
+	</div>
+
+	<!-- no support for bind:group; too complex + we may deprecate it in favor of bind:checked={get,set} -->
+
+	<p>Select (single)</p>
+	<!-- select with static checked, value=undefined-->
+	<select bind:value={selected1}>
+		<option value="a">A</option>
+		<option value="b" selected {...spread}>B</option>
+		<option value="c">C</option>
+	</select>
+
+	<!-- select with dynamic checked, value=undefined-->
+	<select bind:value={selected2}>
+		<option value="a">A</option>
+		<option value="b" selected={defaultChecked}>B</option>
+		<option value="c">C</option>
+	</select>
+
+	<!-- select with static checked, value=something else than default-->
+	<select bind:value={selected3}>
+		<option value="a">A</option>
+		<option value="b" selected {...spread}>B</option>
+		<option value="c">C</option>
+	</select>
+
+	<!-- select with dynamic checked, value=something else than default-->
+	<select bind:value={selected4}>
+		<option value="a">A</option>
+		<option value="b" selected={defaultChecked}>B</option>
+		<option value="c">C</option>
+	</select>
+
+	<p>Select (multiple)</p>
+    <!-- There's no possibility to have the selected attribute influence a multi select initially,
+	     because we require the value to be an array -->
+
+	<!-- select with static checked, value=something else than default-->
+	<select multiple bind:value={selected5}>
+		<option value="a">A</option>
+		<option value="b" selected {...spread}>B</option>
+		<option value="c">C</option>
+	</select>
+
+	<!-- select with dynamic checked, value=something else than default-->
+	<select multiple bind:value={selected6}>
+		<option value="a">A</option>
+		<option value="b" selected={defaultChecked}>B</option>
+		<option value="c">C</option>
+	</select>
+
+	<p>Static values</p>
+	<div class="test-14">
+		<input value="x" defaultValue="y" {...spread} />
+		<input type="checkbox" checked defaultChecked={false} {...spread} />
+		<textarea defaultValue="y" {...spread}>x</textarea>
+	</div>
+
+	<input type="reset" value="Reset" />
+</form>
+
+<p>
+	Bound values:
+	<span class="test-1">{value1} {value3} {value6} {value8}</span>
+	<span class="test-2">{value9} {value12} {value14} {value16}</span>
+	<span class="test-3">{value17} {value20} {value22} {value24}</span>
+	<span class="test-4">{checked2} {checked4}</span>
+	<span class="test-5">{checked6} {checked8}</span>
+	<span class="test-6">{checked10} {checked12}</span>
+	<span class="test-7">{checked14}</span>
+	<span class="test-8">{selected1}</span>
+	<span class="test-9">{selected2}</span>
+	<span class="test-10">{selected3}</span>
+	<span class="test-11">{selected4}</span>
+	<span class="test-12">{selected5}</span>
+	<span class="test-13">{selected6}</span>
+</p>
diff --git a/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js b/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
index 5ef72aaa8ec2..35ab6e8ece44 100644
--- a/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
@@ -68,7 +68,6 @@ export default test({
 			assert.htmlEqual(test1_span.innerHTML, 'foo foo foo foo');
 
 			after_reset.push(() => {
-				console.log('-------------');
 				check_inputs(inputs, 'value', 'x');
 				assert.htmlEqual(test1_span.innerHTML, 'x x x x');
 			});
@@ -88,7 +87,6 @@ export default test({
 			assert.htmlEqual(test2_span.innerHTML, 'foo foo foo foo');
 
 			after_reset.push(() => {
-				console.log('-------------');
 				check_inputs(inputs, 'value', 'x');
 				assert.htmlEqual(test2_span.innerHTML, 'x x x x');
 			});

From 65db40986035e0d20b8e1da8e4006e16d2c12971 Mon Sep 17 00:00:00 2001
From: waedi <martinw@gmx.ch>
Date: Thu, 12 Dec 2024 20:22:06 +0100
Subject: [PATCH 51/62] docs: typo in ## script_context_deprecated (#14694)

* Fix typo in ## script_context_deprecated

Changed +++context+++ to +++module+++

* regenerate

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 documentation/docs/98-reference/.generated/compile-warnings.md | 2 +-
 packages/svelte/messages/compile-warnings/template.md          | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md
index 88b1f278a679..f6f2585df23d 100644
--- a/documentation/docs/98-reference/.generated/compile-warnings.md
+++ b/documentation/docs/98-reference/.generated/compile-warnings.md
@@ -775,7 +775,7 @@ Reassignments of module-level declarations will not cause reactive statements to
 ```
 
 ```svelte
-<script ---context="module"--- +++context+++>
+<script ---context="module"--- +++module+++>
 	let foo = 'bar';
 </script>
 ```
diff --git a/packages/svelte/messages/compile-warnings/template.md b/packages/svelte/messages/compile-warnings/template.md
index b15b01241b8c..33e635bdb2c7 100644
--- a/packages/svelte/messages/compile-warnings/template.md
+++ b/packages/svelte/messages/compile-warnings/template.md
@@ -57,7 +57,7 @@ This code will work when the component is rendered on the client (which is why t
 > `context="module"` is deprecated, use the `module` attribute instead
 
 ```svelte
-<script ---context="module"--- +++context+++>
+<script ---context="module"--- +++module+++>
 	let foo = 'bar';
 </script>
 ```

From 88c2d6ea36f1b9bd6d1f52788c4e5a258c30868b Mon Sep 17 00:00:00 2001
From: Yang Pan <77009679+panyang05@users.noreply.github.com>
Date: Thu, 12 Dec 2024 14:43:01 -0500
Subject: [PATCH 52/62] fix: Allow unquoted slash in attributes (#14615)

* test: add sample for unquoted attributes

* fix: handle unquoted slash in attributes

* docs: allow unquoted slash in attributes

* test: add additional sample for unquoted href attributes

* fix: improve handling of self-closing tags with unquoted attributes

* Update .changeset/long-boxes-flow.md

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>
---
 .changeset/long-boxes-flow.md                 |  5 ++
 .../compiler/phases/1-parse/state/element.js  | 20 ++++-
 .../samples/attribute-unquoted/input.svelte   |  4 +-
 .../samples/attribute-unquoted/output.json    | 80 ++++++++++++++++++-
 4 files changed, 105 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/long-boxes-flow.md

diff --git a/.changeset/long-boxes-flow.md b/.changeset/long-boxes-flow.md
new file mode 100644
index 000000000000..d249354b6769
--- /dev/null
+++ b/.changeset/long-boxes-flow.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: allow unquoted slash in attributes
diff --git a/packages/svelte/src/compiler/phases/1-parse/state/element.js b/packages/svelte/src/compiler/phases/1-parse/state/element.js
index 45350bb1aec5..cd5cdd3e6e2c 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/element.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/element.js
@@ -504,8 +504,24 @@ function read_attribute(parser) {
 	let value = true;
 	if (parser.eat('=')) {
 		parser.allow_whitespace();
-		value = read_attribute_value(parser);
-		end = parser.index;
+
+		if (parser.template[parser.index] === '/' && parser.template[parser.index + 1] === '>') {
+			const char_start = parser.index;
+			parser.index++; // consume '/'
+			value = [
+				{
+					start: char_start,
+					end: char_start + 1,
+					type: 'Text',
+					raw: '/',
+					data: '/'
+				}
+			];
+			end = parser.index;
+		} else {
+			value = read_attribute_value(parser);
+			end = parser.index;
+		}
 	} else if (parser.match_regex(regex_starts_with_quote_characters)) {
 		e.expected_token(parser.index, '=');
 	}
diff --git a/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/input.svelte b/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/input.svelte
index 4bab0df72f3e..527d6eebf104 100644
--- a/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/input.svelte
+++ b/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/input.svelte
@@ -1 +1,3 @@
-<div class=foo></div>
\ No newline at end of file
+<div class=foo></div>
+<a href=/>home</a>
+<a href=/foo>home</a>
\ No newline at end of file
diff --git a/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/output.json b/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/output.json
index 5df4d66ab668..ab2912a2c019 100644
--- a/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/output.json
+++ b/packages/svelte/tests/parser-legacy/samples/attribute-unquoted/output.json
@@ -2,7 +2,7 @@
 	"html": {
 		"type": "Fragment",
 		"start": 0,
-		"end": 21,
+		"end": 62,
 		"children": [
 			{
 				"type": "Element",
@@ -27,6 +27,84 @@
 					}
 				],
 				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 21,
+				"end": 22,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "Element",
+				"start": 22,
+				"end": 40,
+				"name": "a",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 25,
+						"end": 31,
+						"name": "href",
+						"value": [
+							{
+								"start": 30,
+								"end": 31,
+								"type": "Text",
+								"raw": "/",
+								"data": "/"
+							}
+						]
+					}
+				],
+				"children": [
+					{
+						"type": "Text",
+						"start": 32,
+						"end": 36,
+						"raw": "home",
+						"data": "home"
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 40,
+				"end": 41,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "Element",
+				"start": 41,
+				"end": 62,
+				"name": "a",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 44,
+						"end": 53,
+						"name": "href",
+						"value": [
+							{
+								"start": 49,
+								"end": 53,
+								"type": "Text",
+								"raw": "/foo",
+								"data": "/foo"
+							}
+						]
+					}
+				],
+				"children": [
+					{
+						"type": "Text",
+						"start": 54,
+						"end": 58,
+						"raw": "home",
+						"data": "home"
+					}
+				]
 			}
 		]
 	}

From 780041a51e1425167c30875dd54d906028128eff Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 12 Dec 2024 14:55:51 -0500
Subject: [PATCH 53/62] Version Packages (#14689)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/long-boxes-flow.md       |  5 -----
 .changeset/rotten-yaks-nail.md      |  5 -----
 .changeset/silent-tips-cover.md     |  5 -----
 .changeset/strong-pandas-provide.md |  5 -----
 packages/svelte/CHANGELOG.md        | 12 ++++++++++++
 packages/svelte/package.json        |  2 +-
 packages/svelte/src/version.js      |  2 +-
 7 files changed, 14 insertions(+), 22 deletions(-)
 delete mode 100644 .changeset/long-boxes-flow.md
 delete mode 100644 .changeset/rotten-yaks-nail.md
 delete mode 100644 .changeset/silent-tips-cover.md
 delete mode 100644 .changeset/strong-pandas-provide.md

diff --git a/.changeset/long-boxes-flow.md b/.changeset/long-boxes-flow.md
deleted file mode 100644
index d249354b6769..000000000000
--- a/.changeset/long-boxes-flow.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: allow unquoted slash in attributes
diff --git a/.changeset/rotten-yaks-nail.md b/.changeset/rotten-yaks-nail.md
deleted file mode 100644
index bbe9b777ae81..000000000000
--- a/.changeset/rotten-yaks-nail.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: better handle hydration of script/style elements
diff --git a/.changeset/silent-tips-cover.md b/.changeset/silent-tips-cover.md
deleted file mode 100644
index 1f51572cda24..000000000000
--- a/.changeset/silent-tips-cover.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: make `defaultValue` work with spread
diff --git a/.changeset/strong-pandas-provide.md b/.changeset/strong-pandas-provide.md
deleted file mode 100644
index 0fe7e70c6d6a..000000000000
--- a/.changeset/strong-pandas-provide.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: avoid mutation validation for invalidate_inner_signals
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 978e841bf83b..6f3380ff5a72 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.11.3
+
+### Patch Changes
+
+- fix: allow unquoted slash in attributes ([#14615](https://github.com/sveltejs/svelte/pull/14615))
+
+- fix: better handle hydration of script/style elements ([#14683](https://github.com/sveltejs/svelte/pull/14683))
+
+- fix: make `defaultValue` work with spread ([#14640](https://github.com/sveltejs/svelte/pull/14640))
+
+- fix: avoid mutation validation for invalidate_inner_signals ([#14688](https://github.com/sveltejs/svelte/pull/14688))
+
 ## 5.11.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index e95341a0bdef..abcda8613de9 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.11.2",
+  "version": "5.11.3",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index e264eace2c12..39d89acd5316 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.11.2';
+export const VERSION = '5.11.3';
 export const PUBLIC_VERSION = '5';

From 2e0dcd78722d457f4c9e4b6db4ef4cb3ab26c037 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 12 Dec 2024 20:09:29 +0000
Subject: [PATCH 54/62] fix: ensure if block paths retain correct template
 namespacing (#14685)

* fix: ensure if block paths retain correct template namespacing

* add tests

* address feedback

* address feedback

* simplify

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/giant-moons-accept.md              |  5 +++++
 .../src/compiler/phases/3-transform/utils.js  | 19 ++++++++++++++++++-
 .../svg-namespace-if-block/Child.svelte       |  8 ++++++++
 .../samples/svg-namespace-if-block/_config.js | 14 ++++++++++++++
 .../svg-namespace-if-block/main.svelte        |  7 +++++++
 5 files changed, 52 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/giant-moons-accept.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/main.svelte

diff --git a/.changeset/giant-moons-accept.md b/.changeset/giant-moons-accept.md
new file mode 100644
index 000000000000..7940371d6fbb
--- /dev/null
+++ b/.changeset/giant-moons-accept.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure if block paths retain correct template namespacing
diff --git a/packages/svelte/src/compiler/phases/3-transform/utils.js b/packages/svelte/src/compiler/phases/3-transform/utils.js
index 14fd3aa2e849..ffd07dd26a4c 100644
--- a/packages/svelte/src/compiler/phases/3-transform/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/utils.js
@@ -347,7 +347,24 @@ export function infer_namespace(namespace, parent, nodes) {
 		}
 	}
 
-	return namespace;
+	/** @type {Namespace | null} */
+	let new_namespace = null;
+
+	// Check the elements within the fragment and look for consistent namespaces.
+	// If we have no namespaces or they are mixed, then fallback to existing namespace
+	for (const node of nodes) {
+		if (node.type !== 'RegularElement') continue;
+
+		if (node.metadata.mathml) {
+			new_namespace = new_namespace === null || new_namespace === 'mathml' ? 'mathml' : 'html';
+		} else if (node.metadata.svg) {
+			new_namespace = new_namespace === null || new_namespace === 'svg' ? 'svg' : 'html';
+		} else {
+			return 'html';
+		}
+	}
+
+	return new_namespace ?? namespace;
 }
 
 /**
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/Child.svelte b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/Child.svelte
new file mode 100644
index 000000000000..53e6203ddef6
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/Child.svelte
@@ -0,0 +1,8 @@
+
+{#if true}
+	<g>
+		<rect x="20" y="10" width="50" height="50" fill="yellow"/>
+	</g>
+{:else}
+	<div>lol</div>
+{/if}
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/_config.js b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/_config.js
new file mode 100644
index 000000000000..22a2469bfb2b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/_config.js
@@ -0,0 +1,14 @@
+import { test, ok } from '../../test';
+
+export default test({
+	html: `<svg height="200px" viewBox="0 0 100 100" width="200px"><g><rect fill="yellow" height="50" width="50" x="20" y="10"></rect></g></svg>`,
+	test({ assert, target }) {
+		const g = target.querySelector('g');
+		const rect = target.querySelector('rect');
+		ok(g);
+		ok(rect);
+
+		assert.equal(g.namespaceURI, 'http://www.w3.org/2000/svg');
+		assert.equal(rect.namespaceURI, 'http://www.w3.org/2000/svg');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/main.svelte b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/main.svelte
new file mode 100644
index 000000000000..8f6154462fa1
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	import Child from "./Child.svelte";
+</script>
+
+<svg viewBox="0 0 100 100" width="200px" height="200px">
+	<Child />
+</svg>

From 61a0da8a5fdf5ac86431ceadfae0f54d38dc9a66 Mon Sep 17 00:00:00 2001
From: Mateusz Kadlubowski <xeho91@pm.me>
Date: Fri, 13 Dec 2024 04:15:40 +0800
Subject: [PATCH 55/62] feat: Expose more AST types from `"svelte/compiler"`
 (#14601)

* add missing `SvelteBoundary` in `ElementLike`

* make union of AST types public and exportable with `AST` namespace

* apply AST types change to codebase

* changeset

* manually generate types

* Add `AttributeLike` type

* export namespace `Css` inside `AST`

* manually generate types again

* exported `Css` -> `CSS`

* `Css` -> `AST.CSS`

* fix Prettier issue

* Apply suggestions from code review

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>
---
 .changeset/short-papayas-relate.md            |   5 +
 packages/svelte/src/compiler/legacy.js        |   6 +-
 packages/svelte/src/compiler/migrate/index.js |  10 +-
 .../src/compiler/phases/1-parse/index.js      |   4 +-
 .../compiler/phases/1-parse/read/script.js    |   4 +-
 .../src/compiler/phases/1-parse/read/style.js |  40 +++----
 .../compiler/phases/1-parse/state/element.js  |  18 +--
 .../phases/2-analyze/css/css-analyze.js       |  18 +--
 .../phases/2-analyze/css/css-prune.js         |  58 +++++-----
 .../compiler/phases/2-analyze/css/css-warn.js |   8 +-
 .../compiler/phases/2-analyze/css/utils.js    |  14 +--
 .../src/compiler/phases/2-analyze/index.js    |   8 +-
 .../src/compiler/phases/2-analyze/types.d.ts  |   8 +-
 .../visitors/AssignmentExpression.js          |   1 -
 .../phases/2-analyze/visitors/Attribute.js    |   4 +-
 .../2-analyze/visitors/CallExpression.js      |   4 +-
 .../2-analyze/visitors/LabeledStatement.js    |   4 +-
 .../phases/2-analyze/visitors/SnippetBlock.js |   4 +-
 .../phases/2-analyze/visitors/shared/a11y.js  |   6 +-
 .../2-analyze/visitors/shared/attribute.js    |   4 +-
 .../2-analyze/visitors/shared/fragment.js     |   4 +-
 .../3-transform/client/transform-client.js    |  10 +-
 .../phases/3-transform/client/types.d.ts      |  10 +-
 .../phases/3-transform/client/utils.js        |   4 +-
 .../client/visitors/BindDirective.js          |   6 +-
 .../client/visitors/shared/component.js       |   4 +-
 .../client/visitors/shared/events.js          |   4 +-
 .../client/visitors/shared/fragment.js        |   6 +-
 .../client/visitors/shared/utils.js           |   6 +-
 .../compiler/phases/3-transform/css/index.js  |  24 ++--
 .../3-transform/server/transform-server.js    |  10 +-
 .../phases/3-transform/server/types.d.ts      |  10 +-
 .../server/visitors/AssignmentExpression.js   |   4 +-
 .../server/visitors/shared/component.js       |   4 +-
 .../server/visitors/shared/element.js         |   4 +-
 .../server/visitors/shared/utils.js           |   4 +-
 .../compiler/phases/3-transform/types.d.ts    |   4 +-
 .../src/compiler/phases/3-transform/utils.js  |  20 ++--
 packages/svelte/src/compiler/phases/css.js    |   4 +-
 packages/svelte/src/compiler/phases/nodes.js  |   4 +-
 packages/svelte/src/compiler/phases/scope.js  |  26 ++---
 .../svelte/src/compiler/phases/types.d.ts     |   8 +-
 packages/svelte/src/compiler/state.js         |   8 +-
 packages/svelte/src/compiler/types/css.d.ts   |   2 +-
 packages/svelte/src/compiler/types/index.d.ts |   6 +-
 .../src/compiler/types/legacy-nodes.d.ts      |   4 +-
 .../svelte/src/compiler/types/template.d.ts   | 101 ++++++++--------
 packages/svelte/src/compiler/utils/ast.js     |   4 +-
 packages/svelte/src/compiler/utils/slot.js    |   4 +-
 packages/svelte/types/index.d.ts              | 109 +++++++++++-------
 50 files changed, 343 insertions(+), 303 deletions(-)
 create mode 100644 .changeset/short-papayas-relate.md

diff --git a/.changeset/short-papayas-relate.md b/.changeset/short-papayas-relate.md
new file mode 100644
index 000000000000..430c507a0cfc
--- /dev/null
+++ b/.changeset/short-papayas-relate.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: expose more AST types from `"svelte/compiler"`
diff --git a/packages/svelte/src/compiler/legacy.js b/packages/svelte/src/compiler/legacy.js
index 2d90988936a8..e3f88c8f1d23 100644
--- a/packages/svelte/src/compiler/legacy.js
+++ b/packages/svelte/src/compiler/legacy.js
@@ -1,5 +1,5 @@
 /** @import { Expression } from 'estree' */
-/** @import { AST, SvelteNode, TemplateNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import * as Legacy from './types/legacy-nodes.js' */
 import { walk } from 'zimmerframe';
 import {
@@ -11,7 +11,7 @@ import { extract_svelte_ignore } from './utils/extract_svelte_ignore.js';
 
 /**
  * Some of the legacy Svelte AST nodes remove whitespace from the start and end of their children.
- * @param {TemplateNode[]} nodes
+ * @param {AST.TemplateNode[]} nodes
  */
 function remove_surrounding_whitespace_nodes(nodes) {
 	const first = nodes.at(0);
@@ -40,7 +40,7 @@ function remove_surrounding_whitespace_nodes(nodes) {
  * @returns {Legacy.LegacyRoot}
  */
 export function convert(source, ast) {
-	const root = /** @type {SvelteNode | Legacy.LegacySvelteNode} */ (ast);
+	const root = /** @type {AST.SvelteNode | Legacy.LegacySvelteNode} */ (ast);
 
 	return /** @type {Legacy.LegacyRoot} */ (
 		walk(root, null, {
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 88f9bbf0eed6..1bb7a69a20f9 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -2,7 +2,7 @@
 /** @import { Visitors } from 'zimmerframe' */
 /** @import { ComponentAnalysis } from '../phases/types.js' */
 /** @import { Scope, ScopeRoot } from '../phases/scope.js' */
-/** @import { AST, Binding, SvelteNode, ValidatedCompileOptions } from '#compiler' */
+/** @import { AST, Binding, ValidatedCompileOptions } from '#compiler' */
 import MagicString from 'magic-string';
 import { walk } from 'zimmerframe';
 import { parse } from '../phases/1-parse/index.js';
@@ -479,7 +479,7 @@ export function migrate(source, { filename, use_ts } = {}) {
  * }} State
  */
 
-/** @type {Visitors<SvelteNode, State>} */
+/** @type {Visitors<AST.SvelteNode, State>} */
 const instance_script = {
 	_(node, { state, next }) {
 		// @ts-expect-error
@@ -1050,7 +1050,7 @@ function trim_block(state, start, end) {
 	}
 }
 
-/** @type {Visitors<SvelteNode, State>} */
+/** @type {Visitors<AST.SvelteNode, State>} */
 const template = {
 	Identifier(node, { state, path }) {
 		handle_identifier(node, state, path);
@@ -1410,7 +1410,7 @@ const template = {
 
 /**
  * @param {AST.RegularElement | AST.SvelteElement | AST.SvelteComponent | AST.Component | AST.SlotElement | AST.SvelteFragment} node
- * @param {SvelteNode[]} path
+ * @param {AST.SvelteNode[]} path
  * @param {State} state
  */
 function migrate_slot_usage(node, path, state) {
@@ -1580,7 +1580,7 @@ function migrate_slot_usage(node, path, state) {
 /**
  * @param {VariableDeclarator} declarator
  * @param {State} state
- * @param {SvelteNode[]} path
+ * @param {AST.SvelteNode[]} path
  */
 function extract_type_and_comment(declarator, state, path) {
 	const str = state.str;
diff --git a/packages/svelte/src/compiler/phases/1-parse/index.js b/packages/svelte/src/compiler/phases/1-parse/index.js
index 7639c2f0eda8..c3a8a098d319 100644
--- a/packages/svelte/src/compiler/phases/1-parse/index.js
+++ b/packages/svelte/src/compiler/phases/1-parse/index.js
@@ -1,4 +1,4 @@
-/** @import { AST, TemplateNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 // @ts-expect-error acorn type definitions are borked in the release we use
 import { isIdentifierStart, isIdentifierChar } from 'acorn';
 import fragment from './state/fragment.js';
@@ -28,7 +28,7 @@ export class Parser {
 	/** Whether we're parsing in TypeScript mode */
 	ts = false;
 
-	/** @type {TemplateNode[]} */
+	/** @type {AST.TemplateNode[]} */
 	stack = [];
 
 	/** @type {AST.Fragment[]} */
diff --git a/packages/svelte/src/compiler/phases/1-parse/read/script.js b/packages/svelte/src/compiler/phases/1-parse/read/script.js
index 87367aff0805..9d9ed3a1efdf 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/script.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/script.js
@@ -1,5 +1,5 @@
 /** @import { Program } from 'estree' */
-/** @import { AST, Directive } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Parser } from '../index.js' */
 import * as acorn from '../acorn.js';
 import { regex_not_newline_characters } from '../../patterns.js';
@@ -16,7 +16,7 @@ const ALLOWED_ATTRIBUTES = ['context', 'generics', 'lang', 'module'];
 /**
  * @param {Parser} parser
  * @param {number} start
- * @param {Array<AST.Attribute | AST.SpreadAttribute | Directive>} attributes
+ * @param {Array<AST.Attribute | AST.SpreadAttribute | AST.Directive>} attributes
  * @returns {AST.Script}
  */
 export function read_script(parser, start, attributes) {
diff --git a/packages/svelte/src/compiler/phases/1-parse/read/style.js b/packages/svelte/src/compiler/phases/1-parse/read/style.js
index aa835a1d96fe..29e8a0e54143 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/style.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/style.js
@@ -1,4 +1,4 @@
-/** @import { AST, Css, Directive } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Parser } from '../index.js' */
 import * as e from '../../../errors.js';
 
@@ -18,8 +18,8 @@ const REGEX_HTML_COMMENT_CLOSE = /-->/;
 /**
  * @param {Parser} parser
  * @param {number} start
- * @param {Array<AST.Attribute | AST.SpreadAttribute | Directive>} attributes
- * @returns {Css.StyleSheet}
+ * @param {Array<AST.Attribute | AST.SpreadAttribute | AST.Directive>} attributes
+ * @returns {AST.CSS.StyleSheet}
  */
 export default function read_style(parser, start, attributes) {
 	const content_start = parser.index;
@@ -49,7 +49,7 @@ export default function read_style(parser, start, attributes) {
  * @returns {any[]}
  */
 function read_body(parser, close) {
-	/** @type {Array<Css.Rule | Css.Atrule>} */
+	/** @type {Array<AST.CSS.Rule | AST.CSS.Atrule>} */
 	const children = [];
 
 	while (parser.index < parser.template.length) {
@@ -71,7 +71,7 @@ function read_body(parser, close) {
 
 /**
  * @param {Parser} parser
- * @returns {Css.Atrule}
+ * @returns {AST.CSS.Atrule}
  */
 function read_at_rule(parser) {
 	const start = parser.index;
@@ -81,7 +81,7 @@ function read_at_rule(parser) {
 
 	const prelude = read_value(parser);
 
-	/** @type {Css.Block | null} */
+	/** @type {AST.CSS.Block | null} */
 	let block = null;
 
 	if (parser.match('{')) {
@@ -104,7 +104,7 @@ function read_at_rule(parser) {
 
 /**
  * @param {Parser} parser
- * @returns {Css.Rule}
+ * @returns {AST.CSS.Rule}
  */
 function read_rule(parser) {
 	const start = parser.index;
@@ -126,10 +126,10 @@ function read_rule(parser) {
 /**
  * @param {Parser} parser
  * @param {boolean} [inside_pseudo_class]
- * @returns {Css.SelectorList}
+ * @returns {AST.CSS.SelectorList}
  */
 function read_selector_list(parser, inside_pseudo_class = false) {
-	/** @type {Css.ComplexSelector[]} */
+	/** @type {AST.CSS.ComplexSelector[]} */
 	const children = [];
 
 	allow_comment_or_whitespace(parser);
@@ -162,18 +162,18 @@ function read_selector_list(parser, inside_pseudo_class = false) {
 /**
  * @param {Parser} parser
  * @param {boolean} [inside_pseudo_class]
- * @returns {Css.ComplexSelector}
+ * @returns {AST.CSS.ComplexSelector}
  */
 function read_selector(parser, inside_pseudo_class = false) {
 	const list_start = parser.index;
 
-	/** @type {Css.RelativeSelector[]} */
+	/** @type {AST.CSS.RelativeSelector[]} */
 	const children = [];
 
 	/**
-	 * @param {Css.Combinator | null} combinator
+	 * @param {AST.CSS.Combinator | null} combinator
 	 * @param {number} start
-	 * @returns {Css.RelativeSelector}
+	 * @returns {AST.CSS.RelativeSelector}
 	 */
 	function create_selector(combinator, start) {
 		return {
@@ -190,7 +190,7 @@ function read_selector(parser, inside_pseudo_class = false) {
 		};
 	}
 
-	/** @type {Css.RelativeSelector} */
+	/** @type {AST.CSS.RelativeSelector} */
 	let relative_selector = create_selector(null, parser.index);
 
 	while (parser.index < parser.template.length) {
@@ -247,7 +247,7 @@ function read_selector(parser, inside_pseudo_class = false) {
 		} else if (parser.eat(':')) {
 			const name = read_identifier(parser);
 
-			/** @type {null | Css.SelectorList} */
+			/** @type {null | AST.CSS.SelectorList} */
 			let args = null;
 
 			if (parser.eat('(')) {
@@ -372,7 +372,7 @@ function read_selector(parser, inside_pseudo_class = false) {
 
 /**
  * @param {Parser} parser
- * @returns {Css.Combinator | null}
+ * @returns {AST.CSS.Combinator | null}
  */
 function read_combinator(parser) {
 	const start = parser.index;
@@ -407,14 +407,14 @@ function read_combinator(parser) {
 
 /**
  * @param {Parser} parser
- * @returns {Css.Block}
+ * @returns {AST.CSS.Block}
  */
 function read_block(parser) {
 	const start = parser.index;
 
 	parser.eat('{', true);
 
-	/** @type {Array<Css.Declaration | Css.Rule | Css.Atrule>} */
+	/** @type {Array<AST.CSS.Declaration | AST.CSS.Rule | AST.CSS.Atrule>} */
 	const children = [];
 
 	while (parser.index < parser.template.length) {
@@ -441,7 +441,7 @@ function read_block(parser) {
  * Reads a declaration, rule or at-rule
  *
  * @param {Parser} parser
- * @returns {Css.Declaration | Css.Rule | Css.Atrule}
+ * @returns {AST.CSS.Declaration | AST.CSS.Rule | AST.CSS.Atrule}
  */
 function read_block_item(parser) {
 	if (parser.match('@')) {
@@ -460,7 +460,7 @@ function read_block_item(parser) {
 
 /**
  * @param {Parser} parser
- * @returns {Css.Declaration}
+ * @returns {AST.CSS.Declaration}
  */
 function read_declaration(parser) {
 	const start = parser.index;
diff --git a/packages/svelte/src/compiler/phases/1-parse/state/element.js b/packages/svelte/src/compiler/phases/1-parse/state/element.js
index cd5cdd3e6e2c..2b6a88f7bd73 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/element.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/element.js
@@ -1,5 +1,5 @@
 /** @import { Expression } from 'estree' */
-/** @import { AST, Directive, ElementLike, TemplateNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Parser } from '../index.js' */
 import { is_void } from '../../../../utils.js';
 import read_expression from '../read/expression.js';
@@ -28,7 +28,7 @@ export const regex_valid_component_name =
 	// (must start with uppercase letter if no dots, can contain dots)
 	/^(?:\p{Lu}[$\u200c\u200d\p{ID_Continue}.]*|\p{ID_Start}[$\u200c\u200d\p{ID_Continue}]*(?:\.[$\u200c\u200d\p{ID_Continue}]+)+)$/u;
 
-/** @type {Map<string, ElementLike['type']>} */
+/** @type {Map<string, AST.ElementLike['type']>} */
 const root_only_meta_tags = new Map([
 	['svelte:head', 'SvelteHead'],
 	['svelte:options', 'SvelteOptions'],
@@ -37,7 +37,7 @@ const root_only_meta_tags = new Map([
 	['svelte:body', 'SvelteBody']
 ]);
 
-/** @type {Map<string, ElementLike['type']>} */
+/** @type {Map<string, AST.ElementLike['type']>} */
 const meta_tags = new Map([
 	...root_only_meta_tags,
 	['svelte:element', 'SvelteElement'],
@@ -137,7 +137,7 @@ export default function element(parser) {
 					? 'SlotElement'
 					: 'RegularElement';
 
-	/** @type {ElementLike} */
+	/** @type {AST.ElementLike} */
 	const element =
 		type === 'RegularElement'
 			? {
@@ -155,7 +155,7 @@ export default function element(parser) {
 						path: []
 					}
 				}
-			: /** @type {ElementLike} */ ({
+			: /** @type {AST.ElementLike} */ ({
 					type,
 					start,
 					end: -1,
@@ -358,7 +358,7 @@ export default function element(parser) {
 	}
 }
 
-/** @param {TemplateNode[]} stack */
+/** @param {AST.TemplateNode[]} stack */
 function parent_is_head(stack) {
 	let i = stack.length;
 	while (i--) {
@@ -369,7 +369,7 @@ function parent_is_head(stack) {
 	return false;
 }
 
-/** @param {TemplateNode[]} stack */
+/** @param {AST.TemplateNode[]} stack */
 function parent_is_shadowroot_template(stack) {
 	// https://developer.chrome.com/docs/css-ui/declarative-shadow-dom#building_a_declarative_shadow_root
 	let i = stack.length;
@@ -433,7 +433,7 @@ function read_static_attribute(parser) {
 
 /**
  * @param {Parser} parser
- * @returns {AST.Attribute | AST.SpreadAttribute | Directive | null}
+ * @returns {AST.Attribute | AST.SpreadAttribute | AST.Directive | null}
  */
 function read_attribute(parser) {
 	const start = parser.index;
@@ -564,7 +564,7 @@ function read_attribute(parser) {
 			}
 		}
 
-		/** @type {Directive} */
+		/** @type {AST.Directive} */
 		const directive = {
 			start,
 			end,
diff --git a/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js b/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js
index 1dd2d9ae7c36..b8c88a102394 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/css-analyze.js
@@ -1,5 +1,5 @@
 /** @import { ComponentAnalysis } from '../../types.js' */
-/** @import { Css } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Visitors } from 'zimmerframe' */
 import { walk } from 'zimmerframe';
 import * as e from '../../../errors.js';
@@ -8,17 +8,17 @@ import { is_global, is_unscoped_pseudo_class } from './utils.js';
 
 /**
  * @typedef {Visitors<
- *   Css.Node,
+ *   AST.CSS.Node,
  *   {
  *     keyframes: string[];
- *     rule: Css.Rule | null;
+ *     rule: AST.CSS.Rule | null;
  *   }
  * >} CssVisitors
  */
 
 /**
  * True if is `:global`
- * @param {Css.SimpleSelector} simple_selector
+ * @param {AST.CSS.SimpleSelector} simple_selector
  */
 function is_global_block_selector(simple_selector) {
 	return (
@@ -112,7 +112,7 @@ const css_visitors = {
 		}
 	},
 	RelativeSelector(node, context) {
-		const parent = /** @type {Css.ComplexSelector} */ (context.path.at(-1));
+		const parent = /** @type {AST.CSS.ComplexSelector} */ (context.path.at(-1));
 
 		if (
 			node.combinator != null &&
@@ -149,7 +149,7 @@ const css_visitors = {
 		if (node.metadata.is_global_like || node.metadata.is_global) {
 			// So that nested selectors like `:root:not(.x)` are not marked as unused
 			for (const child of node.selectors) {
-				walk(/** @type {Css.Node} */ (child), null, {
+				walk(/** @type {AST.CSS.Node} */ (child), null, {
 					ComplexSelector(node, context) {
 						node.metadata.used = true;
 						context.next();
@@ -177,7 +177,7 @@ const css_visitors = {
 				if (idx !== -1) {
 					is_global_block = true;
 					for (let i = idx + 1; i < child.selectors.length; i++) {
-						walk(/** @type {Css.Node} */ (child.selectors[i]), null, {
+						walk(/** @type {AST.CSS.Node} */ (child.selectors[i]), null, {
 							ComplexSelector(node) {
 								node.metadata.used = true;
 							}
@@ -240,7 +240,7 @@ const css_visitors = {
 		});
 	},
 	NestingSelector(node, context) {
-		const rule = /** @type {Css.Rule} */ (context.state.rule);
+		const rule = /** @type {AST.CSS.Rule} */ (context.state.rule);
 		const parent_rule = rule.metadata.parent_rule;
 
 		if (!parent_rule) {
@@ -271,7 +271,7 @@ const css_visitors = {
 };
 
 /**
- * @param {Css.StyleSheet} stylesheet
+ * @param {AST.CSS.StyleSheet} stylesheet
  * @param {ComponentAnalysis} analysis
  */
 export function analyze_css(stylesheet, analysis) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/css/css-prune.js b/packages/svelte/src/compiler/phases/2-analyze/css/css-prune.js
index d017b215f2af..35bc675166ae 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/css-prune.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/css-prune.js
@@ -14,7 +14,7 @@ const whitelist_attribute_selector = new Map([
 	['dialog', ['open']]
 ]);
 
-/** @type {Compiler.Css.Combinator} */
+/** @type {Compiler.AST.CSS.Combinator} */
 const descendant_combinator = {
 	type: 'Combinator',
 	name: ' ',
@@ -22,7 +22,7 @@ const descendant_combinator = {
 	end: -1
 };
 
-/** @type {Compiler.Css.RelativeSelector} */
+/** @type {Compiler.AST.CSS.RelativeSelector} */
 const nesting_selector = {
 	type: 'RelativeSelector',
 	start: -1,
@@ -51,11 +51,11 @@ const seen = new Set();
 
 /**
  *
- * @param {Compiler.Css.StyleSheet} stylesheet
+ * @param {Compiler.AST.CSS.StyleSheet} stylesheet
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
  */
 export function prune(stylesheet, element) {
-	walk(/** @type {Compiler.Css.Node} */ (stylesheet), null, {
+	walk(/** @type {Compiler.AST.CSS.Node} */ (stylesheet), null, {
 		Rule(node, context) {
 			if (node.metadata.is_global_block) {
 				context.visit(node.prelude);
@@ -69,7 +69,11 @@ export function prune(stylesheet, element) {
 			seen.clear();
 
 			if (
-				apply_selector(selectors, /** @type {Compiler.Css.Rule} */ (node.metadata.rule), element)
+				apply_selector(
+					selectors,
+					/** @type {Compiler.AST.CSS.Rule} */ (node.metadata.rule),
+					element
+				)
 			) {
 				node.metadata.used = true;
 			}
@@ -86,7 +90,7 @@ export function prune(stylesheet, element) {
  * Also searches them for any existing `&` selectors and adds one if none are found.
  * This ensures we traverse up to the parent rule when the inner selectors match and we're
  * trying to see if the parent rule also matches.
- * @param {Compiler.Css.ComplexSelector} node
+ * @param {Compiler.AST.CSS.ComplexSelector} node
  */
 function get_relative_selectors(node) {
 	const selectors = truncate(node);
@@ -124,7 +128,7 @@ function get_relative_selectors(node) {
 
 /**
  * Discard trailing `:global(...)` selectors, these are unused for scoping purposes
- * @param {Compiler.Css.ComplexSelector} node
+ * @param {Compiler.AST.CSS.ComplexSelector} node
  */
 function truncate(node) {
 	const i = node.children.findLastIndex(({ metadata, selectors }) => {
@@ -152,8 +156,8 @@ function truncate(node) {
 }
 
 /**
- * @param {Compiler.Css.RelativeSelector[]} relative_selectors
- * @param {Compiler.Css.Rule} rule
+ * @param {Compiler.AST.CSS.RelativeSelector[]} relative_selectors
+ * @param {Compiler.AST.CSS.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
  * @returns {boolean}
  */
@@ -178,9 +182,9 @@ function apply_selector(relative_selectors, rule, element) {
 }
 
 /**
- * @param {Compiler.Css.RelativeSelector} relative_selector
- * @param {Compiler.Css.RelativeSelector[]} parent_selectors
- * @param {Compiler.Css.Rule} rule
+ * @param {Compiler.AST.CSS.RelativeSelector} relative_selector
+ * @param {Compiler.AST.CSS.RelativeSelector[]} parent_selectors
+ * @param {Compiler.AST.CSS.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.RenderTag | Compiler.AST.Component | Compiler.AST.SvelteComponent | Compiler.AST.SvelteSelf} node
  * @returns {boolean}
  */
@@ -263,8 +267,8 @@ function apply_combinator(relative_selector, parent_selectors, rule, node) {
  * it's a `:global(...)` or unscopeable selector, or
  * is an `:is(...)` or `:where(...)` selector that contains
  * a global selector
- * @param {Compiler.Css.RelativeSelector} selector
- * @param {Compiler.Css.Rule} rule
+ * @param {Compiler.AST.CSS.RelativeSelector} selector
+ * @param {Compiler.AST.CSS.Rule} rule
  */
 function is_global(selector, rule) {
 	if (selector.metadata.is_global || selector.metadata.is_global_like) {
@@ -272,7 +276,7 @@ function is_global(selector, rule) {
 	}
 
 	for (const s of selector.selectors) {
-		/** @type {Compiler.Css.SelectorList | null} */
+		/** @type {Compiler.AST.CSS.SelectorList | null} */
 		let selector_list = null;
 		let owner = rule;
 
@@ -283,7 +287,7 @@ function is_global(selector, rule) {
 		}
 
 		if (s.type === 'NestingSelector') {
-			owner = /** @type {Compiler.Css.Rule} */ (rule.metadata.parent_rule);
+			owner = /** @type {Compiler.AST.CSS.Rule} */ (rule.metadata.parent_rule);
 			selector_list = owner.prelude;
 		}
 
@@ -306,8 +310,8 @@ const regex_backslash_and_following_character = /\\(.)/g;
 /**
  * Ensure that `element` satisfies each simple selector in `relative_selector`
  *
- * @param {Compiler.Css.RelativeSelector} relative_selector
- * @param {Compiler.Css.Rule} rule
+ * @param {Compiler.AST.CSS.RelativeSelector} relative_selector
+ * @param {Compiler.AST.CSS.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
  * @returns {boolean}
  */
@@ -352,7 +356,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element)
 		const seen = new Set();
 
 		/**
-		 * @param {Compiler.SvelteNode} node
+		 * @param {Compiler.AST.SvelteNode} node
 		 * @param {{ is_child: boolean }} state
 		 */
 		function walk_children(node, state) {
@@ -389,7 +393,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element)
 		// upwards and back-to-front, we need to first check the selectors inside :has(...), then check the rest of the
 		// selector in a way that is similar to ancestor matching. In a sense, we're treating `.x:has(.y)` as `.x .y`.
 		for (const has_selector of has_selectors) {
-			const complex_selectors = /** @type {Compiler.Css.SelectorList} */ (has_selector.args)
+			const complex_selectors = /** @type {Compiler.AST.CSS.SelectorList} */ (has_selector.args)
 				.children;
 			let matched = false;
 
@@ -578,7 +582,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element)
 			case 'NestingSelector': {
 				let matched = false;
 
-				const parent = /** @type {Compiler.Css.Rule} */ (rule.metadata.parent_rule);
+				const parent = /** @type {Compiler.AST.CSS.Rule} */ (rule.metadata.parent_rule);
 
 				for (const complex_selector of parent.prelude.children) {
 					if (
@@ -611,9 +615,9 @@ function get_following_sibling_elements(element, include_self) {
 	const path = element.metadata.path;
 	let i = path.length;
 
-	/** @type {Compiler.SvelteNode} */
+	/** @type {Compiler.AST.SvelteNode} */
 	let start = element;
-	let nodes = /** @type {Compiler.SvelteNode[]} */ (
+	let nodes = /** @type {Compiler.AST.SvelteNode[]} */ (
 		/** @type {Compiler.AST.Fragment} */ (path[0]).nodes
 	);
 
@@ -639,7 +643,7 @@ function get_following_sibling_elements(element, include_self) {
 
 	const seen = new Set();
 
-	/** @param {Compiler.SvelteNode} node */
+	/** @param {Compiler.AST.SvelteNode} node */
 	function get_siblings(node) {
 		walk(node, null, {
 			RegularElement(node) {
@@ -836,7 +840,7 @@ function get_possible_element_siblings(node, adjacent_only, seen = new Set()) {
 	const result = new Map();
 	const path = node.metadata.path;
 
-	/** @type {Compiler.SvelteNode} */
+	/** @type {Compiler.AST.SvelteNode} */
 	let current = node;
 
 	let i = path.length;
@@ -1008,7 +1012,7 @@ function higher_existence(exist1, exist2) {
 }
 
 /**
- * @param {Compiler.SvelteNode[]} children
+ * @param {Compiler.AST.SvelteNode[]} children
  * @param {boolean} adjacent_only
  */
 function loop_child(children, adjacent_only) {
@@ -1038,7 +1042,7 @@ function loop_child(children, adjacent_only) {
 }
 
 /**
- * @param {Compiler.SvelteNode} node
+ * @param {Compiler.AST.SvelteNode} node
  * @returns {node is Compiler.AST.IfBlock | Compiler.AST.EachBlock | Compiler.AST.AwaitBlock | Compiler.AST.KeyBlock | Compiler.AST.SlotElement}
  */
 function is_block(node) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/css/css-warn.js b/packages/svelte/src/compiler/phases/2-analyze/css/css-warn.js
index eab67327e2cc..238c83f00ed1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/css-warn.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/css-warn.js
@@ -1,17 +1,17 @@
 /** @import { Visitors } from 'zimmerframe' */
-/** @import { Css } from '#compiler' */
+/** @import { AST } from '#compiler' */
 import { walk } from 'zimmerframe';
 import * as w from '../../../warnings.js';
 import { is_keyframes_node } from '../../css.js';
 
 /**
- * @param {Css.StyleSheet} stylesheet
+ * @param {AST.CSS.StyleSheet} stylesheet
  */
 export function warn_unused(stylesheet) {
 	walk(stylesheet, { stylesheet }, visitors);
 }
 
-/** @type {Visitors<Css.Node, { stylesheet: Css.StyleSheet }>} */
+/** @type {Visitors<AST.CSS.Node, { stylesheet: AST.CSS.StyleSheet }>} */
 const visitors = {
 	Atrule(node, context) {
 		if (!is_keyframes_node(node)) {
@@ -28,7 +28,7 @@ const visitors = {
 			!node.metadata.used &&
 			// prevent double-marking of `.unused:is(.unused)`
 			(context.path.at(-2)?.type !== 'PseudoClassSelector' ||
-				/** @type {Css.ComplexSelector} */ (context.path.at(-4))?.metadata.used)
+				/** @type {AST.CSS.ComplexSelector} */ (context.path.at(-4))?.metadata.used)
 		) {
 			const content = context.state.stylesheet.content;
 			const text = content.styles.substring(node.start - content.start, node.end - content.start);
diff --git a/packages/svelte/src/compiler/phases/2-analyze/css/utils.js b/packages/svelte/src/compiler/phases/2-analyze/css/utils.js
index 07171a23bb9d..d3fd71ec395b 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/utils.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/utils.js
@@ -1,4 +1,4 @@
-/** @import { AST, Css } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Node } from 'estree' */
 const UNKNOWN = {};
 
@@ -36,7 +36,7 @@ export function get_possible_values(chunk) {
 
 /**
  * Returns all parent rules; root is last
- * @param {Css.Rule | null} rule
+ * @param {AST.CSS.Rule | null} rule
  */
 export function get_parent_rules(rule) {
 	const rules = [];
@@ -51,8 +51,8 @@ export function get_parent_rules(rule) {
 
 /**
  * True if is `:global(...)` or `:global` and no pseudo class that is scoped.
- * @param {Css.RelativeSelector} relative_selector
- * @returns {relative_selector is Css.RelativeSelector & { selectors: [Css.PseudoClassSelector, ...Array<Css.PseudoClassSelector | Css.PseudoElementSelector>] }}
+ * @param {AST.CSS.RelativeSelector} relative_selector
+ * @returns {relative_selector is AST.CSS.RelativeSelector & { selectors: [AST.CSS.PseudoClassSelector, ...Array<AST.CSS.PseudoClassSelector | AST.CSS.PseudoElementSelector>] }}
  */
 export function is_global(relative_selector) {
 	const first = relative_selector.selectors[0];
@@ -72,7 +72,7 @@ export function is_global(relative_selector) {
 
 /**
  * `true` if is a pseudo class that cannot be or is not scoped
- * @param {Css.SimpleSelector} selector
+ * @param {AST.CSS.SimpleSelector} selector
  */
 export function is_unscoped_pseudo_class(selector) {
 	return (
@@ -96,8 +96,8 @@ export function is_unscoped_pseudo_class(selector) {
 /**
  * True if is `:global(...)` or `:global`, irrespective of whether or not there are any pseudo classes that are scoped.
  * Difference to `is_global`: `:global(x):has(y)` is `true` for `is_outer_global` but `false` for `is_global`.
- * @param {Css.RelativeSelector} relative_selector
- * @returns {relative_selector is Css.RelativeSelector & { selectors: [Css.PseudoClassSelector, ...Array<Css.PseudoClassSelector | Css.PseudoElementSelector>] }}
+ * @param {AST.CSS.RelativeSelector} relative_selector
+ * @returns {relative_selector is AST.CSS.RelativeSelector & { selectors: [AST.CSS.PseudoClassSelector, ...Array<AST.CSS.PseudoClassSelector | AST.CSS.PseudoElementSelector>] }}
  */
 export function is_outer_global(relative_selector) {
 	const first = relative_selector.selectors[0];
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 9e29813ee336..042e88fa2f83 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -1,5 +1,5 @@
 /** @import { Expression, Node, Program } from 'estree' */
-/** @import { Binding, AST, SvelteNode, ValidatedCompileOptions, ValidatedModuleCompileOptions } from '#compiler' */
+/** @import { Binding, AST, ValidatedCompileOptions, ValidatedModuleCompileOptions } from '#compiler' */
 /** @import { AnalysisState, Visitors } from './types' */
 /** @import { Analysis, ComponentAnalysis, Js, ReactiveStatement, Template } from '../types' */
 import { walk } from 'zimmerframe';
@@ -525,7 +525,7 @@ export function analyze_component(root, source, options) {
 
 		// more legacy nonsense: if an `each` binding is reassigned/mutated,
 		// treat the expression as being mutated as well
-		walk(/** @type {SvelteNode} */ (template.ast), null, {
+		walk(/** @type {AST.SvelteNode} */ (template.ast), null, {
 			EachBlock(node) {
 				const scope = /** @type {Scope} */ (template.scopes.get(node));
 
@@ -608,7 +608,7 @@ export function analyze_component(root, source, options) {
 				reactive_statements: new Map()
 			};
 
-			walk(/** @type {SvelteNode} */ (ast), state, visitors);
+			walk(/** @type {AST.SvelteNode} */ (ast), state, visitors);
 		}
 
 		// warn on any nonstate declarations that are a) reassigned and b) referenced in the template
@@ -677,7 +677,7 @@ export function analyze_component(root, source, options) {
 				function_depth: scope.function_depth
 			};
 
-			walk(/** @type {SvelteNode} */ (ast), state, visitors);
+			walk(/** @type {AST.SvelteNode} */ (ast), state, visitors);
 		}
 
 		for (const [name, binding] of instance.scope.declarations) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/types.d.ts b/packages/svelte/src/compiler/phases/2-analyze/types.d.ts
index dedbe95ace7e..b4ca4dc26278 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/types.d.ts
+++ b/packages/svelte/src/compiler/phases/2-analyze/types.d.ts
@@ -1,11 +1,11 @@
 import type { Scope } from '../scope.js';
 import type { ComponentAnalysis, ReactiveStatement } from '../types.js';
-import type { ExpressionMetadata, AST, ValidatedCompileOptions, SvelteNode } from '#compiler';
+import type { AST, ExpressionMetadata, ValidatedCompileOptions } from '#compiler';
 import type { LabeledStatement } from 'estree';
 
 export interface AnalysisState {
 	scope: Scope;
-	scopes: Map<SvelteNode, Scope>;
+	scopes: Map<AST.SvelteNode, Scope>;
 	analysis: ComponentAnalysis;
 	options: ValidatedCompileOptions;
 	ast_type: 'instance' | 'template' | 'module';
@@ -31,11 +31,11 @@ export interface AnalysisState {
 }
 
 export type Context<State extends AnalysisState = AnalysisState> = import('zimmerframe').Context<
-	SvelteNode,
+	AST.SvelteNode,
 	State
 >;
 
 export type Visitors<State extends AnalysisState = AnalysisState> = import('zimmerframe').Visitors<
-	SvelteNode,
+	AST.SvelteNode,
 	State
 >;
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/AssignmentExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/AssignmentExpression.js
index 54e5b46486ad..a64c89cd88f1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/AssignmentExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/AssignmentExpression.js
@@ -1,5 +1,4 @@
 /** @import { AssignmentExpression } from 'estree' */
-/** @import { SvelteNode } from '#compiler' */
 /** @import { Context } from '../types' */
 import { extract_identifiers, object } from '../../../utils/ast.js';
 import { validate_assignment } from './shared/utils.js';
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
index 6c050d966a22..6eb9faca6d4e 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
@@ -1,5 +1,5 @@
 /** @import { ArrowFunctionExpression, Expression, FunctionDeclaration, FunctionExpression } from 'estree' */
-/** @import { AST, DelegatedEvent, SvelteNode } from '#compiler' */
+/** @import { AST, DelegatedEvent } from '#compiler' */
 /** @import { Context } from '../types' */
 import { cannot_be_set_statically, is_capture_event, is_delegated } from '../../../../utils.js';
 import {
@@ -16,7 +16,7 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
 export function Attribute(node, context) {
 	context.next();
 
-	const parent = /** @type {SvelteNode} */ (context.path.at(-1));
+	const parent = /** @type {AST.SvelteNode} */ (context.path.at(-1));
 
 	if (parent.type === 'RegularElement') {
 		// special case <option value="" />
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
index c7ade4856bcb..99f18ace646b 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
@@ -1,5 +1,5 @@
 /** @import { CallExpression, VariableDeclarator } from 'estree' */
-/** @import { AST, SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
 import { get_rune } from '../../scope.js';
 import * as e from '../../../errors.js';
@@ -12,7 +12,7 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
  * @param {Context} context
  */
 export function CallExpression(node, context) {
-	const parent = /** @type {SvelteNode} */ (get_parent(context.path, -1));
+	const parent = /** @type {AST.SvelteNode} */ (get_parent(context.path, -1));
 
 	const rune = get_rune(node, context.state.scope);
 
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/LabeledStatement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/LabeledStatement.js
index 26ba0307801d..a63480feaabc 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/LabeledStatement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/LabeledStatement.js
@@ -1,5 +1,5 @@
 /** @import { Expression, LabeledStatement } from 'estree' */
-/** @import { AST, ReactiveStatement, SvelteNode } from '#compiler' */
+/** @import { AST, ReactiveStatement } from '#compiler' */
 /** @import { Context } from '../types' */
 import * as e from '../../../errors.js';
 import { extract_identifiers, object } from '../../../utils/ast.js';
@@ -11,7 +11,7 @@ import * as w from '../../../warnings.js';
  */
 export function LabeledStatement(node, context) {
 	if (node.label.name === '$') {
-		const parent = /** @type {SvelteNode} */ (context.path.at(-1));
+		const parent = /** @type {AST.SvelteNode} */ (context.path.at(-1));
 
 		const is_reactive_statement =
 			context.state.ast_type === 'instance' && parent.type === 'Program';
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
index 7b8cd7593fd3..2f6bbd785a71 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
@@ -1,4 +1,4 @@
-/** @import { AST, Binding, SvelteNode } from '#compiler' */
+/** @import { AST, Binding } from '#compiler' */
 /** @import { Scope } from '../../scope' */
 /** @import { Context } from '../types' */
 import { validate_block_not_empty, validate_opening_tag } from './shared/utils.js';
@@ -80,7 +80,7 @@ export function SnippetBlock(node, context) {
 }
 
 /**
- * @param {Map<SvelteNode, Scope>} scopes
+ * @param {Map<AST.SvelteNode, Scope>} scopes
  * @param {Scope} scope
  */
 function can_hoist_snippet(scope, scopes, visited = new Set()) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y.js
index 3bd16b0dd4f7..a5ca8463a4f7 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/a11y.js
@@ -1,5 +1,5 @@
 /** @import { Context } from '../../types.js' */
-/** @import { AST, SvelteNode, TemplateNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { ARIARoleDefinitionKey, ARIARoleRelationConcept, ARIAProperty, ARIAPropertyDefinition, ARIARoleDefinition } from 'aria-query' */
 import { roles as roles_map, aria, elementRoles } from 'aria-query';
 // @ts-expect-error package doesn't provide typings
@@ -582,7 +582,7 @@ function get_implicit_role(name, attribute_map) {
 const invisible_elements = ['meta', 'html', 'script', 'style'];
 
 /**
- * @param {SvelteNode[]} path
+ * @param {AST.SvelteNode[]} path
  * @param {string[]} elements
  */
 function is_parent(path, elements) {
@@ -1062,7 +1062,7 @@ export function check_element(node, context) {
 	}
 
 	if (node.name === 'label') {
-		/** @param {TemplateNode} node */
+		/** @param {AST.TemplateNode} node */
 		const has_input_child = (node) => {
 			let has = false;
 			walk(
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/attribute.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/attribute.js
index c2c1f9cabf78..198e464ac7dc 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/attribute.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/attribute.js
@@ -1,4 +1,4 @@
-/** @import { AST, ElementLike } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Context } from '../../types' */
 import * as e from '../../../../errors.js';
 import { is_text_attribute } from '../../../../utils/ast.js';
@@ -22,7 +22,7 @@ export function validate_attribute_name(attribute) {
 
 /**
  * @param {AST.Attribute} attribute
- * @param {ElementLike} parent
+ * @param {AST.ElementLike} parent
  */
 export function validate_attribute(attribute, parent) {
 	if (
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/fragment.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/fragment.js
index c3865166fe21..f04b0e46686e 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/fragment.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/fragment.js
@@ -1,7 +1,7 @@
-/** @import { AST, SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 
 /**
- * @param {SvelteNode[]} path
+ * @param {AST.SvelteNode[]} path
  */
 export function mark_subtree_dynamic(path) {
 	let i = path.length;
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js b/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
index 3edbc49f1699..ccbdcea4cc56 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
@@ -1,5 +1,5 @@
 /** @import * as ESTree from 'estree' */
-/** @import { ValidatedCompileOptions, AST, ValidatedModuleCompileOptions, SvelteNode } from '#compiler' */
+/** @import { AST, ValidatedCompileOptions, ValidatedModuleCompileOptions } from '#compiler' */
 /** @import { ComponentAnalysis, Analysis } from '../../types' */
 /** @import { Visitors, ComponentClientTransformState, ClientTransformState } from './types' */
 import { walk } from 'zimmerframe';
@@ -178,7 +178,7 @@ export function client_component(analysis, options) {
 	};
 
 	const module = /** @type {ESTree.Program} */ (
-		walk(/** @type {SvelteNode} */ (analysis.module.ast), state, visitors)
+		walk(/** @type {AST.SvelteNode} */ (analysis.module.ast), state, visitors)
 	);
 
 	const instance_state = {
@@ -190,12 +190,12 @@ export function client_component(analysis, options) {
 	};
 
 	const instance = /** @type {ESTree.Program} */ (
-		walk(/** @type {SvelteNode} */ (analysis.instance.ast), instance_state, visitors)
+		walk(/** @type {AST.SvelteNode} */ (analysis.instance.ast), instance_state, visitors)
 	);
 
 	const template = /** @type {ESTree.Program} */ (
 		walk(
-			/** @type {SvelteNode} */ (analysis.template.ast),
+			/** @type {AST.SvelteNode} */ (analysis.template.ast),
 			{
 				...state,
 				transform: instance_state.transform,
@@ -664,7 +664,7 @@ export function client_module(analysis, options) {
 	};
 
 	const module = /** @type {ESTree.Program} */ (
-		walk(/** @type {SvelteNode} */ (analysis.module.ast), state, visitors)
+		walk(/** @type {AST.SvelteNode} */ (analysis.module.ast), state, visitors)
 	);
 
 	return {
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts b/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts
index 47af9813e2a0..5c8476de3e3c 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts
+++ b/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts
@@ -9,7 +9,7 @@ import type {
 	UpdateExpression,
 	VariableDeclaration
 } from 'estree';
-import type { Namespace, SvelteNode, ValidatedCompileOptions } from '#compiler';
+import type { AST, Namespace, ValidatedCompileOptions } from '#compiler';
 import type { TransformState } from '../types.js';
 import type { ComponentAnalysis } from '../../types.js';
 import type { SourceLocation } from '#shared';
@@ -98,14 +98,14 @@ export interface StateField {
 	id: PrivateIdentifier;
 }
 
-export type Context = import('zimmerframe').Context<SvelteNode, ClientTransformState>;
-export type Visitors = import('zimmerframe').Visitors<SvelteNode, any>;
+export type Context = import('zimmerframe').Context<AST.SvelteNode, ClientTransformState>;
+export type Visitors = import('zimmerframe').Visitors<AST.SvelteNode, any>;
 
 export type ComponentContext = import('zimmerframe').Context<
-	SvelteNode,
+	AST.SvelteNode,
 	ComponentClientTransformState
 >;
 export type ComponentVisitors = import('zimmerframe').Visitors<
-	SvelteNode,
+	AST.SvelteNode,
 	ComponentClientTransformState
 >;
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/utils.js b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
index de821bbc45c7..c59a5544dfb2 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
@@ -1,5 +1,5 @@
 /** @import { ArrowFunctionExpression, Expression, FunctionDeclaration, FunctionExpression, Identifier, Pattern, PrivateIdentifier, Statement } from 'estree' */
-/** @import { Binding, SvelteNode } from '#compiler' */
+/** @import { AST, Binding } from '#compiler' */
 /** @import { ClientTransformState, ComponentClientTransformState, ComponentContext } from './types.js' */
 /** @import { Analysis } from '../../types.js' */
 /** @import { Scope } from '../../scope.js' */
@@ -271,7 +271,7 @@ export function should_proxy(node, scope) {
 
 /**
  * @param {Pattern} node
- * @param {import('zimmerframe').Context<SvelteNode, ComponentClientTransformState>} context
+ * @param {import('zimmerframe').Context<AST.SvelteNode, ComponentClientTransformState>} context
  * @returns {{ id: Pattern, declarations: null | Statement[] }}
  */
 export function create_derived_block_argument(node, context) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js
index f129e059f2a7..0a49e89cfe09 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js
@@ -1,5 +1,5 @@
-/** @import { CallExpression, Expression, MemberExpression, Pattern } from 'estree' */
-/** @import { AST, SvelteNode } from '#compiler' */
+/** @import { CallExpression, Expression, Pattern } from 'estree' */
+/** @import { AST } from '#compiler' */
 /** @import { ComponentContext } from '../types' */
 import { dev, is_ignored } from '../../../../state.js';
 import { is_text_attribute } from '../../../../utils/ast.js';
@@ -16,7 +16,7 @@ export function BindDirective(node, context) {
 	const expression = /** @type {Expression} */ (context.visit(node.expression));
 	const property = binding_properties[node.name];
 
-	const parent = /** @type {SvelteNode} */ (context.path.at(-1));
+	const parent = /** @type {AST.SvelteNode} */ (context.path.at(-1));
 
 	let get, set;
 
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
index c94c1e1b0ec8..068971145c6e 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
@@ -1,5 +1,5 @@
 /** @import { BlockStatement, Expression, ExpressionStatement, Identifier, MemberExpression, Pattern, Property, SequenceExpression, Statement } from 'estree' */
-/** @import { AST, TemplateNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { ComponentContext } from '../../types.js' */
 import { dev, is_ignored } from '../../../../../state.js';
 import { get_attribute_chunks, object } from '../../../../../utils/ast.js';
@@ -35,7 +35,7 @@ export function build_component(node, component_name, context, anchor = context.
 		}
 	};
 
-	/** @type {Record<string, TemplateNode[]>} */
+	/** @type {Record<string, AST.TemplateNode[]>} */
 	const children = {};
 
 	/** @type {Record<string, Expression[]>} */
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/events.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/events.js
index 92f99c4a8b11..f23f7548ece1 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/events.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/events.js
@@ -1,5 +1,5 @@
 /** @import { Expression } from 'estree' */
-/** @import { AST, ExpressionMetadata, SvelteNode } from '#compiler' */
+/** @import { AST, ExpressionMetadata } from '#compiler' */
 /** @import { ComponentContext } from '../../types' */
 import { is_capture_event, is_passive_event } from '../../../../../../utils.js';
 import { dev, locator } from '../../../../../state.js';
@@ -68,7 +68,7 @@ export function visit_event_attribute(node, context) {
 			)
 		);
 
-		const type = /** @type {SvelteNode} */ (context.path.at(-1)).type;
+		const type = /** @type {AST.SvelteNode} */ (context.path.at(-1)).type;
 
 		if (type === 'SvelteDocument' || type === 'SvelteWindow' || type === 'SvelteBody') {
 			// These nodes are above the component tree, and its events should run parent first
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js
index af336733bcb4..7674fd1eb234 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js
@@ -1,5 +1,5 @@
 /** @import { Expression } from 'estree' */
-/** @import { AST, SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { ComponentContext } from '../../types' */
 import { cannot_be_set_statically } from '../../../../../../utils.js';
 import { is_event_attribute, is_text_attribute } from '../../../../../utils/ast.js';
@@ -10,7 +10,7 @@ import { build_template_chunk, build_update } from './utils.js';
  * Processes an array of template nodes, joining sibling text/expression nodes
  * (e.g. `{a} b {c}`) into a single update function. Along the way it creates
  * corresponding template node references these updates are applied to.
- * @param {SvelteNode[]} nodes
+ * @param {AST.SvelteNode[]} nodes
  * @param {(is_text: boolean) => Expression} initial
  * @param {boolean} is_element
  * @param {ComponentContext} context
@@ -124,7 +124,7 @@ export function process_children(nodes, initial, is_element, { visit, state }) {
 }
 
 /**
- * @param {SvelteNode} node
+ * @param {AST.SvelteNode} node
  * @param {ComponentContext["state"]} state
  */
 function is_static_element(node, state) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
index 11f76aa025e7..1854baa1e964 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
@@ -1,5 +1,5 @@
 /** @import { Expression, ExpressionStatement, Identifier, MemberExpression, SequenceExpression, Statement, Super } from 'estree' */
-/** @import { AST, SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { ComponentClientTransformState } from '../../types' */
 import { walk } from 'zimmerframe';
 import { object } from '../../../../../utils/ast.js';
@@ -12,7 +12,7 @@ import { locator } from '../../../../../state.js';
 
 /**
  * @param {Array<AST.Text | AST.ExpressionTag>} values
- * @param {(node: SvelteNode, state: any) => any} visit
+ * @param {(node: AST.SvelteNode, state: any) => any} visit
  * @param {ComponentClientTransformState} state
  * @returns {{ value: Expression, has_state: boolean, has_call: boolean }}
  */
@@ -145,7 +145,7 @@ export function build_update_assignment(state, id, init, value, update) {
  * Serializes `bind:this` for components and elements.
  * @param {Identifier | MemberExpression | SequenceExpression} expression
  * @param {Expression} value
- * @param {import('zimmerframe').Context<SvelteNode, ComponentClientTransformState>} context
+ * @param {import('zimmerframe').Context<AST.SvelteNode, ComponentClientTransformState>} context
  */
 export function build_bind_this(expression, value, { state, visit }) {
 	if (expression.type === 'SequenceExpression') {
diff --git a/packages/svelte/src/compiler/phases/3-transform/css/index.js b/packages/svelte/src/compiler/phases/3-transform/css/index.js
index c5255c4bc34a..5b0dcd558893 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -1,5 +1,5 @@
 /** @import { Visitors } from 'zimmerframe' */
-/** @import { ValidatedCompileOptions, Css } from '#compiler' */
+/** @import { AST, ValidatedCompileOptions } from '#compiler' */
 /** @import { ComponentAnalysis } from '../../types.js' */
 import MagicString from 'magic-string';
 import { walk } from 'zimmerframe';
@@ -41,9 +41,9 @@ export function render_stylesheet(source, analysis, options) {
 		}
 	};
 
-	const ast = /** @type {Css.StyleSheet} */ (analysis.css.ast);
+	const ast = /** @type {AST.CSS.StyleSheet} */ (analysis.css.ast);
 
-	walk(/** @type {Css.Node} */ (ast), state, visitors);
+	walk(/** @type {AST.CSS.Node} */ (ast), state, visitors);
 
 	code.remove(0, ast.content.start);
 	code.remove(/** @type {number} */ (ast.content.end), source.length);
@@ -71,7 +71,7 @@ export function render_stylesheet(source, analysis, options) {
 	return css;
 }
 
-/** @type {Visitors<Css.Node, State>} */
+/** @type {Visitors<AST.CSS.Node, State>} */
 const visitors = {
 	_: (node, context) => {
 		context.state.code.addSourcemapLocation(node.start);
@@ -259,7 +259,7 @@ const visitors = {
 		if (parent?.type === 'Rule') {
 			specificity = { bumped: false };
 
-			/** @type {Css.Rule | null} */
+			/** @type {AST.CSS.Rule | null} */
 			let rule = parent.metadata.parent_rule;
 
 			while (rule) {
@@ -278,7 +278,7 @@ const visitors = {
 
 		for (const relative_selector of node.children) {
 			if (relative_selector.metadata.is_global) {
-				const global = /** @type {Css.PseudoClassSelector} */ (relative_selector.selectors[0]);
+				const global = /** @type {AST.CSS.PseudoClassSelector} */ (relative_selector.selectors[0]);
 				remove_global_pseudo_class(global, relative_selector.combinator, context.state);
 
 				if (
@@ -361,15 +361,15 @@ const visitors = {
 
 /**
  *
- * @param {Array<Css.Node>} path
+ * @param {Array<AST.CSS.Node>} path
  */
 function is_in_global_block(path) {
 	return path.some((node) => node.type === 'Rule' && node.metadata.is_global_block);
 }
 
 /**
- * @param {Css.PseudoClassSelector} selector
- * @param {Css.Combinator | null} combinator
+ * @param {AST.CSS.PseudoClassSelector} selector
+ * @param {AST.CSS.Combinator | null} combinator
  * @param {State} state
  */
 function remove_global_pseudo_class(selector, combinator, state) {
@@ -399,7 +399,7 @@ function remove_preceding_whitespace(end, state) {
 }
 
 /**
- *  @param {Css.Rule} rule
+ *  @param {AST.CSS.Rule} rule
  * @param {boolean} is_in_global_block
  */
 function is_empty(rule, is_in_global_block) {
@@ -426,14 +426,14 @@ function is_empty(rule, is_in_global_block) {
 	return true;
 }
 
-/** @param {Css.Rule} rule */
+/** @param {AST.CSS.Rule} rule */
 function is_used(rule) {
 	return rule.prelude.children.some((selector) => selector.metadata.used);
 }
 
 /**
  *
- * @param {Css.Rule} node
+ * @param {AST.CSS.Rule} node
  * @param {MagicString} code
  */
 function escape_comment_close(node, code) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js
index ffde76fab7af..982b75e12f53 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js
@@ -1,5 +1,5 @@
 /** @import { Program, Property, Statement, VariableDeclarator } from 'estree' */
-/** @import { SvelteNode, ValidatedCompileOptions, ValidatedModuleCompileOptions } from '#compiler' */
+/** @import { AST, ValidatedCompileOptions, ValidatedModuleCompileOptions } from '#compiler' */
 /** @import { ComponentServerTransformState, ComponentVisitors, ServerTransformState, Visitors } from './types.js' */
 /** @import { Analysis, ComponentAnalysis } from '../../types.js' */
 import { walk } from 'zimmerframe';
@@ -104,12 +104,12 @@ export function server_component(analysis, options) {
 	};
 
 	const module = /** @type {Program} */ (
-		walk(/** @type {SvelteNode} */ (analysis.module.ast), state, global_visitors)
+		walk(/** @type {AST.SvelteNode} */ (analysis.module.ast), state, global_visitors)
 	);
 
 	const instance = /** @type {Program} */ (
 		walk(
-			/** @type {SvelteNode} */ (analysis.instance.ast),
+			/** @type {AST.SvelteNode} */ (analysis.instance.ast),
 			{ ...state, scopes: analysis.instance.scopes },
 			{
 				...global_visitors,
@@ -130,7 +130,7 @@ export function server_component(analysis, options) {
 
 	const template = /** @type {Program} */ (
 		walk(
-			/** @type {SvelteNode} */ (analysis.template.ast),
+			/** @type {AST.SvelteNode} */ (analysis.template.ast),
 			{ ...state, scopes: analysis.template.scopes },
 			// @ts-expect-error don't know, don't care
 			{ ...global_visitors, ...template_visitors }
@@ -394,7 +394,7 @@ export function server_module(analysis, options) {
 	};
 
 	const module = /** @type {Program} */ (
-		walk(/** @type {SvelteNode} */ (analysis.module.ast), state, global_visitors)
+		walk(/** @type {AST.SvelteNode} */ (analysis.module.ast), state, global_visitors)
 	);
 
 	return {
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/types.d.ts b/packages/svelte/src/compiler/phases/3-transform/server/types.d.ts
index 716e1105f084..971271642cfc 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/types.d.ts
+++ b/packages/svelte/src/compiler/phases/3-transform/server/types.d.ts
@@ -1,5 +1,5 @@
 import type { Expression, Statement, ModuleDeclaration, LabeledStatement } from 'estree';
-import type { Namespace, SvelteNode, ValidatedCompileOptions } from '#compiler';
+import type { AST, Namespace, ValidatedCompileOptions } from '#compiler';
 import type { TransformState } from '../types.js';
 import type { ComponentAnalysis } from '../../types.js';
 import type { StateField } from '../client/types.js';
@@ -25,14 +25,14 @@ export interface ComponentServerTransformState extends ServerTransformState {
 	readonly skip_hydration_boundaries: boolean;
 }
 
-export type Context = import('zimmerframe').Context<SvelteNode, ServerTransformState>;
-export type Visitors = import('zimmerframe').Visitors<SvelteNode, ServerTransformState>;
+export type Context = import('zimmerframe').Context<AST.SvelteNode, ServerTransformState>;
+export type Visitors = import('zimmerframe').Visitors<AST.SvelteNode, ServerTransformState>;
 
 export type ComponentContext = import('zimmerframe').Context<
-	SvelteNode,
+	AST.SvelteNode,
 	ComponentServerTransformState
 >;
 export type ComponentVisitors = import('zimmerframe').Visitors<
-	SvelteNode,
+	AST.SvelteNode,
 	ComponentServerTransformState
 >;
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/AssignmentExpression.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/AssignmentExpression.js
index 2988c590fda4..6364063b3bae 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/AssignmentExpression.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/AssignmentExpression.js
@@ -1,5 +1,5 @@
 /** @import { AssignmentExpression, AssignmentOperator, Expression, Pattern } from 'estree' */
-/** @import { SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { Context, ServerTransformState } from '../types.js' */
 import * as b from '../../../../utils/builders.js';
 import { build_assignment_value } from '../../../../utils/ast.js';
@@ -18,7 +18,7 @@ export function AssignmentExpression(node, context) {
  * @param {AssignmentOperator} operator
  * @param {Pattern} left
  * @param {Expression} right
- * @param {import('zimmerframe').Context<SvelteNode, ServerTransformState>} context
+ * @param {import('zimmerframe').Context<AST.SvelteNode, ServerTransformState>} context
  * @returns {Expression | null}
  */
 function build_assignment(operator, left, right, context) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
index 0d0444433564..695161ff9b60 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
@@ -1,5 +1,5 @@
 /** @import { BlockStatement, Expression, Pattern, Property, SequenceExpression, Statement } from 'estree' */
-/** @import { AST, TemplateNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { ComponentContext } from '../../types.js' */
 import { empty_comment, build_attribute_value } from './utils.js';
 import * as b from '../../../../../utils/builders.js';
@@ -31,7 +31,7 @@ export function build_inline_component(node, expression, context) {
 		scope: node.metadata.scopes.default
 	};
 
-	/** @type {Record<string, TemplateNode[]>} */
+	/** @type {Record<string, AST.TemplateNode[]>} */
 	const children = {};
 
 	/**
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
index d626bb08db30..5ebc6475713f 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
@@ -1,5 +1,5 @@
 /** @import { Expression, Literal } from 'estree' */
-/** @import { AST, Namespace, SvelteNode } from '#compiler' */
+/** @import { AST, Namespace } from '#compiler' */
 /** @import { ComponentContext, ComponentServerTransformState } from '../../types.js' */
 import {
 	get_attribute_chunks,
@@ -31,7 +31,7 @@ const WHITESPACE_INSENSITIVE_ATTRIBUTES = ['class', 'style'];
  * Writes the output to the template output. Some elements may have attributes on them that require the
  * their output to be the child content instead. In this case, an object is returned.
  * @param {AST.RegularElement | AST.SvelteElement} node
- * @param {import('zimmerframe').Context<SvelteNode, ComponentServerTransformState>} context
+ * @param {import('zimmerframe').Context<AST.SvelteNode, ComponentServerTransformState>} context
  */
 export function build_element_attributes(node, context) {
 	/** @type {Array<AST.Attribute | AST.SpreadAttribute>} */
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/utils.js
index 735fed060862..2c6aa2f316aa 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/utils.js
@@ -1,5 +1,5 @@
 /** @import { AssignmentOperator, Expression, Identifier, Node, Statement, TemplateElement } from 'estree' */
-/** @import { AST, SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import { ComponentContext, ServerTransformState } from '../../types.js' */
 
 import { escape_html } from '../../../../../../escaping.js';
@@ -24,7 +24,7 @@ export const empty_comment = b.literal(EMPTY_COMMENT);
 /**
  * Processes an array of template nodes, joining sibling text/expression nodes and
  * recursing into child nodes.
- * @param {Array<SvelteNode>} nodes
+ * @param {Array<AST.SvelteNode>} nodes
  * @param {ComponentContext} context
  */
 export function process_children(nodes, { visit, state }) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/types.d.ts b/packages/svelte/src/compiler/phases/3-transform/types.d.ts
index a16fd73a2d2c..5d860207dde6 100644
--- a/packages/svelte/src/compiler/phases/3-transform/types.d.ts
+++ b/packages/svelte/src/compiler/phases/3-transform/types.d.ts
@@ -1,10 +1,10 @@
 import type { Scope } from '../scope.js';
-import type { SvelteNode, ValidatedModuleCompileOptions } from '#compiler';
+import type { AST, ValidatedModuleCompileOptions } from '#compiler';
 import type { Analysis } from '../types.js';
 
 export interface TransformState {
 	readonly analysis: Analysis;
 	readonly options: ValidatedModuleCompileOptions;
 	readonly scope: Scope;
-	readonly scopes: Map<SvelteNode, Scope>;
+	readonly scopes: Map<AST.SvelteNode, Scope>;
 }
diff --git a/packages/svelte/src/compiler/phases/3-transform/utils.js b/packages/svelte/src/compiler/phases/3-transform/utils.js
index ffd07dd26a4c..b53a3110bd22 100644
--- a/packages/svelte/src/compiler/phases/3-transform/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/utils.js
@@ -1,6 +1,6 @@
 /** @import { Context } from 'zimmerframe' */
 /** @import { TransformState } from './types.js' */
-/** @import { AST, Binding, Namespace, SvelteNode, ValidatedCompileOptions } from '#compiler' */
+/** @import { AST, Binding, Namespace, ValidatedCompileOptions } from '#compiler' */
 /** @import { Node, Expression, CallExpression } from 'estree' */
 import {
 	regex_ends_with_whitespaces,
@@ -33,7 +33,7 @@ export function is_hoisted_function(node) {
 
 /**
  * Match Svelte 4 behaviour by sorting ConstTag nodes in topological order
- * @param {SvelteNode[]} nodes
+ * @param {AST.SvelteNode[]} nodes
  * @param {TransformState} state
  */
 function sort_const_tags(nodes, state) {
@@ -133,9 +133,9 @@ function sort_const_tags(nodes, state) {
  *   unless it's whitespace-only, in which case collapse to a single whitespace for all cases
  *   except when it's children of certain elements where we know ignore whitespace (like td/option/head),
  *   in which case we remove it entirely
- * @param {SvelteNode} parent
- * @param {SvelteNode[]} nodes
- * @param {SvelteNode[]} path
+ * @param {AST.SvelteNode} parent
+ * @param {AST.SvelteNode[]} nodes
+ * @param {AST.SvelteNode[]} path
  * @param {Namespace} namespace
  * @param {TransformState & { options: ValidatedCompileOptions }} state
  * @param {boolean} preserve_whitespace
@@ -157,10 +157,10 @@ export function clean_nodes(
 		nodes = sort_const_tags(nodes, state);
 	}
 
-	/** @type {SvelteNode[]} */
+	/** @type {AST.SvelteNode[]} */
 	const hoisted = [];
 
-	/** @type {SvelteNode[]} */
+	/** @type {AST.SvelteNode[]} */
 	const regular = [];
 
 	for (const node of nodes) {
@@ -316,8 +316,8 @@ export function clean_nodes(
 /**
  * Infers the namespace for the children of a node that should be used when creating the `$.template(...)`.
  * @param {Namespace} namespace
- * @param {SvelteNode} parent
- * @param {SvelteNode[]} nodes
+ * @param {AST.SvelteNode} parent
+ * @param {AST.SvelteNode[]} nodes
  */
 export function infer_namespace(namespace, parent, nodes) {
 	if (parent.type === 'RegularElement' && parent.name === 'foreignObject') {
@@ -371,7 +371,7 @@ export function infer_namespace(namespace, parent, nodes) {
  * Heuristic: Keep current namespace, unless we find a regular element,
  * in which case we always want html, or we only find svg nodes,
  * in which case we assume svg.
- * @param {SvelteNode[]} nodes
+ * @param {AST.SvelteNode[]} nodes
  * @param {Namespace | 'keep' | 'maybe_html'} namespace
  */
 function check_nodes_for_namespace(nodes, namespace) {
diff --git a/packages/svelte/src/compiler/phases/css.js b/packages/svelte/src/compiler/phases/css.js
index 85d002eb09e9..71a6aa3a5efa 100644
--- a/packages/svelte/src/compiler/phases/css.js
+++ b/packages/svelte/src/compiler/phases/css.js
@@ -1,4 +1,4 @@
-/** @import { Css } from '#compiler' */
+/** @import { AST } from '#compiler' */
 const regex_css_browser_prefix = /^-((webkit)|(moz)|(o)|(ms))-/;
 export const regex_css_name_boundary = /^[\s,;}]$/;
 
@@ -10,5 +10,5 @@ export function remove_css_prefix(name) {
 	return name.replace(regex_css_browser_prefix, '');
 }
 
-/** @param {Css.Atrule} node */
+/** @param {AST.CSS.Atrule} node */
 export const is_keyframes_node = (node) => remove_css_prefix(node.name) === 'keyframes';
diff --git a/packages/svelte/src/compiler/phases/nodes.js b/packages/svelte/src/compiler/phases/nodes.js
index 1a1c21bb4b0c..7aa9fecd3aba 100644
--- a/packages/svelte/src/compiler/phases/nodes.js
+++ b/packages/svelte/src/compiler/phases/nodes.js
@@ -1,4 +1,4 @@
-/** @import { AST, ExpressionMetadata, SvelteNode } from '#compiler' */
+/** @import { AST, ExpressionMetadata } from '#compiler' */
 /**
  * All nodes that can appear elsewhere than the top level, have attributes and can contain children
  */
@@ -14,7 +14,7 @@ const element_nodes = [
 
 /**
  * Returns true for all nodes that can appear elsewhere than the top level, have attributes and can contain children
- * @param {SvelteNode} node
+ * @param {AST.SvelteNode} node
  * @returns {node is AST.Component | AST.RegularElement | AST.SlotElement | AST.SvelteComponent | AST.SvelteElement | AST.SvelteFragment | AST.SvelteSelf}
  */
 export function is_element_node(node) {
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 7155d3172049..93be67b56cb5 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -1,6 +1,6 @@
 /** @import { ClassDeclaration, Expression, FunctionDeclaration, Identifier, ImportDeclaration, MemberExpression, Node, Pattern, VariableDeclarator } from 'estree' */
 /** @import { Context, Visitor } from 'zimmerframe' */
-/** @import { AST, Binding, DeclarationKind, ElementLike, SvelteNode } from '#compiler' */
+/** @import { AST, Binding, DeclarationKind } from '#compiler' */
 import is_reference from 'is-reference';
 import { walk } from 'zimmerframe';
 import { create_expression_metadata } from './nodes.js';
@@ -48,7 +48,7 @@ export class Scope {
 	/**
 	 * A set of all the names referenced with this scope
 	 * — useful for generating unique names
-	 * @type {Map<string, { node: Identifier; path: SvelteNode[] }[]>}
+	 * @type {Map<string, { node: Identifier; path: AST.SvelteNode[] }[]>}
 	 */
 	references = new Map();
 
@@ -179,7 +179,7 @@ export class Scope {
 
 	/**
 	 * @param {Identifier} node
-	 * @param {SvelteNode[]} path
+	 * @param {AST.SvelteNode[]} path
 	 */
 	reference(node, path) {
 		path = [...path]; // ensure that mutations to path afterwards don't affect this reference
@@ -225,7 +225,7 @@ export class ScopeRoot {
 }
 
 /**
- * @param {SvelteNode} ast
+ * @param {AST.SvelteNode} ast
  * @param {ScopeRoot} root
  * @param {boolean} allow_reactive_declarations
  * @param {Scope | null} parent
@@ -235,7 +235,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 
 	/**
 	 * A map of node->associated scope. A node appearing in this map does not necessarily mean that it created a scope
-	 * @type {Map<SvelteNode, Scope>}
+	 * @type {Map<AST.SvelteNode, Scope>}
 	 */
 	const scopes = new Map();
 	const scope = new Scope(root, parent, false);
@@ -244,7 +244,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 	/** @type {State} */
 	const state = { scope };
 
-	/** @type {[Scope, { node: Identifier; path: SvelteNode[] }][]} */
+	/** @type {[Scope, { node: Identifier; path: AST.SvelteNode[] }][]} */
 	const references = [];
 
 	/** @type {[Scope, Pattern | MemberExpression][]} */
@@ -269,7 +269,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 	}
 
 	/**
-	 * @type {Visitor<Node, State, SvelteNode>}
+	 * @type {Visitor<Node, State, AST.SvelteNode>}
 	 */
 	const create_block_scope = (node, { state, next }) => {
 		const scope = state.scope.child(true);
@@ -279,7 +279,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 	};
 
 	/**
-	 * @type {Visitor<ElementLike, State, SvelteNode>}
+	 * @type {Visitor<AST.ElementLike, State, AST.SvelteNode>}
 	 */
 	const SvelteFragment = (node, { state, next }) => {
 		const scope = state.scope.child();
@@ -288,7 +288,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 	};
 
 	/**
-	 * @type {Visitor<AST.Component | AST.SvelteComponent | AST.SvelteSelf, State, SvelteNode>}
+	 * @type {Visitor<AST.Component | AST.SvelteComponent | AST.SvelteSelf, State, AST.SvelteNode>}
 	 */
 	const Component = (node, context) => {
 		node.metadata.scopes = {
@@ -329,7 +329,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 	};
 
 	/**
-	 * @type {Visitor<AST.AnimateDirective | AST.TransitionDirective | AST.UseDirective, State, SvelteNode>}
+	 * @type {Visitor<AST.AnimateDirective | AST.TransitionDirective | AST.UseDirective, State, AST.SvelteNode>}
 	 */
 	const SvelteDirective = (node, { state, path, visit }) => {
 		state.scope.reference(b.id(node.name.split('.')[0]), path);
@@ -713,9 +713,9 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 }
 
 /**
- * @template {{ scope: Scope, scopes: Map<SvelteNode, Scope> }} State
- * @param {SvelteNode} node
- * @param {Context<SvelteNode, State>} context
+ * @template {{ scope: Scope, scopes: Map<AST.SvelteNode, Scope> }} State
+ * @param {AST.SvelteNode} node
+ * @param {Context<AST.SvelteNode, State>} context
  */
 export function set_scope(node, { next, state }) {
 	const scope = state.scopes.get(node);
diff --git a/packages/svelte/src/compiler/phases/types.d.ts b/packages/svelte/src/compiler/phases/types.d.ts
index 4e7ef867b4fa..6a2ea27993e1 100644
--- a/packages/svelte/src/compiler/phases/types.d.ts
+++ b/packages/svelte/src/compiler/phases/types.d.ts
@@ -1,17 +1,17 @@
-import type { AST, Binding, Css, SvelteNode } from '#compiler';
+import type { AST, Binding } from '#compiler';
 import type { Identifier, LabeledStatement, Node, Program } from 'estree';
 import type { Scope, ScopeRoot } from './scope.js';
 
 export interface Js {
 	ast: Program;
 	scope: Scope;
-	scopes: Map<SvelteNode, Scope>;
+	scopes: Map<AST.SvelteNode, Scope>;
 }
 
 export interface Template {
 	ast: AST.Fragment;
 	scope: Scope;
-	scopes: Map<SvelteNode, Scope>;
+	scopes: Map<AST.SvelteNode, Scope>;
 }
 
 export interface ReactiveStatement {
@@ -66,7 +66,7 @@ export interface ComponentAnalysis extends Analysis {
 	binding_groups: Map<[key: string, bindings: Array<Binding | null>], Identifier>;
 	slot_names: Map<string, AST.SlotElement>;
 	css: {
-		ast: Css.StyleSheet | null;
+		ast: AST.CSS.StyleSheet | null;
 		hash: string;
 		keyframes: string[];
 	};
diff --git a/packages/svelte/src/compiler/state.js b/packages/svelte/src/compiler/state.js
index 4602f76e8e83..2840c6601bdd 100644
--- a/packages/svelte/src/compiler/state.js
+++ b/packages/svelte/src/compiler/state.js
@@ -1,5 +1,5 @@
-/** @import { CompileOptions, SvelteNode } from './types' */
-/** @import { Warning } from '#compiler' */
+/** @import { CompileOptions } from './types' */
+/** @import { AST, Warning } from '#compiler' */
 import { getLocator } from 'locate-character';
 
 /** @typedef {{ start?: number, end?: number }} NodeLike */
@@ -41,7 +41,7 @@ export let ignore_stack = [];
  * For each node the list of warnings that should be ignored for that node.
  * Exists in addition to `ignore_stack` because not all warnings are emitted
  * while the stack is being built.
- * @type {Map<SvelteNode | NodeLike, Set<string>[]>}
+ * @type {Map<AST.SvelteNode | NodeLike, Set<string>[]>}
  */
 export let ignore_map = new Map();
 
@@ -66,7 +66,7 @@ export function reset_warning_filter(fn = () => true) {
 }
 
 /**
- * @param {SvelteNode | NodeLike} node
+ * @param {AST.SvelteNode | NodeLike} node
  * @param {import('../constants.js').IGNORABLE_RUNTIME_WARNINGS[number]} code
  * @returns
  */
diff --git a/packages/svelte/src/compiler/types/css.d.ts b/packages/svelte/src/compiler/types/css.d.ts
index ba4079ecd065..7b2e6ae5f710 100644
--- a/packages/svelte/src/compiler/types/css.d.ts
+++ b/packages/svelte/src/compiler/types/css.d.ts
@@ -1,6 +1,6 @@
 import type { AST } from '#compiler';
 
-export namespace Css {
+export namespace _CSS {
 	export interface BaseNode {
 		start: number;
 		end: number;
diff --git a/packages/svelte/src/compiler/types/index.d.ts b/packages/svelte/src/compiler/types/index.d.ts
index fe306bd020e1..b80b717e426c 100644
--- a/packages/svelte/src/compiler/types/index.d.ts
+++ b/packages/svelte/src/compiler/types/index.d.ts
@@ -7,8 +7,7 @@ import type {
 } from 'estree';
 import type { SourceMap } from 'magic-string';
 import type { Scope } from '../phases/scope.js';
-import type { Css } from './css.js';
-import type { AST, Namespace, SvelteNode } from './template.js';
+import type { AST, Namespace } from './template.js';
 import type { ICompileDiagnostic } from '../utils/compile_diagnostic.js';
 
 /** The return value of `compile` from `svelte/compiler` */
@@ -295,7 +294,7 @@ export interface Binding {
 		| AST.EachBlock
 		| AST.SnippetBlock;
 	is_called: boolean;
-	references: { node: Identifier; path: SvelteNode[] }[];
+	references: { node: Identifier; path: AST.SvelteNode[] }[];
 	mutated: boolean;
 	reassigned: boolean;
 	/** `true` if mutated _or_ reassigned */
@@ -322,7 +321,6 @@ export interface ExpressionMetadata {
 }
 
 export * from './template.js';
-export { Css };
 
 // TODO this chain is a bit weird
 export { ReactiveStatement } from '../phases/types.js';
diff --git a/packages/svelte/src/compiler/types/legacy-nodes.d.ts b/packages/svelte/src/compiler/types/legacy-nodes.d.ts
index 0013f5c17a60..389fc923327a 100644
--- a/packages/svelte/src/compiler/types/legacy-nodes.d.ts
+++ b/packages/svelte/src/compiler/types/legacy-nodes.d.ts
@@ -1,4 +1,4 @@
-import type { AST, Css } from '#compiler';
+import type { AST } from '#compiler';
 import type {
 	ArrayExpression,
 	AssignmentExpression,
@@ -260,7 +260,7 @@ export interface LegacyStyle extends BaseNode {
 
 export interface LegacySelector extends BaseNode {
 	type: 'Selector';
-	children: Array<Css.Combinator | Css.SimpleSelector>;
+	children: Array<AST.CSS.Combinator | AST.CSS.SimpleSelector>;
 }
 
 export type LegacyCssNode = LegacyStyle | LegacySelector;
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index b8724f28dc94..97a25df4a758 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -1,4 +1,4 @@
-import type { Binding, Css, ExpressionMetadata } from '#compiler';
+import type { Binding, ExpressionMetadata } from '#compiler';
 import type {
 	ArrayExpression,
 	ArrowFunctionExpression,
@@ -18,6 +18,7 @@ import type {
 	SequenceExpression
 } from 'estree';
 import type { Scope } from '../phases/scope';
+import type { _CSS } from './css';
 
 /**
  * - `html`    — the default, for e.g. `<div>` or `<span>`
@@ -66,7 +67,7 @@ export namespace AST {
 		options: SvelteOptions | null;
 		fragment: Fragment;
 		/** The parsed `<style>` element, if exists */
-		css: Css.StyleSheet | null;
+		css: AST.CSS.StyleSheet | null;
 		/** The parsed `<script>` element, if exists */
 		instance: Script | null;
 		/** The parsed `<script module>` element, if exists */
@@ -499,50 +500,60 @@ export namespace AST {
 		content: Program;
 		attributes: Attribute[];
 	}
-}
 
-type Tag = AST.ExpressionTag | AST.HtmlTag | AST.ConstTag | AST.DebugTag | AST.RenderTag;
-
-export type Directive =
-	| AST.AnimateDirective
-	| AST.BindDirective
-	| AST.ClassDirective
-	| AST.LetDirective
-	| AST.OnDirective
-	| AST.StyleDirective
-	| AST.TransitionDirective
-	| AST.UseDirective;
-
-export type Block = AST.EachBlock | AST.IfBlock | AST.AwaitBlock | AST.KeyBlock | AST.SnippetBlock;
-
-export type ElementLike =
-	| AST.Component
-	| AST.TitleElement
-	| AST.SlotElement
-	| AST.RegularElement
-	| AST.SvelteBody
-	| AST.SvelteComponent
-	| AST.SvelteDocument
-	| AST.SvelteElement
-	| AST.SvelteFragment
-	| AST.SvelteHead
-	| AST.SvelteOptionsRaw
-	| AST.SvelteSelf
-	| AST.SvelteWindow
-	| AST.SvelteBoundary;
-
-export type TemplateNode =
-	| AST.Root
-	| AST.Text
-	| Tag
-	| ElementLike
-	| AST.Attribute
-	| AST.SpreadAttribute
-	| Directive
-	| AST.Comment
-	| Block;
-
-export type SvelteNode = Node | TemplateNode | AST.Fragment | Css.Node;
+	export type AttributeLike = Attribute | SpreadAttribute | Directive;
+
+	export type Directive =
+		| AST.AnimateDirective
+		| AST.BindDirective
+		| AST.ClassDirective
+		| AST.LetDirective
+		| AST.OnDirective
+		| AST.StyleDirective
+		| AST.TransitionDirective
+		| AST.UseDirective;
+
+	export type Block =
+		| AST.EachBlock
+		| AST.IfBlock
+		| AST.AwaitBlock
+		| AST.KeyBlock
+		| AST.SnippetBlock;
+
+	export type ElementLike =
+		| AST.Component
+		| AST.TitleElement
+		| AST.SlotElement
+		| AST.RegularElement
+		| AST.SvelteBody
+		| AST.SvelteBoundary
+		| AST.SvelteComponent
+		| AST.SvelteDocument
+		| AST.SvelteElement
+		| AST.SvelteFragment
+		| AST.SvelteHead
+		| AST.SvelteOptionsRaw
+		| AST.SvelteSelf
+		| AST.SvelteWindow
+		| AST.SvelteBoundary;
+
+	export type Tag = AST.ExpressionTag | AST.HtmlTag | AST.ConstTag | AST.DebugTag | AST.RenderTag;
+
+	export type TemplateNode =
+		| AST.Root
+		| AST.Text
+		| Tag
+		| ElementLike
+		| AST.Attribute
+		| AST.SpreadAttribute
+		| Directive
+		| AST.Comment
+		| Block;
+
+	export type SvelteNode = Node | TemplateNode | AST.Fragment | _CSS.Node;
+
+	export type { _CSS as CSS };
+}
 
 declare module 'estree' {
 	export interface BaseNode {
diff --git a/packages/svelte/src/compiler/utils/ast.js b/packages/svelte/src/compiler/utils/ast.js
index cc8339f16be7..0a24d2ff0d3f 100644
--- a/packages/svelte/src/compiler/utils/ast.js
+++ b/packages/svelte/src/compiler/utils/ast.js
@@ -1,4 +1,4 @@
-/** @import { AST, SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 /** @import * as ESTree from 'estree' */
 import { walk } from 'zimmerframe';
 import * as b from '../utils/builders.js';
@@ -393,7 +393,7 @@ function _extract_paths(assignments = [], param, expression, update_expression,
  * Like `path.at(x)`, but skips over `TSNonNullExpression` and `TSAsExpression` nodes and eases assertions a bit
  * by removing the `| undefined` from the resulting type.
  *
- * @template {SvelteNode} T
+ * @template {AST.SvelteNode} T
  * @param {T[]} path
  * @param {number} at
  */
diff --git a/packages/svelte/src/compiler/utils/slot.js b/packages/svelte/src/compiler/utils/slot.js
index 1c05ec8ee6c3..078bf589e6b4 100644
--- a/packages/svelte/src/compiler/utils/slot.js
+++ b/packages/svelte/src/compiler/utils/slot.js
@@ -1,9 +1,9 @@
-/** @import { SvelteNode } from '#compiler' */
+/** @import { AST } from '#compiler' */
 import { is_element_node } from '../phases/nodes.js';
 import { is_text_attribute } from './ast.js';
 
 /**
- * @param {SvelteNode} node
+ * @param {AST.SvelteNode} node
  */
 export function determine_slot(node) {
 	if (!is_element_node(node)) return null;
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 435476d7033a..a36be7f2e4a1 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -606,7 +606,7 @@ declare module 'svelte/animate' {
 }
 
 declare module 'svelte/compiler' {
-	import type { Expression, Identifier, ArrayExpression, ArrowFunctionExpression, VariableDeclaration, VariableDeclarator, MemberExpression, ObjectExpression, Pattern, Program, ChainExpression, SimpleCallExpression, SequenceExpression } from 'estree';
+	import type { Expression, Identifier, ArrayExpression, ArrowFunctionExpression, VariableDeclaration, VariableDeclarator, MemberExpression, Node, ObjectExpression, Pattern, Program, ChainExpression, SimpleCallExpression, SequenceExpression } from 'estree';
 	import type { SourceMap } from 'magic-string';
 	import type { Location } from 'locate-character';
 	/**
@@ -943,7 +943,7 @@ declare module 'svelte/compiler' {
 			options: SvelteOptions | null;
 			fragment: Fragment;
 			/** The parsed `<style>` element, if exists */
-			css: Css.StyleSheet | null;
+			css: AST.CSS.StyleSheet | null;
 			/** The parsed `<script>` element, if exists */
 			instance: Script | null;
 			/** The parsed `<script module>` element, if exists */
@@ -1257,37 +1257,60 @@ declare module 'svelte/compiler' {
 			content: Program;
 			attributes: Attribute[];
 		}
-	}
 
-	type Tag = AST.ExpressionTag | AST.HtmlTag | AST.ConstTag | AST.DebugTag | AST.RenderTag;
-
-	type Directive =
-		| AST.AnimateDirective
-		| AST.BindDirective
-		| AST.ClassDirective
-		| AST.LetDirective
-		| AST.OnDirective
-		| AST.StyleDirective
-		| AST.TransitionDirective
-		| AST.UseDirective;
-
-	type Block = AST.EachBlock | AST.IfBlock | AST.AwaitBlock | AST.KeyBlock | AST.SnippetBlock;
-
-	type ElementLike =
-		| AST.Component
-		| AST.TitleElement
-		| AST.SlotElement
-		| AST.RegularElement
-		| AST.SvelteBody
-		| AST.SvelteComponent
-		| AST.SvelteDocument
-		| AST.SvelteElement
-		| AST.SvelteFragment
-		| AST.SvelteHead
-		| AST.SvelteOptionsRaw
-		| AST.SvelteSelf
-		| AST.SvelteWindow
-		| AST.SvelteBoundary;
+		export type AttributeLike = Attribute | SpreadAttribute | Directive;
+
+		export type Directive =
+			| AST.AnimateDirective
+			| AST.BindDirective
+			| AST.ClassDirective
+			| AST.LetDirective
+			| AST.OnDirective
+			| AST.StyleDirective
+			| AST.TransitionDirective
+			| AST.UseDirective;
+
+		export type Block =
+			| AST.EachBlock
+			| AST.IfBlock
+			| AST.AwaitBlock
+			| AST.KeyBlock
+			| AST.SnippetBlock;
+
+		export type ElementLike =
+			| AST.Component
+			| AST.TitleElement
+			| AST.SlotElement
+			| AST.RegularElement
+			| AST.SvelteBody
+			| AST.SvelteBoundary
+			| AST.SvelteComponent
+			| AST.SvelteDocument
+			| AST.SvelteElement
+			| AST.SvelteFragment
+			| AST.SvelteHead
+			| AST.SvelteOptionsRaw
+			| AST.SvelteSelf
+			| AST.SvelteWindow
+			| AST.SvelteBoundary;
+
+		export type Tag = AST.ExpressionTag | AST.HtmlTag | AST.ConstTag | AST.DebugTag | AST.RenderTag;
+
+		export type TemplateNode =
+			| AST.Root
+			| AST.Text
+			| Tag
+			| ElementLike
+			| AST.Attribute
+			| AST.SpreadAttribute
+			| Directive
+			| AST.Comment
+			| Block;
+
+		export type SvelteNode = Node | TemplateNode | AST.Fragment | _CSS.Node;
+
+		export type { _CSS as CSS };
+	}
 	/**
 	 * The preprocess function provides convenient hooks for arbitrarily transforming component source code.
 	 * For example, it can be used to convert a `<style lang="sass">` block into vanilla CSS.
@@ -1313,7 +1336,17 @@ declare module 'svelte/compiler' {
 	} | undefined): {
 		code: string;
 	};
-	namespace Css {
+	type ICompileDiagnostic = {
+		code: string;
+		message: string;
+		stack?: string;
+		filename?: string;
+		start?: Location;
+		end?: Location;
+		position?: [number, number];
+		frame?: string;
+	};
+	namespace _CSS {
 		export interface BaseNode {
 			start: number;
 			end: number;
@@ -1471,16 +1504,6 @@ declare module 'svelte/compiler' {
 			| SimpleSelector
 			| Declaration;
 	}
-	type ICompileDiagnostic = {
-		code: string;
-		message: string;
-		stack?: string;
-		filename?: string;
-		start?: Location;
-		end?: Location;
-		position?: [number, number];
-		frame?: string;
-	};
 
 	export {};
 }

From 887ce6ab4b8eb6907b03d0b2112df3237adc90db Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 12 Dec 2024 23:01:33 +0100
Subject: [PATCH 56/62] fix: don't add parenthesis to media query if already
 present (#14699)

---
 .changeset/cold-cows-enjoy.md                            | 5 +++++
 packages/svelte/src/reactivity/media-query.js            | 5 ++++-
 packages/svelte/tests/helpers.js                         | 5 +++--
 .../tests/runtime-runes/samples/media-query/_config.js   | 9 +++++++++
 .../tests/runtime-runes/samples/media-query/main.svelte  | 6 ++++++
 5 files changed, 27 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/cold-cows-enjoy.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/media-query/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/media-query/main.svelte

diff --git a/.changeset/cold-cows-enjoy.md b/.changeset/cold-cows-enjoy.md
new file mode 100644
index 000000000000..f3005f6ec388
--- /dev/null
+++ b/.changeset/cold-cows-enjoy.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't add parenthesis to media query if already present
diff --git a/packages/svelte/src/reactivity/media-query.js b/packages/svelte/src/reactivity/media-query.js
index 7da9ada667f9..22310df18d53 100644
--- a/packages/svelte/src/reactivity/media-query.js
+++ b/packages/svelte/src/reactivity/media-query.js
@@ -1,6 +1,8 @@
 import { on } from '../events/index.js';
 import { ReactiveValue } from './reactive-value.js';
 
+const parenthesis_regex = /\(.+\)/;
+
 /**
  * Creates a media query and provides a `current` property that reflects whether or not it matches.
  *
@@ -25,7 +27,8 @@ export class MediaQuery extends ReactiveValue {
 	 * @param {boolean} [fallback] Fallback value for the server
 	 */
 	constructor(query, fallback) {
-		const q = window.matchMedia(`(${query})`);
+		let final_query = parenthesis_regex.test(query) ? query : `(${query})`;
+		const q = window.matchMedia(final_query);
 		super(
 			() => q.matches,
 			(update) => on(q, 'change', update)
diff --git a/packages/svelte/tests/helpers.js b/packages/svelte/tests/helpers.js
index 45b90240c99a..9d7f71c9bd63 100644
--- a/packages/svelte/tests/helpers.js
+++ b/packages/svelte/tests/helpers.js
@@ -3,6 +3,7 @@ import * as fs from 'node:fs';
 import * as path from 'node:path';
 import glob from 'tiny-glob/sync.js';
 import { VERSION, compile, compileModule, preprocess } from 'svelte/compiler';
+import { vi } from 'vitest';
 
 /**
  * @param {string} file
@@ -176,12 +177,12 @@ export function write(file, contents) {
 // Guard because not all test contexts load this with JSDOM
 if (typeof window !== 'undefined') {
 	// @ts-expect-error JS DOM doesn't support it
-	Window.prototype.matchMedia = (media) => {
+	Window.prototype.matchMedia = vi.fn((media) => {
 		return {
 			matches: false,
 			media,
 			addEventListener: () => {},
 			removeEventListener: () => {}
 		};
-	};
+	});
 }
diff --git a/packages/svelte/tests/runtime-runes/samples/media-query/_config.js b/packages/svelte/tests/runtime-runes/samples/media-query/_config.js
new file mode 100644
index 000000000000..f7a4ca05f570
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/media-query/_config.js
@@ -0,0 +1,9 @@
+import { expect } from 'vitest';
+import { test } from '../../test';
+
+export default test({
+	async test({ window }) {
+		expect(window.matchMedia).toHaveBeenCalledWith('(max-width: 599px), (min-width: 900px)');
+		expect(window.matchMedia).toHaveBeenCalledWith('(min-width: 900px)');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/media-query/main.svelte b/packages/svelte/tests/runtime-runes/samples/media-query/main.svelte
new file mode 100644
index 000000000000..446a9213dda2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/media-query/main.svelte
@@ -0,0 +1,6 @@
+<script>
+	import { MediaQuery } from "svelte/reactivity"
+
+	const mq = new MediaQuery("(max-width: 599px), (min-width: 900px)");
+	const mq2 = new MediaQuery("min-width: 900px");
+</script>

From af9b071622e5c9e3d57a62c78adb6ed8deafeb53 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 12 Dec 2024 17:55:07 -0500
Subject: [PATCH 57/62] Version Packages (#14698)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/cold-cows-enjoy.md      |  5 -----
 .changeset/giant-moons-accept.md   |  5 -----
 .changeset/short-papayas-relate.md |  5 -----
 packages/svelte/CHANGELOG.md       | 12 ++++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 6 files changed, 14 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/cold-cows-enjoy.md
 delete mode 100644 .changeset/giant-moons-accept.md
 delete mode 100644 .changeset/short-papayas-relate.md

diff --git a/.changeset/cold-cows-enjoy.md b/.changeset/cold-cows-enjoy.md
deleted file mode 100644
index f3005f6ec388..000000000000
--- a/.changeset/cold-cows-enjoy.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't add parenthesis to media query if already present
diff --git a/.changeset/giant-moons-accept.md b/.changeset/giant-moons-accept.md
deleted file mode 100644
index 7940371d6fbb..000000000000
--- a/.changeset/giant-moons-accept.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure if block paths retain correct template namespacing
diff --git a/.changeset/short-papayas-relate.md b/.changeset/short-papayas-relate.md
deleted file mode 100644
index 430c507a0cfc..000000000000
--- a/.changeset/short-papayas-relate.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: expose more AST types from `"svelte/compiler"`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 6f3380ff5a72..90419d34549e 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.12.0
+
+### Minor Changes
+
+- feat: expose more AST types from `"svelte/compiler"` ([#14601](https://github.com/sveltejs/svelte/pull/14601))
+
+### Patch Changes
+
+- fix: don't add parenthesis to media query if already present ([#14699](https://github.com/sveltejs/svelte/pull/14699))
+
+- fix: ensure if block paths retain correct template namespacing ([#14685](https://github.com/sveltejs/svelte/pull/14685))
+
 ## 5.11.3
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index abcda8613de9..f38c28bce588 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.11.3",
+  "version": "5.12.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 39d89acd5316..57a2fda759be 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.11.3';
+export const VERSION = '5.12.0';
 export const PUBLIC_VERSION = '5';

From f0af63326327fb15424c1ddb8d67f1416da062a6 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Sat, 14 Dec 2024 15:05:32 +0100
Subject: [PATCH 58/62] feat: loose parser mode (#14691)

* add loose option

* handle unclosed tags

* handle unclosed blocks

* handle unclosed opening tags

* handle invalid expressions

* handle invalid blocks

* oops

* more robust expression parsing

* changeset

* more unclosed tag handling

* types

* Update packages/svelte/src/compiler/phases/1-parse/state/element.js

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/twelve-hairs-marry.md              |   5 +
 packages/svelte/src/compiler/index.js         |  10 +-
 .../src/compiler/phases/1-parse/index.js      |  37 +-
 .../phases/1-parse/read/expression.js         |  17 +
 .../compiler/phases/1-parse/state/element.js  |  76 +++-
 .../src/compiler/phases/1-parse/state/tag.js  |  72 ++-
 .../compiler/phases/1-parse/utils/bracket.js  | 136 ++++++
 .../samples/loose-invalid-block/input.svelte  |  13 +
 .../samples/loose-invalid-block/output.json   | 107 +++++
 .../loose-invalid-expression/input.svelte     |  11 +
 .../loose-invalid-expression/output.json      | 242 ++++++++++
 .../samples/loose-unclosed-block/input.svelte |  20 +
 .../samples/loose-unclosed-block/output.json  | 276 ++++++++++++
 .../loose-unclosed-open-tag/input.svelte      |  20 +
 .../loose-unclosed-open-tag/output.json       | 349 +++++++++++++++
 .../samples/loose-unclosed-tag/input.svelte   |  24 +
 .../samples/loose-unclosed-tag/output.json    | 301 +++++++++++++
 packages/svelte/tests/parser-legacy/test.ts   |   4 +-
 .../samples/loose-invalid-block/input.svelte  |  13 +
 .../samples/loose-invalid-block/output.json   | 171 ++++++++
 .../loose-invalid-expression/input.svelte     |  11 +
 .../loose-invalid-expression/output.json      | 254 +++++++++++
 .../loose-unclosed-open-tag/input.svelte      |  20 +
 .../loose-unclosed-open-tag/output.json       | 414 ++++++++++++++++++
 .../samples/loose-unclosed-tag/input.svelte   |  24 +
 .../samples/loose-unclosed-tag/output.json    | 358 +++++++++++++++
 packages/svelte/tests/parser-modern/test.ts   |   3 +-
 packages/svelte/types/index.d.ts              |   2 +
 28 files changed, 2948 insertions(+), 42 deletions(-)
 create mode 100644 .changeset/twelve-hairs-marry.md
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-invalid-block/input.svelte
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-invalid-block/output.json
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/input.svelte
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/output.json
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/input.svelte
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/output.json
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/input.svelte
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/output.json
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/input.svelte
 create mode 100644 packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/output.json
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-invalid-block/input.svelte
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-invalid-block/output.json
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-invalid-expression/input.svelte
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-invalid-expression/output.json
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/input.svelte
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/output.json
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/input.svelte
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/output.json

diff --git a/.changeset/twelve-hairs-marry.md b/.changeset/twelve-hairs-marry.md
new file mode 100644
index 000000000000..b61ee11785c2
--- /dev/null
+++ b/.changeset/twelve-hairs-marry.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: provide loose parser mode
diff --git a/packages/svelte/src/compiler/index.js b/packages/svelte/src/compiler/index.js
index fbd9c16e5d53..74678f518daf 100644
--- a/packages/svelte/src/compiler/index.js
+++ b/packages/svelte/src/compiler/index.js
@@ -76,7 +76,7 @@ export function compileModule(source, options) {
  *
  * @overload
  * @param {string} source
- * @param {{ filename?: string; modern: true }} options
+ * @param {{ filename?: string; modern: true; loose?: boolean }} options
  * @returns {AST.Root}
  */
 
@@ -88,7 +88,7 @@ export function compileModule(source, options) {
  *
  * @overload
  * @param {string} source
- * @param {{ filename?: string; modern?: false }} [options]
+ * @param {{ filename?: string; modern?: false; loose?: boolean }} [options]
  * @returns {Record<string, any>}
  */
 
@@ -99,15 +99,15 @@ export function compileModule(source, options) {
  * `modern` will become `true` by default in Svelte 6, and the option will be removed in Svelte 7.
  *
  * @param {string} source
- * @param {{ filename?: string; rootDir?: string; modern?: boolean }} [options]
+ * @param {{ filename?: string; rootDir?: string; modern?: boolean; loose?: boolean }} [options]
  * @returns {AST.Root | LegacyRoot}
  */
-export function parse(source, { filename, rootDir, modern } = {}) {
+export function parse(source, { filename, rootDir, modern, loose } = {}) {
 	source = remove_bom(source);
 	state.reset_warning_filter(() => false);
 	state.reset(source, { filename: filename ?? '(unknown)', rootDir });
 
-	const ast = _parse(source);
+	const ast = _parse(source, loose);
 	return to_public_ast(source, ast, modern);
 }
 
diff --git a/packages/svelte/src/compiler/phases/1-parse/index.js b/packages/svelte/src/compiler/phases/1-parse/index.js
index c3a8a098d319..390919f5cdfb 100644
--- a/packages/svelte/src/compiler/phases/1-parse/index.js
+++ b/packages/svelte/src/compiler/phases/1-parse/index.js
@@ -22,6 +22,19 @@ export class Parser {
 	 */
 	template;
 
+	/**
+	 * @readonly
+	 * @type {string}
+	 */
+	template_untrimmed;
+
+	/**
+	 * Whether or not we're in loose parsing mode, in which
+	 * case we try to continue parsing as much as possible
+	 * @type {boolean}
+	 */
+	loose;
+
 	/** */
 	index = 0;
 
@@ -43,12 +56,17 @@ export class Parser {
 	/** @type {LastAutoClosedTag | undefined} */
 	last_auto_closed_tag;
 
-	/** @param {string} template */
-	constructor(template) {
+	/**
+	 * @param {string} template
+	 * @param {boolean} loose
+	 */
+	constructor(template, loose) {
 		if (typeof template !== 'string') {
 			throw new TypeError('Template must be a string');
 		}
 
+		this.loose = loose;
+		this.template_untrimmed = template;
 		this.template = template.trimEnd();
 
 		let match_lang;
@@ -88,7 +106,9 @@ export class Parser {
 		if (this.stack.length > 1) {
 			const current = this.current();
 
-			if (current.type === 'RegularElement') {
+			if (this.loose) {
+				current.end = this.template.length;
+			} else if (current.type === 'RegularElement') {
 				current.end = current.start + 1;
 				e.element_unclosed(current, current.name);
 			} else {
@@ -151,14 +171,15 @@ export class Parser {
 	/**
 	 * @param {string} str
 	 * @param {boolean} required
+	 * @param {boolean} required_in_loose
 	 */
-	eat(str, required = false) {
+	eat(str, required = false, required_in_loose = true) {
 		if (this.match(str)) {
 			this.index += str.length;
 			return true;
 		}
 
-		if (required) {
+		if (required && (!this.loose || required_in_loose)) {
 			e.expected_token(this.index, str);
 		}
 
@@ -233,6 +254,7 @@ export class Parser {
 	/** @param {RegExp} pattern */
 	read_until(pattern) {
 		if (this.index >= this.template.length) {
+			if (this.loose) return '';
 			e.unexpected_eof(this.template.length);
 		}
 
@@ -274,10 +296,11 @@ export class Parser {
 
 /**
  * @param {string} template
+ * @param {boolean} [loose]
  * @returns {AST.Root}
  */
-export function parse(template) {
-	const parser = new Parser(template);
+export function parse(template, loose = false) {
+	const parser = new Parser(template, loose);
 	return parser.root;
 }
 
diff --git a/packages/svelte/src/compiler/phases/1-parse/read/expression.js b/packages/svelte/src/compiler/phases/1-parse/read/expression.js
index 4e33c23f2833..021bd95a6e84 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/expression.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/expression.js
@@ -3,6 +3,7 @@
 import { parse_expression_at } from '../acorn.js';
 import { regex_whitespace } from '../../patterns.js';
 import * as e from '../../../errors.js';
+import { find_matching_bracket } from '../utils/bracket.js';
 
 /**
  * @param {Parser} parser
@@ -39,6 +40,22 @@ export default function read_expression(parser) {
 
 		return /** @type {Expression} */ (node);
 	} catch (err) {
+		if (parser.loose) {
+			// Find the next } and treat it as the end of the expression
+			const end = find_matching_bracket(parser.template, parser.index, '{');
+			if (end) {
+				const start = parser.index;
+				parser.index = end;
+				// We don't know what the expression is and signal this by returning an empty identifier
+				return {
+					type: 'Identifier',
+					start,
+					end,
+					name: ''
+				};
+			}
+		}
+
 		parser.acorn_error(err);
 	}
 }
diff --git a/packages/svelte/src/compiler/phases/1-parse/state/element.js b/packages/svelte/src/compiler/phases/1-parse/state/element.js
index 2b6a88f7bd73..c112cf678987 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/element.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/element.js
@@ -9,10 +9,11 @@ import { decode_character_references } from '../utils/html.js';
 import * as e from '../../../errors.js';
 import * as w from '../../../warnings.js';
 import { create_fragment } from '../utils/create.js';
-import { create_attribute, create_expression_metadata } from '../../nodes.js';
+import { create_attribute, create_expression_metadata, is_element_node } from '../../nodes.js';
 import { get_attribute_expression, is_expression_attribute } from '../../../utils/ast.js';
 import { closing_tag_omitted } from '../../../../html-tree-validation.js';
 import { list } from '../../../utils/string.js';
+import { regex_whitespace } from '../../patterns.js';
 
 const regex_invalid_unquoted_attribute_value = /^(\/>|[\s"'=<>`])/;
 const regex_closing_textarea_tag = /^<\/textarea(\s[^>]*)?>/i;
@@ -80,7 +81,19 @@ export default function element(parser) {
 
 		// close any elements that don't have their own closing tags, e.g. <div><p></div>
 		while (/** @type {AST.RegularElement} */ (parent).name !== name) {
-			if (parent.type !== 'RegularElement') {
+			if (parser.loose) {
+				// If the previous element did interpret the next opening tag as an attribute, backtrack
+				if (is_element_node(parent)) {
+					const last = parent.attributes.at(-1);
+					if (last?.type === 'Attribute' && last.name === `<${name}`) {
+						parser.index = last.start;
+						parent.attributes.pop();
+						break;
+					}
+				}
+			}
+
+			if (parent.type !== 'RegularElement' && !parser.loose) {
 				if (parser.last_auto_closed_tag && parser.last_auto_closed_tag.tag === name) {
 					e.element_invalid_closing_tag_autoclosed(start, name, parser.last_auto_closed_tag.reason);
 				} else {
@@ -319,10 +332,41 @@ export default function element(parser) {
 	parser.append(element);
 
 	const self_closing = parser.eat('/') || is_void(name);
+	const closed = parser.eat('>', true, false);
+
+	// Loose parsing mode
+	if (!closed) {
+		// We may have eaten an opening `<` of the next element and treated it as an attribute...
+		const last = element.attributes.at(-1);
+		if (last?.type === 'Attribute' && last.name === '<') {
+			parser.index = last.start;
+			element.attributes.pop();
+		} else {
+			// ... or we may have eaten part of a following block ...
+			const prev_1 = parser.template[parser.index - 1];
+			const prev_2 = parser.template[parser.index - 2];
+			const current = parser.template[parser.index];
+			if (prev_2 === '{' && prev_1 === '/') {
+				parser.index -= 2;
+			} else if (prev_1 === '{' && (current === '#' || current === '@' || current === ':')) {
+				parser.index -= 1;
+			} else {
+				// ... or we're followed by whitespace, for example near the end of the template,
+				// which we want to take in so that language tools has more room to work with
+				parser.allow_whitespace();
+				if (parser.index === parser.template.length) {
+					while (
+						parser.index < parser.template_untrimmed.length &&
+						regex_whitespace.test(parser.template_untrimmed[parser.index])
+					) {
+						parser.index++;
+					}
+				}
+			}
+		}
+	}
 
-	parser.eat('>', true);
-
-	if (self_closing) {
+	if (self_closing || !closed) {
 		// don't push self-closing elements onto the stack
 		element.end = parser.index;
 	} else if (name === 'textarea') {
@@ -461,10 +505,22 @@ function read_attribute(parser) {
 			return spread;
 		} else {
 			const value_start = parser.index;
-			const name = parser.read_identifier();
+			let name = parser.read_identifier();
 
 			if (name === null) {
-				e.attribute_empty_shorthand(start);
+				if (
+					parser.loose &&
+					(parser.match('#') || parser.match('/') || parser.match('@') || parser.match(':'))
+				) {
+					// We're likely in an unclosed opening tag and did read part of a block.
+					// Return null to not crash the parser so it can continue with closing the tag.
+					return null;
+				} else if (parser.loose && parser.match('}')) {
+					// Likely in the middle of typing, just created the shorthand
+					name = '';
+				} else {
+					e.attribute_empty_shorthand(start);
+				}
 			}
 
 			parser.allow_whitespace();
@@ -756,5 +812,9 @@ function read_sequence(parser, done, location) {
 		}
 	}
 
-	e.unexpected_eof(parser.template.length);
+	if (parser.loose) {
+		return chunks;
+	} else {
+		e.unexpected_eof(parser.template.length);
+	}
 }
diff --git a/packages/svelte/src/compiler/phases/1-parse/state/tag.js b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
index 0eadd2b8b54a..423ada792cb7 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/tag.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
@@ -279,34 +279,43 @@ function open(parser) {
 		parser.require_whitespace();
 
 		const name_start = parser.index;
-		const name = parser.read_identifier();
+		let name = parser.read_identifier();
 		const name_end = parser.index;
 
 		if (name === null) {
-			e.expected_identifier(parser.index);
+			if (parser.loose) {
+				name = '';
+			} else {
+				e.expected_identifier(parser.index);
+			}
 		}
 
 		parser.allow_whitespace();
 
 		const params_start = parser.index;
 
-		parser.eat('(', true);
-		let parentheses = 1;
+		const matched = parser.eat('(', true, false);
 
-		while (parser.index < parser.template.length && (!parser.match(')') || parentheses !== 1)) {
-			if (parser.match('(')) parentheses++;
-			if (parser.match(')')) parentheses--;
-			parser.index += 1;
-		}
+		if (matched) {
+			let parentheses = 1;
+
+			while (parser.index < parser.template.length && (!parser.match(')') || parentheses !== 1)) {
+				if (parser.match('(')) parentheses++;
+				if (parser.match(')')) parentheses--;
+				parser.index += 1;
+			}
 
-		parser.eat(')', true);
+			parser.eat(')', true);
+		}
 
 		const prelude = parser.template.slice(0, params_start).replace(/\S/g, ' ');
 		const params = parser.template.slice(params_start, parser.index);
 
-		let function_expression = /** @type {ArrowFunctionExpression} */ (
-			parse_expression_at(prelude + `${params} => {}`, parser.ts, params_start)
-		);
+		let function_expression = matched
+			? /** @type {ArrowFunctionExpression} */ (
+					parse_expression_at(prelude + `${params} => {}`, parser.ts, params_start)
+				)
+			: { params: [] };
 
 		parser.allow_whitespace();
 		parser.eat('}', true);
@@ -454,43 +463,66 @@ function close(parser) {
 	const start = parser.index - 1;
 
 	let block = parser.current();
+	/** Only relevant/reached for loose parsing mode */
+	let matched;
 
 	switch (block.type) {
 		case 'IfBlock':
-			parser.eat('if', true);
+			matched = parser.eat('if', true, false);
+
+			if (!matched) {
+				block.end = start - 1;
+				parser.pop();
+				close(parser);
+				return;
+			}
+
 			parser.allow_whitespace();
 			parser.eat('}', true);
+
 			while (block.elseif) {
 				block.end = parser.index;
 				parser.stack.pop();
 				block = /** @type {AST.IfBlock} */ (parser.current());
 			}
+
 			block.end = parser.index;
 			parser.pop();
 			return;
 
 		case 'EachBlock':
-			parser.eat('each', true);
+			matched = parser.eat('each', true, false);
 			break;
 		case 'KeyBlock':
-			parser.eat('key', true);
+			matched = parser.eat('key', true, false);
 			break;
 		case 'AwaitBlock':
-			parser.eat('await', true);
+			matched = parser.eat('await', true, false);
 			break;
 		case 'SnippetBlock':
-			parser.eat('snippet', true);
+			matched = parser.eat('snippet', true, false);
 			break;
 
 		case 'RegularElement':
-			// TODO handle implicitly closed elements
-			e.block_unexpected_close(start);
+			if (parser.loose) {
+				matched = false;
+			} else {
+				// TODO handle implicitly closed elements
+				e.block_unexpected_close(start);
+			}
 			break;
 
 		default:
 			e.block_unexpected_close(start);
 	}
 
+	if (!matched) {
+		block.end = start - 1;
+		parser.pop();
+		close(parser);
+		return;
+	}
+
 	parser.allow_whitespace();
 	parser.eat('}', true);
 	block.end = parser.index;
diff --git a/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js b/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
index aa1e072e7348..4e02f06de61b 100644
--- a/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
+++ b/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
@@ -1,3 +1,5 @@
+import full_char_code_at from './full_char_code_at.js';
+
 const SQUARE_BRACKET_OPEN = '['.charCodeAt(0);
 const SQUARE_BRACKET_CLOSE = ']'.charCodeAt(0);
 const CURLY_BRACKET_OPEN = '{'.charCodeAt(0);
@@ -33,3 +35,137 @@ export function get_bracket_close(open) {
 		return CURLY_BRACKET_CLOSE;
 	}
 }
+
+/**
+ * @param {number} num
+ * @returns {number} Infinity if {@link num} is negative, else {@link num}.
+ */
+function infinity_if_negative(num) {
+	if (num < 0) {
+		return Infinity;
+	}
+	return num;
+}
+
+/**
+ * @param {string} string The string to search.
+ * @param {number} search_start_index The index to start searching at.
+ * @param {"'" | '"' | '`'} string_start_char The character that started this string.
+ * @returns {number} The index of the end of this string expression, or `Infinity` if not found.
+ */
+function find_string_end(string, search_start_index, string_start_char) {
+	let string_to_search;
+	if (string_start_char === '`') {
+		string_to_search = string;
+	} else {
+		// we could slice at the search start index, but this way the index remains valid
+		string_to_search = string.slice(
+			0,
+			infinity_if_negative(string.indexOf('\n', search_start_index))
+		);
+	}
+
+	return find_unescaped_char(string_to_search, search_start_index, string_start_char);
+}
+
+/**
+ * @param {string} string The string to search.
+ * @param {number} search_start_index The index to start searching at.
+ * @returns {number} The index of the end of this regex expression, or `Infinity` if not found.
+ */
+function find_regex_end(string, search_start_index) {
+	return find_unescaped_char(string, search_start_index, '/');
+}
+
+/**
+ *
+ * @param {string} string The string to search.
+ * @param {number} search_start_index The index to begin the search at.
+ * @param {string} char The character to search for.
+ * @returns {number} The index of the first unescaped instance of {@link char}, or `Infinity` if not found.
+ */
+function find_unescaped_char(string, search_start_index, char) {
+	let i = search_start_index;
+	while (true) {
+		const found_index = string.indexOf(char, i);
+		if (found_index === -1) {
+			return Infinity;
+		}
+		if (count_leading_backslashes(string, found_index - 1) % 2 === 0) {
+			return found_index;
+		}
+		i = found_index + 1;
+	}
+}
+
+/**
+ * Count consecutive leading backslashes before {@link search_start_index}.
+ *
+ * @example
+ * ```js
+ * count_leading_backslashes('\\\\\\foo', 2); // 3 (the backslashes have to be escaped in the string literal, there are three in reality)
+ * ```
+ *
+ * @param {string} string The string to search.
+ * @param {number} search_start_index The index to begin the search at.
+ */
+function count_leading_backslashes(string, search_start_index) {
+	let i = search_start_index;
+	let count = 0;
+	while (string[i] === '\\') {
+		count++;
+		i--;
+	}
+	return count;
+}
+
+/**
+ * Finds the corresponding closing bracket, ignoring brackets found inside comments, strings, or regex expressions.
+ * @param {string} template The string to search.
+ * @param {number} index The index to begin the search at.
+ * @param {string} open The opening bracket (ex: `'{'` will search for `'}'`).
+ * @returns {number | undefined} The index of the closing bracket, or undefined if not found.
+ */
+export function find_matching_bracket(template, index, open) {
+	const open_code = full_char_code_at(open, 0);
+	const close_code = get_bracket_close(open_code);
+	let brackets = 1;
+	let i = index;
+	while (brackets > 0 && i < template.length) {
+		const char = template[i];
+		switch (char) {
+			case "'":
+			case '"':
+			case '`':
+				i = find_string_end(template, i + 1, char) + 1;
+				continue;
+			case '/': {
+				const next_char = template[i + 1];
+				if (!next_char) continue;
+				if (next_char === '/') {
+					i = infinity_if_negative(template.indexOf('\n', i + 1)) + '\n'.length;
+					continue;
+				}
+				if (next_char === '*') {
+					i = infinity_if_negative(template.indexOf('*/', i + 1)) + '*/'.length;
+					continue;
+				}
+				i = find_regex_end(template, i + 1) + '/'.length;
+				continue;
+			}
+			default: {
+				const code = full_char_code_at(template, i);
+				if (code === open_code) {
+					brackets++;
+				} else if (code === close_code) {
+					brackets--;
+				}
+				if (brackets === 0) {
+					return i;
+				}
+				i++;
+			}
+		}
+	}
+	return undefined;
+}
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-invalid-block/input.svelte b/packages/svelte/tests/parser-legacy/samples/loose-invalid-block/input.svelte
new file mode 100644
index 000000000000..4489a3eb278b
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-invalid-block/input.svelte
@@ -0,0 +1,13 @@
+{#if }
+{:else if }
+{:else }
+{/if}
+
+{#each }
+{/each}
+
+{#snippet }
+{/snippet}
+
+{#snippet foo}
+{/snippet}
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-invalid-block/output.json b/packages/svelte/tests/parser-legacy/samples/loose-invalid-block/output.json
new file mode 100644
index 000000000000..480fcf2edcf7
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-invalid-block/output.json
@@ -0,0 +1,107 @@
+{
+	"html": {
+		"type": "Fragment",
+		"start": 0,
+		"end": 102,
+		"children": [
+			{
+				"type": "IfBlock",
+				"start": 0,
+				"end": 33,
+				"expression": {
+					"type": "Identifier",
+					"start": 5,
+					"end": 5,
+					"name": ""
+				},
+				"children": [],
+				"else": {
+					"type": "ElseBlock",
+					"start": 18,
+					"end": 28,
+					"children": [
+						{
+							"type": "IfBlock",
+							"start": 18,
+							"end": 33,
+							"expression": {
+								"type": "Identifier",
+								"start": 17,
+								"end": 17,
+								"name": ""
+							},
+							"children": [],
+							"else": {
+								"type": "ElseBlock",
+								"start": 27,
+								"end": 28,
+								"children": []
+							},
+							"elseif": true
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 33,
+				"end": 35,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 35,
+				"end": 51,
+				"children": [],
+				"context": null,
+				"expression": {
+					"type": "Identifier",
+					"start": 42,
+					"end": 42,
+					"name": ""
+				}
+			},
+			{
+				"type": "Text",
+				"start": 51,
+				"end": 53,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "SnippetBlock",
+				"start": 53,
+				"end": 75,
+				"expression": {
+					"type": "Identifier",
+					"start": 63,
+					"end": 63,
+					"name": ""
+				},
+				"parameters": [],
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 75,
+				"end": 77,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "SnippetBlock",
+				"start": 77,
+				"end": 102,
+				"expression": {
+					"type": "Identifier",
+					"start": 87,
+					"end": 90,
+					"name": "foo"
+				},
+				"parameters": [],
+				"children": []
+			}
+		]
+	}
+}
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/input.svelte b/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/input.svelte
new file mode 100644
index 000000000000..a0977b9a6346
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/input.svelte
@@ -0,0 +1,11 @@
+<div {}></div>
+<div foo={}></div>
+
+<div foo={a.}></div>
+<div foo={'hi}'.}></div>
+<Component onclick={() => x.} />
+
+<input bind:value={a.} />
+
+asd{a.}asd
+{foo[bar.]}
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/output.json b/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/output.json
new file mode 100644
index 000000000000..d27b6cd914b5
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/output.json
@@ -0,0 +1,242 @@
+{
+	"html": {
+		"type": "Fragment",
+		"start": 0,
+		"end": 164,
+		"children": [
+			{
+				"type": "Element",
+				"start": 0,
+				"end": 14,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 5,
+						"end": 7,
+						"name": "",
+						"value": [
+							{
+								"type": "AttributeShorthand",
+								"start": 6,
+								"end": 6,
+								"expression": {
+									"start": 6,
+									"end": 6,
+									"type": "Identifier",
+									"name": ""
+								}
+							}
+						]
+					}
+				],
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 14,
+				"end": 15,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "Element",
+				"start": 15,
+				"end": 33,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 20,
+						"end": 26,
+						"name": "foo",
+						"value": [
+							{
+								"type": "MustacheTag",
+								"start": 24,
+								"end": 26,
+								"expression": {
+									"type": "Identifier",
+									"start": 25,
+									"end": 25,
+									"name": ""
+								}
+							}
+						]
+					}
+				],
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 33,
+				"end": 35,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 35,
+				"end": 55,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 40,
+						"end": 48,
+						"name": "foo",
+						"value": [
+							{
+								"type": "MustacheTag",
+								"start": 44,
+								"end": 48,
+								"expression": {
+									"type": "Identifier",
+									"start": 45,
+									"end": 47,
+									"name": ""
+								}
+							}
+						]
+					}
+				],
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 55,
+				"end": 56,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "Element",
+				"start": 56,
+				"end": 80,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 61,
+						"end": 73,
+						"name": "foo",
+						"value": [
+							{
+								"type": "MustacheTag",
+								"start": 65,
+								"end": 73,
+								"expression": {
+									"type": "Identifier",
+									"start": 66,
+									"end": 72,
+									"name": ""
+								}
+							}
+						]
+					}
+				],
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 80,
+				"end": 81,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "InlineComponent",
+				"start": 81,
+				"end": 113,
+				"name": "Component",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 92,
+						"end": 110,
+						"name": "onclick",
+						"value": [
+							{
+								"type": "MustacheTag",
+								"start": 100,
+								"end": 110,
+								"expression": {
+									"type": "Identifier",
+									"start": 101,
+									"end": 109,
+									"name": ""
+								}
+							}
+						]
+					}
+				],
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 113,
+				"end": 115,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 115,
+				"end": 140,
+				"name": "input",
+				"attributes": [
+					{
+						"start": 122,
+						"end": 137,
+						"type": "Binding",
+						"name": "value",
+						"expression": {
+							"type": "Identifier",
+							"start": 134,
+							"end": 136,
+							"name": ""
+						},
+						"modifiers": []
+					}
+				],
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 140,
+				"end": 145,
+				"raw": "\n\nasd",
+				"data": "\n\nasd"
+			},
+			{
+				"type": "MustacheTag",
+				"start": 145,
+				"end": 149,
+				"expression": {
+					"type": "Identifier",
+					"start": 146,
+					"end": 148,
+					"name": ""
+				}
+			},
+			{
+				"type": "Text",
+				"start": 149,
+				"end": 153,
+				"raw": "asd\n",
+				"data": "asd\n"
+			},
+			{
+				"type": "MustacheTag",
+				"start": 153,
+				"end": 164,
+				"expression": {
+					"type": "Identifier",
+					"start": 154,
+					"end": 163,
+					"name": ""
+				}
+			}
+		]
+	}
+}
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/input.svelte b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/input.svelte
new file mode 100644
index 000000000000..16fcfcf6084f
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/input.svelte
@@ -0,0 +1,20 @@
+<div>
+	{#if foo}
+</div>
+
+<Comp>
+	{#key bar}
+</Comp>
+
+<div>
+	{#if foo}
+		{#if bar}
+	{/if}
+</div>
+
+{#if foo}
+	{#key bar}
+{/if}
+
+{#each x as y}
+<p>hi</p>
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/output.json b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/output.json
new file mode 100644
index 000000000000..e6e909f0d5e1
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-block/output.json
@@ -0,0 +1,276 @@
+{
+	"html": {
+		"type": "Fragment",
+		"start": 0,
+		"end": 150,
+		"children": [
+			{
+				"type": "Element",
+				"start": 0,
+				"end": 23,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 5,
+						"end": 7,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "IfBlock",
+						"start": 7,
+						"end": 17,
+						"expression": {
+							"type": "Identifier",
+							"start": 12,
+							"end": 15,
+							"loc": {
+								"start": {
+									"line": 2,
+									"column": 6
+								},
+								"end": {
+									"line": 2,
+									"column": 9
+								}
+							},
+							"name": "foo"
+						},
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 23,
+				"end": 25,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "InlineComponent",
+				"start": 25,
+				"end": 51,
+				"name": "Comp",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 31,
+						"end": 33,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "KeyBlock",
+						"start": 33,
+						"end": 44,
+						"expression": {
+							"type": "Identifier",
+							"start": 39,
+							"end": 42,
+							"loc": {
+								"start": {
+									"line": 6,
+									"column": 7
+								},
+								"end": {
+									"line": 6,
+									"column": 10
+								}
+							},
+							"name": "bar"
+						},
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 51,
+				"end": 53,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 53,
+				"end": 95,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 58,
+						"end": 60,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "IfBlock",
+						"start": 60,
+						"end": 89,
+						"expression": {
+							"type": "Identifier",
+							"start": 65,
+							"end": 68,
+							"loc": {
+								"start": {
+									"line": 10,
+									"column": 6
+								},
+								"end": {
+									"line": 10,
+									"column": 9
+								}
+							},
+							"name": "foo"
+						},
+						"children": [
+							{
+								"type": "IfBlock",
+								"start": 72,
+								"end": 88,
+								"expression": {
+									"type": "Identifier",
+									"start": 77,
+									"end": 80,
+									"loc": {
+										"start": {
+											"line": 11,
+											"column": 7
+										},
+										"end": {
+											"line": 11,
+											"column": 10
+										}
+									},
+									"name": "bar"
+								},
+								"children": []
+							}
+						]
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 95,
+				"end": 97,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"start": 97,
+				"end": 124,
+				"expression": {
+					"type": "Identifier",
+					"start": 102,
+					"end": 105,
+					"loc": {
+						"start": {
+							"line": 15,
+							"column": 5
+						},
+						"end": {
+							"line": 15,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"children": [
+					{
+						"type": "KeyBlock",
+						"start": 108,
+						"end": 119,
+						"expression": {
+							"type": "Identifier",
+							"start": 114,
+							"end": 117,
+							"loc": {
+								"start": {
+									"line": 16,
+									"column": 7
+								},
+								"end": {
+									"line": 16,
+									"column": 10
+								}
+							},
+							"name": "bar"
+						},
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 124,
+				"end": 126,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 126,
+				"end": 150,
+				"children": [
+					{
+						"type": "Element",
+						"start": 141,
+						"end": 150,
+						"name": "p",
+						"attributes": [],
+						"children": [
+							{
+								"type": "Text",
+								"start": 144,
+								"end": 146,
+								"raw": "hi",
+								"data": "hi"
+							}
+						]
+					}
+				],
+				"context": {
+					"type": "Identifier",
+					"name": "y",
+					"start": 138,
+					"loc": {
+						"start": {
+							"line": 19,
+							"column": 12,
+							"character": 138
+						},
+						"end": {
+							"line": 19,
+							"column": 13,
+							"character": 139
+						}
+					},
+					"end": 139
+				},
+				"expression": {
+					"type": "Identifier",
+					"start": 133,
+					"end": 134,
+					"loc": {
+						"start": {
+							"line": 19,
+							"column": 7
+						},
+						"end": {
+							"line": 19,
+							"column": 8
+						}
+					},
+					"name": "x"
+				}
+			}
+		]
+	}
+}
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/input.svelte b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/input.svelte
new file mode 100644
index 000000000000..ce82d23000c4
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/input.svelte
@@ -0,0 +1,20 @@
+<div>
+	<Comp foo={bar}
+</div>
+
+<div>
+	<span foo={bar}
+</div>
+
+{#if foo}
+	<Comp foo={bar}
+{/if}
+
+{#if foo}
+	<Comp foo={bar}
+	{#if bar}
+		{bar}
+	{/if}
+{/if}
+
+<div foo={bar}
\ No newline at end of file
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/output.json b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/output.json
new file mode 100644
index 000000000000..1792d6b8e638
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-open-tag/output.json
@@ -0,0 +1,349 @@
+{
+	"html": {
+		"type": "Fragment",
+		"start": 0,
+		"end": 170,
+		"children": [
+			{
+				"type": "Element",
+				"start": 0,
+				"end": 29,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 5,
+						"end": 7,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "InlineComponent",
+						"start": 7,
+						"end": 23,
+						"name": "Comp",
+						"attributes": [
+							{
+								"type": "Attribute",
+								"start": 13,
+								"end": 22,
+								"name": "foo",
+								"value": [
+									{
+										"type": "MustacheTag",
+										"start": 17,
+										"end": 22,
+										"expression": {
+											"type": "Identifier",
+											"start": 18,
+											"end": 21,
+											"loc": {
+												"start": {
+													"line": 2,
+													"column": 12
+												},
+												"end": {
+													"line": 2,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								]
+							}
+						],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 29,
+				"end": 31,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 31,
+				"end": 60,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 36,
+						"end": 38,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "Element",
+						"start": 38,
+						"end": 54,
+						"name": "span",
+						"attributes": [
+							{
+								"type": "Attribute",
+								"start": 44,
+								"end": 53,
+								"name": "foo",
+								"value": [
+									{
+										"type": "MustacheTag",
+										"start": 48,
+										"end": 53,
+										"expression": {
+											"type": "Identifier",
+											"start": 49,
+											"end": 52,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 12
+												},
+												"end": {
+													"line": 6,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								]
+							}
+						],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 60,
+				"end": 62,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"start": 62,
+				"end": 94,
+				"expression": {
+					"type": "Identifier",
+					"start": 67,
+					"end": 70,
+					"loc": {
+						"start": {
+							"line": 9,
+							"column": 5
+						},
+						"end": {
+							"line": 9,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"children": [
+					{
+						"type": "InlineComponent",
+						"start": 73,
+						"end": 89,
+						"name": "Comp",
+						"attributes": [
+							{
+								"type": "Attribute",
+								"start": 79,
+								"end": 88,
+								"name": "foo",
+								"value": [
+									{
+										"type": "MustacheTag",
+										"start": 83,
+										"end": 88,
+										"expression": {
+											"type": "Identifier",
+											"start": 84,
+											"end": 87,
+											"loc": {
+												"start": {
+													"line": 10,
+													"column": 12
+												},
+												"end": {
+													"line": 10,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								]
+							}
+						],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 94,
+				"end": 96,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"start": 96,
+				"end": 154,
+				"expression": {
+					"type": "Identifier",
+					"start": 101,
+					"end": 104,
+					"loc": {
+						"start": {
+							"line": 13,
+							"column": 5
+						},
+						"end": {
+							"line": 13,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"children": [
+					{
+						"type": "InlineComponent",
+						"start": 107,
+						"end": 124,
+						"name": "Comp",
+						"attributes": [
+							{
+								"type": "Attribute",
+								"start": 113,
+								"end": 122,
+								"name": "foo",
+								"value": [
+									{
+										"type": "MustacheTag",
+										"start": 117,
+										"end": 122,
+										"expression": {
+											"type": "Identifier",
+											"start": 118,
+											"end": 121,
+											"loc": {
+												"start": {
+													"line": 14,
+													"column": 12
+												},
+												"end": {
+													"line": 14,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								]
+							}
+						],
+						"children": []
+					},
+					{
+						"type": "IfBlock",
+						"start": 124,
+						"end": 148,
+						"expression": {
+							"type": "Identifier",
+							"start": 129,
+							"end": 132,
+							"loc": {
+								"start": {
+									"line": 15,
+									"column": 6
+								},
+								"end": {
+									"line": 15,
+									"column": 9
+								}
+							},
+							"name": "bar"
+						},
+						"children": [
+							{
+								"type": "MustacheTag",
+								"start": 136,
+								"end": 141,
+								"expression": {
+									"type": "Identifier",
+									"start": 137,
+									"end": 140,
+									"loc": {
+										"start": {
+											"line": 16,
+											"column": 3
+										},
+										"end": {
+											"line": 16,
+											"column": 6
+										}
+									},
+									"name": "bar"
+								}
+							}
+						]
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 154,
+				"end": 156,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 156,
+				"end": 170,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 161,
+						"end": 170,
+						"name": "foo",
+						"value": [
+							{
+								"type": "MustacheTag",
+								"start": 165,
+								"end": 170,
+								"expression": {
+									"type": "Identifier",
+									"start": 166,
+									"end": 169,
+									"loc": {
+										"start": {
+											"line": 20,
+											"column": 10
+										},
+										"end": {
+											"line": 20,
+											"column": 13
+										}
+									},
+									"name": "bar"
+								}
+							}
+						]
+					}
+				],
+				"children": []
+			}
+		]
+	}
+}
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/input.svelte b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/input.svelte
new file mode 100644
index 000000000000..10a3876b7c0f
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/input.svelte
@@ -0,0 +1,24 @@
+<div>
+	<Comp>
+</div>
+
+<div>
+	<Comp foo={bar}
+</div>
+
+<div>
+	<span
+</div>
+
+{#if foo}
+	<div>
+{/if}
+
+{#if foo}
+	<Comp foo={bar}
+{/if}
+
+<div>
+<p>hi</p>
+
+<open-ended
diff --git a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/output.json b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/output.json
new file mode 100644
index 000000000000..d91cc68098c3
--- /dev/null
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/output.json
@@ -0,0 +1,301 @@
+{
+	"html": {
+		"type": "Fragment",
+		"start": 0,
+		"end": 160,
+		"children": [
+			{
+				"type": "Element",
+				"start": 0,
+				"end": 20,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 5,
+						"end": 7,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "InlineComponent",
+						"start": 7,
+						"end": 14,
+						"name": "Comp",
+						"attributes": [],
+						"children": [
+							{
+								"type": "Text",
+								"start": 13,
+								"end": 14,
+								"raw": "\n",
+								"data": "\n"
+							}
+						]
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 20,
+				"end": 22,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 22,
+				"end": 51,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 27,
+						"end": 29,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "InlineComponent",
+						"start": 29,
+						"end": 45,
+						"name": "Comp",
+						"attributes": [
+							{
+								"type": "Attribute",
+								"start": 35,
+								"end": 44,
+								"name": "foo",
+								"value": [
+									{
+										"type": "MustacheTag",
+										"start": 39,
+										"end": 44,
+										"expression": {
+											"type": "Identifier",
+											"start": 40,
+											"end": 43,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 12
+												},
+												"end": {
+													"line": 6,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								]
+							}
+						],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 51,
+				"end": 53,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 53,
+				"end": 72,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 58,
+						"end": 60,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "Element",
+						"start": 60,
+						"end": 66,
+						"name": "span",
+						"attributes": [],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 72,
+				"end": 74,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"start": 74,
+				"end": 96,
+				"expression": {
+					"type": "Identifier",
+					"start": 79,
+					"end": 82,
+					"loc": {
+						"start": {
+							"line": 13,
+							"column": 5
+						},
+						"end": {
+							"line": 13,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"children": [
+					{
+						"type": "Element",
+						"start": 85,
+						"end": 91,
+						"name": "div",
+						"attributes": [],
+						"children": [
+							{
+								"type": "Text",
+								"start": 90,
+								"end": 91,
+								"raw": "\n",
+								"data": "\n"
+							}
+						]
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 96,
+				"end": 98,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"start": 98,
+				"end": 130,
+				"expression": {
+					"type": "Identifier",
+					"start": 103,
+					"end": 106,
+					"loc": {
+						"start": {
+							"line": 17,
+							"column": 5
+						},
+						"end": {
+							"line": 17,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"children": [
+					{
+						"type": "InlineComponent",
+						"start": 109,
+						"end": 125,
+						"name": "Comp",
+						"attributes": [
+							{
+								"type": "Attribute",
+								"start": 115,
+								"end": 124,
+								"name": "foo",
+								"value": [
+									{
+										"type": "MustacheTag",
+										"start": 119,
+										"end": 124,
+										"expression": {
+											"type": "Identifier",
+											"start": 120,
+											"end": 123,
+											"loc": {
+												"start": {
+													"line": 18,
+													"column": 12
+												},
+												"end": {
+													"line": 18,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								]
+							}
+						],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 130,
+				"end": 132,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 132,
+				"end": 160,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 137,
+						"end": 138,
+						"raw": "\n",
+						"data": "\n"
+					},
+					{
+						"type": "Element",
+						"start": 138,
+						"end": 147,
+						"name": "p",
+						"attributes": [],
+						"children": [
+							{
+								"type": "Text",
+								"start": 141,
+								"end": 143,
+								"raw": "hi",
+								"data": "hi"
+							}
+						]
+					},
+					{
+						"type": "Text",
+						"start": 147,
+						"end": 149,
+						"raw": "\n\n",
+						"data": "\n\n"
+					},
+					{
+						"type": "Element",
+						"start": 149,
+						"end": 160,
+						"name": "open-ended",
+						"attributes": [],
+						"children": []
+					}
+				]
+			}
+		]
+	}
+}
diff --git a/packages/svelte/tests/parser-legacy/test.ts b/packages/svelte/tests/parser-legacy/test.ts
index ad93a0f2e91f..987253d8d069 100644
--- a/packages/svelte/tests/parser-legacy/test.ts
+++ b/packages/svelte/tests/parser-legacy/test.ts
@@ -12,7 +12,9 @@ const { test, run } = suite<ParserTest>(async (config, cwd) => {
 		.replace(/\s+$/, '')
 		.replace(/\r/g, '');
 
-	const actual = JSON.parse(JSON.stringify(parse(input)));
+	const actual = JSON.parse(
+		JSON.stringify(parse(input, { loose: cwd.split('/').pop()!.startsWith('loose-') }))
+	);
 
 	// run `UPDATE_SNAPSHOTS=true pnpm test parser` to update parser tests
 	if (process.env.UPDATE_SNAPSHOTS) {
diff --git a/packages/svelte/tests/parser-modern/samples/loose-invalid-block/input.svelte b/packages/svelte/tests/parser-modern/samples/loose-invalid-block/input.svelte
new file mode 100644
index 000000000000..4489a3eb278b
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-invalid-block/input.svelte
@@ -0,0 +1,13 @@
+{#if }
+{:else if }
+{:else }
+{/if}
+
+{#each }
+{/each}
+
+{#snippet }
+{/snippet}
+
+{#snippet foo}
+{/snippet}
diff --git a/packages/svelte/tests/parser-modern/samples/loose-invalid-block/output.json b/packages/svelte/tests/parser-modern/samples/loose-invalid-block/output.json
new file mode 100644
index 000000000000..46aad16b2169
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-invalid-block/output.json
@@ -0,0 +1,171 @@
+{
+	"css": null,
+	"js": [],
+	"start": 0,
+	"end": 102,
+	"type": "Root",
+	"fragment": {
+		"type": "Fragment",
+		"nodes": [
+			{
+				"type": "IfBlock",
+				"elseif": false,
+				"start": 0,
+				"end": 33,
+				"test": {
+					"type": "Identifier",
+					"start": 5,
+					"end": 5,
+					"name": ""
+				},
+				"consequent": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 6,
+							"end": 7,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				},
+				"alternate": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"start": 7,
+							"end": 33,
+							"type": "IfBlock",
+							"elseif": true,
+							"test": {
+								"type": "Identifier",
+								"start": 17,
+								"end": 17,
+								"name": ""
+							},
+							"consequent": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "Text",
+										"start": 18,
+										"end": 19,
+										"raw": "\n",
+										"data": "\n"
+									}
+								]
+							},
+							"alternate": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "Text",
+										"start": 27,
+										"end": 28,
+										"raw": "\n",
+										"data": "\n"
+									}
+								]
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 33,
+				"end": 35,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 35,
+				"end": 51,
+				"expression": {
+					"type": "Identifier",
+					"start": 42,
+					"end": 42,
+					"name": ""
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 43,
+							"end": 44,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				},
+				"context": null
+			},
+			{
+				"type": "Text",
+				"start": 51,
+				"end": 53,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "SnippetBlock",
+				"start": 53,
+				"end": 75,
+				"expression": {
+					"type": "Identifier",
+					"start": 63,
+					"end": 63,
+					"name": ""
+				},
+				"parameters": [],
+				"body": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 64,
+							"end": 65,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 75,
+				"end": 77,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "SnippetBlock",
+				"start": 77,
+				"end": 102,
+				"expression": {
+					"type": "Identifier",
+					"start": 87,
+					"end": 90,
+					"name": "foo"
+				},
+				"parameters": [],
+				"body": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 91,
+							"end": 92,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				}
+			}
+		]
+	},
+	"options": null
+}
diff --git a/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/input.svelte b/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/input.svelte
new file mode 100644
index 000000000000..a0977b9a6346
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/input.svelte
@@ -0,0 +1,11 @@
+<div {}></div>
+<div foo={}></div>
+
+<div foo={a.}></div>
+<div foo={'hi}'.}></div>
+<Component onclick={() => x.} />
+
+<input bind:value={a.} />
+
+asd{a.}asd
+{foo[bar.]}
diff --git a/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/output.json b/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/output.json
new file mode 100644
index 000000000000..cdb7f66c5807
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/output.json
@@ -0,0 +1,254 @@
+{
+	"css": null,
+	"js": [],
+	"start": 0,
+	"end": 164,
+	"type": "Root",
+	"fragment": {
+		"type": "Fragment",
+		"nodes": [
+			{
+				"type": "RegularElement",
+				"start": 0,
+				"end": 14,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 5,
+						"end": 7,
+						"name": "",
+						"value": {
+							"type": "ExpressionTag",
+							"start": 6,
+							"end": 6,
+							"expression": {
+								"start": 6,
+								"end": 6,
+								"type": "Identifier",
+								"name": ""
+							}
+						}
+					}
+				],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": []
+				}
+			},
+			{
+				"type": "Text",
+				"start": 14,
+				"end": 15,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 15,
+				"end": 33,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 20,
+						"end": 26,
+						"name": "foo",
+						"value": {
+							"type": "ExpressionTag",
+							"start": 24,
+							"end": 26,
+							"expression": {
+								"type": "Identifier",
+								"start": 25,
+								"end": 25,
+								"name": ""
+							}
+						}
+					}
+				],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": []
+				}
+			},
+			{
+				"type": "Text",
+				"start": 33,
+				"end": 35,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 35,
+				"end": 55,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 40,
+						"end": 48,
+						"name": "foo",
+						"value": {
+							"type": "ExpressionTag",
+							"start": 44,
+							"end": 48,
+							"expression": {
+								"type": "Identifier",
+								"start": 45,
+								"end": 47,
+								"name": ""
+							}
+						}
+					}
+				],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": []
+				}
+			},
+			{
+				"type": "Text",
+				"start": 55,
+				"end": 56,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 56,
+				"end": 80,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 61,
+						"end": 73,
+						"name": "foo",
+						"value": {
+							"type": "ExpressionTag",
+							"start": 65,
+							"end": 73,
+							"expression": {
+								"type": "Identifier",
+								"start": 66,
+								"end": 72,
+								"name": ""
+							}
+						}
+					}
+				],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": []
+				}
+			},
+			{
+				"type": "Text",
+				"start": 80,
+				"end": 81,
+				"raw": "\n",
+				"data": "\n"
+			},
+			{
+				"type": "Component",
+				"start": 81,
+				"end": 113,
+				"name": "Component",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 92,
+						"end": 110,
+						"name": "onclick",
+						"value": {
+							"type": "ExpressionTag",
+							"start": 100,
+							"end": 110,
+							"expression": {
+								"type": "Identifier",
+								"start": 101,
+								"end": 109,
+								"name": ""
+							}
+						}
+					}
+				],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": []
+				}
+			},
+			{
+				"type": "Text",
+				"start": 113,
+				"end": 115,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 115,
+				"end": 140,
+				"name": "input",
+				"attributes": [
+					{
+						"start": 122,
+						"end": 137,
+						"type": "BindDirective",
+						"name": "value",
+						"expression": {
+							"type": "Identifier",
+							"start": 134,
+							"end": 136,
+							"name": ""
+						},
+						"modifiers": []
+					}
+				],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": []
+				}
+			},
+			{
+				"type": "Text",
+				"start": 140,
+				"end": 145,
+				"raw": "\n\nasd",
+				"data": "\n\nasd"
+			},
+			{
+				"type": "ExpressionTag",
+				"start": 145,
+				"end": 149,
+				"expression": {
+					"type": "Identifier",
+					"start": 146,
+					"end": 148,
+					"name": ""
+				}
+			},
+			{
+				"type": "Text",
+				"start": 149,
+				"end": 153,
+				"raw": "asd\n",
+				"data": "asd\n"
+			},
+			{
+				"type": "ExpressionTag",
+				"start": 153,
+				"end": 164,
+				"expression": {
+					"type": "Identifier",
+					"start": 154,
+					"end": 163,
+					"name": ""
+				}
+			}
+		]
+	},
+	"options": null
+}
diff --git a/packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/input.svelte b/packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/input.svelte
new file mode 100644
index 000000000000..ce82d23000c4
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/input.svelte
@@ -0,0 +1,20 @@
+<div>
+	<Comp foo={bar}
+</div>
+
+<div>
+	<span foo={bar}
+</div>
+
+{#if foo}
+	<Comp foo={bar}
+{/if}
+
+{#if foo}
+	<Comp foo={bar}
+	{#if bar}
+		{bar}
+	{/if}
+{/if}
+
+<div foo={bar}
\ No newline at end of file
diff --git a/packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/output.json b/packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/output.json
new file mode 100644
index 000000000000..a0e13d4352aa
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-unclosed-open-tag/output.json
@@ -0,0 +1,414 @@
+{
+	"css": null,
+	"js": [],
+	"start": 0,
+	"end": 170,
+	"type": "Root",
+	"fragment": {
+		"type": "Fragment",
+		"nodes": [
+			{
+				"type": "RegularElement",
+				"start": 0,
+				"end": 29,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 5,
+							"end": 7,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 7,
+							"end": 23,
+							"name": "Comp",
+							"attributes": [
+								{
+									"type": "Attribute",
+									"start": 13,
+									"end": 22,
+									"name": "foo",
+									"value": {
+										"type": "ExpressionTag",
+										"start": 17,
+										"end": 22,
+										"expression": {
+											"type": "Identifier",
+											"start": 18,
+											"end": 21,
+											"loc": {
+												"start": {
+													"line": 2,
+													"column": 12
+												},
+												"end": {
+													"line": 2,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								}
+							],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 29,
+				"end": 31,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 31,
+				"end": 60,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 36,
+							"end": 38,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "RegularElement",
+							"start": 38,
+							"end": 54,
+							"name": "span",
+							"attributes": [
+								{
+									"type": "Attribute",
+									"start": 44,
+									"end": 53,
+									"name": "foo",
+									"value": {
+										"type": "ExpressionTag",
+										"start": 48,
+										"end": 53,
+										"expression": {
+											"type": "Identifier",
+											"start": 49,
+											"end": 52,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 12
+												},
+												"end": {
+													"line": 6,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								}
+							],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 60,
+				"end": 62,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"elseif": false,
+				"start": 62,
+				"end": 94,
+				"test": {
+					"type": "Identifier",
+					"start": 67,
+					"end": 70,
+					"loc": {
+						"start": {
+							"line": 9,
+							"column": 5
+						},
+						"end": {
+							"line": 9,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"consequent": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 71,
+							"end": 73,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 73,
+							"end": 89,
+							"name": "Comp",
+							"attributes": [
+								{
+									"type": "Attribute",
+									"start": 79,
+									"end": 88,
+									"name": "foo",
+									"value": {
+										"type": "ExpressionTag",
+										"start": 83,
+										"end": 88,
+										"expression": {
+											"type": "Identifier",
+											"start": 84,
+											"end": 87,
+											"loc": {
+												"start": {
+													"line": 10,
+													"column": 12
+												},
+												"end": {
+													"line": 10,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								}
+							],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				},
+				"alternate": null
+			},
+			{
+				"type": "Text",
+				"start": 94,
+				"end": 96,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"elseif": false,
+				"start": 96,
+				"end": 154,
+				"test": {
+					"type": "Identifier",
+					"start": 101,
+					"end": 104,
+					"loc": {
+						"start": {
+							"line": 13,
+							"column": 5
+						},
+						"end": {
+							"line": 13,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"consequent": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 105,
+							"end": 107,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 107,
+							"end": 124,
+							"name": "Comp",
+							"attributes": [
+								{
+									"type": "Attribute",
+									"start": 113,
+									"end": 122,
+									"name": "foo",
+									"value": {
+										"type": "ExpressionTag",
+										"start": 117,
+										"end": 122,
+										"expression": {
+											"type": "Identifier",
+											"start": 118,
+											"end": 121,
+											"loc": {
+												"start": {
+													"line": 14,
+													"column": 12
+												},
+												"end": {
+													"line": 14,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								}
+							],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						},
+						{
+							"type": "IfBlock",
+							"elseif": false,
+							"start": 124,
+							"end": 148,
+							"test": {
+								"type": "Identifier",
+								"start": 129,
+								"end": 132,
+								"loc": {
+									"start": {
+										"line": 15,
+										"column": 6
+									},
+									"end": {
+										"line": 15,
+										"column": 9
+									}
+								},
+								"name": "bar"
+							},
+							"consequent": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "Text",
+										"start": 133,
+										"end": 136,
+										"raw": "\n\t\t",
+										"data": "\n\t\t"
+									},
+									{
+										"type": "ExpressionTag",
+										"start": 136,
+										"end": 141,
+										"expression": {
+											"type": "Identifier",
+											"start": 137,
+											"end": 140,
+											"loc": {
+												"start": {
+													"line": 16,
+													"column": 3
+												},
+												"end": {
+													"line": 16,
+													"column": 6
+												}
+											},
+											"name": "bar"
+										}
+									},
+									{
+										"type": "Text",
+										"start": 141,
+										"end": 143,
+										"raw": "\n\t",
+										"data": "\n\t"
+									}
+								]
+							},
+							"alternate": null
+						},
+						{
+							"type": "Text",
+							"start": 148,
+							"end": 149,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				},
+				"alternate": null
+			},
+			{
+				"type": "Text",
+				"start": 154,
+				"end": 156,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 156,
+				"end": 170,
+				"name": "div",
+				"attributes": [
+					{
+						"type": "Attribute",
+						"start": 161,
+						"end": 170,
+						"name": "foo",
+						"value": {
+							"type": "ExpressionTag",
+							"start": 165,
+							"end": 170,
+							"expression": {
+								"type": "Identifier",
+								"start": 166,
+								"end": 169,
+								"loc": {
+									"start": {
+										"line": 20,
+										"column": 10
+									},
+									"end": {
+										"line": 20,
+										"column": 13
+									}
+								},
+								"name": "bar"
+							}
+						}
+					}
+				],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": []
+				}
+			}
+		]
+	},
+	"options": null
+}
diff --git a/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/input.svelte b/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/input.svelte
new file mode 100644
index 000000000000..10a3876b7c0f
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/input.svelte
@@ -0,0 +1,24 @@
+<div>
+	<Comp>
+</div>
+
+<div>
+	<Comp foo={bar}
+</div>
+
+<div>
+	<span
+</div>
+
+{#if foo}
+	<div>
+{/if}
+
+{#if foo}
+	<Comp foo={bar}
+{/if}
+
+<div>
+<p>hi</p>
+
+<open-ended
diff --git a/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/output.json b/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/output.json
new file mode 100644
index 000000000000..ec47bfc738f0
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/output.json
@@ -0,0 +1,358 @@
+{
+	"css": null,
+	"js": [],
+	"start": 0,
+	"end": 160,
+	"type": "Root",
+	"fragment": {
+		"type": "Fragment",
+		"nodes": [
+			{
+				"type": "RegularElement",
+				"start": 0,
+				"end": 20,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 5,
+							"end": 7,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 7,
+							"end": 14,
+							"name": "Comp",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "Text",
+										"start": 13,
+										"end": 14,
+										"raw": "\n",
+										"data": "\n"
+									}
+								]
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 20,
+				"end": 22,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 22,
+				"end": 51,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 27,
+							"end": 29,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 29,
+							"end": 45,
+							"name": "Comp",
+							"attributes": [
+								{
+									"type": "Attribute",
+									"start": 35,
+									"end": 44,
+									"name": "foo",
+									"value": {
+										"type": "ExpressionTag",
+										"start": 39,
+										"end": 44,
+										"expression": {
+											"type": "Identifier",
+											"start": 40,
+											"end": 43,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 12
+												},
+												"end": {
+													"line": 6,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								}
+							],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 51,
+				"end": 53,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 53,
+				"end": 72,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 58,
+							"end": 60,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "RegularElement",
+							"start": 60,
+							"end": 66,
+							"name": "span",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 72,
+				"end": 74,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"elseif": false,
+				"start": 74,
+				"end": 96,
+				"test": {
+					"type": "Identifier",
+					"start": 79,
+					"end": 82,
+					"loc": {
+						"start": {
+							"line": 13,
+							"column": 5
+						},
+						"end": {
+							"line": 13,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"consequent": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 83,
+							"end": 85,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "RegularElement",
+							"start": 85,
+							"end": 91,
+							"name": "div",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "Text",
+										"start": 90,
+										"end": 91,
+										"raw": "\n",
+										"data": "\n"
+									}
+								]
+							}
+						}
+					]
+				},
+				"alternate": null
+			},
+			{
+				"type": "Text",
+				"start": 96,
+				"end": 98,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"elseif": false,
+				"start": 98,
+				"end": 130,
+				"test": {
+					"type": "Identifier",
+					"start": 103,
+					"end": 106,
+					"loc": {
+						"start": {
+							"line": 17,
+							"column": 5
+						},
+						"end": {
+							"line": 17,
+							"column": 8
+						}
+					},
+					"name": "foo"
+				},
+				"consequent": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 107,
+							"end": 109,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 109,
+							"end": 125,
+							"name": "Comp",
+							"attributes": [
+								{
+									"type": "Attribute",
+									"start": 115,
+									"end": 124,
+									"name": "foo",
+									"value": {
+										"type": "ExpressionTag",
+										"start": 119,
+										"end": 124,
+										"expression": {
+											"type": "Identifier",
+											"start": 120,
+											"end": 123,
+											"loc": {
+												"start": {
+													"line": 18,
+													"column": 12
+												},
+												"end": {
+													"line": 18,
+													"column": 15
+												}
+											},
+											"name": "bar"
+										}
+									}
+								}
+							],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				},
+				"alternate": null
+			},
+			{
+				"type": "Text",
+				"start": 130,
+				"end": 132,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 132,
+				"end": 160,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 137,
+							"end": 138,
+							"raw": "\n",
+							"data": "\n"
+						},
+						{
+							"type": "RegularElement",
+							"start": 138,
+							"end": 147,
+							"name": "p",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "Text",
+										"start": 141,
+										"end": 143,
+										"raw": "hi",
+										"data": "hi"
+									}
+								]
+							}
+						},
+						{
+							"type": "Text",
+							"start": 147,
+							"end": 149,
+							"raw": "\n\n",
+							"data": "\n\n"
+						},
+						{
+							"type": "RegularElement",
+							"start": 149,
+							"end": 160,
+							"name": "open-ended",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				}
+			}
+		]
+	},
+	"options": null
+}
diff --git a/packages/svelte/tests/parser-modern/test.ts b/packages/svelte/tests/parser-modern/test.ts
index 04af8b0780e3..b47d4a48796e 100644
--- a/packages/svelte/tests/parser-modern/test.ts
+++ b/packages/svelte/tests/parser-modern/test.ts
@@ -15,7 +15,8 @@ const { test, run } = suite<ParserTest>(async (config, cwd) => {
 	const actual = JSON.parse(
 		JSON.stringify(
 			parse(input, {
-				modern: true
+				modern: true,
+				loose: cwd.split('/').pop()!.startsWith('loose-')
 			})
 		)
 	);
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index a36be7f2e4a1..562ce9599886 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -632,6 +632,7 @@ declare module 'svelte/compiler' {
 	export function parse(source: string, options: {
 		filename?: string;
 		modern: true;
+		loose?: boolean;
 	}): AST.Root;
 	/**
 	 * The parse function parses a component, returning only its abstract syntax tree.
@@ -643,6 +644,7 @@ declare module 'svelte/compiler' {
 	export function parse(source: string, options?: {
 		filename?: string;
 		modern?: false;
+		loose?: boolean;
 	} | undefined): Record<string, any>;
 	/**
 	 * @deprecated Replace this with `import { walk } from 'estree-walker'`

From b0e3c5b438f61d36710f141555aadde68f6e733b Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sat, 14 Dec 2024 09:05:47 -0500
Subject: [PATCH 59/62] feat: add outro option to unmount (#14540)

* feat: add outro option to unmount

* unused

* regenerate

* revert

* changeset

* create separate component_root effect

* docs

* return a promise

* remove from map immediately
---
 .changeset/sour-jeans-talk.md                 |  5 +++
 .../06-runtime/04-imperative-component-api.md | 11 ++++---
 .../src/internal/client/reactivity/effects.js | 24 ++++++++++++++
 packages/svelte/src/internal/client/render.js | 33 +++++++++++++++----
 packages/svelte/types/index.d.ts              | 18 +++++++++-
 5 files changed, 80 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/sour-jeans-talk.md

diff --git a/.changeset/sour-jeans-talk.md b/.changeset/sour-jeans-talk.md
new file mode 100644
index 000000000000..7eaebde1f6b3
--- /dev/null
+++ b/.changeset/sour-jeans-talk.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+feat: add `outro` option to `unmount`
diff --git a/documentation/docs/06-runtime/04-imperative-component-api.md b/documentation/docs/06-runtime/04-imperative-component-api.md
index ffd03d85a6aa..16a2c8151cad 100644
--- a/documentation/docs/06-runtime/04-imperative-component-api.md
+++ b/documentation/docs/06-runtime/04-imperative-component-api.md
@@ -33,19 +33,22 @@ Note that unlike calling `new App(...)` in Svelte 4, things like effects (includ
 
 ## `unmount`
 
-Unmounts a component created with [`mount`](#mount) or [`hydrate`](#hydrate):
+Unmounts a component that was previously created with [`mount`](#mount) or [`hydrate`](#hydrate).
+
+If `options.outro` is `true`, [transitions](transition) will play before the component is removed from the DOM:
 
 ```js
-// @errors: 1109
 import { mount, unmount } from 'svelte';
 import App from './App.svelte';
 
-const app = mount(App, {...});
+const app = mount(App, { target: document.body });
 
 // later
-unmount(app);
+unmount(app, { outro: true });
 ```
 
+Returns a `Promise` that resolves after transitions have completed if `options.outro` is true, or immediately otherwise.
+
 ## `render`
 
 Only available on the server and when compiling with the `server` option. Takes a component and returns an object with `body` and `head` properties on it, which you can use to populate the HTML when server-rendering your app:
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index 77502edb904a..05c210978d86 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -248,11 +248,35 @@ export function inspect_effect(fn) {
  */
 export function effect_root(fn) {
 	const effect = create_effect(ROOT_EFFECT, fn, true);
+
 	return () => {
 		destroy_effect(effect);
 	};
 }
 
+/**
+ * An effect root whose children can transition out
+ * @param {() => void} fn
+ * @returns {(options?: { outro?: boolean }) => Promise<void>}
+ */
+export function component_root(fn) {
+	const effect = create_effect(ROOT_EFFECT, fn, true);
+
+	return (options = {}) => {
+		return new Promise((fulfil) => {
+			if (options.outro) {
+				pause_effect(effect, () => {
+					destroy_effect(effect);
+					fulfil(undefined);
+				});
+			} else {
+				destroy_effect(effect);
+				fulfil(undefined);
+			}
+		});
+	};
+}
+
 /**
  * @param {() => void | (() => void)} fn
  * @returns {Effect}
diff --git a/packages/svelte/src/internal/client/render.js b/packages/svelte/src/internal/client/render.js
index 6e86968c7aff..f4b7944c14c5 100644
--- a/packages/svelte/src/internal/client/render.js
+++ b/packages/svelte/src/internal/client/render.js
@@ -10,7 +10,7 @@ import {
 } from './dom/operations.js';
 import { HYDRATION_END, HYDRATION_ERROR, HYDRATION_START } from '../../constants.js';
 import { push, pop, component_context, active_effect } from './runtime.js';
-import { effect_root, branch } from './reactivity/effects.js';
+import { component_root, branch } from './reactivity/effects.js';
 import {
 	hydrate_next,
 	hydrate_node,
@@ -204,7 +204,7 @@ function _mount(Component, { target, anchor, props = {}, events, context, intro
 	// @ts-expect-error will be defined because the render effect runs synchronously
 	var component = undefined;
 
-	var unmount = effect_root(() => {
+	var unmount = component_root(() => {
 		var anchor_node = anchor ?? target.appendChild(create_text());
 
 		branch(() => {
@@ -252,7 +252,7 @@ function _mount(Component, { target, anchor, props = {}, events, context, intro
 			}
 
 			root_event_handles.delete(event_handle);
-			mounted_components.delete(component);
+
 			if (anchor_node !== anchor) {
 				anchor_node.parentNode?.removeChild(anchor_node);
 			}
@@ -271,14 +271,35 @@ let mounted_components = new WeakMap();
 
 /**
  * Unmounts a component that was previously mounted using `mount` or `hydrate`.
+ *
+ * If `options.outro` is `true`, [transitions](https://svelte.dev/docs/svelte/transition) will play before the component is removed from the DOM.
+ *
+ * Returns a `Promise` that resolves after transitions have completed if `options.outro` is true, or immediately otherwise.
+ *
+ * ```js
+ * import { mount, unmount } from 'svelte';
+ * import App from './App.svelte';
+ *
+ * const app = mount(App, { target: document.body });
+ *
+ * // later...
+ * unmount(app, { outro: true });
+ * ```
  * @param {Record<string, any>} component
+ * @param {{ outro?: boolean }} [options]
+ * @returns {Promise<void>}
  */
-export function unmount(component) {
+export function unmount(component, options) {
 	const fn = mounted_components.get(component);
 
 	if (fn) {
-		fn();
-	} else if (DEV) {
+		mounted_components.delete(component);
+		return fn(options);
+	}
+
+	if (DEV) {
 		w.lifecycle_double_unmount();
 	}
+
+	return Promise.resolve();
 }
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 562ce9599886..bafa7a2265e5 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -448,8 +448,24 @@ declare module 'svelte' {
 	}): Exports;
 	/**
 	 * Unmounts a component that was previously mounted using `mount` or `hydrate`.
+	 *
+	 * If `options.outro` is `true`, [transitions](https://svelte.dev/docs/svelte/transition) will play before the component is removed from the DOM.
+	 *
+	 * Returns a `Promise` that resolves after transitions have completed if `options.outro` is true, or immediately otherwise.
+	 *
+	 * ```js
+	 * import { mount, unmount } from 'svelte';
+	 * import App from './App.svelte';
+	 *
+	 * const app = mount(App, { target: document.body });
+	 *
+	 * // later...
+	 * unmount(app, { outro: true });
+	 * ```
 	 * */
-	export function unmount(component: Record<string, any>): void;
+	export function unmount(component: Record<string, any>, options?: {
+		outro?: boolean;
+	} | undefined): Promise<void>;
 	/**
 	 * Returns a promise that resolves once any pending state changes have been applied.
 	 * */

From ecd1b4809549e3787ae9a92683bdee0b986b3b66 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sat, 14 Dec 2024 09:12:51 -0500
Subject: [PATCH 60/62] bump changeset to minor (#14710)

---
 .changeset/sour-jeans-talk.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/sour-jeans-talk.md b/.changeset/sour-jeans-talk.md
index 7eaebde1f6b3..f8108adcee93 100644
--- a/.changeset/sour-jeans-talk.md
+++ b/.changeset/sour-jeans-talk.md
@@ -1,5 +1,5 @@
 ---
-'svelte': patch
+'svelte': minor
 ---
 
 feat: add `outro` option to `unmount`

From 9f964177eca671ca1e4fc62716f80cd2b2a4b35b Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sat, 14 Dec 2024 09:15:40 -0500
Subject: [PATCH 61/62] note when features were added (#14709)

* note when features were added

* regenerate
---
 packages/svelte/src/compiler/index.js         | 2 ++
 packages/svelte/src/internal/client/render.js | 4 ++--
 packages/svelte/types/index.d.ts              | 4 ++--
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/svelte/src/compiler/index.js b/packages/svelte/src/compiler/index.js
index 74678f518daf..42427dd9c407 100644
--- a/packages/svelte/src/compiler/index.js
+++ b/packages/svelte/src/compiler/index.js
@@ -98,6 +98,8 @@ export function compileModule(source, options) {
  * The `modern` option (`false` by default in Svelte 5) makes the parser return a modern AST instead of the legacy AST.
  * `modern` will become `true` by default in Svelte 6, and the option will be removed in Svelte 7.
  *
+ * The `loose` option, available since 5.13.0, tries to always return an AST even if the input will not successfully compile.
+ *
  * @param {string} source
  * @param {{ filename?: string; rootDir?: string; modern?: boolean; loose?: boolean }} [options]
  * @returns {AST.Root | LegacyRoot}
diff --git a/packages/svelte/src/internal/client/render.js b/packages/svelte/src/internal/client/render.js
index f4b7944c14c5..767b23013169 100644
--- a/packages/svelte/src/internal/client/render.js
+++ b/packages/svelte/src/internal/client/render.js
@@ -272,9 +272,9 @@ let mounted_components = new WeakMap();
 /**
  * Unmounts a component that was previously mounted using `mount` or `hydrate`.
  *
- * If `options.outro` is `true`, [transitions](https://svelte.dev/docs/svelte/transition) will play before the component is removed from the DOM.
+ * Since 5.13.0, if `options.outro` is `true`, [transitions](https://svelte.dev/docs/svelte/transition) will play before the component is removed from the DOM.
  *
- * Returns a `Promise` that resolves after transitions have completed if `options.outro` is true, or immediately otherwise.
+ * Returns a `Promise` that resolves after transitions have completed if `options.outro` is true, or immediately otherwise (prior to 5.13.0, returns `void`).
  *
  * ```js
  * import { mount, unmount } from 'svelte';
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index bafa7a2265e5..dca0fd99f0b7 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -449,9 +449,9 @@ declare module 'svelte' {
 	/**
 	 * Unmounts a component that was previously mounted using `mount` or `hydrate`.
 	 *
-	 * If `options.outro` is `true`, [transitions](https://svelte.dev/docs/svelte/transition) will play before the component is removed from the DOM.
+	 * Since 5.13.0, if `options.outro` is `true`, [transitions](https://svelte.dev/docs/svelte/transition) will play before the component is removed from the DOM.
 	 *
-	 * Returns a `Promise` that resolves after transitions have completed if `options.outro` is true, or immediately otherwise.
+	 * Returns a `Promise` that resolves after transitions have completed if `options.outro` is true, or immediately otherwise (prior to 5.13.0, returns `void`).
 	 *
 	 * ```js
 	 * import { mount, unmount } from 'svelte';

From 64a32cec389bc34b647555393fff8180acf67a0c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sat, 14 Dec 2024 09:18:45 -0500
Subject: [PATCH 62/62] Version Packages (#14708)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/sour-jeans-talk.md    | 5 -----
 .changeset/twelve-hairs-marry.md | 5 -----
 packages/svelte/CHANGELOG.md     | 8 ++++++++
 packages/svelte/package.json     | 2 +-
 packages/svelte/src/version.js   | 2 +-
 5 files changed, 10 insertions(+), 12 deletions(-)
 delete mode 100644 .changeset/sour-jeans-talk.md
 delete mode 100644 .changeset/twelve-hairs-marry.md

diff --git a/.changeset/sour-jeans-talk.md b/.changeset/sour-jeans-talk.md
deleted file mode 100644
index f8108adcee93..000000000000
--- a/.changeset/sour-jeans-talk.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add `outro` option to `unmount`
diff --git a/.changeset/twelve-hairs-marry.md b/.changeset/twelve-hairs-marry.md
deleted file mode 100644
index b61ee11785c2..000000000000
--- a/.changeset/twelve-hairs-marry.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: provide loose parser mode
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 90419d34549e..cce58f7b54ef 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.13.0
+
+### Minor Changes
+
+- feat: add `outro` option to `unmount` ([#14540](https://github.com/sveltejs/svelte/pull/14540))
+
+- feat: provide loose parser mode ([#14691](https://github.com/sveltejs/svelte/pull/14691))
+
 ## 5.12.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index f38c28bce588..24fa9c91b974 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -2,7 +2,7 @@
   "name": "svelte",
   "description": "Cybernetically enhanced web apps",
   "license": "MIT",
-  "version": "5.12.0",
+  "version": "5.13.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 57a2fda759be..4b1927606a6f 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -6,5 +6,5 @@
  * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
-export const VERSION = '5.12.0';
+export const VERSION = '5.13.0';
 export const PUBLIC_VERSION = '5';